Add CCIP Canton Docs

public/changelog.json

@@ -402,6 +402,26 @@
     }
   },
   "data": [
+    {
+      "category": "integration",
+      "date": "2026-07-14",
+      "description": "- This release continues CCIP's expansion to non-EVMs by adding support for the Canton blockchain. \n - Canton is now interoperable with Ethereum using the latest [CCIP architecture](https://docs.chain.link/ccip/concepts/canton/overview). \n - More lanes to and from Canton will be added in the future. \n - No change to any existing EVM Router addresses. \n - Canton CCIP details can be seen on the [CCIP Directory](https://docs.chain.link/ccip/directory).",
+      "newNetworks": [
+        {
+          "displayName": "Canton Mainnet",
+          "network": "canton",
+          "url": "https://docs.chain.link/ccip/directory/mainnet/chain/canton-mainnet"
+        },
+        {
+          "displayName": "Canton Testnet",
+          "network": "canton",
+          "url": "https://docs.chain.link/ccip/directory/testnet/chain/canton-testnet"
+        }
+      ],
+      "relatedNetworks": ["canton"],
+      "title": "CCIP on Canton",
+      "topic": "CCIP"
+    },
     {
       "category": "integration",
       "date": "2026-07-13",

src/components/AddressReact.tsx

@@ -42,6 +42,20 @@ const AddressComponent = ({ contractUrl, address, endLength, urlClass, urlId }:
       </button>
 
       <style>{`
+        a.addressLink {
+          color: var(--color-text-link);
+          text-decoration: none;
+        }
+
+        a.addressLink:hover {
+          color: var(--color-text-link-hover);
+          text-decoration: underline;
+        }
+
+        a.addressLink:visited {
+          color: var(--color-text-link);
+        }
+
         .addressLink {
           padding: 1px 0px;
           border-radius: var(--border-radius-10);

src/components/CCIP/Chain/Chain.astro

@@ -17,7 +17,6 @@ import ChainTokenGrid from "./ChainTokenGrid"
 import { generateChainStructuredData } from "~/utils/ccipStructuredData"
 import StructuredData from "~/components/StructuredData.astro"
 import { DOCS_BASE_URL } from "~/utils/structuredData"
-
 interface Props {
   environment: Environment
   network: Network
@@ -127,16 +126,19 @@ const chainStructuredData = generateChainStructuredData(
       <div class="ccip-heading">
         <h2>Tokens <span>({allTokens.length})</span></h2>
         {
-          network.chainType !== "solana" && network.chainType !== "aptos" && network.chainType !== "ton" && (
-            <a class="button secondary" href="/ccip/tutorials/evm/token-manager#verifying-your-token">
-              <img
-                src="/assets/icons/plus.svg"
-                alt="Add"
-                style={{ width: "1em", height: "1em", marginRight: "0.5em", verticalAlign: "middle" }}
-              />
-              Add my token
-            </a>
-          )
+          network.chainType !== "solana" &&
+            network.chainType !== "aptos" &&
+            network.chainType !== "ton" &&
+            network.chainType !== "canton" && (
+              <a class="button secondary" href="/ccip/tutorials/evm/token-manager#verifying-your-token">
+                <img
+                  src="/assets/icons/plus.svg"
+                  alt="Add"
+                  style={{ width: "1em", height: "1em", marginRight: "0.5em", verticalAlign: "middle" }}
+                />
+                Add my token
+              </a>
+            )
         }
       </div>
       <ChainTokenGrid tokens={allTokens} network={network} client:only="react" environment={environment} />

src/components/CCIP/Chain/DecommissionedChain.astro

@@ -38,7 +38,6 @@ const heroNetwork: Network = networkDetails ?? {
   key: network.chain,
   totalLanes: 0,
   totalTokens: 0,
-  routerExplorerUrl: "",
   armProxy: {
     address: "",
     version: "",

src/components/CCIP/ChainHero/ChainHero.css

@@ -158,6 +158,25 @@
     row-gap: var(--space-12x);
   }
 
+  .ccip-chain-hero__details--canton {
+    grid-template-columns: repeat(3, 1fr);
+    column-gap: var(--space-8x);
+    row-gap: var(--space-8x);
+  }
+
+  .ccip-chain-hero__details--canton .ccip-chain-hero__details__item {
+    min-width: 0;
+  }
+
+  .ccip-chain-hero__details--canton .ccip-chain-hero__details__value {
+    font-size: 14px;
+    line-height: 22px;
+  }
+
+  .ccip-chain-hero__details__item--wide {
+    grid-column: 1 / -1;
+  }
+
   .ccip-chain-hero__content {
     --gutter: var(--space-10x);
     grid-template-columns: 1fr 1fr;
@@ -170,6 +189,12 @@
 }
 
 /* Pool Programs Styles */
+.ccip-chain-hero__indexer-list {
+  display: flex;
+  flex-direction: column;
+  gap: var(--space-3x);
+}
+
 .ccip-chain-hero__pool-programs-container {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));