@pubflow/react 0.4.3 → 0.4.5

package/dist/index.cjs

@@ -206,7 +206,8 @@ class BrowserStorageAdapter {
  */
 const PubflowContext = React.createContext({
     instances: {},
-    defaultInstance: 'default'
+    defaultInstance: 'default',
+    isReady: false
 });
 /**
  * Pubflow Provider Component
@@ -214,7 +215,8 @@ const PubflowContext = React.createContext({
 function PubflowProvider({ children, config, instances, defaultInstance = 'default', enableDebugTools = false, showSessionAlerts = false, persistentCache = { enabled: false }, theme = {}, loginRedirectPath = '/login', publicPaths = [] }) {
     const [contextValue, setContextValue] = React.useState({
         instances: {},
-        defaultInstance
+        defaultInstance,
+        isReady: false
     });
     // Session handlers
     const handleSessionExpired = React.useCallback(() => {
@@ -252,6 +254,7 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                         });
                         const apiClient = new core.ApiClient(fullConfig, storage);
                         const authService = new core.AuthService(apiClient, storage, fullConfig);
+                        const twoFactorService = new core.TwoFactorService(apiClient, fullConfig);
                         // Get current user (non-blocking)
                         let user = null;
                         let isAuthenticated = false;
@@ -259,12 +262,35 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                             config: fullConfig,
                             apiClient,
                             authService,
+                            twoFactorService,
                             user,
                             isAuthenticated,
                             isLoading: true,
+                            twoFactorPending: false,
+                            twoFactorMethods: [],
                             login: async (credentials) => {
                                 const result = await authService.login(credentials);
-                                if (result.success && result.user && isMounted) {
+                                if (!isMounted)
+                                    return result;
+                                if (result.success && result.requires2fa) {
+                                    // 2FA required — keep session pending, expose methods
+                                    setContextValue(prev => {
+                                        var _a;
+                                        return ({
+                                            ...prev,
+                                            instances: {
+                                                ...prev.instances,
+                                                [instanceConfig.id]: {
+                                                    ...prev.instances[instanceConfig.id],
+                                                    isLoading: false,
+                                                    twoFactorPending: true,
+                                                    twoFactorMethods: (_a = result.availableMethods) !== null && _a !== void 0 ? _a : [],
+                                                }
+                                            }
+                                        });
+                                    });
+                                }
+                                else if (result.success && result.user) {
                                     setContextValue(prev => ({
                                         ...prev,
                                         instances: {
@@ -273,7 +299,9 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                                 ...prev.instances[instanceConfig.id],
                                                 user: result.user,
                                                 isAuthenticated: true,
-                                                isLoading: false
+                                                isLoading: false,
+                                                twoFactorPending: false,
+                                                twoFactorMethods: [],
                                             }
                                         }
                                     }));
@@ -291,7 +319,9 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                                 ...prev.instances[instanceConfig.id],
                                                 user: null,
                                                 isAuthenticated: false,
-                                                isLoading: false
+                                                isLoading: false,
+                                                twoFactorPending: false,
+                                                twoFactorMethods: [],
                                             }
                                         }
                                     }));
@@ -314,7 +344,31 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                     }));
                                 }
                                 return result;
-                            }
+                            },
+                            verifyTwoFactor: async (methodId, code) => {
+                                const result = await twoFactorService.verify(methodId, code, 'login');
+                                if (result.verified && isMounted) {
+                                    // Fetch the now-active user from the server
+                                    const userData = await authService.getCurrentUser();
+                                    setContextValue(prev => ({
+                                        ...prev,
+                                        instances: {
+                                            ...prev.instances,
+                                            [instanceConfig.id]: {
+                                                ...prev.instances[instanceConfig.id],
+                                                user: userData,
+                                                isAuthenticated: true,
+                                                twoFactorPending: false,
+                                                twoFactorMethods: [],
+                                            }
+                                        }
+                                    }));
+                                }
+                                return result;
+                            },
+                            startTwoFactor: async (methodId, method) => {
+                                return twoFactorService.start(methodId, method, 'login');
+                            },
                         };
                         // Load user asynchronously
                         authService.getCurrentUser().then(currentUser => {
@@ -363,16 +417,39 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                     });
                     const apiClient = new core.ApiClient(fullConfig, storage);
                     const authService = new core.AuthService(apiClient, storage, fullConfig);
+                    const twoFactorService = new core.TwoFactorService(apiClient, fullConfig);
                     instancesMap[defaultInstance] = {
                         config: fullConfig,
                         apiClient,
                         authService,
+                        twoFactorService,
                         user: null,
                         isAuthenticated: false,
                         isLoading: true,
+                        twoFactorPending: false,
+                        twoFactorMethods: [],
                         login: async (credentials) => {
                             const result = await authService.login(credentials);
-                            if (result.success && result.user && isMounted) {
+                            if (!isMounted)
+                                return result;
+                            if (result.success && result.requires2fa) {
+                                setContextValue(prev => {
+                                    var _a;
+                                    return ({
+                                        ...prev,
+                                        instances: {
+                                            ...prev.instances,
+                                            [defaultInstance]: {
+                                                ...prev.instances[defaultInstance],
+                                                isLoading: false,
+                                                twoFactorPending: true,
+                                                twoFactorMethods: (_a = result.availableMethods) !== null && _a !== void 0 ? _a : [],
+                                            }
+                                        }
+                                    });
+                                });
+                            }
+                            else if (result.success && result.user) {
                                 setContextValue(prev => ({
                                     ...prev,
                                     instances: {
@@ -381,7 +458,9 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                             ...prev.instances[defaultInstance],
                                             user: result.user,
                                             isAuthenticated: true,
-                                            isLoading: false
+                                            isLoading: false,
+                                            twoFactorPending: false,
+                                            twoFactorMethods: [],
                                         }
                                     }
                                 }));
@@ -399,7 +478,9 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                             ...prev.instances[defaultInstance],
                                             user: null,
                                             isAuthenticated: false,
-                                            isLoading: false
+                                            isLoading: false,
+                                            twoFactorPending: false,
+                                            twoFactorMethods: [],
                                         }
                                     }
                                 }));
@@ -422,7 +503,30 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                                 }));
                             }
                             return result;
-                        }
+                        },
+                        verifyTwoFactor: async (methodId, code) => {
+                            const result = await twoFactorService.verify(methodId, code, 'login');
+                            if (result.verified && isMounted) {
+                                const userData = await authService.getCurrentUser();
+                                setContextValue(prev => ({
+                                    ...prev,
+                                    instances: {
+                                        ...prev.instances,
+                                        [defaultInstance]: {
+                                            ...prev.instances[defaultInstance],
+                                            user: userData,
+                                            isAuthenticated: true,
+                                            twoFactorPending: false,
+                                            twoFactorMethods: [],
+                                        }
+                                    }
+                                }));
+                            }
+                            return result;
+                        },
+                        startTwoFactor: async (methodId, method) => {
+                            return twoFactorService.start(methodId, method, 'login');
+                        },
                     };
                     // Load user asynchronously
                     authService.getCurrentUser().then(currentUser => {
@@ -459,9 +563,14 @@ function PubflowProvider({ children, config, instances, defaultInstance = 'defau
                 if (isMounted && Object.keys(instancesMap).length > 0) {
                     setContextValue({
                         instances: instancesMap,
-                        defaultInstance
+                        defaultInstance,
+                        isReady: true
                     });
                 }
+                else if (isMounted) {
+                    // Even if no instances configured correctly, mark ready so useAuth can react
+                    setContextValue(prev => ({ ...prev, isReady: true }));
+                }
             }
             catch (error) {
                 console.error('Error initializing Pubflow:', error);
@@ -512,6 +621,23 @@ function useAuth(instanceId) {
     }
     const instance = instanceId || context.defaultInstance;
     const pubflowInstance = context.instances[instance];
+    // If the provider hasn't finished its initial useEffect setup,
+    // instances won't exist yet. Return a loading state instead of crashing.
+    if (!context.isReady) {
+        return {
+            user: null,
+            isAuthenticated: false,
+            isLoading: true, // Crucial: tell the UI we are still loading the provider
+            twoFactorPending: false,
+            twoFactorMethods: [],
+            login: async () => { throw new Error('Pubflow not initialized yet'); },
+            logout: async () => { throw new Error('Pubflow not initialized yet'); },
+            validateSession: async () => ({ isValid: false }),
+            verifyTwoFactor: async () => ({ success: false, error: 'Pubflow not initialized yet' }),
+            startTwoFactor: async () => ({ success: false, error: 'Pubflow not initialized yet' }),
+        };
+    }
+    // After provider is ready, if the instance is STILL missing, it's a real config error.
     if (!pubflowInstance) {
         throw new Error(`Pubflow instance '${instance}' not found`);
     }
@@ -520,9 +646,13 @@ function useAuth(instanceId) {
         user: pubflowInstance.user || null,
         isAuthenticated: pubflowInstance.isAuthenticated,
         isLoading: pubflowInstance.isLoading,
+        twoFactorPending: pubflowInstance.twoFactorPending,
+        twoFactorMethods: pubflowInstance.twoFactorMethods,
         login: pubflowInstance.login,
         logout: pubflowInstance.logout,
-        validateSession: pubflowInstance.validateSession
+        validateSession: pubflowInstance.validateSession,
+        verifyTwoFactor: pubflowInstance.verifyTwoFactor,
+        startTwoFactor: pubflowInstance.startTwoFactor,
     };
 }
 
@@ -8627,17 +8757,25 @@ function processLogoUrl(logoUrl) {
  * Professional login form component
  */
 function LoginForm({ config = {}, onSuccess, onError, onPasswordReset, onAccountCreation, instanceId }) {
-    const { login, isLoading } = useAuth(instanceId);
+    const { login, verifyTwoFactor, startTwoFactor, isLoading } = useAuth(instanceId);
     // Form state
     const [email, setEmail] = React.useState('');
     const [password, setPassword] = React.useState('');
     const [showPassword, setShowPassword] = React.useState(false);
     const [error, setError] = React.useState('');
     const [rememberMe, setRememberMe] = React.useState(false);
+    // 2FA state
+    const [step, setStep] = React.useState('credentials');
+    const [otpCode, setOtpCode] = React.useState('');
+    const [pendingMethods, setPendingMethods] = React.useState([]);
+    const [activeMethodId, setActiveMethodId] = React.useState(null);
+    const [activeMethodName, setActiveMethodName] = React.useState('email');
+    const [otpLoading, setOtpLoading] = React.useState(false);
     // Configuration with defaults
     const { primaryColor = process.env.REACT_APP_PRIMARY_COLOR || '#006aff', secondaryColor = process.env.REACT_APP_SECONDARY_COLOR || '#4a90e2', appName = process.env.REACT_APP_NAME || 'Pubflow', logo = process.env.REACT_APP_LOGO, showPasswordReset = true, showAccountCreation = true, className = '', redirectPath } = config;
     // Handle form submission
     const handleSubmit = async (e) => {
+        var _a;
         e.preventDefault();
         setError('');
         // Basic validation
@@ -8651,6 +8789,17 @@ function LoginForm({ config = {}, onSuccess, onError, onPasswordReset, onAccount
         }
         try {
             const result = await login({ email: email.toLowerCase().trim(), password });
+            if (result.requires2fa) {
+                // Switch to OTP step
+                const methods = (_a = result.availableMethods) !== null && _a !== void 0 ? _a : [];
+                setPendingMethods(methods);
+                if (methods.length > 0) {
+                    setActiveMethodId(methods[0].id);
+                    setActiveMethodName(methods[0].method);
+                }
+                setStep('otp');
+                return;
+            }
             if (result.success) {
                 if (onSuccess) {
                     onSuccess(result.user);
@@ -8676,6 +8825,56 @@ function LoginForm({ config = {}, onSuccess, onError, onPasswordReset, onAccount
             }
         }
     };
+    // Handle OTP verification
+    const handleOtpSubmit = async (e) => {
+        e.preventDefault();
+        if (!activeMethodId)
+            return;
+        setError('');
+        setOtpLoading(true);
+        try {
+            const result = await verifyTwoFactor(activeMethodId, otpCode.trim());
+            if (result.verified) {
+                if (onSuccess)
+                    onSuccess(null);
+                if (redirectPath && typeof window !== 'undefined') {
+                    window.location.href = redirectPath;
+                }
+            }
+            else {
+                const msg = result.error ||
+                    (result.attempts_remaining !== undefined
+                        ? `Incorrect code. ${result.attempts_remaining} attempt(s) remaining.`
+                        : 'Incorrect code.');
+                setError(msg);
+                if (onError)
+                    onError(msg);
+            }
+        }
+        catch (err) {
+            const msg = err instanceof Error ? err.message : 'Verification failed';
+            setError(msg);
+            if (onError)
+                onError(msg);
+        }
+        finally {
+            setOtpLoading(false);
+        }
+    };
+    // Handle resend code
+    const handleResend = async () => {
+        if (!activeMethodId)
+            return;
+        setError('');
+        setOtpLoading(true);
+        try {
+            await startTwoFactor(activeMethodId, activeMethodName);
+        }
+        catch ( /* ignore */_a) { /* ignore */ }
+        finally {
+            setOtpLoading(false);
+        }
+    };
     // Dynamic styles
     const styles = {
         container: {
@@ -8691,6 +8890,7 @@ function LoginForm({ config = {}, onSuccess, onError, onPasswordReset, onAccount
         },
         logoSection: {
             display: 'flex',
+            flexDirection: 'column',
             justifyContent: 'center',
             alignItems: 'center',
             textAlign: 'center',
@@ -8813,11 +9013,17 @@ function LoginForm({ config = {}, onSuccess, onError, onPasswordReset, onAccount
             textAlign: 'center'
         }
     };
-    return (jsxRuntime.jsxs("div", { className: className, style: styles.container, children: [jsxRuntime.jsxs("div", { style: styles.logoSection, children: [logo && (typeof logo === 'string' ? (jsxRuntime.jsx("img", { src: processLogoUrl(logo), alt: `${appName} Logo`, style: styles.logo })) : (logo)), jsxRuntime.jsxs("h1", { style: styles.welcomeText, children: ["Welcome to ", appName] }), jsxRuntime.jsx("p", { style: styles.subtitleText, children: "Sign in to your account" })] }), jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [error && (jsxRuntime.jsxs("div", { style: styles.errorContainer, children: [jsxRuntime.jsx("span", { style: { color: '#ff4757', fontSize: '20px' }, children: "\u26A0" }), jsxRuntime.jsx("span", { style: styles.errorText, children: error })] })), jsxRuntime.jsxs("div", { style: styles.inputGroup, children: [jsxRuntime.jsx("label", { style: styles.inputLabel, children: "Email Address" }), jsxRuntime.jsxs("div", { style: styles.inputContainer, children: [jsxRuntime.jsx("span", { style: { marginRight: '12px', opacity: 0.7, color: '#666' }, children: "\u2709" }), jsxRuntime.jsx("input", { type: "email", style: styles.input, placeholder: "Enter your email", value: email, onChange: (e) => setEmail(e.target.value), autoCapitalize: "none", autoComplete: "email", disabled: isLoading, required: true })] })] }), jsxRuntime.jsxs("div", { style: styles.inputGroup, children: [jsxRuntime.jsx("label", { style: styles.inputLabel, children: "Password" }), jsxRuntime.jsxs("div", { style: styles.inputContainer, children: [jsxRuntime.jsx("span", { style: { marginRight: '12px', opacity: 0.7, color: '#666' }, children: "\uD83D\uDD12" }), jsxRuntime.jsx("input", { type: showPassword ? 'text' : 'password', style: styles.input, placeholder: "Enter your password", value: password, onChange: (e) => setPassword(e.target.value), autoComplete: "current-password", disabled: isLoading, required: true }), jsxRuntime.jsx("button", { type: "button", style: styles.eyeButton, onClick: () => setShowPassword(!showPassword), disabled: isLoading, children: showPassword ? '👁' : '👁‍🗨' })] })] }), jsxRuntime.jsxs("div", { style: styles.checkboxContainer, children: [jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', fontSize: '14px', color: '#666' }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: rememberMe, onChange: (e) => setRememberMe(e.target.checked), style: { marginRight: '8px' } }), "Remember me"] }), showPasswordReset && (jsxRuntime.jsx("button", { type: "button", style: { ...styles.linkButton, fontSize: '14px' }, onClick: onPasswordReset, disabled: isLoading, children: "Forgot password?" }))] }), jsxRuntime.jsx("button", { type: "submit", style: {
+    return (jsxRuntime.jsxs("div", { className: className, style: styles.container, children: [jsxRuntime.jsxs("div", { style: styles.logoSection, children: [logo && (typeof logo === 'string' ? (jsxRuntime.jsx("img", { src: processLogoUrl(logo), alt: `${appName} Logo`, style: styles.logo })) : (logo)), jsxRuntime.jsxs("h1", { style: styles.welcomeText, children: ["Welcome to ", appName] }), jsxRuntime.jsx("p", { style: styles.subtitleText, children: step === 'otp' ? 'Enter the verification code we sent you.' : 'Sign in to your account' })] }), error && (jsxRuntime.jsxs("div", { style: styles.errorContainer, children: [jsxRuntime.jsx("span", { style: { color: '#ff4757', fontSize: '20px' }, children: "\u26A0" }), jsxRuntime.jsx("span", { style: styles.errorText, children: error })] })), step === 'otp' ? (jsxRuntime.jsxs("form", { onSubmit: handleOtpSubmit, children: [jsxRuntime.jsxs("div", { style: styles.inputGroup, children: [jsxRuntime.jsx("label", { style: styles.inputLabel, children: "Verification Code" }), jsxRuntime.jsxs("div", { style: styles.inputContainer, children: [jsxRuntime.jsx("span", { style: { marginRight: '12px', opacity: 0.7, color: '#666' }, children: "\uD83D\uDD10" }), jsxRuntime.jsx("input", { type: "text", inputMode: "numeric", pattern: "[0-9]*", maxLength: 6, style: { ...styles.input, letterSpacing: '0.4em', textAlign: 'center' }, placeholder: "000000", value: otpCode, onChange: (e) => setOtpCode(e.target.value.replace(/\D/g, '')), autoFocus: true, autoComplete: "one-time-code", disabled: otpLoading, required: true })] })] }), jsxRuntime.jsx("button", { type: "submit", style: {
+                            ...styles.loginButton,
+                            opacity: otpLoading || otpCode.length < 6 ? 0.7 : 1,
+                            cursor: otpLoading || otpCode.length < 6 ? 'not-allowed' : 'pointer',
+                        }, disabled: otpLoading || otpCode.length < 6, children: otpLoading ? '⟳ Verifying…' : 'Verify Code' }), jsxRuntime.jsxs("div", { style: { textAlign: 'center', marginTop: '16px' }, children: [jsxRuntime.jsx("button", { type: "button", style: { ...styles.linkButton, fontSize: '14px' }, onClick: handleResend, disabled: otpLoading, children: "Didn't receive a code? Resend" }), jsxRuntime.jsx("button", { type: "button", style: { ...styles.linkButton, fontSize: '13px', color: '#888' }, onClick: () => { setStep('credentials'); setError(''); setOtpCode(''); }, children: "\u2190 Back to login" })] })] })) : (
+            /* ── Credentials Step ── */
+            jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [jsxRuntime.jsxs("div", { style: styles.inputGroup, children: [jsxRuntime.jsx("label", { style: styles.inputLabel, children: "Email Address" }), jsxRuntime.jsxs("div", { style: styles.inputContainer, children: [jsxRuntime.jsx("span", { style: { marginRight: '12px', opacity: 0.7, color: '#666' }, children: "\u2709" }), jsxRuntime.jsx("input", { type: "email", style: styles.input, placeholder: "Enter your email", value: email, onChange: (e) => setEmail(e.target.value), autoCapitalize: "none", autoComplete: "email", disabled: isLoading, required: true })] })] }), jsxRuntime.jsxs("div", { style: styles.inputGroup, children: [jsxRuntime.jsx("label", { style: styles.inputLabel, children: "Password" }), jsxRuntime.jsxs("div", { style: styles.inputContainer, children: [jsxRuntime.jsx("span", { style: { marginRight: '12px', opacity: 0.7, color: '#666' }, children: "\uD83D\uDD12" }), jsxRuntime.jsx("input", { type: showPassword ? 'text' : 'password', style: styles.input, placeholder: "Enter your password", value: password, onChange: (e) => setPassword(e.target.value), autoComplete: "current-password", disabled: isLoading, required: true }), jsxRuntime.jsx("button", { type: "button", style: styles.eyeButton, onClick: () => setShowPassword(!showPassword), disabled: isLoading, children: showPassword ? '👁' : '👁‍🗨' })] })] }), jsxRuntime.jsxs("div", { style: styles.checkboxContainer, children: [jsxRuntime.jsxs("label", { style: { display: 'flex', alignItems: 'center', fontSize: '14px', color: '#666' }, children: [jsxRuntime.jsx("input", { type: "checkbox", checked: rememberMe, onChange: (e) => setRememberMe(e.target.checked), style: { marginRight: '8px' } }), "Remember me"] }), showPasswordReset && (jsxRuntime.jsx("button", { type: "button", style: { ...styles.linkButton, fontSize: '14px' }, onClick: onPasswordReset, disabled: isLoading, children: "Forgot password?" }))] }), jsxRuntime.jsx("button", { type: "submit", style: {
                             ...styles.loginButton,
                             opacity: isLoading ? 0.8 : 1,
                             cursor: isLoading ? 'not-allowed' : 'pointer'
-                        }, disabled: isLoading, children: isLoading ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { style: { animation: 'spin 1s linear infinite' }, children: "\u27F3" }), "Signing in..."] })) : ('Sign In') })] }), showAccountCreation && (jsxRuntime.jsx("div", { style: styles.accountActions, children: jsxRuntime.jsx("button", { type: "button", style: styles.linkButton, onClick: onAccountCreation, disabled: isLoading, children: "Create New Account" }) })), jsxRuntime.jsx("style", { children: `
+                        }, disabled: isLoading, children: isLoading ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { style: { animation: 'spin 1s linear infinite' }, children: "\u27F3" }), "Signing in..."] })) : ('Sign In') }), showAccountCreation && (jsxRuntime.jsx("div", { style: styles.accountActions, children: jsxRuntime.jsx("button", { type: "button", style: styles.linkButton, onClick: onAccountCreation, disabled: isLoading, children: "Create New Account" }) }))] })), jsxRuntime.jsx("style", { children: `
         @keyframes spin {
           from { transform: rotate(0deg); }
           to { transform: rotate(360deg); }
@@ -9830,6 +10036,125 @@ function useBridgeApiRaw(instanceId) {
     };
 }
 
+/**
+ * useTwoFactor Hook for React
+ *
+ * Convenience hook for managing 2FA settings (setup, toggle, remove).
+ * For the LOGIN-TIME 2FA flow use useAuth() which surfaces
+ * twoFactorPending / verifyTwoFactor / startTwoFactor.
+ */
+/**
+ * Hook for managing 2FA settings.
+ *
+ * Must be used inside a PubflowProvider.
+ *
+ * @param instanceId Optional Pubflow instance ID
+ */
+function useTwoFactor(instanceId) {
+    const context = React.useContext(PubflowContext);
+    if (!context)
+        throw new Error('useTwoFactor must be used within a PubflowProvider');
+    const id = instanceId || context.defaultInstance;
+    const instance = context.instances[id];
+    const [systemEnabled, setSystemEnabled] = React.useState(false);
+    const [availableMethods, setAvailableMethods] = React.useState([]);
+    const [methods, setMethods] = React.useState([]);
+    const [isLoading, setIsLoading] = React.useState(false);
+    const [error, setError] = React.useState(null);
+    const refresh = React.useCallback(async () => {
+        if (!instance)
+            return;
+        setIsLoading(true);
+        setError(null);
+        try {
+            const [sys, userMethods] = await Promise.all([
+                instance.twoFactorService.getSystem(),
+                instance.twoFactorService.getMethods(),
+            ]);
+            setSystemEnabled(sys.global_two_factor_enabled);
+            setAvailableMethods(sys.available_methods);
+            setMethods(userMethods);
+        }
+        catch (e) {
+            setError((e === null || e === void 0 ? void 0 : e.message) || 'Failed to load 2FA info');
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [instance]);
+    const setup = React.useCallback(async (method, identifier) => {
+        if (!instance)
+            return { success: false, error: 'Pubflow not initialized' };
+        setIsLoading(true);
+        setError(null);
+        try {
+            const result = await instance.twoFactorService.setup(method, identifier);
+            if (result.success)
+                await refresh();
+            return result;
+        }
+        catch (e) {
+            const msg = (e === null || e === void 0 ? void 0 : e.message) || 'Setup failed';
+            setError(msg);
+            return { success: false, error: msg };
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [instance, refresh]);
+    const toggle = React.useCallback(async (enabled, verificationCode, verificationMethodId) => {
+        if (!instance)
+            return { success: false, error: 'Pubflow not initialized' };
+        setIsLoading(true);
+        setError(null);
+        try {
+            const result = await instance.twoFactorService.toggle(enabled, verificationCode, verificationMethodId);
+            if (result.success)
+                await refresh();
+            return result;
+        }
+        catch (e) {
+            const msg = (e === null || e === void 0 ? void 0 : e.message) || 'Toggle failed';
+            setError(msg);
+            return { success: false, error: msg };
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [instance, refresh]);
+    const removeMethod = React.useCallback(async (methodId, verificationCode, verificationMethodId) => {
+        if (!instance)
+            return { success: false, error: 'Pubflow not initialized' };
+        setIsLoading(true);
+        setError(null);
+        try {
+            const result = await instance.twoFactorService.removeMethod(methodId, verificationCode, verificationMethodId);
+            if (result.success)
+                await refresh();
+            return result;
+        }
+        catch (e) {
+            const msg = (e === null || e === void 0 ? void 0 : e.message) || 'Remove failed';
+            setError(msg);
+            return { success: false, error: msg };
+        }
+        finally {
+            setIsLoading(false);
+        }
+    }, [instance, refresh]);
+    return {
+        systemEnabled,
+        availableMethods,
+        methods,
+        isLoading,
+        error,
+        refresh,
+        setup,
+        toggle,
+        removeMethod,
+    };
+}
+
 /**
  * Search Query Builder Hook for React
  *
@@ -10082,6 +10407,7 @@ exports.useRequireAuth = useRequireAuth;
 exports.useSearchQueryBuilder = useSearchQueryBuilder;
 exports.useSimpleAuthGuard = useSimpleAuthGuard;
 exports.useTheme = useTheme;
+exports.useTwoFactor = useTwoFactor;
 Object.keys(core).forEach(function (k) {
     if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
         enumerable: true,