@proveanything/smartlinks-auth-ui 0.1.7 → 0.1.9

package/dist/api.d.ts

@@ -1,4 +1,4 @@
-import type { AuthResponse, AuthFormData, AuthUIConfig } from './types';
+import type { AuthResponse, AuthFormData, AuthUIConfig, AuthLogger } from './types';
 /**
  * AuthAPI - Thin wrapper around Smartlinks SDK authKit namespace
  * All authentication operations now use the global Smartlinks SDK
@@ -6,7 +6,8 @@ import type { AuthResponse, AuthFormData, AuthUIConfig } from './types';
 export declare class AuthAPI {
     private clientId;
     private clientName?;
-    constructor(_apiEndpoint: string, clientId: string, clientName?: string);
+    private log;
+    constructor(_apiEndpoint: string, clientId: string, clientName?: string, logger?: AuthLogger);
     login(email: string, password: string): Promise<AuthResponse>;
     register(data: AuthFormData): Promise<AuthResponse>;
     loginWithGoogle(idToken: string): Promise<AuthResponse>;

package/dist/api.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../src/api.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAExE;;;GAGG;AACH,qBAAa,OAAO;IAClB,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,UAAU,CAAC,CAAS;gBAEhB,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM;IAOjE,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC;IAI7D,QAAQ,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;IASnD,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC;IAIvD,aAAa,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,cAAc,EAAE,MAAM,CAAA;KAAE,CAAC;IAIvE,eAAe,CACnB,WAAW,EAAE,MAAM,EACnB,IAAI,EAAE,MAAM,GACX,OAAO,CAAC,YAAY,CAAC;IAIlB,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAQxG,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIlH,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAIzG,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IASzH,oBAAoB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,GAAG;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAIhF,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAStH,WAAW,IAAI,OAAO,CAAC,YAAY,CAAC;IAmBpC,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAOjG,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,GAAG;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;CAGlF"}
+{"version":3,"file":"api.d.ts","sourceRoot":"","sources":["../src/api.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAGpF;;;GAGG;AACH,qBAAa,OAAO;IAClB,OAAO,CAAC,QAAQ,CAAS;IACzB,OAAO,CAAC,UAAU,CAAC,CAAS;IAC5B,OAAO,CAAC,GAAG,CAAyC;gBAExC,YAAY,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,UAAU,CAAC,EAAE,MAAM,EAAE,MAAM,CAAC,EAAE,UAAU;IAQtF,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC;IAI7D,QAAQ,CAAC,IAAI,EAAE,YAAY,GAAG,OAAO,CAAC,YAAY,CAAC;IASnD,eAAe,CAAC,OAAO,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,CAAC;IAIvD,aAAa,CAAC,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,cAAc,EAAE,MAAM,CAAA;KAAE,CAAC;IAIvE,eAAe,CACnB,WAAW,EAAE,MAAM,EACnB,IAAI,EAAE,MAAM,GACX,OAAO,CAAC,YAAY,CAAC;IAIlB,oBAAoB,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAQxG,gBAAgB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,KAAK,EAAE,OAAO,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,SAAS,CAAC,EAAE,MAAM,CAAC;QAAC,OAAO,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC;IAIlH,qBAAqB,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAIzG,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IASzH,oBAAoB,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,GAAG;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAIhF,kBAAkB,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAStH,WAAW,IAAI,OAAO,CAAC,YAAY,CAAC;IAuBpC,aAAa,CAAC,KAAK,EAAE,MAAM,EAAE,WAAW,EAAE,MAAM,GAAG,OAAO,CAAC;QAAE,OAAO,EAAE,OAAO,CAAC;QAAC,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;IAOjG,eAAe,CAAC,KAAK,EAAE,MAAM,GAAG,OAAO,CAAC,YAAY,GAAG;QAAE,OAAO,EAAE,MAAM,CAAA;KAAE,CAAC;CAGlF"}

package/dist/components/SmartlinksAuthUI.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SmartlinksAuthUI.d.ts","sourceRoot":"","sources":["../../src/components/SmartlinksAuthUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAUnD,OAAO,KAAK,EAAE,qBAAqB,EAAyC,MAAM,UAAU,CAAC;AAkD7F,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAu5B5D,CAAC"}
+{"version":3,"file":"SmartlinksAuthUI.d.ts","sourceRoot":"","sources":["../../src/components/SmartlinksAuthUI.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAuC,MAAM,OAAO,CAAC;AAW5D,OAAO,KAAK,EAAE,qBAAqB,EAAyC,MAAM,UAAU,CAAC;AAkD7F,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA06B5D,CAAC"}

package/dist/index.d.ts

@@ -6,5 +6,6 @@ export { ProtectedRoute } from './components/ProtectedRoute';
 export { tokenStorage } from './utils/tokenStorage';
 export { AuthUIPreview } from './components/AuthUIPreview';
 export type * from './types';
+export type { AuthLogger } from './types';
 export { SmartlinksAuthUI as FirebaseAuthUI } from './components/SmartlinksAuthUI';
 //# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAGjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAGzD,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGpD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,mBAAmB,SAAS,CAAC;AAG7B,OAAO,EAAE,gBAAgB,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AAGjE,OAAO,EAAE,iBAAiB,EAAE,MAAM,gCAAgC,CAAC;AACnE,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAGzD,OAAO,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,uBAAuB,CAAC;AAC9D,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAGpD,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAG3D,mBAAmB,SAAS,CAAC;AAC7B,YAAY,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAG1C,OAAO,EAAE,gBAAgB,IAAI,cAAc,EAAE,MAAM,+BAA+B,CAAC"}

package/dist/index.esm.js

@@ -10589,16 +10589,51 @@ const MagicLinkForm = ({ onSubmit, onCancel, loading = false, error, }) => {
     return (jsxs("form", { onSubmit: handleSubmit, className: "auth-form", children: [jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "magic-link-email", className: "auth-label", children: "Email Address" }), jsx("input", { id: "magic-link-email", type: "email", value: email, onChange: (e) => setEmail(e.target.value), className: "auth-input", placeholder: "you@example.com", required: true, disabled: loading })] }), error && (jsx("div", { className: "auth-error-message", children: error })), jsx("button", { type: "submit", className: "auth-button auth-button-primary", disabled: loading || !email, children: loading ? (jsxs(Fragment, { children: [jsx("span", { className: "auth-spinner" }), "Sending..."] })) : ('Send Magic Link') }), jsx("button", { type: "button", onClick: onCancel, className: "auth-button auth-button-secondary", disabled: loading, children: "Cancel" })] }));
 };
 
+/**
+ * Creates a normalized logger wrapper that works with different logger types
+ * - If no logger provided, returns no-op logger (silent)
+ * - If function logger, wraps it with level prefixes
+ * - If console-like object, wraps methods with prefixes
+ */
+function createLoggerWrapper(logger) {
+    if (!logger) {
+        // No-op logger when not provided
+        return {
+            log: () => { },
+            warn: () => { },
+            error: () => { },
+            debug: () => { },
+        };
+    }
+    if (typeof logger === 'function') {
+        // Function logger - call it for all levels
+        return {
+            log: (...args) => logger('[Auth]', ...args),
+            warn: (...args) => logger('[Auth WARN]', ...args),
+            error: (...args) => logger('[Auth ERROR]', ...args),
+            debug: (...args) => logger('[Auth DEBUG]', ...args),
+        };
+    }
+    // Console-like object logger
+    return {
+        log: logger.log ? (...args) => logger.log('[Auth]', ...args) : () => { },
+        warn: logger.warn ? (...args) => logger.warn('[Auth WARN]', ...args) : () => { },
+        error: logger.error ? (...args) => logger.error('[Auth ERROR]', ...args) : () => { },
+        debug: logger.debug ? (...args) => logger.debug('[Auth DEBUG]', ...args) : () => { },
+    };
+}
+
 /**
  * AuthAPI - Thin wrapper around Smartlinks SDK authKit namespace
  * All authentication operations now use the global Smartlinks SDK
  */
 class AuthAPI {
-    constructor(_apiEndpoint, clientId, clientName) {
+    constructor(_apiEndpoint, clientId, clientName, logger) {
         // apiEndpoint is kept for backward compatibility but not used
         // Smartlinks SDK is pre-configured globally
         this.clientId = clientId;
         this.clientName = clientName;
+        this.log = createLoggerWrapper(logger);
     }
     async login(email, password) {
         return smartlinks.authKit.login(this.clientId, email, password);
@@ -10653,11 +10688,15 @@ class AuthAPI {
         });
     }
     async fetchConfig() {
+        this.log.log('fetchConfig called with clientId:', this.clientId);
         try {
-            return await smartlinks.authKit.load(this.clientId);
+            this.log.log('Calling smartlinks.authKit.load...');
+            const result = await smartlinks.authKit.load(this.clientId);
+            this.log.log('smartlinks.authKit.load returned:', result);
+            return result;
         }
         catch (error) {
-            console.warn('Failed to fetch UI config, using defaults:', error);
+            this.log.warn('Failed to fetch UI config, using defaults:', error);
             return {
                 branding: {
                     title: 'Smartlinks Auth',
@@ -11454,7 +11493,7 @@ const loadGoogleIdentityServices = () => {
         document.head.appendChild(script);
     });
 };
-const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAuthSuccess, onAuthError, enabledProviders = ['email', 'google', 'phone'], initialMode = 'login', redirectUrl, theme = 'auto', className, customization, skipConfigFetch = false, minimal = false, }) => {
+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 [mode, setMode] = useState(initialMode);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState();
@@ -11470,7 +11509,8 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
     const [config, setConfig] = useState(null);
     const [configLoading, setConfigLoading] = useState(!skipConfigFetch);
     const [showEmailForm, setShowEmailForm] = useState(false); // Track if email form should be shown when emailDisplayMode is 'button'
-    const api = new AuthAPI(apiEndpoint, clientId, clientName);
+    const log = useMemo(() => createLoggerWrapper(logger), [logger]);
+    const api = new AuthAPI(apiEndpoint, clientId, clientName, logger);
     const auth = useAuth();
     // Dark mode detection and theme management
     useEffect(() => {
@@ -11488,25 +11528,31 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
     // Reinitialize Smartlinks SDK when apiEndpoint changes (for test/dev scenarios)
     // IMPORTANT: Preserve bearer token during reinitialization
     useEffect(() => {
+        log.log('SDK reinitialize useEffect triggered', { apiEndpoint });
         const reinitializeWithToken = async () => {
             if (apiEndpoint) {
+                log.log('Reinitializing SDK with baseURL:', apiEndpoint);
                 // Get current token before reinitializing
                 const currentToken = await auth.getToken();
                 smartlinks.initializeApi({
                     baseURL: apiEndpoint,
                     proxyMode: false, // Direct API calls when custom endpoint is provided
                     ngrokSkipBrowserWarning: true,
+                    logger: logger, // Pass logger to SDK for verbose SDK logging
                 });
                 // Restore bearer token after reinitialization using auth.verifyToken
                 if (currentToken) {
                     smartlinks.auth.verifyToken(currentToken).catch(err => {
-                        console.warn('Failed to restore bearer token after reinit:', err);
+                        log.warn('Failed to restore bearer token after reinit:', err);
                     });
                 }
             }
+            else {
+                log.log('No apiEndpoint, skipping SDK reinitialize');
+            }
         };
         reinitializeWithToken();
-    }, [apiEndpoint, auth]);
+    }, [apiEndpoint, auth, logger, log]);
     // Get the effective redirect URL (use prop or default to current page)
     const getRedirectUrl = () => {
         if (redirectUrl)
@@ -11518,13 +11564,22 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
     };
     // Fetch UI configuration
     useEffect(() => {
+        log.log('Config fetch useEffect triggered', {
+            skipConfigFetch,
+            clientId,
+            clientIdType: typeof clientId,
+            clientIdTruthy: !!clientId,
+            apiEndpoint
+        });
         if (skipConfigFetch) {
+            log.log('Skipping config fetch - skipConfigFetch is true');
             setConfig(customization || {});
             return;
         }
         const fetchConfig = async () => {
             // If no clientId provided, use default config immediately without API call
             if (!clientId) {
+                log.log('No clientId provided, using default config');
                 const defaultConfig = {
                     ...DEFAULT_AUTH_CONFIG,
                     enabledProviders: enabledProviders || ['email', 'google', 'phone']
@@ -11555,7 +11610,9 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                     }
                 }
                 // Fetch from API
+                log.log('Fetching config from API for clientId:', clientId);
                 const fetchedConfig = await api.fetchConfig();
+                log.log('Received config:', fetchedConfig);
                 // Merge with customization props (props take precedence)
                 const mergedConfig = { ...fetchedConfig, ...customization };
                 setConfig(mergedConfig);
@@ -11566,7 +11623,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 }));
             }
             catch (err) {
-                console.error('Failed to fetch config:', err);
+                log.error('Failed to fetch config:', err);
                 setConfig(customization || {});
             }
             finally {
@@ -11574,7 +11631,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
             }
         };
         fetchConfig();
-    }, [apiEndpoint, clientId, customization, skipConfigFetch]);
+    }, [apiEndpoint, clientId, customization, skipConfigFetch, log]);
     // Reset showEmailForm when mode changes away from login/register
     useEffect(() => {
         if (mode !== 'login' && mode !== 'register') {
@@ -11599,7 +11656,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         const params = getUrlParams();
         const urlMode = params.get('mode');
         const token = params.get('token');
-        console.log('URL params detected:', { urlMode, token, hash: window.location.hash, search: window.location.search });
+        log.log('URL params detected:', { urlMode, token, hash: window.location.hash, search: window.location.search });
         if (urlMode && token) {
             handleURLBasedAuth(urlMode, token);
         }
@@ -11609,7 +11666,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         setError(undefined);
         try {
             if (urlMode === 'verifyEmail') {
-                console.log('Verifying email with token:', token);
+                log.log('Verifying email with token:', token);
                 const response = await api.verifyEmailWithToken(token);
                 // Get email verification mode from response or config
                 const verificationMode = response.emailVerificationMode || config?.emailVerification?.mode || 'verify-then-auto-login';
@@ -11644,7 +11701,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 }
             }
             else if (urlMode === 'resetPassword') {
-                console.log('Verifying reset token:', token);
+                log.log('Verifying reset token:', token);
                 // Verify token is valid, then show password reset form
                 await api.verifyResetToken(token);
                 setResetToken(token); // Store token for use in password reset
@@ -11654,7 +11711,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                 window.history.replaceState({}, document.title, cleanUrl);
             }
             else if (urlMode === 'magicLink') {
-                console.log('Verifying magic link token:', token);
+                log.log('Verifying magic link token:', token);
                 const response = await api.verifyMagicLink(token);
                 // Auto-login with magic link if token is provided
                 if (response.token) {
@@ -11678,7 +11735,7 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
             }
         }
         catch (err) {
-            console.error('URL-based auth error:', err);
+            log.error('URL-based auth error:', err);
             const errorMessage = err instanceof Error ? err.message : 'An error occurred';
             // If it's an email verification error (expired/invalid token), show resend option
             if (urlMode === 'verifyEmail') {