@b3dotfun/sdk 0.0.82 → 0.0.83-alpha.1

package/dist/cjs/global-account/react/hooks/useAuthentication.js

@@ -131,14 +131,40 @@ function useAuthentication(partnerId) {
             return userAuth;
         }
     }, [activeWallet, partnerId, authenticate, setIsAuthenticated, setIsAuthenticating, setUser, setHasStartedConnecting]);
+    const logout = (0, react_2.useCallback)(async (callback) => {
+        if (activeWallet) {
+            debug("@@logout:activeWallet", activeWallet);
+            disconnect(activeWallet);
+            debug("@@logout:activeWallet", activeWallet);
+        }
+        // Log out of each wallet
+        wallets.forEach(wallet => {
+            console.log("@@logging out", wallet);
+            disconnect(wallet);
+        });
+        // Delete localStorage thirdweb:connected-wallet-ids
+        // https://npc-labs.slack.com/archives/C070E6HNG85/p1750185115273099
+        if (typeof localStorage !== "undefined") {
+            localStorage.removeItem("thirdweb:connected-wallet-ids");
+            localStorage.removeItem("wagmi.store");
+            localStorage.removeItem("lastAuthProvider");
+            localStorage.removeItem("b3-user");
+        }
+        app_1.default.logout();
+        debug("@@logout:loggedOut");
+        setIsAuthenticated(false);
+        setIsConnected(false);
+        setUser();
+        callback?.();
+    }, [activeWallet, disconnect, wallets, setIsAuthenticated, setUser, setIsConnected]);
     const onConnect = (0, react_2.useCallback)(async (_walleAutoConnectedWith, allConnectedWallets) => {
         debug("@@useAuthentication:onConnect", { _walleAutoConnectedWith, allConnectedWallets });
-        const wallet = allConnectedWallets.find(wallet => wallet.id.startsWith("ecosystem."));
-        if (!wallet) {
-            throw new Error("No smart wallet found during auto-connect");
-        }
-        debug("@@useAuthentication:onConnect", { wallet });
         try {
+            const wallet = allConnectedWallets.find(wallet => wallet.id.startsWith("ecosystem."));
+            if (!wallet) {
+                throw new Error("No smart wallet found during auto-connect");
+            }
+            debug("@@useAuthentication:onConnect", { wallet });
             setHasStartedConnecting(true);
             setIsConnected(true);
             setIsAuthenticating(true);
@@ -152,6 +178,7 @@ function useAuthentication(partnerId) {
             debug("@@useAuthentication:onConnect:failed", { error });
             setIsAuthenticated(false);
             setUser(undefined);
+            await logout();
         }
         finally {
             setIsAuthenticating(false);
@@ -162,44 +189,19 @@ function useAuthentication(partnerId) {
             isConnected,
         });
     }, [
-        onConnectCallback,
-        authenticateUser,
         isAuthenticated,
         isAuthenticating,
         isConnected,
-        setActiveWallet,
         setHasStartedConnecting,
-        setIsAuthenticated,
-        setIsAuthenticating,
         setIsConnected,
+        setIsAuthenticating,
+        setActiveWallet,
+        authenticateUser,
+        onConnectCallback,
+        setIsAuthenticated,
         setUser,
+        logout,
     ]);
-    const logout = (0, react_2.useCallback)(async (callback) => {
-        if (activeWallet) {
-            debug("@@logout:activeWallet", activeWallet);
-            disconnect(activeWallet);
-            debug("@@logout:activeWallet", activeWallet);
-        }
-        // Log out of each wallet
-        wallets.forEach(wallet => {
-            console.log("@@logging out", wallet);
-            disconnect(wallet);
-        });
-        // Delete localStorage thirdweb:connected-wallet-ids
-        // https://npc-labs.slack.com/archives/C070E6HNG85/p1750185115273099
-        if (typeof localStorage !== "undefined") {
-            localStorage.removeItem("thirdweb:connected-wallet-ids");
-            localStorage.removeItem("wagmi.store");
-            localStorage.removeItem("lastAuthProvider");
-            localStorage.removeItem("b3-user");
-        }
-        app_1.default.logout();
-        debug("@@logout:loggedOut");
-        setIsAuthenticated(false);
-        setIsConnected(false);
-        setUser();
-        callback?.();
-    }, [activeWallet, disconnect, wallets, setIsAuthenticated, setUser, setIsConnected]);
     const { isLoading: useAutoConnectLoading } = (0, react_3.useAutoConnect)({
         client: thirdweb_1.client,
         wallets: [wallet],

package/dist/cjs/global-account/react/hooks/useUserQuery.d.ts

@@ -36,8 +36,8 @@ export declare function useUserQuery(): {
                 name?: string | undefined;
                 address?: string | undefined;
                 email?: string | undefined;
-                phone?: string | undefined;
                 username?: string | undefined;
+                phone?: string | undefined;
                 fid?: string | undefined;
             };
         }[] | undefined;

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

@@ -15,7 +15,6 @@ import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import { parseUnits } from "viem";
 import { base, mainnet } from "viem/chains";
 import { useAutoSelectCryptoPaymentMethod } from "../hooks/useAutoSelectCryptoPaymentMethod.js";
-import { useAutoSetActiveWalletFromWagmi } from "../hooks/useAutoSetActiveWalletFromWagmi.js";
 import { useConnectedWalletDisplay } from "../hooks/useConnectedWalletDisplay.js";
 import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState.js";
 import { useRecipientAddressState } from "../hooks/useRecipientAddressState.js";
@@ -313,8 +312,6 @@ function AnySpendInner({ destinationTokenAddress, destinationTokenChainId, mode
     // );
     const { address: globalAddress, wallet: globalWallet, connectedEOAWallet } = useAccountWallet();
     const globalWalletImage = useAccountWalletImage();
-    // Auto-set active wallet from wagmi
-    useAutoSetActiveWalletFromWagmi();
     // Get wallet address based on selected payment method
     const { walletAddress } = useConnectedWalletDisplay(effectiveCryptoPaymentMethod);
     // Recipient address state with dual-state system (auto + explicit user selection)

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

@@ -31,7 +31,7 @@ import { useMemo } from "react";
 import { encodeFunctionData } from "viem";
 import { AnySpendCustom } from "./AnySpendCustom.js";
 // Collector Club Shop contract on Base
-const CC_SHOP_ADDRESS = "0x23887D10c81118A9a2E3Af59C423e2f4ee4Cc7Cf";
+const CC_SHOP_ADDRESS = "0x47366E64E4917dd4DdC04Fb9DC507c1dD2b87294";
 const BASE_CHAIN_ID = 8453;
 // ABI for buyPacksFor function only
 const BUY_PACKS_FOR_ABI = {

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

@@ -13,7 +13,6 @@ import { ChevronRight, ChevronRightCircle, Info, Loader2 } from "lucide-react";
 import { motion } from "motion/react";
 import React, { useCallback, useEffect, useMemo, useState } from "react";
 import { base } from "viem/chains";
-import { useAutoSetActiveWalletFromWagmi } from "../hooks/useAutoSetActiveWalletFromWagmi.js";
 import { useCryptoPaymentMethodState } from "../hooks/useCryptoPaymentMethodState.js";
 import { useRecipientAddressState } from "../hooks/useRecipientAddressState.js";
 import { AnySpendFingerprintWrapper, getFingerprintConfig } from "./AnySpendFingerprintWrapper.js";
@@ -111,8 +110,6 @@ function AnySpendCustomInner({ loadOrder, mode = "modal", activeTab: activeTabPr
     const hasMounted = useHasMounted();
     const searchParams = useSearchParamsSSR();
     const router = useRouter();
-    // Auto-set active wallet from wagmi
-    useAutoSetActiveWalletFromWagmi();
     const [activePanel, setActivePanel] = useState(loadOrder ? PanelView.ORDER_DETAILS : PanelView.CONFIRM_ORDER);
     const [activeTab, setActiveTab] = useState(activeTabProps);
     // Payment method state with dual-state system (auto + explicit user selection)

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

@@ -4,13 +4,8 @@ import { toast, useAccountWallet, WalletImage } from "../../../../global-account
 import { cn } from "../../../../shared/utils/cn.js";
 import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
 import { client } from "../../../../shared/utils/thirdweb.js";
-import { WalletCoinbase, WalletMetamask, WalletRainbow, WalletWalletConnect } from "@web3icons/react";
 import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-react";
-import { useState } from "react";
-import { createPortal } from "react-dom";
-import { useSetActiveWallet, useWalletInfo } from "thirdweb/react";
-import { createWallet } from "thirdweb/wallets";
-import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
+import { useConnectModal, useDisconnect, useWalletInfo } from "thirdweb/react";
 import { useConnectedWalletDisplay } from "../../hooks/useConnectedWalletDisplay.js";
 export var CryptoPaymentMethodType;
 (function (CryptoPaymentMethodType) {
@@ -20,195 +15,70 @@ export var CryptoPaymentMethodType;
     CryptoPaymentMethodType["TRANSFER_CRYPTO"] = "transfer_crypto";
 })(CryptoPaymentMethodType || (CryptoPaymentMethodType = {}));
 export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod, isCreatingOrder, onBack, onSelectPaymentMethod, }) {
-    const { connectedEOAWallet: connectedEOAWallet, connectedSmartWallet: connectedSmartWallet } = useAccountWallet();
-    const { connector, address } = useAccount();
-    const { connect, connectors, isPending } = useConnect();
+    const { connectedEOAWallet, connectedSmartWallet } = useAccountWallet();
     const { disconnect } = useDisconnect();
-    const { data: walletClient } = useWalletClient();
-    const [showWalletModal, setShowWalletModal] = useState(false);
-    const setActiveWallet = useSetActiveWallet();
+    const { connect: openConnectModal } = useConnectModal();
     const { data: eoaWalletInfo } = useWalletInfo(connectedEOAWallet?.id);
-    const isConnected = !!connectedEOAWallet;
     const globalAddress = connectedSmartWallet?.getAccount()?.address;
     // Use custom hook to determine wallet display logic
-    const { shouldShowConnectedEOA, shouldShowWagmiWallet } = useConnectedWalletDisplay(selectedPaymentMethod);
-    console.log("shouldShowWagmiWallet :", shouldShowWagmiWallet);
-    // Map wagmi connector names to thirdweb wallet IDs
-    const getThirdwebWalletId = (connectorName) => {
-        const walletMap = {
-            MetaMask: "io.metamask",
-            "Coinbase Wallet": "com.coinbase.wallet",
-            Rainbow: "me.rainbow",
-            WalletConnect: "walletConnect",
-            Phantom: "app.phantom",
-        };
-        return walletMap[connectorName] || null;
-    };
-    // Create thirdweb wallet from wagmi connector
-    const createThirdwebWalletFromConnector = async (connectorName) => {
-        const walletId = getThirdwebWalletId(connectorName);
-        if (!walletId) {
-            console.warn(`No thirdweb wallet ID found for connector: ${connectorName}`);
-            return null;
-        }
-        try {
-            const thirdwebWallet = createWallet(walletId);
-            // Connect the wallet to sync with the existing wagmi connection
-            await thirdwebWallet.connect({ client });
-            return thirdwebWallet;
-        }
-        catch (error) {
-            console.error(`Failed to create thirdweb wallet for ${connectorName}:`, error);
-            return null;
-        }
-    };
-    // Define available wallet connectors
-    const availableConnectors = connectors.filter(connector => ["MetaMask", "WalletConnect", "Coinbase Wallet", "Rainbow", "Phantom"].includes(connector.name));
-    // Define wallet options with icons and info
-    const walletOptions = [
-        {
-            id: "metamask",
-            name: "MetaMask",
-            icon: _jsx(WalletMetamask, { size: 48 }),
-            description: "Connect using MetaMask browser extension",
-            connector: availableConnectors.find(c => c.name === "MetaMask"),
-        },
-        {
-            id: "coinbase",
-            name: "Coinbase Wallet",
-            icon: _jsx(WalletCoinbase, { size: 48 }),
-            description: "Connect using Coinbase Wallet",
-            connector: availableConnectors.find(c => c.name === "Coinbase Wallet"),
-        },
-        {
-            id: "rainbow",
-            name: "Rainbow",
-            icon: _jsx(WalletRainbow, { size: 48 }),
-            description: "Connect using Rainbow wallet",
-            connector: availableConnectors.find(c => c.name === "Rainbow"),
-        },
-        {
-            id: "walletconnect",
-            name: "WalletConnect",
-            icon: _jsx(WalletWalletConnect, { size: 48 }),
-            description: "Connect using WalletConnect protocol",
-            connector: availableConnectors.find(c => c.name === "WalletConnect"),
-        },
-    ].filter(wallet => wallet.connector); // Only show wallets that have available connectors
-    // Reset modal state when closing
-    const handleCloseModal = () => {
-        setShowWalletModal(false);
-    };
-    // Function to request wallet permissions for specific wallet
-    const requestWalletPermissions = async (walletConnector) => {
+    const { shouldShowConnectedEOA } = useConnectedWalletDisplay(selectedPaymentMethod);
+    // Handle wallet connection using thirdweb modal
+    const handleConnectWallet = async () => {
         try {
-            // If a specific wallet connector is provided and it's different from current
-            if (walletConnector && connector?.name !== walletConnector.name) {
-                // Disconnect current and connect to the selected wallet
-                // if (isConnected) {
-                //   disconnect();
-                //   // Small delay to ensure disconnection
-                //   await new Promise(resolve => setTimeout(resolve, 100));
-                // }
-                await connect({ connector: walletConnector });
-                setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                toast.success(`Connected to ${walletConnector.name}`);
-                return;
+            // Disconnect current wallet before connecting a new one
+            if (connectedEOAWallet) {
+                await disconnect(connectedEOAWallet);
             }
-            // If same wallet or no specific wallet, request permissions for account switching
-            if (walletClient && "request" in walletClient) {
-                await walletClient.request({
-                    method: "wallet_requestPermissions",
-                    params: [{ eth_accounts: {} }],
-                });
-                toast.success("Account selection completed");
+            const wallet = await openConnectModal({ client, setActive: false });
+            if (wallet) {
+                // setActiveWallet(wallet);
                 setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                 onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-            }
-            else {
-                // Fallback: show modal for manual wallet selection
-                setShowWalletModal(true);
+                toast.success("Wallet connected");
             }
         }
         catch (error) {
-            console.error("Failed to request wallet permissions:", error);
+            console.error("Failed to connect wallet:", error);
             if (error && typeof error === "object" && "message" in error) {
                 const errorMessage = error.message.toLowerCase();
                 if (errorMessage.includes("rejected") ||
                     errorMessage.includes("denied") ||
                     errorMessage.includes("cancelled")) {
-                    toast.error("Account selection cancelled");
+                    // User cancelled - no toast needed
                 }
                 else {
-                    toast.error("Failed to open account selection");
+                    toast.error("Failed to connect wallet");
                 }
             }
-            else {
-                toast.error("Failed to open account selection");
-            }
         }
     };
-    return (_jsxs("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full px-5 pb-5 pt-5 sm:px-0 sm:pt-5", children: [_jsxs("div", { className: cn("relative flex flex-col gap-10"), children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsx("div", { className: "flex items-center justify-around gap-4", children: _jsx("div", { className: "flex-1 text-center", children: _jsx("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), process.env.NODE_ENV === "development" && (_jsxs("div", { className: "rounded-lg border border-yellow-500/50 bg-yellow-50 p-3 dark:bg-yellow-950/20", children: [_jsx("p", { className: "mb-2 text-xs font-semibold text-yellow-800 dark:text-yellow-300", children: "\uD83E\uDDEA Toast Test (Dev Only)" }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx("button", { onClick: () => toast.success("Success! Transaction completed"), className: "rounded bg-green-600 px-2 py-1 text-xs font-medium text-white hover:bg-green-700", children: "Success" }), _jsx("button", { onClick: () => toast.error("Error! Transaction failed"), className: "rounded bg-red-600 px-2 py-1 text-xs font-medium text-white hover:bg-red-700", children: "Error" }), _jsx("button", { onClick: () => toast.info("Info: Processing your request..."), className: "rounded bg-blue-600 px-2 py-1 text-xs font-medium text-white hover:bg-blue-700", children: "Info" }), _jsx("button", { onClick: () => toast.warning("Warning: Low balance detected"), className: "rounded bg-yellow-600 px-2 py-1 text-xs font-medium text-white hover:bg-yellow-700", children: "Warning" }), _jsx("button", { onClick: () => {
-                                            toast.success("Multiple test 1");
-                                            setTimeout(() => toast.info("Multiple test 2"), 200);
-                                            setTimeout(() => toast.warning("Multiple test 3"), 400);
-                                        }, className: "rounded bg-purple-600 px-2 py-1 text-xs font-medium text-white hover:bg-purple-700", children: "Multiple" })] })] })), _jsxs("div", { className: "crypto-payment-methods flex flex-col gap-4", children: [(shouldShowConnectedEOA || shouldShowWagmiWallet || globalAddress) && (_jsxs("div", { className: "installed-wallets", children: [_jsx("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Connected wallets" }), _jsxs("div", { className: "space-y-2", children: [shouldShowConnectedEOA && (_jsx("button", { onClick: () => {
-                                                    setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                                                    onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                                                    if (connectedEOAWallet) {
-                                                        setActiveWallet(connectedEOAWallet);
-                                                    }
-                                                    toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
-                                                }, className: cn("crypto-payment-method-connect-wallet eoa-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET
-                                                    ? "connected-wallet border-as-brand bg-as-brand/5"
-                                                    : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-5 w-5 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: eoaWalletInfo?.name || connector?.name || "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(connectedEOAWallet?.getAccount()?.address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })), _jsx("button", { onClick: e => {
-                                                                        e.stopPropagation();
-                                                                        disconnect();
-                                                                        toast.success("Wallet disconnected");
-                                                                        if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
-                                                                            setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
-                                                                        }
-                                                                    }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), shouldShowWagmiWallet && (_jsx("button", { onClick: async () => {
-                                                    setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                                                    onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
-                                                    // Create thirdweb wallet from wagmi connector
-                                                    if (connector?.name) {
-                                                        const thirdwebWallet = await createThirdwebWalletFromConnector(connector.name);
-                                                        if (thirdwebWallet) {
-                                                            setActiveWallet(thirdwebWallet);
-                                                        }
-                                                    }
-                                                    toast.success(`Selected ${connector?.name || "wallet"}`);
-                                                }, className: cn("crypto-payment-method-connect-wallet wagmi-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET
-                                                    ? "connected-wallet border-as-brand bg-as-brand/5"
-                                                    : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-5 w-5 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: connector?.name || "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })), _jsx("button", { onClick: e => {
-                                                                        e.stopPropagation();
-                                                                        disconnect();
-                                                                        toast.success("Wallet disconnected");
-                                                                        if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
-                                                                            setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
-                                                                        }
-                                                                    }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), globalAddress && (_jsx("button", { onClick: () => {
-                                                    setSelectedPaymentMethod(CryptoPaymentMethodType.GLOBAL_WALLET);
-                                                    onSelectPaymentMethod(CryptoPaymentMethodType.GLOBAL_WALLET);
-                                                    toast.success("Selected B3 Account");
-                                                }, className: cn("crypto-payment-method-global-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET
-                                                    ? "connected-wallet border-as-brand bg-as-brand/5"
-                                                    : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(WalletImage, { fallback: _jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-purple-100", children: _jsx(Wallet, { className: "h-5 w-5 text-purple-600" }) }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: "Global Account" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(globalAddress || "") })] })] }), _jsx("div", { className: "flex items-center gap-2", children: selectedPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })) })] }) }))] })] })), _jsxs("div", { className: "other-payment-methods", children: [_jsx("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Payment methods" }), _jsxs("div", { className: "space-y-3", children: [_jsxs("button", { onClick: () => {
-                                                    // Always show wallet selection modal first
-                                                    setShowWalletModal(true);
-                                                }, className: "crypto-payment-method-connect-wallet bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] }), _jsxs("button", { onClick: () => {
-                                                    setSelectedPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
-                                                    onSelectPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
-                                                }, disabled: isCreatingOrder, className: "crypto-payment-method-transfer bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-orange-100", children: _jsx(ZapIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })] })] })] })] }), showWalletModal &&
-                createPortal(_jsx("div", { className: "wallet-connection-modal pointer-events-auto fixed inset-0 z-[9999] flex items-center justify-center bg-black/50", children: _jsxs("div", { className: "max-h-[80vh] w-[400px] max-w-[90vw] overflow-auto rounded-xl bg-white p-6 dark:bg-gray-900", children: [_jsxs("div", { className: "mb-4 flex items-center justify-between", children: [_jsx("h3", { className: "text-lg font-semibold text-gray-900 dark:text-white", children: isConnected ? "Switch wallet or account" : "Choose wallet to connect" }), _jsx("button", { onClick: handleCloseModal, className: "text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-200", children: _jsx(X, { className: "h-5 w-5" }) })] }), _jsx("div", { className: "space-y-4", children: _jsx("div", { className: "space-y-3", children: walletOptions.map(walletOption => {
-                                        const isCurrentWallet = isConnected && connector?.name === walletOption.connector?.name;
-                                        return (_jsx("button", { onClick: async () => {
-                                                handleCloseModal();
-                                                await requestWalletPermissions(walletOption.connector);
-                                            }, disabled: isPending, className: `wallet-option w-full rounded-xl border p-4 text-left transition-all hover:shadow-md disabled:opacity-50 ${isCurrentWallet
-                                                ? "wallet-option--active border-blue-500 bg-blue-50 dark:bg-blue-900/20"
-                                                : "border-gray-200 bg-white hover:border-gray-300 dark:border-gray-600 dark:bg-gray-800 dark:hover:border-gray-500"}`, children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [walletOption.icon, _jsxs("div", { children: [_jsxs("div", { className: "wallet-option-name flex items-center gap-2", children: [_jsx("div", { className: "text-sm font-semibold text-gray-900 dark:text-white", children: walletOption.name }), isCurrentWallet && (_jsx("span", { className: "rounded-full bg-blue-100 px-2 py-0.5 text-xs font-medium text-blue-700 dark:bg-blue-800 dark:text-blue-200", children: "Connected" }))] }), _jsx("div", { className: "text-xs text-gray-500 dark:text-gray-400", children: isCurrentWallet ? "Switch account or reconnect" : walletOption.description })] })] }), _jsx(ChevronRightCircle, { className: "h-5 w-5 text-gray-400" })] }) }, walletOption.id));
-                                    }) }) })] }) }), typeof window !== "undefined" ? document.getElementById("b3-root") || document.body : document.body)] }));
+    return (_jsx("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full px-5 pb-5 pt-5 sm:px-0 sm:pt-5", children: _jsxs("div", { className: cn("relative flex flex-col gap-10"), children: [_jsx("button", { onClick: onBack, className: "text-as-quaternary hover:text-as-primary absolute flex h-8 w-8 items-center justify-center rounded-lg transition-colors", children: _jsx(ChevronLeft, { className: "h-6 w-6" }) }), _jsx("div", { className: "flex items-center justify-around gap-4", children: _jsx("div", { className: "flex-1 text-center", children: _jsx("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), process.env.NODE_ENV === "development" && (_jsxs("div", { className: "rounded-lg border border-yellow-500/50 bg-yellow-50 p-3 dark:bg-yellow-950/20", children: [_jsx("p", { className: "mb-2 text-xs font-semibold text-yellow-800 dark:text-yellow-300", children: "\uD83E\uDDEA Toast Test (Dev Only)" }), _jsxs("div", { className: "flex flex-wrap gap-2", children: [_jsx("button", { onClick: () => toast.success("Success! Transaction completed"), className: "rounded bg-green-600 px-2 py-1 text-xs font-medium text-white hover:bg-green-700", children: "Success" }), _jsx("button", { onClick: () => toast.error("Error! Transaction failed"), className: "rounded bg-red-600 px-2 py-1 text-xs font-medium text-white hover:bg-red-700", children: "Error" }), _jsx("button", { onClick: () => toast.info("Info: Processing your request..."), className: "rounded bg-blue-600 px-2 py-1 text-xs font-medium text-white hover:bg-blue-700", children: "Info" }), _jsx("button", { onClick: () => toast.warning("Warning: Low balance detected"), className: "rounded bg-yellow-600 px-2 py-1 text-xs font-medium text-white hover:bg-yellow-700", children: "Warning" }), _jsx("button", { onClick: () => {
+                                        toast.success("Multiple test 1");
+                                        setTimeout(() => toast.info("Multiple test 2"), 200);
+                                        setTimeout(() => toast.warning("Multiple test 3"), 400);
+                                    }, className: "rounded bg-purple-600 px-2 py-1 text-xs font-medium text-white hover:bg-purple-700", children: "Multiple" })] })] })), _jsxs("div", { className: "crypto-payment-methods flex flex-col gap-4", children: [(shouldShowConnectedEOA || globalAddress) && (_jsxs("div", { className: "installed-wallets", children: [_jsx("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Connected wallets" }), _jsxs("div", { className: "space-y-2", children: [shouldShowConnectedEOA && (_jsx("button", { onClick: () => {
+                                                setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                                onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                                toast.success(`Selected ${eoaWalletInfo?.name || "wallet"}`);
+                                            }, className: cn("crypto-payment-method-connect-wallet eoa-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET
+                                                ? "connected-wallet border-as-brand bg-as-brand/5"
+                                                : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-5 w-5 text-blue-600" }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: eoaWalletInfo?.name || "Connected Wallet" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(connectedEOAWallet?.getAccount()?.address || "") })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })), _jsx("button", { onClick: e => {
+                                                                    e.stopPropagation();
+                                                                    if (connectedEOAWallet) {
+                                                                        disconnect(connectedEOAWallet);
+                                                                    }
+                                                                    toast.success("Wallet disconnected");
+                                                                    if (selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
+                                                                        setSelectedPaymentMethod(CryptoPaymentMethodType.NONE);
+                                                                    }
+                                                                }, className: "text-as-primary/60 hover:text-as-primary/80 rounded-lg p-1.5 transition-colors", children: _jsx(X, { className: "h-4 w-4" }) })] })] }) })), globalAddress && (_jsx("button", { onClick: () => {
+                                                setSelectedPaymentMethod(CryptoPaymentMethodType.GLOBAL_WALLET);
+                                                onSelectPaymentMethod(CryptoPaymentMethodType.GLOBAL_WALLET);
+                                                toast.success("Selected B3 Account");
+                                            }, className: cn("crypto-payment-method-global-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET
+                                                ? "connected-wallet border-as-brand bg-as-brand/5"
+                                                : "border-as-border-secondary bg-as-surface-primary hover:border-as-secondary/80"), children: _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(WalletImage, { fallback: _jsx("div", { className: "wallet-icon flex h-10 w-10 items-center justify-center rounded-full bg-purple-100", children: _jsx(Wallet, { className: "h-5 w-5 text-purple-600" }) }) }), _jsxs("div", { className: "flex flex-col", children: [_jsx("span", { className: "text-as-primary font-semibold", children: "Global Account" }), _jsx("span", { className: "text-as-primary/60 text-sm", children: shortenAddress(globalAddress || "") })] })] }), _jsx("div", { className: "flex items-center gap-2", children: selectedPaymentMethod === CryptoPaymentMethodType.GLOBAL_WALLET && (_jsx("div", { className: "h-2 w-2 rounded-full bg-green-500" })) })] }) }))] })] })), _jsxs("div", { className: "other-payment-methods", children: [_jsx("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Payment methods" }), _jsxs("div", { className: "space-y-3", children: [_jsxs("button", { onClick: handleConnectWallet, className: "crypto-payment-method-connect-wallet bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-blue-100", children: _jsx(Wallet, { className: "h-4 w-4 text-blue-600" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Connect wallet" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] }), _jsxs("button", { onClick: () => {
+                                                setSelectedPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+                                                onSelectPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+                                            }, disabled: isCreatingOrder, className: "crypto-payment-method-transfer bg-as-surface-primary border-as-border-secondary hover:border-as-secondary/80 group flex w-full items-center justify-between gap-4 rounded-xl border px-4 py-3.5 transition-all duration-200 hover:shadow-md", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx("div", { className: "wallet-icon flex h-8 w-8 items-center justify-center rounded-full bg-orange-100", children: _jsx(ZapIcon, { className: "h-4 w-4" }) }), _jsx("div", { className: "flex flex-col items-start text-left", children: _jsx("h4", { className: "text-as-primary font-semibold", children: "Transfer crypto" }) })] }), _jsx(ChevronRightCircle, { className: "text-as-primary/40 group-hover:text-as-primary/60 h-5 w-5 transition-colors" })] })] })] })] })] }) }));
 }

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

@@ -9,7 +9,6 @@ import { base, mainnet } from "viem/chains";
 import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMethod.js";
 import { FiatPaymentMethod } from "../components/common/FiatPaymentMethod.js";
 import { useAutoSelectCryptoPaymentMethod } from "./useAutoSelectCryptoPaymentMethod.js";
-import { useAutoSetActiveWalletFromWagmi } from "./useAutoSetActiveWalletFromWagmi.js";
 import { useConnectedWalletDisplay } from "./useConnectedWalletDisplay.js";
 import { useCryptoPaymentMethodState } from "./useCryptoPaymentMethodState.js";
 import { useRecipientAddressState } from "./useRecipientAddressState.js";
@@ -49,8 +48,6 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
     // Recipient state with dual-state system (auto + explicit user selection)
     const { address: globalAddress } = useAccountWallet();
     const { walletAddress } = useConnectedWalletDisplay(effectiveCryptoPaymentMethod);
-    // Auto-set active wallet from wagmi
-    useAutoSetActiveWalletFromWagmi();
     // Recipient address state - hook automatically manages priority: props > user selection > wallet/global
     const { setSelectedRecipientAddress, effectiveRecipientAddress } = useRecipientAddressState({
         recipientAddressFromProps: recipientAddress,

package/dist/esm/anyspend/react/providers/AnyspendProvider.js

@@ -1,19 +1,8 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { TooltipProvider } from "../../../global-account/react/index.js";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import { useState } from "react";
 import { FeatureFlagsProvider } from "../contexts/FeatureFlagsContext.js";
 import { StripeRedirectHandler } from "./StripeRedirectHandler.js";
-const defaultQueryClientConfig = {
-    defaultOptions: {
-        queries: {
-            refetchOnWindowFocus: false,
-            retry: false,
-            staleTime: 30000,
-        },
-    },
-};
 /**
  * AnyspendProvider is a top-level provider that wraps your application to provide
  * query caching and state management for all Anyspend hooks.
@@ -38,6 +27,5 @@ const defaultQueryClientConfig = {
  * ```
  */
 export const AnyspendProvider = function AnyspendProvider({ children, featureFlags }) {
-    const [queryClient] = useState(() => new QueryClient(defaultQueryClientConfig));
-    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(FeatureFlagsProvider, { featureFlags: featureFlags, children: _jsxs(TooltipProvider, { children: [_jsx(StripeRedirectHandler, {}), children] }) }) }));
+    return (_jsx(FeatureFlagsProvider, { featureFlags: featureFlags, children: _jsxs(TooltipProvider, { children: [_jsx(StripeRedirectHandler, {}), children] }) }));
 };

package/dist/esm/anyspend/utils/chain.d.ts

@@ -1,6 +1,44 @@
 import { components } from "../../anyspend/types/api";
 import { Account, Chain, PublicClient, Transport, WalletClient } from "viem";
 import { ChainType, IBaseChain, IEVMChain, ISolanaChain } from "../types/chain";
+export declare const hyperEVM: {
+    blockExplorers: {
+        readonly default: {
+            readonly name: "HyperEVM Explorer";
+            readonly url: "https://hyperevmscan.io/";
+        };
+    };
+    blockTime?: number | undefined | undefined;
+    contracts?: {
+        [x: string]: import("viem").ChainContract | {
+            [sourceId: number]: import("viem").ChainContract | undefined;
+        } | undefined;
+        ensRegistry?: import("viem").ChainContract | undefined;
+        ensUniversalResolver?: import("viem").ChainContract | undefined;
+        multicall3?: import("viem").ChainContract | undefined;
+        erc6492Verifier?: import("viem").ChainContract | undefined;
+    } | undefined;
+    ensTlds?: readonly string[] | undefined;
+    id: 999;
+    name: "HyperEVM";
+    nativeCurrency: {
+        readonly name: "HyperEVM";
+        readonly symbol: "HYPE";
+        readonly decimals: 18;
+    };
+    experimental_preconfirmationTime?: number | undefined | undefined;
+    rpcUrls: {
+        readonly default: {
+            readonly http: readonly ["https://rpc.hyperliquid.xyz/evm"];
+        };
+    };
+    sourceId?: number | undefined | undefined;
+    testnet?: boolean | undefined | undefined;
+    custom?: Record<string, unknown> | undefined;
+    fees?: import("viem").ChainFees<undefined> | undefined;
+    formatters?: undefined;
+    serializers?: import("viem").ChainSerializers<undefined, import("viem").TransactionSerializable> | undefined;
+};
 export declare const EVM_MAINNET: Record<number, IEVMChain>;
 export declare const EVM_TESTNET: Record<number, IEVMChain>;
 export declare const SOLANA_MAINNET: ISolanaChain;

package/dist/esm/anyspend/utils/chain.js

@@ -3,10 +3,17 @@ import invariant from "invariant";
 import { createPublicClient, createWalletClient, defineChain, http, parseEther, } from "viem";
 import { abstract, arbitrum, avalanche, b3, base, bsc, mainnet, optimism, polygon } from "viem/chains";
 import { ChainType } from "../types/chain.js";
-import { getAvaxToken, getBnbToken, getEthToken, getPolToken, getSolanaToken } from "./token.js";
+import { getAvaxToken, getBnbToken, getEthToken, getHyperEVMNativeToken, getPolToken, getSolanaToken, HYPEREVM_CHAIN_ID, } from "./token.js";
 function getCustomEvmChain(chain, rpcUrl) {
     return defineChain({ ...chain, rpcUrls: { default: { http: [rpcUrl] } } });
 }
+export const hyperEVM = defineChain({
+    id: HYPEREVM_CHAIN_ID,
+    name: "HyperEVM",
+    nativeCurrency: { name: "HyperEVM", symbol: "HYPE", decimals: 18 },
+    rpcUrls: { default: { http: ["https://rpc.hyperliquid.xyz/evm"] } },
+    blockExplorers: { default: { name: "HyperEVM Explorer", url: "https://hyperevmscan.io/" } },
+});
 // export const b4testnet = defineChain({
 //   id: 19934,
 //   name: "B4 Testnet",
@@ -150,6 +157,20 @@ export const EVM_MAINNET = {
         coingeckoName: "abstract",
         wethAddress: "0x3439153eb7af838ad19d56e1571fbd09333c2809",
     },
+    [hyperEVM.id]: {
+        id: hyperEVM.id,
+        name: hyperEVM.name,
+        logoUrl: "https://s2.coinmarketcap.com/static/img/coins/64x64/32196.png",
+        type: ChainType.EVM,
+        nativeRequired: parseEther("0.01"),
+        canDepositNative: true,
+        defaultToken: getHyperEVMNativeToken(),
+        nativeToken: getHyperEVMNativeToken(),
+        viem: hyperEVM,
+        pollingInterval: 1000, // 1 second for Hyperliquid
+        coingeckoName: "hyperevm",
+        wethAddress: "0x5555555555555555555555555555555555555555",
+    },
 };
 export const EVM_TESTNET = {
 // [sepolia.id]: {

package/dist/esm/anyspend/utils/token.d.ts

@@ -1,7 +1,10 @@
 import { components } from "../../anyspend/types/api";
+export declare const HYPERLIQUID_CHAIN_ID = 1337;
+export declare const HYPEREVM_CHAIN_ID = 999;
 export declare function isNativeToken(address: string): boolean;
 export declare function getSolanaToken(): components["schemas"]["Token"];
 export declare function getEthToken(chainId: number): components["schemas"]["Token"];
 export declare function getPolToken(): components["schemas"]["Token"];
 export declare function getBnbToken(): components["schemas"]["Token"];
 export declare function getAvaxToken(): components["schemas"]["Token"];
+export declare function getHyperEVMNativeToken(): components["schemas"]["Token"];

package/dist/esm/anyspend/utils/token.js

@@ -1,5 +1,7 @@
-import { avalanche, bsc, polygon } from "viem/chains";
 import { RELAY_ETH_ADDRESS, RELAY_SOL_ADDRESS, RELAY_SOLANA_MAINNET_CHAIN_ID } from "../../anyspend/constants/index.js";
+import { avalanche, bsc, polygon } from "viem/chains";
+export const HYPERLIQUID_CHAIN_ID = 1337;
+export const HYPEREVM_CHAIN_ID = 999;
 export function isNativeToken(address) {
     return address.toLowerCase() === RELAY_ETH_ADDRESS || address.toLowerCase() === RELAY_SOL_ADDRESS;
 }
@@ -63,3 +65,15 @@ export function getAvaxToken() {
         },
     };
 }
+export function getHyperEVMNativeToken() {
+    return {
+        chainId: HYPEREVM_CHAIN_ID,
+        address: RELAY_ETH_ADDRESS,
+        symbol: "HYPE",
+        name: "HYPE",
+        decimals: 18,
+        metadata: {
+            logoURI: "https://s2.coinmarketcap.com/static/img/coins/64x64/32196.png",
+        },
+    };
+}