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

package/dist/cjs/anyspend/abis/bondKit.d.ts

@@ -0,0 +1,35 @@
+export declare const ABI_bondKit: readonly [{
+    readonly inputs: readonly [{
+        readonly internalType: "address";
+        readonly name: "_recipient";
+        readonly type: "address";
+    }, {
+        readonly internalType: "uint256";
+        readonly name: "_minTokensOut";
+        readonly type: "uint256";
+    }];
+    readonly name: "buyFor";
+    readonly outputs: readonly [];
+    readonly stateMutability: "payable";
+    readonly type: "function";
+}, {
+    readonly inputs: readonly [];
+    readonly name: "name";
+    readonly outputs: readonly [{
+        readonly internalType: "string";
+        readonly name: "";
+        readonly type: "string";
+    }];
+    readonly stateMutability: "view";
+    readonly type: "function";
+}, {
+    readonly inputs: readonly [];
+    readonly name: "symbol";
+    readonly outputs: readonly [{
+        readonly internalType: "string";
+        readonly name: "";
+        readonly type: "string";
+    }];
+    readonly stateMutability: "view";
+    readonly type: "function";
+}];

package/dist/cjs/anyspend/abis/bondKit.js

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ABI_bondKit = void 0;
+exports.ABI_bondKit = [
+    {
+        inputs: [
+            { internalType: "address", name: "_recipient", type: "address" },
+            { internalType: "uint256", name: "_minTokensOut", type: "uint256" },
+        ],
+        name: "buyFor",
+        outputs: [],
+        stateMutability: "payable",
+        type: "function",
+    },
+    {
+        inputs: [],
+        name: "name",
+        outputs: [{ internalType: "string", name: "", type: "string" }],
+        stateMutability: "view",
+        type: "function",
+    },
+    {
+        inputs: [],
+        name: "symbol",
+        outputs: [{ internalType: "string", name: "", type: "string" }],
+        stateMutability: "view",
+        type: "function",
+    },
+];

package/dist/cjs/anyspend/index.d.ts

@@ -1,7 +1,7 @@
 export * from "./types";
 export * from "./types/metadata";
 export * from "./types/relay";
-export * from "./types/signature-mint";
+export * from "./types/signatureMint";
 export * from "./types/token";
 export * from "./utils/address";
 export * from "./utils/chain";
@@ -11,5 +11,5 @@ export * from "./utils/number";
 export * from "./utils/string";
 export * from "./utils/token";
 export * from "./constants";
-export * from "./abis/abi-usdc-base";
-export * from "./abis/erc20-staking";
+export * from "./abis/abiUsdcBase";
+export * from "./abis/erc20Staking";

package/dist/cjs/anyspend/index.js

@@ -18,7 +18,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./types"), exports);
 __exportStar(require("./types/metadata"), exports);
 __exportStar(require("./types/relay"), exports);
-__exportStar(require("./types/signature-mint"), exports);
+__exportStar(require("./types/signatureMint"), exports);
 __exportStar(require("./types/token"), exports);
 // Utils
 __exportStar(require("./utils/address"), exports);
@@ -31,5 +31,5 @@ __exportStar(require("./utils/token"), exports);
 // Constants
 __exportStar(require("./constants"), exports);
 // Abis
-__exportStar(require("./abis/abi-usdc-base"), exports);
-__exportStar(require("./abis/erc20-staking"), exports);
+__exportStar(require("./abis/abiUsdcBase"), exports);
+__exportStar(require("./abis/erc20Staking"), exports);

package/dist/cjs/anyspend/index.native.d.ts

@@ -9,5 +9,5 @@ export * from "./utils/number";
 export * from "./utils/string";
 export * from "./utils/token";
 export * from "./constants";
-export * from "./abis/abi-usdc-base";
-export * from "./abis/erc20-staking";
+export * from "./abis/abiUsdcBase";
+export * from "./abis/erc20Staking";

package/dist/cjs/anyspend/index.native.js

@@ -31,5 +31,5 @@ __exportStar(require("./utils/token"), exports);
 // Constants
 __exportStar(require("./constants"), exports);
 // Abis
-__exportStar(require("./abis/abi-usdc-base"), exports);
-__exportStar(require("./abis/erc20-staking"), exports);
+__exportStar(require("./abis/abiUsdcBase"), exports);
+__exportStar(require("./abis/erc20Staking"), exports);

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

@@ -0,0 +1,2 @@
+import { AnySpendBondKitProps } from "../../../global-account/react/stores/useModalStore";
+export declare function AnySpendBondKit({ mode, recipientAddress, contractAddress, minTokensOut, imageUrl, onSuccess, }: AnySpendBondKitProps): import("react/jsx-runtime").JSX.Element;

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

@@ -0,0 +1,184 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.AnySpendBondKit = AnySpendBondKit;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const bondkit_1 = require("@b3dotfun/bondkit");
+const anyspend_1 = require("../../../anyspend");
+const react_1 = require("../../../global-account/react");
+const supported_1 = require("../../../shared/constants/chains/supported");
+const framer_motion_1 = require("framer-motion");
+const react_2 = require("react");
+const viem_1 = require("viem");
+const bondKit_1 = require("../../abis/bondKit");
+const AnySpendCustom_1 = require("./AnySpendCustom");
+// Debounce utility function
+function debounce(func, wait) {
+    let timeout;
+    return (...args) => {
+        clearTimeout(timeout);
+        timeout = setTimeout(() => func(...args), wait);
+    };
+}
+// Format number with commas
+function formatNumberWithCommas(x) {
+    const parts = x.split(".");
+    parts[0] = parts[0].replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+    return parts.join(".");
+}
+function AnySpendBondKit({ mode = "modal", recipientAddress, contractAddress, minTokensOut = "0", imageUrl, onSuccess, }) {
+    const hasMounted = (0, react_1.useHasMounted)();
+    const [showAmountPrompt, setShowAmountPrompt] = (0, react_2.useState)(true);
+    const [ethAmount, setEthAmount] = (0, react_2.useState)("");
+    const [isAmountValid, setIsAmountValid] = (0, react_2.useState)(false);
+    const [validationError, setValidationError] = (0, react_2.useState)("");
+    const [tokenName, setTokenName] = (0, react_2.useState)("");
+    const [tokenSymbol, setTokenSymbol] = (0, react_2.useState)("");
+    const [quote, setQuote] = (0, react_2.useState)(null);
+    const [isLoadingQuote, setIsLoadingQuote] = (0, react_2.useState)(false);
+    // Create BondKit client
+    const bondkitTokenClient = (0, react_2.useMemo)(() => {
+        if (!contractAddress)
+            return null;
+        try {
+            const client = new bondkit_1.BondkitToken(contractAddress);
+            client.connect();
+            return client;
+        }
+        catch (error) {
+            console.error("Error creating bondkit client", error);
+            return null;
+        }
+    }, [contractAddress]);
+    // Create a public client for reading contract data
+    const basePublicClient = (0, viem_1.createPublicClient)({
+        chain: supported_1.baseMainnet,
+        transport: (0, viem_1.http)(),
+    });
+    // Fetch token name from contract
+    (0, react_2.useEffect)(() => {
+        async function fetchTokenName() {
+            try {
+                const [name, symbol] = await Promise.all([
+                    basePublicClient.readContract({
+                        address: contractAddress,
+                        abi: bondKit_1.ABI_bondKit,
+                        functionName: "name",
+                    }),
+                    basePublicClient.readContract({
+                        address: contractAddress,
+                        abi: bondKit_1.ABI_bondKit,
+                        functionName: "symbol",
+                    }),
+                ]);
+                setTokenName(name);
+                setTokenSymbol(symbol);
+            }
+            catch (error) {
+                console.error("Error fetching token name:", error);
+                setTokenName("BondKit Token");
+                setTokenSymbol("BOND");
+            }
+        }
+        if (contractAddress) {
+            fetchTokenName();
+        }
+    }, [contractAddress, basePublicClient]);
+    // Get native token data for the chain
+    const { data: tokenData, isError: isTokenError, isLoading, } = (0, react_1.useTokenData)(supported_1.baseMainnet.id, "0x0000000000000000000000000000000000000000");
+    // Convert token data to AnySpend Token type
+    const dstToken = (0, react_2.useMemo)(() => {
+        if (!tokenData)
+            return null;
+        return {
+            address: tokenData.address,
+            chainId: supported_1.baseMainnet.id,
+            name: tokenData.name,
+            symbol: tokenData.symbol,
+            decimals: tokenData.decimals,
+            metadata: {
+                logoURI: tokenData.logoURI,
+            },
+        };
+    }, [tokenData]);
+    // Debounced quote fetching
+    const debouncedGetQuote = (0, react_2.useMemo)(() => debounce(async (val) => {
+        if (!val || Number(val) <= 0 || !bondkitTokenClient) {
+            setQuote(null);
+            return;
+        }
+        try {
+            setIsLoadingQuote(true);
+            const parsedAmount = (0, viem_1.parseEther)(val);
+            const buyQuote = await bondkitTokenClient.getAmountOfTokensToBuy(parsedAmount);
+            setQuote(buyQuote ? (0, viem_1.formatEther)(buyQuote) : null);
+        }
+        catch (error) {
+            console.error("Error getting buy quote:", error);
+            setQuote(null);
+        }
+        finally {
+            setIsLoadingQuote(false);
+        }
+    }, 500), [bondkitTokenClient]);
+    const validateAndSetAmount = (value) => {
+        // Allow empty input
+        if (value === "") {
+            setEthAmount("");
+            setIsAmountValid(false);
+            setValidationError("");
+            setQuote(null);
+            return;
+        }
+        // Only allow numbers and one decimal point
+        if (!/^\d*\.?\d*$/.test(value)) {
+            return;
+        }
+        // Prevent multiple decimal points
+        if ((value.match(/\./g) || []).length > 1) {
+            return;
+        }
+        // Prevent more than 18 decimal places (ETH precision)
+        const parts = value.split(".");
+        if (parts[1] && parts[1].length > 18) {
+            return;
+        }
+        setEthAmount(value);
+    };
+    const header = () => ((0, jsx_runtime_1.jsx)("div", { className: "w-full px-6 py-4", children: (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center space-y-6", children: [(0, jsx_runtime_1.jsxs)("h2", { className: "text-[28px] font-bold", children: [tokenName, " (", tokenSymbol, ")"] }), (0, jsx_runtime_1.jsxs)("div", { className: "flex w-full flex-col items-center space-y-2", children: [(0, jsx_runtime_1.jsxs)("span", { className: "text-[28px] font-bold", children: [ethAmount, " ETH"] }), quote && ((0, jsx_runtime_1.jsxs)("span", { className: "text-lg", children: ["\u2248 ", formatNumberWithCommas(parseFloat(quote).toFixed(4)), " ", tokenSymbol] }))] })] }) }));
+    // Show loading state while fetching token data
+    if (isLoading) {
+        return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: "b3-root b3-modal bg-b3-react-background flex w-full flex-col items-center p-8", children: (0, jsx_runtime_1.jsx)("p", { className: "text-as-primary/70 text-center text-sm", children: "Loading payment information..." }) }) }));
+    }
+    // If we don't have token data after loading, show error state
+    if (!dstToken || isTokenError) {
+        return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: "b3-root b3-modal bg-b3-react-background flex w-full flex-col items-center p-8", children: (0, jsx_runtime_1.jsxs)("p", { className: "text-as-red text-center text-sm", children: ["Failed to fetch native token information for chain ", supported_1.baseMainnet.id, ". Please try again."] }) }) }));
+    }
+    if (showAmountPrompt) {
+        return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsxs)("div", { className: "bg-b3-react-background flex w-full flex-col items-center", children: [(0, jsx_runtime_1.jsxs)("div", { className: "w-full px-4 pb-2 pt-4", children: [(0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
+                                    opacity: hasMounted ? 1 : 0,
+                                    y: hasMounted ? 0 : 20,
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
+                                }, transition: { duration: 0.3, delay: 0, ease: "easeInOut" }, className: "mb-4 flex justify-center", children: imageUrl && ((0, jsx_runtime_1.jsxs)("div", { className: "relative size-16", children: [(0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 scale-95 rounded-[50%] bg-gradient-to-br from-blue-500/20 to-purple-600/20 blur-xl" }), (0, jsx_runtime_1.jsxs)(react_1.GlareCardRounded, { className: "overflow-hidden rounded-full border-none bg-gradient-to-br from-blue-500/10 to-purple-600/10 backdrop-blur-sm", children: [(0, jsx_runtime_1.jsx)("img", { alt: "token preview", className: "size-full rounded-lg object-cover", src: imageUrl }), (0, jsx_runtime_1.jsx)("div", { className: "absolute inset-0 rounded-[50%] border border-white/20" })] })] })) }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
+                                    opacity: hasMounted ? 1 : 0,
+                                    y: hasMounted ? 0 : 20,
+                                    filter: hasMounted ? "blur(0px)" : "blur(10px)",
+                                }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "text-center", children: (0, jsx_runtime_1.jsxs)("h2", { className: "font-sf-rounded text-as-primary mb-4 text-2xl font-bold", children: ["Buy ", tokenName] }) })] }), (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
+                            opacity: hasMounted ? 1 : 0,
+                            y: hasMounted ? 0 : 20,
+                            filter: hasMounted ? "blur(0px)" : "blur(10px)",
+                        }, transition: { duration: 0.3, delay: 0.2, ease: "easeInOut" }, className: "bg-b3-react-background w-full p-6", children: (0, jsx_runtime_1.jsxs)("div", { className: "space-y-4", children: [(0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-between", children: (0, jsx_runtime_1.jsx)("p", { className: "text-as-primary/70 text-sm font-medium", children: "Amount in ETH" }) }), (0, jsx_runtime_1.jsx)("div", { className: "relative", children: (0, jsx_runtime_1.jsx)(react_1.Input, { type: "text", inputMode: "decimal", placeholder: "0.1", value: ethAmount, onChange: e => validateAndSetAmount(e.target.value), className: `h-14 px-4 text-lg ${!isAmountValid && ethAmount ? "border-as-red" : "border-b3-react-border"}` }) }), !isAmountValid && ethAmount && (0, jsx_runtime_1.jsx)("p", { className: "text-as-red text-sm", children: validationError }), (0, jsx_runtime_1.jsxs)("div", { className: "bg-as-on-surface-2/30 rounded-lg border border-white/10 p-4 backdrop-blur-sm", children: [(0, jsx_runtime_1.jsxs)("div", { className: "flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/70 text-sm font-medium", children: "Total Cost:" }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center gap-2", children: (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary text-lg font-bold", children: [ethAmount || "0", " ETH"] }) })] }), isLoadingQuote ? ((0, jsx_runtime_1.jsx)("div", { className: "mt-2 text-center", children: (0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/70 text-sm", children: "Calculating tokens..." }) })) : quote ? ((0, jsx_runtime_1.jsxs)("div", { className: "mt-2 flex items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "text-as-primary/70 text-sm font-medium", children: "You'll receive:" }), (0, jsx_runtime_1.jsxs)("span", { className: "text-as-primary text-sm font-medium", children: ["\u2248 ", formatNumberWithCommas(parseFloat(quote).toFixed(4)), " ", tokenSymbol] })] })) : null] }), (0, jsx_runtime_1.jsx)(react_1.Button, { onClick: () => {
+                                        if (isAmountValid && ethAmount) {
+                                            setShowAmountPrompt(false);
+                                        }
+                                    }, disabled: !isAmountValid || !ethAmount || isLoadingQuote, className: "bg-as-brand hover:bg-as-brand/90 text-as-primary mt-4 h-14 w-full rounded-xl text-lg font-medium", children: "Continue" })] }) })] }) }));
+    }
+    const encodedData = (0, viem_1.encodeFunctionData)({
+        abi: bondKit_1.ABI_bondKit,
+        functionName: "buyFor",
+        args: [recipientAddress, BigInt(minTokensOut)],
+    });
+    return ((0, jsx_runtime_1.jsx)(AnySpendCustom_1.AnySpendCustom, { isMainnet: true, mode: mode, recipientAddress: recipientAddress, orderType: anyspend_1.OrderType.Custom, dstChainId: supported_1.baseMainnet.id, dstToken: dstToken, dstAmount: (0, viem_1.parseEther)(ethAmount).toString(), contractAddress: contractAddress, encodedData: encodedData, metadata: {
+            type: anyspend_1.OrderType.Custom,
+            action: "BondKit Buy",
+        }, header: header, onSuccess: onSuccess, showRecipient: true }));
+}

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

@@ -66,8 +66,6 @@ const SPIN_WHEEL_ABI = [
 ];
 function getWheelStatus(wheelInfo) {
     const now = BigInt(Math.floor(Date.now() / 1000));
-    console.log("@@anyspend-buy-spin:now:", now);
-    console.log("@@anyspend-buy-spin:wheelInfo:", wheelInfo);
     if (now < wheelInfo.startTime_) {
         return "not_started";
     }
@@ -81,7 +79,6 @@ function getWheelStatus(wheelInfo) {
 }
 function generateEncodedDataForBuyEntriesAndSpin(user, quantity) {
     (0, invariant_1.default)(BigInt(quantity) > 0, "Quantity must be greater than zero");
-    console.log("@@anyspend-buy-spin:encoded-data:", { user, quantity });
     const encodedData = (0, viem_1.encodeFunctionData)({
         abi: SPIN_WHEEL_ABI,
         functionName: "buyEntriesAndSpin",
@@ -159,7 +156,6 @@ function AnySpendBuySpin({ isMainnet = true, loadOrder, mode = "modal", spinwhee
         try {
             setIsLoadingConfig(true);
             setConfigError("");
-            console.log("@@anyspend-buy-spin:fetch-config:", { spinwheelContractAddress, chainId });
             const [config, entryModuleAddress, wheelInfo] = await Promise.all([
                 basePublicClient.readContract({
                     address: spinwheelContractAddress,

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

@@ -390,7 +390,7 @@ function AnySpendCustom({ isMainnet = true, loadOrder, mode = "modal", recipient
                                                 opacity: hasMounted ? 1 : 0,
                                                 y: hasMounted ? 0 : 20,
                                                 filter: hasMounted ? "blur(0px)" : "blur(10px)",
-                                            }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsx)("span", { className: "font-medium", children: "Price" }), (0, jsx_runtime_1.jsxs)("h2", { className: (0, utils_1.cn)("text-as-primary text-2xl font-semibold"), children: [formattedSrcAmount || "--", " ", srcToken.symbol] })] })] }), recipientSection, (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
+                                            }, transition: { duration: 0.3, delay: 0.1, ease: "easeInOut" }, className: "relative flex w-full items-center justify-between", children: [(0, jsx_runtime_1.jsxs)("span", { className: "font-medium", children: ["Total ", (0, jsx_runtime_1.jsx)("span", { className: "text-sm text-gray-500", children: "(with fee)" })] }), (0, jsx_runtime_1.jsxs)("h2", { className: (0, utils_1.cn)("text-as-primary text-2xl font-semibold"), children: [formattedSrcAmount || "--", " ", srcToken.symbol] })] })] }), recipientSection, (0, jsx_runtime_1.jsx)("div", { className: (0, utils_1.cn)("flex w-full flex-col items-center justify-between gap-2"), children: (0, jsx_runtime_1.jsx)(framer_motion_1.motion.div, { initial: false, animate: {
                                             opacity: hasMounted ? 1 : 0,
                                             y: hasMounted ? 0 : 20,
                                             filter: hasMounted ? "blur(0px)" : "blur(10px)",

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

@@ -1,4 +1,4 @@
-import { GenerateSigMintResponse } from "../../types/signature-mint";
+import { GenerateSigMintResponse } from "../../types/signatureMint";
 export declare function AnyspendSignatureMint({ loadOrder, mode, signatureData, imageUrl, onSuccess, }: {
     loadOrder?: string;
     mode?: "modal" | "page";

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

@@ -10,7 +10,7 @@ const react_1 = require("../../../global-account/react");
 const debug_1 = __importDefault(require("../../../shared/utils/debug"));
 const react_2 = require("react");
 const viem_1 = require("viem");
-const signature_minting_1 = require("../../abis/signature-minting");
+const signatureMinting_1 = require("../../abis/signatureMinting");
 const AnySpendCustom_1 = require("./AnySpendCustom");
 // Helper function to determine if URL is a video
 function isVideoURL(url) {
@@ -36,7 +36,7 @@ function generateEncodedDataForSignatureMint(signatureData) {
         uid: payload.uid,
     };
     const encodedData = (0, viem_1.encodeFunctionData)({
-        abi: [signature_minting_1.ABI_SIGNATURE_MINTING[0]],
+        abi: [signatureMinting_1.ABI_SIGNATURE_MINTING[0]],
         functionName: "mintWithSignature",
         args: [mintRequest, signature],
     });
@@ -45,7 +45,7 @@ function generateEncodedDataForSignatureMint(signatureData) {
 function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, imageUrl, onSuccess, }) {
     const hasMounted = (0, react_1.useHasMounted)();
     // Get token data
-    const { data: tokenData, isError: isTokenError } = (0, react_1.useTokenData)(signatureData.collection.chainId, signatureData.collection.signatureRequestBody?.currency);
+    const { data: tokenData, isError: isTokenError, isLoading, } = (0, react_1.useTokenData)(signatureData.collection.chainId, signatureData.collection.signatureRequestBody?.currency);
     // Convert token data to AnySpend Token type
     const dstToken = (0, react_2.useMemo)(() => {
         if (!tokenData)
@@ -64,7 +64,11 @@ function AnyspendSignatureMint({ loadOrder, mode = "modal", signatureData, image
     const mediaUrl = imageUrl || signatureData.payload.metadata.image || "https://cdn.b3.fun/nft-placeholder.png";
     const isVideo = isVideoURL(mediaUrl);
     const header = () => ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: "relative mx-auto size-32", children: isVideo ? ((0, jsx_runtime_1.jsxs)("video", { autoPlay: true, loop: true, muted: true, playsInline: true, className: "size-full rounded-lg object-cover", children: [(0, jsx_runtime_1.jsx)("source", { src: mediaUrl, type: `video/${mediaUrl.split(".").pop()}` }), "Your browser does not support the video tag."] })) : ((0, jsx_runtime_1.jsx)("img", { alt: "nft preview", className: "size-full rounded-lg object-cover", src: mediaUrl })) }), (0, jsx_runtime_1.jsxs)("div", { className: "mt-[-60px] w-full rounded-t-lg bg-white", children: [(0, jsx_runtime_1.jsx)("div", { className: "h-[60px] w-full" }), (0, jsx_runtime_1.jsx)("div", { className: "mb-1 flex w-full flex-col items-center gap-2 p-5", children: (0, jsx_runtime_1.jsxs)("span", { className: "font-sf-rounded text-2xl font-semibold", children: [signatureData.payload.metadata.name || "Mint NFT", " ", Number(signatureData.payload.quantity) > 1 ? `(${signatureData.payload.quantity}x)` : ""] }) })] })] }));
-    // If we don't have token data, show error state
+    // Show loading state while fetching token data
+    if (isLoading) {
+        return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: "b3-root b3-modal bg-b3-react-background flex w-full flex-col items-center p-8", children: (0, jsx_runtime_1.jsx)("p", { className: "text-as-primary/70 text-center text-sm", children: "Loading payment token information..." }) }) }));
+    }
+    // If we don't have token data after loading, show error state
     if (!dstToken || isTokenError) {
         return ((0, jsx_runtime_1.jsx)(react_1.StyleRoot, { children: (0, jsx_runtime_1.jsx)("div", { className: "b3-root b3-modal bg-b3-react-background flex w-full flex-col items-center p-8", children: (0, jsx_runtime_1.jsxs)("p", { className: "text-as-red text-center text-sm", children: ["Failed to fetch payment token information for ", signatureData.collection.signatureRequestBody?.currency, " on chain ", signatureData.collection.chainId, ". Please try again."] }) }) }));
     }

package/dist/cjs/anyspend/react/components/{AnySpendNFTButton.d.ts → common/AnySpendNFTButton.d.ts}

@@ -1,4 +1,4 @@
-import { NftContract } from "../../../anyspend/types";
+import { NftContract } from "../../../../anyspend/types";
 type AnySpendNFTButtonProps = {
     nftContract?: NftContract;
     recipientAddress?: string;

package/dist/cjs/anyspend/react/components/{AnySpendNFTButton.js → common/AnySpendNFTButton.js}

@@ -2,8 +2,8 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AnySpendNFTButton = AnySpendNFTButton;
 const jsx_runtime_1 = require("react/jsx-runtime");
-const constants_1 = require("../../../anyspend/constants");
-const react_1 = require("../../../global-account/react");
+const constants_1 = require("../../../../anyspend/constants");
+const react_1 = require("../../../../global-account/react");
 function AnySpendNFTButton({ nftContract = constants_1.DEFAULT_NFT_CONTRACT, recipientAddress }) {
     const { setB3ModalOpen, setB3ModalContentType } = (0, react_1.useModalStore)();
     const handleClick = () => {

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

@@ -1,11 +1,12 @@
 export { AnySpend } from "./AnySpend";
+export { AnySpendBondKit } from "./AnySpendBondKit";
 export { AnySpendBuySpin } from "./AnySpendBuySpin";
 export { AnySpendCustom } from "./AnySpendCustom";
 export { AnySpendNFT } from "./AnySpendNFT";
-export { AnySpendNFTButton } from "./AnySpendNFTButton";
 export { AnyspendSignatureMint } from "./AnyspendSignatureMint";
 export { AnySpendStakeB3 } from "./AnySpendStakeB3";
 export { AnySpendTournament } from "./AnySpendTournament";
+export { AnySpendNFTButton } from "./common/AnySpendNFTButton";
 export { ChainTokenIcon } from "./common/ChainTokenIcon";
 export { OrderDetails } from "./common/OrderDetails";
 export { OrderHistory } from "./common/OrderHistory";

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

@@ -1,23 +1,25 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.WebviewOnrampPayment = exports.WebviewOnrampOrderStatus = exports.TokenBalance = exports.OrderTokenAmount = exports.OrderToken = exports.OrderStatus = exports.OrderHistoryItem = exports.OrderHistory = exports.OrderDetails = exports.ChainTokenIcon = exports.AnySpendTournament = exports.AnySpendStakeB3 = exports.AnyspendSignatureMint = exports.AnySpendNFTButton = exports.AnySpendNFT = exports.AnySpendCustom = exports.AnySpendBuySpin = exports.AnySpend = void 0;
+exports.WebviewOnrampPayment = exports.WebviewOnrampOrderStatus = exports.TokenBalance = exports.OrderTokenAmount = exports.OrderToken = exports.OrderStatus = exports.OrderHistoryItem = exports.OrderHistory = exports.OrderDetails = exports.ChainTokenIcon = exports.AnySpendNFTButton = exports.AnySpendTournament = exports.AnySpendStakeB3 = exports.AnyspendSignatureMint = exports.AnySpendNFT = exports.AnySpendCustom = exports.AnySpendBuySpin = exports.AnySpendBondKit = exports.AnySpend = void 0;
 // Components
 var AnySpend_1 = require("./AnySpend");
 Object.defineProperty(exports, "AnySpend", { enumerable: true, get: function () { return AnySpend_1.AnySpend; } });
+var AnySpendBondKit_1 = require("./AnySpendBondKit");
+Object.defineProperty(exports, "AnySpendBondKit", { enumerable: true, get: function () { return AnySpendBondKit_1.AnySpendBondKit; } });
 var AnySpendBuySpin_1 = require("./AnySpendBuySpin");
 Object.defineProperty(exports, "AnySpendBuySpin", { enumerable: true, get: function () { return AnySpendBuySpin_1.AnySpendBuySpin; } });
 var AnySpendCustom_1 = require("./AnySpendCustom");
 Object.defineProperty(exports, "AnySpendCustom", { enumerable: true, get: function () { return AnySpendCustom_1.AnySpendCustom; } });
 var AnySpendNFT_1 = require("./AnySpendNFT");
 Object.defineProperty(exports, "AnySpendNFT", { enumerable: true, get: function () { return AnySpendNFT_1.AnySpendNFT; } });
-var AnySpendNFTButton_1 = require("./AnySpendNFTButton");
-Object.defineProperty(exports, "AnySpendNFTButton", { enumerable: true, get: function () { return AnySpendNFTButton_1.AnySpendNFTButton; } });
 var AnyspendSignatureMint_1 = require("./AnyspendSignatureMint");
 Object.defineProperty(exports, "AnyspendSignatureMint", { enumerable: true, get: function () { return AnyspendSignatureMint_1.AnyspendSignatureMint; } });
 var AnySpendStakeB3_1 = require("./AnySpendStakeB3");
 Object.defineProperty(exports, "AnySpendStakeB3", { enumerable: true, get: function () { return AnySpendStakeB3_1.AnySpendStakeB3; } });
 var AnySpendTournament_1 = require("./AnySpendTournament");
 Object.defineProperty(exports, "AnySpendTournament", { enumerable: true, get: function () { return AnySpendTournament_1.AnySpendTournament; } });
+var AnySpendNFTButton_1 = require("./common/AnySpendNFTButton");
+Object.defineProperty(exports, "AnySpendNFTButton", { enumerable: true, get: function () { return AnySpendNFTButton_1.AnySpendNFTButton; } });
 // Common Components
 var ChainTokenIcon_1 = require("./common/ChainTokenIcon");
 Object.defineProperty(exports, "ChainTokenIcon", { enumerable: true, get: function () { return ChainTokenIcon_1.ChainTokenIcon; } });

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

@@ -1,4 +1,4 @@
-import { FindByAddressParams, GenerateSigMintParams, IsMintEligibleParams } from "../../types/signature-mint";
+import { FindByAddressParams, GenerateSigMintParams, IsMintEligibleParams } from "../../types/signatureMint";
 /**
  * Hook to generate signature for minting
  */

package/dist/cjs/anyspend/types/bondKit.d.ts

@@ -0,0 +1,12 @@
+export interface bondKitBuyForParams {
+    recipientAddress: string;
+    contractAddress: string;
+    chainId: number;
+    minTokensOut: string;
+    ethAmount: string;
+    imageUrl?: string;
+    tokenName?: string;
+    loadOrder?: string;
+    mode?: "modal" | "page";
+    onSuccess?: (txHash?: string) => void;
+}

package/dist/cjs/anyspend/types/signatureMint.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/global-account/react/components/B3DynamicModal.js

@@ -29,6 +29,7 @@ function B3DynamicModal() {
         "anySpendOrderHistory",
         "signInWithB3",
         "anySpendSignatureMint",
+        "AnySpendBondKit",
     ].find(type => contentType?.type === type)) {
         contentClass += " max-h-[90dvh] overflow-y-auto no-scrollbar w-full";
     }
@@ -39,6 +40,7 @@ function B3DynamicModal() {
         "anySpendStakeB3",
         "anySpendBuySpin",
         "anySpendSignatureMint",
+        "AnySpendBondKit",
     ].find(type => contentType?.type === type)) {
         // Due to the dynamic of (Pay with crypto),(Pay with fiat), we want the height fixed to 90dvh but still scrollable.
         // NOTE: Just leave it here in case we want the fixed height
@@ -80,6 +82,8 @@ function B3DynamicModal() {
                 return (0, jsx_runtime_1.jsx)(react_1.AnySpendBuySpin, { ...contentType, mode: "modal" });
             case "anySpendSignatureMint":
                 return (0, jsx_runtime_1.jsx)(react_1.AnyspendSignatureMint, { ...contentType, mode: "modal" });
+            case "anySpendBondKit":
+                return (0, jsx_runtime_1.jsx)(react_1.AnySpendBondKit, { ...contentType });
             // Add other modal types here
             default:
                 return null;

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

@@ -1,6 +1,6 @@
 import { Token, Tournament } from "../../../anyspend";
 import { NftContract } from "../../../anyspend/types";
-import { GenerateSigMintResponse } from "../../../anyspend/types/signature-mint";
+import { GenerateSigMintResponse } from "../../../anyspend/types/signatureMint";
 import { AllowedStrategy } from "../../../global-account/react";
 import { PermissionsConfig } from "../../../global-account/types/permissions";
 import { Address, Chain } from "thirdweb";
@@ -251,10 +251,32 @@ export interface AnySpendSignatureMintProps extends BaseModalProps {
     /** Callback function called when minting is successful */
     onSuccess?: (txHash?: string) => void;
 }
+/**
+ * Props for the AnySpend bondKit modal
+ * Handles bondKit token purchases
+ */
+export interface AnySpendBondKitProps extends BaseModalProps {
+    /** Mode of the modal */
+    mode?: "modal" | "page";
+    /** Modal type identifier */
+    type: "anySpendBondKit";
+    /** Recipient address to receive the tokens */
+    recipientAddress: string;
+    /** bondKit contract address */
+    contractAddress: string;
+    /** Minimum tokens to receive */
+    minTokensOut?: string;
+    /** Optional image URL for token preview */
+    imageUrl?: string;
+    /** Token name to display */
+    tokenName?: string;
+    /** Callback function called when purchase is successful */
+    onSuccess?: (txHash?: string) => void;
+}
 /**
  * Union type of all possible modal content types
  */
-export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | TransakProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendBuySpinProps | AnySpendSignatureMintProps;
+export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | TransakProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps;
 /**
  * State interface for the modal store
  */

package/dist/esm/anyspend/abis/bondKit.d.ts

@@ -0,0 +1,35 @@
+export declare const ABI_bondKit: readonly [{
+    readonly inputs: readonly [{
+        readonly internalType: "address";
+        readonly name: "_recipient";
+        readonly type: "address";
+    }, {
+        readonly internalType: "uint256";
+        readonly name: "_minTokensOut";
+        readonly type: "uint256";
+    }];
+    readonly name: "buyFor";
+    readonly outputs: readonly [];
+    readonly stateMutability: "payable";
+    readonly type: "function";
+}, {
+    readonly inputs: readonly [];
+    readonly name: "name";
+    readonly outputs: readonly [{
+        readonly internalType: "string";
+        readonly name: "";
+        readonly type: "string";
+    }];
+    readonly stateMutability: "view";
+    readonly type: "function";
+}, {
+    readonly inputs: readonly [];
+    readonly name: "symbol";
+    readonly outputs: readonly [{
+        readonly internalType: "string";
+        readonly name: "";
+        readonly type: "string";
+    }];
+    readonly stateMutability: "view";
+    readonly type: "function";
+}];

package/dist/esm/anyspend/abis/bondKit.js

@@ -0,0 +1,26 @@
+export const ABI_bondKit = [
+    {
+        inputs: [
+            { internalType: "address", name: "_recipient", type: "address" },
+            { internalType: "uint256", name: "_minTokensOut", type: "uint256" },
+        ],
+        name: "buyFor",
+        outputs: [],
+        stateMutability: "payable",
+        type: "function",
+    },
+    {
+        inputs: [],
+        name: "name",
+        outputs: [{ internalType: "string", name: "", type: "string" }],
+        stateMutability: "view",
+        type: "function",
+    },
+    {
+        inputs: [],
+        name: "symbol",
+        outputs: [{ internalType: "string", name: "", type: "string" }],
+        stateMutability: "view",
+        type: "function",
+    },
+];