@b3dotfun/sdk 0.0.87-alpha.0 → 0.0.87-alpha.1

package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.d.ts

@@ -24,9 +24,9 @@ interface UseAnyspendFlowProps {
     destinationTokenChainId?: number;
     slippage?: number;
     disableUrlParamManagement?: boolean;
-    orderType?: "hype_duel" | "custom_exact_in";
+    orderType?: "hype_duel" | "custom_exact_in" | "swap";
 }
-export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrder, isDepositMode, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, destinationTokenAddress, destinationTokenChainId, slippage, disableUrlParamManagement, orderType, }: UseAnyspendFlowProps): {
+export declare function useAnyspendFlow({ paymentType, recipientAddress, loadOrder, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, destinationTokenAddress, destinationTokenChainId, slippage, disableUrlParamManagement, orderType, }: UseAnyspendFlowProps): {
     activePanel: PanelView;
     setActivePanel: import("react").Dispatch<import("react").SetStateAction<PanelView>>;
     orderId: string | undefined;

package/dist/cjs/anyspend/react/hooks/useAnyspendFlow.js

@@ -28,7 +28,7 @@ var PanelView;
     PanelView[PanelView["FEE_DETAIL"] = 7] = "FEE_DETAIL";
 })(PanelView || (exports.PanelView = PanelView = {}));
 // This hook serves for order hype_duel and custom_exact_in
-function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder, isDepositMode = false, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, destinationTokenAddress, destinationTokenChainId, slippage = 0, disableUrlParamManagement = false, orderType = "hype_duel", }) {
+function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder, onOrderSuccess, onTransactionSuccess, sourceTokenAddress, sourceTokenChainId, destinationTokenAddress, destinationTokenChainId, slippage = 0, disableUrlParamManagement = false, orderType = "hype_duel", }) {
     const searchParams = (0, react_2.useSearchParamsSSR)();
     const router = (0, react_2.useRouter)();
     // Panel and order state
@@ -135,16 +135,40 @@ function useAnyspendFlow({ paymentType = "crypto", recipientAddress, loadOrder,
     // For fiat payments, always use USDC decimals (6) regardless of selectedSrcToken
     const effectiveDecimals = paymentType === "fiat" ? anyspend_1.USDC_BASE.decimals : selectedSrcToken.decimals;
     const activeInputAmountInWei = (0, viem_1.parseUnits)(srcAmount.replace(/,/g, ""), effectiveDecimals).toString();
-    const { anyspendQuote, isLoadingAnyspendQuote, getAnyspendQuoteError } = (0, react_1.useAnyspendQuote)({
-        srcChain: paymentType === "fiat" ? chains_1.base.id : selectedSrcChainId,
-        dstChain: isDepositMode ? chains_1.base.id : selectedDstChainId, // For deposits, always Base; for swaps, use selected destination
-        srcTokenAddress: paymentType === "fiat" ? anyspend_1.USDC_BASE.address : selectedSrcToken.address,
-        dstTokenAddress: selectedDstToken.address,
-        type: orderType,
-        amount: activeInputAmountInWei,
-        recipientAddress: effectiveRecipientAddress,
-        onrampVendor: paymentType === "fiat" ? getOnrampVendor(selectedFiatPaymentMethod) : undefined,
-    });
+    // Build quote request based on order type
+    const quoteRequest = (() => {
+        const baseParams = {
+            srcChain: paymentType === "fiat" ? chains_1.base.id : selectedSrcChainId,
+            dstChain: selectedDstChainId ?? chains_1.base.id,
+            srcTokenAddress: paymentType === "fiat" ? anyspend_1.USDC_BASE.address : selectedSrcToken.address,
+            dstTokenAddress: selectedDstToken.address,
+            recipientAddress: effectiveRecipientAddress,
+            onrampVendor: paymentType === "fiat" ? getOnrampVendor(selectedFiatPaymentMethod) : undefined,
+        };
+        if (orderType === "swap") {
+            return {
+                ...baseParams,
+                type: "swap",
+                tradeType: "EXACT_INPUT",
+                amount: activeInputAmountInWei,
+            };
+        }
+        else if (orderType === "hype_duel") {
+            return {
+                ...baseParams,
+                type: "hype_duel",
+                amount: activeInputAmountInWei,
+            };
+        }
+        else {
+            return {
+                ...baseParams,
+                type: "custom_exact_in",
+                amount: activeInputAmountInWei,
+            };
+        }
+    })();
+    const { anyspendQuote, isLoadingAnyspendQuote, getAnyspendQuoteError } = (0, react_1.useAnyspendQuote)(quoteRequest);
     // Get geo options for fiat
     const { geoData, coinbaseAvailablePaymentMethods, stripeWeb2Support } = (0, react_1.useGeoOnrampOptions)(paymentType === "fiat" ? (0, number_1.formatUnits)(activeInputAmountInWei, anyspend_1.USDC_BASE.decimals) : "0");
     // Update destination amount when quote changes

package/dist/cjs/anyspend/react/hooks/useCreateDepositFirstOrder.d.ts

@@ -0,0 +1,24 @@
+import { components } from "../../../anyspend/types/api";
+import { DepositContractConfig } from "../components/AnySpendDeposit";
+export type CreateDepositFirstOrderParams = {
+    recipientAddress: string;
+    srcChain: number;
+    dstChain: number;
+    srcToken: components["schemas"]["Token"];
+    dstToken: components["schemas"]["Token"];
+    creatorAddress?: string;
+    /** Optional contract config for custom execution after deposit */
+    contractConfig?: DepositContractConfig;
+};
+export type UseCreateDepositFirstOrderProps = {
+    onSuccess?: (data: any) => void;
+    onError?: (error: Error) => void;
+};
+/**
+ * Hook for creating deposit_first orders in the Anyspend protocol.
+ * This order type doesn't require srcAmount - the user deposits tokens after the order is created.
+ */
+export declare function useCreateDepositFirstOrder({ onSuccess, onError }?: UseCreateDepositFirstOrderProps): {
+    createOrder: import("@tanstack/react-query").UseMutateFunction<any, Error, CreateDepositFirstOrderParams, unknown>;
+    isCreatingOrder: boolean;
+};

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

@@ -0,0 +1,86 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useCreateDepositFirstOrder = useCreateDepositFirstOrder;
+const anyspend_1 = require("../../../anyspend/services/anyspend");
+const utils_1 = require("../../../anyspend/utils");
+const react_1 = require("../../../global-account/react");
+const fingerprintjs_pro_react_1 = require("@fingerprintjs/fingerprintjs-pro-react");
+const react_query_1 = require("@tanstack/react-query");
+const react_2 = require("react");
+/**
+ * Hook for creating deposit_first orders in the Anyspend protocol.
+ * This order type doesn't require srcAmount - the user deposits tokens after the order is created.
+ */
+function useCreateDepositFirstOrder({ onSuccess, onError } = {}) {
+    const { partnerId } = (0, react_1.useB3)();
+    const { data: fpData } = (0, fingerprintjs_pro_react_1.useVisitorData)({ extendedResult: true }, { immediate: true });
+    const visitorData = fpData && {
+        requestId: fpData.requestId,
+        visitorId: fpData.visitorId,
+    };
+    const { mutate: createOrder, isPending } = (0, react_query_1.useMutation)({
+        mutationFn: async (params) => {
+            const { recipientAddress, srcChain, dstChain, srcToken, dstToken, creatorAddress, contractConfig } = params;
+            // Build payload based on whether we have a contract config
+            const payload = contractConfig
+                ? {
+                    functionAbi: contractConfig.functionAbi,
+                    functionName: contractConfig.functionName,
+                    functionArgs: contractConfig.functionArgs,
+                    to: (0, utils_1.normalizeAddress)(contractConfig.to),
+                    spenderAddress: contractConfig.spenderAddress ? (0, utils_1.normalizeAddress)(contractConfig.spenderAddress) : undefined,
+                    action: contractConfig.action,
+                }
+                : {};
+            try {
+                return await anyspend_1.anyspendService.createOrder({
+                    recipientAddress: (0, utils_1.normalizeAddress)(recipientAddress),
+                    type: "deposit_first",
+                    srcChain,
+                    dstChain,
+                    srcTokenAddress: (0, utils_1.normalizeAddress)(srcToken.address),
+                    dstTokenAddress: (0, utils_1.normalizeAddress)(dstToken.address),
+                    srcAmount: "", // Not required for deposit_first
+                    payload,
+                    metadata: {
+                        srcToken: {
+                            chainId: srcToken.chainId,
+                            address: srcToken.address,
+                            symbol: srcToken.symbol,
+                            name: srcToken.name,
+                            decimals: srcToken.decimals,
+                            metadata: srcToken.metadata || {},
+                        },
+                        dstToken: {
+                            chainId: dstToken.chainId,
+                            address: dstToken.address,
+                            symbol: dstToken.symbol,
+                            name: dstToken.name,
+                            decimals: dstToken.decimals,
+                            metadata: dstToken.metadata || {},
+                        },
+                    },
+                    creatorAddress: creatorAddress ? (0, utils_1.normalizeAddress)(creatorAddress) : undefined,
+                    partnerId,
+                    visitorData,
+                });
+            }
+            catch (error) {
+                if (error?.data) {
+                    throw error.data;
+                }
+                throw error;
+            }
+        },
+        onSuccess: (data) => {
+            onSuccess?.(data);
+        },
+        onError: (error) => {
+            onError?.(error);
+        },
+    });
+    return (0, react_2.useMemo)(() => ({
+        createOrder,
+        isCreatingOrder: isPending,
+    }), [createOrder, isPending]);
+}

package/dist/cjs/anyspend/utils/format.js

@@ -1,13 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.getErrorDisplay = exports.getStatusDisplay = void 0;
+const number_1 = require("../../shared/utils/number");
 const getStatusDisplay = (order) => {
+    const srcToken = order.metadata?.srcToken;
+    const dstToken = order.metadata?.dstToken;
+    const formattedSrcAmount = srcToken ? (0, number_1.formatTokenAmount)(BigInt(order.srcAmount), srcToken.decimals) : undefined;
+    const actualDstAmount = order.settlement?.actualDstAmount;
+    const formattedActualDstAmount = actualDstAmount && dstToken ? (0, number_1.formatTokenAmount)(BigInt(actualDstAmount), dstToken.decimals) : undefined;
     switch (order.status) {
-        case "scanning_deposit_transaction":
+        case "scanning_deposit_transaction": {
+            const depositText = formattedSrcAmount && srcToken
+                ? `Awaiting ${formattedSrcAmount} ${srcToken.symbol}`
+                : order.onrampMetadata
+                    ? "Awaiting Payment"
+                    : "Awaiting Deposit";
             return {
-                text: order.onrampMetadata ? "Awaiting Payment" : "Awaiting Deposit",
+                text: depositText,
                 status: "processing",
             };
+        }
         case "waiting_stripe_payment":
             return {
                 text: "Awaiting Payment",
@@ -30,15 +42,16 @@ const getStatusDisplay = (order) => {
                 description: "It will take approximately one minute to complete.",
             };
         case "executed": {
+            const receivedText = formattedActualDstAmount && dstToken ? `Received ${formattedActualDstAmount} ${dstToken.symbol}` : undefined;
             const { text, description } = order.type === "swap"
-                ? { text: "Swap Complete", description: "Your swap has been completed successfully." }
+                ? { text: receivedText || "Swap Complete", description: "Your swap has been completed successfully." }
                 : order.type === "mint_nft"
                     ? { text: "NFT Minted", description: "Your NFT has been minted" }
                     : order.type === "join_tournament"
                         ? { text: "Tournament Joined", description: "You have joined the tournament" }
                         : order.type === "fund_tournament"
                             ? { text: "Tournament Funded", description: "You have funded the tournament" }
-                            : { text: "Order Complete", description: "Your order has been completed" };
+                            : { text: receivedText || "Order Complete", description: "Your order has been completed" };
             return { text, status: "success", description };
         }
         case "refunding":
@@ -51,8 +64,18 @@ const getStatusDisplay = (order) => {
                 status: "failure",
                 description: "This order has failed. Please try again or contact support.",
             };
+        case "quoting_after_deposit": {
+            return {
+                text: "Quoting After Deposit",
+                status: "processing",
+                description: "Getting quote for the order",
+            };
+        }
         default:
-            throw new Error("Invalid order status");
+            return {
+                text: order.status,
+                status: "processing",
+            };
     }
 };
 exports.getStatusDisplay = getStatusDisplay;

package/dist/cjs/global-account/react/stores/useModalStore.d.ts

@@ -144,6 +144,10 @@ export interface AnySpendModalProps extends BaseModalProps {
     customUsdInputValues?: string[];
     /** Client-provided reference ID for tracking orders */
     clientReferenceId?: string;
+    /** Whether to hide the header */
+    hideHeader?: boolean;
+    /** When true, disables URL parameter management for swap configuration */
+    disableUrlParamManagement?: boolean;
 }
 /**
  * Props for the AnySpend NFT modal

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

@@ -20,6 +20,7 @@ export declare enum PanelView {
 export declare function AnySpend(props: {
     mode?: "page" | "modal";
     defaultActiveTab?: "crypto" | "fiat";
+    sourceChainId?: number;
     destinationTokenAddress?: string;
     destinationTokenChainId?: number;
     recipientAddress?: string;
@@ -34,4 +35,8 @@ export declare function AnySpend(props: {
     }) => void;
     onSuccess?: (txHash?: string) => void;
     customUsdInputValues?: string[];
+    hideHeader?: boolean;
+    hideBottomNavigation?: boolean;
+    /** When true, disables URL parameter management for swap configuration */
+    disableUrlParamManagement?: boolean;
 }): import("react/jsx-runtime").JSX.Element;

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

@@ -50,7 +50,7 @@ export function AnySpend(props) {
     const fingerprintConfig = getFingerprintConfig();
     return (_jsx(AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: _jsx(AnySpendInner, { ...props }) }));
 }
-function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, onSuccess, customUsdInputValues, }) {
+function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, onSuccess, customUsdInputValues, hideHeader, hideBottomNavigation = false, disableUrlParamManagement = false, }) {
     const searchParams = useSearchParamsSSR();
     const router = useRouter();
     const { partnerId } = useB3();
@@ -90,7 +90,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
     // const [newRecipientAddress, setNewRecipientAddress] = useState("");
     // const recipientInputRef = useRef<HTMLInputElement>(null);
     // Get initial chain IDs from URL or defaults
-    const initialSrcChainId = parseInt(searchParams.get("fromChainId") || "0") || mainnet.id;
+    const initialSrcChainId = sourceChainId || parseInt(searchParams.get("fromChainId") || "0") || mainnet.id;
     const initialDstChainId = parseInt(searchParams.get("toChainId") || "0") || (isBuyMode ? destinationTokenChainId : base.id);
     // State for source chain/token selection
     const [selectedSrcChainId, setSelectedSrcChainId] = useState(initialSrcChainId);
@@ -183,8 +183,8 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
     }, [selectedDstToken.address, selectedDstToken.chainId]);
     // Load swap configuration from URL on initial render
     useEffect(() => {
-        // Skip if we've already processed the URL or if we have an order to load
-        if (initialUrlProcessed.current || loadOrder)
+        // Skip if we've already processed the URL, if we have an order to load, or if URL param management is disabled
+        if (initialUrlProcessed.current || loadOrder || disableUrlParamManagement)
             return;
         try {
             const tabParam = searchParams.get("tab");
@@ -217,7 +217,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
         }
         // Mark that we've processed the initial URL
         initialUrlProcessed.current = true;
-    }, [searchParams, loadOrder]);
+    }, [searchParams, loadOrder, disableUrlParamManagement]);
     // Update URL when swap configuration changes - but not on initial load
     const updateSwapParamsInURL = useCallback(() => {
         // Skip if:
@@ -228,7 +228,8 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
             activePanel !== PanelView.MAIN ||
             !initialUrlProcessed.current ||
             searchParams.has("orderId") ||
-            mode === "modal")
+            mode === "modal" ||
+            disableUrlParamManagement)
             return;
         // Create a representation of the current state
         const currentState = {
@@ -288,6 +289,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
         dstAmount,
         router,
         srcAmountOnRamp,
+        disableUrlParamManagement,
     ]);
     // Update URL when relevant state changes - but only after initial render
     useEffect(() => {
@@ -473,20 +475,20 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
             setOrderId(orderId);
             // setNewRecipientAddress("");
             navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-            // Debug: Check payment method before setting URL
-            console.log("Creating order - selectedCryptoPaymentMethod:", selectedCryptoPaymentMethod);
-            // Add orderId and payment method to URL for persistence
-            const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
-            params.set("orderId", orderId);
-            if (effectiveCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-                console.log("Setting cryptoPaymentMethod in URL:", effectiveCryptoPaymentMethod);
-                params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
-            }
-            else {
-                console.log("Payment method is NONE, not setting in URL");
+            if (!disableUrlParamManagement) {
+                // Debug: Check payment method before setting URL
+                console.log("Creating order - selectedCryptoPaymentMethod:", selectedCryptoPaymentMethod);
+                // Add orderId and payment method to URL for persistence
+                const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
+                params.set("orderId", orderId);
+                if (effectiveCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+                    params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
+                }
+                else {
+                    console.log("Payment method is NONE, not setting in URL");
+                }
+                router.push(`${window.location.pathname}?${params.toString()}`);
             }
-            console.log("Final URL params:", params.toString());
-            router.push(`${window.location.pathname}?${params.toString()}`);
         },
         onError: error => {
             console.error(error);
@@ -499,11 +501,13 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
             const orderId = data.data.id;
             setOrderId(orderId);
             navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-            // Add orderId and payment method to URL for persistence
-            const params = new URLSearchParams(searchParams.toString());
-            params.set("orderId", orderId);
-            params.set("paymentMethod", "fiat");
-            router.push(`${window.location.pathname}?${params.toString()}`);
+            if (!disableUrlParamManagement) {
+                // Add orderId and payment method to URL for persistence
+                const params = new URLSearchParams(searchParams.toString());
+                params.set("orderId", orderId);
+                params.set("paymentMethod", "fiat");
+                router.push(`${window.location.pathname}?${params.toString()}`);
+            }
         },
         onError: error => {
             console.error(error);
@@ -631,11 +635,13 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
             type: "anySpendOrderHistory",
             showBackButton: false,
         });
-        // Remove orderId and paymentMethod from URL when going back to history
-        const params = new URLSearchParams(searchParams.toString());
-        params.delete("orderId");
-        params.delete("paymentMethod");
-        router.push(`${window.location.pathname}?${params.toString()}`);
+        if (!disableUrlParamManagement) {
+            // Remove orderId and paymentMethod from URL when going back to history
+            const params = new URLSearchParams(searchParams.toString());
+            params.delete("orderId");
+            params.delete("paymentMethod");
+            router.push(`${window.location.pathname}?${params.toString()}`);
+        }
     };
     // Handle crypto swap creation
     const handleCryptoSwap = async (method) => {
@@ -744,22 +750,24 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
     // const setDynamicModalContentType = useModalStore(state => state.setB3ModalContentType);
     // Update useEffect for URL parameter to not override loadOrder
     useEffect(() => {
-        if (loadOrder)
-            return; // Skip if we have a loadOrder
+        if (loadOrder || disableUrlParamManagement)
+            return; // Skip if we have a loadOrder or URL param management is disabled
         const orderIdParam = searchParams.get("orderId");
         if (orderIdParam) {
             setOrderId(orderIdParam);
             setActivePanel(PanelView.ORDER_DETAILS);
         }
-    }, [searchParams, loadOrder]);
+    }, [searchParams, loadOrder, disableUrlParamManagement]);
     const onSelectOrder = (selectedOrderId) => {
         setOrderId(selectedOrderId);
         navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-        // Update URL with the new orderId and preserve existing parameters
-        const params = new URLSearchParams(searchParams.toString());
-        params.set("orderId", selectedOrderId);
-        // Keep existing paymentMethod if present
-        router.push(`${window.location.pathname}?${params.toString()}`);
+        if (!disableUrlParamManagement) {
+            // Update URL with the new orderId and preserve existing parameters
+            const params = new URLSearchParams(searchParams.toString());
+            params.set("orderId", selectedOrderId);
+            // Keep existing paymentMethod if present
+            router.push(`${window.location.pathname}?${params.toString()}`);
+        }
     };
     // Save custom recipients to local storage when they change
     useEffect(() => {
@@ -811,7 +819,7 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
                     // Reset payment methods when going back
                     resetPaymentMethods();
                 } })) }) }));
-    const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2 pt-5", children: [_jsxs("div", { className: "flex w-full max-w-full flex-col items-center gap-2 px-5", children: [isBuyMode && (_jsxs("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && (_jsx("div", { className: "relative", children: _jsx("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), _jsx("div", { children: _jsxs("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), _jsx(TabSection, { activeTab: activeTab, setActiveTab: tab => {
+    const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2 pt-5", children: [_jsxs("div", { className: "flex w-full max-w-full flex-col items-center gap-2 px-5", children: [isBuyMode && !hideHeader && (_jsxs("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: [selectedDstToken.metadata?.logoURI && (_jsx("div", { className: "relative", children: _jsx("img", { src: selectedDstToken.metadata.logoURI, alt: selectedDstToken.symbol, className: "border-as-stroke h-12 w-12 rounded-full border-2 shadow-md" }) })), _jsx("div", { children: _jsxs("h1", { className: "text-as-primary text-xl font-bold", children: ["Buy ", selectedDstToken.symbol] }) })] })), _jsx(TabSection, { activeTab: activeTab, setActiveTab: tab => {
                             setActiveTab(tab);
                             // Reset payment methods when switching tabs
                             resetPaymentMethods();
@@ -866,21 +874,23 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
                                 type: "anySpend",
                             });
                         }
-                    }, children: mode !== "page" && _jsx(BottomNavigation, {}) }) })] }));
+                    }, children: mode !== "page" && !hideBottomNavigation && _jsx(BottomNavigation, {}) }) })] }));
     const onrampPaymentView = (_jsx(PanelOnrampPayment, { srcAmountOnRamp: srcAmountOnRamp, recipientName: recipientName || undefined, recipientAddress: effectiveRecipientAddress, isBuyMode: isBuyMode, destinationTokenChainId: destinationTokenChainId, destinationTokenAddress: destinationTokenAddress, selectedDstChainId: selectedDstChainId, selectedDstToken: selectedDstToken, orderType: "swap", anyspendQuote: anyspendQuote, globalAddress: globalAddress, onOrderCreated: orderId => {
             setOrderId(orderId);
             navigateToPanel(PanelView.ORDER_DETAILS, "forward");
-            // Add orderId and payment method to URL for persistence
-            const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
-            params.set("orderId", orderId);
-            // For fiat payments, the payment method is always fiat (but we use the active tab context)
-            if (activeTab === "fiat") {
-                params.set("paymentMethod", "fiat");
-            }
-            else if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-                params.set("paymentMethod", selectedCryptoPaymentMethod);
+            if (!disableUrlParamManagement) {
+                // Add orderId and payment method to URL for persistence
+                const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
+                params.set("orderId", orderId);
+                // For fiat payments, the payment method is always fiat (but we use the active tab context)
+                if (activeTab === "fiat") {
+                    params.set("paymentMethod", "fiat");
+                }
+                else if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+                    params.set("paymentMethod", selectedCryptoPaymentMethod);
+                }
+                router.push(`${window.location.pathname}?${params.toString()}`);
             }
-            router.push(`${window.location.pathname}?${params.toString()}`);
         }, onBack: navigateBack, recipientEnsName: globalWallet?.ensName, recipientImageUrl: globalWalletImage }));
     const recipientSelectionView = (_jsx(RecipientSelection, { initialValue: effectiveRecipientAddress || "", onBack: navigateBack, onConfirm: address => {
             // User manually selected a recipient

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

@@ -26,7 +26,7 @@ export interface AnySpendCustomExactInProps {
     customUsdInputValues?: string[];
     preferEoa?: boolean;
     customExactInConfig?: CustomExactInConfig;
-    orderType?: "hype_duel" | "custom_exact_in";
+    orderType?: "hype_duel" | "custom_exact_in" | "swap";
     minDestinationAmount?: number;
     header?: ({ anyspendPrice, isLoadingAnyspendPrice, }: {
         anyspendPrice: GetQuoteResponse | undefined;

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

@@ -35,7 +35,6 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
         paymentType,
         recipientAddress,
         loadOrder,
-        isDepositMode: true,
         onTransactionSuccess: onSuccess,
         sourceTokenAddress,
         sourceTokenChainId,
@@ -176,7 +175,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
         }
     };
     const headerContent = header ? (header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote })) : (_jsx("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: _jsxs("div", { children: [_jsx("h1", { className: "text-as-primary text-xl font-bold", children: actionLabel }), _jsx("p", { className: "text-as-secondary text-sm", children: "Pay from any token to execute a custom exact-in transaction." })] }) }));
-    const mainView = (_jsxs("div", { className: "mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: cn("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
+    const mainView = (_jsxs("div", { className: "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, _jsx("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: _jsxs("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? (_jsx(CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : (_jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, children: _jsx(PanelOnramp, { srcAmountOnRamp: srcAmount, setSrcAmountOnRamp: setSrcAmount, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: setActivePanel, _recipientAddress: selectedRecipientOrDefault, destinationToken: selectedDstToken, destinationChainId: selectedDstChainId, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, hideDstToken: true, destinationAmount: dstAmount, onDestinationTokenChange: () => { }, onDestinationChainChange: () => { }, fiatPaymentMethodIndex: PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues }) })), _jsx("div", { className: cn("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: _jsx(Button, { variant: "ghost", className: cn("swap-direction-button border-as-stroke bg-as-surface-primary z-10 h-10 w-10 cursor-default rounded-xl border-2 sm:h-8 sm:w-8 sm:rounded-xl"), children: _jsx("div", { className: "relative flex items-center justify-center transition-opacity", children: _jsx(ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && (_jsx(CryptoReceiveSection, { isDepositMode: false, isBuyMode: true, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, onSelectRecipient: () => setActivePanel(PanelView.RECIPIENT_SELECTION), dstAmount: dstAmount, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
                                 setIsSrcInputDirty(false);
                                 setSrcAmount(value);
                             }, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(PanelView.FEE_DETAIL) }))] }) }), _jsx(motion.div, { initial: { opacity: 0, y: 20, filter: "blur(10px)" }, animate: { opacity: 1, y: 0, filter: "blur(0px)" }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: cn("mt-4 flex w-full max-w-[460px] flex-col gap-2"), children: _jsx(ShinyButton, { accentColor: "hsl(var(--as-brand))", disabled: btnInfo.disable, onClick: onMainButtonClick, className: cn("as-main-button relative w-full", btnInfo.error ? "!bg-as-red" : btnInfo.disable ? "!bg-as-on-surface-2" : "!bg-as-brand"), textClassName: cn(btnInfo.error ? "text-white" : btnInfo.disable ? "text-as-secondary" : "text-white"), children: _jsxs("div", { className: "flex items-center justify-center gap-2", children: [btnInfo.loading && _jsx(Loader2, { className: "h-4 w-4 animate-spin" }), btnInfo.text] }) }) }), mainFooter ? mainFooter : null] }));