useCrossChainDeposit

​

Usage

const {
  quote,
  deposit,
  depositAsync,
  data,
  isLoading,
  isError,
  error,
  isSuccess,
  reset
} = useCrossChainDeposit();

​

quote(input)

• chain (CctpEvmChain): the source chain, from CCTP_EVM_CHAINS.
• amount (string | number): human USDC, e.g. "25".

​

depositAsync(input)

• provider (Eip1193Provider): the user’s EVM wallet, e.g. (await discoverEvmWallets())[0].provider.
• chain (CctpEvmChain): the source chain.
• amount (string | number): human USDC.
• walletAddress (string): the Chipi wallet that receives the USDC. It is the only possible recipient and is checked before signing.
• finality ("standard" | "fast", optional): standard (default) is free and waits for the source chain’s finality (15–20 minutes from an L2); fast costs Circle’s fee and takes about a minute.
• getBearerToken (() => Promise<string | null | undefined>): called at every step, since tokens expire during the wait.
• onStatus (optional): ({ step, eta, burnTxHash?, mintTxHash? }) => void. Steps: quoting, switching-chain, approving, burning, registering, attesting, minting, recording, done.
• account (optional): the EVM account to burn from; defaults to the wallet’s first account.
• pollIntervalMs (optional, default 15000) and timeoutMs (optional, default 45 minutes): how the hook follows the mint. On timeout it resolves with mintTxHash: null; the deposit still completes server-side.

​

Errors

​

Return Value

• quote: the quote function above
• deposit: fire-and-forget deposit
• depositAsync: Promise-based deposit
• data: the last result
• isLoading, isError, error, isSuccess, reset: mutation state

​

Example Implementation

import { useState } from "react";
import { useCrossChainDeposit } from "@chipi-stack/nextjs";
import { CCTP_EVM_CHAINS, discoverEvmWallets, formatCctpEta } from "@chipi-stack/backend";

const BASE = CCTP_EVM_CHAINS.find((c) => c.key === "base")!;

export function FundFromBase({ chipiWallet, getToken }: { chipiWallet: string; getToken: () => Promise<string | null> }) {
  const { depositAsync, isLoading, error } = useCrossChainDeposit();
  const [status, setStatus] = useState("");

  const fund = async () => {
    const [evmWallet] = await discoverEvmWallets();
    if (!evmWallet) return setStatus("Install an EVM wallet first");
    const result = await depositAsync({
      provider: evmWallet.provider,
      chain: BASE,
      amount: "25",
      walletAddress: chipiWallet,
      getBearerToken: getToken,
      onStatus: ({ step, eta }) => setStatus(`${step} · ${formatCctpEta(eta)}`),
    });
    setStatus(`Arrived on Starknet: ${result.mintTxHash}`);
  };

  return (
    <div>
      <button onClick={fund} disabled={isLoading}>Bring 25 USDC from Base</button>
      <p>{error ? error.message : status}</p>
    </div>
  );
}