@abstraxn/signer-react 3.3.9 → 4.0.0

package/dist/src/components/AbstraxnProvider/AbstraxnProviderInner.js

@@ -4,22 +4,154 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
  * This component contains all the wallet state management and operations
  */
 import { useEffect, useState, useRef, useCallback, useMemo, } from "react";
-import { AbstraxnWallet, AuthenticationError, } from "@abstraxn/signer-core";
+import { AbstraxnWallet, AuthenticationError, SignMfaRequiredError, TURNKEY_SUPPORTED_CAIP2, NATIVE_ASSET_SENTINEL, chainIdToCaip2, isNativeAssetEntry, extractAssetAddress, } from "@abstraxn/signer-core";
 import { OnboardingUIWeb } from "../OnboardingUI";
+import { requestSignMfaCode } from "../../signMfaBridge";
 import { useConnectionEffect, } from "wagmi";
 import { parseEther, createPublicClient, http } from "viem";
-import { ExternalWalletButtons, resetExternalWalletViewState, } from "../../ExternalWalletButtons";
+import { ExternalWalletButtons, resetExternalWalletViewState, isExternalWalletListOpen, } from "../../ExternalWalletButtons";
 import { EVM_CHAINS, SOLANA_CHAINS, getChainById, toCoreChain, } from "../../chains";
 import { AbstraxnContext } from "./context";
 import { isLinkAuthCallback } from "./utils";
 import { hasActiveWalletConnectSession, hasPendingWalletConnectApproval, isWalletConnectConnector, patchWalletConnectProviderForMobile, rememberCurrentPageForWalletReturn, resumeWalletConnectRelayer, subscribeWalletConnectForegroundResume, syncWalletConnectDappRedirect, } from "../../walletConnectMobile";
+import { SignMfaModalHost } from "../WalletModal/components/SignMfaModalHost";
 /** Syncs wagmi disconnect to external wallet state; only rendered when wagmi is available (under WagmiProvider). */
 function WagmiConnectionEffectSync({ onDisconnect, }) {
     useConnectionEffect({ onDisconnect });
     return null;
 }
 export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }) {
-    const { isInitialized, setIsInitialized, isConnected, setIsConnected, address, setAddress, user, setUser, whoami, setWhoami, chainId, setChainId, error, setError, loading, setLoading, resending, setResending, walletBalance, setWalletBalance, onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef, } = base;
+    const { isInitialized, setIsInitialized, isConnected, setIsConnected, address, setAddress, user, setUser, whoami, setWhoami, chainId, setChainId, error, setError, loading, setLoading, resending, setResending, walletBalance, setWalletBalance, tokenBalances, setTokenBalances, tokenBalancesLoading, setTokenBalancesLoading, tokenBalancesError, setTokenBalancesError, onboardingRef, otpIdRef, walletRef, googleCallbackHandledRef, twitterCallbackHandledRef, discordCallbackHandledRef, } = base;
+    const handleShowMoreWallets = useCallback(() => {
+        // Hide email and Google sections when "More wallets" is clicked
+        const onboardingAny = onboardingRef.current;
+        if (onboardingAny?.emailForm) {
+            onboardingAny.emailForm.style.display = "none";
+        }
+        if (onboardingAny?.googleButton) {
+            onboardingAny.googleButton.style.display = "none";
+        }
+        // Hide Discord and X (Twitter) buttons when wallet selection screen is shown
+        if (onboardingAny?.discordButton) {
+            onboardingAny.discordButton.style.display = "none";
+        }
+        if (onboardingAny?.twitterButton) {
+            onboardingAny.twitterButton.style.display = "none";
+        }
+        // Hide social grid if it exists
+        if (onboardingAny?.socialGrid) {
+            onboardingAny.socialGrid.style.display = "none";
+        }
+        // Extra guard: hide any social icon buttons by class
+        if (onboardingAny?.rootElement) {
+            onboardingAny.rootElement
+                .querySelectorAll(".onboarding-button-social-icon, .onboarding-button-social")
+                .forEach((el) => {
+                el.style.display = "none";
+            });
+        }
+        // Hide all passkey elements when wallet selection screen is shown
+        if (onboardingAny?.passkeyLoginButton) {
+            onboardingAny.passkeyLoginButton.style.display = "none";
+        }
+        if (onboardingAny?.passkeySignupLink) {
+            onboardingAny.passkeySignupLink.style.display = "none";
+        }
+        if (onboardingAny?.passkeyErrorElement) {
+            onboardingAny.passkeyErrorElement.style.display = "none";
+        }
+        if (onboardingAny?.passkeyDivider) {
+            onboardingAny.passkeyDivider.style.display = "none";
+        }
+        if (onboardingAny?.externalWalletDivider) {
+            onboardingAny.externalWalletDivider.style.display = "none";
+        }
+        // Also hide the divider between email and Google if it exists
+        if (onboardingAny?.divider) {
+            onboardingAny.divider.style.display = "none";
+        }
+    }, [onboardingRef]);
+    const handleHideMoreWallets = useCallback(() => {
+        // Show email and Google sections when back is clicked
+        const onboardingAny = onboardingRef.current;
+        const authMethods = onboardingAny?.config?.authMethods || [
+            "otp",
+            "google",
+        ];
+        const showEmail = authMethods.includes("otp");
+        const showGoogle = authMethods.includes("google");
+        const showTwitter = authMethods.includes("twitter");
+        const showDiscord = authMethods.includes("discord");
+        const showPasskey = authMethods.includes("passkey");
+        if (onboardingAny?.emailForm) {
+            onboardingAny.emailForm.style.display = showEmail ? "" : "none";
+        }
+        if (onboardingAny?.googleButton) {
+            onboardingAny.googleButton.style.display = showGoogle
+                ? ""
+                : "none";
+        }
+        // Show Discord and X (Twitter) buttons if enabled
+        if (onboardingAny?.discordButton) {
+            onboardingAny.discordButton.style.display = showDiscord
+                ? ""
+                : "none";
+        }
+        if (onboardingAny?.twitterButton) {
+            onboardingAny.twitterButton.style.display = showTwitter
+                ? ""
+                : "none";
+        }
+        // Show social grid if it exists and social methods are enabled
+        if (onboardingAny?.socialGrid) {
+            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
+            onboardingAny.socialGrid.style.display = hasSocialMethods
+                ? ""
+                : "none";
+        }
+        // Extra guard: restore social icon buttons by class based on flags
+        if (onboardingAny?.rootElement) {
+            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
+            onboardingAny.rootElement
+                .querySelectorAll(".onboarding-button-social-icon, .onboarding-button-social")
+                .forEach((el) => {
+                el.style.display = hasSocialMethods
+                    ? ""
+                    : "none";
+            });
+        }
+        // Show passkey controls if enabled
+        if (onboardingAny?.passkeyLoginButton) {
+            onboardingAny.passkeyLoginButton.style.display = showPasskey
+                ? ""
+                : "none";
+        }
+        if (onboardingAny?.passkeySignupLink) {
+            onboardingAny.passkeySignupLink.style.display = showPasskey
+                ? ""
+                : "none";
+        }
+        if (onboardingAny?.passkeyErrorElement) {
+            onboardingAny.passkeyErrorElement.style.display = "none";
+        }
+        // Show passkey divider if passkey is enabled and there are other auth methods
+        if (onboardingAny?.passkeyDivider) {
+            onboardingAny.passkeyDivider.style.display =
+                showPasskey &&
+                    (showEmail || showGoogle || showTwitter || showDiscord)
+                    ? ""
+                    : "none";
+        }
+        // Show divider between email and social methods if both are enabled
+        if (onboardingAny?.divider) {
+            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
+            onboardingAny.divider.style.display =
+                showEmail && hasSocialMethods ? "" : "none";
+        }
+        if (onboardingAny?.externalWalletDivider) {
+            onboardingAny.externalWalletDivider.style.display = "";
+        }
+    }, [onboardingRef]);
     const externalWalletsEnabled = config.externalWallets?.enabled ?? false;
     // Keep a ref to avoid re-creating callbacks when toggling config (prevents flicker)
     const externalWalletsEnabledRef = useRef(externalWalletsEnabled);
@@ -249,7 +381,13 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                     const showEmail = authMethods.includes("otp");
                     const showGoogle = authMethods.includes("google");
                     const hasEmailOrGoogle = showEmail || showGoogle;
-                    if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
+                    // Wallet list open: email is hidden — never re-show the "or" divider.
+                    if (isExternalWalletListOpen()) {
+                        if (onboardingAny.externalWalletDivider) {
+                            onboardingAny.externalWalletDivider.style.display = "none";
+                        }
+                    }
+                    else if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
                         onboardingAny.externalWalletDivider.style.display = "";
                     }
                     else if (onboardingAny.externalWalletDivider) {
@@ -375,9 +513,30 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
     ]); // Re-run if wagmi state changes
     // Initialize wallet
     useEffect(() => {
-        // If wallet already exists (from previous mount), reuse it to prevent flicker
+        // If wallet already exists (from previous mount), reuse it to prevent flicker.
+        // StrictMode still destroys OnboardingUIWeb in cleanup — rebuild its shadow
+        // tree here so the OAuth success loader can paint again while Mount1's
+        // in-flight callback finishes.
         if (walletRef.current) {
-            return;
+            const onboarding = onboardingRef.current;
+            if (onboarding && !onboarding.hasLiveShadow()) {
+                onboarding.init();
+                if (typeof window !== "undefined") {
+                    const urlParams = new URLSearchParams(window.location.search);
+                    const hasSuccess = urlParams.get("success") === "true";
+                    const mfaRequired = urlParams.get("mfaRequired") === "true";
+                    if (hasSuccess &&
+                        !mfaRequired &&
+                        !isLinkAuthCallback(urlParams)) {
+                        onboarding.showLoadingModal();
+                    }
+                }
+            }
+            return () => {
+                if (onboardingRef.current) {
+                    onboardingRef.current.destroy();
+                }
+            };
         }
         // Compute supported chains from chain config (outside useMemo since we're in useEffect)
         // This should include ALL chains that might be shown in the UI (availableChains)
@@ -545,10 +704,21 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         walletInstance.on("chainChanged", (newChainId) => {
             setChainId(newChainId);
         });
-        // Initialize OnboardingUI only if not already created (prevents flicker on config change)
-        if (onboardingRef.current) {
+        // Initialize OnboardingUI only if not already created (prevents flicker on config change).
+        // A destroyed StrictMode instance leaves a non-null ref with no live shadow — treat that
+        // as "not created" so we rebuild instead of skipping OAuth loader setup.
+        if (onboardingRef.current?.hasLiveShadow()) {
             return;
         }
+        if (onboardingRef.current) {
+            try {
+                onboardingRef.current.destroy();
+            }
+            catch {
+                // Ignore — instance may already be partially torn down.
+            }
+            onboardingRef.current = null;
+        }
         const uiConfig = config.ui || {};
         const onboarding = new OnboardingUIWeb({
             logo: uiConfig.logo,
@@ -889,16 +1059,10 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                 resetExternalWalletViewState();
             },
         }, externalWalletsEnabled); // Pass externalWalletsEnabled as second parameter
-        // Inject custom CSS if provided
-        if (uiConfig.customCSS) {
-            const styleId = "abstraxn-custom-css";
-            if (!document.getElementById(styleId)) {
-                const style = document.createElement("style");
-                style.id = styleId;
-                style.textContent = uiConfig.customCSS;
-                document.head.appendChild(style);
-            }
-        }
+        // Note: customCSS is injected by OnboardingUIWeb itself (already threaded
+        // into its constructor config above as `customCSS: uiConfig.customCSS`),
+        // inside its own shadow container — this used to be duplicated here via
+        // a separate document.head injection, which is now redundant and removed.
         const hasAuthParams = (params) => params.get("success") === "true" ||
             params.get("error") ||
             params.get("code") ||
@@ -932,6 +1096,7 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         // Hide immediately - use synchronous approach to prevent flicker
         // Only hide if NOT handling a callback
         const onboardingAny = onboarding;
+        let oauthLoaderTimeout = null;
         if (!shouldKeepOpen && onboardingAny.modalOverlay) {
             // Hide immediately without delay to prevent flicker
             onboardingAny.modalOverlay.classList.remove("onboarding-modal-open");
@@ -943,9 +1108,9 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
             // Skip when mfaRequired=true so MFA verification screen can show instead.
             const mfaRequired = urlParams.get("mfaRequired") === "true";
             if (!mfaRequired) {
-                setTimeout(() => {
+                oauthLoaderTimeout = setTimeout(() => {
                     const onboardingInstance = onboardingRef.current;
-                    if (onboardingInstance && onboardingInstance.showLoadingModal) {
+                    if (onboardingInstance) {
                         onboardingInstance.showLoadingModal();
                     }
                 }, 150);
@@ -1283,8 +1448,14 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
             });
         }
         return () => {
+            if (oauthLoaderTimeout !== null) {
+                clearTimeout(oauthLoaderTimeout);
+            }
             if (onboardingRef.current) {
                 onboardingRef.current.destroy();
+                // Keep the instance in the ref so StrictMode remount can call init() on the
+                // same object (preserving auth callbacks / config). destroy() already clears
+                // the shadow tree; the walletRef early-return path re-inits it.
             }
         };
     }, []); // Only run once on mount
@@ -1312,9 +1483,16 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         }
         if (onboardingRef.current) {
             const onboarding = onboardingRef.current;
-            // Re-initialize if destroyed
+            // Re-initialize if destroyed.
+            // Uses `.isConnected`, not `document.body.contains(...)`: the modal
+            // overlay now lives inside a shadow root, and `contains()` walks the
+            // tree via `parentNode` — a ShadowRoot's `parentNode` is always null,
+            // so `contains()` would report "not attached" even when the modal is
+            // genuinely still live, forcing a needless re-init on every call.
+            // `isConnected` is defined in terms of the shadow-including root, so it
+            // correctly reports true across shadow boundaries.
             if (!onboarding.modalOverlay ||
-                !document.body.contains(onboarding.modalOverlay)) {
+                !onboarding.modalOverlay.isConnected) {
                 onboarding.init();
                 // Wait for init to complete
                 setTimeout(() => {
@@ -1349,7 +1527,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                                     const showEmail = authMethods.includes("otp");
                                     const showGoogle = authMethods.includes("google");
                                     const hasEmailOrGoogle = showEmail || showGoogle;
-                                    if (onboarding.externalWalletDivider && hasEmailOrGoogle) {
+                                    if (isExternalWalletListOpen()) {
+                                        if (onboarding.externalWalletDivider) {
+                                            onboarding.externalWalletDivider.style.display = "none";
+                                        }
+                                    }
+                                    else if (onboarding.externalWalletDivider && hasEmailOrGoogle) {
                                         onboarding.externalWalletDivider.style.display = "";
                                     }
                                     else if (onboarding.externalWalletDivider) {
@@ -1444,7 +1627,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                             const showEmail = authMethods.includes("otp");
                             const showGoogle = authMethods.includes("google");
                             const hasEmailOrGoogle = showEmail || showGoogle;
-                            if (onboarding.externalWalletDivider && hasEmailOrGoogle) {
+                            if (isExternalWalletListOpen()) {
+                                if (onboarding.externalWalletDivider) {
+                                    onboarding.externalWalletDivider.style.display = "none";
+                                }
+                            }
+                            else if (onboarding.externalWalletDivider && hasEmailOrGoogle) {
                                 onboarding.externalWalletDivider.style.display = "";
                             }
                             else if (onboarding.externalWalletDivider) {
@@ -2491,7 +2679,27 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         if (!walletRef.current?.isConnected) {
             throw new Error("Wallet not connected");
         }
-        return await walletRef.current.disableMfaWithSignedPayload();
+        const performDisable = () => walletRef.current.disableMfaWithSignedPayload();
+        try {
+            return await performDisable();
+        }
+        catch (error) {
+            // Safety net: if sign MFA was not cleared (or expired between verify and confirm),
+            // open the shared sign-MFA modal, verify-sign, then retry once.
+            const isSignMfaRequired = error instanceof SignMfaRequiredError ||
+                error?.code === "SIGN_MFA_REQUIRED" ||
+                (typeof error?.message === "string" &&
+                    error.message.includes("SIGN_MFA_REQUIRED"));
+            if (!isSignMfaRequired) {
+                throw error;
+            }
+            const code = await requestSignMfaCode();
+            const verifyResponse = await walletRef.current.verifySignMfa(code);
+            if (!verifyResponse?.verified) {
+                throw new Error("Incorrect MFA code. Please try again.");
+            }
+            return await performDisable();
+        }
     }, []);
     const [mfaStatus, setMfaStatus] = useState(null);
     const [mfaStatusLoading, setMfaStatusLoading] = useState(false);
@@ -3392,44 +3600,153 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         }
         return map;
     }, [config.chains]);
-    // Fetch balance for Abstraxn wallet (not external wallet) - reusable for on-demand refetch
+    // Guards against overlapping concurrent fetches for the same address+chain (e.g. if
+    // multiple callers trigger a refetch in quick succession) - a defense-in-depth measure
+    // on top of the effect triggers being keyed off primitives rather than callback identity.
+    const balanceFetchInFlightKeyRef = useRef(null);
+    // Fetch native balance + full token list for the Abstraxn wallet (not external wallet)
+    // in one combined refresh - reusable for on-demand refetch. Turnkey is called at most
+    // once per refresh; native-balance extraction and token-list mapping are independently
+    // try/caught so a failure in one cannot corrupt the other (see plan review point D).
     const refetchWalletBalance = useCallback(async () => {
         if (isExternalWalletConnected || !address || !currentChainId) {
             setWalletBalance(null);
+            setTokenBalances([]);
+            setTokenBalancesError(null);
+            return;
+        }
+        const fetchKey = `${address}:${currentChainId}`;
+        if (balanceFetchInFlightKeyRef.current === fetchKey) {
             return;
         }
+        balanceFetchInFlightKeyRef.current = fetchKey;
         try {
             const currentChain = getChainById(currentChainId) || customChainsById.get(currentChainId);
             if (!currentChain || currentChain.type !== "evm") {
                 setWalletBalance(null);
+                setTokenBalances([]);
+                setTokenBalancesError(null);
                 return;
             }
-            const publicClient = createPublicClient({
-                chain: {
-                    id: currentChain.id,
-                    name: currentChain.name,
-                    nativeCurrency: currentChain.nativeCurrency,
-                    rpcUrls: {
-                        default: {
-                            http: [currentChain.rpcUrl],
+            const fetchRpcNativeBalance = async () => {
+                const publicClient = createPublicClient({
+                    chain: {
+                        id: currentChain.id,
+                        name: currentChain.name,
+                        nativeCurrency: currentChain.nativeCurrency,
+                        rpcUrls: {
+                            default: {
+                                http: [currentChain.rpcUrl],
+                            },
                         },
                     },
-                },
-                transport: http(currentChain.rpcUrl),
-            });
-            const balance = await publicClient.getBalance({
-                address: address,
-            });
-            setWalletBalance(balance);
-        }
-        catch (error) {
-            console.error("Failed to fetch balance:", error);
-            setWalletBalance(null);
+                    transport: http(currentChain.rpcUrl),
+                });
+                return await publicClient.getBalance({ address: address });
+            };
+            const caip2 = chainIdToCaip2(currentChainId, TURNKEY_SUPPORTED_CAIP2);
+            const wallet = walletRef.current;
+            if (caip2 && wallet) {
+                setTokenBalancesLoading(true);
+                let entries = [];
+                let turnkeyCallFailed = false;
+                try {
+                    entries = await wallet.getTurnkeyBalances(caip2, address);
+                }
+                catch (error) {
+                    turnkeyCallFailed = true;
+                    console.warn("Turnkey balance fetch failed, falling back to RPC:", error);
+                }
+                if (!turnkeyCallFailed) {
+                    // Native balance extraction - its own try/catch, independent of the token list.
+                    try {
+                        const nativeEntry = entries.find((entry) => isNativeAssetEntry({ caip19: entry.caip19, symbol: entry.symbol, decimals: entry.decimals }, currentChain.nativeCurrency));
+                        setWalletBalance(nativeEntry?.balance !== undefined ? BigInt(nativeEntry.balance) : null);
+                    }
+                    catch (error) {
+                        console.error("Failed to extract native balance from Turnkey response:", error);
+                        setWalletBalance(null);
+                    }
+                    // Token list mapping - its own try/catch, per-entry skip on parse failure.
+                    try {
+                        const tokens = [];
+                        for (const entry of entries) {
+                            try {
+                                const isNative = isNativeAssetEntry({ caip19: entry.caip19, symbol: entry.symbol, decimals: entry.decimals }, currentChain.nativeCurrency);
+                                const tokenAddress = isNative
+                                    ? NATIVE_ASSET_SENTINEL
+                                    : extractAssetAddress({ caip19: entry.caip19 });
+                                if (!isNative && tokenAddress === undefined) {
+                                    console.warn("Skipping unrecognized asset in balance list:", entry.caip19);
+                                    continue;
+                                }
+                                tokens.push({
+                                    address: tokenAddress,
+                                    symbol: entry.symbol ?? "",
+                                    name: entry.name ?? entry.symbol ?? "",
+                                    decimals: entry.decimals ?? 18,
+                                    balance: entry.balance !== undefined ? BigInt(entry.balance) : 0n,
+                                    isNative,
+                                });
+                            }
+                            catch (entryError) {
+                                console.warn("Skipping malformed balance entry:", entryError);
+                            }
+                        }
+                        setTokenBalances(tokens);
+                        setTokenBalancesError(null);
+                    }
+                    catch (error) {
+                        setTokenBalancesError(error instanceof Error ? error : new Error("Failed to load token balances"));
+                    }
+                    finally {
+                        setTokenBalancesLoading(false);
+                    }
+                    return;
+                }
+                setTokenBalancesLoading(false);
+            }
+            // Not Turnkey-covered, or the Turnkey call itself failed - fall back to RPC for
+            // native balance, and mirror it as a single native-only token list entry so both
+            // stay consistent with each other.
+            try {
+                const balance = await fetchRpcNativeBalance();
+                setWalletBalance(balance);
+                setTokenBalances([
+                    {
+                        address: NATIVE_ASSET_SENTINEL,
+                        symbol: currentChain.nativeCurrency.symbol,
+                        name: currentChain.nativeCurrency.name,
+                        decimals: currentChain.nativeCurrency.decimals,
+                        balance,
+                        isNative: true,
+                    },
+                ]);
+                setTokenBalancesError(null);
+            }
+            catch (error) {
+                console.error("Failed to fetch balance:", error);
+                setWalletBalance(null);
+                setTokenBalancesError(error instanceof Error ? error : new Error("Failed to load balance"));
+            }
         }
-    }, [address, currentChainId, isExternalWalletConnected, customChainsById]);
+        finally {
+            if (balanceFetchInFlightKeyRef.current === fetchKey) {
+                balanceFetchInFlightKeyRef.current = null;
+            }
+        }
+    }, [address, currentChainId, isExternalWalletConnected, customChainsById, walletRef]);
+    const refetchTokenBalances = refetchWalletBalance;
+    // Trigger on the actual primitives that should cause a refetch - not on
+    // refetchWalletBalance's own identity, which can churn on unrelated re-renders
+    // (e.g. if the consuming app passes `config` as a fresh object/array literal every
+    // render, customChainsById's memo recomputes and gives this callback a new identity
+    // even though nothing relevant changed). Depending on the callback there caused a
+    // continuous refetch loop instead of "once per real change".
+    // eslint-disable-next-line react-hooks/exhaustive-deps
     useEffect(() => {
         refetchWalletBalance();
-    }, [refetchWalletBalance]);
+    }, [address, currentChainId, isExternalWalletConnected]);
     // Single refetch for UI: Abstraxn wallet = RPC call, external wallet = wagmi refetch
     const refetchBalance = useCallback(async () => {
         if (isExternalWalletConnected && wagmiBalance?.refetch) {
@@ -3521,15 +3838,19 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
     }, [currentChainId, customChainsById]);
     // Enhanced switchChain that works for both EVM and Solana
     const switchChainEnhanced = useCallback(async (targetChainId) => {
+        console.log("[switchChainEnhanced] called with", targetChainId);
         if (!walletRef.current) {
+            console.log("[switchChainEnhanced] aborting: wallet not initialized");
             throw new Error("Wallet not initialized");
         }
         // Check if chain is in availableChains (user-configured chains)
         const targetChainInAvailable = availableChains?.find((c) => c.id === targetChainId);
+        console.log("[switchChainEnhanced] targetChainInAvailable:", targetChainInAvailable, "availableChains ids:", availableChains?.map((c) => c.id));
         if (!targetChainInAvailable) {
             throw new Error(`Chain with ID ${targetChainId} is not available. Please configure it in your SDK setup.`);
         }
         const targetChain = getChainById(targetChainId) || customChainsById.get(targetChainId);
+        console.log("[switchChainEnhanced] resolved targetChain:", targetChain);
         if (!targetChain) {
             throw new Error(`Chain with ID ${targetChainId} is not supported`);
         }
@@ -3539,21 +3860,27 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
             if (targetChain.type === "evm") {
                 // For EVM chains, use the existing switchChain
                 if (isExternalWalletConnected && wagmiSwitchChain) {
+                    console.log("[switchChainEnhanced] external wallet path - calling wagmi switchChainAsync");
                     // External wallet - use wagmi switchChain
                     await wagmiSwitchChain.switchChainAsync({ chainId: targetChainId });
                     setExternalWalletChainId(targetChainId);
+                    console.log("[switchChainEnhanced] wagmi switchChainAsync resolved");
                 }
                 else {
+                    console.log("[switchChainEnhanced] embedded wallet path - calling switchChain()");
                     // Abstraxn wallet - try to switch, but if chain is not in wallet's supportedChains,
                     // we'll update the state directly (for chains that are in availableChains but not in wallet config)
                     try {
                         await switchChain(targetChainId);
+                        console.log("[switchChainEnhanced] switchChain() resolved without throwing");
                     }
                     catch (switchErr) {
+                        console.log("[switchChainEnhanced] switchChain() threw:", switchErr?.message, switchErr);
                         // If the wallet doesn't support this chain, but it's in availableChains,
                         // we can still update the state to allow UI to work
                         if (switchErr?.message?.includes("not supported") &&
                             targetChainInAvailable) {
+                            console.log("[switchChainEnhanced] recovering via direct setChainId fallback");
                             // Update chainId state directly for chains in availableChains
                             setChainId(targetChainId);
                             // Emit chainChanged event if wallet supports it
@@ -3563,6 +3890,7 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                             }
                         }
                         else {
+                            console.log("[switchChainEnhanced] NOT recovering - rethrowing");
                             throw switchErr;
                         }
                     }
@@ -3576,10 +3904,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
             }
             // Update chainId state
             if (!isExternalWalletConnected) {
+                console.log("[switchChainEnhanced] final setChainId call with", targetChainId);
                 setChainId(targetChainId);
             }
         }
         catch (err) {
+            console.log("[switchChainEnhanced] caught at top level:", err);
             const error = err instanceof Error
                 ? err
                 : new Error(`Failed to switch to chain ${targetChainId}: ${err instanceof Error ? err.message : String(err)}`);
@@ -3800,6 +4130,10 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         // Balance (for Abstraxn wallet)
         walletBalance: !isExternalWalletConnected ? walletBalance : undefined,
         refetchBalance,
+        tokenBalances: !isExternalWalletConnected ? tokenBalances : [],
+        tokenBalancesLoading,
+        tokenBalancesError,
+        refetchTokenBalances,
         // Connection type
         connectionType,
         // Pre-fill email for email-OTP flow
@@ -3846,7 +4180,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
             const showEmail = authMethods.includes("otp");
             const showGoogle = authMethods.includes("google");
             const hasEmailOrGoogle = showEmail || showGoogle;
-            if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
+            if (isExternalWalletListOpen()) {
+                if (onboardingAny.externalWalletDivider) {
+                    onboardingAny.externalWalletDivider.style.display = "none";
+                }
+            }
+            else if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
                 onboardingAny.externalWalletDivider.style.display = "";
             }
             else if (onboardingAny.externalWalletDivider) {
@@ -3866,84 +4205,13 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         // Check if the container is the same as the one we created the root for
         const isSameContainer = externalWalletContainerRef.current === container;
         const rootStillValid = externalWalletRootRef.current && containerInDOM && isSameContainer;
-        const renderExternalWalletButtons = () => (_jsx(AbstraxnContext.Provider, { value: valueRef.current, children: _jsx(ExternalWalletButtons, { onConnect: async () => { }, onShowMoreWallets: () => {
-                    const onboardingAny = onboardingRef.current;
-                    if (onboardingAny?.emailForm) {
-                        onboardingAny.emailForm.style.display = "none";
-                    }
-                    if (onboardingAny?.googleButton) {
-                        onboardingAny.googleButton.style.display = "none";
-                    }
-                    // Hide all passkey elements when wallet selection screen is shown
-                    if (onboardingAny?.passkeyLoginButton) {
-                        onboardingAny.passkeyLoginButton.style.display = "none";
-                    }
-                    if (onboardingAny?.passkeySignupLink) {
-                        onboardingAny.passkeySignupLink.style.display = "none";
-                    }
-                    if (onboardingAny?.passkeyErrorElement) {
-                        onboardingAny.passkeyErrorElement.style.display = "none";
-                    }
-                    if (onboardingAny?.passkeyDivider) {
-                        onboardingAny.passkeyDivider.style.display = "none";
-                    }
-                    if (onboardingAny?.externalWalletDivider) {
-                        onboardingAny.externalWalletDivider.style.display = "none";
-                    }
-                    if (onboardingAny?.divider) {
-                        onboardingAny.divider.style.display = "none";
-                    }
-                }, onHideMoreWallets: () => {
-                    const onboardingAny = onboardingRef.current;
-                    const authMethods = onboardingAny?.config?.authMethods || [
-                        "otp",
-                        "google",
-                    ];
-                    const showEmail = authMethods.includes("otp");
-                    const showGoogle = authMethods.includes("google");
-                    const showPasskey = authMethods.includes("passkey");
-                    if (onboardingAny?.emailForm) {
-                        onboardingAny.emailForm.style.display = showEmail ? "" : "none";
-                    }
-                    if (onboardingAny?.googleButton) {
-                        onboardingAny.googleButton.style.display = showGoogle
-                            ? ""
-                            : "none";
-                    }
-                    // Show passkey controls if enabled
-                    if (onboardingAny?.passkeyLoginButton) {
-                        onboardingAny.passkeyLoginButton.style.display = showPasskey
-                            ? ""
-                            : "none";
-                    }
-                    if (onboardingAny?.passkeySignupLink) {
-                        onboardingAny.passkeySignupLink.style.display = showPasskey
-                            ? ""
-                            : "none";
-                    }
-                    if (onboardingAny?.passkeyErrorElement) {
-                        onboardingAny.passkeyErrorElement.style.display = "none";
-                    }
-                    // Show passkey divider if passkey is enabled and there are other auth methods
-                    if (onboardingAny?.passkeyDivider) {
-                        onboardingAny.passkeyDivider.style.display =
-                            showPasskey && (showEmail || showGoogle) ? "" : "none";
-                    }
-                    if (onboardingAny?.divider) {
-                        onboardingAny.divider.style.display =
-                            showEmail && showGoogle ? "" : "none";
-                    }
-                    const hasEmailOrGoogle = showEmail || showGoogle;
-                    if (onboardingAny?.externalWalletDivider && hasEmailOrGoogle) {
-                        onboardingAny.externalWalletDivider.style.display = "";
-                    }
-                    else if (onboardingAny?.externalWalletDivider) {
-                        onboardingAny.externalWalletDivider.style.display = "none";
-                    }
-                } }) }));
+        const renderExternalWalletButtons = () => (_jsx(AbstraxnContext.Provider, { value: valueRef.current, children: _jsx(ExternalWalletButtons, { onConnect: async () => { }, onShowMoreWallets: handleShowMoreWallets, onHideMoreWallets: handleHideMoreWallets }) }));
         if (rootStillValid) {
             externalWalletRootRef.current.render(renderExternalWalletButtons());
             externalWalletMountedRef.current = true;
+            if (isExternalWalletListOpen()) {
+                handleShowMoreWallets();
+            }
         }
         else {
             try {
@@ -3965,6 +4233,9 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                 externalWalletContainerRef.current = container; // Track the container
                 rootInstance.render(renderExternalWalletButtons());
                 externalWalletMountedRef.current = true;
+                if (isExternalWalletListOpen()) {
+                    handleShowMoreWallets();
+                }
             }
             catch (error) {
                 externalWalletMountedRef.current = false;
@@ -4037,7 +4308,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                     const showEmail = authMethods.includes("otp");
                     const showGoogle = authMethods.includes("google");
                     const hasEmailOrGoogle = showEmail || showGoogle;
-                    if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
+                    if (isExternalWalletListOpen()) {
+                        if (onboardingAny.externalWalletDivider) {
+                            onboardingAny.externalWalletDivider.style.display = "none";
+                        }
+                    }
+                    else if (onboardingAny.externalWalletDivider && hasEmailOrGoogle) {
                         onboardingAny.externalWalletDivider.style.display = "";
                     }
                     else if (onboardingAny.externalWalletDivider) {
@@ -4088,91 +4364,11 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
                 rootInstance.render(_jsx(AbstraxnContext.Provider, { value: valueRef.current, children: _jsx(ExternalWalletButtons, { onConnect: async (_connectorId, _address) => {
                             // console.log('External wallet connected:', connectorId, address);
                             // Modal will be closed automatically by the useEffect that watches wagmiAccount
-                        }, onShowMoreWallets: () => {
-                            // Hide email and Google sections when "More wallets" is clicked
-                            const onboardingAny = onboardingRef.current;
-                            if (onboardingAny?.emailForm) {
-                                onboardingAny.emailForm.style.display = "none";
-                            }
-                            if (onboardingAny?.googleButton) {
-                                onboardingAny.googleButton.style.display = "none";
-                            }
-                            // Hide all passkey elements when wallet selection screen is shown
-                            if (onboardingAny?.passkeyLoginButton) {
-                                onboardingAny.passkeyLoginButton.style.display = "none";
-                            }
-                            if (onboardingAny?.passkeySignupLink) {
-                                onboardingAny.passkeySignupLink.style.display = "none";
-                            }
-                            if (onboardingAny?.passkeyErrorElement) {
-                                onboardingAny.passkeyErrorElement.style.display = "none";
-                            }
-                            if (onboardingAny?.passkeyDivider) {
-                                onboardingAny.passkeyDivider.style.display = "none";
-                            }
-                            if (onboardingAny?.externalWalletDivider) {
-                                onboardingAny.externalWalletDivider.style.display = "none";
-                            }
-                            // Also hide the divider between email and Google if it exists
-                            if (onboardingAny?.divider) {
-                                onboardingAny.divider.style.display = "none";
-                            }
-                        }, onHideMoreWallets: () => {
-                            // Show email and Google sections when back is clicked (restore initial screen)
-                            const onboardingAny = onboardingRef.current;
-                            const authMethods = onboardingAny?.config?.authMethods || [
-                                "otp",
-                                "google",
-                            ];
-                            const showEmail = authMethods.includes("otp");
-                            const showGoogle = authMethods.includes("google");
-                            const showPasskey = authMethods.includes("passkey");
-                            // Show email form if enabled
-                            if (onboardingAny?.emailForm) {
-                                onboardingAny.emailForm.style.display = showEmail
-                                    ? ""
-                                    : "none";
-                            }
-                            // Show Google button if enabled
-                            if (onboardingAny?.googleButton) {
-                                onboardingAny.googleButton.style.display = showGoogle
-                                    ? ""
-                                    : "none";
-                            }
-                            // Show passkey controls if enabled
-                            if (onboardingAny?.passkeyLoginButton) {
-                                onboardingAny.passkeyLoginButton.style.display = showPasskey
-                                    ? ""
-                                    : "none";
-                            }
-                            if (onboardingAny?.passkeySignupLink) {
-                                onboardingAny.passkeySignupLink.style.display = showPasskey
-                                    ? ""
-                                    : "none";
-                            }
-                            if (onboardingAny?.passkeyErrorElement) {
-                                onboardingAny.passkeyErrorElement.style.display = "none";
-                            }
-                            // Show passkey divider if passkey is enabled and there are other auth methods
-                            if (onboardingAny?.passkeyDivider) {
-                                onboardingAny.passkeyDivider.style.display =
-                                    showPasskey && (showEmail || showGoogle) ? "" : "none";
-                            }
-                            // Show divider between email and Google if both are enabled
-                            if (onboardingAny?.divider) {
-                                onboardingAny.divider.style.display =
-                                    showEmail && showGoogle ? "" : "none";
-                            }
-                            // Show the "or" divider before external wallets only if email/Google are visible
-                            const hasEmailOrGoogle = showEmail || showGoogle;
-                            if (onboardingAny?.externalWalletDivider && hasEmailOrGoogle) {
-                                onboardingAny.externalWalletDivider.style.display = "";
-                            }
-                            else if (onboardingAny?.externalWalletDivider) {
-                                onboardingAny.externalWalletDivider.style.display = "none";
-                            }
-                        } }) }));
+                        }, onShowMoreWallets: handleShowMoreWallets, onHideMoreWallets: handleHideMoreWallets }) }));
                 externalWalletMountedRef.current = true;
+                if (isExternalWalletListOpen()) {
+                    handleShowMoreWallets();
+                }
             }
             catch (error) {
                 console.error("Failed to mount ExternalWalletButtons:", error);
@@ -4216,140 +4412,12 @@ export function AbstraxnProviderInner({ config, children, base, wagmi, solana, }
         try {
             externalWalletRootRef.current.render(_jsx(AbstraxnContext.Provider, { value: valueRef.current, children: _jsx(ExternalWalletButtons, { onConnect: async (_connectorId, _address) => {
                         // console.log('External wallet connected:', connectorId, address);
-                    }, onShowMoreWallets: () => {
-                        // Hide email and Google sections when "More wallets" is clicked
-                        const onboardingAny = onboardingRef.current;
-                        if (onboardingAny?.emailForm) {
-                            onboardingAny.emailForm.style.display = "none";
-                        }
-                        if (onboardingAny?.googleButton) {
-                            onboardingAny.googleButton.style.display = "none";
-                        }
-                        // Hide Discord and X (Twitter) buttons when wallet selection screen is shown
-                        if (onboardingAny?.discordButton) {
-                            onboardingAny.discordButton.style.display = "none";
-                        }
-                        if (onboardingAny?.twitterButton) {
-                            onboardingAny.twitterButton.style.display = "none";
-                        }
-                        // Hide social grid if it exists
-                        if (onboardingAny?.socialGrid) {
-                            onboardingAny.socialGrid.style.display = "none";
-                        }
-                        // Extra guard: hide any social icon buttons by class
-                        if (onboardingAny?.rootElement) {
-                            onboardingAny.rootElement
-                                .querySelectorAll(".onboarding-button-social-icon, .onboarding-button-social")
-                                .forEach((el) => {
-                                el.style.display = "none";
-                            });
-                        }
-                        // Hide all passkey elements when wallet selection screen is shown
-                        if (onboardingAny?.passkeyLoginButton) {
-                            onboardingAny.passkeyLoginButton.style.display = "none";
-                        }
-                        if (onboardingAny?.passkeySignupLink) {
-                            onboardingAny.passkeySignupLink.style.display = "none";
-                        }
-                        if (onboardingAny?.passkeyErrorElement) {
-                            onboardingAny.passkeyErrorElement.style.display = "none";
-                        }
-                        if (onboardingAny?.passkeyDivider) {
-                            onboardingAny.passkeyDivider.style.display = "none";
-                        }
-                        if (onboardingAny?.externalWalletDivider) {
-                            onboardingAny.externalWalletDivider.style.display = "none";
-                        }
-                        // Also hide the divider between email and Google if it exists
-                        if (onboardingAny?.divider) {
-                            onboardingAny.divider.style.display = "none";
-                        }
-                    }, onHideMoreWallets: () => {
-                        // Show email and Google sections when back is clicked
-                        const onboardingAny = onboardingRef.current;
-                        const authMethods = onboardingAny?.config?.authMethods || [
-                            "otp",
-                            "google",
-                        ];
-                        const showEmail = authMethods.includes("otp");
-                        const showGoogle = authMethods.includes("google");
-                        const showTwitter = authMethods.includes("twitter");
-                        const showDiscord = authMethods.includes("discord");
-                        const showPasskey = authMethods.includes("passkey");
-                        if (onboardingAny?.emailForm) {
-                            onboardingAny.emailForm.style.display = showEmail ? "" : "none";
-                        }
-                        if (onboardingAny?.googleButton) {
-                            onboardingAny.googleButton.style.display = showGoogle
-                                ? ""
-                                : "none";
-                        }
-                        // Show Discord and X (Twitter) buttons if enabled
-                        if (onboardingAny?.discordButton) {
-                            onboardingAny.discordButton.style.display = showDiscord
-                                ? ""
-                                : "none";
-                        }
-                        if (onboardingAny?.twitterButton) {
-                            onboardingAny.twitterButton.style.display = showTwitter
-                                ? ""
-                                : "none";
-                        }
-                        // Show social grid if it exists and social methods are enabled
-                        if (onboardingAny?.socialGrid) {
-                            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
-                            onboardingAny.socialGrid.style.display = hasSocialMethods
-                                ? ""
-                                : "none";
-                        }
-                        // Extra guard: restore social icon buttons by class based on flags
-                        if (onboardingAny?.rootElement) {
-                            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
-                            onboardingAny.rootElement
-                                .querySelectorAll(".onboarding-button-social-icon, .onboarding-button-social")
-                                .forEach((el) => {
-                                el.style.display = hasSocialMethods
-                                    ? ""
-                                    : "none";
-                            });
-                        }
-                        // Show passkey controls if enabled
-                        if (onboardingAny?.passkeyLoginButton) {
-                            onboardingAny.passkeyLoginButton.style.display = showPasskey
-                                ? ""
-                                : "none";
-                        }
-                        if (onboardingAny?.passkeySignupLink) {
-                            onboardingAny.passkeySignupLink.style.display = showPasskey
-                                ? ""
-                                : "none";
-                        }
-                        if (onboardingAny?.passkeyErrorElement) {
-                            onboardingAny.passkeyErrorElement.style.display = "none";
-                        }
-                        // Show passkey divider if passkey is enabled and there are other auth methods
-                        if (onboardingAny?.passkeyDivider) {
-                            onboardingAny.passkeyDivider.style.display =
-                                showPasskey &&
-                                    (showEmail || showGoogle || showTwitter || showDiscord)
-                                    ? ""
-                                    : "none";
-                        }
-                        // Show divider between email and social methods if both are enabled
-                        if (onboardingAny?.divider) {
-                            const hasSocialMethods = showGoogle || showTwitter || showDiscord;
-                            onboardingAny.divider.style.display =
-                                showEmail && hasSocialMethods ? "" : "none";
-                        }
-                        if (onboardingAny?.externalWalletDivider) {
-                            onboardingAny.externalWalletDivider.style.display = "";
-                        }
-                    } }) }));
+                    }, onShowMoreWallets: handleShowMoreWallets, onHideMoreWallets: handleHideMoreWallets }) }));
         }
         catch (error) {
             console.warn("Failed to update ExternalWalletButtons:", error);
         }
     }, [value, externalWalletsEnabled]);
-    return (_jsxs(AbstraxnContext.Provider, { value: value, children: [wagmi ? (_jsx(WagmiConnectionEffectSync, { onDisconnect: handleWagmiDisconnect })) : null, children] }));
+    return (_jsxs(AbstraxnContext.Provider, { value: value, children: [wagmi ? (_jsx(WagmiConnectionEffectSync, { onDisconnect: handleWagmiDisconnect })) : null, children, _jsx(SignMfaModalHost, {})] }));
 }
 //# sourceMappingURL=AbstraxnProviderInner.js.map