@b3dotfun/sdk 0.1.1-test.0 → 0.1.2-test.0

package/dist/esm/anyspend/react/components/AnySpendDeposit.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { HYPERLIQUID_CHAIN_ID } from "../../../anyspend/index.js";
-import { Skeleton, useAccountWallet, useSimBalance } from "../../../global-account/react/index.js";
+import { Skeleton, useAccountWallet, useSimBalance, useTokenData } from "../../../global-account/react/index.js";
 import { cn } from "../../../shared/utils/cn.js";
 import { NetworkArbitrumOne, NetworkBase, NetworkBinanceSmartChain, NetworkEthereum, NetworkOptimism, NetworkPolygonPos, } from "@web3icons/react";
 import { ChevronRight } from "lucide-react";
@@ -67,8 +66,8 @@ function ChainIcon({ chainId, className }) {
  * // Simple deposit with chain selection
  * <AnySpendDeposit
  *   recipientAddress={userAddress}
- *   destinationToken={myToken}
- *   destinationChainId={base.id}
+ *   destinationTokenAddress="0x..."
+ *   destinationTokenChainId={base.id}
  *   onSuccess={(amount) => console.log(`Deposited ${amount}`)}
  * />
  *
@@ -76,8 +75,8 @@ function ChainIcon({ chainId, className }) {
  * // Skip chain selection by providing sourceTokenChainId
  * <AnySpendDeposit
  *   recipientAddress={userAddress}
- *   destinationToken={myToken}
- *   destinationChainId={base.id}
+ *   destinationTokenAddress="0x..."
+ *   destinationTokenChainId={base.id}
  *   sourceTokenChainId={base.id}
  *   onSuccess={(amount) => console.log(`Deposited ${amount}`)}
  * />
@@ -86,8 +85,8 @@ function ChainIcon({ chainId, className }) {
  * // Deposit with custom contract
  * <AnySpendDeposit
  *   recipientAddress={userAddress}
- *   destinationToken={myToken}
- *   destinationChainId={base.id}
+ *   destinationTokenAddress="0x..."
+ *   destinationTokenChainId={base.id}
  *   depositContractConfig={{
  *     contractAddress: "0x...",
  *     functionName: "depositFor",
@@ -95,7 +94,7 @@ function ChainIcon({ chainId, className }) {
  *   onSuccess={(amount) => console.log(`Deposited ${amount}`)}
  * />
  */
-export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, }) {
+export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit = false, }) {
     const { connectedEOAWallet } = useAccountWallet();
     const eoaAddress = connectedEOAWallet?.getAccount()?.address;
     // Determine if we should show chain selection
@@ -103,6 +102,17 @@ export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, p
     const [step, setStep] = useState(shouldShowChainSelection ? "select-chain" : "deposit");
     const [selectedChainId, setSelectedChainId] = useState(initialSourceChainId);
     const [paymentType, setPaymentType] = useState(initialPaymentType ?? "crypto");
+    // Fetch destination token data
+    const { data: destinationTokenData } = useTokenData(destinationTokenChainId, destinationTokenAddress);
+    // Construct full destination token object
+    const destinationToken = useMemo(() => ({
+        address: destinationTokenAddress,
+        chainId: destinationTokenChainId,
+        symbol: destinationTokenData?.symbol ?? "",
+        name: destinationTokenData?.name ?? "",
+        decimals: destinationTokenData?.decimals ?? 18,
+        metadata: { logoURI: destinationTokenData?.logoURI },
+    }), [destinationTokenAddress, destinationTokenChainId, destinationTokenData]);
     // Fetch balances for EOA wallet
     const { data: balanceData, isLoading: isBalanceLoading } = useSimBalance(shouldShowChainSelection ? eoaAddress : undefined, supportedChains.map(c => c.id));
     // Group balances by chain and calculate total USD value per chain
@@ -145,7 +155,7 @@ export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, p
     }, [chainBalances]);
     if (!recipientAddress)
         return null;
-    const tokenSymbol = destinationToken.symbol ?? "TOKEN";
+    const tokenSymbol = destinationToken.symbol || "TOKEN";
     // Determine order type based on config
     const effectiveOrderType = orderType ?? (depositContractConfig ? "custom_exact_in" : "swap");
     // Default header if not provided
@@ -174,14 +184,12 @@ export function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, p
     };
     // Chain selection view
     if (step === "select-chain") {
-        return (_jsxs("div", { className: cn("anyspend-deposit anyspend-deposit-chain-selection font-inter bg-as-surface-primary relative mx-auto w-full max-w-[460px]", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: [onClose && (_jsx("button", { onClick: onClose, className: "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), !isBalanceLoading && totalBalance > 0 && (_jsxs("div", { className: "anyspend-deposit-balance border-theme-border-secondary border-b p-5", children: [_jsx("p", { className: "anyspend-deposit-balance-label text-as-secondary text-sm", children: "Your Balance" }), _jsxs("p", { className: "anyspend-deposit-balance-value text-as-primary text-3xl font-semibold", children: [formatDecimal(totalBalance), " ", _jsx("span", { className: "text-sm", children: "USD" })] })] })), _jsxs("div", { className: "anyspend-deposit-options flex flex-col gap-2 p-6", children: [isBalanceLoading && (_jsx("div", { className: "anyspend-deposit-chains-skeleton flex flex-col gap-2", children: [1, 2].map((_, i) => (_jsxs("div", { className: "border-border-primary flex items-center justify-between rounded-xl border p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Skeleton, { className: "h-6 w-6 rounded-full" }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Skeleton, { className: "h-4 w-32" }), _jsx(Skeleton, { className: "h-3 w-20" })] })] }), _jsx(Skeleton, { className: "h-5 w-5" })] }, i))) })), topChainsWithBalance.length > 0 && (_jsx("div", { className: "anyspend-deposit-chains flex flex-col gap-2", children: topChainsWithBalance.map(chain => (_jsxs("button", { onClick: () => handleSelectChain(chain.id), className: "anyspend-deposit-chain-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsx("div", { className: "anyspend-deposit-chain-content", children: _jsxs("div", { className: "anyspend-deposit-chain-info", children: [_jsxs("span", { className: "anyspend-deposit-chain-name text-as-primary flex items-center gap-1.5 font-medium", children: ["Deposit from ", chain.name, _jsx(ChainIcon, { chainId: chain.id, className: "h-5 w-5" })] }), _jsxs("p", { className: "anyspend-deposit-chain-balance text-as-secondary text-xs", children: [formatUsd(chain.balance), " available"] })] }) }), _jsx(ChevronRight, { className: "anyspend-deposit-chain-chevron text-as-secondary h-5 w-5" })] }, chain.id))) })), _jsxs("div", { className: "anyspend-deposit-general-options flex flex-col gap-2", children: [_jsxs("button", { onClick: handleSelectCrypto, className: "anyspend-deposit-option-button anyspend-deposit-crypto-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsx("div", { className: "anyspend-deposit-option-content", children: _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Deposit Crypto" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Swap from any token on any chain" })] }) }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] }), _jsxs("div", { className: "anyspend-deposit-divider flex items-center gap-3", children: [_jsx("div", { className: "bg-as-stroke h-px flex-1" }), _jsx("span", { className: "anyspend-deposit-divider-text text-as-secondary text-sm", children: "More options" }), _jsx("div", { className: "bg-as-stroke h-px flex-1" })] }), _jsxs("button", { onClick: handleSelectQrDeposit, className: "anyspend-deposit-option-button anyspend-deposit-qr-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsxs("div", { className: "anyspend-deposit-option-content flex items-center gap-3", children: [_jsx(QrCodeIcon, { className: "anyspend-deposit-option-icon h-10 w-10" }), _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Deposit with QR Code" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Send tokens directly to deposit address" })] })] }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] }), _jsxs("button", { onClick: handleSelectFiat, className: "anyspend-deposit-option-button anyspend-deposit-fiat-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left transition-all", children: [_jsxs("div", { className: "anyspend-deposit-option-content flex items-center gap-3", children: [_jsx(CreditCardIcon, { className: "anyspend-deposit-option-icon h-10 w-10" }), _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Fund with Fiat" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Pay with card or bank transfer" })] })] }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] })] }), _jsx(ChainWarningText, { chainId: destinationChainId, className: "mt-2" })] })] }));
+        return (_jsxs("div", { className: cn("anyspend-deposit anyspend-deposit-chain-selection font-inter bg-as-surface-primary relative mx-auto w-full max-w-[460px]", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: [onClose && (_jsx("button", { onClick: onClose, className: "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), !isBalanceLoading && totalBalance > 0 && (_jsxs("div", { className: "anyspend-deposit-balance border-theme-border-secondary border-b p-5", children: [_jsx("p", { className: "anyspend-deposit-balance-label text-as-secondary text-sm", children: "Your Balance" }), _jsxs("p", { className: "anyspend-deposit-balance-value text-as-primary text-3xl font-semibold", children: [formatDecimal(totalBalance), " ", _jsx("span", { className: "text-sm", children: "USD" })] })] })), _jsxs("div", { className: "anyspend-deposit-options flex flex-col gap-2 p-6", children: [isBalanceLoading && (_jsx("div", { className: "anyspend-deposit-chains-skeleton flex flex-col gap-2", children: [1, 2].map((_, i) => (_jsxs("div", { className: "border-border-primary flex items-center justify-between rounded-xl border p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(Skeleton, { className: "h-6 w-6 rounded-full" }), _jsxs("div", { className: "flex flex-col gap-1", children: [_jsx(Skeleton, { className: "h-4 w-32" }), _jsx(Skeleton, { className: "h-3 w-20" })] })] }), _jsx(Skeleton, { className: "h-5 w-5" })] }, i))) })), topChainsWithBalance.length > 0 && (_jsx("div", { className: "anyspend-deposit-chains flex flex-col gap-2", children: topChainsWithBalance.map(chain => (_jsxs("button", { onClick: () => handleSelectChain(chain.id), className: "anyspend-deposit-chain-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsx("div", { className: "anyspend-deposit-chain-content", children: _jsxs("div", { className: "anyspend-deposit-chain-info", children: [_jsxs("span", { className: "anyspend-deposit-chain-name text-as-primary flex items-center gap-1.5 font-medium", children: ["Deposit from ", chain.name, _jsx(ChainIcon, { chainId: chain.id, className: "h-5 w-5" })] }), _jsxs("p", { className: "anyspend-deposit-chain-balance text-as-secondary text-xs", children: [formatUsd(chain.balance), " available"] })] }) }), _jsx(ChevronRight, { className: "anyspend-deposit-chain-chevron text-as-secondary h-5 w-5" })] }, chain.id))) })), _jsxs("div", { className: "anyspend-deposit-general-options flex flex-col gap-2", children: [_jsxs("button", { onClick: handleSelectCrypto, className: "anyspend-deposit-option-button anyspend-deposit-crypto-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsx("div", { className: "anyspend-deposit-option-content", children: _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Deposit Crypto" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Swap from any token on any chain" })] }) }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] }), _jsxs("div", { className: "anyspend-deposit-divider flex items-center gap-3", children: [_jsx("div", { className: "bg-as-stroke h-px flex-1" }), _jsx("span", { className: "anyspend-deposit-divider-text text-as-secondary text-sm", children: "More options" }), _jsx("div", { className: "bg-as-stroke h-px flex-1" })] }), _jsxs("button", { onClick: handleSelectQrDeposit, className: "anyspend-deposit-option-button anyspend-deposit-qr-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left shadow-sm transition-all", children: [_jsxs("div", { className: "anyspend-deposit-option-content flex items-center gap-3", children: [_jsx(QrCodeIcon, { className: "anyspend-deposit-option-icon h-10 w-10" }), _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Deposit with QR Code" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Send tokens directly to deposit address" })] })] }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] }), _jsxs("button", { onClick: handleSelectFiat, className: "anyspend-deposit-option-button anyspend-deposit-fiat-button border-border-primary hover:border-as-brand hover:bg-as-surface-secondary flex w-full items-center justify-between rounded-xl border p-4 text-left transition-all", children: [_jsxs("div", { className: "anyspend-deposit-option-content flex items-center gap-3", children: [_jsx(CreditCardIcon, { className: "anyspend-deposit-option-icon h-10 w-10" }), _jsxs("div", { className: "anyspend-deposit-option-info", children: [_jsx("span", { className: "anyspend-deposit-option-title text-as-primary font-medium", children: "Fund with Fiat" }), _jsx("p", { className: "anyspend-deposit-option-description text-as-secondary text-xs", children: "Pay with card or bank transfer" })] })] }), _jsx(ChevronRight, { className: "anyspend-deposit-option-chevron text-as-secondary h-5 w-5" })] })] }), _jsx(ChainWarningText, { chainId: destinationTokenChainId, className: "mt-2" })] })] }));
     }
     // QR Deposit view
     if (step === "qr-deposit") {
-        return (_jsx(QRDeposit, { mode: mode, recipientAddress: recipientAddress, destinationToken: destinationToken, destinationChainId: destinationChainId, depositContractConfig: depositContractConfig, onBack: handleBack, onClose: onClose ?? handleBack }));
+        return (_jsx(QRDeposit, { mode: mode, recipientAddress: recipientAddress, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, depositContractConfig: depositContractConfig, onBack: handleBack, onClose: onClose ?? handleBack }));
     }
-    // Check if destination is Hyperliquid
-    const isHyperliquidDeposit = destinationChainId === HYPERLIQUID_CHAIN_ID;
     // Deposit view
-    return (_jsxs("div", { className: "anyspend-deposit anyspend-deposit-form relative", children: [shouldShowChainSelection && (_jsxs("button", { onClick: handleBack, className: "anyspend-deposit-back-button text-as-secondary hover:text-as-primary absolute left-4 top-4 z-10 flex items-center gap-1", children: [_jsx("svg", { className: "anyspend-deposit-back-icon h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), _jsx("span", { className: "anyspend-deposit-back-text text-sm", children: "Back" })] })), onClose && (_jsx("button", { onClick: onClose, className: "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), _jsx("div", { className: cn("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isHyperliquidDeposit ? (_jsx(AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationToken.address, destinationTokenChainId: destinationChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel }, selectedChainId)) : (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel }, selectedChainId)) }), _jsx(ChainWarningText, { chainId: destinationChainId, className: "px-4 pb-4" })] }));
+    return (_jsxs("div", { className: "anyspend-deposit anyspend-deposit-form relative", children: [shouldShowChainSelection && (_jsxs("button", { onClick: handleBack, className: "anyspend-deposit-back-button text-as-secondary hover:text-as-primary absolute left-4 top-4 z-10 flex items-center gap-1", children: [_jsx("svg", { className: "anyspend-deposit-back-icon h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), _jsx("span", { className: "anyspend-deposit-back-text text-sm", children: "Back" })] })), onClose && (_jsx("button", { onClick: onClose, className: "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: _jsx("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), _jsx("div", { className: cn("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? (_jsx(AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel }, selectedChainId)) : (_jsx(AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel }, selectedChainId)) }), _jsx(ChainWarningText, { chainId: destinationTokenChainId, className: "px-4 pb-4" })] }));
 }

package/dist/esm/anyspend/react/components/QRDeposit.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ALL_CHAINS, getAvailableChainIds } from "../../../anyspend/index.js";
+import { ALL_CHAINS, getAvailableChainIds, isSameChainAndToken } from "../../../anyspend/index.js";
 import { Button, toast } from "../../../global-account/react/index.js";
 import { cn } from "../../../shared/utils/cn.js";
 import { TokenSelector } from "@relayprotocol/relay-kit-ui";
@@ -8,8 +8,10 @@ import { QRCodeSVG } from "qrcode.react";
 import { useEffect, useRef, useState } from "react";
 import { useAnyspendOrderAndTransactions } from "../hooks/useAnyspendOrderAndTransactions.js";
 import { useCreateDepositFirstOrder } from "../hooks/useCreateDepositFirstOrder.js";
+import { useWatchTransfer } from "../hooks/useWatchTransfer.js";
 import { ChainTokenIcon } from "./common/ChainTokenIcon.js";
 import { OrderDetails } from "./common/OrderDetails.js";
+import { TransferResultScreen } from "./common/TransferResultScreen.js";
 import { ChainWarningText, WarningText } from "./common/WarningText.js";
 // Default source token: ETH on Base
 const DEFAULT_ETH_ON_BASE = {
@@ -42,9 +44,24 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
     const [globalAddress, setGlobalAddress] = useState();
     const orderCreatedRef = useRef(false);
     const onSuccessCalled = useRef(false);
+    const [transferResult, setTransferResult] = useState(null);
     // Source token/chain as state (can be changed by user)
     const [sourceChainId, setSourceChainId] = useState(sourceChainIdProp ?? 8453);
     const [sourceToken, setSourceToken] = useState(sourceTokenProp ?? DEFAULT_ETH_ON_BASE);
+    // Check if this is a pure transfer (same chain and token)
+    const isPureTransfer = isSameChainAndToken(sourceChainId, sourceToken.address, destinationChainId, destinationToken.address);
+    // Watch for pure transfers (same chain and token)
+    const { isWatching: isWatchingTransfer } = useWatchTransfer({
+        address: recipientAddress,
+        chainId: sourceChainId,
+        tokenAddress: sourceToken.address,
+        tokenDecimals: sourceToken.decimals,
+        enabled: isPureTransfer && !transferResult,
+        onTransferDetected: result => {
+            setTransferResult(result);
+            onSuccess?.();
+        },
+    });
     // Handle token selection from TokenSelector
     const handleTokenSelect = (newToken) => {
         const token = {
@@ -59,6 +76,7 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
         setOrderId(undefined);
         setGlobalAddress(undefined);
         orderCreatedRef.current = false;
+        setTransferResult(null);
         // Update token and chain
         setSourceChainId(newToken.chainId);
         setSourceToken(token);
@@ -79,10 +97,12 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
     });
     // Fetch order status
     const { orderAndTransactions: oat } = useAnyspendOrderAndTransactions(orderId);
-    // Create order on mount
+    // Create order on mount (skip for pure transfers)
     useEffect(() => {
         if (orderCreatedRef.current)
             return;
+        if (isPureTransfer)
+            return; // Skip order creation for pure transfers
         orderCreatedRef.current = true;
         createOrder({
             recipientAddress,
@@ -102,6 +122,7 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
         creatorAddress,
         depositContractConfig,
         createOrder,
+        isPureTransfer,
     ]);
     // Call onSuccess when order is executed
     useEffect(() => {
@@ -115,7 +136,8 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
     useEffect(() => {
         onSuccessCalled.current = false;
     }, [orderId]);
-    const displayAddress = globalAddress || recipientAddress;
+    // For pure transfers, always use recipient address; for orders, use global address
+    const displayAddress = isPureTransfer ? recipientAddress : globalAddress || recipientAddress;
     const handleCopyAddress = async () => {
         if (displayAddress) {
             await navigator.clipboard.writeText(displayAddress);
@@ -131,13 +153,17 @@ export function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourc
         setCopied(false);
         onClose?.();
     };
+    // Show transfer result screen for completed pure transfers
+    if (isPureTransfer && transferResult) {
+        return (_jsx(TransferResultScreen, { mode: mode, transferResult: transferResult, token: sourceToken, chainId: sourceChainId, recipientAddress: recipientAddress, onBack: onBack, onClose: onClose }));
+    }
     // Show order details if order has deposits or is being processed
     if (oat?.data && oat.data.depositTxs && oat.data.depositTxs.length > 0) {
         return (_jsx("div", { className: cn("anyspend-container anyspend-qr-order-details font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsx("div", { className: "anyspend-qr-order-details-content relative flex flex-col gap-4", children: _jsx(OrderDetails, { mode: mode, order: oat.data.order, depositTxs: oat.data.depositTxs, relayTxs: oat.data.relayTxs, executeTx: oat.data.executeTx, refundTxs: oat.data.refundTxs, onBack: handleBack }) }) }));
     }
-    // Show loading state while creating order (but not if we already have an orderId)
-    if (isCreatingOrder && !orderId) {
+    // Show loading state while creating order (but not if we already have an orderId or for pure transfers)
+    if (isCreatingOrder && !orderId && !isPureTransfer) {
         return (_jsx("div", { className: cn("anyspend-container anyspend-qr-loading font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsxs("div", { className: "anyspend-qr-loading-content flex flex-col items-center justify-center gap-4 py-12", children: [_jsx(Loader2, { className: "anyspend-qr-loading-spinner text-as-brand h-8 w-8 animate-spin" }), _jsx("p", { className: "anyspend-qr-loading-text text-as-secondary text-sm", children: "Creating deposit order..." })] }) }));
     }
-    return (_jsx("div", { className: cn("anyspend-container anyspend-qr-deposit font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsxs("div", { className: "anyspend-qr-deposit-content flex flex-col gap-4", children: [_jsxs("div", { className: "anyspend-qr-header flex items-center justify-between", children: [_jsx("button", { onClick: handleBack, className: "anyspend-qr-back-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), _jsx("h2", { className: "anyspend-qr-title text-as-primary text-base font-semibold", children: "Deposit" }), onClose ? (_jsx("button", { onClick: handleClose, className: "anyspend-qr-close-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })) : (_jsx("div", { className: "w-5" }))] }), _jsxs("div", { className: "anyspend-qr-token-selector flex flex-col gap-1.5", children: [_jsx("label", { className: "anyspend-qr-token-label text-as-secondary text-sm", children: "Send" }), _jsx(TokenSelector, { chainIdsFilter: getAvailableChainIds("from"), context: "from", fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: getAvailableChainIds("from"), multiWalletSupportEnabled: true, onAnalyticEvent: undefined, setToken: handleTokenSelect, supportedWalletVMs: ["evm"], token: undefined, trigger: _jsxs(Button, { variant: "outline", role: "combobox", className: "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : (_jsx("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), _jsxs("div", { className: "flex flex-col items-start gap-0", children: [_jsx("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), _jsx("div", { className: "text-as-primary/70 text-xs", children: ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), _jsxs("div", { className: "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [_jsxs("div", { className: "anyspend-qr-code-container flex flex-col items-center gap-2", children: [_jsx("div", { className: "anyspend-qr-code rounded-lg bg-white p-2", children: _jsx(QRCodeSVG, { value: displayAddress, size: 120, level: "M", marginSize: 0 }) }), _jsxs("span", { className: "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", _jsx("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), _jsxs("div", { className: "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [_jsx("span", { className: "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), _jsxs("div", { className: "anyspend-qr-address-row flex items-start gap-1", children: [_jsx("span", { className: "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), _jsx("button", { onClick: handleCopyAddress, className: "anyspend-qr-copy-icon text-as-secondary hover:text-as-primary mt-0.5 shrink-0", children: copied ? _jsx(Check, { className: "h-4 w-4" }) : _jsx(Copy, { className: "h-4 w-4" }) })] })] })] }), _jsx(ChainWarningText, { chainId: destinationChainId }), _jsxs(WarningText, { children: ["Only send ", sourceToken.symbol, " on ", ALL_CHAINS[sourceChainId]?.name ?? "the specified chain", ". Other tokens will not be converted."] }), _jsx("button", { onClick: handleCopyAddress, className: "anyspend-qr-copy-button flex w-full items-center justify-center gap-2 rounded-xl bg-blue-500 py-3.5 font-medium text-white transition-all hover:bg-blue-600", children: "Copy deposit address" })] }) }));
+    return (_jsx("div", { className: cn("anyspend-container anyspend-qr-deposit font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsxs("div", { className: "anyspend-qr-deposit-content flex flex-col gap-4", children: [_jsxs("div", { className: "anyspend-qr-header flex items-center justify-between", children: [_jsx("button", { onClick: handleBack, className: "anyspend-qr-back-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), _jsx("h2", { className: "anyspend-qr-title text-as-primary text-base font-semibold", children: "Deposit" }), onClose ? (_jsx("button", { onClick: handleClose, className: "anyspend-qr-close-button text-as-secondary hover:text-as-primary", children: _jsx("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })) : (_jsx("div", { className: "w-5" }))] }), _jsxs("div", { className: "anyspend-qr-token-selector flex flex-col gap-1.5", children: [_jsx("label", { className: "anyspend-qr-token-label text-as-secondary text-sm", children: "Send" }), _jsx(TokenSelector, { chainIdsFilter: getAvailableChainIds("from"), context: "from", fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: getAvailableChainIds("from"), multiWalletSupportEnabled: true, onAnalyticEvent: undefined, setToken: handleTokenSelect, supportedWalletVMs: ["evm"], token: undefined, trigger: _jsxs(Button, { variant: "outline", role: "combobox", className: "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [_jsxs("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : (_jsx("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), _jsxs("div", { className: "flex flex-col items-start gap-0", children: [_jsx("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), _jsx("div", { className: "text-as-primary/70 text-xs", children: ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), _jsxs("div", { className: "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [_jsxs("div", { className: "anyspend-qr-code-container flex flex-col items-center gap-2", children: [_jsx("div", { className: "anyspend-qr-code rounded-lg bg-white p-2", children: _jsx(QRCodeSVG, { value: displayAddress, size: 120, level: "M", marginSize: 0 }) }), _jsxs("span", { className: "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", _jsx("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), _jsxs("div", { className: "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [_jsx("span", { className: "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), _jsxs("div", { className: "anyspend-qr-address-row flex items-start gap-1", children: [_jsx("span", { className: "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), _jsx("button", { onClick: handleCopyAddress, className: "anyspend-qr-copy-icon text-as-secondary hover:text-as-primary mt-0.5 shrink-0", children: copied ? _jsx(Check, { className: "h-4 w-4" }) : _jsx(Copy, { className: "h-4 w-4" }) })] })] })] }), _jsx(ChainWarningText, { chainId: destinationChainId }), _jsxs(WarningText, { children: ["Only send ", sourceToken.symbol, " on ", ALL_CHAINS[sourceChainId]?.name ?? "the specified chain", ". Other tokens will not be converted."] }), isPureTransfer && isWatchingTransfer && (_jsxs("div", { className: "anyspend-qr-watching flex items-center justify-center gap-2 rounded-lg bg-blue-500/10 p-3", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin text-blue-500" }), _jsx("span", { className: "text-sm text-blue-500", children: "Watching for incoming transfer..." })] })), _jsx("button", { onClick: handleCopyAddress, className: "anyspend-qr-copy-button flex w-full items-center justify-center gap-2 rounded-xl bg-blue-500 py-3.5 font-medium text-white transition-all hover:bg-blue-600", children: "Copy deposit address" })] }) }));
 }

package/dist/esm/anyspend/react/components/common/CryptoPaymentMethod.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { toast, useAccountWallet, WalletImage } from "../../../../global-account/react/index.js";
+import { toast, useAccountWallet, useModalStore, WalletImage } from "../../../../global-account/react/index.js";
 import { cn } from "../../../../shared/utils/cn.js";
 import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
 import { client } from "../../../../shared/utils/thirdweb.js";
@@ -29,12 +29,16 @@ export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentM
     const globalAddress = connectedSmartWallet?.getAccount()?.address;
     // Use custom hook to determine wallet display logic
     const { shouldShowConnectedEOA } = useConnectedWalletDisplay(selectedPaymentMethod);
+    // Get modal store to block parent modal closing while connect modal is open
+    const setClosable = useModalStore(state => state.setClosable);
     // Handle wallet connection using thirdweb modal
     const handleConnectWallet = async () => {
+        // Block parent B3 modal from closing while thirdweb connect modal is open
+        setClosable(false);
         try {
             // Disconnect current wallet before connecting a new one
             if (connectedEOAWallet) {
-                await disconnect(connectedEOAWallet);
+                disconnect(connectedEOAWallet);
             }
             const wallet = await openConnectModal({
                 client,
@@ -44,7 +48,6 @@ export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentM
                 wallets: recommendWallets,
             });
             if (wallet) {
-                // setActiveWallet(wallet);
                 setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                 onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                 toast.success("Wallet connected");
@@ -64,6 +67,10 @@ export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentM
                 }
             }
         }
+        finally {
+            // Always re-enable parent modal closing when connect modal closes
+            setClosable(true);
+        }
     };
     return (_jsx("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full px-5 pb-5 pt-5 sm:px-0 sm:pt-5", children: _jsxs("div", { className: cn("relative flex flex-col gap-10"), children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsx("div", { className: "flex items-center justify-around gap-4", children: _jsx("div", { className: "flex-1 text-center", children: _jsx("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), process.env.NODE_ENV === "development" && (_jsxs("div", { className: "rounded-lg border border-yellow-500/50 bg-yellow-50 p-3 dark:bg-yellow-950/20", children: [_jsx("p", { className: "mb-2 text-xs font-semibold text-yellow-800 dark:text-yellow-300", children: "\uD83E\uDDEA Toast Test (Dev Only)" }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx("button", { onClick: () => toast.success("Success! Transaction completed"), className: "rounded bg-green-600 px-2 py-1 text-xs font-medium text-white hover:bg-green-700", children: "Success" }), _jsx("button", { onClick: () => toast.error("Error! Transaction failed"), className: "rounded bg-red-600 px-2 py-1 text-xs font-medium text-white hover:bg-red-700", children: "Error" }), _jsx("button", { onClick: () => toast.info("Info: Processing your request..."), className: "rounded bg-blue-600 px-2 py-1 text-xs font-medium text-white hover:bg-blue-700", children: "Info" }), _jsx("button", { onClick: () => toast.warning("Warning: Low balance detected"), className: "rounded bg-yellow-600 px-2 py-1 text-xs font-medium text-white hover:bg-yellow-700", children: "Warning" }), _jsx("button", { onClick: () => {
                                         toast.success("Multiple test 1");

package/dist/esm/anyspend/react/components/common/OrderDetails.js

@@ -1,7 +1,7 @@
 "use client";
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { ALL_CHAINS, getChainName, getErrorDisplay, getExplorerTxUrl, getPaymentUrl, getStatusDisplay, isNativeToken, RELAY_SOLANA_MAINNET_CHAIN_ID, ZERO_ADDRESS, } from "../../../../anyspend/index.js";
-import { Badge, Button, CopyToClipboard, ShinyButton, Skeleton, TextLoop, TextShimmer, useAccountWallet, useB3, useModalStore, useProfile, useUnifiedChainSwitchAndExecute, } from "../../../../global-account/react/index.js";
+import { Badge, Button, CopyToClipboard, ShinyButton, Skeleton, TextLoop, TextShimmer, useAccountWallet, useB3Config, useModalStore, useProfile, useUnifiedChainSwitchAndExecute, } from "../../../../global-account/react/index.js";
 import { useRouter, useSearchParams } from "../../../../shared/react/hooks/index.js";
 import { cn } from "../../../../shared/utils/index.js";
 import centerTruncate from "../../../../shared/utils/centerTruncate.js";
@@ -135,7 +135,7 @@ export const OrderDetails = memo(function OrderDetails({ mode = "modal", order,
     const router = useRouter();
     const searchParams = useSearchParams();
     // Get theme from B3Provider context
-    const { theme } = useB3();
+    const { theme } = useB3Config();
     const colorMode = theme || "light";
     // Read crypto payment method from URL parameters
     const cryptoPaymentMethodFromUrl = searchParams.get("cryptoPaymentMethod");

package/dist/esm/anyspend/react/components/common/PaymentStripeWeb2.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { OrderDetailsCollapsible, useStripeClientSecret } from "../../../../anyspend/react/index.js";
-import { ShinyButton, useB3, useModalStore, useProfile } from "../../../../global-account/react/index.js";
+import { ShinyButton, useB3Config, useModalStore, useProfile } from "../../../../global-account/react/index.js";
 import { formatTokenAmount } from "../../../../shared/utils/number.js";
 import { formatStripeAmount, getStripePromise } from "../../../../shared/utils/payment.utils.js";
 import { AddressElement, Elements, PaymentElement, useElements, useStripe } from "@stripe/react-stripe-js";
@@ -10,7 +10,7 @@ import { AnySpendFingerprintWrapper, getFingerprintConfig } from "../AnySpendFin
 import HowItWorks from "./HowItWorks.js";
 import PaymentMethodIcons from "./PaymentMethodIcons.js";
 export default function PaymentStripeWeb2({ order, stripePaymentIntentId, onPaymentSuccess }) {
-    const { theme, stripePublishableKey } = useB3();
+    const { theme, stripePublishableKey } = useB3Config();
     const fingerprintConfig = getFingerprintConfig();
     const { clientSecret, isLoadingStripeClientSecret, stripeClientSecretError } = useStripeClientSecret(stripePaymentIntentId);
     if (isLoadingStripeClientSecret) {

package/dist/esm/anyspend/react/components/common/TransferResultScreen.d.ts

@@ -0,0 +1,22 @@
+import { components } from "../../../../anyspend/types/api";
+import { TransferResult } from "../../hooks/useWatchTransfer";
+export interface TransferResultScreenProps {
+    mode?: "modal" | "page";
+    /** The transfer result containing amount info */
+    transferResult: TransferResult;
+    /** The token that was transferred */
+    token: components["schemas"]["Token"];
+    /** The chain ID where the transfer happened */
+    chainId: number;
+    /** The recipient address */
+    recipientAddress: string;
+    /** Callback when back/close button is clicked */
+    onBack?: () => void;
+    /** Callback when close button is clicked */
+    onClose?: () => void;
+}
+/**
+ * A component for displaying the result of a pure transfer (same chain, same token).
+ * Shows the transferred amount with success styling.
+ */
+export declare function TransferResultScreen({ mode, transferResult, token, chainId, recipientAddress, onBack, onClose, }: TransferResultScreenProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/anyspend/react/components/common/TransferResultScreen.js

@@ -0,0 +1,22 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { ALL_CHAINS } from "../../../../anyspend/index.js";
+import { cn } from "../../../../shared/utils/cn.js";
+import { CheckCircle2, Home } from "lucide-react";
+import { ChainTokenIcon } from "./ChainTokenIcon.js";
+/**
+ * A component for displaying the result of a pure transfer (same chain, same token).
+ * Shows the transferred amount with success styling.
+ */
+export function TransferResultScreen({ mode = "modal", transferResult, token, chainId, recipientAddress, onBack, onClose, }) {
+    const chain = ALL_CHAINS[chainId];
+    const handleClose = () => {
+        if (onClose) {
+            onClose();
+        }
+        else if (onBack) {
+            onBack();
+        }
+    };
+    return (_jsx("div", { className: cn("anyspend-container anyspend-transfer-result font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: _jsxs("div", { className: "anyspend-transfer-result-content flex flex-col items-center gap-6", children: [_jsx("div", { className: "anyspend-transfer-success-icon bg-as-success-secondary flex h-16 w-16 items-center justify-center rounded-full", children: _jsx(CheckCircle2, { className: "text-as-content-icon-success h-10 w-10" }) }), _jsxs("div", { className: "anyspend-transfer-success-message flex flex-col items-center gap-2", children: [_jsx("h2", { className: "text-as-primary text-xl font-semibold", children: "Transfer Received!" }), _jsx("p", { className: "text-as-secondary text-center text-sm", children: "Your transfer has been successfully received." })] }), _jsx("div", { className: "anyspend-transfer-amount border-as-border-secondary bg-as-surface-secondary flex w-full flex-col items-center gap-3 rounded-xl border p-4", children: _jsxs("div", { className: "flex items-center gap-3", children: [_jsx(ChainTokenIcon, { chainUrl: chain?.logoUrl, tokenUrl: token.metadata?.logoURI, className: "h-10 min-h-10 w-10 min-w-10" }), _jsxs("div", { className: "flex flex-col", children: [_jsxs("span", { className: "text-as-primary text-2xl font-bold", children: [transferResult.formattedAmount, " ", token.symbol] }), _jsxs("span", { className: "text-as-secondary text-sm", children: ["on ", chain?.name ?? "Unknown Chain"] })] })] }) }), _jsxs("div", { className: "anyspend-transfer-recipient flex w-full flex-col gap-1", children: [_jsx("span", { className: "text-as-secondary text-xs", children: "Received at" }), _jsx("span", { className: "text-as-primary break-all font-mono text-sm", children: recipientAddress })] }), _jsx("button", { onClick: handleClose, className: "anyspend-transfer-close-button bg-as-brand flex w-full items-center justify-center gap-2 rounded-xl py-3.5 font-medium text-white transition-all hover:opacity-90", children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }) }));
+}

package/dist/esm/anyspend/react/hooks/index.d.ts

@@ -15,3 +15,4 @@ export * from "./useRecipientAddressState";
 export * from "./useSigMint";
 export * from "./useStripeClientSecret";
 export * from "./useStripeSupport";
+export * from "./useWatchTransfer";

package/dist/esm/anyspend/react/hooks/index.js

@@ -15,3 +15,4 @@ export * from "./useRecipientAddressState.js";
 export * from "./useSigMint.js";
 export * from "./useStripeClientSecret.js";
 export * from "./useStripeSupport.js";
+export * from "./useWatchTransfer.js";

package/dist/esm/anyspend/react/hooks/useAnyspendCreateOnrampOrder.js

@@ -1,7 +1,7 @@
 import { USDC_BASE } from "../../../anyspend/constants/index.js";
 import { anyspendService } from "../../../anyspend/services/anyspend.js";
 import { buildMetadata, buildPayload, normalizeAddress } from "../../../anyspend/utils/index.js";
-import { useB3 } from "../../../global-account/react/index.js";
+import { useB3Config } from "../../../global-account/react/index.js";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -14,7 +14,7 @@ import { useValidatedClientReferenceId } from "./useValidatedClientReferenceId.j
  */
 export function useAnyspendCreateOnrampOrder({ onSuccess, onError } = {}) {
     // Get B3 context values
-    const { partnerId } = useB3();
+    const { partnerId } = useB3Config();
     // Get validated client reference ID from B3 context
     const createValidatedClientReferenceId = useValidatedClientReferenceId();
     // Get fingerprint data

package/dist/esm/anyspend/react/hooks/useAnyspendCreateOrder.js

@@ -1,6 +1,6 @@
 import { anyspendService } from "../../../anyspend/services/anyspend.js";
 import { buildMetadata, buildPayload, normalizeAddress } from "../../../anyspend/utils/index.js";
-import { useB3 } from "../../../global-account/react/index.js";
+import { useB3Config } from "../../../global-account/react/index.js";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -12,7 +12,7 @@ import { useValidatedClientReferenceId } from "./useValidatedClientReferenceId.j
  */
 export function useAnyspendCreateOrder({ onSuccess, onError } = {}) {
     // Get B3 context values
-    const { partnerId } = useB3();
+    const { partnerId } = useB3Config();
     // Get validated client reference ID from B3 context
     const createValidatedClientReferenceId = useValidatedClientReferenceId();
     // Get fingerprint data

package/dist/esm/anyspend/react/hooks/useCreateDepositFirstOrder.js

@@ -1,6 +1,6 @@
 import { anyspendService } from "../../../anyspend/services/anyspend.js";
 import { normalizeAddress } from "../../../anyspend/utils/index.js";
-import { useB3 } from "../../../global-account/react/index.js";
+import { useB3Config } from "../../../global-account/react/index.js";
 import { useVisitorData } from "@fingerprintjs/fingerprintjs-pro-react";
 import { useMutation } from "@tanstack/react-query";
 import { useMemo } from "react";
@@ -9,7 +9,7 @@ import { useMemo } from "react";
  * This order type doesn't require srcAmount - the user deposits tokens after the order is created.
  */
 export function useCreateDepositFirstOrder({ onSuccess, onError } = {}) {
-    const { partnerId } = useB3();
+    const { partnerId } = useB3Config();
     const { data: fpData } = useVisitorData({ extendedResult: true }, { immediate: true });
     const visitorData = fpData && {
         requestId: fpData.requestId,

package/dist/esm/anyspend/react/hooks/useValidatedClientReferenceId.js

@@ -1,12 +1,12 @@
 import { Validators } from "../../../anyspend/utils/validation.js";
-import { useB3 } from "../../../global-account/react/index.js";
+import { useB3Config } from "../../../global-account/react/index.js";
 import { useCallback } from "react";
 /**
  * Hook that provides a validated client reference ID
  * Gets the createClientReferenceId function from B3 context and validates the result
  */
 export function useValidatedClientReferenceId() {
-    const { createClientReferenceId } = useB3();
+    const { createClientReferenceId } = useB3Config();
     const createValidatedClientReferenceId = useCallback(async (params) => {
         // If no function provided, return undefined
         if (!createClientReferenceId) {

package/dist/esm/anyspend/react/hooks/useWatchTransfer.d.ts

@@ -0,0 +1,41 @@
+export interface TransferResult {
+    amount: string;
+    formattedAmount: string;
+    txHash?: string;
+    timestamp: number;
+}
+export interface UseWatchTransferProps {
+    /** Address to watch for incoming transfers */
+    address: string;
+    /** Chain ID to watch on */
+    chainId: number;
+    /** Token address (use zero address for native token) */
+    tokenAddress: string;
+    /** Token decimals */
+    tokenDecimals: number;
+    /** Whether watching is enabled */
+    enabled?: boolean;
+    /** Callback when a transfer is detected */
+    onTransferDetected?: (result: TransferResult) => void;
+}
+/**
+ * Hook to watch for incoming transfers to an address by monitoring balance changes.
+ * When a transfer is detected (balance increases), it captures the amount and notifies.
+ */
+export declare function useWatchTransfer({ address, chainId, tokenAddress, tokenDecimals, enabled, onTransferDetected, }: UseWatchTransferProps): {
+    /** Whether currently watching for transfers */
+    isWatching: boolean;
+    /** The detected transfer result, if any */
+    transferResult: TransferResult | null;
+    /** Whether a transfer has been detected */
+    hasTransfer: boolean;
+    /** Reset and start watching again */
+    reset: () => void;
+    /** Manually refetch balance */
+    refetchBalance: (options?: import("@tanstack/query-core").RefetchOptions) => Promise<import("@tanstack/query-core").QueryObserverResult<{
+        decimals: number;
+        formatted: string;
+        symbol: string;
+        value: bigint;
+    }, import("viem").GetBalanceErrorType>>;
+};

package/dist/esm/anyspend/react/hooks/useWatchTransfer.js

@@ -0,0 +1,72 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { formatUnits } from "viem";
+import { useBalance } from "wagmi";
+import { isNativeToken } from "../../utils/index.js";
+/**
+ * Hook to watch for incoming transfers to an address by monitoring balance changes.
+ * When a transfer is detected (balance increases), it captures the amount and notifies.
+ */
+export function useWatchTransfer({ address, chainId, tokenAddress, tokenDecimals, enabled = true, onTransferDetected, }) {
+    const [transferResult, setTransferResult] = useState(null);
+    const [isWatching, setIsWatching] = useState(false);
+    const initialBalanceRef = useRef(null);
+    const transferDetectedRef = useRef(false);
+    const isNative = isNativeToken(tokenAddress);
+    // Get current balance
+    const { data: balanceData, refetch: refetchBalance } = useBalance({
+        address: address,
+        chainId,
+        token: isNative ? undefined : tokenAddress,
+        query: {
+            enabled: enabled && !!address,
+            refetchInterval: 3000,
+        },
+    });
+    // Initialize or update the initial balance
+    useEffect(() => {
+        if (balanceData && initialBalanceRef.current === null && enabled) {
+            initialBalanceRef.current = balanceData.value;
+            setIsWatching(true);
+        }
+    }, [balanceData, enabled]);
+    // Check for balance increase (transfer detected)
+    useEffect(() => {
+        if (!enabled || transferDetectedRef.current || initialBalanceRef.current === null || !balanceData) {
+            return;
+        }
+        const currentBalance = balanceData.value;
+        const initialBalance = initialBalanceRef.current;
+        if (currentBalance > initialBalance) {
+            const transferAmount = currentBalance - initialBalance;
+            const formattedAmount = formatUnits(transferAmount, tokenDecimals);
+            const result = {
+                amount: transferAmount.toString(),
+                formattedAmount,
+                timestamp: Date.now(),
+            };
+            transferDetectedRef.current = true;
+            setTransferResult(result);
+            setIsWatching(false);
+            onTransferDetected?.(result);
+        }
+    }, [balanceData, enabled, tokenDecimals, onTransferDetected]);
+    // Reset function to start watching again
+    const reset = useCallback(() => {
+        transferDetectedRef.current = false;
+        initialBalanceRef.current = null;
+        setTransferResult(null);
+        setIsWatching(false);
+    }, []);
+    return useMemo(() => ({
+        /** Whether currently watching for transfers */
+        isWatching,
+        /** The detected transfer result, if any */
+        transferResult,
+        /** Whether a transfer has been detected */
+        hasTransfer: transferResult !== null,
+        /** Reset and start watching again */
+        reset,
+        /** Manually refetch balance */
+        refetchBalance,
+    }), [isWatching, transferResult, reset, refetchBalance]);
+}

package/dist/esm/anyspend/utils/address.d.ts

@@ -13,3 +13,8 @@ export declare function isEvmOrSolanaAddress(address: string): boolean;
 export declare function isHyperliquidUSDC(chainId: number, address: string): boolean;
 export declare function normalizeAddress(address: string): string;
 export declare function eqci(a: string | null | undefined, b: string | null | undefined): boolean;
+/**
+ * Check if source and destination represent the same token on the same chain.
+ * When true, this is a pure transfer (no swap/bridge needed).
+ */
+export declare function isSameChainAndToken(sourceChainId: number, sourceTokenAddress: string, destinationChainId: number, destinationTokenAddress: string): boolean;

package/dist/esm/anyspend/utils/address.js

@@ -35,3 +35,10 @@ export function eqci(a, b) {
         return false;
     return a.toLowerCase() === b.toLowerCase();
 }
+/**
+ * Check if source and destination represent the same token on the same chain.
+ * When true, this is a pure transfer (no swap/bridge needed).
+ */
+export function isSameChainAndToken(sourceChainId, sourceTokenAddress, destinationChainId, destinationTokenAddress) {
+    return sourceChainId === destinationChainId && eqci(sourceTokenAddress, destinationTokenAddress);
+}