New architecture

.gitignore

@@ -1 +1,2 @@
-scripts/__pycache__/*
+scripts/__pycache__/*
+**/.DS_Store

.pages

@@ -1,6 +1,5 @@
 nav:
- - index.md
- - build
- - tutorials
- - learn
- - 'AI Resources': ai-resources.md
+- products
+- protocol
+- tools
+- ai-resources

.snippets/code/products/cctp-bridge/get-started/snippet-1.ts

@@ -0,0 +1,54 @@
+import {
+  ChainAddress,
+  ChainContext,
+  Network,
+  Signer,
+  Wormhole,
+  Chain,
+} from '@wormhole-foundation/sdk';
+import solana from '@wormhole-foundation/sdk/solana';
+import sui from '@wormhole-foundation/sdk/sui';
+import evm from '@wormhole-foundation/sdk/evm';
+
+/**
+ * Returns a signer for the given chain using locally scoped credentials.
+ * The required values (EVM_PRIVATE_KEY, SOL_PRIVATE_KEY, SUI_MNEMONIC) must
+ * be loaded securely beforehand, for example via a keystore, secrets
+ * manager, or environment variables (not recommended).
+ */
+export async function getSigner<N extends Network, C extends Chain>(
+  chain: ChainContext<N, C>
+): Promise<{
+  chain: ChainContext<N, C>;
+  signer: Signer<N, C>;
+  address: ChainAddress<C>;
+}> {
+  let signer: Signer;
+  const platform = chain.platform.utils()._platform;
+
+  switch (platform) {
+    case 'Evm':
+      signer = await (
+        await evm()
+      ).getSigner(await chain.getRpc(), EVM_PRIVATE_KEY!);
+      break;
+    case 'Solana':
+      signer = await (
+        await solana()
+      ).getSigner(await chain.getRpc(), SOL_PRIVATE_KEY!);
+      break;
+    case 'Sui':
+      signer = await (
+        await sui()
+      ).getSigner(await chain.getRpc(), SUI_MNEMONIC!);
+      break;
+    default:
+      throw new Error(`Unsupported platform: ${platform}`);
+  }
+
+  return {
+    chain,
+    signer: signer as Signer<N, C>,
+    address: Wormhole.chainAddress(chain.chain, signer.address()),
+  };
+}

.snippets/code/products/cctp-bridge/get-started/snippet-2.ts

@@ -0,0 +1,56 @@
+import { CircleTransfer, wormhole } from '@wormhole-foundation/sdk';
+import evm from '@wormhole-foundation/sdk/evm';
+import solana from '@wormhole-foundation/sdk/solana';
+import sui from '@wormhole-foundation/sdk/sui';
+import { getSigner } from './helper';
+
+(async function () {
+  // Initialize the Wormhole object for the Testnet environment and add supported chains (evm, solana and sui)
+  const wh = await wormhole('Testnet', [evm, solana, sui]);
+
+  // Grab chain Contexts -- these hold a reference to a cached rpc client
+  const sendChain = wh.getChain('Avalanche');
+  const rcvChain = wh.getChain('Sepolia');
+
+  // Get signer from local key
+  const source = await getSigner(sendChain);
+  const destination = await getSigner(rcvChain);
+
+  // Define the amount of USDC to transfer (in the smallest unit, so 0.1 USDC = 100,000 units assuming 6 decimals)
+  const amt = 100_000n;
+
+  const automatic = false;
+
+  // Create the circleTransfer transaction (USDC-only)
+  const xfer = await wh.circleTransfer(
+    amt,
+    source.address,
+    destination.address,
+    automatic
+  );
+
+  const quote = await CircleTransfer.quoteTransfer(
+    sendChain,
+    rcvChain,
+    xfer.transfer
+  );
+  console.log('Quote: ', quote);
+
+  // Step 1: Initiate the transfer on the source chain (Avalanche)
+  console.log('Starting Transfer');
+  const srcTxids = await xfer.initiateTransfer(source.signer);
+  console.log(`Started Transfer: `, srcTxids);
+
+  // Step 2: Wait for Circle Attestation (VAA)
+  const timeout = 120 * 1000; // Timeout in milliseconds (120 seconds)
+  console.log('Waiting for Attestation');
+  const attestIds = await xfer.fetchAttestation(timeout);
+  console.log(`Got Attestation: `, attestIds);
+
+  // Step 3: Complete the transfer on the destination chain (Sepolia)
+  console.log('Completing Transfer');
+  const dstTxids = await xfer.completeTransfer(destination.signer);
+  console.log(`Completed Transfer: `, dstTxids);
+
+  process.exit(0);
+})();

.snippets/code/products/cctp-bridge/get-started/snippet-3.html

@@ -0,0 +1,22 @@
+<div id="termynal" data-termynal>
+	<span data-ty="input"><span class="file-path"></span>npx tsx transfer.ts</span>
+	<span data-ty>Starting Transfer</span>
+	<span data-ty
+		>Started Transfer: 
+        [ '0xdedbf496a1e658efb15bc57f120122b38a3714a560892be7a8c0a7f23c44aca2',
+		'0x9a8e41837e225edfa62d1913f850c01bd0552e55bf082fd9225df789455a465a' ]</span
+	>
+	<span data-ty> </span>
+	<span data-ty>Waiting for Attestation</span>
+	<span data-ty>Retrying Circle:GetAttestation, attempt 0/60</span>
+	<span data-ty>Retrying Circle:GetAttestation, attempt 1/60</span>
+    <span data-ty> </span>
+	<span data-ty>Got Attestation: [{hash: '0x89f8651bf94cfd932ba5bcd2f7795a3fabc6a7c602075fa712c9c55022f5cca8'}]</span>
+    <span data-ty> </span>
+	<span data-ty>Completing Transfer</span>
+	<span data-ty
+		>Completed Transfer: 
+        [ '0x9b81bb30d2a68aa2ecc707a8a1b5af63448223a69b2ead6cf6d172ab880ad0c9']</span
+	>
+	<span data-ty="input"><span class="file-path"></span></span>
+</div>

.snippets/code/build/transfers/cctp/CircleIntegration.sol → .snippets/code/products/cctp-bridge/guides/cctp-contracts/CircleIntegration.sol

@@ -69,7 +69,7 @@ contract CircleIntegration is
 
         // Call the circle bridge and `depositForBurnWithCaller`. The `mintRecipient`
         // should be the target contract (or wallet) composing on this contract.
-        (uint64 nonce, uint256 amountReceived) = _transferTokens(
+        (uint64 nonce, uint256 amountReceived) = _transferTokens{value: wormholeFee}(
             transferParams.token,
             transferParams.amount,
             transferParams.targetChain,

.snippets/code/products/connect/configuration/get-started/App.tsx

@@ -0,0 +1,30 @@
+import './App.css';
+import WormholeConnect, {
+  WormholeConnectConfig,
+  WormholeConnectTheme,
+} from '@wormhole-foundation/wormhole-connect';
+
+function App() {
+  const config: WormholeConnectConfig = {
+    // Define the network
+    network: 'Testnet',
+
+    // Define the chains
+    chains: ['Sui', 'Avalanche'],
+
+    // UI configuration
+    ui: {
+      title: 'SUI Connect TS Demo',
+    },
+  };
+
+  const theme: WormholeConnectTheme = {
+    // Define the theme
+    mode: 'dark',
+    primary: '#78c4b6',
+  };
+
+  return <WormholeConnect config={config} theme={theme} />;
+}
+
+export default App;

.snippets/code/build/transfers/connect/overview/hosted.js → .snippets/code/products/connect/guides/hosted-version/hosted-1.js

@@ -2,5 +2,8 @@ import { wormholeConnectHosted } from '@wormhole-foundation/wormhole-connect';
 
 // Existing DOM element where you want to mount Connect
 const container = document.getElementById('bridge-container');
+if (!container) {
+  throw new Error("Element with id 'bridge-container' not found");
+}
 
 wormholeConnectHosted(container);

.snippets/code/products/connect/guides/hosted-version/hosted-2.js

@@ -0,0 +1,22 @@
+import {
+  wormholeConnectHosted,
+} from '@wormhole-foundation/wormhole-connect';
+
+// Existing DOM element where you want to mount Connect
+const container = document.getElementById('bridge-container');
+if (!container) {
+  throw new Error("Element with id 'connect' not found");
+}
+
+wormholeConnectHosted(container, {
+  config: {
+    rpcs: {
+      // ...
+    }
+  },
+  theme: {
+    background: {
+      default: '#004547',
+    }
+  }
+});

.snippets/code/products/connect/tutorials/react-dapp/snippet-1.js

@@ -0,0 +1,17 @@
+'use client';
+
+import WormholeConnect from '@wormhole-foundation/wormhole-connect';
+
+const config = {
+  network: 'Testnet',
+  chains: ['Sui', 'Avalanche'],
+};
+
+const theme = {
+  mode: 'light',
+  primary: '#78c4b6',
+};
+
+export default function Home() {
+  return <WormholeConnect config={config} theme={theme} />;
+}

.snippets/code/products/connect/tutorials/react-dapp/snippet-2.ts

@@ -0,0 +1,23 @@
+'use client';
+
+import WormholeConnect, {
+  WormholeConnectConfig,
+  WormholeConnectTheme,
+} from '@wormhole-foundation/wormhole-connect';
+
+export default function Home() {
+  const config: WormholeConnectConfig = {
+    network: 'Testnet',
+    chains: ['Sui', 'Avalanche'],
+
+    ui: {
+      title: 'SUI Connect TS Demo',
+    },
+  };
+
+  const theme: WormholeConnectTheme = {
+    mode: 'light',
+    primary: '#78c4b6',
+  };
+  return <WormholeConnect config={config} theme={theme} />;
+}