@proveanything/smartlinks-auth-ui 0.1.3 → 0.1.4

package/dist/index.esm.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import React, { useEffect, useState, useRef, useCallback, useMemo, createContext, useContext } from 'react';
 import * as smartlinks from '@proveanything/smartlinks';
 
-const AuthContainer = ({ children, theme = 'light', className = '', config, }) => {
+const AuthContainer = ({ children, theme = 'light', className = '', config, minimal = false, }) => {
     // Apply CSS variables for customization
     useEffect(() => {
         if (!config?.branding)
@@ -42,11 +42,21 @@ const AuthContainer = ({ children, theme = 'light', className = '', config, }) =
     }, [config]);
     const title = config?.branding?.title;
     const subtitle = config?.branding?.subtitle;
-    const logoUrl = config?.branding?.logoUrl || '/smartlinks-logo.png';
-    return (jsx("div", { className: `auth-container auth-theme-${theme} ${className}`, children: jsxs("div", { className: "auth-card", style: { borderRadius: config?.branding?.buttonStyle === 'square' ? '4px' : '12px' }, children: [(jsxs("div", { className: "auth-header", children: [(jsx("div", { className: "auth-logo", children: jsx("img", { src: logoUrl, alt: "Logo", style: { maxWidth: '200px', height: 'auto', objectFit: 'contain' } }) })), title && jsx("h1", { className: "auth-title", children: title }), subtitle && jsx("p", { className: "auth-subtitle", children: subtitle })] })), jsx("div", { className: "auth-content", children: children }), (config?.branding?.termsUrl || config?.branding?.privacyUrl) && (jsxs("div", { className: "auth-footer", children: [config.branding.termsUrl && jsx("a", { href: config.branding.termsUrl, target: "_blank", rel: "noopener noreferrer", children: "Terms" }), config.branding.termsUrl && config.branding.privacyUrl && jsx("span", { children: "\u2022" }), config.branding.privacyUrl && jsx("a", { href: config.branding.privacyUrl, target: "_blank", rel: "noopener noreferrer", children: "Privacy" })] }))] }) }));
+    // Logo URL logic:
+    // - undefined/not set: use default Smartlinks logo
+    // - null or empty string: hide logo completely
+    // - string URL: use custom logo
+    const logoUrl = config?.branding?.logoUrl === undefined
+        ? '/smartlinks-logo.png' // Default
+        : config?.branding?.logoUrl || null; // Custom or explicitly hidden
+    const containerClass = minimal
+        ? `auth-minimal auth-theme-${theme} ${className}`
+        : `auth-container auth-theme-${theme} ${className}`;
+    const cardClass = minimal ? 'auth-minimal-card' : 'auth-card';
+    return (jsx("div", { className: containerClass, children: jsxs("div", { className: cardClass, style: !minimal && config?.branding?.buttonStyle === 'square' ? { borderRadius: '4px' } : undefined, children: [(logoUrl || title || subtitle) && (jsxs("div", { className: "auth-header", children: [logoUrl && (jsx("div", { className: "auth-logo", children: jsx("img", { src: logoUrl, alt: "Logo", style: { maxWidth: '200px', height: 'auto', objectFit: 'contain' } }) })), title && jsx("h1", { className: "auth-title", children: title }), subtitle && jsx("p", { className: "auth-subtitle", children: subtitle })] })), jsx("div", { className: "auth-content", children: children }), (config?.branding?.termsUrl || config?.branding?.privacyUrl) && (jsxs("div", { className: "auth-footer", children: [config.branding.termsUrl && jsx("a", { href: config.branding.termsUrl, target: "_blank", rel: "noopener noreferrer", children: "Terms" }), config.branding.termsUrl && config.branding.privacyUrl && jsx("span", { children: "\u2022" }), config.branding.privacyUrl && jsx("a", { href: config.branding.privacyUrl, target: "_blank", rel: "noopener noreferrer", children: "Privacy" })] }))] }) }));
 };
 
-const EmailAuthForm = ({ mode, onSubmit, onModeSwitch, onForgotPassword, loading, error, }) => {
+const EmailAuthForm = ({ mode, onSubmit, onModeSwitch, onForgotPassword, loading, error, additionalFields = [], }) => {
     const [formData, setFormData] = useState({
         email: '',
         password: '',
@@ -61,7 +71,7 @@ const EmailAuthForm = ({ mode, onSubmit, onModeSwitch, onForgotPassword, loading
     };
     return (jsxs("form", { className: "auth-form", onSubmit: handleSubmit, children: [jsxs("div", { className: "auth-form-header", children: [jsx("h2", { className: "auth-form-title", children: mode === 'login' ? 'Sign in' : 'Create account' }), jsx("p", { className: "auth-form-subtitle", children: mode === 'login'
                             ? 'Welcome back! Please enter your credentials.'
-                            : 'Get started by creating your account.' })] }), error && (jsxs("div", { className: "auth-error", role: "alert", children: [jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: jsx("path", { d: "M8 0C3.58 0 0 3.58 0 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm1 13H7v-2h2v2zm0-3H7V4h2v6z" }) }), error] })), mode === 'register' && (jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "displayName", className: "auth-label", children: "Full Name" }), jsx("input", { type: "text", id: "displayName", className: "auth-input", value: formData.displayName || '', onChange: (e) => handleChange('displayName', e.target.value), required: mode === 'register', disabled: loading, placeholder: "John Doe" })] })), jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "email", className: "auth-label", children: "Email address" }), jsx("input", { type: "email", id: "email", className: "auth-input", value: formData.email || '', onChange: (e) => handleChange('email', e.target.value), required: true, disabled: loading, placeholder: "you@example.com", autoComplete: "email" })] }), jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "password", className: "auth-label", children: "Password" }), jsx("input", { type: "password", id: "password", className: "auth-input", value: formData.password || '', onChange: (e) => handleChange('password', e.target.value), required: true, disabled: loading, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022", autoComplete: mode === 'login' ? 'current-password' : 'new-password', minLength: 6 })] }), mode === 'login' && (jsx("div", { className: "auth-form-footer", children: jsx("button", { type: "button", className: "auth-link", onClick: onForgotPassword, disabled: loading, children: "Forgot password?" }) })), jsx("button", { type: "submit", className: "auth-button auth-button-primary", disabled: loading, children: loading ? (jsx("span", { className: "auth-spinner" })) : mode === 'login' ? ('Sign in') : ('Create account') }), jsxs("div", { className: "auth-divider", children: [jsx("span", { children: mode === 'login' ? "Don't have an account?" : 'Already have an account?' }), jsx("button", { type: "button", className: "auth-link auth-link-bold", onClick: onModeSwitch, disabled: loading, children: mode === 'login' ? 'Sign up' : 'Sign in' })] })] }));
+                            : 'Get started by creating your account.' })] }), error && (jsxs("div", { className: "auth-error", role: "alert", children: [jsx("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "currentColor", children: jsx("path", { d: "M8 0C3.58 0 0 3.58 0 8s3.58 8 8 8 8-3.58 8-8-3.58-8-8-8zm1 13H7v-2h2v2zm0-3H7V4h2v6z" }) }), error] })), mode === 'register' && (jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "displayName", className: "auth-label", children: "Full Name" }), jsx("input", { type: "text", id: "displayName", className: "auth-input", value: formData.displayName || '', onChange: (e) => handleChange('displayName', e.target.value), required: mode === 'register', disabled: loading, placeholder: "John Doe" })] })), jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "email", className: "auth-label", children: "Email address" }), jsx("input", { type: "email", id: "email", className: "auth-input", value: formData.email || '', onChange: (e) => handleChange('email', e.target.value), required: true, disabled: loading, placeholder: "you@example.com", autoComplete: "email" })] }), jsxs("div", { className: "auth-form-group", children: [jsx("label", { htmlFor: "password", className: "auth-label", children: "Password" }), jsx("input", { type: "password", id: "password", className: "auth-input", value: formData.password || '', onChange: (e) => handleChange('password', e.target.value), required: true, disabled: loading, placeholder: "\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022", autoComplete: mode === 'login' ? 'current-password' : 'new-password', minLength: 6 })] }), mode === 'register' && additionalFields.map((field) => (jsxs("div", { className: "auth-form-group", children: [jsxs("label", { htmlFor: field.name, className: "auth-label", children: [field.label, field.required && jsx("span", { style: { color: 'var(--auth-error-color, #ef4444)' }, children: " *" })] }), field.type === 'select' ? (jsxs("select", { id: field.name, className: "auth-input", value: formData[field.name] || '', onChange: (e) => handleChange(field.name, e.target.value), required: field.required, disabled: loading, children: [jsx("option", { value: "", children: "Select..." }), field.options?.map((option) => (jsx("option", { value: option, children: option }, option)))] })) : field.type === 'textarea' ? (jsx("textarea", { id: field.name, className: "auth-input", value: formData[field.name] || '', onChange: (e) => handleChange(field.name, e.target.value), required: field.required, disabled: loading, placeholder: field.placeholder, rows: 3, style: { minHeight: '80px', resize: 'vertical' } })) : (jsx("input", { type: field.type, id: field.name, className: "auth-input", value: formData[field.name] || '', onChange: (e) => handleChange(field.name, e.target.value), required: field.required, disabled: loading, placeholder: field.placeholder }))] }, field.name))), mode === 'login' && (jsx("div", { className: "auth-form-footer", children: jsx("button", { type: "button", className: "auth-link", onClick: onForgotPassword, disabled: loading, children: "Forgot password?" }) })), jsx("button", { type: "submit", className: "auth-button auth-button-primary", disabled: loading, children: loading ? (jsx("span", { className: "auth-spinner" })) : mode === 'login' ? ('Sign in') : ('Create account') }), jsxs("div", { className: "auth-divider", children: [jsx("span", { children: mode === 'login' ? "Don't have an account?" : 'Already have an account?' }), jsx("button", { type: "button", className: "auth-link auth-link-bold", onClick: onModeSwitch, disabled: loading, children: mode === 'login' ? 'Sign up' : 'Sign in' })] })] }));
 };
 
 const ProviderButtons = ({ enabledProviders, providerOrder, onEmailLogin, onGoogleLogin, onPhoneLogin, onMagicLinkLogin, loading, }) => {
@@ -10672,142 +10682,724 @@ class AuthAPI {
     }
 }
 
-const TOKEN_KEY = 'smartlinks_auth_token';
-const USER_KEY = 'smartlinks_auth_user';
-const ACCOUNT_DATA_KEY = 'smartlinks_account_data';
+/**
+ * Persistent Storage Layer for Smartlinks Auth
+ *
+ * Implements a tiered persistence strategy similar to Firebase Auth:
+ * 1. Primary: IndexedDB (async, large capacity, cross-tab)
+ * 2. Fallback: localStorage (sync, universal support)
+ *
+ * Provides unified async API for all storage operations with automatic
+ * fallback handling and cross-tab synchronization.
+ */
+const DB_NAME = 'smartlinks_auth_db';
+const DB_VERSION = 1;
+const STORE_NAME = 'auth_state';
+const STORAGE_CHANNEL = 'smartlinks_auth_storage';
+/**
+ * IndexedDB Storage Implementation
+ */
+class IndexedDBStorage {
+    constructor() {
+        this.db = null;
+        this.initPromise = null;
+        this.channel = null;
+        this.initPromise = this.initialize();
+        // Set up BroadcastChannel for cross-tab communication
+        if (typeof BroadcastChannel !== 'undefined') {
+            this.channel = new BroadcastChannel(STORAGE_CHANNEL);
+        }
+    }
+    async initialize() {
+        return new Promise((resolve, reject) => {
+            const request = indexedDB.open(DB_NAME, DB_VERSION);
+            request.onerror = () => {
+                console.warn('IndexedDB initialization failed:', request.error);
+                reject(request.error);
+            };
+            request.onsuccess = () => {
+                this.db = request.result;
+                resolve();
+            };
+            request.onupgradeneeded = (event) => {
+                const db = event.target.result;
+                // Create object store if it doesn't exist
+                if (!db.objectStoreNames.contains(STORE_NAME)) {
+                    db.createObjectStore(STORE_NAME);
+                }
+            };
+        });
+    }
+    async ensureInitialized() {
+        if (this.initPromise) {
+            await this.initPromise;
+        }
+    }
+    broadcastChange(event) {
+        if (this.channel) {
+            try {
+                this.channel.postMessage(event);
+            }
+            catch (error) {
+                console.warn('Failed to broadcast storage change:', error);
+            }
+        }
+    }
+    async setItem(key, value) {
+        await this.ensureInitialized();
+        return new Promise((resolve, reject) => {
+            if (!this.db) {
+                reject(new Error('IndexedDB not initialized'));
+                return;
+            }
+            const transaction = this.db.transaction([STORE_NAME], 'readwrite');
+            const store = transaction.objectStore(STORE_NAME);
+            const request = store.put(value, key);
+            request.onsuccess = () => {
+                this.broadcastChange({
+                    type: 'set',
+                    key,
+                    value,
+                    timestamp: Date.now(),
+                });
+                resolve();
+            };
+            request.onerror = () => {
+                reject(request.error);
+            };
+        });
+    }
+    async getItem(key) {
+        await this.ensureInitialized();
+        return new Promise((resolve, reject) => {
+            if (!this.db) {
+                reject(new Error('IndexedDB not initialized'));
+                return;
+            }
+            const transaction = this.db.transaction([STORE_NAME], 'readonly');
+            const store = transaction.objectStore(STORE_NAME);
+            const request = store.get(key);
+            request.onsuccess = () => {
+                resolve(request.result !== undefined ? request.result : null);
+            };
+            request.onerror = () => {
+                reject(request.error);
+            };
+        });
+    }
+    async removeItem(key) {
+        await this.ensureInitialized();
+        return new Promise((resolve, reject) => {
+            if (!this.db) {
+                reject(new Error('IndexedDB not initialized'));
+                return;
+            }
+            const transaction = this.db.transaction([STORE_NAME], 'readwrite');
+            const store = transaction.objectStore(STORE_NAME);
+            const request = store.delete(key);
+            request.onsuccess = () => {
+                this.broadcastChange({
+                    type: 'remove',
+                    key,
+                    timestamp: Date.now(),
+                });
+                resolve();
+            };
+            request.onerror = () => {
+                reject(request.error);
+            };
+        });
+    }
+    async clear() {
+        await this.ensureInitialized();
+        return new Promise((resolve, reject) => {
+            if (!this.db) {
+                reject(new Error('IndexedDB not initialized'));
+                return;
+            }
+            const transaction = this.db.transaction([STORE_NAME], 'readwrite');
+            const store = transaction.objectStore(STORE_NAME);
+            const request = store.clear();
+            request.onsuccess = () => {
+                this.broadcastChange({
+                    type: 'clear',
+                    timestamp: Date.now(),
+                });
+                resolve();
+            };
+            request.onerror = () => {
+                reject(request.error);
+            };
+        });
+    }
+    async isAvailable() {
+        try {
+            await this.ensureInitialized();
+            return this.db !== null;
+        }
+        catch {
+            return false;
+        }
+    }
+    getBackend() {
+        return 'indexeddb';
+    }
+    destroy() {
+        if (this.db) {
+            this.db.close();
+            this.db = null;
+        }
+        if (this.channel) {
+            this.channel.close();
+            this.channel = null;
+        }
+    }
+}
+/**
+ * localStorage Storage Implementation (Fallback)
+ */
+class LocalStorageAdapter {
+    constructor() {
+        this.prefix = 'smartlinks_auth_';
+        this.channel = null;
+        // Set up BroadcastChannel for cross-tab communication
+        if (typeof BroadcastChannel !== 'undefined') {
+            this.channel = new BroadcastChannel(STORAGE_CHANNEL);
+        }
+    }
+    broadcastChange(event) {
+        if (this.channel) {
+            try {
+                this.channel.postMessage(event);
+            }
+            catch (error) {
+                console.warn('Failed to broadcast storage change:', error);
+            }
+        }
+    }
+    async setItem(key, value) {
+        try {
+            const serialized = JSON.stringify(value);
+            localStorage.setItem(this.prefix + key, serialized);
+            this.broadcastChange({
+                type: 'set',
+                key,
+                value,
+                timestamp: Date.now(),
+            });
+        }
+        catch (error) {
+            console.error('localStorage setItem failed:', error);
+            throw error;
+        }
+    }
+    async getItem(key) {
+        try {
+            const stored = localStorage.getItem(this.prefix + key);
+            if (!stored)
+                return null;
+            return JSON.parse(stored);
+        }
+        catch (error) {
+            console.error('localStorage getItem failed:', error);
+            return null;
+        }
+    }
+    async removeItem(key) {
+        try {
+            localStorage.removeItem(this.prefix + key);
+            this.broadcastChange({
+                type: 'remove',
+                key,
+                timestamp: Date.now(),
+            });
+        }
+        catch (error) {
+            console.error('localStorage removeItem failed:', error);
+            throw error;
+        }
+    }
+    async clear() {
+        try {
+            const keys = Object.keys(localStorage);
+            keys.forEach(key => {
+                if (key.startsWith(this.prefix)) {
+                    localStorage.removeItem(key);
+                }
+            });
+            this.broadcastChange({
+                type: 'clear',
+                timestamp: Date.now(),
+            });
+        }
+        catch (error) {
+            console.error('localStorage clear failed:', error);
+            throw error;
+        }
+    }
+    async isAvailable() {
+        try {
+            const testKey = '__smartlinks_test__';
+            localStorage.setItem(testKey, 'test');
+            localStorage.removeItem(testKey);
+            return true;
+        }
+        catch {
+            return false;
+        }
+    }
+    getBackend() {
+        return 'localstorage';
+    }
+    destroy() {
+        if (this.channel) {
+            this.channel.close();
+            this.channel = null;
+        }
+    }
+}
+/**
+ * In-Memory Storage Implementation (No Persistence)
+ */
+class InMemoryStorage {
+    constructor() {
+        this.storage = new Map();
+    }
+    async setItem(key, value) {
+        this.storage.set(key, value);
+    }
+    async getItem(key) {
+        return this.storage.has(key) ? this.storage.get(key) : null;
+    }
+    async removeItem(key) {
+        this.storage.delete(key);
+    }
+    async clear() {
+        this.storage.clear();
+    }
+    async isAvailable() {
+        return true;
+    }
+    getBackend() {
+        return 'none';
+    }
+    destroy() {
+        this.storage.clear();
+    }
+}
+/**
+ * Storage Factory - Creates appropriate storage backend with automatic fallback
+ */
+class StorageFactory {
+    static async createStorage() {
+        if (this.instance) {
+            return this.instance;
+        }
+        // Try IndexedDB first
+        try {
+            const indexedDB = new IndexedDBStorage();
+            const available = await indexedDB.isAvailable();
+            if (available) {
+                console.log('[PersistentStorage] Using IndexedDB backend');
+                this.instance = indexedDB;
+                return indexedDB;
+            }
+            indexedDB.destroy();
+        }
+        catch (error) {
+            console.warn('[PersistentStorage] IndexedDB failed:', error);
+        }
+        // Fallback to localStorage
+        try {
+            const localStorage = new LocalStorageAdapter();
+            const available = await localStorage.isAvailable();
+            if (available) {
+                console.log('[PersistentStorage] Using localStorage backend (fallback)');
+                this.instance = localStorage;
+                return localStorage;
+            }
+            localStorage.destroy();
+        }
+        catch (error) {
+            console.warn('[PersistentStorage] localStorage failed:', error);
+        }
+        // Final fallback to in-memory (no persistence)
+        console.warn('[PersistentStorage] Using in-memory storage (no persistence)');
+        this.instance = new InMemoryStorage();
+        return this.instance;
+    }
+    static getInstance() {
+        return this.instance;
+    }
+    static reset() {
+        if (this.instance && 'destroy' in this.instance) {
+            this.instance.destroy();
+        }
+        this.instance = null;
+    }
+}
+StorageFactory.instance = null;
+/**
+ * Main storage export - creates singleton storage instance
+ */
+let storageInstance = null;
+let storageInitPromise = null;
+async function getStorage() {
+    if (storageInstance) {
+        return storageInstance;
+    }
+    if (!storageInitPromise) {
+        storageInitPromise = StorageFactory.createStorage();
+    }
+    storageInstance = await storageInitPromise;
+    return storageInstance;
+}
+/**
+ * Listen for storage changes from other tabs
+ */
+function onStorageChange(callback) {
+    if (typeof BroadcastChannel === 'undefined') {
+        console.warn('BroadcastChannel not supported, cross-tab sync disabled');
+        return () => { };
+    }
+    const channel = new BroadcastChannel(STORAGE_CHANNEL);
+    channel.onmessage = (event) => {
+        callback(event.data);
+    };
+    return () => {
+        channel.close();
+    };
+}
+
+const TOKEN_KEY = 'token';
+const USER_KEY = 'user';
+const ACCOUNT_DATA_KEY = 'account_data';
+const ACCOUNT_INFO_KEY = 'account_info';
+const ACCOUNT_INFO_TTL = 5 * 60 * 1000; // 5 minutes default
+/**
+ * Token Storage Layer
+ *
+ * Manages authentication tokens, user data, and account data using
+ * the persistent storage layer (IndexedDB + localStorage fallback).
+ * All methods are async to support IndexedDB operations.
+ */
 const tokenStorage = {
-    saveToken(token, expiresAt) {
+    async saveToken(token, expiresAt) {
+        const storage = await getStorage();
         const authToken = {
             token,
             expiresAt: expiresAt || Date.now() + 3600000, // Default 1 hour
         };
-        localStorage.setItem(TOKEN_KEY, JSON.stringify(authToken));
+        await storage.setItem(TOKEN_KEY, authToken);
     },
-    getToken() {
-        const stored = localStorage.getItem(TOKEN_KEY);
-        if (!stored)
+    async getToken() {
+        const storage = await getStorage();
+        const authToken = await storage.getItem(TOKEN_KEY);
+        if (!authToken)
             return null;
-        try {
-            const authToken = JSON.parse(stored);
-            // Check if token is expired
-            if (authToken.expiresAt && authToken.expiresAt < Date.now()) {
-                this.clearToken();
-                return null;
-            }
-            return authToken;
-        }
-        catch {
+        // Check if token is expired
+        if (authToken.expiresAt && authToken.expiresAt < Date.now()) {
+            await this.clearToken();
             return null;
         }
+        return authToken;
     },
-    clearToken() {
-        localStorage.removeItem(TOKEN_KEY);
+    async clearToken() {
+        const storage = await getStorage();
+        await storage.removeItem(TOKEN_KEY);
     },
-    saveUser(user) {
-        localStorage.setItem(USER_KEY, JSON.stringify(user));
+    async saveUser(user) {
+        const storage = await getStorage();
+        await storage.setItem(USER_KEY, user);
     },
-    getUser() {
-        const stored = localStorage.getItem(USER_KEY);
-        if (!stored)
-            return null;
-        try {
-            return JSON.parse(stored);
-        }
-        catch {
-            return null;
-        }
+    async getUser() {
+        const storage = await getStorage();
+        return await storage.getItem(USER_KEY);
     },
-    clearUser() {
-        localStorage.removeItem(USER_KEY);
+    async clearUser() {
+        const storage = await getStorage();
+        await storage.removeItem(USER_KEY);
     },
-    clearAll() {
-        this.clearToken();
-        this.clearUser();
-        this.clearAccountData();
+    async clearAll() {
+        await this.clearToken();
+        await this.clearUser();
+        await this.clearAccountData();
+        await this.clearAccountInfo();
     },
-    saveAccountData(data) {
-        localStorage.setItem(ACCOUNT_DATA_KEY, JSON.stringify(data));
+    async saveAccountData(data) {
+        const storage = await getStorage();
+        await storage.setItem(ACCOUNT_DATA_KEY, data);
     },
-    getAccountData() {
-        const stored = localStorage.getItem(ACCOUNT_DATA_KEY);
-        if (!stored)
-            return null;
-        try {
-            return JSON.parse(stored);
-        }
-        catch {
+    async getAccountData() {
+        const storage = await getStorage();
+        return await storage.getItem(ACCOUNT_DATA_KEY);
+    },
+    async clearAccountData() {
+        const storage = await getStorage();
+        await storage.removeItem(ACCOUNT_DATA_KEY);
+    },
+    async saveAccountInfo(accountInfo, ttl = ACCOUNT_INFO_TTL) {
+        const storage = await getStorage();
+        const cachedData = {
+            data: accountInfo,
+            cachedAt: Date.now(),
+            expiresAt: Date.now() + ttl,
+        };
+        await storage.setItem(ACCOUNT_INFO_KEY, cachedData);
+    },
+    async getAccountInfo() {
+        const storage = await getStorage();
+        const cached = await storage.getItem(ACCOUNT_INFO_KEY);
+        if (!cached)
             return null;
-        }
+        const isStale = cached.expiresAt < Date.now();
+        return {
+            data: cached.data,
+            isStale,
+        };
     },
-    clearAccountData() {
-        localStorage.removeItem(ACCOUNT_DATA_KEY);
+    async clearAccountInfo() {
+        const storage = await getStorage();
+        await storage.removeItem(ACCOUNT_INFO_KEY);
     },
 };
 
 const AuthContext = createContext(undefined);
-const AuthProvider = ({ children }) => {
+const AuthProvider = ({ children, accountCacheTTL = 5 * 60 * 1000, preloadAccountInfo = false }) => {
     const [user, setUser] = useState(null);
     const [token, setToken] = useState(null);
     const [accountData, setAccountData] = useState(null);
+    const [accountInfo, setAccountInfo] = useState(null);
     const [isLoading, setIsLoading] = useState(true);
-    // Initialize auth state from localStorage
+    const callbacksRef = useRef(new Set());
+    // Notify all subscribers of auth state changes
+    const notifyAuthStateChange = useCallback((type, currentUser, currentToken, currentAccountData, currentAccountInfo) => {
+        callbacksRef.current.forEach(callback => {
+            try {
+                callback({
+                    type,
+                    user: currentUser,
+                    token: currentToken,
+                    accountData: currentAccountData,
+                    accountInfo: currentAccountInfo
+                });
+            }
+            catch (error) {
+                console.error('[AuthContext] Error in auth state change callback:', error);
+            }
+        });
+    }, []);
+    // Initialize auth state from persistent storage
+    useEffect(() => {
+        const initializeAuth = async () => {
+            try {
+                const storedToken = await tokenStorage.getToken();
+                const storedUser = await tokenStorage.getUser();
+                const storedAccountData = await tokenStorage.getAccountData();
+                if (storedToken && storedUser) {
+                    setToken(storedToken.token);
+                    setUser(storedUser);
+                    setAccountData(storedAccountData);
+                    // Set bearer token in global Smartlinks SDK via auth.verifyToken
+                    smartlinks.auth.verifyToken(storedToken.token).catch(err => {
+                        console.warn('Failed to restore bearer token on init:', err);
+                    });
+                }
+                // Load cached account info if available
+                const cachedAccountInfo = await tokenStorage.getAccountInfo();
+                if (cachedAccountInfo && !cachedAccountInfo.isStale) {
+                    setAccountInfo(cachedAccountInfo.data);
+                }
+            }
+            catch (error) {
+                console.error('Failed to initialize auth from storage:', error);
+            }
+            finally {
+                setIsLoading(false);
+            }
+        };
+        initializeAuth();
+    }, []);
+    // Cross-tab synchronization - listen for auth changes in other tabs
     useEffect(() => {
-        const storedToken = tokenStorage.getToken();
-        const storedUser = tokenStorage.getUser();
-        const storedAccountData = tokenStorage.getAccountData();
-        if (storedToken && storedUser) {
-            setToken(storedToken.token);
-            setUser(storedUser);
-            setAccountData(storedAccountData);
+        console.log('[AuthContext] Setting up cross-tab synchronization');
+        const unsubscribe = onStorageChange(async (event) => {
+            console.log('[AuthContext] Cross-tab storage event:', event.type, event.key);
+            try {
+                if (event.type === 'clear') {
+                    // Another tab cleared all storage (logout)
+                    console.log('[AuthContext] Detected logout in another tab');
+                    setToken(null);
+                    setUser(null);
+                    setAccountData(null);
+                    setAccountInfo(null);
+                    smartlinks.auth.logout();
+                    notifyAuthStateChange('CROSS_TAB_SYNC', null, null, null);
+                }
+                else if (event.type === 'remove' && (event.key === 'token' || event.key === 'user')) {
+                    // Another tab removed token or user (logout)
+                    console.log('[AuthContext] Detected token/user removal in another tab');
+                    setToken(null);
+                    setUser(null);
+                    setAccountData(null);
+                    setAccountInfo(null);
+                    smartlinks.auth.logout();
+                    notifyAuthStateChange('CROSS_TAB_SYNC', null, null, null);
+                }
+                else if (event.type === 'set' && event.key === 'token') {
+                    // Another tab set a new token (login)
+                    console.log('[AuthContext] Detected login in another tab');
+                    const storedToken = await tokenStorage.getToken();
+                    const storedUser = await tokenStorage.getUser();
+                    const storedAccountData = await tokenStorage.getAccountData();
+                    if (storedToken && storedUser) {
+                        setToken(storedToken.token);
+                        setUser(storedUser);
+                        setAccountData(storedAccountData);
+                        // Set bearer token in global Smartlinks SDK
+                        smartlinks.auth.verifyToken(storedToken.token).catch(err => {
+                            console.warn('[AuthContext] Failed to restore bearer token from cross-tab sync:', err);
+                        });
+                        notifyAuthStateChange('CROSS_TAB_SYNC', storedUser, storedToken.token, storedAccountData);
+                    }
+                }
+                else if (event.type === 'set' && event.key === 'account_info') {
+                    // Another tab fetched fresh account info
+                    const cached = await tokenStorage.getAccountInfo();
+                    if (cached && !cached.isStale) {
+                        setAccountInfo(cached.data);
+                        console.log('[AuthContext] Account info synced from another tab');
+                    }
+                }
+            }
+            catch (error) {
+                console.error('[AuthContext] Error handling cross-tab sync:', error);
+            }
+        });
+        return () => {
+            console.log('[AuthContext] Cleaning up cross-tab synchronization');
+            unsubscribe();
+        };
+    }, [notifyAuthStateChange]);
+    const login = 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);
+            }
+            setToken(authToken);
+            setUser(authUser);
+            setAccountData(authAccountData || null);
             // Set bearer token in global Smartlinks SDK via auth.verifyToken
-            smartlinks.auth.verifyToken(storedToken.token).catch(err => {
-                console.warn('Failed to restore bearer token on init:', err);
+            // This both validates the token and sets it for future API calls
+            smartlinks.auth.verifyToken(authToken).catch(err => {
+                console.warn('Failed to set bearer token on login:', err);
             });
+            notifyAuthStateChange('LOGIN', authUser, authToken, authAccountData || null);
+            // Optionally preload account info on login
+            if (preloadAccountInfo) {
+                // Preload after login completes (non-blocking)
+                getAccount(true).catch(error => {
+                    console.warn('[AuthContext] Failed to preload account info:', error);
+                });
+            }
         }
-        setIsLoading(false);
-    }, []);
-    const login = useCallback((authToken, authUser, authAccountData) => {
-        // Store token, user, and account data
-        tokenStorage.saveToken(authToken);
-        tokenStorage.saveUser(authUser);
-        if (authAccountData) {
-            tokenStorage.saveAccountData(authAccountData);
-        }
-        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.auth.verifyToken(authToken).catch(err => {
-            console.warn('Failed to set bearer token on login:', err);
-        });
-    }, []);
+        catch (error) {
+            console.error('Failed to save auth data to storage:', error);
+            throw error;
+        }
+    }, [notifyAuthStateChange, preloadAccountInfo]);
     const logout = useCallback(async () => {
-        // Clear local storage
-        tokenStorage.clearAll();
-        setToken(null);
-        setUser(null);
-        setAccountData(null);
-        // Clear bearer token from global Smartlinks SDK
-        smartlinks.auth.logout();
-    }, []);
-    const getToken = useCallback(() => {
-        const storedToken = tokenStorage.getToken();
+        try {
+            // Clear persistent storage
+            await tokenStorage.clearAll();
+            setToken(null);
+            setUser(null);
+            setAccountData(null);
+            setAccountInfo(null);
+            // Clear bearer token from global Smartlinks SDK
+            smartlinks.auth.logout();
+            notifyAuthStateChange('LOGOUT', null, null, null);
+        }
+        catch (error) {
+            console.error('Failed to clear auth data from storage:', error);
+        }
+    }, [notifyAuthStateChange]);
+    const getToken = useCallback(async () => {
+        const storedToken = await tokenStorage.getToken();
         return storedToken ? storedToken.token : null;
     }, []);
     const refreshToken = useCallback(async () => {
         throw new Error('Token refresh must be implemented via your backend API');
     }, []);
+    // Get account with intelligent caching
+    const getAccount = useCallback(async (forceRefresh = false) => {
+        try {
+            // Check if user is authenticated
+            if (!token) {
+                throw new Error('Not authenticated. Please login first.');
+            }
+            // Check cache unless force refresh
+            if (!forceRefresh) {
+                const cached = await tokenStorage.getAccountInfo();
+                if (cached && !cached.isStale) {
+                    console.log('[AuthContext] Returning cached account info');
+                    return cached.data;
+                }
+            }
+            // Fetch fresh data from API
+            console.log('[AuthContext] Fetching fresh account info from API');
+            const freshAccountInfo = await smartlinks.auth.getAccount();
+            // Cache the fresh data
+            await tokenStorage.saveAccountInfo(freshAccountInfo, accountCacheTTL);
+            setAccountInfo(freshAccountInfo);
+            notifyAuthStateChange('ACCOUNT_REFRESH', user, token, accountData, freshAccountInfo);
+            return freshAccountInfo;
+        }
+        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;
+            }
+            throw error;
+        }
+    }, [token, accountCacheTTL, user, accountData, notifyAuthStateChange]);
+    // Convenience method for explicit refresh
+    const refreshAccount = useCallback(async () => {
+        return await getAccount(true);
+    }, [getAccount]);
+    // Clear account cache
+    const clearAccountCache = useCallback(async () => {
+        await tokenStorage.clearAccountInfo();
+        setAccountInfo(null);
+    }, []);
+    const onAuthStateChange = useCallback((callback) => {
+        callbacksRef.current.add(callback);
+        // Return unsubscribe function
+        return () => {
+            callbacksRef.current.delete(callback);
+        };
+    }, []);
     const value = {
         user,
         token,
         accountData,
+        accountInfo,
         isAuthenticated: !!token && !!user,
         isLoading,
         login,
         logout,
         getToken,
         refreshToken,
+        getAccount,
+        refreshAccount,
+        clearAccountCache,
+        onAuthStateChange,
     };
     return jsx(AuthContext.Provider, { value: value, children: children });
 };
@@ -10819,7 +11411,7 @@ const useAuth = () => {
     return context;
 };
 
-const AccountManagement = ({ apiEndpoint, clientId, onProfileUpdated, onEmailChangeRequested, onPasswordChanged, onAccountDeleted, onError, theme = 'light', className = '', customization = {}, }) => {
+const AccountManagement = ({ apiEndpoint, clientId, onProfileUpdated, onEmailChangeRequested, onPasswordChanged, onAccountDeleted, onError, theme = 'light', className = '', customization = {}, minimal = false, }) => {
     const auth = useAuth();
     const [loading, setLoading] = useState(false);
     const [profile, setProfile] = useState(null);
@@ -11102,6 +11694,99 @@ const AccountManagement = ({ apiEndpoint, clientId, onProfileUpdated, onEmailCha
                                         }, className: "auth-button button-secondary", children: "Cancel" })] })] }))] }))] }));
 };
 
+const SmartlinksClaimUI = ({ apiEndpoint, clientId, clientName, collectionId, productId, proofId, onClaimSuccess, onClaimError, additionalFields = [], theme = 'light', className = '', minimal = false, customization = {}, }) => {
+    const auth = useAuth();
+    const [claimStep, setClaimStep] = useState(auth.isAuthenticated ? 'questions' : 'auth');
+    const [claimData, setClaimData] = useState({});
+    const [error, setError] = useState();
+    const [loading, setLoading] = useState(false);
+    const handleAuthSuccess = (token, user, accountData) => {
+        // Authentication successful
+        auth.login(token, user, accountData);
+        // If no additional questions, proceed directly to claim
+        if (additionalFields.length === 0) {
+            executeClaim(user);
+        }
+        else {
+            setClaimStep('questions');
+        }
+    };
+    const handleQuestionSubmit = async (e) => {
+        e.preventDefault();
+        // Validate required fields
+        const missingFields = additionalFields
+            .filter(field => field.required && !claimData[field.name])
+            .map(field => field.label);
+        if (missingFields.length > 0) {
+            setError(`Please fill in: ${missingFields.join(', ')}`);
+            return;
+        }
+        // Execute claim with collected data
+        if (auth.user) {
+            executeClaim(auth.user);
+        }
+    };
+    const executeClaim = async (user) => {
+        setClaimStep('claiming');
+        setLoading(true);
+        setError(undefined);
+        try {
+            // Create attestation to claim the proof
+            const response = await smartlinks.attestation.create(collectionId, productId, proofId, {
+                public: {
+                    claimed: true,
+                    claimedAt: new Date().toISOString(),
+                    claimedBy: user.uid,
+                    ...claimData,
+                },
+                private: {},
+                proof: {},
+            });
+            setClaimStep('success');
+            // Call success callback
+            onClaimSuccess({
+                proofId,
+                user,
+                claimData,
+                attestationId: response.id,
+            });
+        }
+        catch (err) {
+            console.error('Claim error:', err);
+            const errorMessage = err instanceof Error ? err.message : 'Failed to claim proof';
+            setError(errorMessage);
+            onClaimError?.(err instanceof Error ? err : new Error(errorMessage));
+            setClaimStep(additionalFields.length > 0 ? 'questions' : 'auth');
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    const handleFieldChange = (fieldName, value) => {
+        setClaimData(prev => ({
+            ...prev,
+            [fieldName]: value,
+        }));
+    };
+    // Render authentication step
+    if (claimStep === 'auth') {
+        return (jsx("div", { className: className, children: jsx(SmartlinksAuthUI, { apiEndpoint: apiEndpoint, clientId: clientId, clientName: clientName, onAuthSuccess: handleAuthSuccess, onAuthError: onClaimError, theme: theme, minimal: minimal, customization: customization.authConfig }) }));
+    }
+    // Render additional questions step
+    if (claimStep === 'questions') {
+        return (jsxs("div", { className: `claim-questions ${className}`, children: [jsxs("div", { className: "claim-header mb-6", children: [jsx("h2", { className: "text-2xl font-bold mb-2", children: customization.claimTitle || 'Complete Your Claim' }), customization.claimDescription && (jsx("p", { className: "text-muted-foreground", children: customization.claimDescription }))] }), error && (jsx("div", { className: "claim-error bg-destructive/10 text-destructive px-4 py-3 rounded-md mb-4", children: error })), jsxs("form", { onSubmit: handleQuestionSubmit, className: "claim-form space-y-4", children: [additionalFields.map((field) => (jsxs("div", { className: "claim-field", children: [jsxs("label", { htmlFor: field.name, className: "block text-sm font-medium mb-2", children: [field.label, field.required && jsx("span", { className: "text-destructive ml-1", children: "*" })] }), field.type === 'textarea' ? (jsx("textarea", { id: field.name, name: field.name, placeholder: field.placeholder, value: claimData[field.name] || '', onChange: (e) => handleFieldChange(field.name, e.target.value), required: field.required, className: "w-full px-3 py-2 border border-input rounded-md bg-background", rows: 4 })) : field.type === 'select' ? (jsxs("select", { id: field.name, name: field.name, value: claimData[field.name] || '', onChange: (e) => handleFieldChange(field.name, e.target.value), required: field.required, className: "w-full px-3 py-2 border border-input rounded-md bg-background", children: [jsx("option", { value: "", children: "Select..." }), field.options?.map((option) => (jsx("option", { value: option, children: option }, option)))] })) : (jsx("input", { id: field.name, name: field.name, type: field.type, placeholder: field.placeholder, value: claimData[field.name] || '', onChange: (e) => handleFieldChange(field.name, e.target.value), required: field.required, className: "w-full px-3 py-2 border border-input rounded-md bg-background" }))] }, field.name))), jsx("button", { type: "submit", disabled: loading, className: "claim-submit-button w-full bg-primary text-primary-foreground px-4 py-2 rounded-md font-medium hover:bg-primary/90 disabled:opacity-50 disabled:cursor-not-allowed", children: loading ? 'Claiming...' : 'Submit Claim' })] })] }));
+    }
+    // Render claiming step (loading state)
+    if (claimStep === 'claiming') {
+        return (jsxs("div", { className: `claim-loading ${className} flex flex-col items-center justify-center py-12`, children: [jsx("div", { className: "claim-spinner w-12 h-12 border-4 border-primary border-t-transparent rounded-full animate-spin mb-4" }), jsx("p", { className: "text-muted-foreground", children: "Claiming your product..." })] }));
+    }
+    // Render success step
+    if (claimStep === 'success') {
+        return (jsxs("div", { className: `claim-success ${className} text-center py-12`, children: [jsx("div", { className: "claim-success-icon w-16 h-16 bg-green-500 text-white rounded-full flex items-center justify-center text-3xl font-bold mx-auto mb-4", children: "\u2713" }), jsx("h2", { className: "text-2xl font-bold mb-2", children: "Claim Successful!" }), jsx("p", { className: "text-muted-foreground", children: customization.successMessage || 'Your product has been successfully claimed and registered to your account.' })] }));
+    }
+    return null;
+};
+
 const ProtectedRoute = ({ children, fallback, redirectTo, }) => {
     const { isAuthenticated, isLoading } = useAuth();
     // Show loading state
@@ -11120,7 +11805,7 @@ const ProtectedRoute = ({ children, fallback, redirectTo, }) => {
     return jsx(Fragment, { children: children });
 };
 
-const AuthUIPreview = ({ customization, enabledProviders = ['email', 'google', 'phone'], providerOrder, emailDisplayMode = 'form', theme = 'light', className, }) => {
+const AuthUIPreview = ({ customization, enabledProviders = ['email', 'google', 'phone'], providerOrder, emailDisplayMode = 'form', theme = 'light', className, minimal = false, }) => {
     const showEmail = enabledProviders.includes('email');
     const showGoogle = enabledProviders.includes('google');
     const showPhone = enabledProviders.includes('phone');
@@ -11146,14 +11831,14 @@ const AuthUIPreview = ({ customization, enabledProviders = ['email', 'google', '
         }
         return null;
     };
-    return (jsx(AuthContainer, { theme: theme, className: className, config: customization, children: emailDisplayMode === 'button' ? (jsx("div", { className: "auth-provider-buttons", children: orderedProviders.concat(showEmail ? ['email'] : []).map(provider => renderProviderButton(provider)) })) : (
+    return (jsx(AuthContainer, { theme: theme, className: className, config: customization, minimal: minimal, children: emailDisplayMode === 'button' ? (jsx("div", { className: "auth-provider-buttons", children: orderedProviders.concat(showEmail ? ['email'] : []).map(provider => renderProviderButton(provider)) })) : (
         /* Form mode: show email form first, then other providers */
         jsxs(Fragment, { children: [showEmail && (jsxs("div", { className: "auth-form", children: [jsxs("div", { className: "auth-form-group", children: [jsx("label", { className: "auth-label", children: "Email" }), jsx("input", { type: "email", className: "auth-input", placeholder: "Enter your email", disabled: true })] }), jsxs("div", { className: "auth-form-group", children: [jsx("label", { className: "auth-label", children: "Password" }), jsx("input", { type: "password", className: "auth-input", placeholder: "Enter your password", disabled: true })] }), jsx("button", { className: "auth-button auth-button-primary", disabled: true, children: "Sign In" }), jsx("div", { style: { textAlign: 'center', marginTop: '1rem' }, children: jsx("button", { className: "auth-link", disabled: true, children: "Forgot password?" }) }), jsxs("div", { style: { textAlign: 'center', marginTop: '0.5rem', fontSize: '0.875rem', color: 'var(--auth-text-muted, #6B7280)' }, children: ["Don't have an account?", ' ', jsx("button", { className: "auth-link", disabled: true, children: "Sign up" })] })] })), hasOtherProviders && (jsxs(Fragment, { children: [showEmail && (jsx("div", { className: "auth-or-divider", children: jsx("span", { children: "or continue with" }) })), jsx("div", { className: "auth-provider-buttons", children: orderedProviders.map(provider => renderProviderButton(provider)) })] }))] })) }));
 };
 
 // Default Smartlinks Google OAuth Client ID (public - safe to expose)
 const DEFAULT_GOOGLE_CLIENT_ID = '696509063554-jdlbjl8vsjt7cr0vgkjkjf3ffnvi3a70.apps.googleusercontent.com';
-const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAuthSuccess, onAuthError, enabledProviders = ['email', 'google', 'phone'], initialMode = 'login', redirectUrl, theme = 'light', className, customization, skipConfigFetch = false, }) => {
+const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAuthSuccess, onAuthError, enabledProviders = ['email', 'google', 'phone'], initialMode = 'login', redirectUrl, theme = 'light', className, customization, skipConfigFetch = false, minimal = false, }) => {
     const [mode, setMode] = useState(initialMode);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState();
@@ -11173,21 +11858,24 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
     // Reinitialize Smartlinks SDK when apiEndpoint changes (for test/dev scenarios)
     // IMPORTANT: Preserve bearer token during reinitialization
     useEffect(() => {
-        if (apiEndpoint) {
-            // Get current token before reinitializing
-            const currentToken = auth.getToken();
-            smartlinks.initializeApi({
-                baseURL: apiEndpoint,
-                proxyMode: false, // Direct API calls when custom endpoint is provided
-                ngrokSkipBrowserWarning: true,
-            });
-            // 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);
+        const reinitializeWithToken = async () => {
+            if (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,
                 });
+                // 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);
+                    });
+                }
             }
-        }
+        };
+        reinitializeWithToken();
     }, [apiEndpoint, auth]);
     // Get the effective redirect URL (use prop or default to current page)
     const getRedirectUrl = () => {
@@ -11697,9 +12385,9 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
         }
     };
     if (configLoading) {
-        return (jsx(AuthContainer, { theme: theme, className: className, children: jsx("div", { style: { textAlign: 'center', padding: '2rem' }, children: jsx("div", { className: "auth-spinner" }) }) }));
+        return (jsx(AuthContainer, { theme: theme, className: className, minimal: minimal || config?.branding?.minimal || false, children: jsx("div", { style: { textAlign: 'center', padding: '2rem' }, children: jsx("div", { className: "auth-spinner" }) }) }));
     }
-    return (jsx(AuthContainer, { theme: theme, className: className, config: config, children: authSuccess ? (jsxs("div", { style: { textAlign: 'center', padding: '2rem' }, children: [jsx("div", { style: {
+    return (jsx(AuthContainer, { theme: theme, className: className, config: config, minimal: minimal || config?.branding?.minimal || false, children: authSuccess ? (jsxs("div", { style: { textAlign: 'center', padding: '2rem' }, children: [jsx("div", { style: {
                         color: 'var(--auth-primary-color, #4F46E5)',
                         fontSize: '3rem',
                         marginBottom: '1rem'
@@ -11807,9 +12495,9 @@ const SmartlinksAuthUI = ({ apiEndpoint, clientId, clientName, accountData, onAu
                                     setShowResendVerification(false);
                                     setShowRequestNewReset(false);
                                     setError(undefined);
-                                }, onForgotPassword: () => setMode('reset-password'), loading: loading, error: error }), emailDisplayMode === 'form' && actualProviders.length > 1 && (jsx(ProviderButtons, { enabledProviders: actualProviders.filter((p) => p !== 'email'), providerOrder: providerOrder, onGoogleLogin: handleGoogleLogin, onPhoneLogin: () => setMode('phone'), onMagicLinkLogin: () => setMode('magic-link'), loading: loading }))] }));
+                                }, onForgotPassword: () => setMode('reset-password'), loading: loading, error: error, additionalFields: config?.signupAdditionalFields }), emailDisplayMode === 'form' && actualProviders.length > 1 && (jsx(ProviderButtons, { enabledProviders: actualProviders.filter((p) => p !== 'email'), providerOrder: providerOrder, onGoogleLogin: handleGoogleLogin, onPhoneLogin: () => setMode('phone'), onMagicLinkLogin: () => setMode('magic-link'), loading: loading }))] }));
                 })() })) })) : null }));
 };
 
-export { AccountManagement, AuthProvider, AuthUIPreview, SmartlinksAuthUI as FirebaseAuthUI, ProtectedRoute, SmartlinksAuthUI, tokenStorage, useAuth };
+export { AccountManagement, AuthProvider, AuthUIPreview, SmartlinksAuthUI as FirebaseAuthUI, ProtectedRoute, SmartlinksAuthUI, SmartlinksClaimUI, tokenStorage, useAuth };
 //# sourceMappingURL=index.esm.js.map