@b3dotfun/sdk 0.0.65 → 0.0.66-alpha.0

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

@@ -7,11 +7,12 @@ import { useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
 import { parseUnits } from "viem";
 import { base, mainnet } from "viem/chains";
-import { useAccount } from "wagmi";
 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";
 export var PanelView;
 (function (PanelView) {
     PanelView[PanelView["MAIN"] = 0] = "MAIN";
@@ -37,17 +38,17 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
     const defaultDstToken = B3_TOKEN; // Default destination token
     const [selectedSrcToken, setSelectedSrcToken] = useState(defaultSrcToken);
     const [selectedDstToken, setSelectedDstToken] = useState(defaultDstToken);
-    const [srcAmount, setSrcAmount] = useState(paymentType === "fiat" ? "5" : "0.1");
+    const [srcAmount, setSrcAmount] = useState(paymentType === "fiat" ? "5" : "0");
     const [dstAmount, setDstAmount] = useState("");
     const [isSrcInputDirty, setIsSrcInputDirty] = useState(true);
     // Derive destination chain ID from token or prop (cannot change)
     const selectedDstChainId = destinationTokenChainId || selectedDstToken.chainId;
-    // Payment method state
-    const [selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod] = useState(CryptoPaymentMethodType.NONE);
+    // Payment method state with dual-state system (auto + explicit user selection)
+    const { cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, effectiveCryptoPaymentMethod, resetPaymentMethods, } = useCryptoPaymentMethodState();
     const [selectedFiatPaymentMethod, setSelectedFiatPaymentMethod] = useState(FiatPaymentMethod.NONE);
     // Recipient state
     const { address: globalAddress } = useAccountWallet();
-    const { address: wagmiAddress } = useAccount();
+    const { walletAddress } = useConnectedWalletDisplay(effectiveCryptoPaymentMethod);
     const [selectedRecipientAddress, setSelectedRecipientAddress] = useState(recipientAddress);
     const recipientProfile = useProfile({ address: selectedRecipientAddress, fresh: true });
     const recipientName = recipientProfile.data?.name;
@@ -62,7 +63,7 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
     // Check token balance for crypto payments
     const { rawBalance, isLoading: isBalanceLoading } = useTokenBalance({
         token: selectedSrcToken,
-        address: wagmiAddress,
+        address: walletAddress,
     });
     // Check if user has enough balance
     const hasEnoughBalance = useMemo(() => {
@@ -79,8 +80,9 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
     // Auto-select crypto payment method based on available wallets and balance
     useAutoSelectCryptoPaymentMethod({
         paymentType,
+        cryptoPaymentMethod,
+        setCryptoPaymentMethod,
         selectedCryptoPaymentMethod,
-        setSelectedCryptoPaymentMethod,
         hasEnoughBalance,
         isBalanceLoading,
     });
@@ -180,9 +182,9 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
             if (!disableUrlParamManagement) {
                 const params = new URLSearchParams(searchParams.toString()); // Preserve existing params
                 params.set("orderId", newOrderId);
-                if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
-                    console.log("Setting cryptoPaymentMethod in URL:", selectedCryptoPaymentMethod);
-                    params.set("cryptoPaymentMethod", selectedCryptoPaymentMethod);
+                if (effectiveCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+                    console.log("Setting cryptoPaymentMethod in URL:", effectiveCryptoPaymentMethod);
+                    params.set("cryptoPaymentMethod", effectiveCryptoPaymentMethod);
                 }
                 else {
                     console.log("Payment method is NONE, not setting in URL");
@@ -246,8 +248,12 @@ export function useAnyspendFlow({ paymentType = "crypto", recipientAddress, load
         isSrcInputDirty,
         setIsSrcInputDirty,
         // Payment methods
+        cryptoPaymentMethod,
+        setCryptoPaymentMethod,
         selectedCryptoPaymentMethod,
         setSelectedCryptoPaymentMethod,
+        effectiveCryptoPaymentMethod,
+        resetPaymentMethods,
         selectedFiatPaymentMethod,
         setSelectedFiatPaymentMethod,
         // Recipient

package/dist/esm/anyspend/react/hooks/useAutoSelectCryptoPaymentMethod.d.ts

@@ -2,10 +2,12 @@ import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMetho
 interface UseAutoSelectCryptoPaymentMethodParams {
     /** Current payment type (crypto or fiat) */
     paymentType?: "crypto" | "fiat";
-    /** Currently selected payment method */
+    /** Auto-selected payment method based on balance (not used in hook logic, but part of state management) */
+    cryptoPaymentMethod: CryptoPaymentMethodType;
+    /** Function to update the auto-selected payment method */
+    setCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
+    /** User explicitly selected payment method (NONE means no explicit selection) */
     selectedCryptoPaymentMethod: CryptoPaymentMethodType;
-    /** Function to update the selected payment method */
-    setSelectedCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
     /** Whether user has enough balance to pay */
     hasEnoughBalance: boolean;
     /** Whether balance is still loading */
@@ -16,11 +18,11 @@ interface UseAutoSelectCryptoPaymentMethodParams {
  * based on available wallets and balance.
  *
  * Auto-selection logic:
- * - Only auto-selects when payment method is NONE (doesn't override user choices)
+ * - Only auto-selects when selectedCryptoPaymentMethod is NONE (user hasn't explicitly chosen)
  * - If EOA/Wagmi wallet connected + has balance → CONNECT_WALLET
  * - If EOA/Wagmi wallet connected + insufficient balance → TRANSFER_CRYPTO
  * - If only Global wallet available → GLOBAL_WALLET
  * - If no wallets → remains NONE
  */
-export declare function useAutoSelectCryptoPaymentMethod({ paymentType, selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, hasEnoughBalance, isBalanceLoading, }: UseAutoSelectCryptoPaymentMethodParams): void;
+export declare function useAutoSelectCryptoPaymentMethod({ paymentType, cryptoPaymentMethod: _cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, hasEnoughBalance, isBalanceLoading, }: UseAutoSelectCryptoPaymentMethodParams): void;
 export {};

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

@@ -6,18 +6,22 @@ import { useConnectedWalletDisplay } from "./useConnectedWalletDisplay.js";
  * based on available wallets and balance.
  *
  * Auto-selection logic:
- * - Only auto-selects when payment method is NONE (doesn't override user choices)
+ * - Only auto-selects when selectedCryptoPaymentMethod is NONE (user hasn't explicitly chosen)
  * - If EOA/Wagmi wallet connected + has balance → CONNECT_WALLET
  * - If EOA/Wagmi wallet connected + insufficient balance → TRANSFER_CRYPTO
  * - If only Global wallet available → GLOBAL_WALLET
  * - If no wallets → remains NONE
  */
-export function useAutoSelectCryptoPaymentMethod({ paymentType = "crypto", selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod, hasEnoughBalance, isBalanceLoading, }) {
+export function useAutoSelectCryptoPaymentMethod({ paymentType = "crypto", cryptoPaymentMethod: _cryptoPaymentMethod, setCryptoPaymentMethod, selectedCryptoPaymentMethod, hasEnoughBalance, isBalanceLoading, }) {
     // Get suggested payment method based on available wallets
     const { suggestedPaymentMethod } = useConnectedWalletDisplay(selectedCryptoPaymentMethod);
     useEffect(() => {
-        // Only auto-select when on crypto payment type and payment method is NONE
-        if (paymentType !== "crypto" || selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
+        // Only auto-select when on crypto payment type
+        if (paymentType !== "crypto") {
+            return;
+        }
+        // Only auto-switch if user hasn't explicitly selected a payment method
+        if (selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE) {
             return;
         }
         // If we have a suggested payment method (wallet is connected), use it
@@ -26,28 +30,28 @@ export function useAutoSelectCryptoPaymentMethod({ paymentType = "crypto", selec
             // Otherwise, default to TRANSFER_CRYPTO if balance is insufficient
             if (!isBalanceLoading) {
                 if (hasEnoughBalance && suggestedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
-                    setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                    setCryptoPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                 }
                 else if (!hasEnoughBalance && suggestedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET) {
                     // Wallet connected but insufficient balance - suggest transfer
-                    setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
+                    setCryptoPaymentMethod(CryptoPaymentMethodType.TRANSFER_CRYPTO);
                 }
                 else {
                     // Use suggested method (e.g., GLOBAL_WALLET)
-                    setSelectedCryptoPaymentMethod(suggestedPaymentMethod);
+                    setCryptoPaymentMethod(suggestedPaymentMethod);
                 }
             }
             else {
                 // Balance still loading, use suggested method
-                setSelectedCryptoPaymentMethod(suggestedPaymentMethod);
+                setCryptoPaymentMethod(suggestedPaymentMethod);
             }
         }
     }, [
         paymentType,
+        setCryptoPaymentMethod,
         selectedCryptoPaymentMethod,
         suggestedPaymentMethod,
         hasEnoughBalance,
         isBalanceLoading,
-        setSelectedCryptoPaymentMethod,
     ]);
 }

package/dist/esm/anyspend/react/hooks/useCryptoPaymentMethodState.d.ts

@@ -0,0 +1,42 @@
+import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMethod";
+interface UseCryptoPaymentMethodStateResult {
+    /** Auto-selected payment method based on balance */
+    cryptoPaymentMethod: CryptoPaymentMethodType;
+    /** Function to update the auto-selected payment method */
+    setCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
+    /** User explicitly selected payment method (NONE means no explicit selection) */
+    selectedCryptoPaymentMethod: CryptoPaymentMethodType;
+    /** Function to update the user-selected payment method */
+    setSelectedCryptoPaymentMethod: (method: CryptoPaymentMethodType) => void;
+    /** Effective payment method (user selection takes priority over auto-selection) */
+    effectiveCryptoPaymentMethod: CryptoPaymentMethodType;
+    /** Reset both payment method states to NONE */
+    resetPaymentMethods: () => void;
+}
+/**
+ * Custom hook to manage crypto payment method state with dual-state system:
+ *
+ * - `cryptoPaymentMethod`: Auto-selected based on wallet availability and balance
+ * - `selectedCryptoPaymentMethod`: Explicitly selected by user
+ * - `effectiveCryptoPaymentMethod`: User selection takes priority over auto-selection
+ *
+ * This allows automatic payment method suggestions while respecting explicit user choices.
+ *
+ * @example
+ * ```tsx
+ * const {
+ *   cryptoPaymentMethod,
+ *   setCryptoPaymentMethod,
+ *   selectedCryptoPaymentMethod,
+ *   setSelectedCryptoPaymentMethod,
+ *   effectiveCryptoPaymentMethod,
+ *   resetPaymentMethods
+ * } = useCryptoPaymentMethodState();
+ *
+ * // Use effectiveCryptoPaymentMethod for display
+ * // Use setSelectedCryptoPaymentMethod when user explicitly selects
+ * // Call resetPaymentMethods when switching tabs or going back
+ * ```
+ */
+export declare function useCryptoPaymentMethodState(): UseCryptoPaymentMethodStateResult;
+export {};

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

@@ -0,0 +1,48 @@
+import { useState } from "react";
+import { CryptoPaymentMethodType } from "../components/common/CryptoPaymentMethod.js";
+/**
+ * Custom hook to manage crypto payment method state with dual-state system:
+ *
+ * - `cryptoPaymentMethod`: Auto-selected based on wallet availability and balance
+ * - `selectedCryptoPaymentMethod`: Explicitly selected by user
+ * - `effectiveCryptoPaymentMethod`: User selection takes priority over auto-selection
+ *
+ * This allows automatic payment method suggestions while respecting explicit user choices.
+ *
+ * @example
+ * ```tsx
+ * const {
+ *   cryptoPaymentMethod,
+ *   setCryptoPaymentMethod,
+ *   selectedCryptoPaymentMethod,
+ *   setSelectedCryptoPaymentMethod,
+ *   effectiveCryptoPaymentMethod,
+ *   resetPaymentMethods
+ * } = useCryptoPaymentMethodState();
+ *
+ * // Use effectiveCryptoPaymentMethod for display
+ * // Use setSelectedCryptoPaymentMethod when user explicitly selects
+ * // Call resetPaymentMethods when switching tabs or going back
+ * ```
+ */
+export function useCryptoPaymentMethodState() {
+    // cryptoPaymentMethod: auto-selected based on balance
+    const [cryptoPaymentMethod, setCryptoPaymentMethod] = useState(CryptoPaymentMethodType.NONE);
+    // selectedCryptoPaymentMethod: explicitly selected by user (NONE means no explicit selection)
+    const [selectedCryptoPaymentMethod, setSelectedCryptoPaymentMethod] = useState(CryptoPaymentMethodType.NONE);
+    // The effective payment method (user selection takes priority over auto-selection)
+    const effectiveCryptoPaymentMethod = selectedCryptoPaymentMethod !== CryptoPaymentMethodType.NONE ? selectedCryptoPaymentMethod : cryptoPaymentMethod;
+    // Helper function to reset both states
+    const resetPaymentMethods = () => {
+        setCryptoPaymentMethod(CryptoPaymentMethodType.NONE);
+        setSelectedCryptoPaymentMethod(CryptoPaymentMethodType.NONE);
+    };
+    return {
+        cryptoPaymentMethod,
+        setCryptoPaymentMethod,
+        selectedCryptoPaymentMethod,
+        setSelectedCryptoPaymentMethod,
+        effectiveCryptoPaymentMethod,
+        resetPaymentMethods,
+    };
+}

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

@@ -17,6 +17,7 @@ import { RequestPermissions } from "./RequestPermissions/RequestPermissions.js";
 import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow.js";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./ui/dialog.js";
 import { Drawer, DrawerContent, DrawerDescription, DrawerTitle } from "./ui/drawer.js";
+import { AnySpendDepositUpside } from "../../../anyspend/react/components/AnySpendDepositUpside.js";
 const debug = debugB3React("B3DynamicModal");
 export function B3DynamicModal() {
     const { isOpen, setB3ModalOpen, contentType, history, navigateBack } = useModalStore();
@@ -102,6 +103,8 @@ export function B3DynamicModal() {
                 return _jsx(AnySpendStakeUpside, { ...contentType, mode: "modal" });
             case "anySpendStakeUpsideExactIn":
                 return _jsx(AnySpendStakeUpsideExactIn, { ...contentType, mode: "modal" });
+            case "anySpendDepositUpside":
+                return _jsx(AnySpendDepositUpside, { ...contentType, mode: "modal" });
             case "anySpendBuySpin":
                 return _jsx(AnySpendBuySpin, { ...contentType, mode: "modal" });
             case "anySpendSignatureMint":

package/dist/esm/global-account/react/hooks/useUnifiedChainSwitchAndExecute.js

@@ -6,7 +6,6 @@ import invariant from "invariant";
 import { useCallback, useState } from "react";
 import { toast } from "sonner";
 import { prepareTransaction, sendTransaction as twSendTransaction } from "thirdweb";
-import { useActiveWallet } from "thirdweb/react";
 import { isAddress } from "viem";
 import { useSwitchChain } from "wagmi";
 import { useB3 } from "../components/index.js";
@@ -19,7 +18,6 @@ invariant(partnerId, "Partner ID is required");
 export function useUnifiedChainSwitchAndExecute() {
     const { switchChainAsync } = useSwitchChain();
     const [isSwitchingOrExecuting, setIsSwitchingOrExecuting] = useState(false);
-    const activeWallet = useActiveWallet();
     const { isActiveSmartWallet, isActiveEOAWallet, connectedEOAWallet } = useAccountWallet();
     const { account: aaAccount } = useB3();
     // Handle EOA wallet chain switch and execute transaction
@@ -34,18 +32,18 @@ export function useUnifiedChainSwitchAndExecute() {
             toast.error(`Chain ${targetChainId} is not supported`);
             return;
         }
-        const currentChainId = activeWallet?.getChain()?.id;
+        const currentChainId = connectedEOAWallet?.getChain()?.id;
         const onCorrectChain = currentChainId === targetChainId;
         // Helper function to execute the transaction
         const executeTransaction = async () => {
-            const signer = activeWallet?.getAccount();
+            const signer = connectedEOAWallet?.getAccount();
             if (!signer) {
                 throw new Error("No account connected");
             }
             // Coinbase Smart Wallet specific chain switching (different behavior from other wallets)
             const walletChain = connectedEOAWallet.getChain();
             if (walletChain?.id !== targetChainId) {
-                activeWallet?.switchChain(getThirdwebChain(targetChainId));
+                connectedEOAWallet?.switchChain(getThirdwebChain(targetChainId));
             }
             invariant(isAddress(params.to), "params.to is not a valid address");
             const result = await signer.sendTransaction({
@@ -97,7 +95,7 @@ export function useUnifiedChainSwitchAndExecute() {
         finally {
             setIsSwitchingOrExecuting(false);
         }
-    }, [connectedEOAWallet, activeWallet, switchChainAsync]);
+    }, [connectedEOAWallet, switchChainAsync]);
     // Handle AA wallet transaction (no chain switch needed for AA)
     const handleAASendTransaction = useCallback(async (targetChainId, params) => {
         if (!aaAccount) {
@@ -153,14 +151,8 @@ export function useUnifiedChainSwitchAndExecute() {
         if (isActiveSmartWallet) {
             return handleAASendTransaction(targetChainId, params);
         }
-        else if (isActiveEOAWallet) {
-            return handleEOASwitchChainAndSendTransaction(targetChainId, params);
-        }
-        else {
-            toast.error("No wallet connected");
-            return undefined;
-        }
-    }, [isActiveSmartWallet, isActiveEOAWallet, handleAASendTransaction, handleEOASwitchChainAndSendTransaction]);
+        return handleEOASwitchChainAndSendTransaction(targetChainId, params);
+    }, [isActiveSmartWallet, handleAASendTransaction, handleEOASwitchChainAndSendTransaction]);
     return {
         switchChainAndExecute,
         switchChainAndExecuteWithEOA: handleEOASwitchChainAndSendTransaction,

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

@@ -260,6 +260,26 @@ export interface AnySpendStakeUpsideExactInProps extends BaseModalProps {
     /** Callback function called when the stake is successful */
     onSuccess?: () => void;
 }
+/**
+ * Props for the AnySpend Deposit Upside (Exact In) modal
+ * Handles token deposit operations using the custom exact in flow
+ */
+export interface AnySpendDepositUpsideProps extends BaseModalProps {
+    /** Modal type identifier */
+    type: "anySpendDepositUpside";
+    /**	Source token address */
+    sourceTokenAddress?: string;
+    /** Source token address */
+    sourceTokenChainId?: number;
+    /** Recipient address to deposit tokens for */
+    recipientAddress: string;
+    /** Deposit contract address */
+    depositContractAddress: string;
+    /** Token to deposit */
+    token: components["schemas"]["Token"];
+    /** Callback function called when the deposit is successful */
+    onSuccess?: () => void;
+}
 /**
  * Props for the AnySpend Buy Spin modal
  * Handles spin wheel entry purchases
@@ -360,7 +380,7 @@ export interface ProfileEditorModalProps extends BaseModalProps {
 /**
  * Union type of all possible modal content types
  */
-export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendStakeB3ExactInProps | AnySpendStakeUpsideProps | AnySpendStakeUpsideExactInProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | ProfileEditorModalProps;
+export type ModalContentType = SignInWithB3ModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendStakeB3ExactInProps | AnySpendStakeUpsideProps | AnySpendStakeUpsideExactInProps | AnySpendDepositUpsideProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | ProfileEditorModalProps;
 /**
  * State interface for the modal store
  */