@b3dotfun/sdk 0.1.65 → 0.1.66-alpha.1

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

@@ -53,4 +53,6 @@ export declare function AnySpend(props: {
     allowDirectTransfer?: boolean;
     /** Fixed destination token amount (in wei/smallest unit). When provided, user cannot change the amount. */
     destinationTokenAmount?: string;
+    /** Opaque metadata passed to the order for callbacks (e.g., workflow form data) */
+    callbackMetadata?: Record<string, unknown>;
 }): import("react/jsx-runtime").JSX.Element;

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

@@ -25,6 +25,7 @@ const useAutoSelectCryptoPaymentMethod_1 = require("../hooks/useAutoSelectCrypto
 const useConnectedWalletDisplay_1 = require("../hooks/useConnectedWalletDisplay");
 const useCryptoPaymentMethodState_1 = require("../hooks/useCryptoPaymentMethodState");
 const useDirectTransfer_1 = require("../hooks/useDirectTransfer");
+const useOnOrderSuccess_1 = require("../hooks/useOnOrderSuccess");
 const useRecipientAddressState_1 = require("../hooks/useRecipientAddressState");
 const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
 const CryptoPaymentMethod_1 = require("./common/CryptoPaymentMethod");
@@ -61,7 +62,7 @@ function AnySpend(props) {
     console.log("[mitch] AnySpend rendered with fingerprintConfig:", props, fingerprintConfig);
     return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendInner, { ...props }) }));
 }
-function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, onSuccess, customUsdInputValues, hideHeader, hideBottomNavigation = false, disableUrlParamManagement = false, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, destinationTokenAmount, }) {
+function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationTokenChainId, mode = "modal", defaultActiveTab = "crypto", loadOrder, hideTransactionHistoryButton, recipientAddress: recipientAddressFromProps, onTokenSelect, onSuccess, customUsdInputValues, hideHeader, hideBottomNavigation = false, disableUrlParamManagement = false, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, destinationTokenAmount, callbackMetadata, }) {
     const searchParams = (0, react_2.useSearchParamsSSR)();
     const router = (0, react_2.useRouter)();
     const { partnerId } = (0, react_2.useB3Config)();
@@ -72,8 +73,6 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
     // Add refs to track URL state
     const initialUrlProcessed = (0, react_4.useRef)(false);
     const lastUrlUpdate = (0, react_4.useRef)(null);
-    // Track if onSuccess has been called for the current order
-    const onSuccessCalled = (0, react_4.useRef)(false);
     // Track animation direction for TransitionPanel
     const animationDirection = (0, react_4.useRef)(null);
     // Track previous panel for proper back navigation
@@ -493,18 +492,8 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
             }
         }
     }, [anyspendQuote, isSrcInputDirty, destinationTokenAmount]);
-    (0, react_4.useEffect)(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            console.log("Calling onSuccess");
-            const txHash = oat?.data?.executeTx?.txHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
-    // Reset flag when orderId changes
-    (0, react_4.useEffect)(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    // Call onSuccess when order is executed
+    (0, useOnOrderSuccess_1.useOnOrderSuccess)({ orderData: oat, orderId, onSuccess });
     const { createOrder, isCreatingOrder } = (0, react_1.useAnyspendCreateOrder)({
         onSuccess: data => {
             const orderId = data.data.id;
@@ -731,6 +720,7 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
                 srcAmount: srcAmountBigInt.toString(),
                 expectedDstAmount: anyspendQuote?.data?.currencyOut?.amount || "0",
                 creatorAddress: globalAddress,
+                callbackMetadata,
             });
         }
         catch (err) {
@@ -805,6 +795,7 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
                 },
                 expectedDstAmount: anyspendQuote?.data?.currencyOut?.amount?.toString() || "0",
                 creatorAddress: globalAddress,
+                callbackMetadata,
             });
         }
         catch (err) {
@@ -891,7 +882,7 @@ function AnySpendInner({ sourceChainId, destinationTokenAddress, destinationToke
                             // Reset payment methods when switching tabs
                             resetPaymentMethods();
                             setSelectedFiatPaymentMethod(FiatPaymentMethod_1.FiatPaymentMethod.NONE);
-                        }, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => navigateToPanel(PanelView.CRYPTO_PAYMENT_METHOD, "forward"), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect, onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward"), skipAutoMaxOnTokenChange: !!destinationTokenAmount })) : ((0, jsx_runtime_1.jsx)(react_3.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: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmountOnRamp, setSrcAmountOnRamp: setSrcAmountOnRamp, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: (panelIndex) => {
+                        }, setSelectedCryptoPaymentMethod: setSelectedCryptoPaymentMethod, setSelectedFiatPaymentMethod: setSelectedFiatPaymentMethod }), (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [activeTab === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => navigateToPanel(PanelView.CRYPTO_PAYMENT_METHOD, "forward"), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect, onShowFeeDetail: () => navigateToPanel(PanelView.FEE_DETAIL, "forward") })) : ((0, jsx_runtime_1.jsx)(react_3.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: (0, jsx_runtime_1.jsx)(PanelOnramp_1.PanelOnramp, { srcAmountOnRamp: srcAmountOnRamp, setSrcAmountOnRamp: setSrcAmountOnRamp, selectedPaymentMethod: selectedFiatPaymentMethod, setActivePanel: (panelIndex) => {
                                         // Map panel index to navigation with direction
                                         const panelsWithForwardNav = [PanelView.FIAT_PAYMENT_METHOD, PanelView.RECIPIENT_SELECTION];
                                         if (panelsWithForwardNav.includes(panelIndex)) {

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

@@ -69,5 +69,10 @@ export interface AnySpendCollectorClubPurchaseProps {
      * Force fiat payment
      */
     forceFiatPayment?: boolean;
+    /**
+     * Optional discount code to apply to the purchase.
+     * When provided, validates on-chain and adjusts the price accordingly.
+     */
+    discountCode?: string;
 }
-export declare function AnySpendCollectorClubPurchase({ loadOrder, mode, activeTab, packId, packAmount, pricePerPack, paymentToken, recipientAddress, spenderAddress, isStaging, onSuccess, header, showRecipient, vendingMachineId, packType, forceFiatPayment, }: AnySpendCollectorClubPurchaseProps): import("react/jsx-runtime").JSX.Element;
+export declare function AnySpendCollectorClubPurchase({ loadOrder, mode, activeTab, packId, packAmount, pricePerPack, paymentToken, recipientAddress, spenderAddress, isStaging, onSuccess, header, showRecipient, vendingMachineId, packType, forceFiatPayment, discountCode, }: AnySpendCollectorClubPurchaseProps): import("react/jsx-runtime").JSX.Element;

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

@@ -29,27 +29,22 @@ const jsx_runtime_1 = require("react/jsx-runtime");
  * ```
  */
 const constants_1 = require("../../../anyspend/constants");
+const constants_2 = require("../../../shared/constants");
 const number_1 = require("../../../shared/utils/number");
 const react_1 = require("react");
 const viem_1 = require("viem");
+const chains_1 = require("viem/chains");
 const AnySpendCustom_1 = require("./AnySpendCustom");
+const ccShopAbi_1 = require("./ccShopAbi");
 // Collector Club Shop contract addresses on Base
 const CC_SHOP_ADDRESS = "0x47366E64E4917dd4DdC04Fb9DC507c1dD2b87294";
 const CC_SHOP_ADDRESS_STAGING = "0x8b751143342ac41eB965E55430e3F7Adf6BE01fA";
 const BASE_CHAIN_ID = 8453;
-// ABI for buyPacksFor function only
-const BUY_PACKS_FOR_ABI = {
-    inputs: [
-        { internalType: "address", name: "user", type: "address" },
-        { internalType: "uint256", name: "packId", type: "uint256" },
-        { internalType: "uint256", name: "amount", type: "uint256" },
-    ],
-    name: "buyPacksFor",
-    outputs: [],
-    stateMutability: "nonpayable",
-    type: "function",
-};
-function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activeTab = "crypto", packId, packAmount, pricePerPack, paymentToken = constants_1.USDC_BASE, recipientAddress, spenderAddress, isStaging = false, onSuccess, header, showRecipient = true, vendingMachineId, packType, forceFiatPayment, }) {
+const basePublicClient = (0, viem_1.createPublicClient)({
+    chain: chains_1.base,
+    transport: (0, viem_1.http)(constants_2.PUBLIC_BASE_RPC_URL),
+});
+function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activeTab = "crypto", packId, packAmount, pricePerPack, paymentToken = constants_1.USDC_BASE, recipientAddress, spenderAddress, isStaging = false, onSuccess, header, showRecipient = true, vendingMachineId, packType, forceFiatPayment, discountCode, }) {
     const ccShopAddress = isStaging ? CC_SHOP_ADDRESS_STAGING : CC_SHOP_ADDRESS;
     // Calculate total amount needed (pricePerPack * packAmount)
     const totalAmount = (0, react_1.useMemo)(() => {
@@ -61,33 +56,167 @@ function AnySpendCollectorClubPurchase({ loadOrder, mode = "modal", activeTab =
             return "0";
         }
     }, [pricePerPack, packAmount]);
-    // Calculate fiat amount (totalAmount in USD, assuming USDC with 6 decimals)
+    // Discount code validation state
+    const [discountInfo, setDiscountInfo] = (0, react_1.useState)({
+        isValid: false,
+        discountAmount: BigInt(0),
+        minPurchaseAmount: BigInt(0),
+        isLoading: false,
+        error: null,
+    });
+    // Validate discount code on-chain when provided
+    (0, react_1.useEffect)(() => {
+        if (!discountCode) {
+            setDiscountInfo({
+                isValid: false,
+                discountAmount: BigInt(0),
+                minPurchaseAmount: BigInt(0),
+                isLoading: false,
+                error: null,
+            });
+            return;
+        }
+        let cancelled = false;
+        const validateDiscount = async () => {
+            setDiscountInfo(prev => ({ ...prev, isLoading: true, error: null }));
+            try {
+                // Validate against specific pack and fetch full details in parallel
+                const [validForPack, codeDetails] = await Promise.all([
+                    basePublicClient.readContract({
+                        address: ccShopAddress,
+                        abi: [ccShopAbi_1.IS_DISCOUNT_CODE_VALID_FOR_PACK_ABI],
+                        functionName: "isDiscountCodeValidForPack",
+                        args: [discountCode, BigInt(packId)],
+                    }),
+                    basePublicClient.readContract({
+                        address: ccShopAddress,
+                        abi: [ccShopAbi_1.GET_DISCOUNT_CODE_ABI],
+                        functionName: "getDiscountCode",
+                        args: [discountCode],
+                    }),
+                ]);
+                if (cancelled)
+                    return;
+                const [isValid, discountAmount] = validForPack;
+                const { minPurchaseAmount, packId: restrictedPackId, exists } = codeDetails;
+                if (!exists) {
+                    setDiscountInfo({
+                        isValid: false,
+                        discountAmount: BigInt(0),
+                        minPurchaseAmount: BigInt(0),
+                        isLoading: false,
+                        error: "Discount code does not exist",
+                    });
+                    return;
+                }
+                if (!isValid) {
+                    // Provide specific error based on code details
+                    if (restrictedPackId !== BigInt(0) && restrictedPackId !== BigInt(packId)) {
+                        setDiscountInfo({
+                            isValid: false,
+                            discountAmount: BigInt(0),
+                            minPurchaseAmount: BigInt(0),
+                            isLoading: false,
+                            error: "Discount code is not valid for this pack",
+                        });
+                    }
+                    else {
+                        setDiscountInfo({
+                            isValid: false,
+                            discountAmount: BigInt(0),
+                            minPurchaseAmount: BigInt(0),
+                            isLoading: false,
+                            error: "Invalid or expired discount code",
+                        });
+                    }
+                    return;
+                }
+                setDiscountInfo({ isValid: true, discountAmount, minPurchaseAmount, isLoading: false, error: null });
+            }
+            catch (error) {
+                if (cancelled)
+                    return;
+                console.error("Failed to validate discount code", { discountCode, error });
+                setDiscountInfo({
+                    isValid: false,
+                    discountAmount: BigInt(0),
+                    minPurchaseAmount: BigInt(0),
+                    isLoading: false,
+                    error: "Failed to validate discount code",
+                });
+            }
+        };
+        validateDiscount();
+        return () => {
+            cancelled = true;
+        };
+    }, [discountCode, ccShopAddress, packId]);
+    // Calculate effective dstAmount after discount
+    const effectiveDstAmount = (0, react_1.useMemo)(() => {
+        if (!discountCode || !discountInfo.isValid || discountInfo.discountAmount === BigInt(0)) {
+            return totalAmount;
+        }
+        const total = BigInt(totalAmount);
+        const discount = discountInfo.discountAmount;
+        if (discount >= total) {
+            console.error("Discount exceeds total price", { totalAmount, discountAmount: discount.toString() });
+            return "0";
+        }
+        return (total - discount).toString();
+    }, [totalAmount, discountCode, discountInfo.isValid, discountInfo.discountAmount]);
+    // Calculate fiat amount (effectiveDstAmount in USD, assuming USDC with 6 decimals)
     const srcFiatAmount = (0, react_1.useMemo)(() => {
-        if (!totalAmount || totalAmount === "0")
+        if (!effectiveDstAmount || effectiveDstAmount === "0")
             return "0";
-        return (0, number_1.formatUnits)(totalAmount, constants_1.USDC_BASE.decimals);
-    }, [totalAmount]);
-    // Encode the buyPacksFor function call
+        return (0, number_1.formatUnits)(effectiveDstAmount, constants_1.USDC_BASE.decimals);
+    }, [effectiveDstAmount]);
+    // Encode the contract function call (with or without discount)
     const encodedData = (0, react_1.useMemo)(() => {
         try {
+            if (discountCode && discountInfo.isValid) {
+                return (0, viem_1.encodeFunctionData)({
+                    abi: [ccShopAbi_1.BUY_PACKS_FOR_WITH_DISCOUNT_ABI],
+                    functionName: "buyPacksForWithDiscount",
+                    args: [recipientAddress, BigInt(packId), BigInt(packAmount), discountCode],
+                });
+            }
             return (0, viem_1.encodeFunctionData)({
-                abi: [BUY_PACKS_FOR_ABI],
+                abi: [ccShopAbi_1.BUY_PACKS_FOR_ABI],
                 functionName: "buyPacksFor",
                 args: [recipientAddress, BigInt(packId), BigInt(packAmount)],
             });
         }
         catch (error) {
-            console.error("Failed to encode function data", { recipientAddress, packId, packAmount, error });
+            console.error("Failed to encode function data", { recipientAddress, packId, packAmount, discountCode, error });
             return "0x";
         }
-    }, [recipientAddress, packId, packAmount]);
+    }, [recipientAddress, packId, packAmount, discountCode, discountInfo.isValid]);
     // Default header if not provided
     const defaultHeader = () => ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: "Buy Collector Club Packs" }), (0, jsx_runtime_1.jsxs)("p", { className: "text-as-secondary text-sm", children: ["Purchase ", packAmount, " pack", packAmount !== 1 ? "s" : "", " using any token"] })] }) }));
-    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, activeTab: activeTab, recipientAddress: recipientAddress, spenderAddress: spenderAddress ?? ccShopAddress, orderType: "custom", dstChainId: BASE_CHAIN_ID, dstToken: paymentToken, dstAmount: totalAmount, contractAddress: ccShopAddress, encodedData: encodedData, metadata: {
+    // Don't render AnySpendCustom while discount is being validated (avoids showing wrong price)
+    if (discountCode && discountInfo.isLoading) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary text-sm", children: "Validating discount code..." }) }));
+    }
+    if (discountCode && discountInfo.error) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-red-500", children: discountInfo.error }) }));
+    }
+    if (discountCode &&
+        discountInfo.isValid &&
+        discountInfo.minPurchaseAmount > BigInt(0) &&
+        BigInt(packAmount) < discountInfo.minPurchaseAmount) {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsxs)("p", { className: "text-sm text-red-500", children: ["Minimum purchase of ", discountInfo.minPurchaseAmount.toString(), " pack", discountInfo.minPurchaseAmount > BigInt(1) ? "s" : "", " required for this discount code"] }) }));
+    }
+    if (discountCode && discountInfo.isValid && effectiveDstAmount === "0") {
+        return ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsx)("p", { className: "text-sm text-red-500", children: "Discount exceeds total price" }) }));
+    }
+    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { loadOrder: loadOrder, mode: mode, activeTab: activeTab, recipientAddress: recipientAddress, spenderAddress: spenderAddress ?? ccShopAddress, orderType: "custom", dstChainId: BASE_CHAIN_ID, dstToken: paymentToken, dstAmount: effectiveDstAmount, contractAddress: ccShopAddress, encodedData: encodedData, metadata: {
             packId,
             packAmount,
             pricePerPack,
             vendingMachineId,
             packType,
+            ...(discountCode && discountInfo.isValid
+                ? { discountCode, discountAmount: discountInfo.discountAmount.toString() }
+                : {}),
         }, header: header || defaultHeader, onSuccess: onSuccess, showRecipient: showRecipient, srcFiatAmount: srcFiatAmount, forceFiatPayment: forceFiatPayment }));
 }

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

@@ -1,37 +1,4 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
 var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
@@ -50,9 +17,10 @@ const simplehash_1 = require("../../../shared/utils/simplehash");
 const invariant_1 = __importDefault(require("invariant"));
 const lucide_react_1 = require("lucide-react");
 const react_4 = require("motion/react");
-const react_5 = __importStar(require("react"));
+const react_5 = require("react");
 const chains_1 = require("viem/chains");
 const useCryptoPaymentMethodState_1 = require("../hooks/useCryptoPaymentMethodState");
+const useOnOrderSuccess_1 = require("../hooks/useOnOrderSuccess");
 const useRecipientAddressState_1 = require("../hooks/useRecipientAddressState");
 const AnySpendFingerprintWrapper_1 = require("./AnySpendFingerprintWrapper");
 const CryptoPaymentMethod_1 = require("./common/CryptoPaymentMethod");
@@ -165,8 +133,6 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
         globalAddress: currentWallet.address,
     });
     const [orderId, setOrderId] = (0, react_5.useState)(loadOrder);
-    // Track if onSuccess has been called for the current order
-    const onSuccessCalled = react_5.default.useRef(false);
     const [srcChainId, setSrcChainId] = (0, react_5.useState)(chains_1.base.id);
     // Get token list for token balance check
     const chainName = (0, react_5.useMemo)(() => (0, simplehash_1.simpleHashChainToChainName)(srcChainId), [srcChainId]);
@@ -304,20 +270,8 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
     }, [activeTab, srcFiatAmountForGeoCheck]);
     // Get geo data and onramp options (use srcFiatAmountForGeoCheck to check availability regardless of activeTab)
     const { geoData, isOnrampSupported, coinbaseAvailablePaymentMethods, stripeOnrampSupport, stripeWeb2Support } = (0, react_1.useGeoOnrampOptions)(srcFiatAmountForGeoCheck);
-    (0, react_5.useEffect)(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            console.log("Calling onSuccess");
-            const relayTxs = oat?.data?.relayTxs;
-            const lastRelayTxHash = relayTxs?.[relayTxs.length - 1]?.txHash;
-            const txHash = oat?.data?.executeTx?.txHash || lastRelayTxHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, oat?.data?.relayTxs, onSuccess]);
-    // Reset flag when orderId changes
-    (0, react_5.useEffect)(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    // Call onSuccess when order is executed
+    (0, useOnOrderSuccess_1.useOnOrderSuccess)({ orderData: oat, orderId, onSuccess });
     const { createOrder: createRegularOrder, isCreatingOrder: isCreatingRegularOrder } = (0, react_1.useAnyspendCreateOrder)({
         onSuccess: data => {
             setOrderId(data.data.id);

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

@@ -44,6 +44,8 @@ export interface AnySpendCustomExactInProps {
     classes?: AnySpendCustomExactInClasses;
     /** When true, allows direct transfer without swap if source and destination token/chain are the same */
     allowDirectTransfer?: boolean;
+    /** Opaque metadata passed to the order for callbacks (e.g., workflow form data) */
+    callbackMetadata?: Record<string, unknown>;
 }
 export declare function AnySpendCustomExactIn(props: AnySpendCustomExactInProps): import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -35,7 +35,7 @@ function AnySpendCustomExactIn(props) {
     const fingerprintConfig = (0, AnySpendFingerprintWrapper_1.getFingerprintConfig)();
     return ((0, jsx_runtime_1.jsx)(AnySpendFingerprintWrapper_1.AnySpendFingerprintWrapper, { fingerprint: fingerprintConfig, children: (0, jsx_runtime_1.jsx)(AnySpendCustomExactInInner, { ...props }) }));
 }
-function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, destinationTokenAmount, orderType = "custom_exact_in", minDestinationAmount, header, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, }) {
+function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddress, paymentType = "crypto", sourceTokenAddress, sourceTokenChainId, destinationToken, destinationChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, customExactInConfig, destinationTokenAmount, orderType = "custom_exact_in", minDestinationAmount, header, returnToHomeUrl, customRecipientLabel, returnHomeLabel, classes, allowDirectTransfer = false, callbackMetadata, }) {
     const actionLabel = customExactInConfig?.action ?? "Custom Execution";
     const setB3ModalOpen = (0, react_2.useModalStore)(state => state.setB3ModalOpen);
     const DESTINATION_TOKEN_DETAILS = {
@@ -228,7 +228,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
     };
     const headerContent = header ? (header({ anyspendPrice: anyspendQuote, isLoadingAnyspendPrice: isLoadingAnyspendQuote })) : ((0, jsx_runtime_1.jsx)("div", { className: "mb-4 flex flex-col items-center gap-3 text-center", children: (0, jsx_runtime_1.jsxs)("div", { children: [(0, jsx_runtime_1.jsx)("h1", { className: "text-as-primary text-xl font-bold", children: actionLabel }), (0, jsx_runtime_1.jsx)("p", { className: "text-as-secondary text-sm", children: "Pay from any token to execute a custom exact-in transaction." })] }) }));
     const mainView = ((0, jsx_runtime_1.jsxs)("div", { className: classes?.container ||
-            "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect, skipAutoMaxOnTokenChange: !!destinationTokenAmount })) : ((0, jsx_runtime_1.jsx)(react_3.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: (0, jsx_runtime_1.jsx)(PanelOnramp_1.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: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "ghost", className: classes?.swapDirectionButton ||
+            "anyspend-custom-exact-in-container mx-auto flex w-[460px] max-w-full flex-col items-center gap-2", children: [headerContent, (0, jsx_runtime_1.jsx)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: (0, jsx_runtime_1.jsxs)("div", { className: "relative flex w-full max-w-[calc(100vw-32px)] flex-col gap-2", children: [paymentType === "crypto" ? ((0, jsx_runtime_1.jsx)(CryptoPaySection_1.CryptoPaySection, { selectedSrcChainId: selectedSrcChainId, setSelectedSrcChainId: setSelectedSrcChainId, selectedSrcToken: selectedSrcToken, setSelectedSrcToken: setSelectedSrcToken, srcAmount: srcAmount, setSrcAmount: setSrcAmount, isSrcInputDirty: isSrcInputDirty, setIsSrcInputDirty: setIsSrcInputDirty, selectedCryptoPaymentMethod: effectiveCryptoPaymentMethod, onSelectCryptoPaymentMethod: () => setActivePanel(useAnyspendFlow_1.PanelView.CRYPTO_PAYMENT_METHOD), anyspendQuote: anyspendQuote, onTokenSelect: onTokenSelect })) : ((0, jsx_runtime_1.jsx)(react_3.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: (0, jsx_runtime_1.jsx)(PanelOnramp_1.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: useAnyspendFlow_1.PanelView.FIAT_PAYMENT_METHOD, recipientSelectionPanelIndex: useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION, anyspendQuote: anyspendQuote, onShowPointsDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.POINTS_DETAIL), onShowFeeDetail: () => setActivePanel(useAnyspendFlow_1.PanelView.FEE_DETAIL), customUsdInputValues: customUsdInputValues, customRecipientLabel: customRecipientLabel }) })), (0, jsx_runtime_1.jsx)("div", { className: (0, cn_1.cn)("relative -my-1 flex h-0 items-center justify-center", paymentType === "fiat" && "hidden"), children: (0, jsx_runtime_1.jsx)(react_2.Button, { variant: "ghost", className: classes?.swapDirectionButton ||
                                     "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: (0, jsx_runtime_1.jsx)("div", { className: "relative flex items-center justify-center transition-opacity", children: (0, jsx_runtime_1.jsx)(lucide_react_1.ArrowDown, { className: "text-as-primary/50 h-5 w-5" }) }) }) }), paymentType === "crypto" && ((0, jsx_runtime_1.jsx)(CryptoReceiveSection_1.CryptoReceiveSection, { isDepositMode: false, isBuyMode: false, effectiveRecipientAddress: selectedRecipientOrDefault, recipientName: recipientName || undefined, customRecipientLabel: customRecipientLabel, onSelectRecipient: () => setActivePanel(useAnyspendFlow_1.PanelView.RECIPIENT_SELECTION), dstAmount: isSrcInputDirty && !destinationTokenAmount ? dstAmount : dstAmountInput, dstToken: selectedDstToken, dstTokenSymbol: DESTINATION_TOKEN_DETAILS.SYMBOL, dstTokenLogoURI: DESTINATION_TOKEN_DETAILS.LOGO_URI, selectedDstChainId: selectedDstChainId, setSelectedDstChainId: () => { }, setSelectedDstToken: () => { }, isSrcInputDirty: isSrcInputDirty, onChangeDstAmount: value => {
                                 setIsSrcInputDirty(false);
                                 setDstAmountInput(value);
@@ -284,6 +284,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
                             ? (0, utils_1.normalizeAddress)(customExactInConfig.spenderAddress)
                             : undefined,
                     },
+                    callbackMetadata,
                 });
             }
             else {
@@ -301,6 +302,7 @@ function AnySpendCustomExactInInner({ loadOrder, mode = "modal", recipientAddres
                     expectedDstAmount: expectedDstAmountRaw,
                     creatorAddress: globalAddress,
                     payload,
+                    callbackMetadata,
                 });
             }
         }

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

@@ -101,6 +101,8 @@ export interface AnySpendDepositProps {
     allowDirectTransfer?: boolean;
     /** Fixed destination token amount (in wei/smallest unit). When provided, user cannot change the amount. */
     destinationTokenAmount?: string;
+    /** Opaque metadata passed to the order for callbacks (e.g., workflow form data) */
+    callbackMetadata?: Record<string, unknown>;
 }
 /**
  * A flexible deposit component that wraps AnySpendCustomExactIn with optional chain selection.
@@ -137,4 +139,4 @@ export interface AnySpendDepositProps {
  *   onSuccess={(amount) => console.log(`Deposited ${amount}`)}
  * />
  */
-export declare function AnySpendDeposit({ loadOrder, mode, recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains, minPoolSize, topChainsCount, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit, classes, allowDirectTransfer, destinationTokenAmount, }: AnySpendDepositProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function AnySpendDeposit({ loadOrder, mode, recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains, minPoolSize, topChainsCount, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit, classes, allowDirectTransfer, destinationTokenAmount, callbackMetadata, }: AnySpendDepositProps): import("react/jsx-runtime").JSX.Element | null;

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

@@ -97,7 +97,7 @@ function ChainIcon({ chainId, className }) {
  *   onSuccess={(amount) => console.log(`Deposited ${amount}`)}
  * />
  */
-function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit = false, classes, allowDirectTransfer = false, destinationTokenAmount, }) {
+function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentType: initialPaymentType, sourceTokenAddress, sourceTokenChainId: initialSourceChainId, destinationTokenAddress, destinationTokenChainId, onSuccess, onOpenCustomModal, mainFooter, onTokenSelect, customUsdInputValues, preferEoa, minDestinationAmount, header, orderType, depositContractConfig, showChainSelection, supportedChains = DEFAULT_SUPPORTED_CHAINS, minPoolSize = DEFAULT_MIN_POOL_SIZE, topChainsCount = 3, onClose, returnToHomeUrl, customRecipientLabel, returnHomeLabel, isCustomDeposit = false, classes, allowDirectTransfer = false, destinationTokenAmount, callbackMetadata, }) {
     // Extract deposit-specific classes for convenience
     const depositClasses = classes?.deposit;
     const { connectedEOAWallet } = (0, react_1.useAccountWallet)();
@@ -209,5 +209,5 @@ function AnySpendDeposit({ loadOrder, mode = "modal", recipientAddress, paymentT
     // Deposit view
     return ((0, jsx_runtime_1.jsxs)("div", { className: depositClasses?.form || "anyspend-deposit anyspend-deposit-form relative", children: [shouldShowChainSelection && ((0, jsx_runtime_1.jsxs)("button", { onClick: handleBack, className: depositClasses?.backButton ||
                     "anyspend-deposit-back-button text-as-secondary hover:text-as-primary absolute left-4 top-4 z-10 flex items-center gap-1", children: [(0, jsx_runtime_1.jsx)("svg", { className: depositClasses?.backIcon || "anyspend-deposit-back-icon h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }), (0, jsx_runtime_1.jsx)("span", { className: depositClasses?.backText || "anyspend-deposit-back-text text-sm", children: "Back" })] })), onClose && ((0, jsx_runtime_1.jsx)("button", { onClick: onClose, className: depositClasses?.closeButton ||
-                    "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), (0, jsx_runtime_1.jsx)("div", { className: depositClasses?.formContent || (0, cn_1.cn)("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.customExactIn, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount }, selectedChainId)) : ((0, jsx_runtime_1.jsx)(AnySpend_1.AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.anySpend, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount }, selectedChainId)) }), (0, jsx_runtime_1.jsx)(WarningText_1.ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
+                    "anyspend-deposit-close-button text-as-secondary hover:text-as-primary absolute right-4 top-4 z-10", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-6 w-6", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })), (0, jsx_runtime_1.jsx)("div", { className: depositClasses?.formContent || (0, cn_1.cn)("anyspend-deposit-form-content", shouldShowChainSelection && "pt-8"), children: isCustomDeposit ? ((0, jsx_runtime_1.jsx)(AnySpendCustomExactIn_1.AnySpendCustomExactIn, { loadOrder: loadOrder, mode: mode, recipientAddress: recipientAddress, paymentType: paymentType, sourceTokenAddress: sourceTokenAddress, sourceTokenChainId: selectedChainId, destinationToken: destinationToken, destinationChainId: destinationTokenChainId, orderType: effectiveOrderType, minDestinationAmount: minDestinationAmount, header: header ?? defaultHeader, onSuccess: onSuccess, onOpenCustomModal: onOpenCustomModal, mainFooter: mainFooter, onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, preferEoa: preferEoa, customExactInConfig: depositContractConfig, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.customExactIn, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount, callbackMetadata: callbackMetadata }, selectedChainId)) : ((0, jsx_runtime_1.jsx)(AnySpend_1.AnySpend, { loadOrder: loadOrder, mode: mode, defaultActiveTab: paymentType, recipientAddress: recipientAddress, sourceChainId: selectedChainId, destinationTokenAddress: destinationTokenAddress, destinationTokenChainId: destinationTokenChainId, onSuccess: txHash => onSuccess?.(txHash ?? ""), onTokenSelect: onTokenSelect, customUsdInputValues: customUsdInputValues, hideHeader: true, hideBottomNavigation: true, disableUrlParamManagement: true, returnToHomeUrl: returnToHomeUrl, customRecipientLabel: customRecipientLabel, returnHomeLabel: returnHomeLabel, classes: classes?.anySpend, allowDirectTransfer: allowDirectTransfer, destinationTokenAmount: destinationTokenAmount, callbackMetadata: callbackMetadata }, selectedChainId)) }), (0, jsx_runtime_1.jsx)(WarningText_1.ChainWarningText, { chainId: destinationTokenChainId, classes: classes?.chainWarningText || { root: "px-4 pb-4" } })] }));
 }

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

@@ -0,0 +1,31 @@
+import type { AnySpendAllClasses } from "./types/classes";
+export interface AnySpendWorkflowTriggerProps {
+    /** Payment recipient address (hex) */
+    recipientAddress: string;
+    /** Destination chain ID */
+    chainId: number;
+    /** Destination token address */
+    tokenAddress: string;
+    /** Required payment amount in token base units (wei) */
+    amount: string;
+    /** Workflow ID to trigger */
+    workflowId: string;
+    /** Organization ID that owns the workflow */
+    orgId: string;
+    /** Optional callback metadata merged into the order */
+    callbackMetadata?: {
+        /** Passed as trigger result inputs — accessible via {{root.result.inputs.*}} */
+        inputs?: Record<string, unknown>;
+    } & Record<string, unknown>;
+    /** Callback when payment succeeds */
+    onSuccess?: (amount: string) => void;
+    /** Callback when modal is closed */
+    onClose?: () => void;
+    /** Display mode */
+    mode?: "modal" | "page";
+    /** Custom action label */
+    actionLabel?: string;
+    /** Custom class names */
+    classes?: AnySpendAllClasses;
+}
+export declare function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }: AnySpendWorkflowTriggerProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AnySpendWorkflowTrigger = AnySpendWorkflowTrigger;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const AnySpendDeposit_1 = require("./AnySpendDeposit");
+function AnySpendWorkflowTrigger({ recipientAddress, chainId, tokenAddress, amount, workflowId, orgId, callbackMetadata, onSuccess, onClose, mode, actionLabel, classes, }) {
+    const metadata = (0, react_1.useMemo)(() => ({
+        workflowId,
+        orgId,
+        ...callbackMetadata,
+    }), [workflowId, orgId, callbackMetadata]);
+    return ((0, jsx_runtime_1.jsx)(AnySpendDeposit_1.AnySpendDeposit, { recipientAddress: recipientAddress, destinationTokenAddress: tokenAddress, destinationTokenChainId: chainId, destinationTokenAmount: amount, callbackMetadata: metadata, onSuccess: onSuccess, onClose: onClose, mode: mode, actionLabel: actionLabel, classes: classes, allowDirectTransfer: true }));
+}

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

@@ -11,6 +11,7 @@ const qrcode_react_1 = require("qrcode.react");
 const react_2 = require("react");
 const useAnyspendOrderAndTransactions_1 = require("../hooks/useAnyspendOrderAndTransactions");
 const useCreateDepositFirstOrder_1 = require("../hooks/useCreateDepositFirstOrder");
+const useOnOrderSuccess_1 = require("../hooks/useOnOrderSuccess");
 const useWatchTransfer_1 = require("../hooks/useWatchTransfer");
 const ChainTokenIcon_1 = require("./common/ChainTokenIcon");
 const OrderDetails_1 = require("./common/OrderDetails");
@@ -46,7 +47,6 @@ function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourceTokenP
     const [orderId, setOrderId] = (0, react_2.useState)();
     const [globalAddress, setGlobalAddress] = (0, react_2.useState)();
     const orderCreatedRef = (0, react_2.useRef)(false);
-    const onSuccessCalled = (0, react_2.useRef)(false);
     const [transferResult, setTransferResult] = (0, react_2.useState)(null);
     // Source token/chain as state (can be changed by user)
     const [sourceChainId, setSourceChainId] = (0, react_2.useState)(sourceChainIdProp ?? 8453);
@@ -128,19 +128,11 @@ function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourceTokenP
         isPureTransfer,
     ]);
     // Call onSuccess when order is executed
-    (0, react_2.useEffect)(() => {
-        if (oat?.data?.order.status === "executed" && !onSuccessCalled.current) {
-            const txHash = oat?.data?.executeTx?.txHash;
-            onSuccess?.(txHash);
-            onSuccessCalled.current = true;
-        }
-    }, [oat?.data?.order.status, oat?.data?.executeTx?.txHash, onSuccess]);
-    // Reset onSuccess flag when orderId changes
-    (0, react_2.useEffect)(() => {
-        onSuccessCalled.current = false;
-    }, [orderId]);
+    (0, useOnOrderSuccess_1.useOnOrderSuccess)({ orderData: oat, orderId, onSuccess });
     // For pure transfers, always use recipient address; for orders, use global address
     const displayAddress = isPureTransfer ? recipientAddress : globalAddress || recipientAddress;
+    // Generate EIP-681 payment URI for the QR code so wallets know which chain/token to use
+    const qrValue = (0, anyspend_1.getPaymentUrl)(displayAddress, undefined, sourceToken.address === anyspend_1.ZERO_ADDRESS ? "ETH" : sourceToken.address, sourceChainId, sourceToken.decimals);
     const handleCopyAddress = async () => {
         if (displayAddress) {
             await navigator.clipboard.writeText(displayAddress);
@@ -173,7 +165,7 @@ function QRDeposit({ mode = "modal", recipientAddress, sourceToken: sourceTokenP
     }
     return ((0, jsx_runtime_1.jsx)("div", { className: classes?.container ||
             (0, cn_1.cn)("anyspend-container anyspend-qr-deposit font-inter bg-as-surface-primary mx-auto w-full max-w-[460px] p-6", mode === "page" && "border-as-border-secondary overflow-hidden rounded-2xl border shadow-xl"), children: (0, jsx_runtime_1.jsxs)("div", { className: classes?.content || "anyspend-qr-deposit-content flex flex-col gap-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: classes?.header || "anyspend-qr-header flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("button", { onClick: handleBack, className: classes?.backButton || "anyspend-qr-back-button text-as-secondary hover:text-as-primary", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M15 19l-7-7 7-7" }) }) }), (0, jsx_runtime_1.jsx)("h2", { className: classes?.title || "anyspend-qr-title text-as-primary text-base font-semibold", children: "Deposit" }), onClose ? ((0, jsx_runtime_1.jsx)("button", { onClick: handleClose, className: classes?.closeButton || "anyspend-qr-close-button text-as-secondary hover:text-as-primary", children: (0, jsx_runtime_1.jsx)("svg", { className: "h-5 w-5", fill: "none", viewBox: "0 0 24 24", stroke: "currentColor", children: (0, jsx_runtime_1.jsx)("path", { strokeLinecap: "round", strokeLinejoin: "round", strokeWidth: 2, d: "M6 18L18 6M6 6l12 12" }) }) })) : ((0, jsx_runtime_1.jsx)("div", { className: "w-5" }))] }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.tokenSelectorContainer || "anyspend-qr-token-selector flex flex-col gap-1.5", children: [(0, jsx_runtime_1.jsx)("label", { className: classes?.tokenSelectorLabel || "anyspend-qr-token-label text-as-secondary text-sm", children: "Send" }), (0, jsx_runtime_1.jsx)(relay_kit_ui_1.TokenSelector, { chainIdsFilter: (0, anyspend_1.getAvailableChainIds)("from"), context: "from", fromChainWalletVMSupported: true, isValidAddress: true, lockedChainIds: (0, anyspend_1.getAvailableChainIds)("from"), multiWalletSupportEnabled: true, onAnalyticEvent: undefined, setToken: handleTokenSelect, supportedWalletVMs: ["evm"], token: undefined, trigger: (0, jsx_runtime_1.jsxs)(react_1.Button, { variant: "outline", role: "combobox", className: classes?.tokenSelectorTrigger ||
-                                    "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : ((0, jsx_runtime_1.jsx)("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-start gap-0", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/70 text-xs", children: anyspend_1.ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.qrContent || "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: classes?.qrCodeContainer || "anyspend-qr-code-container flex flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: classes?.qrCode || "anyspend-qr-code rounded-lg bg-white p-2", children: (0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: displayAddress, size: 120, level: "M", marginSize: 0 }) }), (0, jsx_runtime_1.jsxs)("span", { className: classes?.qrScanHint || "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", (0, jsx_runtime_1.jsx)("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.addressContainer || "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: classes?.addressLabel || "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.addressRow || "anyspend-qr-address-row flex items-start gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: classes?.address || "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), (0, jsx_runtime_1.jsx)("button", { onClick: handleCopyAddress, className: classes?.addressCopyIcon ||
+                                    "anyspend-qr-token-trigger border-as-stroke bg-as-surface-secondary flex h-auto w-full items-center justify-between gap-2 rounded-xl border px-3 py-2.5", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center gap-2", children: [sourceToken.metadata?.logoURI ? ((0, jsx_runtime_1.jsx)(ChainTokenIcon_1.ChainTokenIcon, { chainUrl: anyspend_1.ALL_CHAINS[sourceChainId]?.logoUrl, tokenUrl: sourceToken.metadata.logoURI, className: "h-8 min-h-8 w-8 min-w-8" })) : ((0, jsx_runtime_1.jsx)("div", { className: "h-8 w-8 rounded-full bg-gray-700" })), (0, jsx_runtime_1.jsxs)("div", { className: "flex flex-col items-start gap-0", children: [(0, jsx_runtime_1.jsx)("div", { className: "text-as-primary font-semibold", children: sourceToken.symbol }), (0, jsx_runtime_1.jsx)("div", { className: "text-as-primary/70 text-xs", children: anyspend_1.ALL_CHAINS[sourceChainId]?.name ?? "Unknown" })] })] }), (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronsUpDown, { className: "h-4 w-4 shrink-0 opacity-70" })] }) })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.qrContent || "anyspend-qr-content border-as-stroke flex items-start gap-4 rounded-xl border p-4", children: [(0, jsx_runtime_1.jsxs)("div", { className: classes?.qrCodeContainer || "anyspend-qr-code-container flex flex-col items-center gap-2", children: [(0, jsx_runtime_1.jsx)("div", { className: classes?.qrCode || "anyspend-qr-code rounded-lg bg-white p-2", children: (0, jsx_runtime_1.jsx)(qrcode_react_1.QRCodeSVG, { value: qrValue, size: 120, level: "M", marginSize: 0 }) }), (0, jsx_runtime_1.jsxs)("span", { className: classes?.qrScanHint || "anyspend-qr-scan-hint text-as-secondary text-xs", children: ["SCAN WITH ", (0, jsx_runtime_1.jsx)("span", { className: "inline-block", children: "\uD83E\uDD8A" })] })] }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.addressContainer || "anyspend-qr-address-container flex flex-1 flex-col gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: classes?.addressLabel || "anyspend-qr-address-label text-as-secondary text-sm", children: "Deposit address:" }), (0, jsx_runtime_1.jsxs)("div", { className: classes?.addressRow || "anyspend-qr-address-row flex items-start gap-1", children: [(0, jsx_runtime_1.jsx)("span", { className: classes?.address || "anyspend-qr-address text-as-primary break-all font-mono text-sm leading-relaxed", children: displayAddress }), (0, jsx_runtime_1.jsx)("button", { onClick: handleCopyAddress, className: classes?.addressCopyIcon ||
                                                 "anyspend-qr-copy-icon text-as-secondary hover:text-as-primary mt-0.5 shrink-0", children: copied ? (0, jsx_runtime_1.jsx)(lucide_react_1.Check, { className: "h-4 w-4" }) : (0, jsx_runtime_1.jsx)(lucide_react_1.Copy, { className: "h-4 w-4" }) })] })] })] }), (0, jsx_runtime_1.jsx)(WarningText_1.ChainWarningText, { chainId: destinationChainId }), (0, jsx_runtime_1.jsxs)(WarningText_1.WarningText, { children: ["Only send ", sourceToken.symbol, " on ", anyspend_1.ALL_CHAINS[sourceChainId]?.name ?? "the specified chain", ". Other tokens will not be converted."] }), isPureTransfer && isWatchingTransfer && ((0, jsx_runtime_1.jsxs)("div", { className: classes?.watchingIndicator ||
                         "anyspend-qr-watching flex items-center justify-center gap-2 rounded-lg bg-blue-500/10 p-3", children: [(0, jsx_runtime_1.jsx)(lucide_react_1.Loader2, { className: "h-4 w-4 animate-spin text-blue-500" }), (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-blue-500", children: "Watching for incoming transfer..." })] })), (0, jsx_runtime_1.jsx)("button", { onClick: handleCopyAddress, className: classes?.copyButton ||
                         "anyspend-qr-copy-button flex w-full items-center justify-center gap-2 rounded-xl bg-blue-500 py-3.5 font-medium text-white transition-all hover:bg-blue-600", children: "Copy deposit address" })] }) }));