@b3dotfun/sdk 0.0.20 → 0.0.21-alpha.0

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

@@ -1,114 +1,62 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useAccountWallet } from "../../../../global-account/react/index.js";
+import { thirdwebB3Mainnet } from "../../../../shared/constants/chains/b3Chain.js";
 import { cn } from "../../../../shared/utils/cn.js";
 import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
+import { client } from "../../../../shared/utils/thirdweb.js";
 import { ChevronLeft, ChevronRightCircle, Wallet, X } from "lucide-react";
-import { useEffect, useRef } from "react";
+import { useState } from "react";
+import { createPortal } from "react-dom";
 import { toast } from "sonner";
-import { useSetActiveWallet } from "thirdweb/react";
-import { useAccount, useConnect, useDisconnect } from "wagmi";
-export var PaymentMethod;
-(function (PaymentMethod) {
-    PaymentMethod["NONE"] = "none";
-    PaymentMethod["CONNECT_WALLET"] = "connect_wallet";
-    PaymentMethod["TRANSFER_CRYPTO"] = "transfer_crypto";
-})(PaymentMethod || (PaymentMethod = {}));
+import { ConnectEmbed, lightTheme, useActiveWallet } from "thirdweb/react";
+import { createWallet } from "thirdweb/wallets";
+import { useDisconnect } from "wagmi";
+export var CryptoPaymentMethodType;
+(function (CryptoPaymentMethodType) {
+    CryptoPaymentMethodType["NONE"] = "none";
+    CryptoPaymentMethodType["CONNECT_WALLET"] = "connect_wallet";
+    CryptoPaymentMethodType["TRANSFER_CRYPTO"] = "transfer_crypto";
+})(CryptoPaymentMethodType || (CryptoPaymentMethodType = {}));
 export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod, isCreatingOrder, onBack, onSelectPaymentMethod, }) {
-    const { connect, connectors, isPending: isConnecting, error: connectError } = useConnect();
-    const wagmiAccount = useAccount();
-    const { address: globalAddress, connectedEOAWallet, isActiveEOAWallet, wallet: globalWallet } = useAccountWallet();
+    const { wallet: globalWallet } = useAccountWallet();
+    const activeWallet = useActiveWallet();
     const { disconnect } = useDisconnect();
-    const previousAddress = useRef(globalAddress);
-    const setActiveWallet = useSetActiveWallet();
-    // Automatically set EOA wallet as active when available
-    useEffect(() => {
-        if (connectedEOAWallet) {
-            console.log("Setting active wallet", connectedEOAWallet);
-            setActiveWallet(connectedEOAWallet);
-        }
-    }, [connectedEOAWallet, isActiveEOAWallet, setActiveWallet]);
-    // Handle wallet connection success
-    useEffect(() => {
-        if (globalAddress && previousAddress.current !== globalAddress) {
-            previousAddress.current = globalAddress;
-            toast.success("Wallet connected successfully");
-            // Automatically select connect wallet method and go back to main view
-            setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-            onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-        }
-    }, [globalAddress, setSelectedPaymentMethod, onSelectPaymentMethod]);
-    // Handle connection errors
-    useEffect(() => {
-        if (connectError) {
-            // Handle specific error cases
-            if (connectError.message.includes("Connector already connected")) {
-                // If connector is already connected, just proceed with the flow
-                console.log("Connector already connected, proceeding with selection");
-                // Use wagmi account address or global address
-                if (wagmiAccount.address || globalAddress) {
-                    setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                    onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                }
-                else {
-                    // Fallback: proceed anyway as the connector reports it's connected
-                    setTimeout(() => {
-                        setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                        onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                    }, 100);
-                }
-            }
-            else {
-                toast.error(`Failed to connect wallet: ${connectError.message}`);
-            }
-        }
-    }, [connectError, globalAddress, wagmiAccount.address, setSelectedPaymentMethod, onSelectPaymentMethod]);
-    return (_jsx("div", { className: "mx-auto w-[460px] max-w-full", 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: "Choose payment method" }) }) }), _jsxs("div", { className: "flex flex-col gap-3", children: [!globalAddress ? (
-                        // Not connected - show single connect button
-                        _jsxs("button", { onClick: () => {
-                                // Prevent connecting if already connecting or if there's already a connection
-                                if (isConnecting)
-                                    return;
-                                try {
-                                    // Check if wagmi already has a connection
-                                    if (wagmiAccount.isConnected && wagmiAccount.address) {
-                                        // Already connected via wagmi, just proceed with selection
-                                        console.log("Wagmi already connected, proceeding with selection");
-                                        setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                        onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                        return;
-                                    }
-                                    // Check if global address exists (b3 account system)
-                                    if (globalAddress) {
-                                        // Already connected via global account, just proceed with selection
-                                        console.log("Global address already exists, proceeding with selection");
-                                        setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                        onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                        return;
-                                    }
-                                    // Use the first available connector or a preferred one
-                                    const preferredConnector = connectors.find(c => c.name.toLowerCase().includes("metamask")) || connectors[0];
-                                    if (preferredConnector) {
-                                        connect({ connector: preferredConnector });
-                                    }
-                                }
-                                catch (error) {
-                                    console.error("Connection error:", error);
-                                    toast.error("Failed to connect wallet. Please try again.");
-                                }
-                            }, disabled: isConnecting, className: "bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md disabled:cursor-not-allowed disabled:opacity-50", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col items-start text-left", children: [_jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }), _jsx("p", { className: "text-as-primary/60 text-sm", children: "Connect your wallet to continue" })] })] }), isConnecting ? (_jsx("div", { className: "border-as-primary/20 border-t-as-primary h-5 w-5 animate-spin rounded-full border-2" })) : (_jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" }))] })) : (
-                        // Connected - show wallet info
-                        _jsx("div", { className: "bg-as-surface-primary border-as-border-secondary rounded-xl border", children: _jsxs("div", { className: "flex items-center justify-between p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [globalWallet?.meta?.icon ? (_jsx("img", { src: globalWallet.meta.icon, alt: "Connected Wallet", className: "h-8 w-8 rounded-full" })) : (_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-green-100", children: _jsx(Wallet, { className: "h-4 w-4 text-green-600" }) })), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(globalAddress) })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { onClick: () => {
-                                                    setSelectedPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                                    onSelectPaymentMethod(PaymentMethod.CONNECT_WALLET);
-                                                }, className: "bg-as-brand hover:bg-as-brand/90 rounded-lg px-3 py-1.5 text-sm font-medium text-white transition-colors", children: "Use Wallet" }), _jsx("button", { onClick: () => {
-                                                    disconnect();
-                                                    toast.success("Wallet disconnected");
-                                                    if (selectedPaymentMethod === PaymentMethod.CONNECT_WALLET) {
-                                                        setSelectedPaymentMethod(PaymentMethod.NONE);
-                                                    }
-                                                }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), _jsxs("button", { onClick: () => {
-                                setSelectedPaymentMethod(PaymentMethod.TRANSFER_CRYPTO);
-                                onSelectPaymentMethod(PaymentMethod.TRANSFER_CRYPTO);
-                            }, disabled: isCreatingOrder, className: "bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })] })] }) }));
+    const [showWalletModal, setShowWalletModal] = useState(false);
+    // Define available wallets for the modal
+    const availableWallets = [
+        createWallet("io.metamask"),
+        // createWallet("com.coinbase.wallet"),
+        createWallet("me.rainbow"),
+        createWallet("walletConnect"),
+        createWallet("io.rabby"),
+        createWallet("app.phantom"),
+    ];
+    return (_jsxs("div", { className: "mx-auto h-fit w-[460px] max-w-full", 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: "Choose payment method" }) }) }), _jsxs("div", { className: "flex flex-col gap-3", children: [!activeWallet ? (
+                            // Not connected - show single connect button
+                            _jsxs("button", { onClick: () => setShowWalletModal(true), className: "bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col items-start text-left", children: [_jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }), _jsx("p", { className: "text-as-primary/60 text-sm", children: "Choose from multiple wallet options" })] })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })) : (
+                            // Connected - show wallet info
+                            _jsx("div", { className: "bg-as-surface-primary border-as-border-secondary rounded-xl border", children: _jsxs("div", { className: "flex items-center justify-between p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [globalWallet?.meta?.icon ? (_jsx("img", { src: globalWallet.meta.icon, alt: "Connected Wallet", className: "h-8 w-8 rounded-full" })) : (_jsx("div", { className: "flex h-8 w-8 items-center justify-center rounded-full bg-green-100", children: _jsx(Wallet, { className: "h-4 w-4 text-green-600" }) })), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(activeWallet.getAccount()?.address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("button", { onClick: () => {
+                                                        setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                                        onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                                    }, className: "bg-as-brand hover:bg-as-brand/90 rounded-lg px-3 py-1.5 text-sm font-medium text-white transition-colors", children: "Use Wallet" }), _jsx("button", { onClick: async () => {
+                                                        disconnect();
+                                                        toast.success("Wallet disconnected");
+                                                        if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
+                                                            setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
+                                                        }
+                                                    }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), _jsxs("button", { onClick: () => {
+                                    setSelectedPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+                                    onSelectPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+                                }, disabled: isCreatingOrder, className: "bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })] })] }), showWalletModal &&
+                createPortal(_jsx("div", { className: "pointer-events-auto fixed inset-0 z-[9999] flex items-center justify-center bg-black/50", children: _jsxs("div", { className: "max-h-[80vh] w-[400px] max-w-[90vw] overflow-auto rounded-xl bg-white p-6 dark:bg-gray-900", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: "Connect Wallet" }), _jsx("button", { onClick: () => setShowWalletModal(false), className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx(ConnectEmbed, { client: client, chain: thirdwebB3Mainnet, wallets: availableWallets, showThirdwebBranding: false, theme: lightTheme(), onConnect: async (wallet) => {
+                                    console.log("Wallet connected:", wallet);
+                                    // setShowWalletModal(false);
+                                    setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                    onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                    setShowWalletModal(false);
+                                }, style: {
+                                    width: "100%",
+                                    minHeight: "300px",
+                                } })] }) }), typeof window !== "undefined" ? document.getElementById("b3-root") || document.body : document.body)] }));
 }

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

@@ -49,7 +49,7 @@ export function FiatPaymentMethodComponent({ selectedPaymentMethod, setSelectedP
             id: FiatPaymentMethod.STRIPE,
             name: "Stripe",
             description: "Credit or debit card payment",
-            badge: stripeFee ? `$${stripeFee} fee` : "Standard Fee",
+            badge: stripeFee ? `$${Number(stripeFee).toFixed(2)} fee` : "Standard Fee",
             badgeColor: "bg-yellow-100 text-yellow-800",
             available: true,
         });

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

@@ -1,5 +1,5 @@
 import { components } from "../../../../anyspend/types/api";
-import { PaymentMethod } from "./CryptoPaymentMethod";
+import { CryptoPaymentMethodType } from "./CryptoPaymentMethod";
 interface OrderDetailsProps {
     isMainnet: boolean;
     mode?: "modal" | "page";
@@ -8,7 +8,7 @@ interface OrderDetailsProps {
     relayTx: components["schemas"]["RelayTx"] | null;
     executeTx: components["schemas"]["ExecuteTx"] | null;
     refundTxs: components["schemas"]["RefundTx"][] | null;
-    paymentMethod?: PaymentMethod;
+    cryptoPaymentMethod?: CryptoPaymentMethodType;
     onBack?: () => void;
 }
 export declare const OrderDetails: import("react").NamedExoticComponent<OrderDetailsProps>;

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

@@ -20,7 +20,7 @@ import { erc20Abi } from "viem";
 import { b3 } from "viem/chains";
 import { useWaitForTransactionReceipt, useWalletClient } from "wagmi";
 import ConnectWalletPayment from "./ConnectWalletPayment.js";
-import { PaymentMethod } from "./CryptoPaymentMethod.js";
+import { CryptoPaymentMethodType } from "./CryptoPaymentMethod.js";
 import { OrderDetailsCollapsible } from "./OrderDetailsCollapsible.js";
 import PaymentVendorUI from "./PaymentVendorUI.js";
 import { TransferCryptoDetails } from "./TransferCryptoDetails.js";
@@ -120,12 +120,12 @@ function roundTokenAmount(amount) {
     const roundedDecimalPart = digits.join("");
     return `${wholePart}.${roundedDecimalPart}`;
 }
-export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, paymentMethod = PaymentMethod.NONE, onBack, }) {
+export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, cryptoPaymentMethod, onBack, }) {
     const router = useRouter();
     const searchParams = useSearchParams();
-    // Read payment method from URL parameters
-    const paymentMethodFromUrl = searchParams.get("paymentMethod");
-    const effectivePaymentMethod = paymentMethodFromUrl || paymentMethod || PaymentMethod.NONE;
+    // Read crypto payment method from URL parameters
+    const cryptoPaymentMethodFromUrl = searchParams.get("cryptoPaymentMethod");
+    const effectiveCryptoPaymentMethod = cryptoPaymentMethod || cryptoPaymentMethodFromUrl || CryptoPaymentMethodType.NONE;
     const setB3ModalOpen = useModalStore((state) => state.setB3ModalOpen);
     const srcToken = order.metadata.srcToken;
     const dstToken = order.metadata.dstToken;
@@ -470,7 +470,7 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                 ? `Waiting for payment`
                                 : `Waiting for deposit ${formattedDepositDeficit} ${srcToken.symbol}`, chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 }))] })] }));
     }
-    return (_jsxs(_Fragment, { children: [statusDisplay === "processing" && (_jsx(_Fragment, { children: order.onrampMetadata ? (_jsx(PaymentVendorUI, { isMainnet: isMainnet, order: order, dstTokenSymbol: dstToken.symbol })) : effectivePaymentMethod === PaymentMethod.CONNECT_WALLET ? (_jsx(ConnectWalletPayment, { order: order, onPayment: handlePayment, onCancel: handleBack, txLoading: txLoading, isSwitchingOrExecuting: isSwitchingOrExecuting, phantomWalletAddress: phantomWalletAddress, tournament: tournament, nft: nft })) : effectivePaymentMethod === PaymentMethod.TRANSFER_CRYPTO ? (
+    return (_jsxs(_Fragment, { children: [statusDisplay === "processing" && (_jsx(_Fragment, { children: order.onrampMetadata ? (_jsx(PaymentVendorUI, { isMainnet: isMainnet, order: order, dstTokenSymbol: dstToken.symbol })) : effectiveCryptoPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET ? (_jsx(ConnectWalletPayment, { order: order, onPayment: handlePayment, onCancel: handleBack, txLoading: txLoading, isSwitchingOrExecuting: isSwitchingOrExecuting, phantomWalletAddress: phantomWalletAddress, tournament: tournament, nft: nft })) : effectiveCryptoPaymentMethod === CryptoPaymentMethodType.TRANSFER_CRYPTO ? (
                 // Transfer Crypto Payment Method - Show new card-based UI
                 _jsx(TransferCryptoDetails, { order: order, recipientName: recipientName, srcToken: srcToken, dstToken: dstToken, tournament: tournament, nft: nft, onBack: handleBack })) : (_jsxs("div", { className: "relative flex w-full flex-1 flex-col", children: [_jsxs("div", { className: "flex flex-col gap-1", children: [_jsx("span", { className: "text-as-primary/50", children: "Please send" }), _jsxs("div", { className: "flex w-full flex-wrap items-center gap-6 sm:justify-between sm:gap-0", children: [_jsx(CopyToClipboard, { text: roundedUpSrcAmount, onCopy: () => {
                                                 toast.success("Copied to clipboard");
@@ -482,11 +482,9 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                                         ? centerTruncate(phantomWalletAddress, 6)
                                                         : centerTruncate(account?.address || "", 6)] })] }), _jsxs("div", { className: "flex w-full flex-col items-center gap-2", children: [_jsxs(ShinyButton, { accentColor: colorMode === "dark" ? "#ffffff" : "#000000", className: "flex w-5/6 items-center gap-2 sm:px-0", onClick: () => setShowQRCode(true), children: [_jsx("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from a different wallet" }), _jsx(ChevronRight, { className: "h-4 w-4" })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletWalletConnect, { className: "h-5 w-5", variant: "branded" }), _jsx("span", { className: "label-style text-as-primary/30 text-xs", children: "& more" })] })] })] }) })) : (
                         // Default case - existing QR code flow
-                        _jsx(motion.div, { initial: { opacity: 0, filter: "blur(10px)" }, animate: { opacity: 1, filter: "blur(0px)" }, transition: { duration: 0.5, ease: "easeInOut" }, className: "flex w-full items-center justify-evenly gap-4", children: _jsxs("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress, order.srcChain), className: "max-w-[200px]" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" })] })] })] }) }))] })) })), _jsxs("div", { className: "flex w-full items-center justify-center gap-1 text-sm", children: [_jsx("div", { className: "text-as-primary/30", children: "Time remaining:" }), _jsx("div", { className: "text-as-primary", children: depositEnoughAmount ? ("Received") : order.status === "expired" ? ("Expired") : (_jsx(TimeAgo, { date: new Date(order.expiredAt), live: true })) })] }), statusDisplay !== "processing" && (_jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount })), _jsxs("button", { className: "flex w-full items-center justify-center gap-2", onClick: handleBack, children: [_jsx(RefreshCcw, { className: "ml-2 h-4 w-4" }), " Cancel and start over"] })] }));
+                        _jsx(motion.div, { initial: { opacity: 0, filter: "blur(10px)" }, animate: { opacity: 1, filter: "blur(0px)" }, transition: { duration: 0.5, ease: "easeInOut" }, className: "flex w-full items-center justify-evenly gap-4", children: _jsxs("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === RELAY_ETH_ADDRESS ? srcToken?.symbol || "ETH" : order.srcTokenAddress, order.srcChain, srcToken?.decimals), className: "max-w-[200px]" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" })] })] })] }) }))] })) })), _jsxs("div", { className: "flex w-full items-center justify-center gap-1 text-sm", children: [_jsx("div", { className: "text-as-primary/30", children: "Time remaining:" }), _jsx("div", { className: "text-as-primary", children: depositEnoughAmount ? ("Received") : order.status === "expired" ? ("Expired") : (_jsx(TimeAgo, { date: new Date(order.expiredAt), live: true })) })] }), statusDisplay !== "processing" && (_jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount })), _jsxs("button", { className: "flex w-full items-center justify-center gap-2", onClick: handleBack, children: [_jsx(RefreshCcw, { className: "ml-2 h-4 w-4" }), " Cancel and start over"] })] }));
 });
 function TransactionDetails({ title, chainId, tx, isProcessing, delay, }) {
-    return (_jsxs("div", { className: "relative flex w-full flex-1 items-center justify-between gap-4", children: [_jsxs("div", { className: "flex grow items-center gap-4", children: [_jsx(motion.div, { className: "bg-b3-react-background relative h-10 w-10 rounded-full", children: isProcessing ? (_jsx(motion.div, { initial: { opacity: 0, scale: 0.3 }, animate: { opacity: 1, scale: 1 }, transition: { duration: 0.5, ease: "easeInOut", delay }, className: "absolute z-10 m-2 flex h-6 w-6 items-center justify-center rounded-full bg-black/70 shadow-lg backdrop-blur-sm", children: _jsx(Loader2, { className: "text-as-primary h-4 w-4 animate-spin" }) })) : (_jsx(motion.div, { initial: { opacity: 0, scale: 0.3 }, animate: { opacity: 1, scale: 1 }, transition: { duration: 0.5, ease: "easeOut", delay }, className: "bg-as-brand/70 absolute z-10 m-2 flex h-6 w-6 items-center justify-center rounded-full border border-white/30 shadow-lg shadow-purple-500/30 backdrop-blur-sm", style: {
-                                boxShadow: "0 0 15px 5px rgba(138, 43, 226, 0.2)",
-                            }, children: _jsx(CheckIcon, { className: "text-as-primary h-3 w-3" }) })) }), _jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.3, ease: "easeInOut", delay }, className: "shrink-0 text-base", children: isProcessing ? (_jsx(TextShimmer, { duration: 1, children: title })) : (_jsx("span", { className: "text-as-primary", children: title })) })] }), _jsx("div", { className: "flex flex-col gap-1", children: tx ? (_jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.3, ease: "easeInOut", delay: (delay || 0) + 0.3 }, className: "flex items-center gap-3", children: _jsx("a", { href: getExplorerTxUrl(chainId, tx.txHash), target: "_blank", children: _jsx("div", { className: "text-as-primary/30 font-mono text-xs", children: centerTruncate(tx?.txHash, 6) }) }) })) : null })] }));
+    return (_jsxs("div", { className: "relative flex w-full flex-1 items-center justify-between gap-4", children: [_jsxs("div", { className: "flex grow items-center gap-4", children: [_jsx(motion.div, { className: "bg-b3-react-background relative h-10 w-10 rounded-full", children: isProcessing ? (_jsx(motion.div, { initial: { opacity: 0, scale: 0.3 }, animate: { opacity: 1, scale: 1 }, transition: { duration: 0.5, ease: "easeInOut", delay }, className: "absolute z-10 m-2 flex h-6 w-6 items-center justify-center rounded-full bg-black/70 shadow-lg backdrop-blur-sm", children: _jsx(Loader2, { className: "text-as-primary h-4 w-4 animate-spin" }) })) : (_jsx(motion.div, { initial: { opacity: 0, scale: 0.3 }, animate: { opacity: 1, scale: 1 }, transition: { duration: 0.5, ease: "easeOut", delay }, className: "bg-as-brand/70 absolute z-10 m-2 flex h-6 w-6 items-center justify-center rounded-full border border-white/30 shadow-lg backdrop-blur-sm", children: _jsx(CheckIcon, { className: "text-as-primary h-3 w-3" }) })) }), _jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.3, ease: "easeInOut", delay }, className: "shrink-0 text-base", children: isProcessing ? (_jsx(TextShimmer, { duration: 1, children: title })) : (_jsx("span", { className: "text-as-primary", children: title })) })] }), _jsx("div", { className: "flex flex-col gap-1", children: tx ? (_jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.3, ease: "easeInOut", delay: (delay || 0) + 0.3 }, className: "flex items-center gap-3", children: _jsx("a", { href: getExplorerTxUrl(chainId, tx.txHash), target: "_blank", children: _jsx("div", { className: "text-as-primary/30 font-mono text-xs", children: centerTruncate(tx?.txHash, 6) }) }) })) : null })] }));
 }
 export const OrderDetailsLoadingView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-4", children: [_jsxs(Badge, { variant: "default", className: "hover:bg-b3-react-background flex items-center gap-3 border-white/20 bg-white/10 px-4 py-1 text-base transition-colors", children: [_jsx(Loader2, { className: "text-as-primary h-4 w-4 animate-spin" }), _jsx(TextShimmer, { duration: 1, className: "font-sf-rounded text-base font-semibold", children: "Loading..." })] }), _jsxs("div", { className: "flex w-full flex-1 flex-col", children: [_jsxs("div", { className: "mb-4 flex flex-col gap-1", children: [_jsx(Skeleton, { className: "h-4 w-24" }), _jsxs("div", { className: "mt-2 flex items-center gap-2", children: [_jsx(Skeleton, { className: "h-8 w-48" }), _jsx(Skeleton, { className: "ml-4 h-8 w-32" })] }), _jsx(Skeleton, { className: "mt-4 h-8 w-24" })] }), _jsx(Skeleton, { className: "mb-4 h-12 w-full" }), _jsxs("div", { className: "flex w-full items-center justify-between gap-4", children: [_jsxs(Skeleton, { className: "rounded-lg p-6 pb-3", children: [_jsx("div", { className: "h-[200px] w-[200px]" }), _jsx("div", { className: "mt-3 flex items-center justify-center gap-2", children: _jsx("div", { className: "h-5 w-5 rounded-full" }) })] }), _jsx("div", { className: "flex flex-1 flex-col gap-2", children: [1, 2, 3].map(i => (_jsx(Skeleton, { className: "h-10 w-full" }, i))) })] })] }), _jsxs("div", { className: "bg-b3-react-background mt-8 w-full rounded-lg p-4", children: [_jsx(Skeleton, { className: "mb-3 h-4 w-48" }), _jsxs("div", { className: "flex items-center gap-4", children: [_jsx(Skeleton, { className: "h-10 flex-1" }), _jsx(Skeleton, { className: "h-10 flex-1" })] })] }), _jsx(Skeleton, { className: "h-10 w-full" })] }));

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

@@ -20,10 +20,10 @@ export const OrderStatus = memo(function OrderStatus({ order }) {
             description: description,
         },
     ];
-    if (order.status === "waiting_stripe_payment") {
+    if (["waiting_stripe_payment"].includes(order.status)) {
         return _jsx(StepProgress, { steps: paymentSteps, currentStepIndex: 0 });
     }
-    if (order.status === "relay") {
+    if (["relay", "sending_token_from_vault"].includes(order.status)) {
         return _jsx(StepProgress, { steps: paymentSteps, currentStepIndex: 1 });
     }
     if (!isComplete && displayStatus !== "failure") {

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

@@ -81,9 +81,7 @@ function StripePaymentForm({ order, clientSecret, onPaymentSuccess, }) {
         try {
             const result = (await stripe.confirmPayment({
                 elements,
-                confirmParams: {
-                    return_url: `${window.location.origin}/?orderId=${order.id}&waitingForDeposit=true&fromStripe=true`,
-                },
+                redirect: "if_required",
             }));
             if (result.error) {
                 // This point will only be reached if there is an immediate error.

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

@@ -0,0 +1,42 @@
+export interface RecipientSelectionProps {
+    /**
+     * Initial recipient address value
+     */
+    initialValue?: string;
+    /**
+     * Placeholder text for the input field
+     */
+    placeholder?: string;
+    /**
+     * Title text displayed in the header
+     */
+    title?: string;
+    /**
+     * Description text displayed below the title
+     */
+    description?: string;
+    /**
+     * Text for the confirm button
+     */
+    confirmText?: string;
+    /**
+     * Callback when back button is clicked
+     */
+    onBack: () => void;
+    /**
+     * Callback when recipient address is confirmed
+     * @param address - The recipient address entered by the user
+     */
+    onConfirm: (address: string) => void;
+    /**
+     * Whether the component should auto-focus the input
+     */
+    autoFocus?: boolean;
+    /**
+     * Custom validation function for the address
+     * @param address - The address to validate
+     * @returns true if valid, false otherwise
+     */
+    validateAddress?: (address: string) => boolean;
+}
+export declare function RecipientSelection({ initialValue, placeholder, title, description, confirmText, onBack, onConfirm, autoFocus, validateAddress, }: RecipientSelectionProps): import("react/jsx-runtime").JSX.Element;

package/dist/esm/anyspend/react/components/common/RecipientSelection.example.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Example usage of the RecipientSelection component
+ * This file demonstrates various ways to use the component with different props
+ */
+export declare function BasicRecipientSelection(): import("react/jsx-runtime").JSX.Element;
+export declare function CustomRecipientSelection(): import("react/jsx-runtime").JSX.Element;
+export declare function ENSRecipientSelection(): import("react/jsx-runtime").JSX.Element;

package/dist/esm/anyspend/react/components/common/RecipientSelection.example.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+/**
+ * Example usage of the RecipientSelection component
+ * This file demonstrates various ways to use the component with different props
+ */
+import { isAddress } from "viem";
+import { RecipientSelection } from "./RecipientSelection.js";
+// Basic usage example
+export function BasicRecipientSelection() {
+    return (_jsx(RecipientSelection, { onBack: () => console.log("Back clicked"), onConfirm: address => console.log("Address confirmed:", address) }));
+}
+// Custom styling and validation example
+export function CustomRecipientSelection() {
+    const validateEthereumAddress = (address) => {
+        return isAddress(address);
+    };
+    return (_jsx(RecipientSelection, { initialValue: "0x...", placeholder: "Enter Ethereum address", title: "Send to Ethereum Address", description: "Enter a valid Ethereum address to send tokens", confirmText: "Confirm Ethereum Address", validateAddress: validateEthereumAddress, autoFocus: false, onBack: () => console.log("Going back"), onConfirm: address => console.log("Valid Ethereum address:", address) }));
+}
+// ENS-focused example
+export function ENSRecipientSelection() {
+    return (_jsx(RecipientSelection, { placeholder: "Enter ENS name (e.g., vitalik.eth)", title: "Send to ENS Address", description: "Enter an ENS name or Ethereum address", confirmText: "Confirm ENS Address", onBack: () => console.log("Back to previous view"), onConfirm: address => console.log("ENS or address:", address) }));
+}

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

@@ -0,0 +1,33 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { ChevronLeft } from "lucide-react";
+import { useEffect, useState } from "react";
+export function RecipientSelection({ initialValue = "", placeholder = "Enter recipient address", title = "Add recipient address or ENS", description = "Swap and send tokens to another address", confirmText = "Confirm recipient address", onBack, onConfirm, autoFocus = true, validateAddress, }) {
+    const [recipientAddress, setRecipientAddress] = useState(initialValue);
+    // Update internal state when initialValue changes
+    useEffect(() => {
+        setRecipientAddress(initialValue);
+    }, [initialValue]);
+    const handlePaste = async () => {
+        try {
+            const text = await navigator.clipboard.readText();
+            setRecipientAddress(text);
+        }
+        catch (err) {
+            console.error("Failed to read clipboard:", err);
+        }
+    };
+    const handleConfirm = () => {
+        if (recipientAddress && (!validateAddress || validateAddress(recipientAddress))) {
+            onConfirm(recipientAddress);
+        }
+    };
+    const handleKeyDown = (e) => {
+        if (e.key === "Enter" && recipientAddress) {
+            handleConfirm();
+        }
+    };
+    const isAddressValid = !validateAddress || !recipientAddress || validateAddress(recipientAddress);
+    const canConfirm = recipientAddress && isAddressValid;
+    return (_jsx("div", { className: "mx-auto w-[460px] max-w-full", children: _jsxs("div", { className: "flex flex-col gap-6", children: [_jsxs("div", { className: "flex justify-around", children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsxs("div", { className: "flex-1 text-center", children: [_jsx("h2", { className: "text-as-primary text-lg font-semibold", children: title }), _jsx("p", { className: "text-as-primary/60 text-sm", children: description })] })] }), _jsxs("div", { className: "flex flex-col gap-4", children: [_jsxs("div", { className: "bg-as-surface-secondary border-as-border-secondary flex h-12 w-full overflow-hidden rounded-xl border", children: [_jsx("input", { type: "text", placeholder: placeholder, value: recipientAddress, onChange: e => setRecipientAddress(e.target.value), onKeyDown: handleKeyDown, className: "text-as-primary placeholder:text-as-primary/50 flex-1 bg-transparent px-4 text-base focus:outline-none", autoFocus: autoFocus }), _jsx("div", { className: "border-as-border-secondary border-l", children: _jsx("button", { onClick: handlePaste, className: "text-as-primary/70 hover:text-as-primary hover:bg-as-surface-primary h-full px-4 font-semibold transition-colors", children: "Paste" }) })] }), recipientAddress && !isAddressValid && (_jsx("div", { className: "text-as-red text-sm", children: "Please enter a valid address" })), _jsx("button", { onClick: handleConfirm, disabled: !canConfirm, className: "bg-as-brand hover:bg-as-brand/90 disabled:bg-as-on-surface-2 disabled:text-as-secondary h-12 w-full rounded-xl font-medium text-white transition-colors disabled:cursor-not-allowed", children: confirmText })] })] }) }));
+}

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

@@ -66,5 +66,5 @@ export const TransferCryptoDetails = memo(function TransferCryptoDetails({ order
                                             transition: "stroke-dashoffset 1s linear",
                                         } })] }), _jsx("div", { className: "absolute inset-0 flex items-center justify-center", children: _jsx("span", { className: "text-as-primary text-[10px] font-semibold", children: formatTime(timeLeft) }) })] })] }), _jsxs("div", { className: "flex w-full flex-col gap-4", children: [_jsxs("div", { className: "flex items-center gap-4", children: [_jsxs("div", { className: "w-full", children: [_jsx("span", { className: "text-as-content-secondary text-sm font-medium", children: "Amount" }), _jsx("div", { className: "border-as-border-primary rounded-lg border p-2 shadow-sm", children: _jsx(CopyToClipboard, { text: roundedUpSrcAmount || "", onCopy: () => {
                                                 toast.success("Amount copied to clipboard");
-                                            }, children: _jsxs("div", { className: "flex cursor-pointer items-center justify-between gap-2", children: [_jsxs("strong", { className: "text-as-primary font-semibold", children: [roundedUpSrcAmount, " ", srcToken.symbol] }), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 transition-all duration-200" })] }) }) })] }), _jsxs("div", { className: "w-full", children: [_jsx("span", { className: "text-as-content-secondary text-sm font-medium", children: "Chain" }), _jsx("div", { className: "border-as-border-primary rounded-lg border p-2 shadow-sm", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: ALL_CHAINS[order.srcChain].logoUrl, alt: getChainName(order.srcChain), className: cn("h-6 rounded-full", order.srcChain === b3.id && "h-5 rounded-none") }), _jsx("span", { className: "text-as-primary text-sm font-semibold", children: getChainName(order.srcChain) })] }) })] })] }), _jsxs("div", { className: "border-b3-react-border bg-as-surface-secondary grid h-[220px] grid-cols-2 overflow-hidden rounded-xl border", children: [_jsx("div", { className: "border-as-border-primary h-full w-full border-r", children: _jsx("div", { className: "flex justify-center", children: _jsxs("div", { className: "bg-as-surface-secondary flex flex-col items-center rounded-lg p-6", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress, order.srcChain), className: "bg-as-surface-secondary max-h-48 max-w-48" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "text-as-brand/70 text-sm font-medium", children: "SCAN WITH" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" })] })] })] }) }) }), _jsxs("div", { className: "flex h-full w-full flex-col gap-2 p-6", children: [_jsx("span", { className: "text-as-content-secondary text-sm font-medium", children: "Deposit address:" }), _jsxs("div", { className: "flex h-full cursor-pointer flex-col items-stretch justify-between gap-4", onClick: handleCopyAddress, children: [_jsx("div", { className: "text-as-primary break-all font-mono text-sm font-semibold leading-relaxed", children: order.globalAddress }), _jsx("div", { className: "place-self-end", children: _jsx(Copy, { className: "group-hover:text-as-brand text-as-tertiarry h-4 w-4 cursor-pointer transition-all duration-200" }) })] })] })] }), _jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount })] }), _jsx("div", { className: "flex flex-col gap-3", children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "w-full py-3", onClick: handleCopyAddress, children: "Copy deposit address" }) })] }));
+                                            }, children: _jsxs("div", { className: "flex cursor-pointer items-center justify-between gap-2", children: [_jsxs("strong", { className: "text-as-primary font-semibold", children: [roundedUpSrcAmount, " ", srcToken.symbol] }), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 transition-all duration-200" })] }) }) })] }), _jsxs("div", { className: "w-full", children: [_jsx("span", { className: "text-as-content-secondary text-sm font-medium", children: "Chain" }), _jsx("div", { className: "border-as-border-primary rounded-lg border p-2 shadow-sm", children: _jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: ALL_CHAINS[order.srcChain].logoUrl, alt: getChainName(order.srcChain), className: cn("h-6 rounded-full", order.srcChain === b3.id && "h-5 rounded-none") }), _jsx("span", { className: "text-as-primary text-sm font-semibold", children: getChainName(order.srcChain) })] }) })] })] }), _jsxs("div", { className: "border-b3-react-border bg-as-surface-secondary grid h-[220px] grid-cols-2 overflow-hidden rounded-xl border", children: [_jsx("div", { className: "border-as-border-primary h-full w-full border-r", children: _jsx("div", { className: "flex justify-center", children: _jsxs("div", { className: "bg-as-surface-secondary flex flex-col items-center rounded-lg p-6", children: [_jsx(QRCodeSVG, { value: getPaymentUrl(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress, order.srcChain, srcToken?.decimals), className: "bg-as-surface-secondary max-h-48 max-w-48" }), _jsxs("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [_jsx("span", { className: "text-as-brand/70 text-sm font-medium", children: "SCAN WITH" }), _jsxs(TextLoop, { interval: 3, children: [_jsx(WalletMetamask, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletPhantom, { className: "h-5 w-5", variant: "branded" }), _jsx(WalletTrust, { className: "h-5 w-5", variant: "branded" })] })] })] }) }) }), _jsxs("div", { className: "flex h-full w-full flex-col gap-2 p-6", children: [_jsx("span", { className: "text-as-content-secondary text-sm font-medium", children: "Deposit address:" }), _jsxs("div", { className: "flex h-full cursor-pointer flex-col items-stretch justify-between gap-4", onClick: handleCopyAddress, children: [_jsx("div", { className: "text-as-primary break-all font-mono text-sm font-semibold leading-relaxed", children: order.globalAddress }), _jsx("div", { className: "place-self-end", children: _jsx(Copy, { className: "group-hover:text-as-brand text-as-tertiarry h-4 w-4 cursor-pointer transition-all duration-200" }) })] })] })] }), _jsx(OrderDetailsCollapsible, { order: order, dstToken: dstToken, tournament: tournament, nft: nft, recipientName: recipientName, formattedExpectedDstAmount: formattedExpectedDstAmount })] }), _jsx("div", { className: "flex flex-col gap-3", children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "w-full py-3", onClick: handleCopyAddress, children: "Copy deposit address" }) })] }));
 });

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

@@ -16,6 +16,7 @@ export { OrderHistoryItem } from "./common/OrderHistoryItem";
 export { OrderStatus } from "./common/OrderStatus";
 export { OrderToken } from "./common/OrderToken";
 export { OrderTokenAmount } from "./common/OrderTokenAmount";
+export { RecipientSelection } from "./common/RecipientSelection";
 export { StepProgress } from "./common/StepProgress";
 export { TokenBalance } from "./common/TokenBalance";
 export { TransferCryptoDetails } from "./common/TransferCryptoDetails";

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

@@ -18,6 +18,7 @@ export { OrderHistoryItem } from "./common/OrderHistoryItem.js";
 export { OrderStatus } from "./common/OrderStatus.js";
 export { OrderToken } from "./common/OrderToken.js";
 export { OrderTokenAmount } from "./common/OrderTokenAmount.js";
+export { RecipientSelection } from "./common/RecipientSelection.js";
 export { StepProgress } from "./common/StepProgress.js";
 export { TokenBalance } from "./common/TokenBalance.js";
 export { TransferCryptoDetails } from "./common/TransferCryptoDetails.js";

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

@@ -5,6 +5,7 @@ export * from "./useAnyspendOrderHistory";
 export * from "./useAnyspendQuote";
 export * from "./useAnyspendTokens";
 export * from "./useCoinbaseOnrampOptions";
+export * from "./useConnectedUserProfile";
 export * from "./useGeoOnrampOptions";
 export * from "./useGetGeo";
 export * from "./useSigMint";

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

@@ -5,6 +5,7 @@ export * from "./useAnyspendOrderHistory.js";
 export * from "./useAnyspendQuote.js";
 export * from "./useAnyspendTokens.js";
 export * from "./useCoinbaseOnrampOptions.js";
+export * from "./useConnectedUserProfile.js";
 export * from "./useGeoOnrampOptions.js";
 export * from "./useGetGeo.js";
 export * from "./useSigMint.js";

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

@@ -0,0 +1,12 @@
+/**
+ * Hook that provides connected user's address, profile, and cleaned display name
+ * Combines logic for getting connected address from either global account or thirdweb wallets
+ */
+export declare function useConnectedUserProfile(): {
+    address: string | undefined;
+    profile: import("@tanstack/react-query").UseQueryResult<import("../../../global-account/react").CombinedProfile, Error>;
+    name: string | null | undefined;
+    isLoading: boolean;
+    isError: boolean;
+    error: Error | null;
+};

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

@@ -0,0 +1,22 @@
+import { useAccountWallet, useProfile } from "../../../global-account/react/index.js";
+import { useConnectedWallets } from "thirdweb/react";
+/**
+ * Hook that provides connected user's address, profile, and cleaned display name
+ * Combines logic for getting connected address from either global account or thirdweb wallets
+ */
+export function useConnectedUserProfile() {
+    const { address: globalAddress } = useAccountWallet();
+    const connectedWallets = useConnectedWallets();
+    // Get connected address from global account or first connected wallet
+    const connectedAddress = globalAddress || connectedWallets?.[0]?.getAccount()?.address;
+    // Fetch profile data for the connected address with cleaned name
+    const connectedProfile = useProfile({ address: connectedAddress });
+    return {
+        address: connectedAddress,
+        profile: connectedProfile,
+        name: connectedProfile.data?.name,
+        isLoading: connectedProfile.isLoading,
+        isError: connectedProfile.isError,
+        error: connectedProfile.error,
+    };
+}

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

@@ -16,13 +16,13 @@ export declare const useGenerateSigMintData: ({ recipientAddress, contractAddres
             creator?: string | undefined;
             signatureRequestBody?: {
                 currency?: string | undefined;
-                price?: string | undefined;
-                clonePrice?: string | undefined;
-                primarySaleRecipient?: string | undefined;
                 royaltyRecipient?: string | undefined;
                 royaltyBps?: number | undefined;
+                primarySaleRecipient?: string | undefined;
                 validityStartTimestamp?: number | undefined;
                 validityEndTimestamp?: number | undefined;
+                price?: string | undefined;
+                clonePrice?: string | undefined;
                 metadata: {
                     name?: string | undefined;
                     description?: string | undefined;
@@ -38,9 +38,9 @@ export declare const useGenerateSigMintData: ({ recipientAddress, contractAddres
             maxSupply?: number | undefined;
             conditions?: {
                 chainId: number;
-                tokenAddress: string;
                 conditionType: "user-owns-tokens";
                 isOnchain: boolean;
+                tokenAddress: string;
                 tokenAmount: string;
             }[] | undefined;
             isFreeMint?: boolean | undefined;
@@ -90,9 +90,9 @@ export declare const useSigMintCollection: ({ address, chainId }: FindByAddressP
                 description?: string | undefined;
                 name?: string | undefined;
                 image?: string | undefined;
+                attributes?: any;
                 externalLink?: string | undefined;
                 appUri?: string | undefined;
-                attributes?: any;
                 backgroundColor?: string | undefined;
                 promptImageUrl?: string | undefined;
             };

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

@@ -1,3 +1,3 @@
 export * from "./components";
 export * from "./hooks";
-export * from "./providers/AnyspendProvider";
+export * from "./providers";

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

@@ -1,3 +1,3 @@
 export * from "./components/index.js";
 export * from "./hooks/index.js";
-export * from "./providers/AnyspendProvider.js";
+export * from "./providers/index.js";

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

@@ -0,0 +1,2 @@
+export * from "./AnyspendProvider";
+export * from "./StripeRedirectHandler";

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

@@ -0,0 +1,2 @@
+export * from "./AnyspendProvider.js";
+export * from "./StripeRedirectHandler.js";