@proveanything/smartlinks-auth-ui 0.1.28 → 0.1.30

package/dist/index.js

@@ -3,6 +3,7 @@
 var jsxRuntime = require('react/jsx-runtime');
 var React = require('react');
 var smartlinks = require('@proveanything/smartlinks');
+var http = require('@proveanything/smartlinks/dist/http');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -10809,6 +10810,18 @@ class AuthAPI {
         // Pass token to SDK - backend verifies with Google
         return smartlinks__namespace.authKit.googleLogin(this.clientId, token);
     }
+    async loginWithGoogleCode(code, redirectUri) {
+        this.log.log('loginWithGoogleCode called:', {
+            codeLength: code?.length,
+            redirectUri,
+        });
+        // Exchange authorization code for tokens via backend
+        // Use direct HTTP call since SDK may not have this method in authKit namespace yet
+        return http.post(`/api/v1/authkit/${this.clientId}/google-code`, {
+            code,
+            redirectUri,
+        });
+    }
     async sendPhoneCode(phoneNumber) {
         return smartlinks__namespace.authKit.sendPhoneCode(this.clientId, phoneNumber);
     }
@@ -12196,6 +12209,28 @@ const loadGoogleIdentityServices = () => {
         document.head.appendChild(script);
     });
 };
+// Helper to detect WebView environments (Android/iOS)
+const detectWebView = () => {
+    const ua = navigator.userAgent;
+    // Android WebView detection
+    if (/Android/i.test(ua)) {
+        // Modern Android WebViews include "wv" in UA string
+        if (/\bwv\b/i.test(ua))
+            return true;
+        // Check for legacy Android bridge
+        if (typeof window.Android !== 'undefined')
+            return true;
+    }
+    // iOS WKWebView detection
+    if (/iPhone|iPad|iPod/i.test(ua)) {
+        const hasWebKitHandlers = !!window.webkit?.messageHandlers;
+        const isSafari = !!window.safari;
+        // WKWebView has webkit handlers but no safari object
+        if (hasWebKitHandlers && !isSafari)
+            return true;
+    }
+    return false;
+};
 // Helper to convert generic SDK errors to user-friendly messages
 const getFriendlyErrorMessage = (errorMessage) => {
     // Check for common HTTP status codes in the error message
@@ -12223,7 +12258,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, proxyMode = false, collectionId, }) => {
+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, collectionId, disableConfigCache = false, }) => {
     const [mode, setMode] = React.useState(initialMode);
     const [loading, setLoading] = React.useState(false);
     const [error, setError] = React.useState();
@@ -12364,31 +12399,38 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 return;
             }
             try {
-                // Check localStorage cache first
                 const cacheKey = `auth_ui_config_${clientId}`;
-                const cached = localStorage.getItem(cacheKey);
-                if (cached) {
-                    const { config: cachedConfig, timestamp } = JSON.parse(cached);
-                    const age = Date.now() - timestamp;
-                    // Use cache if less than 1 hour old
-                    if (age < 3600000) {
-                        console.log('[SmartlinksAuthUI] 📦 Using cached config (age:', Math.round(age / 1000), 'seconds)');
-                        setConfig({ ...cachedConfig, ...customization });
-                        setConfigLoading(false);
-                        // Fetch in background to update cache
-                        console.log('[SmartlinksAuthUI] 🔄 Background refresh of config via SDK...');
-                        api.fetchConfig().then(freshConfig => {
-                            console.log('[SmartlinksAuthUI] ✅ Background config refresh complete');
-                            localStorage.setItem(cacheKey, JSON.stringify({
-                                config: freshConfig,
-                                timestamp: Date.now()
-                            }));
-                        }).catch(err => {
-                            console.log('[SmartlinksAuthUI] ❌ Background config refresh failed:', err);
-                        });
-                        return;
+                // Check localStorage cache first (unless caching is disabled)
+                if (!disableConfigCache) {
+                    const cached = localStorage.getItem(cacheKey);
+                    if (cached) {
+                        const { config: cachedConfig, timestamp } = JSON.parse(cached);
+                        const age = Date.now() - timestamp;
+                        // Use cache if less than 1 hour old
+                        if (age < 3600000) {
+                            console.log('[SmartlinksAuthUI] 📦 Using cached config (age:', Math.round(age / 1000), 'seconds)');
+                            setConfig({ ...cachedConfig, ...customization });
+                            setConfigLoading(false);
+                            // Fetch in background to update cache
+                            console.log('[SmartlinksAuthUI] 🔄 Background refresh of config via SDK...');
+                            api.fetchConfig().then(freshConfig => {
+                                console.log('[SmartlinksAuthUI] ✅ Background config refresh complete');
+                                localStorage.setItem(cacheKey, JSON.stringify({
+                                    config: freshConfig,
+                                    timestamp: Date.now()
+                                }));
+                                // Update config if it changed
+                                setConfig({ ...freshConfig, ...customization });
+                            }).catch(err => {
+                                console.log('[SmartlinksAuthUI] ❌ Background config refresh failed:', err);
+                            });
+                            return;
+                        }
                     }
                 }
+                else {
+                    console.log('[SmartlinksAuthUI] ⚠️ Config caching disabled, fetching fresh config');
+                }
                 // Fetch from API
                 console.log('[SmartlinksAuthUI] 🌐 Fetching config via SDK for clientId:', clientId, 'proxyMode:', proxyMode);
                 log.log('Fetching config from API for clientId:', clientId);
@@ -12398,11 +12440,13 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 // Merge with customization props (props take precedence)
                 const mergedConfig = { ...fetchedConfig, ...customization };
                 setConfig(mergedConfig);
-                // Cache the fetched config
-                localStorage.setItem(cacheKey, JSON.stringify({
-                    config: fetchedConfig,
-                    timestamp: Date.now()
-                }));
+                // Cache the fetched config (unless caching is disabled)
+                if (!disableConfigCache) {
+                    localStorage.setItem(cacheKey, JSON.stringify({
+                        config: fetchedConfig,
+                        timestamp: Date.now()
+                    }));
+                }
             }
             catch (err) {
                 console.log('[SmartlinksAuthUI] ❌ Config fetch failed:', err);
@@ -12457,8 +12501,15 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         const params = getUrlParams();
         const urlMode = params.get('mode');
         const token = params.get('token');
-        log.log('URL params detected:', { urlMode, token, hash: window.location.hash, search: window.location.search });
-        if (urlMode && token) {
+        // Check for Google OAuth redirect callback
+        const authCode = params.get('code');
+        const state = params.get('state');
+        log.log('URL params detected:', { urlMode, token, authCode: !!authCode, state: !!state, hash: window.location.hash, search: window.location.search });
+        if (authCode && state) {
+            // Google OAuth redirect callback
+            handleGoogleAuthCodeCallback(authCode, state);
+        }
+        else if (urlMode && token) {
             handleURLBasedAuth(urlMode, token);
         }
     }, []);
@@ -12571,6 +12622,43 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
             setLoading(false);
         }
     };
+    // Handle Google OAuth authorization code callback (from redirect flow)
+    const handleGoogleAuthCodeCallback = async (code, stateParam) => {
+        setLoading(true);
+        setError(undefined);
+        try {
+            // Parse state to get context
+            const state = JSON.parse(decodeURIComponent(stateParam));
+            log.log('Google OAuth redirect callback:', { clientId: state.clientId, returnPath: state.returnPath });
+            // Determine the redirect URI that was used (must match exactly)
+            const redirectUri = state.redirectUri || window.location.origin + window.location.pathname;
+            // Exchange authorization code for tokens
+            const response = await api.loginWithGoogleCode(code, redirectUri);
+            if (response.token) {
+                auth.login(response.token, response.user, response.accountData, response.isNewUser, getExpirationFromResponse(response));
+                setAuthSuccess(true);
+                setSuccessMessage('Google login successful!');
+                onAuthSuccess(response.token, response.user, response.accountData);
+            }
+            else {
+                throw new Error('Authentication failed - no token received');
+            }
+            // Clean URL parameters
+            const cleanUrl = window.location.origin + window.location.pathname + (state.returnPath?.includes('#') ? state.returnPath.split('?')[0] : window.location.hash.split('?')[0]);
+            window.history.replaceState({}, document.title, cleanUrl);
+        }
+        catch (err) {
+            const errorMessage = err instanceof Error ? err.message : 'Google login failed';
+            setError(getFriendlyErrorMessage(errorMessage));
+            onAuthError?.(err instanceof Error ? err : new Error(errorMessage));
+            // Clean URL parameters even on error
+            const cleanUrl = window.location.origin + window.location.pathname + window.location.hash.split('?')[0];
+            window.history.replaceState({}, document.title, cleanUrl);
+        }
+        finally {
+            setLoading(false);
+        }
+    };
     const handleEmailAuth = async (data) => {
         setLoading(true);
         setError(undefined);
@@ -12723,11 +12811,16 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         // Use custom client ID from config, or fall back to default Smartlinks client ID
         const googleClientId = config?.googleClientId || DEFAULT_GOOGLE_CLIENT_ID;
         // Determine OAuth flow: default to 'oneTap' for better UX, but allow 'popup' for iframe compatibility
-        const oauthFlow = config?.googleOAuthFlow || 'oneTap';
+        const configuredFlow = config?.googleOAuthFlow || 'oneTap';
+        // For oneTap, automatically use redirect flow in WebView environments
+        const isWebView = detectWebView();
+        const oauthFlow = (configuredFlow === 'oneTap' && isWebView) ? 'redirect' : configuredFlow;
         // Log Google Auth configuration for debugging
         log.log('Google Auth initiated:', {
             googleClientId,
-            oauthFlow,
+            configuredFlow,
+            effectiveFlow: oauthFlow,
+            isWebView,
             currentOrigin: window.location.origin,
             currentHref: window.location.href,
             configGoogleClientId: config?.googleClientId,
@@ -12743,7 +12836,37 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 throw new Error('Google Identity Services failed to initialize');
             }
             log.log('Google Identity Services loaded, using flow:', oauthFlow);
-            if (oauthFlow === 'popup') {
+            if (oauthFlow === 'redirect') {
+                // Use OAuth2 redirect flow (works in WebViews and everywhere)
+                if (!google.accounts.oauth2) {
+                    throw new Error('Google OAuth2 not available');
+                }
+                // Build the redirect URI - use current URL without query params
+                const redirectUri = getRedirectUrl();
+                // Build state parameter to preserve context across redirect
+                const state = encodeURIComponent(JSON.stringify({
+                    clientId,
+                    returnPath: window.location.hash || window.location.pathname,
+                    redirectUri,
+                }));
+                log.log('Initializing Google OAuth2 redirect flow:', {
+                    client_id: googleClientId,
+                    scope: 'openid email profile',
+                    redirect_uri: redirectUri,
+                    state,
+                });
+                const client = google.accounts.oauth2.initCodeClient({
+                    client_id: googleClientId,
+                    scope: 'openid email profile',
+                    ux_mode: 'redirect',
+                    redirect_uri: redirectUri,
+                    state,
+                });
+                // This will navigate away from the page
+                client.requestCode();
+                return; // Don't set loading to false - we're navigating away
+            }
+            else if (oauthFlow === 'popup') {
                 // Use OAuth2 popup flow (works in iframes but requires popup permission)
                 if (!google.accounts.oauth2) {
                     throw new Error('Google OAuth2 not available');
@@ -12834,7 +12957,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 client.requestAccessToken();
             }
             else {
-                // Use One Tap / Sign-In button flow (smoother UX but doesn't work in iframes)
+                // Use One Tap / Sign-In button flow (smoother UX but doesn't work in iframes or WebViews)
                 log.log('Initializing Google OneTap flow:', {
                     client_id: googleClientId,
                     origin: window.location.origin,
@@ -12867,8 +12990,7 @@ 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
+                    use_fedcm_for_prompt: true, // Enable FedCM for future browser compatibility
                 });
                 // Use timeout fallback instead of deprecated notification methods
                 // (isNotDisplayed/isSkippedMoment will stop working when FedCM becomes mandatory)