@b3dotfun/sdk 0.1.0 → 0.1.1-alpha.0

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/GasIndicator.d.ts

@@ -3,4 +3,4 @@ export interface GasIndicatorProps {
     gasPrice: GasPriceData;
     className?: string;
 }
-export declare function GasIndicator({ gasPrice, className }: GasIndicatorProps): import("react/jsx-runtime").JSX.Element;
+export declare function GasIndicator({ gasPrice, className }: GasIndicatorProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -1,22 +1,8 @@
 "use client";
-import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { cn } from "../../../../shared/utils/cn.js";
 import { motion } from "motion/react";
-const LEVEL_LABELS = {
-    low: "Low",
-    normal: "Normal",
-    elevated: "Elevated",
-    high: "High",
-    spike: "Spike",
-};
-const LEVEL_STYLES = {
-    low: "bg-green-500/20 text-green-500",
-    normal: "bg-as-surface-tertiary text-as-secondary",
-    elevated: "bg-yellow-500/20 text-yellow-600",
-    high: "bg-orange-500/20 text-orange-500",
-    spike: "bg-red-500/20 text-red-500",
-};
-function formatGasPrice(gweiString) {
+function formatGwei(gweiString) {
     const gwei = parseFloat(gweiString);
     if (gwei < 0.001)
         return "<0.001";
@@ -27,5 +13,9 @@ function formatGasPrice(gweiString) {
     return gwei.toFixed(1);
 }
 export function GasIndicator({ gasPrice, className }) {
-    return (_jsxs(motion.div, { initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.2 }, className: cn("flex items-center justify-between rounded-lg px-3 py-2", gasPrice.isSpike ? "bg-yellow-500/10" : "bg-as-surface-secondary", className), children: [_jsx("div", { className: "flex items-center gap-2", children: _jsxs("span", { className: "text-as-secondary text-xs", children: ["Gas on ", gasPrice.chainName] }) }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: cn("rounded px-1.5 py-0.5 text-xs font-medium", LEVEL_STYLES[gasPrice.level]), children: LEVEL_LABELS[gasPrice.level] }), _jsxs("span", { className: "text-as-primary text-xs font-medium", children: [formatGasPrice(gasPrice.gasPriceGwei), " Gwei"] })] })] }));
+    // Only show when gas is high or spike
+    if (!["high", "spike"].includes(gasPrice.level)) {
+        return null;
+    }
+    return (_jsxs(motion.div, { initial: { opacity: 0, y: 10 }, animate: { opacity: 1, y: 0 }, transition: { duration: 0.2 }, className: cn("flex flex-col gap-1 rounded-lg bg-orange-500/10 px-3 py-2", className), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("span", { className: "text-xs font-medium text-orange-500", children: "Gas is high - transaction may fail or cost more" }), _jsxs("span", { className: "text-xs font-medium text-orange-500", children: [formatGwei(gasPrice.gasPriceGwei), " Gwei"] })] }), _jsx("span", { className: "text-as-secondary text-xs", children: "Consider swapping later for better rates" })] }));
 }

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

@@ -1,13 +1,24 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { getNativeRequired } from "../../../../anyspend/utils/chain.js";
 import { isNativeToken } from "../../../../anyspend/utils/token.js";
-import { useTokenBalanceDirect } from "../../../../global-account/react/index.js";
+import { useSimTokenBalance } from "../../../../global-account/react/index.js";
+import { formatTokenAmount } from "../../../../shared/utils/number.js";
+import { useMemo } from "react";
 import { formatUnits } from "viem";
 export function TokenBalance({ token, walletAddress, onChangeInput, }) {
-    const { rawBalance, formattedBalance, isLoading } = useTokenBalanceDirect({
-        token,
-        address: walletAddress,
-    });
+    const tokenAddress = isNativeToken(token.address) ? "native" : token.address;
+    const { data, isLoading } = useSimTokenBalance(walletAddress, tokenAddress, token.chainId);
+    const { rawBalance, formattedBalance } = useMemo(() => {
+        const balance = data?.balances?.[0];
+        if (!balance?.amount) {
+            return { rawBalance: null, formattedBalance: "0" };
+        }
+        const raw = BigInt(balance.amount);
+        return {
+            rawBalance: raw,
+            formattedBalance: formatTokenAmount(raw, balance.decimals),
+        };
+    }, [data]);
     const handlePercentageClick = (percentage) => {
         if (!rawBalance)
             return;

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/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/react/providers/AnyspendProvider.js

@@ -1,6 +1,5 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { TooltipProvider } from "../../../global-account/react/index.js";
 import { FeatureFlagsProvider } from "../contexts/FeatureFlagsContext.js";
 import { StripeRedirectHandler } from "./StripeRedirectHandler.js";
 /**
@@ -27,5 +26,5 @@ import { StripeRedirectHandler } from "./StripeRedirectHandler.js";
  * ```
  */
 export const AnyspendProvider = function AnyspendProvider({ children, featureFlags }) {
-    return (_jsx(FeatureFlagsProvider, { featureFlags: featureFlags, children: _jsxs(TooltipProvider, { children: [_jsx(StripeRedirectHandler, {}), children] }) }));
+    return (_jsxs(FeatureFlagsProvider, { featureFlags: featureFlags, children: [_jsx(StripeRedirectHandler, {}), children] }));
 };

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);
+}

package/dist/esm/global-account/react/components/AccountAssets/AccountAssets.js

@@ -18,6 +18,10 @@ export function AccountAssets({ nfts, isLoading }) {
     }, {});
     const collections = Object.values(groupedNFTs || {});
     const [expandedCollections, setExpandedCollections] = useState(() => new Set(collections.map(c => c.collection_id)));
+    const [failedImages, setFailedImages] = useState(() => new Set());
+    const handleImageError = (imageId) => {
+        setFailedImages(prev => new Set(prev).add(imageId));
+    };
     if (isLoading) {
         return (_jsx("div", { className: "flex flex-col gap-3", children: [...Array(2)].map((_, i) => (_jsxs("div", { className: "animate-pulse", children: [_jsx("div", { className: "bg-b3-react-muted mb-3 h-6 w-48 rounded" }), _jsxs("div", { className: "flex gap-3", children: [_jsx("div", { className: "bg-b3-react-muted h-[98px] w-[98px] shrink-0 rounded-lg" }), _jsx("div", { className: "bg-b3-react-muted h-[98px] w-[98px] shrink-0 rounded-lg" })] })] }, i))) }));
     }
@@ -36,11 +40,11 @@ export function AccountAssets({ nfts, isLoading }) {
             return next;
         });
     };
-    return (_jsx("div", { className: "flex flex-col gap-3 px-4", children: collections.map(collection => {
+    return (_jsx("div", { className: "flex flex-col gap-3", children: collections.map(collection => {
             const isExpanded = expandedCollections.has(collection.collection_id);
-            return (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("button", { onClick: () => toggleCollection(collection.collection_id), className: "flex w-full items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-1", children: [collection.collection_image && (_jsx("img", { src: collection.collection_image, alt: collection.collection_name, className: "h-5 w-5 shrink-0 rounded object-cover" })), _jsxs("p", { className: "font-neue-montreal-medium text-[14px] text-[#3f3f46]", children: [collection.collection_name, " (", collection.nfts.length, ")"] })] }), _jsx("svg", { className: `h-[18px] w-[18px] shrink-0 transition-transform ${isExpanded ? "rotate-180" : ""}`, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M4.5 6.75L9 11.25L13.5 6.75", stroke: "#51525C", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })] }), isExpanded && (_jsx("div", { className: "flex gap-3 overflow-x-auto", children: collection.nfts.map(nft => (_jsx("div", { className: "relative h-[98px] w-[98px] shrink-0 overflow-hidden rounded-lg", children: _jsx("img", { src: nft.previews?.image_medium_url ||
+            return (_jsxs("div", { className: "flex flex-col gap-3", children: [_jsxs("button", { onClick: () => toggleCollection(collection.collection_id), className: "flex w-full items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-1", children: [collection.collection_image && !failedImages.has(`collection-${collection.collection_id}`) && (_jsx("img", { src: collection.collection_image, alt: collection.collection_name, className: "h-5 w-5 shrink-0 rounded object-cover", onError: () => handleImageError(`collection-${collection.collection_id}`) })), _jsxs("p", { className: "font-neue-montreal-medium text-[14px] text-[#3f3f46]", children: [collection.collection_name, " (", collection.nfts.length, ")"] })] }), _jsx("svg", { className: `h-[18px] w-[18px] shrink-0 transition-transform ${isExpanded ? "rotate-180" : ""}`, viewBox: "0 0 18 18", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: _jsx("path", { d: "M4.5 6.75L9 11.25L13.5 6.75", stroke: "#51525C", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })] }), isExpanded && (_jsx("div", { className: "flex gap-3 overflow-x-auto", children: collection.nfts.map(nft => (_jsx("div", { className: "bg-b3-react-muted relative h-[98px] w-[98px] shrink-0 overflow-hidden rounded-lg", children: !failedImages.has(nft.nft_id) && (_jsx("img", { src: nft.previews?.image_medium_url ||
                                     nft.extra_metadata?.image_original_url ||
                                     nft.collection?.image_url ||
-                                    "", alt: nft.name || "NFT", className: "h-full w-full object-cover" }) }, nft.nft_id))) }))] }, collection.collection_id));
+                                    "", alt: nft.name || "NFT", className: "h-full w-full object-cover", onError: () => handleImageError(nft.nft_id) })) }, nft.nft_id))) }))] }, collection.collection_id));
         }) }));
 }

package/dist/esm/global-account/react/components/B3DynamicModal.js

@@ -1,15 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AnySpend, AnySpendBondKit, AnySpendBuySpin, AnySpendCollectorClubPurchase, AnySpendNFT, AnyspendSignatureMint, AnySpendStakeB3, AnySpendStakeB3ExactIn, AnySpendTournament, OrderHistory, } from "../../../anyspend/react/index.js";
+import { AnySpendDeposit } from "../../../anyspend/react/components/AnySpendDeposit.js";
 import { AnySpendDepositHype } from "../../../anyspend/react/components/AnyspendDepositHype.js";
 import { AnySpendDepositUpside } from "../../../anyspend/react/components/AnySpendDepositUpside.js";
 import { AnySpendStakeUpside } from "../../../anyspend/react/components/AnySpendStakeUpside.js";
 import { AnySpendStakeUpsideExactIn } from "../../../anyspend/react/components/AnySpendStakeUpsideExactIn.js";
-import { useB3Config, useGlobalAccount, useIsMobile, useModalStore } from "../../../global-account/react/index.js";
+import { useB3Config, useIsMobile, useModalStore } from "../../../global-account/react/index.js";
 import { cn } from "../../../shared/utils/cn.js";
 import { debugB3React } from "../../../shared/utils/debug.js";
 import { AnimatePresence, motion } from "framer-motion";
-import { useEffect, useRef } from "react";
-import { useSetActiveWallet } from "thirdweb/react";
 import { AvatarEditor } from "./AvatarEditor/AvatarEditor.js";
 import { Deposit } from "./Deposit/Deposit.js";
 import { LinkAccount } from "./LinkAccount/LinkAccount.js";
@@ -31,19 +30,7 @@ export function B3DynamicModal() {
     const navigateBack = useModalStore(state => state.navigateBack);
     const { theme } = useB3Config();
     const isMobile = useIsMobile();
-    const prevIsOpenRef = useRef(isOpen);
-    const { wallet } = useGlobalAccount();
-    const setActiveWallet = useSetActiveWallet();
     const { toasts, removeToast } = useToastContext();
-    // anyspend cleanup global account chnages by setting account back
-    useEffect(() => {
-        if (prevIsOpenRef.current && !isOpen) {
-            if (wallet) {
-                setActiveWallet(wallet);
-            }
-        }
-        prevIsOpenRef.current = isOpen;
-    }, [isOpen, wallet, setActiveWallet]);
     // Define arrays for different modal type groups
     const fullWidthTypes = [
         "anySpend",
@@ -66,6 +53,7 @@ export function B3DynamicModal() {
         "deposit",
         "send",
         "notifications",
+        "anySpendDeposit",
     ];
     const freestyleTypes = [
         "anySpendNft",
@@ -136,6 +124,8 @@ export function B3DynamicModal() {
                 return _jsx(AnySpendDepositHype, { ...contentType, mode: "modal" });
             case "anySpendCollectorClubPurchase":
                 return _jsx(AnySpendCollectorClubPurchase, { ...contentType, mode: "modal" });
+            case "anySpendDeposit":
+                return _jsx(AnySpendDeposit, { ...contentType, mode: "modal" });
             case "avatarEditor":
                 return _jsx(AvatarEditor, { onSetAvatar: contentType.onSuccess });
             case "deposit":

package/dist/esm/global-account/react/components/B3Provider/B3ConfigProvider.d.ts

@@ -0,0 +1,31 @@
+import { CreateOnrampOrderParams } from "../../../../anyspend/react/hooks/useAnyspendCreateOnrampOrder";
+import { CreateOrderParams } from "../../../../anyspend/react/hooks/useAnyspendCreateOrder";
+import { PermissionsConfig } from "../../../../global-account/types/permissions";
+import { Account } from "thirdweb/wallets";
+import { ClientType } from "../../../client-manager";
+export interface B3ConfigContextType {
+    accountOverride?: Account;
+    automaticallySetFirstEoa: boolean;
+    environment: "development" | "production";
+    defaultPermissions: PermissionsConfig;
+    theme: "light" | "dark";
+    clientType: ClientType;
+    partnerId: string;
+    stripePublishableKey?: string;
+    createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+    enableTurnkey: boolean;
+}
+export declare function B3ConfigProvider({ children, accountOverride, environment, defaultPermissions, automaticallySetFirstEoa, theme, clientType, partnerId, stripePublishableKey, createClientReferenceId, enableTurnkey, }: {
+    children: React.ReactNode;
+    accountOverride?: Account;
+    environment?: "development" | "production";
+    defaultPermissions?: PermissionsConfig;
+    automaticallySetFirstEoa?: boolean;
+    theme?: "light" | "dark";
+    clientType?: ClientType;
+    partnerId: string;
+    stripePublishableKey?: string;
+    createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+    enableTurnkey?: boolean;
+}): import("react/jsx-runtime").JSX.Element;
+export declare function useB3Config(): B3ConfigContextType;

package/dist/esm/global-account/react/components/B3Provider/B3ConfigProvider.js

@@ -0,0 +1,33 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+/**
+ * Default permissions configuration for B3 provider
+ */
+const DEFAULT_PERMISSIONS = {
+    approvedTargets: ["0xa8e42121e318e3D3BeD7f5969AF6D360045317DD"],
+    nativeTokenLimitPerTransaction: 0.1,
+    startDate: new Date(),
+    endDate: new Date(Date.now() + 1000 * 60 * 60 * 24 * 365), // 1 year from now
+};
+const B3ConfigContext = createContext(null);
+export function B3ConfigProvider({ children, accountOverride, environment = "development", defaultPermissions = DEFAULT_PERMISSIONS, automaticallySetFirstEoa = false, theme = "light", clientType = "rest", partnerId, stripePublishableKey, createClientReferenceId, enableTurnkey = false, }) {
+    return (_jsx(B3ConfigContext.Provider, { value: {
+            accountOverride,
+            environment,
+            defaultPermissions,
+            automaticallySetFirstEoa,
+            theme,
+            clientType,
+            partnerId,
+            stripePublishableKey,
+            createClientReferenceId,
+            enableTurnkey,
+        }, children: children }));
+}
+export function useB3Config() {
+    const context = useContext(B3ConfigContext);
+    if (!context) {
+        throw new Error("useB3Config must be used within a B3ConfigProvider");
+    }
+    return context;
+}