@b3dotfun/sdk 0.0.77-alpha.1 → 0.0.77-alpha.2

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

@@ -0,0 +1,20 @@
+import { TurnkeyAuthInitResponse } from "@b3dotfun/b3-api";
+interface UseTurnkeyAuthReturn {
+    initiateLogin: (_email: string) => Promise<TurnkeyAuthInitResponse>;
+    verifyOtp: (_otpId: string, _otpCode: string) => Promise<{
+        user: any;
+    }>;
+    isLoading: boolean;
+    error: string | null;
+    clearError: () => void;
+}
+/**
+ * Hook for Turnkey email-based OTP authentication
+ *
+ * Usage:
+ * 1. Call initiateLogin(email) → User receives OTP email
+ * 2. Call verifyOtp(...) → Verifies OTP and authenticates with b3-api
+ * 3. User is authenticated, JWT stored in cookies automatically
+ */
+export declare function useTurnkeyAuth(): UseTurnkeyAuthReturn;
+export {};

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

@@ -0,0 +1,112 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useTurnkeyAuth = useTurnkeyAuth;
+const app_1 = __importDefault(require("../../app"));
+const stores_1 = require("../stores");
+const react_1 = require("react");
+const useB3_1 = require("../components/B3Provider/useB3");
+const debug_1 = require("../../../shared/utils/debug");
+const debug = (0, debug_1.debugB3React)("useTurnkeyAuth");
+/**
+ * Hook for Turnkey email-based OTP authentication
+ *
+ * Usage:
+ * 1. Call initiateLogin(email) → User receives OTP email
+ * 2. Call verifyOtp(...) → Verifies OTP and authenticates with b3-api
+ * 3. User is authenticated, JWT stored in cookies automatically
+ */
+function useTurnkeyAuth() {
+    const [isLoading, setIsLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)(null);
+    const setIsAuthenticating = (0, stores_1.useAuthStore)(state => state.setIsAuthenticating);
+    const setIsAuthenticated = (0, stores_1.useAuthStore)(state => state.setIsAuthenticated);
+    const { user } = (0, useB3_1.useB3)();
+    /**
+     * Step 1: Initiate login with email
+     * - Calls backend to create sub-org (if needed) and send OTP
+     * - Returns otpId to use in verification step
+     */
+    const initiateLogin = (0, react_1.useCallback)(async (email) => {
+        setIsLoading(true);
+        setError(null);
+        setIsAuthenticating(true);
+        try {
+            if (!user?.userId) {
+                throw new Error("User ID is required to initiate Turnkey login.");
+            }
+            debug(`Initiating login for: ${email}`);
+            // Call FeathersJS service to initialize OTP
+            const data = await app_1.default.service("turnkey-auth").init({ email, userId: user.userId });
+            debug(`OTP initialized successfully. OtpId: ${data.otpId}`);
+            return data;
+        }
+        catch (err) {
+            debug("Error initiating login:", err);
+            const errorMessage = err.message || "Failed to send OTP email. Please try again.";
+            setError(errorMessage);
+            throw err;
+        }
+        finally {
+            setIsLoading(false);
+            setIsAuthenticating(false);
+        }
+    }, [user, setIsAuthenticating]);
+    /**
+     * Step 2: Verify OTP and authenticate
+     * - Verifies OTP with backend
+     * - Gets Turnkey session JWT
+     * - Authenticates with b3-api using "turnkey-jwt" strategy
+     * - JWT automatically stored in cookies by SDK
+     */
+    const verifyOtp = (0, react_1.useCallback)(async (otpId, otpCode) => {
+        setIsLoading(true);
+        setError(null);
+        setIsAuthenticating(true);
+        try {
+            debug(`Verifying OTP...`, { userId: user?.userId });
+            // Step 1: Verify OTP and get Turnkey session JWT
+            const { turnkeySessionJwt } = await app_1.default.service("turnkey-auth").verify({
+                otpId,
+                otpCode,
+            });
+            debug(`OTP verified! Authenticating with b3-api...`);
+            // Step 2: Authenticate with b3-api using Turnkey JWT
+            // The SDK will automatically store the b3-api JWT in cookies
+            const authResult = await app_1.default.authenticate({
+                strategy: "turnkey-jwt",
+                accessToken: turnkeySessionJwt,
+            });
+            debug(`Successfully authenticated with b3-api!`, authResult);
+            // Update auth store to reflect authenticated state
+            setIsAuthenticated(true);
+            // Return user data
+            return {
+                user: authResult.user,
+            };
+        }
+        catch (err) {
+            debug("Error verifying OTP:", err);
+            const errorMessage = err.message || "Failed to verify OTP. Please try again.";
+            setError(errorMessage);
+            setIsAuthenticated(false);
+            throw err;
+        }
+        finally {
+            setIsLoading(false);
+            setIsAuthenticating(false);
+        }
+    }, [user, setIsAuthenticating, setIsAuthenticated]);
+    const clearError = (0, react_1.useCallback)(() => {
+        setError(null);
+    }, []);
+    return {
+        initiateLogin,
+        verifyOtp,
+        isLoading,
+        error,
+        clearError,
+    };
+}

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

@@ -41,6 +41,11 @@ export declare function useUserQuery(): {
                 fid?: string | undefined;
             };
         }[] | undefined;
+        turnkeySubOrgs?: {
+            hasDelegatedUser?: boolean | undefined;
+            subOrgId: string;
+            accounts: Record<string, any>[];
+        }[] | undefined;
         _id: string | {};
         userId: string;
         smartAccountAddress: string;
@@ -49,6 +54,8 @@ export declare function useUserQuery(): {
         partnerIds: {
             privyId?: string | undefined;
             thirdwebId?: string | undefined;
+            turnkeyId?: string | undefined;
+            turnkeyOtpId?: string | undefined;
         };
     } | undefined;
     setUser: (newUser?: Users) => void;

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

@@ -27,6 +27,8 @@ interface AuthState {
     setIsAuthenticating: (isAuthenticating: boolean) => void;
     hasStartedConnecting: boolean;
     setHasStartedConnecting: (hasStartedConnecting: boolean) => void;
+    justCompletedLogin: boolean;
+    setJustCompletedLogin: (justCompletedLogin: boolean) => void;
 }
 export declare const useAuthStore: import("zustand").UseBoundStore<import("zustand").StoreApi<AuthState>>;
 export {};

package/dist/cjs/global-account/react/stores/useAuthStore.js

@@ -42,4 +42,6 @@ exports.useAuthStore = (0, zustand_1.create)(set => ({
     setIsAuthenticating: isAuthenticating => set({ isAuthenticating: isAuthenticating }),
     hasStartedConnecting: false,
     setHasStartedConnecting: hasStartedConnecting => set({ hasStartedConnecting }),
+    justCompletedLogin: false,
+    setJustCompletedLogin: justCompletedLogin => set({ justCompletedLogin }),
 }));

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

@@ -10,6 +10,8 @@ import { Account } from "thirdweb/wallets";
 interface BaseModalProps {
     /** Whether to show a back button in the modal header */
     showBackButton?: boolean;
+    /** Whether the modal can be closed by clicking outside or pressing escape. Defaults to true */
+    closable?: boolean;
 }
 /**
  * Props for the Sign In With B3 modal
@@ -39,6 +41,24 @@ export interface SignInWithB3ModalProps extends BaseModalProps {
     /** Whether to show the signers enabled modal */
     signersEnabled?: boolean;
 }
+/**
+ * Props for the Turnkey Authentication modal
+ * Handles Turnkey email/OTP authentication flow
+ */
+export interface TurnkeyAuthModalProps extends BaseModalProps {
+    /** Modal type identifier */
+    type: "turnkeyAuth";
+    /** Callback function called when authentication is successful */
+    onSuccess: (_user: any) => void;
+    /** Callback function called when modal is closed */
+    onClose: () => void;
+    /** Initial email to pre-fill */
+    initialEmail?: string;
+    /** Whether to skip directly to OTP step */
+    skipToOtp?: boolean;
+    /** Whether the modal can be closed - defaults to false for Turnkey */
+    closable?: boolean;
+}
 /**
  * Props for the Request Permissions modal
  * Used to request permission for session keys to interact with contracts
@@ -451,7 +471,7 @@ export interface AnySpendCollectorClubPurchaseProps 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 | AnySpendDepositUpsideProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | LinkNewAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | DepositModalProps | SendModalProps | NotificationsModalProps | AnySpendCollectorClubPurchaseProps;
+export type ModalContentType = SignInWithB3ModalProps | TurnkeyAuthModalProps | RequestPermissionsModalProps | ManageAccountModalProps | AnySpendModalProps | AnyspendOrderDetailsProps | AnySpendNftProps | AnySpendJoinTournamentProps | AnySpendFundTournamentProps | AnySpendOrderHistoryProps | AnySpendStakeB3Props | AnySpendStakeB3ExactInProps | AnySpendStakeUpsideProps | AnySpendStakeUpsideExactInProps | AnySpendDepositUpsideProps | AnySpendBuySpinProps | AnySpendSignatureMintProps | AnySpendBondKitProps | LinkAccountModalProps | LinkNewAccountModalProps | AnySpendDepositHypeProps | AvatarEditorModalProps | DepositModalProps | SendModalProps | NotificationsModalProps | AnySpendCollectorClubPurchaseProps;
 /**
  * State interface for the modal store
  */

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

@@ -20,6 +20,7 @@ import NotificationsContent from "./ManageAccount/NotificationsContent.js";
 import { RequestPermissions } from "./RequestPermissions/RequestPermissions.js";
 import { Send } from "./Send/Send.js";
 import { SignInWithB3Flow } from "./SignInWithB3/SignInWithB3Flow.js";
+import { TurnkeyAuthModal } from "./TurnkeyAuthModal.js";
 import { ToastContainer, useToastContext } from "./Toast/index.js";
 import { Dialog, DialogContent, DialogDescription, DialogTitle } from "./ui/dialog.js";
 import { Drawer, DrawerContent, DrawerDescription, DrawerTitle } from "./ui/drawer.js";
@@ -57,6 +58,7 @@ export function B3DynamicModal() {
         "anySpendBuySpin",
         "anySpendOrderHistory",
         "signInWithB3",
+        "turnkeyAuth",
         "anySpendSignatureMint",
         "anySpendBondKit",
         "linkAccount",
@@ -80,10 +82,12 @@ export function B3DynamicModal() {
     ];
     // Check if current content type is in freestyle types
     const isFreestyleType = freestyleTypes.includes(contentType?.type);
+    // Determine if modal should be closable - defaults to true unless explicitly set to false
+    const isClosable = contentType?.closable !== false;
     const hideCloseButton = true;
     // Build content class using cn utility
     // eslint-disable-next-line tailwindcss/no-custom-classname
-    const contentClass = cn("b3-modal", theme === "dark" && "dark", fullWidthTypes.includes(contentType?.type) && "w-full", isFreestyleType && "b3-modal-freestyle", contentType?.type === "signInWithB3" && "p-0", contentType?.type === "anySpend" && "md:p-0", contentType?.type === "send" && "p-0", contentType?.type === "manageAccount" && " md:p-0 md:pt-2", contentType?.type === "linkAccount" && "md:p-0");
+    const contentClass = cn("b3-modal", theme === "dark" && "dark", fullWidthTypes.includes(contentType?.type) && "w-full", isFreestyleType && "b3-modal-freestyle", contentType?.type === "signInWithB3" && "p-0", contentType?.type === "turnkeyAuth" && "p-0", contentType?.type === "anySpend" && "md:p-0", contentType?.type === "send" && "p-0", contentType?.type === "manageAccount" && " md:p-0 md:pt-2", contentType?.type === "linkAccount" && "md:p-0");
     debug("contentType", contentType);
     const renderContent = () => {
         if (!contentType)
@@ -91,6 +95,8 @@ export function B3DynamicModal() {
         switch (contentType.type) {
             case "signInWithB3":
                 return _jsx(SignInWithB3Flow, { ...contentType });
+            case "turnkeyAuth":
+                return _jsx(TurnkeyAuthModal, { ...contentType });
             case "requestPermissions":
                 return _jsx(RequestPermissions, { ...contentType });
             case "manageAccount":
@@ -148,12 +154,20 @@ export function B3DynamicModal() {
     const ModalContent = isMobile ? DrawerContent : DialogContent;
     const ModalTitle = isMobile ? DrawerTitle : DialogTitle;
     const ModalDescription = isMobile ? DrawerDescription : DialogDescription;
-    return (_jsxs(ModalComponent, { open: isOpen, onOpenChange: setB3ModalOpen, children: [_jsxs(ModalContent, { className: cn(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", (contentType?.type === "manageAccount" ||
+    // Create a wrapper for onOpenChange that respects closable property
+    const handleOpenChange = (open) => {
+        // Only allow closing if the modal is closable
+        if (!open && !isClosable) {
+            return;
+        }
+        setB3ModalOpen(open);
+    };
+    return (_jsxs(ModalComponent, { open: isOpen, onOpenChange: handleOpenChange, children: [_jsxs(ModalContent, { className: cn(contentClass, "rounded-2xl bg-white shadow-xl dark:bg-gray-900", "border border-gray-200 dark:border-gray-800", (contentType?.type === "manageAccount" ||
                     contentType?.type === "deposit" ||
                     contentType?.type === "send" ||
                     contentType?.type === "avatarEditor" ||
                     contentType?.type === "notifications") &&
-                    "p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("b3-modal-content no-scrollbar dark:bg-b3-background flex max-h-[90dvh] flex-col overflow-auto sm:max-h-[80dvh]"), children: [!hideCloseButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "font-inter text-sm font-semibold", children: "Back" })] })), _jsx("div", { className: "flex-1", children: renderContent() }), _jsx(AnimatePresence, { children: toasts.length > 0 && (_jsx(motion.div, { initial: { height: 0 }, animate: { height: "auto" }, exit: { height: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, className: "toast-section relative z-10 overflow-hidden bg-white dark:border-gray-800 dark:bg-gray-900", children: _jsx(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, delay: 0.1 }, className: "p-4 pt-0", children: _jsx(ToastContainer, { toasts: toasts, onDismiss: removeToast, theme: theme }) }) })) })] })] }), isOpen && (_jsx("style", { children: `
+                    "p-0", "mx-auto w-full max-w-md sm:max-w-lg"), hideCloseButton: hideCloseButton, onEscapeKeyDown: !isClosable ? e => e.preventDefault() : undefined, onPointerDownOutside: !isClosable ? e => e.preventDefault() : undefined, onInteractOutside: !isClosable ? e => e.preventDefault() : undefined, children: [_jsx(ModalTitle, { className: "sr-only hidden", children: contentType?.type || "Modal" }), _jsx(ModalDescription, { className: "sr-only hidden", children: contentType?.type || "Modal Body" }), _jsxs("div", { className: cn("b3-modal-content no-scrollbar dark:bg-b3-background flex max-h-[90dvh] flex-col overflow-auto sm:max-h-[80dvh]"), children: [!hideCloseButton && (_jsxs("button", { onClick: navigateBack, className: "flex items-center gap-2 px-6 py-4 text-gray-600 transition-colors hover:text-gray-900 dark:text-gray-400 dark:hover:text-white", children: [_jsxs("svg", { width: "20", height: "20", viewBox: "0 0 20 20", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [_jsx("path", { d: "M15.8337 10H4.16699", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }), _jsx("path", { d: "M10.0003 15.8334L4.16699 10L10.0003 4.16669", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })] }), _jsx("span", { className: "font-inter text-sm font-semibold", children: "Back" })] })), _jsx("div", { className: "flex-1", children: renderContent() }), _jsx(AnimatePresence, { children: toasts.length > 0 && (_jsx(motion.div, { initial: { height: 0 }, animate: { height: "auto" }, exit: { height: 0 }, transition: { duration: 0.3, ease: "easeInOut" }, className: "toast-section relative z-10 overflow-hidden bg-white dark:border-gray-800 dark:bg-gray-900", children: _jsx(motion.div, { initial: { opacity: 0, y: -10 }, animate: { opacity: 1, y: 0 }, exit: { opacity: 0, y: -10 }, transition: { duration: 0.2, delay: 0.1 }, className: "p-4 pt-0", children: _jsx(ToastContainer, { toasts: toasts, onDismiss: removeToast, theme: theme }) }) })) })] })] }), isOpen && (_jsx("style", { children: `
           .modal-inner-content {
             transition: margin-bottom 0.3s ease-in-out;
             margin-bottom: ${toasts.length > 0 ? "0px" : "23px"} !important;

package/dist/esm/global-account/react/components/B3Provider/B3Provider.d.ts

@@ -9,7 +9,7 @@ import { B3ContextType } from "./types";
 /**
  * Main B3Provider component
  */
-export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster: _toaster, clientType, rpcUrls, partnerId, onConnect, connectors, overrideDefaultConnectors, createClientReferenceId, }: {
+export declare function B3Provider({ theme, children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, toaster: _toaster, clientType, rpcUrls, partnerId, onConnect, connectors, overrideDefaultConnectors, createClientReferenceId, enableTurnkey, }: {
     theme: "light" | "dark";
     children: React.ReactNode;
     accountOverride?: Account;
@@ -27,11 +27,12 @@ export declare function B3Provider({ theme, children, accountOverride, environme
     connectors?: CreateConnectorFn[];
     overrideDefaultConnectors?: boolean;
     createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+    enableTurnkey?: boolean;
 }): import("react/jsx-runtime").JSX.Element;
 /**
  * Inner provider component that provides the actual B3Context
  */
-export declare function InnerProvider({ children, accountOverride, environment, defaultPermissions, automaticallySetFirstEoa, theme, clientType, partnerId, createClientReferenceId, }: {
+export declare function InnerProvider({ children, accountOverride, environment, defaultPermissions, automaticallySetFirstEoa, theme, clientType, partnerId, createClientReferenceId, enableTurnkey, }: {
     children: React.ReactNode;
     accountOverride?: Account;
     environment: B3ContextType["environment"];
@@ -41,4 +42,5 @@ export declare function InnerProvider({ children, accountOverride, environment,
     clientType?: ClientType;
     partnerId: string;
     createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+    enableTurnkey?: boolean;
 }): import("react/jsx-runtime").JSX.Element;

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

@@ -30,7 +30,7 @@ const queryClient = new QueryClient();
  */
 export function B3Provider({ theme = "light", children, accountOverride, environment, automaticallySetFirstEoa, simDuneApiKey, 
 // deprecated since v0.0.87
-toaster: _toaster, clientType = "rest", rpcUrls, partnerId, onConnect, connectors, overrideDefaultConnectors = false, createClientReferenceId, }) {
+toaster: _toaster, clientType = "rest", rpcUrls, partnerId, onConnect, connectors, overrideDefaultConnectors = false, createClientReferenceId, enableTurnkey = false, }) {
     // Initialize Google Analytics on mount
     useEffect(() => {
         loadGA4Script();
@@ -40,22 +40,24 @@ toaster: _toaster, clientType = "rest", rpcUrls, partnerId, onConnect, connector
         setClientType(clientType);
     }, [clientType]);
     const wagmiConfig = createWagmiConfig({ partnerId, rpcUrls, connectors, overrideDefaultConnectors });
-    return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, reconnectOnMount: false, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(TooltipProvider, { children: _jsx(ToastProvider, { children: _jsx(LocalSDKProvider, { onConnectCallback: onConnect, children: _jsxs(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, partnerId: partnerId, createClientReferenceId: createClientReferenceId, children: [_jsx(ToastContextConnector, {}), _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" })] })] }) }) }) }) }) }) }));
+    return (_jsx(ThirdwebProvider, { children: _jsx(WagmiProvider, { config: wagmiConfig, reconnectOnMount: false, children: _jsx(QueryClientProvider, { client: queryClient, children: _jsx(TooltipProvider, { children: _jsx(ToastProvider, { children: _jsx(LocalSDKProvider, { onConnectCallback: onConnect, children: _jsxs(InnerProvider, { accountOverride: accountOverride, environment: environment, theme: theme, automaticallySetFirstEoa: !!automaticallySetFirstEoa, clientType: clientType, partnerId: partnerId, createClientReferenceId: createClientReferenceId, enableTurnkey: enableTurnkey, children: [_jsx(ToastContextConnector, {}), _jsxs(RelayKitProviderWrapper, { simDuneApiKey: simDuneApiKey, children: [children, _jsx(StyleRoot, { id: "b3-root" })] })] }) }) }) }) }) }) }));
 }
 /**
  * Inner provider component that provides the actual B3Context
  */
-export function InnerProvider({ children, accountOverride, environment, defaultPermissions = DEFAULT_PERMISSIONS, automaticallySetFirstEoa, theme = "light", clientType = "socket", partnerId, createClientReferenceId, }) {
+export function InnerProvider({ children, accountOverride, environment, defaultPermissions = DEFAULT_PERMISSIONS, automaticallySetFirstEoa, theme = "light", clientType = "socket", partnerId, createClientReferenceId, enableTurnkey, }) {
     const activeAccount = useActiveAccount();
     const [manuallySelectedWallet, setManuallySelectedWallet] = useState(undefined);
     const wallets = useConnectedWallets();
     const isAuthenticated = useAuthStore(state => state.isAuthenticated);
     const isConnected = useAuthStore(state => state.isConnected);
+    const justCompletedLogin = useAuthStore(state => state.justCompletedLogin);
     const setActiveWallet = useSetActiveWallet();
     const { user, setUser, refetchUser } = useAuthentication(partnerId);
     debug("@@B3Provider:isConnected", isConnected);
     debug("@@wallets", wallets);
     debug("@@B3Provider:user", user);
+    debug("@@B3Provider:justCompletedLogin", justCompletedLogin);
     // Use given accountOverride or activeAccount from thirdweb
     const effectiveAccount = isAuthenticated ? accountOverride || activeAccount : undefined;
     const setWallet = useCallback((wallet) => {
@@ -100,6 +102,7 @@ export function InnerProvider({ children, accountOverride, environment, defaultP
             clientType,
             partnerId: partnerId,
             createClientReferenceId,
+            enableTurnkey,
         }, children: _jsx(InnerProvider2, { children: children }) }));
 }
 const InnerProvider2 = ({ children }) => {

package/dist/esm/global-account/react/components/B3Provider/types.d.ts

@@ -23,6 +23,7 @@ export interface B3ContextType {
     clientType: ClientType;
     partnerId: string;
     createClientReferenceId?: (params: CreateOrderParams | CreateOnrampOrderParams) => Promise<string>;
+    enableTurnkey?: boolean;
 }
 /**
  * Context for B3 provider

package/dist/esm/global-account/react/components/B3Provider/types.js

@@ -17,4 +17,5 @@ export const B3Context = createContext({
     clientType: "rest",
     partnerId: "",
     createClientReferenceId: undefined,
+    enableTurnkey: false,
 });

package/dist/esm/global-account/react/components/SignInWithB3/SignInWithB3Flow.js

@@ -13,16 +13,18 @@ const MAX_REFETCH_ATTEMPTS = 20;
  * Handles different login providers, authentication steps, and session key management
  */
 export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySuccess, onError, chain, sessionKeyAddress, partnerId, closeAfterLogin = false, source = "signInWithB3Button", signersEnabled = false, }) {
-    const { automaticallySetFirstEoa } = useB3();
+    const { automaticallySetFirstEoa, user, refetchUser, enableTurnkey } = useB3();
     const [step, setStep] = useState(source === "requestPermissions" ? null : "login");
     const [sessionKeyAdded, setSessionKeyAdded] = useState(source === "requestPermissions" ? true : false);
-    const { setB3ModalContentType, setB3ModalOpen, isOpen } = useModalStore();
+    const { setB3ModalContentType, setB3ModalOpen, isOpen, contentType } = useModalStore();
     const account = useActiveAccount();
     const isAuthenticating = useAuthStore(state => state.isAuthenticating);
     const isAuthenticated = useAuthStore(state => state.isAuthenticated);
     const isConnected = useAuthStore(state => state.isConnected);
+    const setJustCompletedLogin = useAuthStore(state => state.setJustCompletedLogin);
     const [refetchCount, setRefetchCount] = useState(0);
     const [refetchError, setRefetchError] = useState(null);
+    const [turnkeyAuthCompleted, setTurnkeyAuthCompleted] = useState(false);
     const { data: signers, refetch: refetchSigners, isFetching: isFetchingSigners, } = useGetAllTWSigners({
         chain,
         accountAddress: account?.address,
@@ -52,6 +54,104 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             setRefetchQueued(false);
         }, backoffDelay);
     }, [refetchCount, refetchSigners, onError, setRefetchQueued, refetchQueued]);
+    // Extract the completion flow logic to be reused
+    const handlePostTurnkeyFlow = useCallback(() => {
+        debug("Running post-Turnkey flow logic");
+        // Check if we already have a signer for this partner
+        const hasExistingSigner = signers?.some(signer => signer.partner.id === partnerId);
+        if (hasExistingSigner) {
+            // Path 1: User already has a signer for this partner
+            setSessionKeyAdded(true);
+            onSessionKeySuccess?.();
+            if (closeAfterLogin) {
+                setB3ModalOpen(false);
+            }
+            else {
+                setB3ModalContentType({
+                    type: "manageAccount",
+                    chain,
+                    partnerId,
+                });
+            }
+        }
+        else if (signersEnabled) {
+            // Path 2: No existing signer, but signers are enabled
+            if (source !== "requestPermissions") {
+                // Navigate to permissions step to request new signer
+                setStep("permissions");
+            }
+            else {
+                // Already in request permissions flow, retry fetching signers
+                handleRefetchSigners();
+            }
+        }
+        else {
+            // Path 3: No existing signer and signers are not enabled
+            // Default handling for when no signer exists and signers are not enabled
+            if (closeAfterLogin) {
+                setB3ModalOpen(false);
+            }
+            else {
+                // if not closed, default to manage account
+                setB3ModalContentType({
+                    type: "manageAccount",
+                    chain,
+                    partnerId,
+                });
+            }
+        }
+    }, [
+        signers,
+        partnerId,
+        onSessionKeySuccess,
+        closeAfterLogin,
+        setB3ModalOpen,
+        setB3ModalContentType,
+        chain,
+        source,
+        signersEnabled,
+        handleRefetchSigners,
+        setSessionKeyAdded,
+    ]);
+    // Define handleTurnkeySuccess before the useEffect that uses it
+    const handleTurnkeySuccess = useCallback(async (user) => {
+        debug("Turnkey authentication successful - setting completed flag", { user });
+        // Set completed flag FIRST before any async operations
+        setTurnkeyAuthCompleted(true);
+        // Refetch user to update the user state with Turnkey ID
+        debug("Refetching user after Turnkey success...");
+        await refetchUser();
+        debug("User refetched successfully");
+        // After user data is refreshed, close Turnkey modal and go back to sign-in flow
+        debug("Switching back to signInWithB3 modal");
+        setB3ModalContentType({
+            type: "signInWithB3",
+            strategies,
+            onLoginSuccess,
+            onSessionKeySuccess,
+            onError,
+            chain,
+            sessionKeyAddress,
+            partnerId,
+            closeAfterLogin,
+            source,
+            signersEnabled,
+        });
+        // The useEffect will re-run with updated user data to complete the sign-in process
+    }, [
+        refetchUser,
+        setB3ModalContentType,
+        strategies,
+        onLoginSuccess,
+        onSessionKeySuccess,
+        onError,
+        chain,
+        sessionKeyAddress,
+        partnerId,
+        closeAfterLogin,
+        source,
+        signersEnabled,
+    ]);
     // Handle post-login flow after signers are loaded
     useEffect(() => {
         debug("@@SignInWithB3Flow:useEffect", {
@@ -62,41 +162,46 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             isOpen,
             source,
         });
-        if (isConnected && isAuthenticated) {
-            // Check if we already have a signer for this partner
-            const hasExistingSigner = signers?.some(signer => signer.partner.id === partnerId);
-            if (hasExistingSigner) {
-                setSessionKeyAdded(true);
-                onSessionKeySuccess?.();
-                if (closeAfterLogin) {
-                    setB3ModalOpen(false);
-                }
-                else {
-                    setB3ModalContentType({
-                        type: "manageAccount",
-                        chain,
-                        partnerId,
-                    });
-                }
-            }
-            else if (source !== "requestPermissions") {
-                if (signersEnabled)
-                    setStep("permissions");
-            }
-            else {
-                if (signersEnabled)
-                    handleRefetchSigners();
-            }
-            // Default handling
+        if (isConnected && isAuthenticated && user) {
+            // Mark that login just completed BEFORE opening manage account or closing modal
+            // This allows Turnkey modal to show (if enableTurnkey is true)
             if (closeAfterLogin) {
-                setB3ModalOpen(false);
+                setJustCompletedLogin(true);
             }
-            // if not closed, always default to manage account
-            setB3ModalContentType({
-                type: "manageAccount",
-                chain,
-                partnerId,
-            });
+            // Check if we should show Turnkey login form
+            // Show if enableTurnkey is true AND user just logged in AND hasn't completed Turnkey auth in this session
+            // For new users (!turnkeyId): Show email form
+            // For returning users (turnkeyId && turnkeyEmail): Auto-skip to OTP
+            // Also check that we're not already showing the Turnkey modal
+            const hasTurnkeyId = user?.partnerIds?.turnkeyId;
+            const hasTurnkeyEmail = !!user?.email;
+            const isTurnkeyModalCurrentlyOpen = contentType?.type === "turnkeyAuth";
+            const shouldShowTurnkeyModal = enableTurnkey &&
+                user &&
+                !turnkeyAuthCompleted &&
+                !isTurnkeyModalCurrentlyOpen &&
+                (!hasTurnkeyId || (hasTurnkeyId && hasTurnkeyEmail));
+            if (shouldShowTurnkeyModal) {
+                // Extract email from user object - check partnerIds.turnkeyEmail first, then twProfiles, then user.email
+                const email = user?.email || user?.twProfiles?.find((profile) => profile.details?.email)?.details?.email;
+                // Open Turnkey modal through the modal store
+                setB3ModalContentType({
+                    type: "turnkeyAuth",
+                    onSuccess: handleTurnkeySuccess,
+                    onClose: () => {
+                        // After closing Turnkey modal, continue with the rest of the flow
+                        setTurnkeyAuthCompleted(true);
+                        debug("Turnkey modal closed, running post-Turnkey flow");
+                        handlePostTurnkeyFlow();
+                    },
+                    initialEmail: email,
+                    skipToOtp: !!(hasTurnkeyId && hasTurnkeyEmail),
+                    closable: false, // Turnkey modal cannot be closed until auth is complete
+                });
+                return;
+            }
+            // Normal flow continues after Turnkey auth is complete (or if not needed)
+            handlePostTurnkeyFlow();
         }
     }, [
         signers,
@@ -114,6 +219,13 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
         isAuthenticating,
         isAuthenticated,
         isOpen,
+        setJustCompletedLogin,
+        user,
+        enableTurnkey,
+        turnkeyAuthCompleted,
+        handleTurnkeySuccess,
+        contentType,
+        handlePostTurnkeyFlow,
     ]);
     debug("render", {
         step,
@@ -168,24 +280,28 @@ export function SignInWithB3Flow({ strategies, onLoginSuccess, onSessionKeySucce
             });
         }
     }, [chain, onError, onSessionKeySuccessEnhanced, sessionKeyAddress, setB3ModalContentType, step]);
+    // Render content based on current step/state
+    let content = null;
     // Display error if refetch limit exceeded
     if (refetchError) {
-        return (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx("div", { className: "p-4 text-center text-red-500", children: refetchError }) }));
+        content = (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx("div", { className: "p-4 text-center text-red-500", children: refetchError }) }));
     }
-    if (isAuthenticating || (isFetchingSigners && step === "login") || source === "requestPermissions") {
-        return (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx("div", { className: "my-8 flex min-h-[350px] items-center justify-center", children: _jsx(Loading, { variant: "white", size: "lg" }) }) }));
+    else if (isAuthenticating || (isFetchingSigners && step === "login") || source === "requestPermissions") {
+        content = (_jsx(LoginStepContainer, { partnerId: partnerId, children: _jsx("div", { className: "my-8 flex min-h-[350px] items-center justify-center", children: _jsx(Loading, { variant: "white", size: "lg" }) }) }));
     }
-    if (step === "login") {
+    else if (step === "login") {
         // Custom strategy
         if (strategies?.[0] === "privy") {
-            return _jsx(SignInWithB3Privy, { onSuccess: handleLoginSuccess, chain: chain });
+            content = _jsx(SignInWithB3Privy, { onSuccess: handleLoginSuccess, chain: chain });
+        }
+        else if (strategies) {
+            // Strategies are explicitly provided
+            content = (_jsx(LoginStepCustom, { strategies: strategies, chain: chain, onSuccess: handleLoginSuccess, onError: onError, automaticallySetFirstEoa: !!automaticallySetFirstEoa }));
         }
-        // Strategies are explicitly provided
-        if (strategies) {
-            return (_jsx(LoginStepCustom, { strategies: strategies, chain: chain, onSuccess: handleLoginSuccess, onError: onError, automaticallySetFirstEoa: !!automaticallySetFirstEoa }));
+        else {
+            // Default to handle all strategies we support
+            content = _jsx(LoginStep, { chain: chain, onSuccess: handleLoginSuccess, onError: onError });
         }
-        // Default to handle all strategies we support
-        return _jsx(LoginStep, { chain: chain, onSuccess: handleLoginSuccess, onError: onError });
     }
-    return null;
+    return content;
 }

package/dist/esm/global-account/react/components/TurnkeyAuthModal.d.ts

@@ -0,0 +1,8 @@
+interface TurnkeyAuthModalProps {
+    onClose: () => void;
+    onSuccess: (_user: any) => void;
+    initialEmail?: string;
+    skipToOtp?: boolean;
+}
+export declare function TurnkeyAuthModal({ onClose, onSuccess, initialEmail, skipToOtp }: TurnkeyAuthModalProps): import("react/jsx-runtime").JSX.Element;
+export {};