@b3dotfun/sdk 0.0.58-alpha.2 → 0.0.58-alpha.3

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

@@ -4,6 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.CryptoPaymentMethodType = void 0;
 exports.CryptoPaymentMethod = CryptoPaymentMethod;
 const jsx_runtime_1 = require("react/jsx-runtime");
+const utils_1 = require("../../../../anyspend/utils");
 const react_1 = require("../../../../global-account/react");
 const cn_1 = require("../../../../shared/utils/cn");
 const formatAddress_1 = require("../../../../shared/utils/formatAddress");
@@ -32,6 +33,8 @@ function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod,
     const [showWalletModal, setShowWalletModal] = (0, react_3.useState)(false);
     const setActiveWallet = (0, react_4.useSetActiveWallet)();
     const { data: eoaWalletInfo } = (0, react_4.useWalletInfo)(connectedEOAWallet?.id);
+    const activeWallet = (0, react_4.useActiveWallet)();
+    const setGlobalAccountWallet = (0, utils_1.useGlobalWalletState)(state => state.setGlobalAccountWallet);
     const isConnected = !!connectedEOAWallet;
     const globalAddress = connectedSmartWallet?.getAccount()?.address;
     // Helper function to check if two addresses are the same
@@ -173,6 +176,7 @@ function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentMethod,
     return ((0, jsx_runtime_1.jsxs)("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full", children: [(0, jsx_runtime_1.jsxs)("div", { className: (0, cn_1.cn)("relative flex flex-col gap-10"), children: [(0, jsx_runtime_1.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: (0, jsx_runtime_1.jsx)(lucide_react_1.ChevronLeft, { className: "h-6 w-6" }) }), (0, jsx_runtime_1.jsx)("div", { className: "flex items-center justify-around gap-4", children: (0, jsx_runtime_1.jsx)("div", { className: "flex-1 text-center", children: (0, jsx_runtime_1.jsx)("h2", { className: "text-as-primary text-lg font-semibold", children: "Select a payment method" }) }) }), (0, jsx_runtime_1.jsxs)("div", { className: "crypto-payment-methods flex flex-col gap-4", children: [(shouldShowConnectedEOA || shouldShowWagmiWallet || globalAddress) && ((0, jsx_runtime_1.jsxs)("div", { className: "installed-wallets", children: [(0, jsx_runtime_1.jsx)("h3", { className: "text-as-primary/80 mb-3 text-sm font-medium", children: "Connected wallets" }), (0, jsx_runtime_1.jsxs)("div", { className: "space-y-2", children: [shouldShowConnectedEOA && ((0, jsx_runtime_1.jsx)("button", { onClick: () => {
                                                     setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                                                     onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                                                    setGlobalAccountWallet(activeWallet);
                                                     setActiveWallet(connectedEOAWallet);
                                                     sonner_1.toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
                                                 }, className: (0, cn_1.cn)("crypto-payment-method-connect-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET

package/dist/cjs/anyspend/utils/accountStore.d.ts

@@ -0,0 +1,7 @@
+import type { Wallet } from "thirdweb/wallets";
+interface GlobalWalletState {
+    globalAccountWallet?: Wallet;
+    setGlobalAccountWallet: (account?: Wallet) => void;
+}
+export declare const useGlobalWalletState: import("zustand").UseBoundStore<import("zustand").StoreApi<GlobalWalletState>>;
+export {};

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

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useGlobalWalletState = void 0;
+const zustand_1 = require("zustand");
+exports.useGlobalWalletState = (0, zustand_1.create)(set => ({
+    globalAccountWallet: undefined,
+    setGlobalAccountWallet: account => set({ globalAccountWallet: account }),
+}));

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

@@ -1,3 +1,4 @@
+export * from "./accountStore";
 export * from "./address";
 export * from "./chain";
 export * from "./format";

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

@@ -14,6 +14,7 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
     for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
 };
 Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./accountStore"), exports);
 __exportStar(require("./address"), exports);
 __exportStar(require("./chain"), exports);
 __exportStar(require("./format"), exports);

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

@@ -5,9 +5,11 @@ const jsx_runtime_1 = require("react/jsx-runtime");
 const react_1 = require("../../../anyspend/react");
 const AnyspendDepositHype_1 = require("../../../anyspend/react/components/AnyspendDepositHype");
 const AnySpendStakeUpside_1 = require("../../../anyspend/react/components/AnySpendStakeUpside");
+const utils_1 = require("../../../anyspend/utils");
 const react_2 = require("../../../global-account/react");
 const cn_1 = require("../../../shared/utils/cn");
 const debug_1 = require("../../../shared/utils/debug");
+const react_3 = require("react");
 const AvatarEditor_1 = require("./AvatarEditor/AvatarEditor");
 const useB3_1 = require("./B3Provider/useB3");
 const LinkAccount_1 = require("./LinkAccount/LinkAccount");
@@ -16,11 +18,26 @@ const RequestPermissions_1 = require("./RequestPermissions/RequestPermissions");
 const SignInWithB3Flow_1 = require("./SignInWithB3/SignInWithB3Flow");
 const dialog_1 = require("./ui/dialog");
 const drawer_1 = require("./ui/drawer");
+const react_4 = require("thirdweb/react");
 const debug = (0, debug_1.debugB3React)("B3DynamicModal");
 function B3DynamicModal() {
     const { isOpen, setB3ModalOpen, contentType, history, navigateBack } = (0, react_2.useModalStore)();
     const { theme } = (0, useB3_1.useB3)();
     const isMobile = (0, react_2.useIsMobile)();
+    const prevIsOpenRef = (0, react_3.useRef)(isOpen);
+    const globalAccountWallet = (0, utils_1.useGlobalWalletState)(state => state.globalAccountWallet);
+    const setGlobalAccountWallet = (0, utils_1.useGlobalWalletState)(state => state.setGlobalAccountWallet);
+    const setActiveWallet = (0, react_4.useSetActiveWallet)();
+    // anyspend cleanup global account chnages by setting account back
+    (0, react_3.useEffect)(() => {
+        if (prevIsOpenRef.current && !isOpen) {
+            if (globalAccountWallet) {
+                setActiveWallet(globalAccountWallet);
+                setGlobalAccountWallet(undefined);
+            }
+        }
+        prevIsOpenRef.current = isOpen;
+    }, [isOpen, globalAccountWallet, setActiveWallet, setGlobalAccountWallet]);
     // Define arrays for different modal type groups
     const fullWidthTypes = [
         "anySpend",

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

@@ -1,5 +1,6 @@
 "use client";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useGlobalWalletState } from "../../../../anyspend/utils/index.js";
 import { useAccountWallet } from "../../../../global-account/react/index.js";
 import { cn } from "../../../../shared/utils/cn.js";
 import { shortenAddress } from "../../../../shared/utils/formatAddress.js";
@@ -9,7 +10,7 @@ import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-reac
 import { useState } from "react";
 import { createPortal } from "react-dom";
 import { toast } from "sonner";
-import { useSetActiveWallet, useWalletInfo } from "thirdweb/react";
+import { useActiveWallet, useSetActiveWallet, useWalletInfo } from "thirdweb/react";
 import { createWallet } from "thirdweb/wallets";
 import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
 export var CryptoPaymentMethodType;
@@ -28,6 +29,8 @@ export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentM
     const [showWalletModal, setShowWalletModal] = useState(false);
     const setActiveWallet = useSetActiveWallet();
     const { data: eoaWalletInfo } = useWalletInfo(connectedEOAWallet?.id);
+    const activeWallet = useActiveWallet();
+    const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
     const isConnected = !!connectedEOAWallet;
     const globalAddress = connectedSmartWallet?.getAccount()?.address;
     // Helper function to check if two addresses are the same
@@ -169,6 +172,7 @@ export function CryptoPaymentMethod({ selectedPaymentMethod, setSelectedPaymentM
     return (_jsxs("div", { className: "crypto-payment-method mx-auto h-fit w-[460px] max-w-full", 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" }) }) }), _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);
+                                                    setGlobalAccountWallet(activeWallet);
                                                     setActiveWallet(connectedEOAWallet);
                                                     toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
                                                 }, className: cn("crypto-payment-method-connect-wallet w-full rounded-xl border p-4 text-left transition-all hover:shadow-md", selectedPaymentMethod === CryptoPaymentMethodType.CONNECT_WALLET

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

@@ -0,0 +1,7 @@
+import type { Wallet } from "thirdweb/wallets";
+interface GlobalWalletState {
+    globalAccountWallet?: Wallet;
+    setGlobalAccountWallet: (account?: Wallet) => void;
+}
+export declare const useGlobalWalletState: import("zustand").UseBoundStore<import("zustand").StoreApi<GlobalWalletState>>;
+export {};

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

@@ -0,0 +1,5 @@
+import { create } from "zustand";
+export const useGlobalWalletState = create(set => ({
+    globalAccountWallet: undefined,
+    setGlobalAccountWallet: account => set({ globalAccountWallet: account }),
+}));

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

@@ -1,3 +1,4 @@
+export * from "./accountStore";
 export * from "./address";
 export * from "./chain";
 export * from "./format";

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

@@ -1,3 +1,4 @@
+export * from "./accountStore.js";
 export * from "./address.js";
 export * from "./chain.js";
 export * from "./format.js";

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

@@ -2,9 +2,11 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { AnySpend, AnySpendBondKit, AnySpendBuySpin, AnySpendNFT, AnyspendSignatureMint, AnySpendStakeB3, AnySpendTournament, OrderHistory, } from "../../../anyspend/react/index.js";
 import { AnySpendDepositHype } from "../../../anyspend/react/components/AnyspendDepositHype.js";
 import { AnySpendStakeUpside } from "../../../anyspend/react/components/AnySpendStakeUpside.js";
+import { useGlobalWalletState } from "../../../anyspend/utils/index.js";
 import { useIsMobile, useModalStore } from "../../../global-account/react/index.js";
 import { cn } from "../../../shared/utils/cn.js";
 import { debugB3React } from "../../../shared/utils/debug.js";
+import { useEffect, useRef } from "react";
 import { AvatarEditor } from "./AvatarEditor/AvatarEditor.js";
 import { useB3 } from "./B3Provider/useB3.js";
 import { LinkAccount } from "./LinkAccount/LinkAccount.js";
@@ -13,11 +15,26 @@ 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 { useSetActiveWallet } from "thirdweb/react";
 const debug = debugB3React("B3DynamicModal");
 export function B3DynamicModal() {
     const { isOpen, setB3ModalOpen, contentType, history, navigateBack } = useModalStore();
     const { theme } = useB3();
     const isMobile = useIsMobile();
+    const prevIsOpenRef = useRef(isOpen);
+    const globalAccountWallet = useGlobalWalletState(state => state.globalAccountWallet);
+    const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
+    const setActiveWallet = useSetActiveWallet();
+    // anyspend cleanup global account chnages by setting account back
+    useEffect(() => {
+        if (prevIsOpenRef.current && !isOpen) {
+            if (globalAccountWallet) {
+                setActiveWallet(globalAccountWallet);
+                setGlobalAccountWallet(undefined);
+            }
+        }
+        prevIsOpenRef.current = isOpen;
+    }, [isOpen, globalAccountWallet, setActiveWallet, setGlobalAccountWallet]);
     // Define arrays for different modal type groups
     const fullWidthTypes = [
         "anySpend",

package/dist/types/anyspend/utils/accountStore.d.ts

@@ -0,0 +1,7 @@
+import type { Wallet } from "thirdweb/wallets";
+interface GlobalWalletState {
+    globalAccountWallet?: Wallet;
+    setGlobalAccountWallet: (account?: Wallet) => void;
+}
+export declare const useGlobalWalletState: import("zustand").UseBoundStore<import("zustand").StoreApi<GlobalWalletState>>;
+export {};

package/dist/types/anyspend/utils/index.d.ts

@@ -1,3 +1,4 @@
+export * from "./accountStore";
 export * from "./address";
 export * from "./chain";
 export * from "./format";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@b3dotfun/sdk",
-  "version": "0.0.58-alpha.2",
+  "version": "0.0.58-alpha.3",
   "source": "src/index.ts",
   "main": "./dist/cjs/index.js",
   "react-native": "./dist/cjs/index.native.js",

package/src/anyspend/react/components/common/CryptoPaymentMethod.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { useGlobalWalletState } from "@b3dotfun/sdk/anyspend/utils";
 import { useAccountWallet } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { shortenAddress } from "@b3dotfun/sdk/shared/utils/formatAddress";
@@ -9,7 +10,7 @@ import { ChevronLeft, ChevronRightCircle, Wallet, X, ZapIcon } from "lucide-reac
 import { useState } from "react";
 import { createPortal } from "react-dom";
 import { toast } from "sonner";
-import { useSetActiveWallet, useWalletInfo } from "thirdweb/react";
+import { useActiveWallet, useSetActiveWallet, useWalletInfo } from "thirdweb/react";
 import { WalletId, createWallet } from "thirdweb/wallets";
 import { useAccount, useConnect, useDisconnect, useWalletClient } from "wagmi";
 
@@ -51,10 +52,12 @@ export function CryptoPaymentMethod({
   const { disconnect } = useDisconnect();
   const { data: walletClient } = useWalletClient();
   const [showWalletModal, setShowWalletModal] = useState(false);
-
   const setActiveWallet = useSetActiveWallet();
   const { data: eoaWalletInfo } = useWalletInfo(connectedEOAWallet?.id);
 
+  const activeWallet = useActiveWallet();
+  const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
+
   const isConnected = !!connectedEOAWallet;
   const globalAddress = connectedSmartWallet?.getAccount()?.address;
 
@@ -233,6 +236,7 @@ export function CryptoPaymentMethod({
                     onClick={() => {
                       setSelectedPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
                       onSelectPaymentMethod(CryptoPaymentMethodType.CONNECT_WALLET);
+                      setGlobalAccountWallet(activeWallet);
                       setActiveWallet(connectedEOAWallet);
                       toast.success(`Selected ${eoaWalletInfo?.name || connector?.name || "wallet"}`);
                     }}

package/src/anyspend/utils/accountStore.ts

@@ -0,0 +1,12 @@
+import type { Wallet } from "thirdweb/wallets";
+import { create } from "zustand";
+
+interface GlobalWalletState {
+  globalAccountWallet?: Wallet;
+  setGlobalAccountWallet: (account?: Wallet) => void;
+}
+
+export const useGlobalWalletState = create<GlobalWalletState>(set => ({
+  globalAccountWallet: undefined,
+  setGlobalAccountWallet: account => set({ globalAccountWallet: account }),
+}));

package/src/anyspend/utils/index.ts

@@ -1,3 +1,4 @@
+export * from "./accountStore";
 export * from "./address";
 export * from "./chain";
 export * from "./format";

package/src/global-account/react/components/B3DynamicModal.tsx

@@ -10,9 +10,11 @@ import {
 } from "@b3dotfun/sdk/anyspend/react";
 import { AnySpendDepositHype } from "@b3dotfun/sdk/anyspend/react/components/AnyspendDepositHype";
 import { AnySpendStakeUpside } from "@b3dotfun/sdk/anyspend/react/components/AnySpendStakeUpside";
+import { useGlobalWalletState } from "@b3dotfun/sdk/anyspend/utils";
 import { useIsMobile, useModalStore } from "@b3dotfun/sdk/global-account/react";
 import { cn } from "@b3dotfun/sdk/shared/utils/cn";
 import { debugB3React } from "@b3dotfun/sdk/shared/utils/debug";
+import { useEffect, useRef } from "react";
 import { AvatarEditor } from "./AvatarEditor/AvatarEditor";
 import { useB3 } from "./B3Provider/useB3";
 import { LinkAccount } from "./LinkAccount/LinkAccount";
@@ -21,6 +23,7 @@ import { RequestPermissions } from "./RequestPermissions/RequestPermissions";
 import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./ui/dialog";
 import { Drawer, DrawerContent, DrawerDescription, DrawerTitle } from "./ui/drawer";
+import { useSetActiveWallet } from "thirdweb/react";
 
 const debug = debugB3React("B3DynamicModal");
 
@@ -28,6 +31,23 @@ export function B3DynamicModal() {
   const { isOpen, setB3ModalOpen, contentType, history, navigateBack } = useModalStore();
   const { theme } = useB3();
   const isMobile = useIsMobile();
+  const prevIsOpenRef = useRef(isOpen);
+
+  const globalAccountWallet = useGlobalWalletState(state => state.globalAccountWallet);
+  const setGlobalAccountWallet = useGlobalWalletState(state => state.setGlobalAccountWallet);
+  const setActiveWallet = useSetActiveWallet();
+
+  // anyspend cleanup global account chnages by setting account back
+  useEffect(() => {
+    if (prevIsOpenRef.current && !isOpen) {
+      if (globalAccountWallet) {
+        setActiveWallet(globalAccountWallet);
+        setGlobalAccountWallet(undefined);
+      }
+    }
+
+    prevIsOpenRef.current = isOpen;
+  }, [isOpen, globalAccountWallet, setActiveWallet, setGlobalAccountWallet]);
 
   // Define arrays for different modal type groups
   const fullWidthTypes = [