@openfort/react 0.0.4 → 0.0.6

package/build/index.es.js

@@ -1,13 +1,13 @@
-import { http, useConfig, useConnectors as useConnectors$1, useConnect as useConnect$1, useAccount, useDisconnect, useSwitchChain, createConfig, useEnsAddress, useEnsName, useEnsAvatar, useBalance, useChainId, WagmiContext, useBlockNumber } from 'wagmi';
+import { Openfort as Openfort$1, EmbeddedState, AuthActionRequiredActions, OAuthProvider, RecoveryMethod, MissingRecoveryPasswordError, AccountTypeEnum, ChainTypeEnum } from '@openfort/openfort-js';
+export { RecoveryMethod, ThirdPartyOAuthProvider } from '@openfort/openfort-js';
+import { http, useConfig, useConnectors as useConnectors$1, useConnect as useConnect$1, useAccount, useDisconnect, useChainId, useSwitchChain, createConfig, useEnsAddress, useEnsName, useEnsAvatar, useBalance, WagmiContext, useBlockNumber } from 'wagmi';
 import { mainnet, polygon, optimism, arbitrum, sepolia } from 'wagmi/chains';
 import { safe, injected, coinbaseWallet, walletConnect } from '@wagmi/connectors';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import React, { createContext, useEffect, useState, useMemo, useRef, useCallback, createElement, useLayoutEffect } from 'react';
+import React, { useEffect, createContext, useState, useMemo, useRef, useCallback, createElement, useLayoutEffect, useContext } from 'react';
 import { detect } from 'detect-browser';
 import { Buffer } from 'buffer';
-import { Openfort as Openfort$1, RecoveryMethod, EmbeddedState, AuthActionRequiredActions, OAuthProvider, ShieldAuthType, MissingRecoveryPasswordError, AccountTypeEnum, ChainTypeEnum } from '@openfort/openfort-js';
-export { RecoveryMethod } from '@openfort/openfort-js';
-import { polygonAmoy } from 'viem/chains';
+import { useQueryClient, useQuery } from '@tanstack/react-query';
 import { motion, AnimatePresence, MotionConfig } from 'framer-motion';
 import styled$1, { css, keyframes } from 'styled-components';
 import { createPortal } from 'react-dom';
@@ -20,14 +20,15 @@ import { normalize } from 'viem/ens';
 import { AxiosError } from 'axios';
 import { createSiweMessage } from 'viem/siwe';
 import { signMessage } from '@wagmi/core';
-import { useQuery, useQueryClient } from '@tanstack/react-query';
+import calculateEntropy from 'fast-password-entropy';
 
-const OPENFORT_VERSION = '0.0.4';
+const OPENFORT_VERSION = '0.0.6';
 
 var OpenfortErrorType;
 (function (OpenfortErrorType) {
     OpenfortErrorType["AUTHENTICATION_ERROR"] = "AUTHENTICATION_ERROR";
     OpenfortErrorType["WALLET_ERROR"] = "WALLET_ERROR";
+    OpenfortErrorType["CONFIGURATION_ERROR"] = "CONFIGURATION_ERROR";
 })(OpenfortErrorType || (OpenfortErrorType = {}));
 class OpenfortError extends Error {
     constructor(message, type, data) {
@@ -291,7 +292,6 @@ var Logos = {
 };
 
 const truncateRegex = /^(0x[a-zA-Z0-9]{4})[a-zA-Z0-9]+([a-zA-Z0-9]{4})$/;
-const playerRegex = /^(pla_[a-zA-Z0-9]{4})[a-zA-Z0-9-]+([a-zA-Z0-9]{4})$/;
 const truncateEthAddress = (address, separator = '••••') => {
     if (!address)
         return '';
@@ -300,14 +300,6 @@ const truncateEthAddress = (address, separator = '••••') => {
         return address;
     return `${match[1]}${separator}${match[2]}`;
 };
-const truncateUserId = (playerId, separator = '••••') => {
-    if (!playerId)
-        return '';
-    const match = playerId.match(playerRegex);
-    if (!match)
-        return playerId;
-    return `${match[1]}${separator}${match[2]}`;
-};
 const nFormatter = (num, digits = 2) => {
     if (num < 10000)
         return num.toFixed(2);
@@ -788,8 +780,6 @@ const socialProviders = [
     AuthProvider.FACEBOOK,
 ];
 
-const Openfortcontext = createContext(null);
-
 function useChainIsSupported(chainId) {
     const { chains } = useConfig();
     if (!chainId)
@@ -868,6 +858,8 @@ function useThemeFont(theme) {
     useGoogleFont(font !== null && font !== void 0 ? font : '');
 }
 
+const Openfortcontext = createContext(null);
+
 const useOpenfort = () => {
     const context = React.useContext(Openfortcontext);
     if (!context)
@@ -974,14 +966,8 @@ const useConnectCallback = ({ onConnect, onDisconnect, }) => {
  *
  * const token = await client.getAccessToken();
  */
-function createOpenfortClient({ baseConfiguration, overrides, shieldConfiguration, }) {
-    return new Openfort$1({
-        baseConfiguration,
-        overrides: {
-            ...overrides,
-        },
-        shieldConfiguration
-    });
+function createOpenfortClient(config) {
+    return new Openfort$1(config);
 }
 
 const ConnectCallback = ({ onConnect, onDisconnect }) => {
@@ -996,12 +982,11 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
     const { connectors, connect, reset } = useConnect();
     const { address } = useAccount();
     const [user, setUser] = useState(null);
-    const { disconnect } = useDisconnect();
+    const { disconnectAsync } = useDisconnect();
     const { walletConfig } = useOpenfort();
-    const automaticRecovery = walletConfig && walletConfig.recoveryMethod === RecoveryMethod.AUTOMATIC;
     // ---- Openfort instance ----
     const openfort = useMemo(() => {
-        log('Creating Openfort instance.');
+        log('Creating Openfort instance.', openfortProps);
         if (!openfortProps.baseConfiguration.publishableKey)
             throw Error('CoreOpenfortProvider requires a publishableKey to be set in the baseConfiguration.');
         const newClient = createOpenfortClient(openfortProps);
@@ -1054,6 +1039,7 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
         var _a, _b;
         if (!openfort)
             return null;
+        log("Updating user", { user, logoutOnError });
         if (user) {
             setUser(user);
             return user;
@@ -1079,21 +1065,27 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
             return null;
         }
     }, [openfort]);
+    const chainId = useChainId();
     useEffect(() => {
-        if (!openfort)
-            return;
-        if (!walletConfig)
+        if (!openfort || !walletConfig)
             return;
-        log("Getting ethereum provider");
-        openfort.embeddedWallet.getEthereumProvider(walletConfig.ethereumProviderPolicyId ?
-            {
-                policy: walletConfig.ethereumProviderPolicyId,
-                chains: {
-                    [polygonAmoy.id]: "https://rpc-amoy.polygon.technology",
-                }
+        log("Getting ethereum provider", chainId);
+        const resolvePolicy = () => {
+            const { ethereumProviderPolicyId } = walletConfig;
+            if (!ethereumProviderPolicyId)
+                return undefined;
+            if (typeof ethereumProviderPolicyId === "string") {
+                return { policy: ethereumProviderPolicyId };
             }
-            : undefined);
-    }, [openfort]);
+            const policy = ethereumProviderPolicyId[chainId];
+            if (!policy) {
+                log(`No policy found for chainId ${chainId}.`);
+                return undefined;
+            }
+            return { policy };
+        };
+        openfort.embeddedWallet.getEthereumProvider(resolvePolicy());
+    }, [openfort, walletConfig, chainId]);
     const [isConnectedWithEmbeddedSigner, setIsConnectedWithEmbeddedSigner] = useState(false);
     useEffect(() => {
         if (!openfort)
@@ -1113,16 +1105,25 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
                 setIsConnectedWithEmbeddedSigner(false);
                 break;
             case EmbeddedState.READY:
-                if (!user)
-                    updateUser(undefined, true);
-                // We cannot stop polling here because there is a bug on openfort-js
-                // that makes the embedded state to be stuck on CREATING_ACCOUNT
-                // stopPollingEmbeddedState();
+                (async () => {
+                    for (let i = 0; i < 5; i++) {
+                        log("Trying to update user...", i);
+                        try {
+                            const user = await updateUser(undefined, true);
+                            if (user)
+                                break;
+                        }
+                        catch (err) {
+                            console.error("Error updating user, retrying...", err);
+                        }
+                        await new Promise((resolve) => setTimeout(resolve, 250));
+                    }
+                })();
                 break;
             default:
                 throw new Error(`Unknown embedded state: ${embeddedState}`);
         }
-    }, [embeddedState, openfort, automaticRecovery]);
+    }, [embeddedState, openfort]);
     useEffect(() => {
         // Connect to wagmi with Embedded signer
         if (address || !user)
@@ -1139,13 +1140,15 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
         connect({ connector });
     }, [connectors, embeddedState, address, user]);
     // ---- Auth functions ----
-    const logout = useCallback(() => {
+    const queryClient = useQueryClient();
+    const logout = useCallback(async () => {
         if (!openfort)
             return;
-        log('Logging out...');
-        openfort.auth.logout();
         setUser(null);
-        disconnect();
+        log('Logging out...');
+        await openfort.auth.logout();
+        await disconnectAsync();
+        queryClient.resetQueries({ queryKey: ['openfortEmbeddedWalletList'] });
         reset();
         startPollingEmbeddedState();
     }, [openfort]);
@@ -1169,7 +1172,7 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
                 return true;
             case EmbeddedState.UNAUTHENTICATED:
                 if (user)
-                    return true; // If user is set in unauthenticated state, it means that the embedded state is not up to date, so we should wait
+                    return true; // If user i<s set in unauthenticated state, it means that the embedded state is not up to date, so we should wait
                 return false;
             case EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED:
                 if (!user)
@@ -1186,7 +1189,7 @@ const CoreOpenfortProvider = ({ children, debugMode, onConnect, onDisconnect, ..
                 return true;
         }
     }, [embeddedState, address, user]);
-    const needsRecovery = !automaticRecovery && (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) && (!address);
+    const needsRecovery = (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) && (!address);
     const value = {
         signUpGuest,
         embeddedState,
@@ -2848,7 +2851,7 @@ const InfoButton = styled(motion.button) `
     }
   }
 `;
-const Container$7 = styled(motion.div) `
+const Container$8 = styled(motion.div) `
   --ease: cubic-bezier(0.25, 0.1, 0.25, 1);
   --duration: 200ms;
   --transition: height var(--duration) var(--ease),
@@ -4916,7 +4919,7 @@ const Modal = ({ open, pages, pageId, positionInside, inline, demo, onClose, onB
     const Content = (jsx(ResetContainer, { "$useTheme": (_e = demo === null || demo === void 0 ? void 0 : demo.theme) !== null && _e !== void 0 ? _e : themeContext.theme, "$useMode": (_f = demo === null || demo === void 0 ? void 0 : demo.mode) !== null && _f !== void 0 ? _f : themeContext.mode, "$customTheme": (_g = demo === null || demo === void 0 ? void 0 : demo.customTheme) !== null && _g !== void 0 ? _g : themeContext.customTheme, children: jsxs(ModalContainer, { role: "dialog", style: {
                 pointerEvents: rendered ? 'auto' : 'none',
                 position: positionInside ? 'absolute' : undefined,
-            }, children: [!inline && (jsx(BackgroundOverlay, { "$active": rendered, onClick: onClose, "$blur": (_h = context.uiConfig) === null || _h === void 0 ? void 0 : _h.overlayBlur })), jsxs(Container$7, { style: dimensionsCSS, initial: false, children: [jsx("div", { style: {
+            }, children: [!inline && (jsx(BackgroundOverlay, { "$active": rendered, onClick: onClose, "$blur": (_h = context.uiConfig) === null || _h === void 0 ? void 0 : _h.overlayBlur })), jsxs(Container$8, { style: dimensionsCSS, initial: false, children: [jsx("div", { style: {
                                 pointerEvents: inTransition ? 'all' : 'none', // Block interaction while transitioning
                                 position: 'absolute',
                                 top: 0,
@@ -6461,7 +6464,7 @@ function useWalletConnectUri({ enabled } = {
     };
 }
 
-const Web3Context = React.createContext({
+const Web3Context = createContext({
     connect: {
         getUri: () => '',
     },
@@ -6496,7 +6499,7 @@ const Web3ContextProvider = ({ enabled, children, }) => {
     };
     return jsx(Web3Context.Provider, { value: value, children: children });
 };
-const useWeb3 = () => React.useContext(Web3Context);
+const useWeb3 = () => useContext(Web3Context);
 
 const AlertContainer = styled(motion.div) `
   display: flex;
@@ -7343,7 +7346,7 @@ const WalletList = styled.div `
       }
     `}
 `;
-const Container$6 = styled.div ``;
+const Container$7 = styled.div ``;
 
 function useWalletConnectModal() {
     const { log } = useOpenfort();
@@ -7450,7 +7453,7 @@ const CopyToClipboardIcon = ({ copied, small, }) => (jsx(IconContainer$3, { "$cl
             opacity: small || copied ? 1 : 0.3,
         } }) }));
 
-const Container$5 = styled.div `
+const Container$6 = styled.div `
   --color: var(--ck-copytoclipboard-stroke);
   --bg: var(--ck-body-background);
   transition: all 220ms cubic-bezier(0.175, 0.885, 0.32, 1.1);
@@ -7500,7 +7503,7 @@ const CopyToClipboard = ({ string, children, variant }) => {
     };
     if (variant === 'button')
         return (jsx(Button, { disabled: !string, onClick: onCopy, icon: jsx(CopyToClipboardIcon, { copied: clipboard }), children: children }));
-    return (jsx(Container$5, { onClick: onCopy, "$disabled": !string, children: jsxs(OffsetContainer, { children: [children, jsx(CopyToClipboardIcon, { copied: clipboard, small: true })] }) }));
+    return (jsx(Container$6, { onClick: onCopy, "$disabled": !string, children: jsxs(OffsetContainer, { children: [children, jsx(CopyToClipboardIcon, { copied: clipboard, small: true })] }) }));
 };
 
 const MoreIcon = (jsx("svg", { width: "60", height: "60", viewBox: "0 0 60 60", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M30 42V19M19 30.5H42", stroke: "var(--ck-body-color-muted)", strokeWidth: "3", strokeLinecap: "round" }) }));
@@ -7528,7 +7531,7 @@ const MobileConnectors = () => {
             window.location.href = uri;
         //if (uri) window.open(uri, '_blank');
     };
-    return (jsx(PageContent, { style: { width: 312 }, children: jsxs(Container$6, { children: [jsx(ModalContent, { style: { paddingBottom: 0 }, children: jsx(ScrollArea, { height: 340, children: jsxs(WalletList, { "$disabled": !wcUri, children: [walletsIdsToDisplay
+    return (jsx(PageContent, { style: { width: 312 }, children: jsxs(Container$7, { children: [jsx(ModalContent, { style: { paddingBottom: 0 }, children: jsx(ScrollArea, { height: 340, children: jsxs(WalletList, { "$disabled": !wcUri, children: [walletsIdsToDisplay
                                     .sort(
                                 // sort by name
                                 (a, b) => {
@@ -8981,7 +8984,7 @@ const ChainSelectDropdown = ({ children, open, onClose, offsetX = 0, offsetY = 8
                                         }, children: [jsx(DropdownHeading, { children: locales.switchNetworks }), jsx(ChainSelectList, {})] })] }) }) }) })) })] }));
 };
 
-const Container$4 = styled(motion.div) ``;
+const Container$5 = styled(motion.div) ``;
 const SwitchChainButton = styled(motion.button) `
   --color: var(
     --ck-dropdown-button-color,
@@ -9090,7 +9093,7 @@ const ChainSelector = () => {
             setIsOpen(false);
     }, [context.open]);
     const disabled = chains.length <= 1;
-    return (jsx(Fragment, { children: jsx(Container$4, { children: jsx(ChainSelectDropdown, { offsetX: -12, open: !mobile && isOpen, onClose: () => setIsOpen(false), children: jsxs(SwitchChainButton, { "aria-label": flattenChildren(locales.switchNetworks).toString(), disabled: disabled, onClick: () => {
+    return (jsx(Fragment, { children: jsx(Container$5, { children: jsx(ChainSelectDropdown, { offsetX: -12, open: !mobile && isOpen, onClose: () => setIsOpen(false), children: jsxs(SwitchChainButton, { "aria-label": flattenChildren(locales.switchNetworks).toString(), disabled: disabled, onClick: () => {
                         if (mobile) {
                             context.setRoute(routes.SWITCHNETWORKS);
                         }
@@ -9103,7 +9106,7 @@ const ChainSelector = () => {
 const PoweredByFooter = ({ showDisclaimer }) => {
     var _a, _b;
     const { uiConfig: options } = useOpenfort();
-    return (jsxs(Container$3, { children: [showDisclaimer && (jsx(Disclaimer, { children: (options === null || options === void 0 ? void 0 : options.disclaimer) ? (jsx(Fragment, { children: options.disclaimer })) : (jsxs("div", { children: ["By logging in, you agree to our ", jsx("a", { href: (_a = options === null || options === void 0 ? void 0 : options.termsOfServiceUrl) !== null && _a !== void 0 ? _a : "https://www.openfort.xyz/terms", target: "_blank", rel: "noopener noreferrer", children: "Terms of Service" }), " & ", jsx("a", { href: (_b = options === null || options === void 0 ? void 0 : options.privacyPolicyUrl) !== null && _b !== void 0 ? _b : "https://www.openfort.xyz/privacy", target: "_blank", rel: "noopener noreferrer", children: "Privacy Policy" }), "."] })) })), jsxs(TextButton, { onClick: () => {
+    return (jsxs(Container$4, { children: [showDisclaimer && (jsx(Disclaimer, { children: (options === null || options === void 0 ? void 0 : options.disclaimer) ? (jsx(Fragment, { children: options.disclaimer })) : (jsxs("div", { children: ["By logging in, you agree to our ", jsx("a", { href: (_a = options === null || options === void 0 ? void 0 : options.termsOfServiceUrl) !== null && _a !== void 0 ? _a : "https://www.openfort.xyz/terms", target: "_blank", rel: "noopener noreferrer", children: "Terms of Service" }), " & ", jsx("a", { href: (_b = options === null || options === void 0 ? void 0 : options.privacyPolicyUrl) !== null && _b !== void 0 ? _b : "https://www.openfort.xyz/privacy", target: "_blank", rel: "noopener noreferrer", children: "Privacy Policy" }), "."] })) })), jsxs(TextButton, { onClick: () => {
                     window.open("https://www.openfort.xyz/", "_blank");
                 }, children: [jsx("span", { children: "Powered by" }), jsx(IconContainer$2, { children: jsx(Logos.Openfort, {}) }), jsx("span", { children: "Openfort" })] })] }));
 };
@@ -9152,7 +9155,7 @@ const IconContainer$2 = styled.div `
     border-radius: 0;
   }
 `;
-const Container$3 = styled(motion.div) `
+const Container$4 = styled(motion.div) `
   text-align: center;
   margin-top: 4px;
   margin-bottom: -16px;
@@ -9201,7 +9204,7 @@ var Wallet = ({ ...props }) => {
 
 function useProviders() {
     const { user } = useOpenfortCore();
-    const { uiConfig: options } = useOpenfort();
+    const { uiConfig: options, thirdPartyAuth, setOpen } = useOpenfort();
     const allProviders = (options === null || options === void 0 ? void 0 : options.authProviders) || [];
     const providers = allProviders.filter(p => p !== AuthProvider.GUEST) || [];
     const linkedProviders = user ? providers.filter(p => { var _a; return (_a = user.linkedAccounts) === null || _a === void 0 ? void 0 : _a.find(a => a.provider === p); }) : [];
@@ -9213,6 +9216,12 @@ function useProviders() {
             return !((_a = user.linkedAccounts) === null || _a === void 0 ? void 0 : _a.find(a => a.provider === provider));
         })
         : providers;
+    useEffect(() => {
+        if (thirdPartyAuth) {
+            setOpen(false);
+            console.error(new OpenfortError('When using external third party auth providers, openfort Auth providers are not available. Either remove the `thirdPartyAuth` or authenticate your users using Auth hooks.', OpenfortErrorType.CONFIGURATION_ERROR));
+        }
+    }, []);
     return {
         availableProviders,
         linkedProviders,
@@ -9339,10 +9348,7 @@ const Profile = ({ closeModal }) => {
         //watch: true,
     });
     const [shouldDisconnect, setShouldDisconnect] = useState(false);
-    const { logout, user } = useOpenfortCore();
-    useEffect(() => {
-        // if (!isConnected) context.setOpen(false);
-    }, [isConnected]);
+    const { logout } = useOpenfortCore();
     useEffect(() => {
         if (!shouldDisconnect)
             return;
@@ -9400,7 +9406,7 @@ const outlineKeyframes = keyframes `
   0%{ opacity:1; }
   100%{ opacity:0; }
 `;
-const Container$2 = styled(motion.div) `
+const Container$3 = styled(motion.div) `
   /*
   background: var(
     --ck-body-background
@@ -10001,14 +10007,14 @@ const ConnectWithInjector = ({ switchConnectMethod, forceState }) => {
     }, [status, expiryTimer]);
     */
     if (!wallet) {
-        return (jsx(PageContent, { children: jsxs(Container$2, { children: [jsx(ModalHeading, { children: "Invalid State" }), jsx(ModalContent, { children: jsx(Alert, { children: "No connectors match the id given. This state should never happen." }) })] }) }));
+        return (jsx(PageContent, { children: jsxs(Container$3, { children: [jsx(ModalHeading, { children: "Invalid State" }), jsx(ModalContent, { children: jsx(Alert, { children: "No connectors match the id given. This state should never happen." }) })] }) }));
     }
     // OLD_TODO: Make this more generic
     if (isWalletConnectConnector(wallet === null || wallet === void 0 ? void 0 : wallet.connector.id)) {
-        return (jsx(PageContent, { children: jsxs(Container$2, { children: [jsx(ModalHeading, { children: "Invalid State" }), jsx(ModalContent, { children: jsx(Alert, { children: "WalletConnect does not have an injection flow. This state should never happen." }) })] }) }));
+        return (jsx(PageContent, { children: jsxs(Container$3, { children: [jsx(ModalHeading, { children: "Invalid State" }), jsx(ModalContent, { children: jsx(Alert, { children: "WalletConnect does not have an injection flow. This state should never happen." }) })] }) }));
     }
     const hasError = status === states$2.FAILED || status === states$2.REJECTED || status === states$2.DUPLICATED;
-    return (jsx(PageContent, { children: jsxs(Container$2, { children: [jsx(ConnectingContainer$1, { children: jsxs(ConnectingAnimation$1, { "$shake": hasError, "$circle": walletInfo.iconShape === 'circle', children: [jsx(AnimatePresence, { children: (hasError) && (jsx(RetryButton, { "aria-label": "Retry", initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, exit: { opacity: 0, scale: 0.8 }, whileTap: { scale: 0.9 }, transition: { duration: 0.1 }, onClick: runConnect, children: jsx(RetryIconContainer, { children: jsx(Tooltip, { open: showTryAgainTooltip &&
+    return (jsx(PageContent, { children: jsxs(Container$3, { children: [jsx(ConnectingContainer$1, { children: jsxs(ConnectingAnimation$1, { "$shake": hasError, "$circle": walletInfo.iconShape === 'circle', children: [jsx(AnimatePresence, { children: (hasError) && (jsx(RetryButton, { "aria-label": "Retry", initial: { opacity: 0, scale: 0.8 }, animate: { opacity: 1, scale: 1 }, exit: { opacity: 0, scale: 0.8 }, whileTap: { scale: 0.9 }, transition: { duration: 0.1 }, onClick: runConnect, children: jsx(RetryIconContainer, { children: jsx(Tooltip, { open: showTryAgainTooltip &&
                                                 (hasError), message: locales.tryAgainQuestion, xOffset: -6, children: jsx(RetryIconCircle, {}) }) }) })) }), walletInfo.iconShape === 'circle' ? (jsx(CircleSpinner, { logo: status === states$2.UNAVAILABLE ? (jsx("div", { style: {
                                         transform: 'scale(1.14)',
                                         position: 'relative',
@@ -10480,14 +10486,14 @@ const EmailLogin = () => {
             setLoginLoading(false);
             setLoginError("Invalid email or password.");
         }).then((user) => {
-            // console.log("User", user);
+            // log("User", user);
             if (!user) {
                 setLoginLoading(false);
                 setLoginError("Invalid email or password.");
                 return;
             }
             if ("action" in user && user.action === AuthActionRequiredActions.ACTION_VERIFY_EMAIL) {
-                console.log("User needs to verify email");
+                log("User needs to verify email");
                 localStorage.setItem(emailToVerifyLocalStorageKey, email);
                 setRoute(routes.EMAIL_VERIFICATION);
             }
@@ -10959,12 +10965,63 @@ const onError = ({ hookOptions, options, error, }) => {
     return { error };
 };
 
-const createOpenfortWallet = ({ address, }) => ({
+var OpenfortStatus;
+(function (OpenfortStatus) {
+    OpenfortStatus[OpenfortStatus["DISCONNECTED"] = 0] = "DISCONNECTED";
+    OpenfortStatus[OpenfortStatus["NEEDS_RECOVERY"] = 1] = "NEEDS_RECOVERY";
+    OpenfortStatus[OpenfortStatus["LOADING"] = 2] = "LOADING";
+    OpenfortStatus[OpenfortStatus["CONNECTED"] = 3] = "CONNECTED";
+})(OpenfortStatus || (OpenfortStatus = {}));
+function useStatus() {
+    const { embeddedState } = useOpenfortCore();
+    const { isConnected, isConnecting } = useAccount();
+    const getStatus = () => {
+        if (embeddedState === EmbeddedState.READY)
+            return OpenfortStatus.CONNECTED;
+        if (embeddedState === EmbeddedState.NONE)
+            return OpenfortStatus.LOADING;
+        // if (needsRecovery) return OpenfortStatus.NEEDS_RECOVERY;
+        if (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) {
+            if (isConnected)
+                return OpenfortStatus.CONNECTED;
+            else
+                return OpenfortStatus.NEEDS_RECOVERY;
+        }
+        return OpenfortStatus.DISCONNECTED;
+    };
+    const status = getStatus();
+    return {
+        isLoading: status === OpenfortStatus.LOADING,
+        isConnected: status === OpenfortStatus.CONNECTED,
+        isDisconnected: status === OpenfortStatus.DISCONNECTED,
+        isConnecting: isConnecting || embeddedState === EmbeddedState.CREATING_ACCOUNT,
+        isAuthenticated: embeddedState !== EmbeddedState.NONE && embeddedState !== EmbeddedState.UNAUTHENTICATED,
+    };
+}
+
+function useUser() {
+    const { user, client } = useOpenfortCore();
+    const { isAuthenticated } = useStatus();
+    const getAccessTokenAndUpdate = useCallback(async () => {
+        await client.validateAndRefreshToken();
+        const token = await client.getAccessToken();
+        return token;
+    }, [client]);
+    return {
+        user,
+        isAuthenticated,
+        getAccessToken: getAccessTokenAndUpdate,
+        validateAndRefreshToken: async () => await client.validateAndRefreshToken(),
+    };
+}
+
+const parseOpenfortWallet = ({ address, recoveryMethod, }) => ({
     connectorType: "embedded",
     walletClientType: "openfort",
     address,
     id: embeddedWalletId,
     isAvailable: true,
+    recoveryMethod,
 });
 const mapWalletStatus = (status) => {
     return {
@@ -10976,7 +11033,8 @@ const mapWalletStatus = (status) => {
     };
 };
 function useWallets(hookOptions = {}) {
-    const { user, embeddedState, client } = useOpenfortCore();
+    const { client } = useOpenfortCore();
+    const { user } = useUser();
     const { walletConfig, log, setOpen, setRoute, setConnector, uiConfig } = useOpenfort();
     const { connector, isConnected, address } = useAccount();
     const chainId = useChainId();
@@ -11017,14 +11075,13 @@ function useWallets(hookOptions = {}) {
             }
         }
     });
-    const { data: embeddedWallets, refetch } = useQuery({
+    // will reset on logout
+    const { data: embeddedWallets, refetch, isPending: isLoadingWallets } = useQuery({
         queryKey: ['openfortEmbeddedWalletList'],
-        queryFn: () => !!user ? client.embeddedWallet.list() : Promise.resolve([]),
+        queryFn: () => client.embeddedWallet.list(),
+        refetchOnMount: false,
+        refetchOnWindowFocus: false,
     });
-    useEffect(() => {
-        log("Refetching embedded wallets");
-        refetch();
-    }, [!!user, refetch]);
     const getEncryptionSession = useCallback(async () => {
         if (!walletConfig || !walletConfig.createEncryptedSessionEndpoint) {
             throw new Error("No createEncryptedSessionEndpoint set in walletConfig");
@@ -11058,16 +11115,16 @@ function useWallets(hookOptions = {}) {
             // Remove duplicates (different chain ids)
             if (userWallets.find(w => w.address === (wallet.address)))
                 return;
-            userWallets.push(createOpenfortWallet({
+            userWallets.push(parseOpenfortWallet({
                 address: wallet.address,
+                recoveryMethod: wallet.recoveryMethod,
             }));
         });
         return userWallets;
     }, [user === null || user === void 0 ? void 0 : user.linkedAccounts, embeddedWallets]);
     const wallets = useMemo(() => {
-        if (!isConnected || !address)
-            return rawWallets;
-        console.log("Mapping wallets", { rawWallets, status, address, isConnected, connector });
+        // if (!isConnected || !address) return rawWallets;
+        log("Mapping wallets", { rawWallets, status, address, isConnected, connector });
         return rawWallets.map((w) => ({
             ...w,
             isConnecting: status.status === 'connecting' && status.address === w.address,
@@ -11148,34 +11205,22 @@ function useWallets(hookOptions = {}) {
             }
             log(`Handling recovery with Openfort: ${password ? "with password" : "without password"}, chainId=${chainId}`);
             try {
-                const accessToken = await client.getAccessToken();
-                if (!accessToken) {
-                    throw new Error("Openfort access token not found");
-                }
-                log("Access token");
-                const shieldAuthentication = password ? {
-                    auth: ShieldAuthType.OPENFORT,
-                    token: accessToken,
-                } : {
-                    auth: ShieldAuthType.OPENFORT,
-                    token: accessToken,
-                    encryptionSession: walletConfig.getEncryptionSession ?
-                        await walletConfig.getEncryptionSession() :
-                        await getEncryptionSession(),
-                };
-                log("Shield authentication");
                 const recoveryParams = password ? {
                     recoveryMethod: RecoveryMethod.PASSWORD,
                     password,
                 } : {
                     recoveryMethod: RecoveryMethod.AUTOMATIC,
+                    encryptionSession: walletConfig.getEncryptionSession ?
+                        await walletConfig.getEncryptionSession() :
+                        await getEncryptionSession()
                 };
                 // Ensure that the embedded wallet is listed
                 const embeddedWallets = await client.embeddedWallet.list();
                 log("Recovery params", optionsObject.address);
                 log("Embedded wallets", embeddedWallets, chainId);
-                if (optionsObject.address) {
-                    const walletId = (_a = embeddedWallets === null || embeddedWallets === void 0 ? void 0 : embeddedWallets.find((w) => w.address === optionsObject.address && w.chainId === chainId)) === null || _a === void 0 ? void 0 : _a.id;
+                let walletAddress = optionsObject.address;
+                if (walletAddress) {
+                    const walletId = (_a = embeddedWallets === null || embeddedWallets === void 0 ? void 0 : embeddedWallets.find((w) => w.address === walletAddress && w.chainId === chainId)) === null || _a === void 0 ? void 0 : _a.id;
                     if (!walletId) {
                         return onError({
                             error: new OpenfortError("Embedded wallet not found for address", OpenfortErrorType.WALLET_ERROR),
@@ -11185,22 +11230,25 @@ function useWallets(hookOptions = {}) {
                     }
                     await client.embeddedWallet.recover({
                         account: walletId,
-                        shieldAuthentication,
                         recoveryParams,
                     });
                 }
                 else {
                     // Check if the embedded wallet is already created in the current chain
                     if (embeddedWallets.some((w) => w.chainId === chainId)) {
+                        const walletToRecover = embeddedWallets.find((w) => w.chainId === chainId);
                         await client.embeddedWallet.recover({
-                            account: embeddedWallets[0].id,
-                            shieldAuthentication,
+                            account: walletToRecover.id,
                             recoveryParams,
                         });
+                        walletAddress = walletToRecover.address;
                     }
                     else {
-                        await createWallet({
-                            password,
+                        // Here it should check if there is a wallet that can recover in another chain and recover it in the current chain (its a different account so its not supported yet)
+                        return onError({
+                            error: new OpenfortError("No embedded wallet found for the current chain", OpenfortErrorType.WALLET_ERROR),
+                            options: optionsObject,
+                            hookOptions
                         });
                     }
                 }
@@ -11209,8 +11257,9 @@ function useWallets(hookOptions = {}) {
                 });
                 return onSuccess({
                     data: {
-                        wallet: createOpenfortWallet({
-                            address: optionsObject.address,
+                        wallet: parseOpenfortWallet({
+                            address: walletAddress,
+                            recoveryMethod: recoveryParams.recoveryMethod,
                         }),
                     },
                     options: optionsObject,
@@ -11220,25 +11269,36 @@ function useWallets(hookOptions = {}) {
             catch (err) {
                 log('Error handling recovery with Openfort:', err);
                 if (err instanceof MissingRecoveryPasswordError) {
+                    const error = new OpenfortError("Missing recovery password", OpenfortErrorType.WALLET_ERROR);
+                    setStatus({
+                        status: 'error',
+                        error,
+                    });
                     return onError({
-                        error: new OpenfortError("Missing recovery password", OpenfortErrorType.WALLET_ERROR),
+                        error,
                         options: optionsObject,
                         hookOptions
                     });
                 }
                 if (typeof err === 'string') {
+                    const error = new OpenfortError(err, OpenfortErrorType.WALLET_ERROR);
+                    setStatus({
+                        status: 'error',
+                        error,
+                    });
                     return onError({
-                        error: new OpenfortError(err, OpenfortErrorType.WALLET_ERROR),
+                        error,
                         options: optionsObject,
                         hookOptions
                     });
                 }
-                // setStatus({
-                //   status: 'error',
-                //   error: new Error("Failed to connect with embedded wallet: " + err),
-                // });
+                const error = new OpenfortError("The recovery phrase you entered is incorrect.", OpenfortErrorType.WALLET_ERROR);
+                setStatus({
+                    status: 'error',
+                    error,
+                });
                 return onError({
-                    error: new OpenfortError("The recovery phrase you entered is incorrect.", OpenfortErrorType.WALLET_ERROR),
+                    error,
                     options: optionsObject,
                     hookOptions
                 });
@@ -11262,52 +11322,63 @@ function useWallets(hookOptions = {}) {
             status: 'creating',
         });
         log("Creating wallet", { password: !!password, options });
-        const accessToken = await client.getAccessToken();
-        if (!accessToken) {
-            return onError({
-                error: new OpenfortError("Openfort access token not found", OpenfortErrorType.WALLET_ERROR),
-                hookOptions,
-                options,
+        try {
+            const accessToken = await client.getAccessToken();
+            if (!accessToken) {
+                return onError({
+                    error: new OpenfortError("Openfort access token not found", OpenfortErrorType.WALLET_ERROR),
+                    hookOptions,
+                    options,
+                });
+            }
+            if (!walletConfig) {
+                return onError({
+                    error: new OpenfortError("Embedded signer not enabled", OpenfortErrorType.WALLET_ERROR),
+                    hookOptions,
+                    options,
+                });
+            }
+            const recoveryParams = password ? {
+                recoveryMethod: RecoveryMethod.PASSWORD,
+                password,
+            } : {
+                recoveryMethod: RecoveryMethod.AUTOMATIC,
+                encryptionSession: walletConfig.getEncryptionSession ?
+                    await walletConfig.getEncryptionSession() :
+                    await getEncryptionSession()
+            };
+            const wallet = await client.embeddedWallet.create({
+                chainId: (_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.initialChainId) !== null && _a !== void 0 ? _a : chainId,
+                accountType: (options === null || options === void 0 ? void 0 : options.accountType) || (walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.accountType) || AccountTypeEnum.SMART_ACCOUNT,
+                chainType: ChainTypeEnum.EVM,
+                recoveryParams,
+            });
+            setStatus({
+                status: 'success',
+            });
+            refetch();
+            return onSuccess({
+                data: {
+                    wallet: parseOpenfortWallet({
+                        address: wallet.address,
+                        recoveryMethod: wallet.recoveryMethod,
+                    })
+                }
             });
         }
-        if (!walletConfig) {
+        catch (e) {
+            const errorObj = e instanceof Error ? e : new Error('Failed to create wallet');
+            const error = new OpenfortError('Failed to create wallet', OpenfortErrorType.WALLET_ERROR, { error: errorObj });
+            setStatus({
+                status: 'error',
+                error,
+            });
             return onError({
-                error: new OpenfortError("Embedded signer not enabled", OpenfortErrorType.WALLET_ERROR),
+                error,
                 hookOptions,
                 options,
             });
         }
-        const shieldAuthentication = {
-            auth: ShieldAuthType.OPENFORT,
-            token: accessToken,
-            encryptionSession: walletConfig.getEncryptionSession ?
-                await walletConfig.getEncryptionSession() :
-                await getEncryptionSession(),
-        };
-        const recoveryParams = password ? {
-            recoveryMethod: RecoveryMethod.PASSWORD,
-            password,
-        } : {
-            recoveryMethod: RecoveryMethod.AUTOMATIC,
-        };
-        const wallet = await client.embeddedWallet.create({
-            chainId: (_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.initialChainId) !== null && _a !== void 0 ? _a : chainId,
-            accountType: AccountTypeEnum.SMART_ACCOUNT,
-            chainType: ChainTypeEnum.EVM,
-            recoveryParams,
-            shieldAuthentication
-        });
-        setStatus({
-            status: 'success',
-        });
-        refetch();
-        return onSuccess({
-            data: {
-                wallet: createOpenfortWallet({
-                    address: wallet.address,
-                })
-            }
-        });
     }, [refetch, client, uiConfig, chainId]);
     const setRecovery = useCallback(async (params) => {
         try {
@@ -11315,17 +11386,7 @@ function useWallets(hookOptions = {}) {
                 status: 'loading',
             });
             // Set embedded wallet recovery method
-            if (params.recoveryMethod === 'password') {
-                await client.embeddedWallet.setEmbeddedRecovery({
-                    recoveryMethod: RecoveryMethod.PASSWORD,
-                    recoveryPassword: params.recoveryPassword
-                });
-            }
-            else {
-                await client.embeddedWallet.setEmbeddedRecovery({
-                    recoveryMethod: RecoveryMethod.AUTOMATIC
-                });
-            }
+            await client.embeddedWallet.setRecoveryMethod(params.previousRecovery, params.newRecovery);
             // Get the updated embedded account
             const embeddedAccount = await client.embeddedWallet.get();
             setStatus({ status: 'success' });
@@ -11333,8 +11394,9 @@ function useWallets(hookOptions = {}) {
                 hookOptions,
                 options: params,
                 data: {
-                    wallet: createOpenfortWallet({
+                    wallet: parseOpenfortWallet({
                         address: embeddedAccount.address,
+                        recoveryMethod: embeddedAccount.recoveryMethod,
                     }),
                 }
             });
@@ -11349,10 +11411,13 @@ function useWallets(hookOptions = {}) {
         }
     }, [client, setStatus, hookOptions]);
     return {
+        hasWallet: wallets.length > 0,
+        isLoadingWallets,
         wallets,
         availableWallets: deviceWallets,
         activeWallet,
         setRecovery,
+        reset: () => setStatus({ status: 'idle' }),
         createWallet,
         setActiveWallet,
         ...mapWalletStatus(status),
@@ -11360,19 +11425,202 @@ function useWallets(hookOptions = {}) {
     };
 }
 
+/**
+ * Password Utilities Module
+ * Provides functions for password strength calculation, passphrase generation,
+ * and password validation.
+ */
+// ============================================================================
+// Constants and Regular Expressions
+// ============================================================================
+/** Regular expression to match lowercase letters */
+const LOWERCASE_REGEX = /[a-z]/;
+/** Regular expression to match uppercase letters */
+const UPPERCASE_REGEX = /[A-Z]/;
+/** Regular expression to match digits */
+const DIGIT_REGEX = /[0-9]/;
+/** Special characters allowed in passwords */
+const SPECIAL_CHARACTERS = '!@#$%^&()\\-*+.';
+/** Regular expression to match special characters */
+const SPECIAL_CHARACTER_REGEX = new RegExp(`[${SPECIAL_CHARACTERS}]`);
+/** Maximum entropy score for normalization */
+const MAX_ENTROPY_SCORE = 95;
+/** Minimum password length for security */
+const MIN_PASSWORD_LENGTH = 8;
+/** Weight for diversity score in overall strength calculation */
+const DIVERSITY_WEIGHT = 0.3;
+const ENTROPY_WEIGHT = 0.7;
+const MEDIUM_SCORE_THRESHOLD = 0.5;
+const STRONG_SCORE_THRESHOLD = 0.75;
+const VERY_STRONG_SCORE_THRESHOLD = 0.9;
+/**
+ * Converts a numeric password strength score to a human-readable label.
+ *
+ * @param score - The strength score (0-1)
+ * @returns The corresponding strength label
+ */
+function getPasswordStrengthLabel(score) {
+    if (score > VERY_STRONG_SCORE_THRESHOLD) {
+        return 'Very Strong';
+    }
+    else if (score > STRONG_SCORE_THRESHOLD) {
+        return 'Strong';
+    }
+    else if (score > MEDIUM_SCORE_THRESHOLD) {
+        return 'Medium';
+    }
+    else {
+        return 'Weak';
+    }
+}
+/**
+ * Calculates the diversity score of a password based on character types used.
+ * Considers lowercase, uppercase, digits, and special characters.
+ *
+ * @param password - The password to analyze
+ * @returns A score between 0 and 1 representing character diversity
+ */
+function calculatePasswordDiversityScore(password) {
+    // Passwords shorter than minimum length get a score of 0
+    if (password.length < MIN_PASSWORD_LENGTH) {
+        return 0;
+    }
+    let characterTypesUsed = 0;
+    if (LOWERCASE_REGEX.test(password)) {
+        characterTypesUsed += 1;
+    }
+    if (UPPERCASE_REGEX.test(password)) {
+        characterTypesUsed += 1;
+    }
+    if (DIGIT_REGEX.test(password)) {
+        characterTypesUsed += 1;
+    }
+    if (SPECIAL_CHARACTER_REGEX.test(password)) {
+        characterTypesUsed += 1;
+    }
+    return Math.max(0, Math.min(1, characterTypesUsed / 4));
+}
+/**
+ * Calculates the overall password strength combining diversity and entropy.
+ *
+ * @param password - The password to analyze
+ * @returns A strength score between 0 and 1
+ */
+function getPasswordStrength(password = '') {
+    const diversityScore = calculatePasswordDiversityScore(password);
+    const entropyScore = calculateEntropy(password) / MAX_ENTROPY_SCORE;
+    return Math.min((diversityScore * DIVERSITY_WEIGHT +
+        entropyScore * ENTROPY_WEIGHT), 1);
+}
+
+const Container$2 = styled.div `
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem;
+  margin-top: 0.5rem;
+  margin-bottom: 0.5rem;
+  text-align: left;
+`;
+const BarWrapper = styled.div `
+  width: 100%;
+  height: 4px;
+  background: var(--ck-secondary-button-background);
+  border-radius: 4px;
+  overflow: hidden;
+`;
+const Progress = styled(motion.div) `
+  height: 100%;
+  background: ${({ color }) => color};
+  border-radius: 4px;
+`;
+const Label = styled.div `
+  font-size: 0.875rem;
+  font-weight: 500;
+  color: var(--ck-body-color-muted);
+`;
+const LabelColor = styled.span `
+  color: ${({ color }) => color};
+`;
+const PasswordStrengthIndicator = ({ password, showPasswordIsTooWeakError }) => {
+    const passwordStrength = getPasswordStrength(password); // should return a number between 0 and 1
+    const label = getPasswordStrengthLabel(passwordStrength);
+    const color = useMemo(() => {
+        switch (label) {
+            case "Weak":
+                return "#ef4444"; // red-500
+            case "Medium":
+                return "#f59e0b"; // amber-500
+            case "Strong":
+                return "#10b981"; // emerald-500
+            case "Very Strong":
+                return "#3b82f6"; // blue-500
+            default:
+                return "#d1d5db"; // gray-300
+        }
+    }, [label]);
+    return (jsxs(Container$2, { children: [jsx(BarWrapper, { children: jsx(Progress, { color: color, initial: { width: 0 }, animate: { width: `${passwordStrength * 100}%` }, transition: { ease: "easeOut", duration: 0.5 } }) }), jsxs("div", { style: { position: 'relative' }, children: [jsx(motion.div, { initial: { opacity: 1 }, animate: {
+                            opacity: showPasswordIsTooWeakError ? 0 : 1,
+                            y: showPasswordIsTooWeakError ? 5 : 0
+                        }, transition: { duration: 0.3 }, children: jsxs(Label, { children: ["Password strength: ", jsx(LabelColor, { color: color, children: label })] }) }), jsx(motion.div, { initial: { opacity: 0 }, animate: {
+                            opacity: showPasswordIsTooWeakError ? 1 : 0,
+                            y: showPasswordIsTooWeakError ? 0 : -5
+                        }, transition: { duration: 0.3 }, style: { color: '#ef4444', fontSize: '0.875rem', fontWeight: 500, position: 'absolute', top: '0' }, children: "Password is too weak" })] })] }));
+};
+
+const TickListContainer = styled.ul `
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  padding-top: 8px;
+  padding-bottom: 8px;
+`;
+const TickItem = styled.li `
+  display: flex;
+  align-items: center;
+  text-align: left;
+  gap: 8px;
+  font-size: 16px;
+  line-height: 24px;
+`;
+const TickIconWrapper = styled.span `
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 16px;
+  height: 16px;
+  flex-shrink: 0;
+`;
+
+const TickList = ({ items }) => {
+    return (jsx(TickListContainer, { children: items.map((item, index) => (jsxs(TickItem, { children: [jsx(TickIconWrapper, { children: jsx(TickIcon, {}) }), jsx("span", { children: item })] }, index))) }));
+};
+TickList.displayName = 'TickList';
+
+const OtherMethodButton = styled.button `
+  width: 100%;
+  color: var(--ck-body-color-muted);
+  transition: color 0.2s;
+  font-size: 14px;
+  margin-top: 10px;
+
+  &:hover {
+    color: var(--ck-body-color);
+  }
+`;
+
 // TODO: Localize
-const Recover = () => {
-    const [recoveryPhrase, setRecoveryPhrase] = React.useState("");
-    const [recoveryError, setRecoveryError] = React.useState(false);
+const RecoverPasswordWallet = ({ wallet }) => {
+    const [recoveryPhrase, setRecoveryPhrase] = useState("");
+    const [recoveryError, setRecoveryError] = useState(false);
     const { triggerResize, uiConfig: options, log } = useOpenfort();
-    useChainId();
-    const [loading, setLoading] = React.useState(false);
+    const [loading, setLoading] = useState(false);
     const { setActiveWallet } = useWallets();
     const handleSubmit = async () => {
         setLoading(true);
         const { error } = await setActiveWallet({
             connector: embeddedWalletId,
             password: recoveryPhrase,
+            address: wallet.address,
         });
         setLoading(false);
         if (error) {
@@ -11386,34 +11634,172 @@ const Recover = () => {
         if (recoveryError)
             triggerResize();
     }, [recoveryError]);
-    return (jsxs(PageContent, { children: [jsxs(Graphic, { "$height": "110px", children: [jsxs(LogoGroup, { children: [jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(1.2)" }, children: jsx(KeyIcon, {}) }) }) }) }) }) }), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.75)" }, children: jsx(ShieldIcon, {}) }) }) }) }) }) }), jsx(Logo$2, {}), jsx(Logo$2, {}), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.5)" }, children: jsx(LockIcon, {}) }) }) }) }) }) })] }), jsx(GraphicBackground, { children: wave })] }), jsx(ModalHeading, { children: "Secure your account" }), jsx(ModalBody, { style: { textAlign: "center" }, children: jsx(FitText, { children: "Set or enter your password to secure your account." }) }), jsxs("form", { onSubmit: (e) => {
+    const ensFallbackConfig = useEnsFallbackConfig();
+    const { data: ensName } = useEnsName({
+        chainId: 1,
+        address: wallet.address,
+        config: ensFallbackConfig,
+    });
+    const separator = '....';
+    return (jsxs(PageContent, { children: [jsxs(Graphic, { "$height": "130px", children: [jsxs(LogoGroup, { children: [jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(1.2)" }, children: jsx(KeyIcon, {}) }) }) }) }) }) }), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.75)" }, children: jsx(ShieldIcon, {}) }) }) }) }) }) }), jsx(Logo$2, {}), jsx(Logo$2, {}), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.5)" }, children: jsx(LockIcon, {}) }) }) }) }) }) })] }), jsx(GraphicBackground, { children: wave })] }), jsx(ModalHeading, { children: "Recover wallet" }), jsxs(ModalBody, { style: { textAlign: "center" }, children: ["Please enter the recovery password to recover wallet", " ", jsx(CopyToClipboard, { string: wallet.address, children: ensName !== null && ensName !== void 0 ? ensName : truncateEthAddress(wallet.address, separator) })] }), jsxs("form", { onSubmit: (e) => {
                     e.preventDefault();
                     handleSubmit();
-                }, children: [jsx(Input, { value: recoveryPhrase, onChange: (e) => setRecoveryPhrase(e.target.value), type: "password", placeholder: "Enter your password", autoComplete: "off" }), recoveryError && (jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: jsx(ModalBody, { style: { height: 24, marginTop: 12 }, "$error": true, children: jsx(FitText, { children: recoveryError }) }) }, recoveryError)), jsx(Button, { onClick: handleSubmit, waiting: loading, disabled: loading, children: "Enter" })] })] }));
+                }, children: [jsx(Input, { value: recoveryPhrase, onChange: (e) => setRecoveryPhrase(e.target.value), type: "password", placeholder: "Enter your password", autoComplete: "off" }), recoveryError && (jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: jsx(ModalBody, { style: { height: 24, marginTop: 12 }, "$error": true, children: jsx(FitText, { children: recoveryError }) }) }, recoveryError)), jsx(Button, { onClick: handleSubmit, waiting: loading, disabled: loading, children: "Recover wallet" })] })] }));
 };
-const AutomaticRecovery = () => {
-    const { needsRecovery } = useOpenfortCore();
+const RecoverAutomaticWallet = ({ walletAddress }) => {
+    const { embeddedState } = useOpenfortCore();
     const { setActiveWallet } = useWallets();
     const { log } = useOpenfort();
-    const [hasRecoveryMethod, setHasRecoveryMethod] = React.useState(false);
+    const [error, setError] = useState(false);
     useEffect(() => {
         (async () => {
-            if (!needsRecovery) {
-                log("Automatic recovery enabled, configuring embedded signer");
+            if (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) {
+                log("Automatically recovering wallet", walletAddress);
                 const response = await setActiveWallet({
                     connector: embeddedWalletId,
                 });
-                // TODO: Handle error properly
-                if (response.error && response.error.message === "Missing recovery password") {
-                    setHasRecoveryMethod(true);
+                if (response.error) {
+                    setError(response.error.message || "There was an error recovering your account");
+                    log("Error recovering wallet", response.error);
                 }
             }
         })();
-    }, [needsRecovery]);
-    if (hasRecoveryMethod) {
-        return jsx(Recover, {});
+    }, [embeddedState]);
+    if (error) {
+        jsx(PageContent, { children: jsx(ModalBody, { style: { textAlign: "center" }, "$error": true, children: jsx(FitText, { children: error }) }) });
+    }
+    return (jsx(PageContent, { children: jsx(Loader, { reason: `Recovering wallet...` }) }));
+};
+const CreateWalletAutomaticRecovery = () => {
+    const { embeddedState } = useOpenfortCore();
+    const { createWallet } = useWallets();
+    const [shouldCreateWallet, setShouldCreateWallet] = useState(false);
+    const { log } = useOpenfort();
+    useEffect(() => {
+        // To ensure the wallet is created only once
+        if (shouldCreateWallet) {
+            (async () => {
+                log("Creating wallet Automatic recover");
+                const response = await createWallet();
+                if (response.error) {
+                    log("Error creating wallet", response.error);
+                }
+            })();
+        }
+    }, [shouldCreateWallet]);
+    useEffect(() => {
+        if (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) {
+            setShouldCreateWallet(true);
+        }
+    }, [embeddedState]);
+    return (jsx(PageContent, { children: jsx(Loader, { reason: "Creating wallet..." }) }));
+};
+const OtherMethod = ({ currentMethod, onChangeMethod }) => {
+    const { uiConfig } = useOpenfort();
+    const otherMethods = useMemo(() => {
+        const allowedMethods = uiConfig.walletRecovery.allowedMethods;
+        const otherMethods = allowedMethods.filter((method) => method !== currentMethod);
+        return otherMethods;
+    }, [uiConfig, currentMethod]);
+    if (otherMethods.length === 0)
+        return null;
+    if (otherMethods.length === 1) {
+        const method = otherMethods[0];
+        let text;
+        switch (method) {
+            case RecoveryMethod.PASSWORD:
+                text = "Use password recovery";
+                break;
+            case RecoveryMethod.AUTOMATIC:
+                text = "Skip for now";
+                break;
+            default:
+                text = method;
+        }
+        return (jsx(OtherMethodButton, { onClick: () => {
+                onChangeMethod(method);
+            }, children: text }));
+    }
+    return (jsx(OtherMethodButton, { onClick: () => onChangeMethod("other"), children: "Choose another recovery method" }));
+};
+const CreateWalletPasswordRecovery = ({ onChangeMethod }) => {
+    const [recoveryPhrase, setRecoveryPhrase] = useState("");
+    const [recoveryError, setRecoveryError] = useState(false);
+    const { triggerResize, uiConfig: options, log } = useOpenfort();
+    const [showPasswordIsTooWeakError, setShowPasswordIsTooWeakError] = useState(false);
+    const [loading, setLoading] = useState(false);
+    const { createWallet } = useWallets();
+    const handleSubmit = async () => {
+        if (getPasswordStrength(recoveryPhrase) < MEDIUM_SCORE_THRESHOLD) {
+            setShowPasswordIsTooWeakError(true);
+            return;
+        }
+        setLoading(true);
+        const { error } = await createWallet({
+            password: recoveryPhrase,
+        });
+        setLoading(false);
+        if (error) {
+            setRecoveryError(error.message || "There was an error recovering your account");
+        }
+        else {
+            log("Recovery success");
+        }
+    };
+    useEffect(() => {
+        if (recoveryError)
+            triggerResize();
+    }, [recoveryError]);
+    return (jsxs(PageContent, { children: [jsxs(Graphic, { "$height": "80px", children: [jsxs(LogoGroup, { children: [jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(1.2)" }, children: jsx(KeyIcon, {}) }) }) }) }) }) }), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.75)" }, children: jsx(ShieldIcon, {}) }) }) }) }) }) }), jsx("div", {}), jsx("div", {}), jsx(Logo$2, { children: jsx(LogoPosition, { children: jsx(LogoInner, { children: jsx(FloatWrapper, { children: jsx(RotateWrapper, { children: jsx(LogoGraphic, { style: { transform: "scale(0.5)" }, children: jsx(LockIcon, {}) }) }) }) }) }) })] }), jsx(GraphicBackground, { children: wave })] }), jsx(ModalHeading, { children: "Secure your wallet" }), jsxs(ModalBody, { style: { textAlign: "center" }, children: [jsx(FitText, { children: "Set a password for your wallet." }), jsxs("form", { onSubmit: (e) => {
+                            e.preventDefault();
+                            handleSubmit();
+                        }, children: [jsx(Input, { value: recoveryPhrase, onChange: (e) => {
+                                    if (showPasswordIsTooWeakError)
+                                        setShowPasswordIsTooWeakError(false);
+                                    setRecoveryPhrase(e.target.value);
+                                }, type: "password", placeholder: "Enter your password", autoComplete: "off" }), jsx(PasswordStrengthIndicator, { password: recoveryPhrase, showPasswordIsTooWeakError: showPasswordIsTooWeakError }), jsx(TickList, { items: [
+                                    "You will use this password to access your wallet",
+                                    "Make sure it's strong and memorable",
+                                ] }), recoveryError && (jsx(motion.div, { initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, children: jsx(ModalBody, { style: { height: 24, marginTop: 12 }, "$error": true, children: jsx(FitText, { children: recoveryError }) }) }, recoveryError)), jsx(Button, { onClick: handleSubmit, waiting: loading, disabled: loading, children: "Create wallet" })] }), jsx(OtherMethod, { currentMethod: RecoveryMethod.PASSWORD, onChangeMethod: onChangeMethod })] })] }));
+};
+const ChooseRecoveryMethod = ({ onChangeMethod }) => {
+    return (jsxs(PageContent, { children: [jsx(ModalHeading, { children: "Choose a recovery method" }), jsx(Button, { onClick: () => onChangeMethod(RecoveryMethod.PASSWORD), children: "Password" }), jsx(Button, { onClick: () => onChangeMethod(RecoveryMethod.AUTOMATIC), children: "Automatic" }), jsx(Button, { onClick: () => { }, children: "Passkey (coming soon)" })] }));
+};
+const RecoverWallet = ({ wallet }) => {
+    switch (wallet.recoveryMethod) {
+        case RecoveryMethod.PASSWORD:
+            return jsx(RecoverPasswordWallet, { wallet: wallet });
+        case RecoveryMethod.AUTOMATIC:
+            return jsx(RecoverAutomaticWallet, { walletAddress: wallet.address });
+        default:
+            console.error("Unsupported recovery method: " + wallet.recoveryMethod + ", defaulting to automatic.");
+            return jsx(RecoverAutomaticWallet, { walletAddress: wallet.address });
+    }
+};
+const CreateWallet = () => {
+    const { uiConfig } = useOpenfort();
+    const [userSelectedMethod, setUserSelectedMethod] = useState(null);
+    if (userSelectedMethod) {
+        switch (userSelectedMethod) {
+            case RecoveryMethod.PASSWORD:
+                return jsx(CreateWalletPasswordRecovery, { onChangeMethod: setUserSelectedMethod });
+            case RecoveryMethod.AUTOMATIC:
+                return jsx(CreateWalletAutomaticRecovery, {});
+            case "other":
+                return jsx(ChooseRecoveryMethod, { onChangeMethod: setUserSelectedMethod });
+            default:
+                throw new Error("Unsupported recovery method: " + userSelectedMethod);
+        }
+    }
+    // Default recovery method configured
+    switch (uiConfig.walletRecovery.defaultMethod) {
+        case RecoveryMethod.PASSWORD:
+            return jsx(CreateWalletPasswordRecovery, { onChangeMethod: setUserSelectedMethod });
+        case RecoveryMethod.AUTOMATIC:
+            return jsx(CreateWalletAutomaticRecovery, {});
+        default:
+            throw new Error("Unsupported recovery method: " + uiConfig.walletRecovery.defaultMethod);
     }
-    return (jsx(PageContent, { children: jsx(Loader, { reason: "Setting up signer" }) }));
 };
 const Connected = () => {
     const { setOpen } = useOpenfort();
@@ -11425,49 +11811,81 @@ const Connected = () => {
     }, []);
     return (jsx(PageContent, { children: jsx(Loader, { isLoading: false, reason: "Connected" }) }));
 };
-const CreateEmbeddedSigner = () => {
+const RecoverPage = () => {
     const { needsRecovery, user } = useOpenfortCore();
     const { triggerResize, uiConfig, walletConfig, setRoute } = useOpenfort();
-    const [loading, setLoading] = React.useState(true);
-    const [embeddedSignerLoading, setEmbeddedSignerLoading] = React.useState(true);
+    const { wallets, isLoadingWallets } = useWallets();
+    // const [loading, setLoading] = useState(true);
+    const [embeddedSignerLoading, setEmbeddedSignerLoading] = useState(true);
     const { isConnected } = useAccount();
     useEffect(() => {
-        setTimeout(() => {
-            setEmbeddedSignerLoading(false);
-            triggerResize();
-        }, 500);
-    }, []);
-    useEffect(() => {
-        if (!user)
-            return;
-        if ((uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.linkWalletOnSignUp) || !walletConfig) {
-            if (!user.linkedAccounts.find((account) => account.provider === "wallet")) {
-                setRoute(routes.CONNECTORS);
-                return;
-            }
-            if (!walletConfig) {
-                // Logged in without a wallet
-                setRoute(routes.PROFILE);
-                return;
-            }
+        let timeout;
+        if (!isLoadingWallets) {
+            timeout = setTimeout(() => {
+                setEmbeddedSignerLoading(false);
+                triggerResize();
+            }, 500);
         }
-        setLoading(false);
-    }, [user]);
-    if (embeddedSignerLoading || loading) {
-        return (jsx(PageContent, { children: jsx(Loader, { reason: "Setting up signer" }) }));
+        return () => { clearTimeout(timeout); };
+    }, [isLoadingWallets]);
+    const openfortWallets = useMemo(() => {
+        return wallets.filter((wallet) => wallet.id === embeddedWalletId);
+    }, [wallets]);
+    // useEffect(() => {
+    //   if (!user) return;
+    //   if (uiConfig?.linkWalletOnSignUp || !walletConfig) {
+    //     if (!user.linkedAccounts.find((account) => account.provider === "wallet")) {
+    //       setRoute(routes.CONNECTORS);
+    //       return;
+    //     }
+    //     if (!walletConfig) {
+    //       // Logged in without a wallet
+    //       setRoute(routes.PROFILE);
+    //       return;
+    //     }
+    //   }
+    //   setLoading(false);
+    // }, [user])
+    if (embeddedSignerLoading) {
+        return (jsx(PageContent, { children: jsx(Loader, { reason: "Setting up wallet" }) }));
     }
     if (isConnected && user) {
         return jsx(Connected, {});
     }
-    if (walletConfig && walletConfig.recoveryMethod === RecoveryMethod.AUTOMATIC) {
-        return jsx(AutomaticRecovery, {});
+    if (!openfortWallets) {
+        // Here wallets should be loaded, so if we don't have them something went wrong
+        // TODO: add error logs
+        return (jsx(PageContent, { children: "An unexpected error occurred. Please try again later." }));
     }
-    if (needsRecovery) {
-        return jsx(Recover, {});
-    }
-    else {
-        return (jsx(PageContent, { children: jsx(Loader, { reason: "Setting up signer" }) }));
+    if (openfortWallets.length === 0) {
+        return (jsx(CreateWallet, {}));
     }
+    // if (wallets.length === 1) {
+    return (jsx(RecoverWallet, { wallet: openfortWallets[0] }));
+    // }
+    // return (
+    //   <PageContent>
+    //     <div style={{ flexDirection: "column", display: "flex", gap: 8 }}>
+    //       {wallets.map((wallet) => (
+    //         <div key={wallet.address}>
+    //           {wallet.address} - {wallet.recoveryMethod} recover
+    //         </div>
+    //       ))}
+    //     </div>
+    //   </PageContent>
+    // )
+    // if (walletConfig && walletConfig.recoveryMethod === RecoveryMethod.AUTOMATIC) {
+    //   return <AutomaticRecovery />
+    // }
+    // if (needsRecovery) {
+    //   return <Recover />
+    // } else {
+    //   return (
+    //     <PageContent>
+    //       <Loader reason="Setting up signer" />
+    //     </PageContent>
+    //   )
+    // }
 };
 
 const SocialProviders = () => {
@@ -11539,7 +11957,7 @@ const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customTheme
         connect: jsx(ConnectUsing, {}),
         profile: jsx(Profile, {}),
         switchNetworks: jsx(SwitchNetworks, {}),
-        recover: jsx(CreateEmbeddedSigner, {}),
+        recover: jsx(RecoverPage, {}),
     };
     function hide() {
         context.setOpen(false);
@@ -11623,8 +12041,8 @@ const ConnectModal = ({ mode = 'auto', theme = 'auto', customTheme = customTheme
  * @param {OpenfortOptions} [openfortOptions] - Options for Openfort integration.
  * @throws Will throw an error if used outside of a WagmiProvider or if nested usages are detected.
  */
-const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMode = false, publishableKey, walletConfig, }) => {
-    var _a, _b, _c, _d, _e, _f, _g, _h, _j;
+const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMode = false, publishableKey, walletConfig, overrides, thirdPartyAuth, }) => {
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     // OpenfortProvider must be within a WagmiProvider
     if (!React.useContext(WagmiContext)) {
         throw Error('OpenfortProvider must be within a WagmiProvider');
@@ -11636,8 +12054,9 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
     }
     const chains = useChains();
     const injectedConnector = useConnector('injected');
+    const allowAutomaticRecovery = !!((walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.createEncryptedSessionEndpoint) || (walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.getEncryptionSession));
     // Default config options
-    const defaultOptions = {
+    const defaultUIOptions = {
         theme: 'auto',
         mode: 'auto',
         language: 'en-US',
@@ -11660,21 +12079,34 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
         ethereumOnboardingUrl: undefined,
         walletOnboardingUrl: undefined,
         disableSiweRedirect: false,
-        // Openfort options
-        authProviders: [],
-    };
-    const opts = Object.assign({}, defaultOptions, uiConfig);
-    if (((_b = opts.authProviders) === null || _b === void 0 ? void 0 : _b.length) === 0) {
-        opts.authProviders = [
+        walletRecovery: {
+            allowedMethods: [
+                RecoveryMethod.PASSWORD,
+                ...(allowAutomaticRecovery ? [RecoveryMethod.AUTOMATIC] : [])
+            ],
+            defaultMethod: allowAutomaticRecovery ? RecoveryMethod.AUTOMATIC : RecoveryMethod.PASSWORD,
+        },
+        authProviders: [
             AuthProvider.GUEST,
             AuthProvider.EMAIL,
             AuthProvider.WALLET,
-        ];
+        ],
+    };
+    const safeUiConfig = Object.assign({}, defaultUIOptions, uiConfig);
+    if (!safeUiConfig.walletRecovery.allowedMethods) {
+        safeUiConfig.walletRecovery.allowedMethods = defaultUIOptions.walletRecovery.allowedMethods;
+    }
+    if (!safeUiConfig.walletRecovery.defaultMethod) {
+        safeUiConfig.walletRecovery.defaultMethod = defaultUIOptions.walletRecovery.defaultMethod;
+    }
+    if (safeUiConfig.walletRecovery.allowedMethods.includes(RecoveryMethod.AUTOMATIC) && !allowAutomaticRecovery) {
+        safeUiConfig.walletRecovery.allowedMethods = safeUiConfig.walletRecovery.allowedMethods.filter(m => m !== RecoveryMethod.AUTOMATIC);
+        console.warn("Automatic recovery method was removed from allowedMethods because no recovery options are configured in the walletConfig. Please provide either createEncryptedSessionEndpoint or getEncryptionSession to enable automatic recovery.");
     }
     if (typeof window !== 'undefined') {
         // Buffer Polyfill, needed for bundlers that don't provide Node polyfills (e.g CRA, Vite, etc.)
-        if (opts.bufferPolyfill)
-            window.Buffer = (_c = window.Buffer) !== null && _c !== void 0 ? _c : Buffer;
+        if (safeUiConfig.bufferPolyfill)
+            window.Buffer = (_b = window.Buffer) !== null && _b !== void 0 ? _b : Buffer;
         // Some bundlers may need `global` and `process.env` polyfills as well
         // Not implemented here to avoid unexpected behaviors, but leaving example here for future reference
         /*
@@ -11682,9 +12114,9 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
          * window.process = window.process ?? { env: {} };
          */
     }
-    const [ckTheme, setTheme] = useState((_e = (_d = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme) !== null && _d !== void 0 ? _d : defaultOptions.theme) !== null && _e !== void 0 ? _e : "auto");
-    const [ckMode, setMode] = useState((_g = (_f = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _f !== void 0 ? _f : defaultOptions.mode) !== null && _g !== void 0 ? _g : 'auto');
-    const [ckCustomTheme, setCustomTheme] = useState((_h = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.customTheme) !== null && _h !== void 0 ? _h : {});
+    const [ckTheme, setTheme] = useState((_d = (_c = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme) !== null && _c !== void 0 ? _c : defaultUIOptions.theme) !== null && _d !== void 0 ? _d : "auto");
+    const [ckMode, setMode] = useState((_f = (_e = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _e !== void 0 ? _e : defaultUIOptions.mode) !== null && _f !== void 0 ? _f : 'auto');
+    const [ckCustomTheme, setCustomTheme] = useState((_g = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.customTheme) !== null && _g !== void 0 ? _g : {});
     const [ckLang, setLang] = useState('en-US');
     const [open, setOpen] = useState(false);
     const [connector, setConnector] = useState({
@@ -11694,17 +12126,17 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
     const [errorMessage, setErrorMessage] = useState('');
     const [resize, onResize] = useState(0);
     // Include Google Font that is needed for a themes
-    if (opts.embedGoogleFonts)
+    if (safeUiConfig.embedGoogleFonts)
         useThemeFont(ckTheme);
     // Other Configuration
     useEffect(() => { var _a; return setTheme((_a = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme) !== null && _a !== void 0 ? _a : 'auto'); }, [uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.theme]);
-    useEffect(() => setLang(opts.language || 'en-US'), [opts.language]);
+    useEffect(() => setLang(safeUiConfig.language || 'en-US'), [safeUiConfig.language]);
     useEffect(() => setErrorMessage(null), [route, open]);
     // Check if chain is supported, elsewise redirect to switches page
     const { chain, isConnected } = useAccount();
     const isChainSupported = useChainIsSupported(chain === null || chain === void 0 ? void 0 : chain.id);
     useEffect(() => {
-        if (isConnected && opts.enforceSupportedChains && !isChainSupported) {
+        if (isConnected && safeUiConfig.enforceSupportedChains && !isChainSupported) {
             setOpen(true);
             setRoute(routes.SWITCHNETWORKS);
         }
@@ -11733,8 +12165,9 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
         connector,
         setConnector,
         onConnect,
+        onDisconnect,
         // Other configuration
-        uiConfig: opts,
+        uiConfig: safeUiConfig,
         errorMessage,
         debugMode,
         log,
@@ -11749,14 +12182,15 @@ const OpenfortProvider = ({ children, uiConfig, onConnect, onDisconnect, debugMo
         resize,
         triggerResize: () => onResize((prev) => prev + 1),
         walletConfig,
+        overrides,
+        thirdPartyAuth,
     };
     return createElement(Openfortcontext.Provider, { value }, jsx(Fragment, { children: jsx(Web3ContextProvider, { enabled: open, children: jsxs(CoreOpenfortProvider, { baseConfiguration: {
                     publishableKey,
                 }, shieldConfiguration: walletConfig ? {
                     shieldPublishableKey: walletConfig.shieldPublishableKey,
-                    shieldEncryptionKey: walletConfig.recoveryMethod === RecoveryMethod.PASSWORD ? walletConfig.shieldEncryptionKey : undefined,
                     debug: debugMode,
-                } : undefined, overrides: opts.overrides, debugMode: debugMode, onConnect: onConnect, onDisconnect: onDisconnect, children: [children, jsx(ConnectModal, { lang: ckLang, theme: ckTheme, mode: (_j = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _j !== void 0 ? _j : ckMode, customTheme: ckCustomTheme })] }) }) }));
+                } : undefined, overrides: overrides, thirdPartyAuth: thirdPartyAuth, debugMode: debugMode, onConnect: onConnect, onDisconnect: onDisconnect, children: [children, jsx(ConnectModal, { lang: ckLang, theme: ckTheme, mode: (_h = uiConfig === null || uiConfig === void 0 ? void 0 : uiConfig.mode) !== null && _h !== void 0 ? _h : ckMode, customTheme: ckCustomTheme })] }) }) }));
 };
 
 const Container$1 = styled(motion.div) `
@@ -12176,7 +12610,7 @@ const ConnectedLabel = ({ separator }) => {
     if (!user)
         return "Loading user...";
     if (!address)
-        return truncateUserId(user.id, separator);
+        return "Not connected";
     return "Loading...";
 };
 function OpenfortButtonInner({ label, showAvatar, separator, }) {
@@ -12270,56 +12704,6 @@ onClick, }) {
 }
 OpenfortButton.Custom = ConnectButtonRenderer;
 
-var OpenfortStatus;
-(function (OpenfortStatus) {
-    OpenfortStatus[OpenfortStatus["DISCONNECTED"] = 0] = "DISCONNECTED";
-    OpenfortStatus[OpenfortStatus["NEEDS_RECOVERY"] = 1] = "NEEDS_RECOVERY";
-    OpenfortStatus[OpenfortStatus["LOADING"] = 2] = "LOADING";
-    OpenfortStatus[OpenfortStatus["CONNECTED"] = 3] = "CONNECTED";
-})(OpenfortStatus || (OpenfortStatus = {}));
-function useStatus() {
-    const { embeddedState } = useOpenfortCore();
-    const { isConnected, isConnecting } = useAccount();
-    const getStatus = () => {
-        if (embeddedState === EmbeddedState.READY)
-            return OpenfortStatus.CONNECTED;
-        if (embeddedState === EmbeddedState.NONE)
-            return OpenfortStatus.LOADING;
-        // if (needsRecovery) return OpenfortStatus.NEEDS_RECOVERY;
-        if (embeddedState === EmbeddedState.EMBEDDED_SIGNER_NOT_CONFIGURED) {
-            if (isConnected)
-                return OpenfortStatus.CONNECTED;
-            else
-                return OpenfortStatus.NEEDS_RECOVERY;
-        }
-        return OpenfortStatus.DISCONNECTED;
-    };
-    const status = getStatus();
-    return {
-        isLoading: status === OpenfortStatus.LOADING,
-        isConnected: status === OpenfortStatus.CONNECTED,
-        isDisconnected: status === OpenfortStatus.DISCONNECTED,
-        isConnecting: isConnecting || embeddedState === EmbeddedState.CREATING_ACCOUNT,
-        isAuthenticated: embeddedState !== EmbeddedState.NONE && embeddedState !== EmbeddedState.UNAUTHENTICATED,
-    };
-}
-
-function useUser() {
-    const { user, client } = useOpenfortCore();
-    const { isAuthenticated } = useStatus();
-    const getAccessTokenAndUpdate = useCallback(async () => {
-        await client.validateAndRefreshToken();
-        const token = await client.getAccessToken();
-        return token;
-    }, [client]);
-    return {
-        user,
-        isAuthenticated,
-        getAccessToken: getAccessTokenAndUpdate,
-        validateAndRefreshToken: async () => await client.validateAndRefreshToken(),
-    };
-}
-
 function useWallet() {
     const { activeWallet } = useWallets();
     return activeWallet;
@@ -12347,21 +12731,16 @@ const mapStatus = (status) => {
 };
 
 function useSignOut(hookOptions = {}) {
-    const { client, updateUser, user } = useOpenfortCore();
+    const { logout } = useOpenfortCore();
     const [status, setStatus] = useState({
         status: "idle",
     });
-    const { disconnect } = useDisconnect();
     const signOut = useCallback(async (options = {}) => {
-        if (!user)
-            return;
         setStatus({
             status: 'loading',
         });
         try {
-            await client.auth.logout();
-            disconnect();
-            updateUser();
+            logout();
             setStatus({
                 status: 'success',
             });
@@ -12383,7 +12762,7 @@ function useSignOut(hookOptions = {}) {
                 error,
             });
         }
-    }, [client, user, disconnect, updateUser, setStatus, hookOptions]);
+    }, [logout, setStatus, hookOptions]);
     return {
         ...mapStatus(status),
         signOut,
@@ -12391,22 +12770,43 @@ function useSignOut(hookOptions = {}) {
 }
 
 // this hook is used to create a wallet after the user has authenticated
-const useCreateWalletPostAuth = () => {
-    const { setActiveWallet } = useWallets();
+const useConnectToWalletPostAuth = () => {
+    const { createWallet, setActiveWallet } = useWallets();
     const { walletConfig } = useOpenfort();
     const { signOut } = useSignOut();
+    const queryClient = useQueryClient();
     const tryUseWallet = useCallback(async ({ logoutOnError: signOutOnError = true, automaticRecovery = true }) => {
-        if (!walletConfig || walletConfig.recoveryMethod !== RecoveryMethod.AUTOMATIC || !automaticRecovery) {
+        console.log("tryUseWallet", { walletConfig, automaticRecovery });
+        if ((!(walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.createEncryptedSessionEndpoint) && !(walletConfig === null || walletConfig === void 0 ? void 0 : walletConfig.getEncryptionSession)) || !automaticRecovery) {
+            // If there is no encryption session, we cannot create a wallet
             return {};
         }
-        const wallet = await setActiveWallet({
-            connector: embeddedWalletId,
-        });
-        if (wallet.error && signOutOnError) {
-            // If there was an error and we should log out, we can call the logout function
-            await signOut();
+        const wallets = await queryClient.ensureQueryData({ queryKey: ['openfortEmbeddedWalletList'] });
+        console.log("WALLETS", wallets);
+        let wallet;
+        if (wallets.length === 0) {
+            const createWalletResult = await createWallet();
+            if (createWalletResult.error && signOutOnError) {
+                console.error("Error creating wallet:", createWalletResult.error);
+                // If there was an error and we should log out, we can call the logout function
+                await signOut();
+                return {};
+            }
+            wallet = createWalletResult.wallet;
         }
-        return wallet;
+        // Has a wallet with automatic recovery
+        if (wallets.some(w => w.recoveryMethod === RecoveryMethod.AUTOMATIC)) {
+            const setWalletResult = await setActiveWallet({
+                connector: embeddedWalletId,
+            });
+            if (!setWalletResult.wallet || (setWalletResult.error && signOutOnError)) {
+                console.error("Error recovering wallet:", setWalletResult.error);
+                // If there was an error and we should log out, we can call the logout function
+                await signOut();
+            }
+            wallet = setWalletResult.wallet;
+        }
+        return { wallet };
     }, [walletConfig, setActiveWallet, signOut]);
     return {
         tryUseWallet,
@@ -12426,7 +12826,7 @@ const useEmailAuth = (hookOptions = {}) => {
         });
         setRequiresEmailVerification(false);
     }, []);
-    const { tryUseWallet } = useCreateWalletPostAuth();
+    const { tryUseWallet } = useConnectToWalletPostAuth();
     const signInEmail = useCallback(async (options) => {
         var _a;
         try {
@@ -12747,7 +13147,7 @@ const useOAuth = (hookOptions = {}) => {
     const [status, setStatus] = useState({
         status: "idle",
     });
-    const { tryUseWallet } = useCreateWalletPostAuth();
+    const { tryUseWallet } = useConnectToWalletPostAuth();
     const storeCredentials = useCallback(async ({ player, accessToken, refreshToken, ...options }) => {
         setStatus({
             status: 'loading',
@@ -12995,7 +13395,7 @@ const useGuestAuth = (hookOptions = {}) => {
     const [status, setStatus] = useState({
         status: "idle",
     });
-    const { tryUseWallet } = useCreateWalletPostAuth();
+    const { tryUseWallet } = useConnectToWalletPostAuth();
     const signUpGuest = useCallback(async (options = {}) => {
         try {
             setStatus({
@@ -13218,5 +13618,5 @@ const useWalletAuth = (hookOptions = {}) => {
     };
 };
 
-export { AuthProvider, Avatar, Chain as ChainIcon, OPENFORT_VERSION, OpenfortButton, OpenfortError, OpenfortErrorType, OpenfortProvider, OpenfortStatus, Openfortcontext, embeddedWalletId, defaultConfig as getDefaultConfig, defaultConnectors as getDefaultConnectors, useAuthCallback, useChainIsSupported, useChains, useConnectWithSiwe, useEmailAuth, useGuestAuth, useOAuth, useOpenfortCore as useOpenfort, useSignOut, useStatus, useUI, useUser, useWallet, useWalletAuth, useWallets, wallets };
+export { AuthProvider, Avatar, Chain as ChainIcon, OPENFORT_VERSION, OpenfortButton, OpenfortError, OpenfortErrorType, OpenfortProvider, OpenfortStatus, embeddedWalletId, defaultConfig as getDefaultConfig, defaultConnectors as getDefaultConnectors, useAuthCallback, useChainIsSupported, useChains, useConnectWithSiwe, useEmailAuth, useGuestAuth, useOAuth, useOpenfortCore as useOpenfort, useSignOut, useStatus, useUI, useUser, useWallet, useWalletAuth, useWallets, wallets };
 //# sourceMappingURL=index.es.js.map