@lumiapassport/ui-kit 1.13.10 → 1.13.11

package/dist/index.js

@@ -2458,6 +2458,7 @@ var init_iframe_manager = __esm({
         this.iframe = null;
         this.sessionToken = null;
         this.isReady = false;
+        // private themeColors?: IframeManagerConfig['themeColors']
         // Message handling
         this.pendingRequests = /* @__PURE__ */ new Map();
         this.usedNonces = /* @__PURE__ */ new Set();
@@ -2477,14 +2478,13 @@ var init_iframe_manager = __esm({
         this.projectId = config.projectId;
         this.debug = config.debug || false;
         this.onWalletReadyCallback = config.onWalletReady;
-        this.themeColors = config.themeColors;
         this.readyPromise = new Promise((resolve) => {
           this.readyResolve = resolve;
         });
         this.log("[IframeManager] Initialized with:", {
           iframeUrl: this.iframeUrl,
-          projectId: this.projectId,
-          hasThemeColors: !!this.themeColors
+          projectId: this.projectId
+          // hasThemeColors: !!this.themeColors
         });
       }
       /**
@@ -2496,16 +2496,6 @@ var init_iframe_manager = __esm({
         }
         this.iframe = document.createElement("iframe");
         let iframeUrl = this.iframeUrl;
-        if (this.themeColors) {
-          const params = new URLSearchParams();
-          if (this.themeColors.background) params.set("bg", this.themeColors.background);
-          if (this.themeColors.text) params.set("text", this.themeColors.text);
-          if (this.themeColors.textSecondary) params.set("textSec", this.themeColors.textSecondary);
-          if (this.themeColors.border) params.set("border", this.themeColors.border);
-          if (params.toString()) {
-            iframeUrl += (iframeUrl.includes("?") ? "&" : "?") + params.toString();
-          }
-        }
         this.iframe.src = iframeUrl;
         this.iframe.id = "lumia-passport-iframe";
         this.iframe.style.display = "none";
@@ -4260,7 +4250,7 @@ import {
   createContext,
   useCallback as useCallback20,
   useContext,
-  useEffect as useEffect32,
+  useEffect as useEffect31,
   useMemo as useMemo3,
   useRef as useRef11
 } from "react";
@@ -4272,7 +4262,7 @@ import { create as create5 } from "zustand";
 // src/internal/components/BalanceFeedProvider/BalanceFeedProvider.tsx
 init_base();
 import { useQuery } from "@tanstack/react-query";
-import { useEffect as useEffect2, useState } from "react";
+import { useEffect, useState } from "react";
 import { useBalance } from "wagmi";
 
 // src/internal/hooks/useLayoutDataStore.ts
@@ -4281,13 +4271,13 @@ import { create } from "zustand";
 // src/internal/constants.ts
 init_assets();
 import { Key as Key2, Mail as Mail2, Wallet2 as Wallet22 } from "lucide-react";
+var LOCAL_COLOR_MODE_KEY = "lumia-passport-theme";
 var DEFAULT_AUTH_MENU_HEIGHT = 253;
 var DEFAULT_MAIN_MENU_HEIGHT = 90;
 var DEFAULT_SETTINGS_MENU_HEIGHT = 346;
 var MAX_CONTENT_HEIGHT = 640;
 var MAIN_DIALOG_ANIMATION_SPEED = 375;
 var Y_ANIMATION_SETUP = { duration: 0.15, ease: "easeInOut", height: { duration: 0.375 } };
-var LOCAL_COLOR_MODE_KEY = "lumia-passport-theme";
 var PROVIDERS_META2 = {
   passkey: { name: "Passkey", icon: Key2, description: "Biometric authentication" },
   email: { name: "Email", icon: Mail2, description: "Email verification" },
@@ -4347,166 +4337,20 @@ var useLayoutDataStore = create((set) => ({
   })
 }));
 
-// src/internal/hooks/useLumiaPriceSSE.ts
-import { useMutation } from "@tanstack/react-query";
-import { useEffect } from "react";
-
-// src/internal/lib/LumiaPriceSSEService.ts
-var FALLBACK = "https://fallback.lumia.passport.io";
-var API_DOMAIN = (true ? "" : FALLBACK) || FALLBACK;
-var LumiaPriceSSEService = class {
-  // private readonly baseUrl: string = API_DOMAIN
-  constructor() {
-    this.eventSource = null;
-    this.listeners = /* @__PURE__ */ new Set();
-    this.currentPrice = null;
-    this.isConnected = false;
-    this.reconnectTimeout = null;
-  }
-  connect() {
-    return new Promise((resolve, reject) => {
-      console.log("[LumiaPriceSSEService]: Connecting to LUMIA Price SSE...");
-      if (this.isConnected) {
-        resolve();
-        return;
-      }
-      try {
-        this.eventSource = new EventSource(`${API_DOMAIN}/api/lumia/sse`);
-        this.eventSource.onopen = () => {
-          console.log("[LumiaPriceSSEService]: LUMIA Price SSE connected");
-          this.isConnected = true;
-          this.clearReconnectTimeout();
-          resolve();
-        };
-        this.eventSource.onmessage = () => {
-        };
-        this.eventSource.addEventListener("rate", (event) => {
-          try {
-            const data = JSON.parse(event.data);
-            if (data.price !== void 0 && data.symbol === "LUMIAUSDT") {
-              this.currentPrice = typeof data.price === "number" ? data.price : parseFloat(data.price);
-              if (this.currentPrice !== null) {
-                const update = {
-                  symbol: data.symbol,
-                  price: this.currentPrice,
-                  ts: data.ts || Date.now()
-                };
-                this.listeners.forEach((listener) => listener(update));
-              }
-            }
-          } catch (error) {
-            console.error("Error parsing price event:", error, event.data);
-          }
-        });
-        this.eventSource.addEventListener("ping", () => {
-        });
-        this.eventSource.onerror = (error) => {
-          console.error("LUMIA Price SSE error:", error);
-          this.isConnected = false;
-          if (this.eventSource?.readyState === EventSource.CLOSED) {
-            console.log("SSE connection closed, attempting to reconnect...");
-            this.scheduleReconnect();
-            reject(error);
-          }
-        };
-        setTimeout(() => {
-          if (!this.isConnected) {
-            reject(new Error("SSE connection timeout"));
-          }
-        }, 1e4);
-      } catch (error) {
-        reject(error);
-      }
-    });
-  }
-  disconnect() {
-    this.clearReconnectTimeout();
-    if (this.eventSource) {
-      this.eventSource.close();
-      this.eventSource = null;
-    }
-    this.isConnected = false;
-    this.currentPrice = null;
-    console.log("[LumiaPriceSSEService]: LUMIA Price SSE disconnected");
-  }
-  addListener(listener) {
-    this.listeners.add(listener);
-  }
-  removeListener(listener) {
-    this.listeners.delete(listener);
-  }
-  clearListeners() {
-    this.listeners.clear();
-  }
-  getCurrentPrice() {
-    return this.currentPrice;
-  }
-  getConnectionStatus() {
-    return this.isConnected;
-  }
-  scheduleReconnect() {
-    this.clearReconnectTimeout();
-    this.reconnectTimeout = window.setTimeout(() => {
-      console.log("Attempting to reconnect to BTC Price SSE...");
-      this.connect().catch((error) => {
-        console.error("Reconnection failed:", error);
-        this.scheduleReconnect();
-      });
-    }, 5e3);
-  }
-  clearReconnectTimeout() {
-    if (this.reconnectTimeout) {
-      clearTimeout(this.reconnectTimeout);
-      this.reconnectTimeout = null;
-    }
-  }
-};
-var lumiaPriceSSE = new LumiaPriceSSEService();
-async function sseConnectMutation() {
-  try {
-    await lumiaPriceSSE.connect();
-    console.info("[LUMIA SSE] price feed connected");
-    return { ok: true };
-  } catch (error) {
-    console.error("[LUMIA SSE] Error connecting to SSE:", error);
-    throw new Error("[LUMIA SSE] Error connecting to SSE");
-  }
-}
-
-// src/internal/hooks/useLumiaPriceSSE.ts
-function useLumiaPriceSSE(enabled, updateCurrentPrice) {
-  const { mutate: connectSSE } = useMutation({
-    mutationFn: sseConnectMutation,
-    onSuccess: () => {
-      lumiaPriceSSE.addListener(updateCurrentPrice);
-    },
-    onError: (err) => {
-      console.error("Lumia Price SSE connection error:", err);
-    }
-  });
-  useEffect(() => {
-    const isConnected = lumiaPriceSSE.getConnectionStatus();
-    console.log("[LUMIA PRICE SSE MANAGER] SSE status:", { enabled, isConnected });
-    if (!enabled) {
-      lumiaPriceSSE.clearListeners();
-      lumiaPriceSSE.disconnect();
-      return;
-    }
-    return () => {
-      lumiaPriceSSE.clearListeners();
-      lumiaPriceSSE.disconnect();
-    };
-  }, [enabled, connectSSE]);
-}
-
 // src/internal/components/BalanceFeedProvider/BalanceFeedProvider.tsx
 var BALANCE_POLLING_INTERVAL = 3e4;
+async function getAssetRate(symbol = "LUMIA", fiat = "USDT") {
+  const assetURL = `https://api.binance.com/api/v3/ticker/price?symbol=${symbol.toUpperCase()}${fiat.toUpperCase()}`;
+  const response = await fetch(assetURL);
+  return await response.json();
+}
+var LUMIA_RATE_QUERY_KEY = "lumia-passport-rate-query-key";
 function BalanceFeedProvider() {
   const config = useLumiaPassportConfig().config;
   const address = useLumiaPassportSession((st) => st.address);
-  const { cryptoRate, setCryptoRate, setFiatBalance, setBalance, setCryptoSymbol, setFiatSymbol } = useLayoutDataStore();
+  const { setCryptoRate, setFiatBalance, setBalance, setCryptoSymbol, setFiatSymbol } = useLayoutDataStore();
   const [balanceSymbol, setBalanceSymbol] = useState(null);
-  useEffect2(() => {
+  useEffect(() => {
     const { assets, showBalanceAs: customBalanceSymbol } = config.current?.projectAssets || {};
     const { balanceQuery, balanceQueryKey } = assets?.find((a) => a.symbol === customBalanceSymbol) || {};
     const isCustom = !!customBalanceSymbol && !!balanceQuery && !!balanceQueryKey;
@@ -4523,14 +4367,31 @@ function BalanceFeedProvider() {
       refetchOnWindowFocus: true
     }
   });
-  useLumiaPriceSSE(isNativeBalanceFeedEnabled, (update) => setCryptoRate(update?.price || 1));
-  useEffect2(() => {
-    if (!isNativeBalanceFeedEnabled || !balance?.value) return;
+  const { data: cryptoRate } = useQuery({
+    queryKey: [LUMIA_RATE_QUERY_KEY, address],
+    enabled: !!address && !!isNativeBalanceFeedEnabled,
+    refetchInterval: BALANCE_POLLING_INTERVAL,
+    queryFn: async () => getAssetRate("LUMIA", "USDT")
+    // TODO: get LUMIA-FIAT pair from config
+  });
+  useEffect(() => {
+    const rate = cryptoRate ? Number(cryptoRate.price) : null;
+    if (!isNativeBalanceFeedEnabled || !balance || !rate) return;
+    setCryptoRate(rate);
     setCryptoSymbol("LUMIA");
     setFiatSymbol("USD");
-    setFiatBalance(Number(balance?.formatted || 0) * cryptoRate);
+    setFiatBalance(Number(balance?.formatted || 0) * rate);
     setBalance(balance);
-  }, [isNativeBalanceFeedEnabled, balance, cryptoRate, setFiatBalance, setBalance, setCryptoSymbol, setFiatSymbol]);
+  }, [
+    isNativeBalanceFeedEnabled,
+    balance,
+    cryptoRate,
+    setFiatBalance,
+    setCryptoRate,
+    setBalance,
+    setCryptoSymbol,
+    setFiatSymbol
+  ]);
   const {
     balanceQuery: customBalanceQuery,
     balanceQueryKey: CUSTOM_BALANCE_QUERY_KEY,
@@ -4545,7 +4406,7 @@ function BalanceFeedProvider() {
     // should be invalidated by host app via provided queryKey
     queryFn: async () => await customBalanceQuery?.()
   });
-  useEffect2(() => {
+  useEffect(() => {
     if (!isCustomBalanceEnabled || !customBalance) return;
     const { cryptoFiatRate, fiatFormatted, cryptoFormatted, cryptoSymbol, fiatSymbol } = customBalance;
     setCryptoSymbol(cryptoSymbol.toUpperCase());
@@ -4564,12 +4425,12 @@ function BalanceFeedProvider() {
 
 // src/internal/components/Dialog/LumiaPassportDialog.tsx
 import { AnimatePresence as AnimatePresence4, motion as motion4 } from "framer-motion";
-import { useEffect as useEffect30 } from "react";
+import { useEffect as useEffect29 } from "react";
 
 // package.json
 var package_default = {
   name: "@lumiapassport/ui-kit",
-  version: "1.13.10",
+  version: "1.13.11",
   description: "React UI components and hooks for Lumia Passport authentication and Account Abstraction",
   type: "module",
   main: "./dist/index.cjs",
@@ -4657,7 +4518,7 @@ var package_default = {
 };
 
 // src/internal/components/Footer/Footer.tsx
-import { useMutation as useMutation2 } from "@tanstack/react-query";
+import { useMutation } from "@tanstack/react-query";
 import { Loader, LogOut } from "lucide-react";
 
 // src/internal/assets/LumiaLogo.tsx
@@ -4718,21 +4579,6 @@ init_base();
 // src/internal/lib/utils.ts
 import { clsx } from "clsx";
 import { twMerge } from "tailwind-merge";
-var LP_JWT_TOKENS_LS_KEY = "lumia-passport-jwt-tokens";
-function getBearer() {
-  try {
-    const sessionString = localStorage.getItem(LP_JWT_TOKENS_LS_KEY);
-    if (!sessionString) return null;
-    const session = JSON.parse(sessionString);
-    if (session && typeof session.accessToken === "string" && typeof session.userId === "string") {
-      return `Bearer ${session.accessToken}`;
-    }
-    return null;
-  } catch (error) {
-    console.error("Failed to parse Lumia Passport session:", error);
-    return null;
-  }
-}
 function cn(...inputs) {
   return twMerge(clsx(inputs));
 }
@@ -4802,7 +4648,7 @@ function Footer() {
   const { callbacks } = useLumiaPassportConfig();
   const { address, setSession, setAddress, setStatus, setError, setIsLoading } = useLumiaPassportSession();
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const { mutate: disconnect, isPending: isDisconnecting } = useMutation2({
+  const { mutate: disconnect, isPending: isDisconnecting } = useMutation({
     mutationFn: async (disconnectAddress) => {
       if (!disconnectAddress) throw new Error("No address to disconnect");
       setError(null);
@@ -5166,10 +5012,7 @@ var DialogOverlay = forwardRef3(
 DialogOverlay.displayName = DialogPrimitive.Overlay.displayName;
 function useDecideContentStyles() {
   const isMobileView = useLayoutStore((st) => st.isMobileView);
-  const isDialogOpen = useLayoutStore((st) => st.isDialogOpen);
-  const isDialogClosing = useLayoutStore((st) => st.isDialogClosing);
-  const isClosing = isDialogOpen && isDialogClosing;
-  console.log("[IS_MOBILE_VIEW]", isMobileView);
+  const isClosing = useLayoutStore((st) => !!st.isDialogOpen && !!st.isDialogClosing);
   const mobileStyles = isMobileView ? { "--l-pass-maw": "100%", "--l-pass-bdrs": "20px 20px 0px 0px" } : {};
   return {
     isClosing,
@@ -5204,7 +5047,6 @@ var DialogContent = forwardRef3(
               ref,
               style: !!className ? void 0 : CONTENT_BG_SETUP,
               className: cn(
-                // isWalletLinking ? 'pointer-events-none' : 'pointer-events-auto',
                 "relative pointer-events-auto w-full",
                 "max-w-[var(--l-pass-maw)] max-h-[95dvh] p-0 gap-0",
                 "text-[var(--l-pass-fg)]",
@@ -5283,7 +5125,7 @@ import { jsx as jsx10 } from "react/jsx-runtime";
 var VisuallyHidden = ({ children }) => /* @__PURE__ */ jsx10("span", { className: "sr-only absolute w-px h-px p-0 -m-px overflow-hidden whitespace-nowrap border-0", children });
 
 // src/internal/hooks/useAutoConnect.ts
-import { useCallback, useEffect as useEffect3, useRef } from "react";
+import { useCallback, useEffect as useEffect2, useRef } from "react";
 function useAutoConnect() {
   const {
     config: { current: config },
@@ -5338,7 +5180,7 @@ function useAutoConnect() {
     [usePaymaster, setStatus, callbacks]
   );
   const autoConnectAttemptedRef = useRef(false);
-  useEffect3(() => {
+  useEffect2(() => {
     if (autoConnectAttemptedRef.current) return;
     setIsLoading(true);
     const tryAutoConnect = async (attempt) => {
@@ -5457,11 +5299,11 @@ function useAutoConnect() {
 }
 
 // src/internal/hooks/useBackupStatusChanges.ts
-import { useEffect as useEffect4 } from "react";
+import { useEffect as useEffect3 } from "react";
 init_vaultClient();
 function useBackupStatusChanges() {
   const setHasServerVault = useLumiaPassportSession((st) => st.setHasServerVault);
-  useEffect4(() => {
+  useEffect3(() => {
     const handleBackupStatusChanged = async (event) => {
       const customEvent = event;
       const { method, success } = customEvent.detail || {};
@@ -5487,13 +5329,13 @@ function useBackupStatusChanges() {
 }
 
 // src/internal/hooks/useCheckVaultStatus.ts
-import { useMutation as useMutation3 } from "@tanstack/react-query";
-import { useEffect as useEffect5 } from "react";
+import { useMutation as useMutation2 } from "@tanstack/react-query";
+import { useEffect as useEffect4 } from "react";
 init_vaultClient();
 function useCheckVaultStatus() {
   const address = useLumiaPassportSession((st) => st.address);
   const setHasServerVault = useLumiaPassportSession((st) => st.setHasServerVault);
-  const { mutate: checkVaultStatus } = useMutation3({
+  const { mutate: checkVaultStatus } = useMutation2({
     mutationFn: async () => {
       const stats = await getShareRecoveryStats();
       const hasRecoveryData = stats && (stats.created || stats.devices && stats.devices.length > 0);
@@ -5507,7 +5349,7 @@ function useCheckVaultStatus() {
       setHasServerVault(false);
     }
   });
-  useEffect5(() => {
+  useEffect4(() => {
     if (!address) return setHasServerVault(false);
     checkVaultStatus();
   }, [address, checkVaultStatus]);
@@ -5515,7 +5357,7 @@ function useCheckVaultStatus() {
 
 // src/internal/hooks/useDetectMaxScrollHeight.ts
 import { debounce } from "lodash-es";
-import { useCallback as useCallback2, useEffect as useEffect6 } from "react";
+import { useCallback as useCallback2, useEffect as useEffect5 } from "react";
 var DEBOUNCE_DELAY = 50;
 function useDetectMaxScrollHeight() {
   const setIsMobileView = useLayoutStore((state) => state.setIsMobileView);
@@ -5528,7 +5370,7 @@ function useDetectMaxScrollHeight() {
     }, DEBOUNCE_DELAY),
     [setMaxScrollHeight, setIsMobileView]
   );
-  useEffect6(() => {
+  useEffect5(() => {
     const obs = new ResizeObserver(([entry]) => onResize(entry.contentRect));
     const doc = window.document.getElementsByTagName("html")[0];
     if (doc) obs.observe(doc);
@@ -5537,12 +5379,12 @@ function useDetectMaxScrollHeight() {
 }
 
 // src/internal/hooks/usePageMapper.tsx
-import { useCallback as useCallback17, useEffect as useEffect27 } from "react";
+import { useCallback as useCallback17, useEffect as useEffect26 } from "react";
 
 // src/internal/components/AuthMenu/AuthMenu.tsx
 import { AnimatePresence, motion } from "framer-motion";
 import { Loader as Loader5 } from "lucide-react";
-import { useEffect as useEffect10, useMemo } from "react";
+import { useEffect as useEffect9, useMemo } from "react";
 
 // src/internal/components/AuthMenu/AuthFailedStep.tsx
 import { AlertTriangle, Cross } from "lucide-react";
@@ -5828,12 +5670,12 @@ function PasskeyAddIcon(props) {
 init_auth();
 
 // src/internal/components/Expandable/hooks/useExpandable.ts
-import { useCallback as useCallback3, useEffect as useEffect7, useRef as useRef3 } from "react";
+import { useCallback as useCallback3, useEffect as useEffect6, useRef as useRef3 } from "react";
 var useExpandable = (props) => {
   const { isExpanded = false, children, initHeight = 0, minHeight = 0 } = props;
   const expandableRef = useRef3(null);
   const contentRef = useRef3(null);
-  useEffect7(() => {
+  useEffect6(() => {
     if (!expandableRef.current) return;
     expandableRef.current.style.setProperty("--ifo-basic-expandable-h", `${initHeight}px )`);
   }, []);
@@ -5848,7 +5690,7 @@ var useExpandable = (props) => {
     //  ON_RESIZE_DELEAY),
     [minHeight]
   );
-  useEffect7(() => {
+  useEffect6(() => {
     if (!contentRef.current || !expandableRef.current) return;
     const obs = new ResizeObserver(() => setExpandableHeight(isExpanded));
     obs.observe(expandableRef.current);
@@ -6107,7 +5949,7 @@ import { Fragment as Fragment2 } from "react";
 // src/internal/components/AuthMenu/SignInStep/Email.tsx
 init_lumiaPassport();
 init_projectId();
-import { useMutation as useMutation4 } from "@tanstack/react-query";
+import { useMutation as useMutation3 } from "@tanstack/react-query";
 import { ChevronRight, Loader as Loader3, Mail as Mail3 } from "lucide-react";
 
 // src/internal/components/ui/highlight.tsx
@@ -6143,7 +5985,7 @@ function Email() {
   const isLoading = useLumiaPassportSession((st) => st.isLoading);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
   const { email, codeSendError, alert: alert2, setEmail, setCodeSendError, setExpiresIn, setStep, setAlert } = useAuthStore();
-  const { mutate: onSendVerificationCode } = useMutation4({
+  const { mutate: onSendVerificationCode } = useMutation3({
     mutationFn: async (mail) => {
       const isEmailValid = mail.length !== 0 && /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(mail);
       if (!isEmailValid) {
@@ -6950,7 +6792,7 @@ function useAuthMenuHandlers() {
 }
 
 // src/internal/components/AuthMenu/useListenIframeAuthEvents.ts
-import { useCallback as useCallback7, useEffect as useEffect8 } from "react";
+import { useCallback as useCallback7, useEffect as useEffect7 } from "react";
 function useListenIframeAuthEvents() {
   const setPage = useLayoutDataStore((state) => state.setPage);
   const setIsIframeReady = useLumiaPassportSession((state) => state.setIsIframeReady);
@@ -6972,7 +6814,7 @@ function useListenIframeAuthEvents() {
     },
     [setPage, setIsIframeReady]
   );
-  useEffect8(() => {
+  useEffect7(() => {
     window.addEventListener("message", handleIframeMessage);
     return () => window.removeEventListener("message", handleIframeMessage);
   }, [handleIframeMessage]);
@@ -6980,7 +6822,7 @@ function useListenIframeAuthEvents() {
 
 // src/internal/components/AuthMenu/VerifyStep/VerifyStep.tsx
 init_lumiaPassport();
-import { useMutation as useMutation5 } from "@tanstack/react-query";
+import { useMutation as useMutation4 } from "@tanstack/react-query";
 import { ArrowLeft as ArrowLeft3, Loader as Loader4 } from "lucide-react";
 
 // src/internal/assets/OtpIcon.tsx
@@ -7001,21 +6843,21 @@ init_auth();
 init_projectId();
 
 // src/internal/components/AuthMenu/VerifyStep/VerificationCodeInput.tsx
-import { useEffect as useEffect9, useRef as useRef5, useState as useState5 } from "react";
+import { useEffect as useEffect8, useRef as useRef5, useState as useState5 } from "react";
 import { jsx as jsx24, jsxs as jsxs18 } from "react/jsx-runtime";
 var VerificationCodeInput = (props) => {
   const { onVerifyCode, onResendCode, isLoading, expiresIn, error } = props;
   const setVerificationError = useAuthStore((st) => st.setVerificationError);
   const [timeLeft, setTimeLeft] = useState5(expiresIn);
-  useEffect9(() => setTimeLeft(expiresIn), [expiresIn]);
-  useEffect9(() => {
+  useEffect8(() => setTimeLeft(expiresIn), [expiresIn]);
+  useEffect8(() => {
     const t = setInterval(() => setTimeLeft((secs) => secs > 0 ? secs - 1 : 0), 1e3);
     return () => clearInterval(t);
   }, []);
   const lastSubmittedRef = useRef5(null);
   const inputsRef = useRef5([]);
   const [digits, setDigits] = useState5(["", "", "", "", "", ""]);
-  useEffect9(() => {
+  useEffect8(() => {
     const code = digits.join("");
     if (code.length === 6 && digits.every((d) => d !== "") && !isLoading) {
       if (lastSubmittedRef.current !== code) {
@@ -7024,7 +6866,7 @@ var VerificationCodeInput = (props) => {
       }
     }
   }, [digits, isLoading, onVerifyCode]);
-  useEffect9(() => {
+  useEffect8(() => {
     const t = setTimeout(() => {
       inputsRef.current[0]?.focus();
     }, 0);
@@ -7149,7 +6991,7 @@ function VerifyStep(props) {
     setEmail,
     setExpiresIn
   } = useAuthStore();
-  const { mutate: onVerifyCode, isPending: isCodeVerifying } = useMutation5({
+  const { mutate: onVerifyCode, isPending: isCodeVerifying } = useMutation4({
     mutationFn: async (code) => {
       setIsLoading(true);
       setVerificationError("");
@@ -7222,7 +7064,7 @@ function VerifyStep(props) {
       setIsLoading(false);
     }
   });
-  const { mutate: onResendCode, isPending: isCodeResending } = useMutation5({
+  const { mutate: onResendCode, isPending: isCodeResending } = useMutation4({
     mutationFn: async () => {
       setVerificationError("");
       setIsLoading(true);
@@ -7300,7 +7142,7 @@ var AuthMenu = () => {
   const isIframeReady = useLumiaPassportSession((st) => st.isIframeReady);
   const page = useLayoutDataStore((st) => st.page);
   const setMainPageHeight = useLayoutDataStore((st) => st.setMainPageHeight);
-  useEffect10(() => setMainPageHeight(DEFAULT_AUTH_MENU_HEIGHT), [setMainPageHeight]);
+  useEffect9(() => setMainPageHeight(DEFAULT_AUTH_MENU_HEIGHT), [setMainPageHeight]);
   const {
     step,
     setStep,
@@ -7311,7 +7153,7 @@ var AuthMenu = () => {
     setFailedMessage,
     setCodeSendError
   } = useAuthStore();
-  useEffect10(() => {
+  useEffect9(() => {
     if (page !== "auth" /* AUTH */) {
       setStep("signin");
       setEmail("");
@@ -7476,9 +7318,9 @@ function RampnowIcon() {
 }
 
 // src/internal/components/BuyMenu/binance/Binance.tsx
-import { useMutation as useMutation6, useQuery as useQuery3, useQueryClient } from "@tanstack/react-query";
+import { useMutation as useMutation5, useQuery as useQuery3, useQueryClient } from "@tanstack/react-query";
 import { DollarSign, LoaderIcon } from "lucide-react";
-import { useEffect as useEffect12, useRef as useRef6 } from "react";
+import { useEffect as useEffect11, useRef as useRef6 } from "react";
 
 // src/internal/components/BuyMenu/components/PaymentSelector.tsx
 import { jsx as jsx29, jsxs as jsxs22 } from "react/jsx-runtime";
@@ -7519,81 +7361,38 @@ var QUERY_KEYS2 = {
 };
 
 // src/internal/components/BuyMenu/binance/api.ts
-var API_DOMAIN2 = "https://api.lumiapassport.com/on-ramp";
+init_iframe_manager();
 async function getLumiaNetworkQuery() {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN2}/api/binance/networks`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...auth && { Authorization: auth }
-    }
-  });
-  const data = await response.json();
-  if (!data?.success) {
-    throw new Error(`${data.code}: ${data.message}`);
-  }
-  const lumiaNetwork = data.data?.find((el) => el.cryptoCurrency === "LUMIA") || null;
-  if (!lumiaNetwork) {
-    console.error("Lumia is not available in Binance pairs API");
-    throw new Error("Lumia is not available in API");
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
   }
-  return lumiaNetwork;
+  return await iframeManager.sendMessage("BINANCE_GET_LUMIA_NETWORK_QUERY", {});
 }
 async function getPaymentMethodsQuery(payload) {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN2}/api/binance/modes`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...auth && { Authorization: auth }
-    },
-    body: JSON.stringify(payload)
-  });
-  const data = await response.json();
-  if (!data.success) {
-    throw new Error(`${data.code}: ${data.message}`);
-  }
-  if (!data.data.paymentMethods.length) {
-    throw new Error("No payment methods available yet");
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
   }
-  return data.data.paymentMethods;
+  return await iframeManager.sendMessage("BINANCE_GET_PAYMENT_METHODS_QUERY", payload);
 }
 async function getQuoteQuery(payload) {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN2}/api/binance/quote`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...auth && { Authorization: auth }
-    },
-    body: JSON.stringify(payload)
-  });
-  const data = await response.json();
-  if (!data.success) {
-    throw new Error(`${data.code}: ${data.message}`);
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
   }
-  return data.data;
+  return await iframeManager.sendMessage("BINANCE_GET_QUOTE_QUERY", payload);
 }
 async function createPreorderMutation(payload) {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN2}/api/binance/pre-order`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...auth && { Authorization: auth }
-    },
-    body: JSON.stringify(payload)
-  });
-  const data = await response.json();
-  if (!data.success) {
-    throw new Error(`${data.code}: ${data.message}`);
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
   }
-  return data.data;
+  return await iframeManager.sendMessage("BINANCE_CREATE_PREORDER_MUTATION", payload);
 }
 
 // src/internal/components/BuyMenu/binance/useQueriesErrorHandler.ts
-import { useEffect as useEffect11 } from "react";
+import { useEffect as useEffect10 } from "react";
 
 // src/internal/components/BuyMenu/binance/utils.ts
 function getPayMethodID(pm) {
@@ -7613,7 +7412,7 @@ function handleErrors(errors) {
 // src/internal/components/BuyMenu/binance/useQueriesErrorHandler.ts
 var useQueriesErrorHandler = (errors, stateUpdater) => {
   const { error: errorTitle, message: errorMessage } = handleErrors(errors);
-  useEffect11(() => {
+  useEffect10(() => {
     if (!errorTitle && !errorMessage) return;
     console.error(`[BuyModal][Binance] ${errorTitle}: ${errorMessage}`);
     stateUpdater(1);
@@ -7662,14 +7461,14 @@ function Binance(props) {
     queryFn: async () => getPaymentMethodsQuery({ totalAmount: String(srcQueryAmount || 1) })
   });
   const lastLoadedPaymentModes = useRef6([]);
-  useEffect12(() => {
+  useEffect11(() => {
     if (!paymentModes?.length) return;
     setPaymentMode(getPayMethodID(paymentModes[0]));
     lastLoadedPaymentModes.current = paymentModes;
   }, [paymentModes]);
   const selectedPaymentMode = paymentModes?.find((el) => getPayMethodID(el) === paymentMode) || null;
   const minimum = Number(selectedPaymentMode?.fiatMinLimit || "0");
-  useEffect12(() => setMinAmount(minimum), [minimum]);
+  useEffect11(() => setMinAmount(minimum), [minimum]);
   const {
     data: quoteData = null,
     isLoading: isQuoteDataLoading,
@@ -7690,7 +7489,7 @@ function Binance(props) {
     [lumiaNetworkError, paymentMethodsError, quoteError],
     setSrcInputAmount
   );
-  const { mutate: checkoutFundWalletOrder, isPending: isFundWalletOrderCheckouting } = useMutation6({
+  const { mutate: checkoutFundWalletOrder, isPending: isFundWalletOrderCheckouting } = useMutation5({
     mutationFn: async () => {
       setRedirecting(true);
       const returnUrl = window.location.href.split("?")[0];
@@ -7714,7 +7513,7 @@ function Binance(props) {
       setRedirecting(false);
     }
   });
-  useEffect12(() => {
+  useEffect11(() => {
     return () => {
       qc.resetQueries({ queryKey: [QUERY_KEYS2.binanceNetworksQuery] });
       qc.resetQueries({ queryKey: [QUERY_KEYS2.binancePaymentModes] });
@@ -7776,36 +7575,25 @@ function Binance(props) {
 }
 
 // src/internal/components/BuyMenu/rampnow/Rampnow.tsx
-import { useMutation as useMutation7, useQuery as useQuery4, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
+import { useMutation as useMutation6, useQuery as useQuery4, useQueryClient as useQueryClient2 } from "@tanstack/react-query";
 import { DollarSign as DollarSign2, LoaderIcon as LoaderIcon2 } from "lucide-react";
-import { useEffect as useEffect13 } from "react";
+import { useEffect as useEffect12 } from "react";
 
 // src/internal/components/BuyMenu/rampnow/api.ts
-var API_DOMAIN3 = "https://api.lumiapassport.com/on-ramp";
+init_iframe_manager();
 async function getRampnowConfigQuery() {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN3}/api/rampnow/cfg`, {
-    method: "GET",
-    headers: { ...auth && { Authorization: auth } }
-  });
-  const data = await response.json();
-  return data;
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
+  }
+  return await iframeManager.sendMessage("RAMPNOW_GET_CONFIG", {});
 }
 async function getRampOrderQuoteQuery(payload) {
-  const auth = getBearer();
-  const response = await fetch(`${API_DOMAIN3}/api/rampnow/quote`, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...auth && { Authorization: auth }
-    },
-    body: JSON.stringify(payload)
-  });
-  const data = await response.json();
-  if (!data.data) {
-    throw new Error(`${data.code}: ${data.message}`);
+  const iframeManager = getIframeManager();
+  if (!iframeManager) {
+    throw new Error("Iframe manager is not initialized");
   }
-  return data;
+  return await iframeManager.sendMessage("RAMPNOW_GET_ORDER_QUOTE", payload);
 }
 
 // src/internal/components/BuyMenu/rampnow/constants.ts
@@ -7843,7 +7631,7 @@ function Rampnow(props) {
     setMinAmount
   } = control;
   const qc = useQueryClient2();
-  useEffect13(() => {
+  useEffect12(() => {
     setMinAmount(MINIMUM_RAMP_AMOUNT);
     setPaymentMode(PAYMENT_MODES[0].id);
   }, []);
@@ -7871,7 +7659,7 @@ function Rampnow(props) {
       paymentMode
     })
   });
-  const { mutate: checkoutFundWalletOrder, isPending: isFundWalletOrderCheckouting } = useMutation7({
+  const { mutate: checkoutFundWalletOrder, isPending: isFundWalletOrderCheckouting } = useMutation6({
     mutationFn: async () => {
       if (!configData?.apiKey?.length || !configData?.orderUrl?.length) {
         throw new Error("RampNow order service is not available");
@@ -7900,7 +7688,7 @@ function Rampnow(props) {
       console.error("Create CheckoutOrder failed:", err);
     }
   });
-  useEffect13(() => {
+  useEffect12(() => {
     return () => {
       qc.resetQueries({ queryKey: [QUERY_KEYS2.getRampNowConfig] });
       qc.resetQueries({ queryKey: [QUERY_KEYS2.getRampNowQuote] });
@@ -7982,7 +7770,7 @@ var RAMP_PROVIDERS = {
 var REDIRECT_TIMEOUT_MS = 1500;
 
 // src/internal/components/BuyMenu/useSelectables.ts
-import { useCallback as useCallback8, useEffect as useEffect14, useRef as useRef7, useState as useState6 } from "react";
+import { useCallback as useCallback8, useEffect as useEffect13, useRef as useRef7, useState as useState6 } from "react";
 
 // src/internal/utils/debounce.ts
 function debounce2(func, waitFor) {
@@ -8011,7 +7799,7 @@ var useSelectables = () => {
     }, ON_INPUT_QUERY_DELAY),
     [minAmount]
   );
-  useEffect14(() => setQueryAmountDebounced(srcInputAmount), [srcInputAmount, setQueryAmountDebounced]);
+  useEffect13(() => setQueryAmountDebounced(srcInputAmount), [srcInputAmount, setQueryAmountDebounced]);
   return {
     inputRef,
     redirecting,
@@ -8074,7 +7862,7 @@ import {
   Loader as Loader6,
   Lock
 } from "lucide-react";
-import React7, { useEffect as useEffect15 } from "react";
+import React7, { useEffect as useEffect14 } from "react";
 init_iframe_manager();
 
 // src/internal/components/ui/checkbox.tsx
@@ -8110,7 +7898,7 @@ function KeyshareBackupMenu() {
   const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
   const userId = session?.mpcUserId || "";
   const onBackupSuccess = () => console.log("[ConnectWalletButton] Backup created successfully");
-  useEffect15(() => {
+  useEffect14(() => {
     if (!userId) setPage("main-menu" /* MAIN_MENU */);
   }, [userId, setPage]);
   const [backupStatus, setBackupStatus] = React7.useState({
@@ -8141,7 +7929,7 @@ function KeyshareBackupMenu() {
       return null;
     }
   }, []);
-  useEffect15(() => {
+  useEffect14(() => {
     const loadCloudProviders = async () => {
       try {
         const { getAvailableCloudProviders: getAvailableCloudProviders3 } = await Promise.resolve().then(() => (init_cloudStorage(), cloudStorage_exports));
@@ -8170,7 +7958,7 @@ function KeyshareBackupMenu() {
       console.error("[KeyshareBackup] Failed to get backup status:", error2);
     }
   }, [iframeManager, userId]);
-  useEffect15(() => {
+  useEffect14(() => {
     refreshStatus();
   }, [refreshStatus]);
   const handleBackup = async (method) => {
@@ -8399,9 +8187,9 @@ function KeyshareBackupMenu() {
 }
 
 // src/internal/components/KeyshareRestoreMenu/KeyshareRestoreMenu.tsx
-import { useMutation as useMutation8 } from "@tanstack/react-query";
+import { useMutation as useMutation7 } from "@tanstack/react-query";
 import { AlertCircle as AlertCircle4, CheckCircle2 as CheckCircle22, Loader as Loader9, LogOut as LogOut2 } from "lucide-react";
-import React8, { useCallback as useCallback9, useEffect as useEffect16 } from "react";
+import React8, { useCallback as useCallback9, useEffect as useEffect15 } from "react";
 init_vaultClient();
 
 // src/internal/components/KeyshareRestoreMenu/NoBackupFound.tsx
@@ -8586,7 +8374,7 @@ var KeyshareRestoreMenu = () => {
   const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
   const setIsDialogForced = useLayoutStore((st) => st.setIsDialogForced);
   const setPage = useLayoutDataStore((st) => st.setPage);
-  useEffect16(() => setIsDialogForced(true), []);
+  useEffect15(() => setIsDialogForced(true), []);
   const { usePaymaster, recoveryUserId, setRecoveryUserId, setSession, setAddress, setStatus, setIsLoading } = useLumiaPassportSession();
   const [error, setError] = React8.useState(null);
   const [success, setSuccess] = React8.useState(null);
@@ -8695,7 +8483,7 @@ var KeyshareRestoreMenu = () => {
     callbacks,
     config.projectId
   ]);
-  useEffect16(() => {
+  useEffect15(() => {
     const checkBackupAvailability = async () => {
       try {
         setCheckingBackup(true);
@@ -8713,7 +8501,7 @@ var KeyshareRestoreMenu = () => {
     };
     checkBackupAvailability();
   }, [recoveryUserId]);
-  const { mutate: restoreFromServer2, isPending: isRestoringFromServer } = useMutation8({
+  const { mutate: restoreFromServer2, isPending: isRestoringFromServer } = useMutation7({
     mutationFn: async () => {
       setError(null);
       setSuccess(null);
@@ -8748,7 +8536,7 @@ var KeyshareRestoreMenu = () => {
       setError(errorMsg);
     }
   });
-  const { mutate: restoreFromFile, isPending: isRestoringFromFile } = useMutation8({
+  const { mutate: restoreFromFile, isPending: isRestoringFromFile } = useMutation7({
     mutationFn: async () => {
       if (!restoreFile) {
         throw new Error("Please select a backup file");
@@ -8782,7 +8570,7 @@ var KeyshareRestoreMenu = () => {
       setError(errorMsg);
     }
   });
-  const { mutate: disconnect, isPending: isDisconnecting } = useMutation8({
+  const { mutate: disconnect, isPending: isDisconnecting } = useMutation7({
     mutationFn: async () => {
       setError(null);
       setStatus("disconnecting");
@@ -8874,7 +8662,7 @@ import { ArrowLeft as ArrowLeft6 } from "lucide-react";
 import { LoaderIcon as LoaderIcon3 } from "lucide-react";
 
 // src/internal/components/KYC/useSumsubIframe.ts
-import { useEffect as useEffect17, useRef as useRef8, useState as useState8 } from "react";
+import { useEffect as useEffect16, useRef as useRef8, useState as useState8 } from "react";
 
 // src/internal/components/KYC/api/sumsub.ts
 init_httpClient();
@@ -9003,7 +8791,7 @@ function useSumsubIframe({ iframeUrl }) {
   const [height, setHeight] = useState8(0);
   const [status, setStatus] = useState8("");
   const levelName = config.kyc?.options?.levelName;
-  useEffect17(() => {
+  useEffect16(() => {
     setError(null);
     setIsLoading(true);
     setStatus("Preparing verification...");
@@ -9111,7 +8899,7 @@ function KycMenu() {
 
 // src/internal/components/MainMenu/MainMenu.tsx
 import { ChevronLeft, ChevronRight as ChevronRight2, DollarSign as DollarSign3, Wallet2 as Wallet23 } from "lucide-react";
-import { useEffect as useEffect18 } from "react";
+import { useEffect as useEffect17 } from "react";
 
 // src/internal/components/MainMenu/BackupWarning.tsx
 import { AnimatePresence as AnimatePresence2, motion as motion2 } from "framer-motion";
@@ -9167,7 +8955,7 @@ function MainMenu() {
   const address = useLumiaPassportSession((st) => st.address);
   const setPage = useLayoutDataStore((st) => st.setPage);
   const setMainPageHeight = useLayoutDataStore((st) => st.setMainPageHeight);
-  useEffect18(() => setMainPageHeight(DEFAULT_MAIN_MENU_HEIGHT), [setMainPageHeight]);
+  useEffect17(() => setMainPageHeight(DEFAULT_MAIN_MENU_HEIGHT), [setMainPageHeight]);
   return /* @__PURE__ */ jsxs33("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
     /* @__PURE__ */ jsx42("div", { className: "grid grid-cols-4 gap-[var(--l-pass-gap)]", children: MAIN_MENU_BUTTONS.map(({ id, label, icon: Icon }) => /* @__PURE__ */ jsxs33(
       Button,
@@ -9241,7 +9029,7 @@ init_passkey2();
 // src/internal/components/ManageWalletMenu/EmailForm.tsx
 init_lumiaPassport();
 init_projectId();
-import { useMutation as useMutation9 } from "@tanstack/react-query";
+import { useMutation as useMutation8 } from "@tanstack/react-query";
 import { ChevronRight as ChevronRight3, Loader as Loader10, Mail as Mail4 } from "lucide-react";
 
 // src/internal/components/ManageWalletMenu/hooks/useStore.ts
@@ -9283,7 +9071,7 @@ function EmailForm() {
   const isLoading = useLumiaPassportSession((st) => st.isLoading);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
   const { email, setEmail, setEmailCodeSentError, setEmailCodeExpiresIn, setEmailStep } = useManageWalletStore();
-  const { mutate: onSendVerificationCode } = useMutation9({
+  const { mutate: onSendVerificationCode } = useMutation8({
     mutationFn: async () => {
       if (!email) return;
       setIsLoading(true);
@@ -9376,10 +9164,10 @@ function useProvidersList() {
 
 // src/internal/components/ManageWalletMenu/hooks/useSendVerificationCode.ts
 init_email();
-import { useMutation as useMutation10 } from "@tanstack/react-query";
+import { useMutation as useMutation9 } from "@tanstack/react-query";
 function useSendVerificationCode() {
   const { setVerificationError, setLinkIsLoading, setEmailCodeSentError, setEmailCodeExpiresIn } = useManageWalletStore();
-  return useMutation10({
+  return useMutation9({
     mutationFn: async (email) => {
       if (!email) {
         throw new Error("Email is required");
@@ -9402,7 +9190,7 @@ function useSendVerificationCode() {
 }
 
 // src/internal/components/ManageWalletMenu/hooks/useVerifyCode.ts
-import { useMutation as useMutation11, useQueryClient as useQueryClient4 } from "@tanstack/react-query";
+import { useMutation as useMutation10, useQueryClient as useQueryClient4 } from "@tanstack/react-query";
 init_email();
 function useVerifyCode() {
   const { callbacks } = useLumiaPassportConfig();
@@ -9420,7 +9208,7 @@ function useVerifyCode() {
     setVerificationError,
     setEmailCodeSentError
   } = useManageWalletStore();
-  return useMutation11({
+  return useMutation10({
     mutationFn: async (codeToVerify) => {
       const code = codeToVerify ?? emailCode;
       if (!code) {
@@ -9631,7 +9419,7 @@ function EmailNotConnectedWarning() {
 
 // src/internal/components/ManageWalletMenu/hooks/useLinkSocial.ts
 import { useQueryClient as useQueryClient6 } from "@tanstack/react-query";
-import React9, { useEffect as useEffect19 } from "react";
+import React9, { useEffect as useEffect18 } from "react";
 init_auth();
 function useLinkSocial() {
   const qc = useQueryClient6();
@@ -9695,7 +9483,7 @@ function useLinkSocial() {
     [config.social?.providers, callbacks]
   );
   const [socialLinkStarted, setSocialLinkStarted] = React9.useState(false);
-  useEffect19(() => {
+  useEffect18(() => {
     const key = providerType?.toLowerCase();
     console.log("[useLinkSocial] Effect triggered:", { key, linkIsLoading, socialLinkStarted, isWalletLinking });
     if (isWalletLinking) {
@@ -9716,7 +9504,7 @@ function useLinkSocial() {
 
 // src/internal/components/ManageWalletMenu/hooks/useLinkTelegram.ts
 import { useQueryClient as useQueryClient7 } from "@tanstack/react-query";
-import { useCallback as useCallback11, useEffect as useEffect20, useState as useState9 } from "react";
+import { useCallback as useCallback11, useEffect as useEffect19, useState as useState9 } from "react";
 init_telegram2();
 function useLinkTelegram() {
   const {
@@ -9770,7 +9558,7 @@ function useLinkTelegram() {
     }
   }, [config.social?.providers, callbacks]);
   const [telegramLinkStarted, setTelegramLinkStarted] = useState9(false);
-  useEffect20(() => {
+  useEffect19(() => {
     console.log("[useLinkTelegram] Effect triggered:", { providerType, linkIsLoading, telegramLinkStarted, isWalletLinking });
     if (isWalletLinking) {
       console.log("[useLinkTelegram] Skipping - wallet linking in progress");
@@ -9782,7 +9570,7 @@ function useLinkTelegram() {
       handleLinkTelegram();
     }
   }, [providerType, handleLinkTelegram, linkIsLoading, telegramLinkStarted, isWalletLinking]);
-  useEffect20(() => {
+  useEffect19(() => {
     if (providerType !== "telegram") {
       setTelegramLinkStarted(false);
     }
@@ -9992,7 +9780,7 @@ function ManageWalletMenu() {
 }
 
 // src/internal/components/ManageWalletMenu/UnlinkProviderMenu.tsx
-import { useMutation as useMutation12, useQueryClient as useQueryClient8 } from "@tanstack/react-query";
+import { useMutation as useMutation11, useQueryClient as useQueryClient8 } from "@tanstack/react-query";
 import { Key as Key7, Loader as Loader12 } from "lucide-react";
 import { useState as useState10 } from "react";
 init_auth();
@@ -10004,7 +9792,7 @@ function UnlinkProviderMenu() {
   const setPage = useLayoutDataStore((st) => st.setPage);
   const { confirmUnlink, setConfirmUnlink, setLinkError } = useManageWalletStore();
   const [confirmInput, setConfirmInput] = useState10("");
-  const { mutate: handleUnlinkProvider, isPending: isProviderUnlinking } = useMutation12({
+  const { mutate: handleUnlinkProvider, isPending: isProviderUnlinking } = useMutation11({
     mutationFn: async () => {
       if (!confirmUnlink) {
         throw new Error("No provider to unlink");
@@ -10079,7 +9867,7 @@ function UnlinkProviderMenu() {
 // src/internal/components/PortfolioMenu/PortfolioMenu.tsx
 import { useQueryClient as useQueryClient10 } from "@tanstack/react-query";
 import { ArrowLeft as ArrowLeft8, Gem, Loader as Loader14, RefreshCw } from "lucide-react";
-import { useCallback as useCallback12, useEffect as useEffect21, useRef as useRef9 } from "react";
+import { useCallback as useCallback12, useEffect as useEffect20, useRef as useRef9 } from "react";
 
 // src/modules/assets.ts
 init_base();
@@ -10265,7 +10053,7 @@ function formatValue(price) {
 function openInExplorer(address) {
   window.open(`${LUMIA_EXPLORER_URL}/address/${address}`, "_blank");
 }
-async function getAssetRate(symbol) {
+async function getAssetRate2(symbol) {
   const assetURL = `https://api.binance.com/api/v3/ticker/price?symbol=${symbol.toUpperCase()}USDT`;
   const response = await fetch(assetURL);
   return await response.json();
@@ -10282,7 +10070,7 @@ function PortfolioItem(props) {
     staleTime: 4 * 60 * 1e3,
     enabled: !!address && !!asset.symbol && !isProjectAsset,
     queryKey: [ASSETS_RATES_QUERY_KEY, address, asset.symbol],
-    queryFn: async () => await getAssetRate(asset.symbol)
+    queryFn: async () => await getAssetRate2(asset.symbol)
   });
   const renderBalance = isProjectAsset && projectAssetBalance?.fiatFormatted ? projectAssetBalance.fiatFormatted : asset.formattedBalance;
   return /* @__PURE__ */ jsxs40(
@@ -10347,7 +10135,7 @@ function PortfolioMenu() {
     Promise.all(projectAssets.map((asset) => qc.invalidateQueries({ queryKey: asset.balanceQueryKey })));
     refreshBalances();
   }, [qc, projectAssets, refreshBalances]);
-  useEffect21(() => {
+  useEffect20(() => {
     if (!assetsContainerListRef.current || !assetsListRef.current) return;
     const listTargetHeight = maxScrollHeight - 128;
     assetsContainerListRef.current.style.setProperty("--l-pass-scrollbar-mah", `${listTargetHeight}px`);
@@ -10434,7 +10222,7 @@ import {
   Shield,
   Trash2 as Trash22
 } from "lucide-react";
-import { useCallback as useCallback13, useEffect as useEffect22, useState as useState11 } from "react";
+import { useCallback as useCallback13, useEffect as useEffect21, useState as useState11 } from "react";
 init_vaultClient();
 import { jsx as jsx51, jsxs as jsxs42 } from "react/jsx-runtime";
 function SecurityMenu() {
@@ -10488,7 +10276,7 @@ function SecurityMenu() {
       setIsRefreshing(false);
     }
   }, [userId]);
-  useEffect22(() => {
+  useEffect21(() => {
     if (open) fetchRecovery();
   }, [open, fetchRecovery]);
   const parseOS = (ua) => {
@@ -10680,7 +10468,7 @@ function SecurityMenu() {
 
 // src/internal/components/SendRecieveMenu/SendLumiaMenu.tsx
 import { AlertCircle as AlertCircle5, ArrowLeft as ArrowLeft10, CheckCircle2 as CheckCircle24, Loader as Loader16, Wallet } from "lucide-react";
-import { useEffect as useEffect23, useState as useState13 } from "react";
+import { useEffect as useEffect22, useState as useState13 } from "react";
 import { isAddress as isAddress2 } from "viem";
 import { useBalance as useBalance3 } from "wagmi";
 
@@ -10768,7 +10556,7 @@ function SendLumiaMenu() {
   const [validationError, setValidationError] = useState13(null);
   const nativeAsset = assets.find((a) => a.type === "native");
   const balance = nativeAsset ? parseFloat(nativeAsset.formattedBalance) : 0;
-  useEffect23(() => {
+  useEffect22(() => {
     if (open) {
       setTxStep("input");
       setValidationError(null);
@@ -10933,7 +10721,7 @@ function SendLumiaMenu() {
 init_clients();
 import { ArrowLeft as ArrowLeft11, CheckCircle2 as CheckCircle25, Copy as Copy2, Loader as Loader17 } from "lucide-react";
 import QRCode from "qrcode";
-import { useCallback as useCallback15, useEffect as useEffect24, useState as useState14 } from "react";
+import { useCallback as useCallback15, useEffect as useEffect23, useState as useState14 } from "react";
 import { Fragment as Fragment13, jsx as jsx53, jsxs as jsxs44 } from "react/jsx-runtime";
 function ReceiveLumiaMenu() {
   const address = useLumiaPassportSession((st) => st.address);
@@ -10943,7 +10731,7 @@ function ReceiveLumiaMenu() {
   const open = page === "receive";
   const [qrCodeUrl, setQrCodeUrl] = useState14("");
   const [copied, setCopied] = useState14(false);
-  useEffect24(() => {
+  useEffect23(() => {
     if (open && address) {
       QRCode.toDataURL(address, {
         width: 200,
@@ -11002,7 +10790,7 @@ function ReceiveLumiaMenu() {
 
 // src/internal/components/SettingsMenu/SettingsMenu.tsx
 import { ArrowLeft as ArrowLeft12 } from "lucide-react";
-import { useEffect as useEffect25 } from "react";
+import { useEffect as useEffect24 } from "react";
 
 // src/internal/components/SettingsMenu/constants.ts
 import { ArrowLeftRight, DatabaseBackup as DatabaseBackup2, LockKeyhole, UsersRound } from "lucide-react";
@@ -11036,7 +10824,7 @@ function SettingsMenu() {
   const setPage = useLayoutDataStore((st) => st.setPage);
   const settingsNotifications = useLayoutDataStore((st) => st.settingsNotifications);
   const setMainPageHeight = useLayoutDataStore((st) => st.setMainPageHeight);
-  useEffect25(() => setMainPageHeight(DEFAULT_SETTINGS_MENU_HEIGHT), [setMainPageHeight]);
+  useEffect24(() => setMainPageHeight(DEFAULT_SETTINGS_MENU_HEIGHT), [setMainPageHeight]);
   const navItems = NAV_BUTTONS.map((el) => ({ ...el, onClick: () => setPage(el.id) }));
   const highlightedKeys = settingsNotifications.map((n) => n.target);
   return /* @__PURE__ */ jsxs45("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
@@ -11096,7 +10884,7 @@ function TermsOfService() {
 // src/internal/components/TransactionsMenu/TransactionsMenu.tsx
 import { useQuery as useQuery8, useQueryClient as useQueryClient11 } from "@tanstack/react-query";
 import { ArrowLeft as ArrowLeft14, Loader as Loader18, RefreshCw as RefreshCw3, XCircle as XCircle2 } from "lucide-react";
-import { useCallback as useCallback16, useEffect as useEffect26, useRef as useRef10, useState as useState15 } from "react";
+import { useCallback as useCallback16, useEffect as useEffect25, useRef as useRef10, useState as useState15 } from "react";
 
 // src/internal/components/TransactionsMenu/api.ts
 init_base();
@@ -11596,7 +11384,7 @@ function TransactionsMenu() {
     [qc, address]
   );
   const txHistoryResolvedError = txHistoryError ? txHistoryError instanceof Error ? txHistoryError.message : "Failed to load transactions" : null;
-  useEffect26(() => {
+  useEffect25(() => {
     if (!txContainerListRef.current || !txListRef.current) return;
     const listTargetHeight = maxScrollHeight - 128;
     txContainerListRef.current.style.setProperty("--l-pass-scrollbar-mah", `${listTargetHeight}px`);
@@ -11788,7 +11576,7 @@ function usePageMapper() {
     },
     [setDialogContent, setDialogDescription, setDialogTitle, setIsDialogOpen]
   );
-  useEffect27(() => {
+  useEffect26(() => {
     if (page === null) return closeDialog();
     const pageItem = protectedRoutes[page];
     if (!pageItem) {
@@ -11802,7 +11590,7 @@ function usePageMapper() {
 
 // src/internal/hooks/useSettingsNotifications.ts
 init_auth();
-import { useEffect as useEffect28 } from "react";
+import { useEffect as useEffect27 } from "react";
 var EMAIL_NOT_CONNECTED_NOTIFICATION = {
   id: "email-not-connected",
   target: "manage-wallet" /* MANAGE_WALLET */,
@@ -11818,13 +11606,13 @@ function useSettingsNotifications() {
   const setSettingsNotifications = useLayoutDataStore((st) => st.setSettingsNotifications);
   const providers = jwtTokenManager2.getProviders();
   const hasEmail = providers.includes("email");
-  useEffect28(() => {
+  useEffect27(() => {
     setSettingsNotifications({
       ...BACKUP_IS_NOT_CREATED_NOTIFICATION,
       status: hasServerVault ? "resolved" : "active"
     });
   }, [hasServerVault, setSettingsNotifications]);
-  useEffect28(() => {
+  useEffect27(() => {
     setSettingsNotifications({
       ...EMAIL_NOT_CONNECTED_NOTIFICATION,
       status: hasEmail ? "resolved" : "active"
@@ -11833,7 +11621,7 @@ function useSettingsNotifications() {
 }
 
 // src/internal/hooks/useWalletStatus.ts
-import { useEffect as useEffect29 } from "react";
+import { useEffect as useEffect28 } from "react";
 init_auth();
 function useWalletStatus() {
   const isIframeReady = useLumiaPassportSession((st) => st.isIframeReady);
@@ -11843,7 +11631,7 @@ function useWalletStatus() {
     config: { current: config },
     callbacks
   } = useLumiaPassportConfig();
-  useEffect29(() => {
+  useEffect28(() => {
     if (!isIframeReady || !config.projectId || !callbacks?.onWalletReady) return;
     const userId = jwtTokenManager2.getUserId();
     const hasKeyshare = jwtTokenManager2.getHasKeyshare();
@@ -11872,7 +11660,7 @@ function LumiaPassportDialog() {
   const mainPageHeight = useLayoutDataStore((st) => st.mainPageHeight);
   const setPage = useLayoutDataStore((st) => st.setPage);
   const { colorMode, isDialogOpen, dialogTitle, dialogDescription, dialogContent, isDialogForced, setIsSettings } = useLayoutStore();
-  useEffect30(() => setIsSettings(!!session), [session, setIsSettings]);
+  useEffect29(() => setIsSettings(!!session), [session, setIsSettings]);
   usePageMapper();
   useAutoConnect();
   useCheckVaultStatus();
@@ -11956,7 +11744,7 @@ var TssManagerWithRef = React12.forwardRef((props, ref) => {
 init_wallet();
 import { useConnectModal } from "@rainbow-me/rainbowkit";
 import { useQueryClient as useQueryClient12 } from "@tanstack/react-query";
-import React13, { useCallback as useCallback19, useEffect as useEffect31 } from "react";
+import React13, { useCallback as useCallback19, useEffect as useEffect30 } from "react";
 import { useAccount, useDisconnect, useSignMessage } from "wagmi";
 function WalletConnectHandler() {
   const qc = useQueryClient12();
@@ -11997,7 +11785,7 @@ function WalletConnectHandler() {
   const { openConnectModal, connectModalOpen } = useConnectModal();
   const [hasStartedLinking, setHasStartedLinking] = React13.useState(false);
   const timeoutRef = React13.useRef();
-  useEffect31(() => {
+  useEffect30(() => {
     if (isWalletLinking && !hasStartedLinking) {
       setHasStartedLinking(true);
       setProviderType(null);
@@ -12022,7 +11810,7 @@ function WalletConnectHandler() {
       if (isConnected) disconnect();
     }
   }, [isWalletLinking, hasStartedLinking, isConnected, openConnectModal, disconnect, setPage, setProviderType]);
-  useEffect31(() => {
+  useEffect30(() => {
     console.log("[WalletConnectHandler] Modal state check:", {
       hasStartedLinking,
       connectModalOpen,
@@ -12035,7 +11823,7 @@ function WalletConnectHandler() {
       setHasStartedLinking(false);
     }
   }, [connectModalOpen, hasStartedLinking, isConnected, isWalletLinking]);
-  useEffect31(() => {
+  useEffect30(() => {
     if (isConnected && walletAddress && isWalletLinking && hasStartedLinking) {
       handleWalletSign();
     }
@@ -12120,12 +11908,10 @@ var useLumiaPassportSession = create5((set) => ({
   setWalletReadyStatus: (status) => set({ walletReadyStatus: status })
 }));
 function LumiaPassportSessionProvider({ children }) {
-  const {
-    config: { current: config }
-  } = useLumiaPassportConfig();
+  const config = useLumiaPassportConfig().config;
   return /* @__PURE__ */ jsxs51(Fragment15, { children: [
     children,
-    config.wallet?.enabled && /* @__PURE__ */ jsx62(WalletConnectHandler, {}),
+    config.current?.wallet?.enabled && /* @__PURE__ */ jsx62(WalletConnectHandler, {}),
     /* @__PURE__ */ jsx62(BalanceFeedProvider, {}),
     /* @__PURE__ */ jsx62(
       TssManagerWithRef,
@@ -12180,7 +11966,7 @@ function LumiaPassportProvider(props) {
   const { children, projectId, initialConfig = {}, callbacks } = props;
   const setIsIframeReady = useLumiaPassportSession((st) => st.setIsIframeReady);
   const setWalletReadyStatus = useLumiaPassportSession((st) => st.setWalletReadyStatus);
-  useEffect32(() => notifyNoProjetctId(projectId), [projectId]);
+  useEffect31(() => notifyNoProjetctId(projectId), [projectId]);
   const config = useRef11({ projectId, ...DEFAULT_LUMIA_PASSPORT_CONFIG });
   const updateConfig = useCallback20((updates) => {
     const prev = config.current;
@@ -12217,7 +12003,7 @@ function LumiaPassportProvider(props) {
     }
     config.current = next;
   }, []);
-  useEffect32(() => {
+  useEffect31(() => {
     if (typeof window === "undefined" || !projectId) return;
     const mergedConfig = merge2(DEFAULT_LUMIA_PASSPORT_CONFIG, initialConfig);
     updateConfig(mergedConfig);
@@ -12273,7 +12059,7 @@ var useLumiaPassportConfig = () => {
 
 // src/components/ConnectWalletButton.tsx
 import { Cloud as Cloud3, Laptop as Laptop2, Loader as Loader19, Shield as Shield2 } from "lucide-react";
-import { useEffect as useEffect33, useMemo as useMemo4 } from "react";
+import { useEffect as useEffect32, useMemo as useMemo4 } from "react";
 init_auth();
 import { Fragment as Fragment16, jsx as jsx65, jsxs as jsxs52 } from "react/jsx-runtime";
 function getFormattedStatus(label, status, showStatus) {
@@ -12293,7 +12079,7 @@ function ConnectWalletButton(props) {
   const colorMode = useLayoutStore((st) => st.colorMode);
   const { session, address, hasServerVault, isLoading, isIframeReady, status, setUsePaymaster } = useLumiaPassportSession();
   const connectButtonLabel = getFormattedStatus(label || "Connect", status, isIframeReady);
-  useEffect33(() => setUsePaymaster(usePaymaster), [setUsePaymaster, usePaymaster]);
+  useEffect32(() => setUsePaymaster(usePaymaster), [setUsePaymaster, usePaymaster]);
   const avatar = jwtTokenManager2.getAvatar();
   const displayName = jwtTokenManager2.getDisplayName();
   const indicators = useMemo4(() => {
@@ -12430,6 +12216,9 @@ function ConnectWalletButton(props) {
 }
 
 // src/hooks/childAppHooks.ts
+var useLumiaPassportIsMobileView = () => {
+  return useLayoutStore((st) => st.isMobileView);
+};
 var useLumiaPassportBalance = () => {
   const walletBalance = useLayoutDataStore((st) => st.balance);
   const fiatBalance = useLayoutDataStore((st) => st.fiatBalance);
@@ -12471,7 +12260,7 @@ function useLumiaPassportOpen() {
 }
 
 // src/hooks/useLumiaPassportColorMode.ts
-import { useCallback as useCallback22, useEffect as useEffect34 } from "react";
+import { useCallback as useCallback22, useEffect as useEffect33 } from "react";
 function useLumiaPassportColorMode() {
   const {
     config: { current: config }
@@ -12486,7 +12275,7 @@ function useLumiaPassportColorMode() {
     },
     [handleStoreColorMode]
   );
-  useEffect34(() => {
+  useEffect33(() => {
     let targetColorMode = localStorage.getItem(LOCAL_COLOR_MODE_KEY);
     if (!targetColorMode && !preferedColorMode) {
       const systemMode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
@@ -13149,13 +12938,13 @@ var Hash = ({
 
 // src/internal/components/TransactionsMenu/TransactionsList.tsx
 init_base();
-import { useEffect as useEffect36, useState as useState19 } from "react";
+import { useEffect as useEffect35, useState as useState19 } from "react";
 import { jsx as jsx72, jsxs as jsxs56 } from "react/jsx-runtime";
 var TransactionsList = ({ address, itemsCount = 10 }) => {
   const [transactions, setTransactions] = useState19([]);
   const [loading, setLoading] = useState19(true);
   const [error, setError] = useState19(null);
-  useEffect36(() => {
+  useEffect35(() => {
     const fetchTransactions = async () => {
       try {
         setLoading(true);
@@ -13662,6 +13451,7 @@ export {
   useLumiaPassportError,
   useLumiaPassportHasServerVault,
   useLumiaPassportIFrameReady,
+  useLumiaPassportIsMobileView,
   useLumiaPassportLinkedProfiles,
   useLumiaPassportLoadingStatus,
   useLumiaPassportOpen,