@proveanything/smartlinks-auth-ui 0.1.11 → 0.1.13

package/dist/index.js

@@ -11238,7 +11238,7 @@ const tokenStorage = {
 };
 
 const AuthContext = React.createContext(undefined);
-const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccountInfo = false }) => {
+const AuthProvider = ({ children, proxyMode = false, accountCacheTTL = 5 * 60 * 1000, preloadAccountInfo = false }) => {
     const [user, setUser] = React.useState(null);
     const [token, setToken] = React.useState(null);
     const [accountData, setAccountData] = React.useState(null);
@@ -11262,10 +11262,45 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
             }
         });
     }, []);
-    // Initialize auth state from persistent storage
+    // Initialize auth state - different behavior for proxy mode vs standalone mode
     React.useEffect(() => {
         const initializeAuth = async () => {
             try {
+                if (proxyMode) {
+                    // PROXY MODE: Initialize from URL params and parent via SDK
+                    const params = new URLSearchParams(window.location.search);
+                    const userId = params.get('userId');
+                    if (userId) {
+                        console.log('[AuthContext] Proxy mode: userId detected, fetching account from parent');
+                        try {
+                            // Fetch account details from parent via proxied API call
+                            const accountResponse = await smartlinks__namespace.auth.getAccount();
+                            // Build user object from account response
+                            const accountAny = accountResponse;
+                            const userFromAccount = {
+                                uid: userId,
+                                email: accountAny?.email,
+                                displayName: accountAny?.displayName || accountAny?.name,
+                                phoneNumber: accountAny?.phoneNumber,
+                            };
+                            setUser(userFromAccount);
+                            setAccountData(accountResponse);
+                            setAccountInfo(accountResponse);
+                            console.log('[AuthContext] Proxy mode: initialized from parent account');
+                            notifyAuthStateChange('LOGIN', userFromAccount, null, accountResponse, accountResponse);
+                        }
+                        catch (error) {
+                            console.warn('[AuthContext] Proxy mode: failed to fetch account from parent:', error);
+                            // No session - that's ok, user may need to login
+                        }
+                    }
+                    else {
+                        console.log('[AuthContext] Proxy mode: no userId in URL, awaiting login');
+                    }
+                    setIsLoading(false);
+                    return;
+                }
+                // STANDALONE MODE: Load from persistent storage
                 const storedToken = await tokenStorage.getToken();
                 const storedUser = await tokenStorage.getUser();
                 const storedAccountData = await tokenStorage.getAccountData();
@@ -11292,9 +11327,49 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
             }
         };
         initializeAuth();
-    }, []);
-    // Cross-tab synchronization - listen for auth changes in other tabs
+    }, [proxyMode, notifyAuthStateChange]);
+    // Listen for parent auth state changes (proxy mode only)
+    React.useEffect(() => {
+        if (!proxyMode)
+            return;
+        console.log('[AuthContext] Proxy mode: setting up parent message listener');
+        const handleParentMessage = (event) => {
+            // Handle auth state pushed from parent
+            if (event.data?.type === 'smartlinks:authkit:state') {
+                const { user: parentUser, accountData: parentAccountData, authenticated } = event.data.payload || {};
+                console.log('[AuthContext] Proxy mode: received state from parent:', { authenticated });
+                if (authenticated && parentUser) {
+                    const userObj = {
+                        uid: parentUser.uid || parentUser.id,
+                        email: parentUser.email,
+                        displayName: parentUser.displayName || parentUser.name,
+                        phoneNumber: parentUser.phoneNumber,
+                    };
+                    setUser(userObj);
+                    setAccountData(parentAccountData || null);
+                    setAccountInfo(parentAccountData || null);
+                    notifyAuthStateChange('CROSS_TAB_SYNC', userObj, null, parentAccountData || null, parentAccountData || null);
+                }
+                else {
+                    // Parent indicates no session / logged out
+                    setUser(null);
+                    setToken(null);
+                    setAccountData(null);
+                    setAccountInfo(null);
+                    notifyAuthStateChange('LOGOUT', null, null, null, null);
+                }
+            }
+        };
+        window.addEventListener('message', handleParentMessage);
+        return () => {
+            console.log('[AuthContext] Proxy mode: cleaning up parent message listener');
+            window.removeEventListener('message', handleParentMessage);
+        };
+    }, [proxyMode, notifyAuthStateChange]);
+    // Cross-tab synchronization - standalone mode only
     React.useEffect(() => {
+        if (proxyMode)
+            return; // Skip cross-tab sync in proxy mode
         console.log('[AuthContext] Setting up cross-tab synchronization');
         const unsubscribe = onStorageChange(async (event) => {
             console.log('[AuthContext] Cross-tab storage event:', event.type, event.key);
@@ -11353,27 +11428,38 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
             console.log('[AuthContext] Cleaning up cross-tab synchronization');
             unsubscribe();
         };
-    }, [notifyAuthStateChange]);
+    }, [proxyMode, notifyAuthStateChange]);
     const login = React.useCallback(async (authToken, authUser, authAccountData) => {
         try {
-            // Store token, user, and account data
-            await tokenStorage.saveToken(authToken);
-            await tokenStorage.saveUser(authUser);
-            if (authAccountData) {
-                await tokenStorage.saveAccountData(authAccountData);
+            // Only persist to storage in standalone mode
+            if (!proxyMode) {
+                await tokenStorage.saveToken(authToken);
+                await tokenStorage.saveUser(authUser);
+                if (authAccountData) {
+                    await tokenStorage.saveAccountData(authAccountData);
+                }
+                // Set bearer token in global Smartlinks SDK via auth.verifyToken
+                smartlinks__namespace.auth.verifyToken(authToken).catch(err => {
+                    console.warn('Failed to set bearer token on login:', err);
+                });
             }
+            // Always update memory state
             setToken(authToken);
             setUser(authUser);
             setAccountData(authAccountData || null);
-            // Set bearer token in global Smartlinks SDK via auth.verifyToken
-            // This both validates the token and sets it for future API calls
-            smartlinks__namespace.auth.verifyToken(authToken).catch(err => {
-                console.warn('Failed to set bearer token on login:', err);
-            });
+            // Cross-iframe auth state synchronization
+            // Always notify parent frame of login (both modes, but especially important in proxy mode)
+            const sdk = smartlinks__namespace;
+            if (sdk.iframe?.isIframe?.()) {
+                sdk.iframe.sendParentCustom('smartlinks:authkit:login', {
+                    token: authToken,
+                    user: authUser,
+                    accountData: authAccountData || null
+                });
+            }
             notifyAuthStateChange('LOGIN', authUser, authToken, authAccountData || null);
-            // Optionally preload account info on login
-            if (preloadAccountInfo) {
-                // Preload after login completes (non-blocking)
+            // Optionally preload account info on login (standalone mode only)
+            if (!proxyMode && preloadAccountInfo) {
                 getAccount(true).catch(error => {
                     console.warn('[AuthContext] Failed to preload account info:', error);
                 });
@@ -11383,34 +11469,55 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
             console.error('Failed to save auth data to storage:', error);
             throw error;
         }
-    }, [notifyAuthStateChange, preloadAccountInfo]);
+    }, [proxyMode, notifyAuthStateChange, preloadAccountInfo]);
     const logout = React.useCallback(async () => {
         try {
-            // Clear persistent storage
-            await tokenStorage.clearAll();
+            // Only clear persistent storage in standalone mode
+            if (!proxyMode) {
+                await tokenStorage.clearAll();
+                smartlinks__namespace.auth.logout();
+            }
+            // Always clear memory state
             setToken(null);
             setUser(null);
             setAccountData(null);
             setAccountInfo(null);
-            // Clear bearer token from global Smartlinks SDK
-            smartlinks__namespace.auth.logout();
+            // Cross-iframe auth state synchronization
+            // Always notify parent frame of logout
+            const sdk = smartlinks__namespace;
+            if (sdk.iframe?.isIframe?.()) {
+                sdk.iframe.sendParentCustom('smartlinks:authkit:logout', {});
+            }
             notifyAuthStateChange('LOGOUT', null, null, null);
         }
         catch (error) {
             console.error('Failed to clear auth data from storage:', error);
         }
-    }, [notifyAuthStateChange]);
+    }, [proxyMode, notifyAuthStateChange]);
     const getToken = React.useCallback(async () => {
+        if (proxyMode) {
+            // In proxy mode, token is managed by parent - return memory state
+            return token;
+        }
         const storedToken = await tokenStorage.getToken();
         return storedToken ? storedToken.token : null;
-    }, []);
+    }, [proxyMode, token]);
     const refreshToken = React.useCallback(async () => {
         throw new Error('Token refresh must be implemented via your backend API');
     }, []);
-    // Get account with intelligent caching
+    // Get account with intelligent caching (or direct parent fetch in proxy mode)
     const getAccount = React.useCallback(async (forceRefresh = false) => {
         try {
-            // Check if user is authenticated
+            if (proxyMode) {
+                // PROXY MODE: Always fetch from parent via proxied API, no local cache
+                console.log('[AuthContext] Proxy mode: fetching account from parent');
+                const freshAccountInfo = await smartlinks__namespace.auth.getAccount();
+                setAccountInfo(freshAccountInfo);
+                setAccountData(freshAccountInfo);
+                notifyAuthStateChange('ACCOUNT_REFRESH', user, token, freshAccountInfo, freshAccountInfo);
+                return freshAccountInfo;
+            }
+            // STANDALONE MODE: Use caching
             if (!token) {
                 throw new Error('Not authenticated. Please login first.');
             }
@@ -11433,24 +11540,28 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
         }
         catch (error) {
             console.error('[AuthContext] Failed to get account info:', error);
-            // Fallback to stale cache if API fails
-            const cached = await tokenStorage.getAccountInfo();
-            if (cached) {
-                console.warn('[AuthContext] Returning stale cached data due to API error');
-                return cached.data;
+            // Fallback to stale cache if API fails (standalone mode only)
+            if (!proxyMode) {
+                const cached = await tokenStorage.getAccountInfo();
+                if (cached) {
+                    console.warn('[AuthContext] Returning stale cached data due to API error');
+                    return cached.data;
+                }
             }
             throw error;
         }
-    }, [token, accountCacheTTL, user, accountData, notifyAuthStateChange]);
+    }, [proxyMode, token, accountCacheTTL, user, accountData, notifyAuthStateChange]);
     // Convenience method for explicit refresh
     const refreshAccount = React.useCallback(async () => {
         return await getAccount(true);
     }, [getAccount]);
-    // Clear account cache
+    // Clear account cache (no-op in proxy mode)
     const clearAccountCache = React.useCallback(async () => {
-        await tokenStorage.clearAccountInfo();
+        if (!proxyMode) {
+            await tokenStorage.clearAccountInfo();
+        }
         setAccountInfo(null);
-    }, []);
+    }, [proxyMode]);
     const onAuthStateChange = React.useCallback((callback) => {
         callbacksRef.current.add(callback);
         // Return unsubscribe function
@@ -11463,8 +11574,9 @@ const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccoun
         token,
         accountData,
         accountInfo,
-        isAuthenticated: !!token && !!user,
+        isAuthenticated: !!user,
         isLoading,
+        proxyMode,
         login,
         logout,
         getToken,
@@ -11554,7 +11666,7 @@ const getFriendlyErrorMessage = (errorMessage) => {
     // Return original message if no pattern matches
     return errorMessage;
 };
-const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAuthSuccess, onAuthError, enabledProviders = ['email', 'google', 'phone'], initialMode = 'login', redirectUrl, theme = 'auto', className, customization, skipConfigFetch = false, minimal = false, logger, }) => {
+const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAuthSuccess, onAuthError, enabledProviders = ['email', 'google', 'phone'], initialMode = 'login', redirectUrl, theme = 'auto', className, customization, skipConfigFetch = false, minimal = false, logger, proxyMode = false, }) => {
     const [mode, setMode] = React.useState(initialMode);
     const [loading, setLoading] = React.useState(false);
     const [error, setError] = React.useState();
@@ -11587,25 +11699,25 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         mediaQuery.addEventListener('change', updateTheme);
         return () => mediaQuery.removeEventListener('change', updateTheme);
     }, [theme]);
-    // Reinitialize Smartlinks SDK when apiEndpoint changes (for test/dev scenarios)
+    // Reinitialize Smartlinks SDK when apiEndpoint or proxyMode changes
     // IMPORTANT: Preserve bearer token during reinitialization
     React.useEffect(() => {
-        log.log('SDK reinitialize useEffect triggered', { apiEndpoint });
+        log.log('SDK reinitialize useEffect triggered', { apiEndpoint, proxyMode });
         setSdkReady(false); // Mark SDK as not ready during reinitialization
         const reinitializeWithToken = async () => {
             if (apiEndpoint) {
-                log.log('Reinitializing SDK with baseURL:', apiEndpoint);
-                // Get current token before reinitializing
-                const currentToken = await auth.getToken();
+                log.log('Reinitializing SDK with baseURL:', apiEndpoint, 'proxyMode:', proxyMode);
+                // Get current token before reinitializing (only in standalone mode)
+                const currentToken = !proxyMode ? await auth.getToken() : null;
                 smartlinks__namespace.initializeApi({
                     baseURL: apiEndpoint,
-                    proxyMode: false, // Direct API calls when custom endpoint is provided
+                    proxyMode: proxyMode, // Use prop value
                     ngrokSkipBrowserWarning: true,
                     logger: logger, // Pass logger to SDK for verbose SDK logging
                 });
                 log.log('SDK reinitialized successfully');
-                // Restore bearer token after reinitialization using auth.verifyToken
-                if (currentToken) {
+                // Restore bearer token after reinitialization using auth.verifyToken (standalone mode only)
+                if (currentToken && !proxyMode) {
                     smartlinks__namespace.auth.verifyToken(currentToken).catch(err => {
                         log.warn('Failed to restore bearer token after reinit:', err);
                     });
@@ -11613,6 +11725,11 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 // Mark SDK as ready
                 setSdkReady(true);
             }
+            else if (proxyMode) {
+                // In proxy mode without custom endpoint, SDK should already be initialized by parent
+                log.log('Proxy mode without apiEndpoint, SDK already initialized by parent');
+                setSdkReady(true);
+            }
             else {
                 log.log('No apiEndpoint, SDK already initialized by App');
                 // SDK was initialized by App component, mark as ready
@@ -11620,7 +11737,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
             }
         };
         reinitializeWithToken();
-    }, [apiEndpoint, auth, logger, log]);
+    }, [apiEndpoint, proxyMode, auth, logger, log]);
     // Get the effective redirect URL (use prop or default to current page)
     const getRedirectUrl = () => {
         if (redirectUrl)
@@ -12134,11 +12251,18 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                     },
                     auto_select: false,
                     cancel_on_tap_outside: true,
+                    // Note: use_fedcm_for_prompt omitted - requires Permissions-Policy header on hosting server
+                    // Will be needed when FedCM becomes mandatory in the future
                 });
-                google.accounts.id.prompt((notification) => {
-                    if (notification.isNotDisplayed() || notification.isSkippedMoment()) {
-                        setLoading(false);
-                    }
+                // Use timeout fallback instead of deprecated notification methods
+                // (isNotDisplayed/isSkippedMoment will stop working when FedCM becomes mandatory)
+                const promptTimeout = setTimeout(() => {
+                    setLoading(false);
+                }, 5000);
+                google.accounts.id.prompt(() => {
+                    // Clear timeout if prompt interaction occurs
+                    clearTimeout(promptTimeout);
+                    setLoading(false);
                 });
             }
         }