@b3dotfun/sdk 0.0.7-alpha.27 → 0.0.7-alpha.3

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

@@ -1,4 +1,4 @@
-export declare function ChainTokenIcon({ chainUrl, tokenUrl, className, }: {
+export declare function ChainTokenIcon({ chainUrl, tokenUrl, className }: {
     chainUrl: string;
     tokenUrl: string;
     className?: string;

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

@@ -1,4 +1,4 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function ChainTokenIcon({ chainUrl, tokenUrl, className = "", }) {
+export function ChainTokenIcon({ chainUrl, tokenUrl, className = "" }) {
     return (_jsxs("div", { className: `relative ${className}`, children: [_jsx("img", { src: tokenUrl, alt: "Token", className: "h-full w-full rounded-full" }), _jsx("div", { className: "bg-as-on-surface-1 border-as-stroke absolute bottom-0 right-0 h-[45%] w-[45%] rounded border", children: _jsx("img", { src: chainUrl, alt: "Chain", className: "h-full w-full rounded" }) })] }));
 }

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

@@ -1,15 +1,15 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ALL_CHAINS, capitalizeFirstLetter, EVM_CHAINS, getChainName, getErrorDisplay, getExplorerTxUrl, getPaymentUrl, getStatusDisplay, isNativeToken, OnrampVendor, OrderStatus, OrderType, RELAY_ETH_ADDRESS, zNft, zToken, zTournament, } from "../../../../anyspend/index.js";
-import { Badge, Button, CopyToClipboard, ShinyButton, Skeleton, TextLoop, TextShimmer, useAccountWallet, useChainSwitchWithAction, useModalStore, useOnchainName, } from "../../../../global-account/react/index.js";
-import { useRouter, useSearchParams } from "../../../../shared/react/hooks/index.js";
+import { ALL_CHAINS, capitalizeFirstLetter, EVM_CHAINS, getChainName, getErrorDisplay, getExplorerTxUrl, getPaymentUrl, getStatusDisplay, isNativeToken, OrderStatus, OrderType, RELAY_ETH_ADDRESS, zNft, zToken, zTournament } from "../../../../anyspend/index.js";
+import { CopyToClipboard, Badge, ShinyButton, Skeleton, TextLoop, TextShimmer, Button, useAccountWallet, useChainSwitchWithAction, useOnchainName, useModalStore } from "../../../../global-account/react/index.js";
 import { cn } from "../../../../shared/utils/index.js";
 import centerTruncate from "../../../../shared/utils/centerTruncate.js";
 import { formatTokenAmount } from "../../../../shared/utils/number.js";
 import { useColorMode } from "@chakra-ui/react";
 import { WalletCoinbase, WalletMetamask, WalletPhantom, WalletTrust, WalletWalletConnect } from "@web3icons/react";
 import { motion } from "framer-motion";
-import { CheckIcon, ChevronDown, ChevronRight, Copy, ExternalLink, Home, Loader2, RefreshCcw, SquareArrowOutUpRight, } from "lucide-react";
+import { CheckIcon, ChevronDown, ChevronRight, Copy, ExternalLink, Home, Loader2, RefreshCcw, SquareArrowOutUpRight } from "lucide-react";
+import { useRouter, useSearchParams } from "next/navigation";
 import { QRCodeSVG } from "qrcode.react";
 import { memo, useCallback, useEffect, useMemo, useState } from "react";
 import TimeAgo from "react-timeago";
@@ -19,7 +19,7 @@ import { b3 } from "viem/chains";
 import { useWaitForTransactionReceipt, useWalletClient } from "wagmi";
 import PaymentVendorUI from "./PaymentVendorUI.js";
 // Add this helper function near the top or just above the component
-function getOrderSuccessText({ order, tournament, formattedActualDstAmount, dstToken, recipientName, centerTruncate, }) {
+function getOrderSuccessText({ order, tournament, formattedActualDstAmount, dstToken, recipientName, centerTruncate }) {
     const recipient = recipientName || centerTruncate(order.recipientAddress, 8);
     let actionText = "";
     switch (order.type) {
@@ -114,7 +114,7 @@ function roundTokenAmount(amount) {
     const roundedDecimalPart = digits.join("");
     return `${wholePart}.${roundedDecimalPart}`;
 }
-export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, onBack, }) {
+export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, onBack }) {
     const router = useRouter();
     const searchParams = useSearchParams();
     const setB3ModalOpen = useModalStore(state => state.setB3ModalOpen);
@@ -131,6 +131,21 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
     const [showQRCode, setShowQRCode] = useState(false);
     const { isLoading: txLoading, isSuccess: txSuccess } = useWaitForTransactionReceipt({ hash: txHash });
     const { switchChainAndExecute, isSwitchingOrExecuting } = useChainSwitchWithAction();
+    // const { permitData, isCheckingPermit } = usePermitData({
+    //   chainId: order.srcChain,
+    //   tokenAddress: order.srcTokenAddress as Hex,
+    //   ownerAddress: account?.address && isAddress(account.address) ? getAddress(account.address) : undefined,
+    //   amount: BigInt(order.srcAmount)
+    // });
+    // const { sendPermitData } = useAnyspendSendPermitData({
+    //   onSuccess: _data => {
+    //     toast.info("Sent permit data successfully");
+    //   },
+    //   onError: error => {
+    //     console.error(error);
+    //     toast.error("Failed to send permit data: " + error.message);
+    //   }
+    // });
     const { colorMode } = useColorMode();
     const roundedUpSrcAmount = useMemo(() => {
         // Display the full transfer amount without rounding since users need to see the exact value they're transferring.
@@ -147,6 +162,31 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
             return;
         }
         console.log("Processing transaction on chain:", currentWalletClient.chain.id);
+        // Process transaction
+        // if (permitData?.data && account.address) {
+        //   const signature = await currentWalletClient.signTypedData({
+        //     domain: permitData.data.domain,
+        //     types: permitData.data.types,
+        //     primaryType: "Permit",
+        //     message: permitData.data.messageToSign
+        //   });
+        //   // Split signature into v, r, s components
+        //   const r = signature.slice(0, 66);
+        //   const s = "0x" + signature.slice(66, 130);
+        //   const v = parseInt(signature.slice(130, 132), 16);
+        //   sendPermitData({
+        //     isMainnet: true,
+        //     orderId: order.id,
+        //     permitData: {
+        //       deadline: Number(permitData.data.messageToSign.deadline),
+        //       ownerAddress: account.address,
+        //       r,
+        //       s,
+        //       v
+        //     }
+        //   });
+        //   return;
+        // }
         const signer = currentWalletClient.account;
         // Send transaction
         if (isNativeToken(order.srcTokenAddress)) {
@@ -154,7 +194,7 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                 account: signer,
                 chain: EVM_CHAINS[order.srcChain].viem,
                 to: order.globalAddress,
-                value: BigInt(order.srcAmount),
+                value: BigInt(order.srcAmount)
             });
             setTxHash(hash);
         }
@@ -165,7 +205,7 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                 address: order.srcTokenAddress,
                 abi: erc20Abi,
                 functionName: "transfer",
-                args: [order.globalAddress, BigInt(order.srcAmount)],
+                args: [order.globalAddress, BigInt(order.srcAmount)]
             });
             setTxHash(hash);
         }
@@ -177,29 +217,10 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
     };
     // When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
     const setWaitingForDeposit = useCallback(() => {
-        const params = new URLSearchParams(searchParams.toString());
+        const params = new URLSearchParams(searchParams);
         params.set("waitingForDeposit", "true");
         router.push(`?${params}`);
     }, [router, searchParams]);
-    // Clean up URL parameters before closing modal or navigating back
-    const cleanupUrlParams = useCallback(() => {
-        const params = new URLSearchParams(searchParams.toString());
-        params.delete("waitingForDeposit");
-        params.delete("orderId");
-        // Only update URL if params were actually removed
-        if (params.toString() !== searchParams.toString()) {
-            router.push(`?${params}`);
-        }
-    }, [router, searchParams]);
-    // Helper functions that clean up URL params before executing actions
-    const handleCloseModal = useCallback(() => {
-        cleanupUrlParams();
-        setB3ModalOpen(false);
-    }, [cleanupUrlParams, setB3ModalOpen]);
-    const handleBack = useCallback(() => {
-        cleanupUrlParams();
-        onBack?.();
-    }, [cleanupUrlParams, onBack]);
     useEffect(() => {
         if (txSuccess) {
             toast.success("Transaction successful! We are processing your order.", { duration: 10000 });
@@ -247,18 +268,14 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
     };
     if (refundTxs) {
         return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [_jsx("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: _jsx(motion.div, { className: "from-as-brand/50 absolute left-[2px] top-0 z-10 w-[3px] bg-gradient-to-b from-20% via-purple-500/50 via-80% to-transparent", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1.5, ease: "easeInOut" } }) }), depositTxs
-                            ? depositTxs.map(dTx => (_jsx(TransactionDetails, { title: order.onrampMetadata?.vendor === OnrampVendor.StripeWeb2
-                                    ? `Received payment`
-                                    : `Received ${formatTokenAmount(BigInt(dTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTx, isProcessing: false }, dTx.txHash)))
+                            ? depositTxs.map(dTx => (_jsx(TransactionDetails, { title: `Received ${formatTokenAmount(BigInt(dTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTx, isProcessing: false }, dTx.txHash)))
                             : null, refundTxs
                             ? refundTxs.map(rTx => (_jsx(TransactionDetails, { title: `Refunded ${formatTokenAmount(BigInt(rTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: rTx, isProcessing: false }, rTx.txHash)))
-                            : null] }), order.errorDetails && (_jsx("div", { className: "flex justify-center", children: _jsx("span", { className: "text-as-primary/50 text-center text-sm", style: { maxWidth: "40ch" }, children: getErrorDisplay(order.errorDetails) }) })), _jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? handleBack : handleCloseModal, children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }));
+                            : null] }), order.errorDetails && (_jsx("div", { className: "flex justify-center", children: _jsx("span", { className: "text-as-primary/50 text-center text-sm", style: { maxWidth: "40ch" }, children: getErrorDisplay(order.errorDetails) }) })), _jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? onBack : () => setB3ModalOpen(false), children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }));
     }
     if (executeTx) {
         return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [_jsx("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: _jsx(motion.div, { className: "from-as-brand/50 absolute left-[2px] top-0 z-10 w-[3px] bg-gradient-to-b from-20% via-purple-500/50 via-80% to-transparent", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1.5, ease: "easeInOut" } }) }), depositTxs
-                            ? depositTxs.map(dTxs => (_jsx(TransactionDetails, { title: order.onrampMetadata?.vendor === OnrampVendor.StripeWeb2
-                                    ? `Received payment`
-                                    : `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
+                            ? depositTxs.map(dTxs => (_jsx(TransactionDetails, { title: `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
                             : null, _jsx(TransactionDetails, { title: "Processed Transaction", chainId: order.srcChain, tx: relayTx, delay: 0.5, isProcessing: false }), _jsx(TransactionDetails, { title: order.type === OrderType.Swap
                                 ? "Processed Swap"
                                 : order.type === OrderType.MintNFT
@@ -273,14 +290,12 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                     formattedActualDstAmount: formattedActualDstAmount,
                                     dstToken,
                                     recipientName,
-                                    centerTruncate,
-                                }), _jsx(ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === OrderType.JoinTournament && order.status === OrderStatus.Executed && (_jsxs(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: handleCloseModal, children: [_jsx("span", { className: "pl-4", children: "Continue to Tournament" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })), order.status === OrderStatus.Executed && (_jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? handleBack : handleCloseModal, children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
+                                    centerTruncate
+                                }), _jsx(ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === OrderType.JoinTournament && order.status === OrderStatus.Executed && (_jsxs(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: () => setB3ModalOpen(false), children: [_jsx("span", { className: "pl-4", children: "Continue to Tournament" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })), order.status === OrderStatus.Executed && (_jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? onBack : () => setB3ModalOpen(false), children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
     }
     if (relayTx && relayTx.status === "success") {
         return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [_jsx("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: _jsx(motion.div, { className: "from-as-brand/50 absolute left-[2px] top-0 z-10 w-[3px] bg-gradient-to-b from-20% via-purple-500/50 via-80% to-transparent", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1.5, ease: "easeInOut" } }) }), depositTxs
-                            ? depositTxs.map(dTxs => (_jsx(TransactionDetails, { title: order.onrampMetadata?.vendor === OnrampVendor.StripeWeb2
-                                    ? `Received payment`
-                                    : `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
+                            ? depositTxs.map(dTxs => (_jsx(TransactionDetails, { title: `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
                             : null, order.srcChain === order.dstChain ? (_jsx(TransactionDetails, { title: order.type === OrderType.Swap
                                 ? "Processed Swap"
                                 : order.type === OrderType.MintNFT
@@ -303,15 +318,13 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                     formattedActualDstAmount,
                                     dstToken,
                                     recipientName,
-                                    centerTruncate,
-                                }), _jsx(ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === OrderType.JoinTournament && order.status === OrderStatus.Executed && (_jsxs(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: handleCloseModal, children: [_jsx("span", { className: "pl-4", children: "Continue to Tournament" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })), order.status === OrderStatus.Executed && (_jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? handleBack : handleCloseModal, children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
+                                    centerTruncate
+                                }), _jsx(ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === OrderType.JoinTournament && order.status === OrderStatus.Executed && (_jsxs(ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: () => setB3ModalOpen(false), children: [_jsx("span", { className: "pl-4", children: "Continue to Tournament" }), _jsx(ChevronRight, { className: "h-4 w-4" })] })), order.status === OrderStatus.Executed && (_jsx("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: mode === "page" ? onBack : () => setB3ModalOpen(false), children: mode === "page" ? (_jsxs(_Fragment, { children: ["Return to Home ", _jsx(Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
     }
     // This boolean indicates that user finish payment, and waiting for the deposit to be confirmed. We get this from query params (waitingForDeposit=true)
     const waitingForDeposit = new URLSearchParams(window.location.search).get("waitingForDeposit") === "true";
     if (depositTxs?.length || waitingForDeposit) {
-        return (_jsx(_Fragment, { children: _jsxs("div", { className: "relative mt-4 flex w-full flex-col gap-6", children: [_jsx("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: _jsx(motion.div, { className: "from-as-brand/50 absolute left-[2px] top-0 z-10 w-[3px] bg-gradient-to-b from-20% via-purple-500/50 via-80% to-transparent", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1, ease: "easeInOut" } }) }), (depositTxs || []).map((dTxs, index) => (_jsx(TransactionDetails, { title: order.onrampMetadata?.vendor === OnrampVendor.StripeWeb2
-                            ? `Received payment`
-                            : `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: index < (depositTxs || []).length - 1 ? false : !depositEnoughAmount }, dTxs.txHash))), statusDisplay === "failure" ? (_jsx(TransactionDetails, { title: statusText, chainId: order.srcChain, tx: null, isProcessing: false, delay: 0.5 })) : depositEnoughAmount ? (_jsx(TransactionDetails, { title: order.type === OrderType.Swap
+        return (_jsx(_Fragment, { children: _jsxs("div", { className: "relative mt-4 flex w-full flex-col gap-6", children: [_jsx("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: _jsx(motion.div, { className: "from-as-brand/50 absolute left-[2px] top-0 z-10 w-[3px] bg-gradient-to-b from-20% via-purple-500/50 via-80% to-transparent", initial: { height: "0%" }, animate: { height: "100%" }, transition: { duration: 1, ease: "easeInOut" } }) }), (depositTxs || []).map((dTxs, index) => (_jsx(TransactionDetails, { title: `Received ${formatTokenAmount(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: index < (depositTxs || []).length - 1 ? false : !depositEnoughAmount }, dTxs.txHash))), statusDisplay === "failure" ? (_jsx(TransactionDetails, { title: statusText, chainId: order.srcChain, tx: null, isProcessing: false, delay: 0.5 })) : depositEnoughAmount ? (_jsx(TransactionDetails, { title: order.type === OrderType.Swap
                             ? "Processing Swap"
                             : order.type === OrderType.MintNFT
                                 ? "Minting NFT"
@@ -319,9 +332,7 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                     ? "Joining Tournament"
                                     : order.type === OrderType.FundTournament
                                         ? "Funding Tournament"
-                                        : "Processing Transaction", chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 })) : (_jsx(TransactionDetails, { title: order.onrampMetadata?.vendor === OnrampVendor.StripeWeb2
-                            ? `Waiting for payment`
-                            : `Waiting for deposit ${formattedDepositDeficit} ${srcToken.symbol}`, chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 }))] }) }));
+                                        : "Processing Transaction", chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 })) : (_jsx(TransactionDetails, { title: `Waiting for deposit ${formattedDepositDeficit} ${srcToken.symbol}`, chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 }))] }) }));
     }
     return (_jsxs(_Fragment, { children: [statusDisplay === "failure" && (_jsx("div", { className: "flex w-full flex-col items-center gap-3 whitespace-nowrap pb-2 text-sm", children: _jsx("div", { className: "bg-as-light-brand/20 flex w-full flex-col gap-4 rounded-lg p-8", children: _jsx("div", { className: "text-as-primary", style: { whiteSpace: "normal" }, children: "This order is no longer valid because the order expired." }) }) })), statusDisplay === "processing" && (_jsxs(_Fragment, { children: [order.onrampMetadata ? (_jsx(PaymentVendorUI, { isMainnet: isMainnet, order: order, dstTokenSymbol: dstToken.symbol })) : (_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");
@@ -335,7 +346,7 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                                     .share({
                                                     title: "Complete Deposit",
                                                     text: "Complete your deposit on BSMNT.fun",
-                                                    url: permalink,
+                                                    url: permalink
                                                 })
                                                     .catch(error => console.log("Error sharing:", error));
                                             }
@@ -354,11 +365,11 @@ export const OrderDetails = memo(function OrderDetails({ isMainnet, mode = "moda
                                                         : "Contract execution"
                                                     : "" }), _jsxs("div", { className: "flex items-end gap-2", children: [order.type === OrderType.Swap ? (`~${formattedExpectedDstAmount} ${dstToken.symbol}`) : order.type === OrderType.MintNFT ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: nft?.imageUrl, alt: nft?.name || "NFT", className: "h-5 w-5" }), _jsx("div", { children: nft?.name || "NFT" })] })) : order.type === OrderType.JoinTournament || order.type === OrderType.FundTournament ? (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("img", { src: tournament?.imageUrl, alt: tournament?.name || "Tournament", className: "h-5 w-5" }), _jsx("div", { children: tournament?.name || "Tournament" })] })) : null, _jsxs("div", { className: "text-as-primary/50 flex items-center gap-2", children: [_jsxs("span", { children: ["on ", order.dstChain !== b3.id && getChainName(order.dstChain)] }), _jsx("img", { src: ALL_CHAINS[order.dstChain].logoUrl, alt: getChainName(order.dstChain), className: cn("h-3", order.dstChain !== b3.id && "w-3 rounded-full", order.dstChain === b3.id && "h-4") })] })] })] }), _jsx("div", { className: "divider w-full" }), _jsxs("div", { className: "flex w-full justify-between gap-4", children: [_jsx("div", { className: "text-as-primary/30", children: "Order ID" }), _jsx("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap", children: order.id })] }), _jsx("div", { className: "divider w-full" }), _jsxs("div", { className: "flex w-full justify-between gap-4", children: [_jsx("div", { className: "text-as-primary/30", children: "Recipient" }), _jsxs("div", { className: "flex flex-col items-end gap-1", children: [recipientName && _jsx("div", { className: "text-as-primary font-semibold", children: recipientName }), _jsx(CopyToClipboard, { text: order.recipientAddress, onCopy: () => {
                                                 toast.success("Copied recipient address to clipboard");
-                                            }, children: _jsxs("div", { className: "text-as-primary flex items-center gap-2", children: [centerTruncate(order.recipientAddress, 10), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 cursor-pointer transition-all duration-200" })] }) })] })] })] }) })) : (_jsxs("div", { className: "flex w-full items-center", children: [_jsx("div", { className: "divider w-full" }), _jsx("button", { className: "whitespace-nowrap text-sm", onClick: () => setShowOrderDetails(true), children: "Order Details" }), _jsx(ChevronDown, { className: "text-as-primary mx-1 h-4 min-h-4 w-4 min-w-4" }), _jsx("div", { className: "divider w-full" })] })), _jsxs("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: handleBack, children: ["Cancel and start over ", _jsx(RefreshCcw, { className: "ml-2 h-4 w-4" })] })] }));
+                                            }, children: _jsxs("div", { className: "text-as-primary flex items-center gap-2", children: [centerTruncate(order.recipientAddress, 10), _jsx(Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 cursor-pointer transition-all duration-200" })] }) })] })] })] }) })) : (_jsxs("div", { className: "flex w-full items-center", children: [_jsx("div", { className: "divider w-full" }), _jsx("button", { className: "whitespace-nowrap text-sm", onClick: () => setShowOrderDetails(true), children: "Order Details" }), _jsx(ChevronDown, { className: "text-as-primary mx-1 h-4 min-h-4 w-4 min-w-4" }), _jsx("div", { className: "divider w-full" })] })), _jsxs("button", { className: "bg-as-on-surface-2 text-as-secondary flex w-full items-center justify-center gap-2 rounded-lg p-2", onClick: onBack, children: ["Cancel and start over ", _jsx(RefreshCcw, { className: "ml-2 h-4 w-4" })] })] }));
 });
-function TransactionDetails({ title, chainId, tx, isProcessing, delay, }) {
+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)",
+                                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 })] }));
 }
 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/OrderHistory.js

@@ -1,6 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useAnyspendOrderHistory } from "../../../../anyspend/react/index.js";
+import { useAnyspendOrderHistory } from "../../../../anyspend/index.js";
 import { Button, Skeleton, useAccountWallet } from "../../../../global-account/react/index.js";
 import { ArrowLeft, RefreshCcw } from "lucide-react";
 import { OrderHistoryItem } from "./OrderHistoryItem.js";

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

@@ -1,5 +1,5 @@
 import { Token } from "../../../../anyspend";
-export declare function OrderToken({ context, address, chainId, setChainId, token, setToken, requiredAmount, tokenSelectClassName, }: {
+export declare function OrderToken({ context, address, chainId, setChainId, token, setToken, requiredAmount, tokenSelectClassName }: {
     context: "from" | "to";
     address: string | undefined;
     token: Token;

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

@@ -9,13 +9,13 @@ import { TokenSelector } from "@reservoir0x/relay-kit-ui";
 import { CheckCircle2, ChevronsUpDown } from "lucide-react";
 import { useMemo } from "react";
 import { ChainTokenIcon } from "./ChainTokenIcon.js";
-export function OrderToken({ context, address, chainId, setChainId, token, setToken, requiredAmount, tokenSelectClassName, }) {
+export function OrderToken({ context, address, chainId, setChainId, token, setToken, requiredAmount, tokenSelectClassName }) {
     const { wallet } = useAccountWallet();
     const chainName = useMemo(() => simpleHashChainToChainName(chainId), [chainId]);
     const { nativeTokens, fungibleTokens } = useTokenBalancesByChain({
         address: wallet?.address || "",
         chainsIds: [chainId],
-        enabled: !!wallet?.address && !!chainName,
+        enabled: !!wallet?.address && !!chainName
     });
     const { formattedBalance, hasEnoughBalance } = useMemo(() => {
         // Get balance for the selected token
@@ -37,7 +37,7 @@ export function OrderToken({ context, address, chainId, setChainId, token, setTo
         const formattedBalance = balance ? formatTokenAmount(balance, token.decimals, 6, false) : null;
         return {
             formattedBalance,
-            hasEnoughBalance,
+            hasEnoughBalance
         };
     }, [chainId, fungibleTokens, nativeTokens, requiredAmount, token, wallet?.address]);
     return (_jsx(TokenSelector, { address: address, chainIdsFilter: Object.values(ALL_CHAINS).map(chain => chain.id), context: context, fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: Object.values(ALL_CHAINS).map(chain => chain.id), multiWalletSupportEnabled: true, onAnalyticEvent: undefined, popularChainIds: [1, 8453, RELAY_SOLANA_MAINNET_CHAIN_ID], restrictedToken: undefined, setToken: token => {
@@ -48,7 +48,7 @@ export function OrderToken({ context, address, chainId, setChainId, token, setTo
                 decimals: token.decimals,
                 metadata: { logoURI: token.logoURI },
                 name: token.name,
-                symbol: token.symbol,
+                symbol: token.symbol
             });
         }, supportedWalletVMs: ["evm", "svm"], token: undefined, trigger: _jsxs(Button, { variant: "outline", role: "combobox", className: cn("bg-b3-react-background border-as-stroke flex h-auto w-fit shrink-0 items-center justify-center gap-2 rounded-xl border-2 px-2 py-1 pr-2 text-center", tokenSelectClassName), children: [token.metadata.logoURI ? (_jsx(ChainTokenIcon, { chainUrl: ALL_CHAINS[chainId].logoUrl, tokenUrl: token.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: [_jsxs("div", { className: "text-as-primary font-semibold", children: [token.symbol, " on ", ALL_CHAINS[chainId].name] }), formattedBalance && (_jsxs("div", { className: "flex items-center gap-1", children: [_jsxs("div", { className: "text-as-primary/50 text-xs", children: [formattedBalance || "--", " ", token.symbol] }), hasEnoughBalance && _jsx(CheckCircle2, { className: "text-as-brand -mt-0.5 h-4 w-4" })] }))] }), _jsx(ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) }, undefined));
 }

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

@@ -1,5 +1,5 @@
 import { Token } from "../../../../anyspend";
-export declare function OrderTokenAmount({ disabled, inputValue, onChangeInput, context, address, chainId, setChainId, token, setToken, hideTokenSelect, canEditAmount, className, innerClassName, amountClassName, tokenSelectClassName, }: {
+export declare function OrderTokenAmount({ disabled, inputValue, onChangeInput, context, address, chainId, setChainId, token, setToken, hideTokenSelect, canEditAmount, className, innerClassName, amountClassName, tokenSelectClassName }: {
     disabled?: boolean;
     inputValue: string;
     onChangeInput: (value: string) => void;

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

@@ -8,7 +8,7 @@ import { Button } from "../../../../global-account/react/index.js";
 import { cn } from "../../../../shared/utils/index.js";
 import { TokenSelector } from "@reservoir0x/relay-kit-ui";
 import { ChainTokenIcon } from "./ChainTokenIcon.js";
-export function OrderTokenAmount({ disabled, inputValue, onChangeInput, context, address, chainId, setChainId, token, setToken, hideTokenSelect = false, canEditAmount = true, className, innerClassName, amountClassName, tokenSelectClassName, }) {
+export function OrderTokenAmount({ disabled, inputValue, onChangeInput, context, address, chainId, setChainId, token, setToken, hideTokenSelect = false, canEditAmount = true, className, innerClassName, amountClassName, tokenSelectClassName }) {
     // Track previous token to detect changes
     const prevTokenRef = useRef(token.address);
     useEffect(() => {
@@ -36,7 +36,7 @@ export function OrderTokenAmount({ disabled, inputValue, onChangeInput, context,
             decimals: newToken.decimals,
             metadata: { logoURI: newToken.logoURI },
             name: newToken.name,
-            symbol: newToken.symbol,
+            symbol: newToken.symbol
         });
         // If this is the source token, reset the amount immediately
         if (context === "from") {

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

@@ -1,4 +1,4 @@
-export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, }: {
+export declare function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp }: {
     srcAmountOnRamp: string;
     setSrcAmountOnRamp: (amount: string) => void;
 }): import("react/jsx-runtime").JSX.Element;

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

@@ -1,11 +1,11 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCoinbaseOnrampOptions } from "../../../../anyspend/react/index.js";
+import { useCoinbaseOnrampOptions } from "../../../../anyspend/index.js";
 import { Input, useGetGeo } from "../../../../global-account/react/index.js";
 import { AnimatePresence, motion } from "framer-motion";
 import { useRef } from "react";
 import { toast } from "sonner";
 import { PaymentOptions } from "./PaymentOptions.js";
-export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, }) {
+export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp }) {
     // Get geo data for onramp availability
     const { geoData } = useGetGeo();
     const { coinbaseOnrampOptions } = useCoinbaseOnrampOptions(true, geoData?.country || "US");
@@ -32,7 +32,7 @@ export function PanelOnramp({ srcAmountOnRamp, setSrcAmountOnRamp, }) {
                             : 25000) ? (_jsxs("p", { className: "label-style -mb-3 mt-3 text-xs text-red-400 dark:bg-transparent", children: ["Maximum amount is $", coinbaseOnrampOptions?.paymentCurrencies?.[0]?.limits?.find(l => l.id === "ACH_BANK_ACCOUNT")?.max ||
                                 "25,000"] })) : (_jsx("p", { className: "label-style text-b3-react-foreground/60 -mb-3 mt-3 text-xs dark:bg-transparent", children: "Buy amount in USD" })), _jsxs("div", { className: "relative inline-flex items-center dark:bg-transparent", children: [_jsx("span", { className: "text-b3-react-foreground/60 -ms-3 -mt-2 text-2xl font-semibold dark:bg-transparent", children: "$" }), _jsx(Input, { ref: amountInputRef, type: "text", value: srcAmountOnRamp, onChange: handleAmountChange, placeholder: "0.00", className: "placeholder:text-b3-react-foreground/60 h-auto min-w-[70px] border-0 bg-transparent py-6 text-center text-4xl font-semibold focus-visible:ring-0 focus-visible:ring-offset-0 dark:bg-transparent", style: {
                                     width: `${Math.max(50, srcAmountOnRamp.length * 34)}px`,
-                                    minWidth: srcAmountOnRamp ? `auto` : "105px",
+                                    minWidth: srcAmountOnRamp ? `auto` : "105px"
                                 } }), _jsx(AnimatePresence, { mode: "wait", children: _jsx(motion.div, { animate: { opacity: !srcAmountOnRamp || parseFloat(srcAmountOnRamp) <= 0 ? 1 : 0 }, exit: { opacity: 0 }, transition: { duration: 0.5, ease: "easeInOut" }, className: "border-b3-react-foreground/10 absolute bottom-3 left-1 h-1 w-[90%] rounded-full border-t-2 border-dashed bg-transparent" }) })] })] }), _jsx("div", { className: "grid grid-cols-4 gap-4", children: ["5", "10", "25", "100"].map(value => (_jsxs("button", { onClick: () => handleQuickAmount(value), className: `rounded-lg border px-4 py-3 ${srcAmountOnRamp === value
                         ? "border-as-brand bg-as-brand/30"
                         : "border-as-stroke hover:border-as-brand hover:bg-as-brand/30"} transition-all duration-200`, children: ["$", value] }, value))) })] }));

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

@@ -25,5 +25,5 @@ interface PanelOnrampPaymentProps {
     recipientEnsName?: string;
     recipientImageUrl?: string;
 }
-export declare function PanelOnrampPayment({ srcAmountOnRamp, recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationTokenAddress, selectedDstChainId, selectedDstToken, anyspendQuote, globalAddress, onOrderCreated, onBack, orderType, nft, tournament, payload, recipientEnsName, recipientImageUrl, }: PanelOnrampPaymentProps): import("react/jsx-runtime").JSX.Element;
+export declare function PanelOnrampPayment({ srcAmountOnRamp, recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationTokenAddress, selectedDstChainId, selectedDstToken, anyspendQuote, globalAddress, onOrderCreated, onBack, orderType, nft, tournament, payload, recipientEnsName, recipientImageUrl }: PanelOnrampPaymentProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -1,6 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { OnrampVendor, OrderType } from "../../../../anyspend/index.js";
-import { useAnyspendCreateOnrampOrder, useGeoOnrampOptions } from "../../../../anyspend/react/index.js";
+import { OnrampVendor, OrderType, useAnyspendCreateOnrampOrder, useGeoOnrampOptions } from "../../../../anyspend/index.js";
 import { Button } from "../../../../global-account/react/index.js";
 import centerTruncate from "../../../../shared/utils/centerTruncate.js";
 import { motion } from "framer-motion";
@@ -10,7 +9,7 @@ import { useEffect, useRef, useState } from "react";
 import { toast } from "sonner";
 export function PanelOnrampPayment({ srcAmountOnRamp, 
 // recipientName,
-recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationTokenAddress, selectedDstChainId, selectedDstToken, anyspendQuote, globalAddress, onOrderCreated, onBack, orderType, nft, tournament, payload, recipientEnsName, recipientImageUrl, }) {
+recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationTokenAddress, selectedDstChainId, selectedDstToken, anyspendQuote, globalAddress, onOrderCreated, onBack, orderType, nft, tournament, payload, recipientEnsName, recipientImageUrl }) {
     // Use a stable amount for geo onramp options to prevent unnecessary refetches
     const [stableAmountForGeo, setStableAmountForGeo] = useState(srcAmountOnRamp);
     const hasInitialized = useRef(false);
@@ -21,7 +20,7 @@ recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationToke
             hasInitialized.current = true;
         }
     }, [srcAmountOnRamp]);
-    const { geoData, coinbaseOnrampOptions, coinbaseAvailablePaymentMethods, isStripeOnrampSupported, isStripeWeb2Supported, isLoading: isLoadingGeoOnramp, } = useGeoOnrampOptions(isMainnet, stableAmountForGeo);
+    const { geoData, coinbaseOnrampOptions, coinbaseAvailablePaymentMethods, isStripeOnrampSupported, isStripeWeb2Supported, isLoading: isLoadingGeoOnramp } = useGeoOnrampOptions(isMainnet, stableAmountForGeo);
     const { createOrder, isCreatingOrder } = useAnyspendCreateOnrampOrder({
         onSuccess: data => {
             const orderId = data.data.id;
@@ -30,7 +29,7 @@ recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationToke
         onError: error => {
             console.error(error);
             toast.error("Failed to create order: " + error.message);
-        },
+        }
     });
     const handlePaymentMethodClick = async (vendor, paymentMethod) => {
         try {
@@ -64,7 +63,7 @@ recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationToke
                     return {
                         ...selectedDstToken,
                         chainId: destinationTokenChainId || selectedDstChainId,
-                        address: destinationTokenAddress,
+                        address: destinationTokenAddress
                     };
                 }
                 return selectedDstToken;
@@ -81,13 +80,13 @@ recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationToke
                     paymentMethod: paymentMethod || "",
                     country: geoData?.country || "US",
                     ipAddress: geoData?.ip,
-                    redirectUrl: window.location.origin === "https://basement.fun" ? "https://basement.fun/deposit" : window.location.origin,
+                    redirectUrl: window.location.origin === "https://basement.fun" ? "https://basement.fun/deposit" : window.location.origin
                 },
                 expectedDstAmount: anyspendQuote?.data?.currencyOut?.amount?.toString() || "0",
                 creatorAddress: globalAddress,
                 nft,
                 tournament,
-                payload,
+                payload
             });
         }
         catch (err) {
@@ -98,7 +97,7 @@ recipientAddress, isMainnet, isBuyMode, destinationTokenChainId, destinationToke
     return (_jsxs("div", { className: "mx-auto flex w-full max-w-[460px] flex-col gap-6", children: [_jsxs(_Fragment, { children: [_jsx("h2", { className: "-mb-3 text-lg font-semibold", children: "Order summary" }), _jsxs("div", { className: "bg-b3-react-background border-b3-react-border flex flex-col gap-3 rounded-lg border p-4", children: [recipientAddress && (_jsxs(motion.div, { initial: false, animate: {
                                     opacity: 1,
                                     y: 0,
-                                    filter: "blur(0px)",
+                                    filter: "blur(0px)"
                                 }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: "flex items-center justify-between", children: [_jsx("p", { className: "text-b3-react-foreground/60", children: orderType === OrderType.Swap
                                             ? "Recipient"
                                             : orderType === OrderType.MintNFT

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

@@ -6,7 +6,7 @@ export default function PaymentMethodIcons() {
         { name: "Mastercard", src: PAYMENT_METHOD_ICONS.mastercard },
         { name: "Amex", src: PAYMENT_METHOD_ICONS.amex },
         { name: "Apple Pay", src: PAYMENT_METHOD_ICONS.applePay },
-        { name: "Google Pay", src: PAYMENT_METHOD_ICONS.googlePay },
+        { name: "Google Pay", src: PAYMENT_METHOD_ICONS.googlePay }
     ];
     return (_jsxs("div", { className: "mt-6 flex w-full flex-col items-center gap-3", children: [_jsx("div", { className: "text-as-primary/30 text-xs", children: "Supported payment methods" }), _jsx("div", { className: "flex items-center gap-3", children: paymentMethods.map(method => (_jsx("img", { src: method.src, alt: method.name, className: "h-6 opacity-70" }, method.name))) })] }));
 }

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

@@ -10,12 +10,12 @@ export default function PaymentOneClick({ order }) {
     const howItWorksSteps = [
         {
             number: 1,
-            description: `Click the link above to pay with ${paymentDescription}`,
+            description: `Click the link above to pay with ${paymentDescription}`
         },
         {
             number: 2,
-            description: `After payment, you'll be redirected back here, where we continue to execute the order.`,
-        },
+            description: `After payment, you'll be redirected back here, where we continue to execute the order.`
+        }
     ];
     return (_jsxs("div", { className: "relative my-8 flex w-full flex-1 flex-col items-center justify-center", children: [_jsx("a", { href: order.oneClickBuyUrl || "", target: "_blank", className: "w-4/5", children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", className: "relative w-full py-6", children: _jsxs("div", { className: "relative z-10 flex items-center justify-center gap-3", children: [_jsxs("span", { className: "text-lg font-medium text-white", children: ["Continue to ", vendorName] }), _jsx(ChevronRight, { className: "h-5 w-5 text-white/90" })] }) }) }), _jsx(HowItWorks, { steps: howItWorksSteps })] }));
 }

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

@@ -1,6 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { USDC_BASE } from "../../../../anyspend/index.js";
-import { useStripeClientSecret } from "../../../../anyspend/react/index.js";
+import { USDC_BASE, useStripeClientSecret } from "../../../../anyspend/index.js";
 import { STRIPE_CONFIG } from "../../../../anyspend/constants/index.js";
 import { ShinyButton, useB3 } from "../../../../global-account/react/index.js";
 import { formatStripeAmount } from "../../../../shared/utils/payment.utils.js";
@@ -22,7 +21,7 @@ export default function PaymentStripeWeb2({ isMainnet, order, onPaymentSuccess }
     }
     return (_jsx(Elements, { stripe: stripePromise, options: {
             clientSecret: clientSecret || undefined,
-            appearance: { theme: theme === "light" ? "stripe" : "night" },
+            appearance: { theme: theme === "light" ? "stripe" : "night" }
         }, children: _jsx(StripePaymentForm, { order: order, clientSecret: clientSecret, onPaymentSuccess: onPaymentSuccess }) }));
 }
 function StripeLoadingState() {
@@ -31,7 +30,7 @@ function StripeLoadingState() {
 function StripeErrorState({ error }) {
     return (_jsx("div", { className: "relative my-8 flex w-full flex-1 flex-col items-center justify-center", children: _jsxs("div", { className: "bg-as-red/10 border-as-red/20 flex w-full items-center gap-3 rounded-2xl border p-4", children: [_jsx("div", { className: "bg-as-red flex h-6 w-6 shrink-0 items-center justify-center rounded-full", children: _jsx("svg", { className: "h-4 w-4 text-white", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) }), _jsxs("div", { className: "text-as-red text-sm font-medium", children: ["Error: ", error] })] }) }));
 }
-function StripePaymentForm({ order, clientSecret, onPaymentSuccess, }) {
+function StripePaymentForm({ order, clientSecret, onPaymentSuccess }) {
     const stripe = useStripe();
     const elements = useElements();
     const [loading, setLoading] = useState(false);
@@ -74,7 +73,7 @@ function StripePaymentForm({ order, clientSecret, onPaymentSuccess, }) {
             console.log("@@stripe-web2-payment:confirming-payment:", JSON.stringify({ orderId: order.id }, null, 2));
             const { error, paymentIntent } = await stripe.confirmPayment({
                 elements,
-                redirect: "if_required",
+                redirect: "if_required"
             });
             if (error) {
                 console.error("@@stripe-web2-payment:error:", JSON.stringify(error, null, 2));
@@ -108,30 +107,30 @@ function StripePaymentForm({ order, clientSecret, onPaymentSuccess, }) {
         defaultValues: {
             billingDetails: {
                 name: "",
-                email: "",
-            },
+                email: ""
+            }
         },
         fields: {
-            billingDetails: "auto",
+            billingDetails: "auto"
         },
         wallets: {
             applePay: "auto",
-            googlePay: "auto",
-        },
+            googlePay: "auto"
+        }
     };
     const howItWorksSteps = [
         {
             number: 1,
-            description: "Enter your payment details securely using Stripe's encrypted form",
+            description: "Enter your payment details securely using Stripe's encrypted form"
         },
         {
             number: 2,
-            description: "Your payment is processed instantly and securely through our payment partner",
+            description: "Your payment is processed instantly and securely through our payment partner"
         },
         {
             number: 3,
-            description: "After payment confirmation, your order will be processed and completed automatically",
-        },
+            description: "After payment confirmation, your order will be processed and completed automatically"
+        }
     ];
     return (_jsxs("div", { className: "relative my-8 flex w-full flex-1 flex-col items-center justify-center", children: [_jsxs("form", { onSubmit: handleSubmit, className: "w-full space-y-6", children: [_jsxs("div", { className: "bg-as-on-surface-1 w-full rounded-2xl p-6", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "bg-as-brand/20 flex h-8 w-8 shrink-0 items-center justify-center rounded-full", children: _jsx("svg", { className: "text-as-brand h-4 w-4", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: _jsx("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M12 15v2m-6 4h12a2 2 0 002-2v-6a2 2 0 00-2-2H6a2 2 0 00-2 2v6a2 2 0 002 2zm10-10V7a4 4 0 00-8 0v4h8z" }) }) }), _jsxs("div", { children: [_jsx("div", { className: "text-as-primary text-sm font-medium", children: "Secured by Stripe" }), _jsx("div", { className: "text-as-primary/50 text-xs", children: "End-to-end encrypted payment" })] })] }), _jsxs("button", { type: "button", onClick: () => setShowHowItWorks(true), className: "text-as-primary/60 hover:text-as-primary flex items-center gap-1 text-xs transition-colors", children: [_jsx(HelpCircle, { className: "h-4 w-4" }), _jsx("span", { children: "How it works" })] })] }), amount && (_jsxs("div", { className: "border-as-stroke border-t pt-4", children: [_jsx("div", { className: "text-as-primary/50 mb-3 text-sm", children: "Payment Breakdown" }), (() => {
                                         const originalAmount = Number(order.srcAmount) / 10 ** USDC_BASE.decimals;

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

@@ -1,5 +1,5 @@
 import { Token } from "../../../../anyspend";
-export declare function TokenBalance({ token, walletAddress, onChangeInput, }: {
+export declare function TokenBalance({ token, walletAddress, onChangeInput }: {
     token: Token;
     walletAddress: string | undefined;
     onChangeInput: (value: string) => void;

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

@@ -1,10 +1,10 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { useTokenBalance } from "../../../../global-account/react/index.js";
 import { formatUnits } from "viem";
-export function TokenBalance({ token, walletAddress, onChangeInput, }) {
+export function TokenBalance({ token, walletAddress, onChangeInput }) {
     const { rawBalance, formattedBalance, isLoading } = useTokenBalance({
         token,
-        address: walletAddress,
+        address: walletAddress
     });
     const handlePercentageClick = (percentage) => {
         if (!rawBalance)