@b3dotfun/sdk 0.0.7 → 0.0.8

package/dist/cjs/anyspend/react/components/AnySpendStakeB3.js

@@ -6,9 +6,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.AnySpendStakeB3 = AnySpendStakeB3;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const anyspend_1 = require("../../../anyspend");
-const EthIcon_1 = require("./icons/EthIcon");
-const SolIcon_1 = require("./icons/SolIcon");
-const USDCIcon_1 = require("./icons/USDCIcon");
 const react_1 = require("../../../global-account/react");
 const number_1 = require("../../../shared/utils/number");
 const framer_motion_1 = require("framer-motion");
@@ -20,9 +17,12 @@ const viem_1 = require("viem");
 const chains_1 = require("viem/chains");
 const wagmi_1 = require("wagmi");
 const AnySpendCustom_1 = require("./AnySpendCustom");
+const EthIcon_1 = require("./icons/EthIcon");
+const SolIcon_1 = require("./icons/SolIcon");
+const USDCIcon_1 = require("./icons/USDCIcon");
 const basePublicClient = (0, viem_1.createPublicClient)({
     chain: chains_1.base,
-    transport: (0, viem_1.http)()
+    transport: (0, viem_1.http)(),
 });
 const ERC20Staking = "0xbf04200be3cbf371467a539706393c81c470f523";
 function generateEncodedDataForStakingB3(amount, beneficiary) {
@@ -30,16 +30,16 @@ function generateEncodedDataForStakingB3(amount, beneficiary) {
     const encodedData = (0, viem_1.encodeFunctionData)({
         abi: anyspend_1.ABI_ERC20_STAKING,
         functionName: "stake",
-        args: [BigInt(amount), beneficiary]
+        args: [BigInt(amount), beneficiary],
     });
     return encodedData;
 }
-function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipientAddress, stakeAmount, onSuccess }) {
+function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipientAddress, stakeAmount, onSuccess, }) {
     const hasMounted = (0, react_1.useHasMounted)();
     const { setB3ModalOpen } = (0, react_1.useModalStore)();
     // Fetch B3 token balance
-    const { formattedBalance: b3Balance, isLoading: isBalanceLoading, rawBalance: b3RawBalance } = (0, react_1.useTokenBalance)({
-        token: anyspend_1.B3_TOKEN
+    const { formattedBalance: b3Balance, isLoading: isBalanceLoading, rawBalance: b3RawBalance, } = (0, react_1.useTokenBalance)({
+        token: anyspend_1.B3_TOKEN,
     });
     // Wagmi hooks for direct staking
     const { address } = (0, wagmi_1.useAccount)();
@@ -53,8 +53,8 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
     const { isLoading: isTxPending, isSuccess: isTxSuccess } = (0, wagmi_1.useWaitForTransactionReceipt)({
         hash: stakingTxHash,
         query: {
-            structuralSharing: false // Disable to avoid BigInt serialization issues
-        }
+            structuralSharing: false, // Disable to avoid BigInt serialization issues
+        },
     });
     // Show success modal when transaction is confirmed
     (0, react_2.useEffect)(() => {
@@ -154,7 +154,7 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
                     address: anyspend_1.B3_TOKEN.address,
                     abi: viem_1.erc20Abi,
                     functionName: "allowance",
-                    args: [address, ERC20Staking]
+                    args: [address, ERC20Staking],
                 });
                 // If allowance is insufficient, request approval
                 if (allowance < BigInt(userStakeAmount)) {
@@ -163,7 +163,7 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
                         address: anyspend_1.B3_TOKEN.address,
                         abi: viem_1.erc20Abi,
                         functionName: "approve",
-                        args: [ERC20Staking, BigInt(userStakeAmount)]
+                        args: [ERC20Staking, BigInt(userStakeAmount)],
                     });
                     sonner_1.toast.info("Approval confirmed. Proceeding with stake...");
                 }
@@ -173,7 +173,7 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
                     address: ERC20Staking,
                     abi: anyspend_1.ABI_ERC20_STAKING,
                     functionName: "stake",
-                    args: [BigInt(userStakeAmount), recipientAddress]
+                    args: [BigInt(userStakeAmount), recipientAddress],
                 });
                 setStakingTxHash(stakeHash);
                 sonner_1.toast.success("Staking transaction submitted!");
@@ -214,18 +214,18 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
         return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background flex w-full flex-col items-center", children: [(0, jsx_runtime_1.jsxs)("div", { className: "w-full px-4", children: [(0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
                                     opacity: hasMounted ? 1 : 0,
                                     y: hasMounted ? 0 : 20,
-                                    filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
                                 }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "relative mx-auto size-48", children: (0, jsx_runtime_1.jsx)("video", { autoPlay: true, muted: true, playsInline: true, className: "size-full", src: "https://cdn.b3.fun/b3-sphere-to-coin.mp4" }) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
                                     opacity: hasMounted ? 1 : 0,
                                     y: hasMounted ? 0 : 20,
-                                    filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
                                 }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsx)("h2", { className: "font-sf-rounded font-neue-montreal-medium mb-1 text-center text-2xl font-semibold", children: (() => {
                                         const hasEnoughBalance = b3RawBalance && BigInt(debouncedUserStakeAmount || "0") <= b3RawBalance;
                                         return hasEnoughBalance || !debouncedAmount ? "Stake B3" : "Swap & Stake B3";
                                     })() }) })] }), (0, jsx_runtime_1.jsxs)(framer_motion_1.motion.div, { initial: false, animate: {
                             opacity: hasMounted ? 1 : 0,
                             y: hasMounted ? 0 : 20,
-                            filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                            filter: hasMounted ? "blur(0px)" : "blur(10px)",
                         }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: "bg-b3-react-background w-full p-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-as-primary/70 text-sm font-medium", children: "I want to stake" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary/50 flex items-center gap-1 text-sm", children: ["Available: ", isBalanceLoading ? (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-3 w-3 animate-spin" }) : `${b3Balance} B3`] })] }) }), (0, jsx_runtime_1.jsxs)("div", { className: "relative", children: [(0, jsx_runtime_1.jsx)(react_1.Input, { onFocus: onFocusStakeAmountInput, type: "text", placeholder: "0.00", value: displayAmount, onChange: e => validateAndSetAmount(e.target.value), className: `h-14 px-4 text-lg ${!isAmountValid && displayAmount ? "border-as-red" : "border-b3-react-border"}` }), (0, jsx_runtime_1.jsx)("div", { className: "font-pack absolute right-4 top-1/2 -translate-y-1/2 text-lg font-medium text-blue-500/70", children: "B3" })] }), !isAmountValid && displayAmount && (0, jsx_runtime_1.jsx)("p", { className: "text-as-red mt-2 text-sm", children: validationError }), (0, jsx_runtime_1.jsx)("div", { className: "mt-4", children: (() => {
                                     const hasEnoughBalance = b3RawBalance && BigInt(debouncedUserStakeAmount || "0") <= b3RawBalance;
                                     if (!hasEnoughBalance || !debouncedAmount) {
@@ -240,15 +240,15 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
         return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background flex w-full flex-col items-center", children: [(0, jsx_runtime_1.jsxs)("div", { className: "w-full p-4", children: [(0, jsx_runtime_1.jsxs)(framer_motion_1.motion.div, { initial: false, animate: {
                                     opacity: hasMounted ? 1 : 0,
                                     y: hasMounted ? 0 : 20,
-                                    filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
                                 }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "relative mx-auto mb-4 size-[120px]", children: [(0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 scale-95 rounded-[50%] bg-black/30 blur-md" }), (0, jsx_runtime_1.jsxs)(react_1.GlareCardRounded, { className: "overflow-hidden rounded-full border-none", children: [(0, jsx_runtime_1.jsx)("img", { alt: "b3 coin", loading: "lazy", width: "64", height: "64", decoding: "async", "data-nimg": "1", className: "size-full shrink-0 bg-transparent text-transparent", src: "https://cdn.b3.fun/b3-coin-3d.png" }), (0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 rounded-[50%] border border-white/10" })] })] }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
                                     opacity: hasMounted ? 1 : 0,
                                     y: hasMounted ? 0 : 20,
-                                    filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
                                 }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, children: (0, jsx_runtime_1.jsxs)("h2", { className: "font-sf-rounded mb-1 text-center text-2xl font-semibold", children: ["Staked ", (0, number_1.formatTokenAmount)(BigInt(userStakeAmount), 18), " B3"] }) })] }), (0, jsx_runtime_1.jsxs)(framer_motion_1.motion.div, { initial: false, animate: {
                             opacity: hasMounted ? 1 : 0,
                             y: hasMounted ? 0 : 20,
-                            filter: hasMounted ? "blur(0px)" : "blur(10px)"
+                            filter: hasMounted ? "blur(0px)" : "blur(10px)",
                         }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: "bg-b3-react-background w-full p-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "mb-6", children: (0, jsx_runtime_1.jsx)("a", { href: `https://basescan.org/tx/${stakingTxHash}`, target: "_blank", rel: "noopener noreferrer", className: "text-as-primary/70 hover:text-as-primary block break-all text-center font-mono text-sm underline transition-colors", children: "View transaction" }) }), (0, jsx_runtime_1.jsx)(react_1.Button, { onClick: () => {
                                     setB3ModalOpen(false);
                                     onSuccess?.();
@@ -256,6 +256,7 @@ function AnySpendStakeB3({ isMainnet = true, loadOrder, mode = "modal", recipien
     }
     const encodedData = generateEncodedDataForStakingB3(userStakeAmount, recipientAddress);
     return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { isMainnet: isMainnet, loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, orderType: anyspend_1.OrderType.Custom, dstChainId: chains_1.base.id, dstToken: anyspend_1.B3_TOKEN, dstAmount: userStakeAmount, contractAddress: ERC20Staking, encodedData: encodedData, metadata: {
-            action: "stake B3"
+            type: anyspend_1.OrderType.Custom,
+            action: "stake B3",
         }, header: header, onSuccess: onSuccess, showRecipient: true }));
 }

package/dist/cjs/anyspend/react/components/AnySpendTournament.js

@@ -8,11 +8,14 @@ const number_1 = require("../../../shared/utils/number");
 const framer_motion_1 = require("framer-motion");
 const AnySpendCustom_1 = require("./AnySpendCustom");
 function AnySpendTournament(props) {
-    const { isMainnet = true, mode = "modal", action, loadOrder, tournamentChainId, tournamentContractAddress, tournamentMetadata, onSuccess } = props;
+    const { isMainnet = true, mode = "modal", action, loadOrder, tournamentChainId, tournamentContractAddress, tournamentMetadata, onSuccess, } = props;
     const dstToken = action === "join" ? props.tournamentEntryToken : props.tournamentFundToken;
     const dstAmount = action === "join" ? props.tournamentEntryFee : props.tournamentFundAmount;
-    const header = ({ anyspendPrice, isLoadingAnyspendPrice }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "z-10 mt-[-100px] flex h-[270px] w-full items-end justify-center", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/tournament-play.svg", alt: "Tournament Play", className: "h-[200px] w-[360px] object-cover object-center" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "from-b3-react-background to-as-on-surface-1 mt-[-100px] w-full rounded-t-lg bg-gradient-to-t", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[100px] w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center gap-1 p-6 pt-0", children: [(0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-center text-lg font-semibold", children: [action === "join" ? "Pay entry fee to join " : "Pay to fund ", " ", tournamentMetadata.name] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-2 flex w-fit items-center gap-1", children: anyspendPrice ? ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { mode: "wait", children: (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-primary group flex items-center text-2xl font-semibold transition-all", {
-                                            "opacity-0": isLoadingAnyspendPrice
+    const header = ({ anyspendPrice, isLoadingAnyspendPrice, }) => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "z-10 mt-[-100px] flex h-[270px] w-full items-end justify-center", children: (0, jsx_runtime_1.jsx)("img", { src: "https://cdn.b3.fun/tournament-play.svg", alt: "Tournament Play", className: "h-[200px] w-[360px] object-cover object-center" }) }), (0, jsx_runtime_1.jsxs)("div", { className: "from-b3-react-background to-as-on-surface-1 mt-[-100px] w-full rounded-t-lg bg-gradient-to-t", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[100px] w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center gap-1 p-6 pt-0", children: [(0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-center text-lg font-semibold", children: [action === "join" ? "Pay entry fee to join " : "Pay to fund ", " ", tournamentMetadata.name] }), (0, jsx_runtime_1.jsx)("div", { className: "mt-2 flex w-fit items-center gap-1", children: anyspendPrice ? ((0, jsx_runtime_1.jsx)(framer_motion_1.AnimatePresence, { mode: "wait", children: (0, jsx_runtime_1.jsxs)("div", { className: (0, utils_1.cn)("text-as-primary group flex items-center text-2xl font-semibold transition-all", {
+                                            "opacity-0": isLoadingAnyspendPrice,
                                         }), children: [(0, number_1.formatDisplayNumber)(anyspendPrice?.data?.currencyIn?.amountUsd, { style: "currency" }), " (", (0, number_1.formatTokenAmount)(BigInt(dstAmount), dstToken.decimals, 6, true), " ", dstToken.symbol, ")"] }) })) : ((0, jsx_runtime_1.jsx)("div", { className: "h-[32px] w-full" })) })] })] })] }));
-    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { isMainnet: isMainnet, loadOrder: loadOrder, mode: mode, recipientAddress: action === "join" ? props.joinFor : undefined, orderType: action === "join" ? anyspend_1.OrderType.JoinTournament : anyspend_1.OrderType.FundTournament, dstChainId: tournamentChainId, dstToken: dstToken, dstAmount: dstAmount, contractAddress: tournamentContractAddress, encodedData: "0x", metadata: { tournament: tournamentMetadata }, header: header, onSuccess: onSuccess, showRecipient: action === "join" }));
+    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { isMainnet: isMainnet, loadOrder: loadOrder, mode: mode, recipientAddress: action === "join" ? props.joinFor : undefined, orderType: action === "join" ? anyspend_1.OrderType.JoinTournament : anyspend_1.OrderType.FundTournament, dstChainId: tournamentChainId, dstToken: dstToken, dstAmount: dstAmount, contractAddress: tournamentContractAddress, encodedData: "0x", metadata: {
+            type: action === "join" ? anyspend_1.OrderType.JoinTournament : anyspend_1.OrderType.FundTournament,
+            tournament: tournamentMetadata,
+        }, header: header, onSuccess: onSuccess, showRecipient: action === "join" }));
 }

package/dist/cjs/anyspend/react/components/AnyspendSignatureMint.d.ts

@@ -0,0 +1,8 @@
+import { GenerateSigMintResponse } from "../../types/signature-mint";
+export declare function AnyspendSignatureMint({ loadOrder, mode, signatureData, imageUrl, onSuccess, }: {
+    loadOrder?: string;
+    mode?: "modal" | "page";
+    signatureData: GenerateSigMintResponse;
+    imageUrl?: string;
+    onSuccess?: (txHash?: string) => void;
+}): import("react/jsx-runtime").JSX.Element;

package/dist/cjs/anyspend/react/components/AnyspendSignatureMint.js

@@ -0,0 +1,77 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AnyspendSignatureMint = AnyspendSignatureMint;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const anyspend_1 = require("../../../anyspend");
+const react_1 = require("../../../global-account/react");
+const debug_1 = __importDefault(require("../../../shared/utils/debug"));
+const react_2 = require("react");
+const viem_1 = require("viem");
+const signature_minting_1 = require("../../abis/signature-minting");
+const AnySpendCustom_1 = require("./AnySpendCustom");
+// Helper function to determine if URL is a video
+function isVideoURL(url) {
+    const videoExtensions = [".mp4", ".webm", ".ogg"];
+    return videoExtensions.some(ext => url.toLowerCase().endsWith(ext));
+}
+function generateEncodedDataForSignatureMint(signatureData) {
+    const { signature, payload } = signatureData;
+    (0, debug_1.default)(signature, "Signature is required");
+    (0, debug_1.default)(payload, "Payload is required");
+    const mintRequest = {
+        to: payload.to,
+        royaltyRecipient: payload.royaltyRecipient,
+        royaltyBps: BigInt(payload.royaltyBps || 0),
+        primarySaleRecipient: payload.primarySaleRecipient,
+        tokenId: BigInt(payload.tokenId || 0),
+        uri: payload.uri,
+        quantity: BigInt(payload.quantity || 1),
+        pricePerToken: (0, viem_1.parseEther)(payload.price?.toString() || "0"),
+        currency: payload.currencyAddress,
+        validityStartTimestamp: BigInt(payload.mintStartTime || 0),
+        validityEndTimestamp: BigInt(payload.mintEndTime || 0),
+        uid: payload.uid,
+    };
+    const encodedData = (0, viem_1.encodeFunctionData)({
+        abi: [signature_minting_1.ABI_SIGNATURE_MINTING[0]],
+        functionName: "mintWithSignature",
+        args: [mintRequest, signature],
+    });
+    return encodedData;
+}
+function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, imageUrl, onSuccess, }) {
+    const hasMounted = (0, react_1.useHasMounted)();
+    // Get token data
+    const { data: tokenData, isError: isTokenError } = (0, react_1.useTokenData)(signatureData.collection.chainId, signatureData.collection.signatureRequestBody?.currency);
+    // Convert token data to AnySpend Token type
+    const dstToken = (0, react_2.useMemo)(() => {
+        if (!tokenData)
+            return null;
+        return {
+            address: tokenData.address,
+            chainId: signatureData.collection.chainId,
+            name: tokenData.name,
+            symbol: tokenData.symbol,
+            decimals: tokenData.decimals,
+            metadata: {
+                logoURI: tokenData.logoURI,
+            },
+        };
+    }, [tokenData, signatureData.collection.chainId]);
+    const mediaUrl = imageUrl || signatureData.payload.metadata.image || "https://cdn.b3.fun/nft-placeholder.png";
+    const isVideo = isVideoURL(mediaUrl);
+    const header = () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "relative mx-auto size-32", children: isVideo ? ((0, jsx_runtime_1.jsxs)("video", { autoPlay: true, loop: true, muted: true, playsInline: true, className: "size-full rounded-lg object-cover", children: [(0, jsx_runtime_1.jsx)("source", { src: mediaUrl, type: `video/${mediaUrl.split(".").pop()}` }), "Your browser does not support the video tag."] })) : ((0, jsx_runtime_1.jsx)("img", { alt: "nft preview", className: "size-full rounded-lg object-cover", src: mediaUrl })) }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-[-60px] w-full rounded-t-lg bg-white", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[60px] w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "mb-1 flex w-full flex-col items-center gap-2 p-5", children: (0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-2xl font-semibold", children: [signatureData.payload.metadata.name || "Mint NFT", " ", Number(signatureData.payload.quantity) > 1 ? `(${signatureData.payload.quantity}x)` : ""] }) })] })] }));
+    // If we don't have token data, show error state
+    if (!dstToken || isTokenError) {
+        return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: "b3-root b3-modal bg-b3-react-background flex w-full flex-col items-center p-8", children: (0, jsx_runtime_1.jsxs)("p", { className: "text-as-red text-center text-sm", children: ["Failed to fetch payment token information for ", signatureData.collection.signatureRequestBody?.currency, " on chain ", signatureData.collection.chainId, ". Please try again."] }) }) }));
+    }
+    const encodedData = generateEncodedDataForSignatureMint(signatureData);
+    const price = (0, viem_1.parseEther)(signatureData.payload.price?.toString() || "0");
+    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { isMainnet: true, loadOrder: loadOrder, mode: mode, recipientAddress: signatureData.payload.to, orderType: anyspend_1.OrderType.Custom, dstChainId: signatureData.collection.chainId, dstToken: dstToken, dstAmount: price.toString(), contractAddress: signatureData.collection.address, encodedData: encodedData, metadata: {
+            type: anyspend_1.OrderType.Custom,
+            action: "Signature Mint",
+        }, header: header, onSuccess: onSuccess, showRecipient: true }));
+}

package/dist/cjs/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/cjs/anyspend/react/components/common/ChainTokenIcon.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ChainTokenIcon = ChainTokenIcon;
 const jsx_runtime_1 = require("react/jsx-runtime");
-function ChainTokenIcon({ chainUrl, tokenUrl, className = "" }) {
+function ChainTokenIcon({ chainUrl, tokenUrl, className = "", }) {
     return ((0, jsx_runtime_1.jsxs)("div", { className: `relative ${className}`, children: [(0, jsx_runtime_1.jsx)("img", { src: tokenUrl, alt: "Token", className: "h-full w-full rounded-full" }), (0, jsx_runtime_1.jsx)("div", { className: "bg-as-on-surface-1 border-as-stroke absolute bottom-0 right-0 h-[45%] w-[45%] rounded border", children: (0, jsx_runtime_1.jsx)("img", { src: chainUrl, alt: "Chain", className: "h-full w-full rounded" }) })] }));
 }

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

@@ -8,6 +8,7 @@ exports.OrderDetailsLoadingView = exports.OrderDetails = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const anyspend_1 = require("../../../../anyspend");
 const react_1 = require("../../../../global-account/react");
+const hooks_1 = require("../../../../shared/react/hooks");
 const utils_1 = require("../../../../shared/utils");
 const centerTruncate_1 = __importDefault(require("../../../../shared/utils/centerTruncate"));
 const number_1 = require("../../../../shared/utils/number");
@@ -15,7 +16,6 @@ const react_2 = require("@chakra-ui/react");
 const react_3 = require("@web3icons/react");
 const framer_motion_1 = require("framer-motion");
 const lucide_react_1 = require("lucide-react");
-const navigation_1 = require("next/navigation");
 const qrcode_react_1 = require("qrcode.react");
 const react_4 = require("react");
 const react_timeago_1 = __importDefault(require("react-timeago"));
@@ -25,7 +25,7 @@ const chains_1 = require("viem/chains");
 const wagmi_1 = require("wagmi");
 const PaymentVendorUI_1 = __importDefault(require("./PaymentVendorUI"));
 // 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) {
@@ -120,9 +120,9 @@ function roundTokenAmount(amount) {
     const roundedDecimalPart = digits.join("");
     return `${wholePart}.${roundedDecimalPart}`;
 }
-exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, onBack }) {
-    const router = (0, navigation_1.useRouter)();
-    const searchParams = (0, navigation_1.useSearchParams)();
+exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode = "modal", order, depositTxs, relayTx, executeTx, refundTxs, onBack, }) {
+    const router = (0, hooks_1.useRouter)();
+    const searchParams = (0, hooks_1.useSearchParams)();
     const setB3ModalOpen = (0, react_1.useModalStore)(state => state.setB3ModalOpen);
     const srcToken = anyspend_1.zToken.parse(order.metadata.srcToken);
     const dstToken = anyspend_1.zToken.parse(order.metadata.dstToken);
@@ -137,21 +137,6 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
     const [showQRCode, setShowQRCode] = (0, react_4.useState)(false);
     const { isLoading: txLoading, isSuccess: txSuccess } = (0, wagmi_1.useWaitForTransactionReceipt)({ hash: txHash });
     const { switchChainAndExecute, isSwitchingOrExecuting } = (0, react_1.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 } = (0, react_2.useColorMode)();
     const roundedUpSrcAmount = (0, react_4.useMemo)(() => {
         // Display the full transfer amount without rounding since users need to see the exact value they're transferring.
@@ -168,31 +153,6 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
             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 ((0, anyspend_1.isNativeToken)(order.srcTokenAddress)) {
@@ -200,7 +160,7 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                 account: signer,
                 chain: anyspend_1.EVM_CHAINS[order.srcChain].viem,
                 to: order.globalAddress,
-                value: BigInt(order.srcAmount)
+                value: BigInt(order.srcAmount),
             });
             setTxHash(hash);
         }
@@ -211,7 +171,7 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                 address: order.srcTokenAddress,
                 abi: viem_1.erc20Abi,
                 functionName: "transfer",
-                args: [order.globalAddress, BigInt(order.srcAmount)]
+                args: [order.globalAddress, BigInt(order.srcAmount)],
             });
             setTxHash(hash);
         }
@@ -223,10 +183,29 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
     };
     // When waitingForDeposit is true, we show a message to the user to wait for the deposit to be processed.
     const setWaitingForDeposit = (0, react_4.useCallback)(() => {
-        const params = new URLSearchParams(searchParams);
+        const params = new URLSearchParams(searchParams.toString());
         params.set("waitingForDeposit", "true");
         router.push(`?${params}`);
     }, [router, searchParams]);
+    // Clean up URL parameters before closing modal or navigating back
+    const cleanupUrlParams = (0, react_4.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 = (0, react_4.useCallback)(() => {
+        cleanupUrlParams();
+        setB3ModalOpen(false);
+    }, [cleanupUrlParams, setB3ModalOpen]);
+    const handleBack = (0, react_4.useCallback)(() => {
+        cleanupUrlParams();
+        onBack?.();
+    }, [cleanupUrlParams, onBack]);
     (0, react_4.useEffect)(() => {
         if (txSuccess) {
             sonner_1.toast.success("Transaction successful! We are processing your order.", { duration: 10000 });
@@ -274,14 +253,18 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
     };
     if (refundTxs) {
         return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(framer_motion_1.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 => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `Received ${(0, number_1.formatTokenAmount)(BigInt(dTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTx, isProcessing: false }, dTx.txHash)))
+                            ? depositTxs.map(dTx => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === anyspend_1.OnrampVendor.StripeWeb2
+                                    ? `Received payment`
+                                    : `Received ${(0, number_1.formatTokenAmount)(BigInt(dTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTx, isProcessing: false }, dTx.txHash)))
                             : null, refundTxs
                             ? refundTxs.map(rTx => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `Refunded ${(0, number_1.formatTokenAmount)(BigInt(rTx.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: rTx, isProcessing: false }, rTx.txHash)))
-                            : null] }), order.errorDetails && ((0, jsx_runtime_1.jsx)("div", { className: "flex justify-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50 text-center text-sm", style: { maxWidth: "40ch" }, children: (0, anyspend_1.getErrorDisplay)(order.errorDetails) }) })), (0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }));
+                            : null] }), order.errorDetails && ((0, jsx_runtime_1.jsx)("div", { className: "flex justify-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50 text-center text-sm", style: { maxWidth: "40ch" }, children: (0, anyspend_1.getErrorDisplay)(order.errorDetails) }) })), (0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") })] }));
     }
     if (executeTx) {
         return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(framer_motion_1.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 => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
+                            ? depositTxs.map(dTxs => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === anyspend_1.OnrampVendor.StripeWeb2
+                                    ? `Received payment`
+                                    : `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
                             : null, (0, jsx_runtime_1.jsx)(TransactionDetails, { title: "Processed Transaction", chainId: order.srcChain, tx: relayTx, delay: 0.5, isProcessing: false }), (0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.type === anyspend_1.OrderType.Swap
                                 ? "Processed Swap"
                                 : order.type === anyspend_1.OrderType.MintNFT
@@ -296,12 +279,14 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                                     formattedActualDstAmount: formattedActualDstAmount,
                                     dstToken,
                                     recipientName,
-                                    centerTruncate: centerTruncate_1.default
-                                }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === anyspend_1.OrderType.JoinTournament && order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: () => setB3ModalOpen(false), children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4", children: "Continue to Tournament" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })), order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
+                                    centerTruncate: centerTruncate_1.default,
+                                }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === anyspend_1.OrderType.JoinTournament && order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: handleCloseModal, children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4", children: "Continue to Tournament" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })), order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
     }
     if (relayTx && relayTx.status === "success") {
         return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative mt-4 flex w-full flex-col gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(framer_motion_1.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 => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
+                            ? depositTxs.map(dTxs => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === anyspend_1.OnrampVendor.StripeWeb2
+                                    ? `Received payment`
+                                    : `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: false }, dTxs.txHash)))
                             : null, order.srcChain === order.dstChain ? ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.type === anyspend_1.OrderType.Swap
                                 ? "Processed Swap"
                                 : order.type === anyspend_1.OrderType.MintNFT
@@ -324,13 +309,15 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                                     formattedActualDstAmount,
                                     dstToken,
                                     recipientName,
-                                    centerTruncate: centerTruncate_1.default
-                                }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === anyspend_1.OrderType.JoinTournament && order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: () => setB3ModalOpen(false), children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4", children: "Continue to Tournament" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })), order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.Home, { className: "ml-2 h-4 w-4" })] })) : ("Close") }))] }));
+                                    centerTruncate: centerTruncate_1.default,
+                                }), (0, jsx_runtime_1.jsx)(lucide_react_1.ExternalLink, { className: "ml-2 h-4 w-4" })] }) }) }), order.type === anyspend_1.OrderType.JoinTournament && order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-full items-center gap-2", disabled: txLoading || isSwitchingOrExecuting, onClick: handleCloseModal, children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4", children: "Continue to Tournament" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })), order.status === anyspend_1.OrderStatus.Executed && ((0, jsx_runtime_1.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" ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Return to Home ", (0, jsx_runtime_1.jsx)(lucide_react_1.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 ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", { className: "relative mt-4 flex w-full flex-col gap-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(framer_motion_1.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) => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: index < (depositTxs || []).length - 1 ? false : !depositEnoughAmount }, dTxs.txHash))), statusDisplay === "failure" ? ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: statusText, chainId: order.srcChain, tx: null, isProcessing: false, delay: 0.5 })) : depositEnoughAmount ? ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.type === anyspend_1.OrderType.Swap
+        return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsxs)("div", { className: "relative mt-4 flex w-full flex-col gap-6", children: [(0, jsx_runtime_1.jsx)("div", { className: "bg-b3-react-background absolute bottom-2 left-4 top-2 z-[5] w-2", children: (0, jsx_runtime_1.jsx)(framer_motion_1.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) => ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === anyspend_1.OnrampVendor.StripeWeb2
+                            ? `Received payment`
+                            : `Received ${(0, number_1.formatTokenAmount)(BigInt(dTxs.amount), srcToken.decimals)} ${srcToken.symbol}`, chainId: order.srcChain, tx: dTxs, isProcessing: index < (depositTxs || []).length - 1 ? false : !depositEnoughAmount }, dTxs.txHash))), statusDisplay === "failure" ? ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: statusText, chainId: order.srcChain, tx: null, isProcessing: false, delay: 0.5 })) : depositEnoughAmount ? ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.type === anyspend_1.OrderType.Swap
                             ? "Processing Swap"
                             : order.type === anyspend_1.OrderType.MintNFT
                                 ? "Minting NFT"
@@ -338,13 +325,15 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                                     ? "Joining Tournament"
                                     : order.type === anyspend_1.OrderType.FundTournament
                                         ? "Funding Tournament"
-                                        : "Processing Transaction", chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 })) : ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: `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 })) : ((0, jsx_runtime_1.jsx)(TransactionDetails, { title: order.onrampMetadata?.vendor === anyspend_1.OnrampVendor.StripeWeb2
+                            ? `Waiting for payment`
+                            : `Waiting for deposit ${formattedDepositDeficit} ${srcToken.symbol}`, chainId: order.srcChain, tx: null, isProcessing: true, delay: 0.5 }))] }) }));
     }
     return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [statusDisplay === "failure" && ((0, jsx_runtime_1.jsx)("div", { className: "flex w-full flex-col items-center gap-3 whitespace-nowrap pb-2 text-sm", children: (0, jsx_runtime_1.jsx)("div", { className: "bg-as-light-brand/20 flex w-full flex-col gap-4 rounded-lg p-8", children: (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary", style: { whiteSpace: "normal" }, children: "This order is no longer valid because the order expired." }) }) })), statusDisplay === "processing" && ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [order.onrampMetadata ? ((0, jsx_runtime_1.jsx)(PaymentVendorUI_1.default, { isMainnet: isMainnet, order: order, dstTokenSymbol: dstToken.symbol })) : ((0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-1 flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50", children: "Please send" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-wrap items-center gap-6 sm:justify-between sm:gap-0", children: [(0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: roundedUpSrcAmount, onCopy: () => {
                                                     sonner_1.toast.success("Copied to clipboard");
                                                 }, children: (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("strong", { className: "border-as-brand text-as-primary border-b-2 pb-1 text-2xl font-semibold sm:text-xl", children: [roundedUpSrcAmount, " ", srcToken.symbol] }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "text-as-primary/50 hover:text-as-primary h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), (0, jsx_runtime_1.jsxs)(react_1.Badge, { variant: "outline", className: "flex h-10 items-center gap-2 px-3 py-1 pr-2 text-sm", children: ["on ", (0, anyspend_1.getChainName)(order.srcChain), (0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.srcChain].logoUrl, alt: (0, anyspend_1.getChainName)(order.srcChain), className: (0, utils_1.cn)("h-6 rounded-full", order.srcChain === chains_1.b3.id && "h-5 rounded-none") })] })] }), (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/50 mb-1 mt-2", children: " to the address:" })] }), (0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: order.globalAddress, onCopy: () => {
                                     sonner_1.toast.success("Copied to clipboard");
-                                }, children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), account?.address && !showQRCode ? ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Transaction Pending", (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) }), (0, jsx_runtime_1.jsxs)("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to: ", (0, centerTruncate_1.default)(account?.address || "", 6)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: colorMode === "dark" ? "#ffffff" : "#000000", className: "flex w-5/6 items-center gap-2 sm:px-0", onClick: () => setShowQRCode(true), children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from a different wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-primary/30 text-xs", children: "& more" })] })] })] })) : ((0, jsx_runtime_1.jsxs)(framer_motion_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [(0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: (0, anyspend_1.getPaymentUrl)(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === anyspend_1.RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress), size: 200 }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), (0, jsx_runtime_1.jsxs)(react_1.TextLoop, { interval: 3, children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [account && ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "ghost", className: "text-as-primary w-full", onClick: handlePayment, children: ["Send Transaction ", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "ml-2 h-4 w-4" })] })), anyspend_1.EVM_CHAINS[order.srcChain] ? ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: handlePayment, children: ["Open Metamask", (0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "ml-2 h-5 w-5", variant: "branded" })] })) : null, (0, jsx_runtime_1.jsx)("a", { href: handleCoinbaseRedirect(), children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Open Coinbase", (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "ml-2 h-5 w-5", variant: "branded" })] }) }), (0, jsx_runtime_1.jsx)("a", { href: handlePhantomRedirect(), children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Open Phantom", (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "ml-2 h-5 w-5", variant: "branded" })] }) })] })] }))] })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-light-brand/30 w-full rounded-lg p-4 sm:p-2 sm:px-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary mb-3 text-sm", children: "Continue on another device?" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: permalink, onCopy: () => {
+                                }, children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background border-b3-react-border hover:border-as-brand group flex cursor-pointer items-center justify-between gap-4 rounded-lg border p-3 px-4 shadow-md transition-all duration-200", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap text-sm", children: order.globalAddress }), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "group-hover:text-as-brand text-as-primary/50 h-5 w-5 cursor-pointer transition-all duration-200" })] }) }), account?.address && !showQRCode ? ((0, jsx_runtime_1.jsxs)("div", { className: "mb-4 mt-8 flex w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_1.ShinyButton, { accentColor: "hsl(var(--as-brand))", textColor: "text-white", className: "flex w-5/6 items-center gap-2 sm:px-0", disabled: txLoading || isSwitchingOrExecuting, onClick: handlePayment, children: txLoading ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: ["Transaction Pending", (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "ml-2 h-5 w-5 animate-spin" })] })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from Connected Wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] })) }), (0, jsx_runtime_1.jsxs)("span", { className: "label-style text-as-primary/50 text-xs", children: ["Connected to: ", (0, centerTruncate_1.default)(account?.address || "", 6)] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsxs)(react_1.ShinyButton, { accentColor: colorMode === "dark" ? "#ffffff" : "#000000", className: "flex w-5/6 items-center gap-2 sm:px-0", onClick: () => setShowQRCode(true), children: [(0, jsx_runtime_1.jsx)("span", { className: "pl-4 text-lg md:text-sm", children: "Pay from a different wallet" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "h-4 w-4" })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-primary/30 text-xs", children: "& more" })] })] })] })) : ((0, jsx_runtime_1.jsxs)(framer_motion_1.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: [(0, jsx_runtime_1.jsxs)("div", { className: "mt-8 flex flex-col items-center rounded-lg bg-white p-6 pb-3", children: [(0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: (0, anyspend_1.getPaymentUrl)(order.globalAddress, BigInt(order.srcAmount), order.srcTokenAddress === anyspend_1.RELAY_ETH_ADDRESS ? "ETH" : order.srcTokenAddress), className: "max-w-[200px]" }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-3 flex items-center justify-center gap-2 text-sm", children: [(0, jsx_runtime_1.jsx)("span", { className: "label-style text-as-brand/70 text-sm", children: "Scan with" }), (0, jsx_runtime_1.jsxs)(react_1.TextLoop, { interval: 3, children: [(0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletTrust, { className: "h-5 w-5", variant: "branded" }), (0, jsx_runtime_1.jsx)(react_3.WalletWalletConnect, { className: "h-5 w-5", variant: "branded" })] })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col gap-2", children: [account && ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "ghost", className: "text-as-primary w-full", onClick: handlePayment, children: ["Send Transaction ", (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronRight, { className: "ml-2 h-4 w-4" })] })), anyspend_1.EVM_CHAINS[order.srcChain] ? ((0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: handlePayment, children: ["Open Metamask", (0, jsx_runtime_1.jsx)(react_3.WalletMetamask, { className: "ml-2 h-5 w-5", variant: "branded" })] })) : null, (0, jsx_runtime_1.jsx)("a", { href: handleCoinbaseRedirect(), children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Open Coinbase", (0, jsx_runtime_1.jsx)(react_3.WalletCoinbase, { className: "ml-2 h-5 w-5", variant: "branded" })] }) }), (0, jsx_runtime_1.jsx)("a", { href: handlePhantomRedirect(), children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Open Phantom", (0, jsx_runtime_1.jsx)(react_3.WalletPhantom, { className: "ml-2 h-5 w-5", variant: "branded" })] }) })] })] }))] })), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-light-brand/30 w-full rounded-lg p-4 sm:p-2 sm:px-4", children: [(0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary mb-3 text-sm", children: "Continue on another device?" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: permalink, onCopy: () => {
                                             sonner_1.toast.success("Copied to clipboard");
                                         }, children: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", children: ["Copy Link", (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "ml-2 h-3 w-3" })] }) }), (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", className: "w-full", onClick: () => {
                                             if (navigator.share) {
@@ -352,7 +341,7 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                                                     .share({
                                                     title: "Complete Deposit",
                                                     text: "Complete your deposit on BSMNT.fun",
-                                                    url: permalink
+                                                    url: permalink,
                                                 })
                                                     .catch(error => console.log("Error sharing:", error));
                                             }
@@ -371,11 +360,11 @@ exports.OrderDetails = (0, react_4.memo)(function OrderDetails({ isMainnet, mode
                                                         : "Contract execution"
                                                     : "" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-end gap-2", children: [order.type === anyspend_1.OrderType.Swap ? (`~${formattedExpectedDstAmount} ${dstToken.symbol}`) : order.type === anyspend_1.OrderType.MintNFT ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("img", { src: nft?.imageUrl, alt: nft?.name || "NFT", className: "h-5 w-5" }), (0, jsx_runtime_1.jsx)("div", { children: nft?.name || "NFT" })] })) : order.type === anyspend_1.OrderType.JoinTournament || order.type === anyspend_1.OrderType.FundTournament ? ((0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)("img", { src: tournament?.imageUrl, alt: tournament?.name || "Tournament", className: "h-5 w-5" }), (0, jsx_runtime_1.jsx)("div", { children: tournament?.name || "Tournament" })] })) : null, (0, jsx_runtime_1.jsxs)("div", { className: "text-as-primary/50 flex items-center gap-2", children: [(0, jsx_runtime_1.jsxs)("span", { children: ["on ", order.dstChain !== chains_1.b3.id && (0, anyspend_1.getChainName)(order.dstChain)] }), (0, jsx_runtime_1.jsx)("img", { src: anyspend_1.ALL_CHAINS[order.dstChain].logoUrl, alt: (0, anyspend_1.getChainName)(order.dstChain), className: (0, utils_1.cn)("h-3", order.dstChain !== chains_1.b3.id && "w-3 rounded-full", order.dstChain === chains_1.b3.id && "h-4") })] })] })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full justify-between gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/30", children: "Order ID" }), (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary overflow-hidden text-ellipsis whitespace-nowrap", children: order.id })] }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full justify-between gap-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/30", children: "Recipient" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-end gap-1", children: [recipientName && (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary font-semibold", children: recipientName }), (0, jsx_runtime_1.jsx)(react_1.CopyToClipboard, { text: order.recipientAddress, onCopy: () => {
                                                 sonner_1.toast.success("Copied recipient address to clipboard");
-                                            }, children: (0, jsx_runtime_1.jsxs)("div", { className: "text-as-primary flex items-center gap-2", children: [(0, centerTruncate_1.default)(order.recipientAddress, 10), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 cursor-pointer transition-all duration-200" })] }) })] })] })] }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsx)("button", { className: "whitespace-nowrap text-sm", onClick: () => setShowOrderDetails(true), children: "Order Details" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "text-as-primary mx-1 h-4 min-h-4 w-4 min-w-4" }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" })] })), (0, jsx_runtime_1.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 ", (0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCcw, { className: "ml-2 h-4 w-4" })] })] }));
+                                            }, children: (0, jsx_runtime_1.jsxs)("div", { className: "text-as-primary flex items-center gap-2", children: [(0, centerTruncate_1.default)(order.recipientAddress, 10), (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "text-as-primary/50 hover:text-as-primary h-4 w-4 cursor-pointer transition-all duration-200" })] }) })] })] })] }) })) : ((0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center", children: [(0, jsx_runtime_1.jsx)("div", { className: "divider w-full" }), (0, jsx_runtime_1.jsx)("button", { className: "whitespace-nowrap text-sm", onClick: () => setShowOrderDetails(true), children: "Order Details" }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronDown, { className: "text-as-primary mx-1 h-4 min-h-4 w-4 min-w-4" }), (0, jsx_runtime_1.jsx)("div", { className: "divider w-full" })] })), (0, jsx_runtime_1.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 ", (0, jsx_runtime_1.jsx)(lucide_react_1.RefreshCcw, { className: "ml-2 h-4 w-4" })] })] }));
 });
-function TransactionDetails({ title, chainId, tx, isProcessing, delay }) {
+function TransactionDetails({ title, chainId, tx, isProcessing, delay, }) {
     return ((0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full flex-1 items-center justify-between gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex grow items-center gap-4", children: [(0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { className: "bg-b3-react-background relative h-10 w-10 rounded-full", children: isProcessing ? ((0, jsx_runtime_1.jsx)(framer_motion_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "text-as-primary h-4 w-4 animate-spin" }) })) : ((0, jsx_runtime_1.jsx)(framer_motion_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.CheckIcon, { className: "text-as-primary h-3 w-3" }) })) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, transition: { duration: 0.3, ease: "easeInOut", delay }, className: "shrink-0 text-base", children: isProcessing ? ((0, jsx_runtime_1.jsx)(react_1.TextShimmer, { duration: 1, children: title })) : ((0, jsx_runtime_1.jsx)("span", { className: "text-as-primary", children: title })) })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-col gap-1", children: tx ? ((0, jsx_runtime_1.jsx)(framer_motion_1.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: (0, jsx_runtime_1.jsx)("a", { href: (0, anyspend_1.getExplorerTxUrl)(chainId, tx.txHash), target: "_blank", children: (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/30 font-mono text-xs", children: (0, centerTruncate_1.default)(tx?.txHash, 6) }) }) })) : null })] }));
 }
 exports.OrderDetailsLoadingView = ((0, jsx_runtime_1.jsxs)("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-4", children: [(0, jsx_runtime_1.jsxs)(react_1.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: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "text-as-primary h-4 w-4 animate-spin" }), (0, jsx_runtime_1.jsx)(react_1.TextShimmer, { duration: 1, className: "font-sf-rounded text-base font-semibold", children: "Loading..." })] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-1 flex-col", children: [(0, jsx_runtime_1.jsxs)("div", { className: "mb-4 flex flex-col gap-1", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-4 w-24" }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex items-center gap-2", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-8 w-48" }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "ml-4 h-8 w-32" })] }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "mt-4 h-8 w-24" })] }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "mb-4 h-12 w-full" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full items-center justify-between gap-4", children: [(0, jsx_runtime_1.jsxs)(react_1.Skeleton, { className: "rounded-lg p-6 pb-3", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[200px] w-[200px]" }), (0, jsx_runtime_1.jsx)("div", { className: "mt-3 flex items-center justify-center gap-2", children: (0, jsx_runtime_1.jsx)("div", { className: "h-5 w-5 rounded-full" }) })] }), (0, jsx_runtime_1.jsx)("div", { className: "flex flex-1 flex-col gap-2", children: [1, 2, 3].map(i => ((0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-10 w-full" }, i))) })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background mt-8 w-full rounded-lg p-4", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "mb-3 h-4 w-48" }), (0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-4", children: [(0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-10 flex-1" }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-10 flex-1" })] })] }), (0, jsx_runtime_1.jsx)(react_1.Skeleton, { className: "h-10 w-full" })] }));