@lumiapassport/ui-kit 1.14.3 → 1.14.5

package/dist/index.cjs

@@ -4394,7 +4394,7 @@ var import_zustand = require("zustand");
 var import_lucide_react2 = require("lucide-react");
 init_assets();
 var LOCAL_COLOR_MODE_KEY = "lumia-passport-theme";
-var DEFAULT_AUTH_MENU_HEIGHT = 253;
+var DEFAULT_AUTH_MENU_HEIGHT = 337;
 var DEFAULT_MAIN_MENU_HEIGHT = 90;
 var DEFAULT_SETTINGS_MENU_HEIGHT = 346;
 var MAX_CONTENT_HEIGHT = 640;
@@ -4411,23 +4411,23 @@ var PROVIDERS_META2 = {
 };
 
 // src/internal/hooks/useLayoutDataStore.ts
-var PageKey = /* @__PURE__ */ ((PageKey2) => {
-  PageKey2["AUTH"] = "auth";
-  PageKey2["TERMS_OF_SERVICE"] = "terms-of-service";
-  PageKey2["MAIN_MENU"] = "main-menu";
-  PageKey2["SETTINGS"] = "settings";
-  PageKey2["SEND"] = "send";
-  PageKey2["RECEIVE"] = "receive";
-  PageKey2["BUY"] = "buy";
-  PageKey2["KYC"] = "kyc";
-  PageKey2["TRANSACTIONS"] = "transactions";
-  PageKey2["ASSETS"] = "assets";
-  PageKey2["MANAGE_WALLET"] = "manage-wallet";
-  PageKey2["UNLINK_PROVIDER"] = "unlink-provider";
-  PageKey2["SECURITY"] = "security";
-  PageKey2["KEYSARE_BACKUP"] = "keysare-backup";
-  PageKey2["KEYSHARE_RESTORE"] = "keyshare-restore";
-  return PageKey2;
+var PageKey = /* @__PURE__ */ ((PageKey4) => {
+  PageKey4["AUTH"] = "auth";
+  PageKey4["TERMS_OF_SERVICE"] = "terms-of-service";
+  PageKey4["MAIN_MENU"] = "main-menu";
+  PageKey4["SETTINGS"] = "settings";
+  PageKey4["SEND"] = "send";
+  PageKey4["RECEIVE"] = "receive";
+  PageKey4["BUY"] = "buy";
+  PageKey4["KYC"] = "kyc";
+  PageKey4["TRANSACTIONS"] = "transactions";
+  PageKey4["ASSETS"] = "assets";
+  PageKey4["MANAGE_WALLET"] = "manage-wallet";
+  PageKey4["UNLINK_PROVIDER"] = "unlink-provider";
+  PageKey4["SECURITY"] = "security";
+  PageKey4["KEYSARE_BACKUP"] = "keysare-backup";
+  PageKey4["KEYSHARE_RESTORE"] = "keyshare-restore";
+  return PageKey4;
 })(PageKey || {});
 var useLayoutDataStore = (0, import_zustand.create)((set) => ({
   page: null,
@@ -4439,6 +4439,7 @@ var useLayoutDataStore = (0, import_zustand.create)((set) => ({
   balance: { decimals: 18, formatted: "0.0", symbol: "LUMIA", value: BigInt(0) },
   mainPageHeight: DEFAULT_MAIN_MENU_HEIGHT,
   settingsNotifications: [],
+  isWalletLinking: false,
   setPage: (page) => set({ page }),
   setPageParams: (pageOptions) => set({ pageParams: pageOptions }),
   setCryptoRate: (lumiaRate) => set({ cryptoRate: lumiaRate }),
@@ -4456,7 +4457,8 @@ var useLayoutDataStore = (0, import_zustand.create)((set) => ({
     }
     const filtered = prev.settingsNotifications.filter((n) => n.id !== notification.id);
     return { settingsNotifications: filtered };
-  })
+  }),
+  setIsWalletLinking: (isWalletLinking) => set({ isWalletLinking })
 }));
 
 // src/internal/components/BalanceFeedProvider/BalanceFeedProvider.tsx
@@ -4552,7 +4554,7 @@ var import_react50 = require("react");
 // package.json
 var package_default = {
   name: "@lumiapassport/ui-kit",
-  version: "1.14.3",
+  version: "1.14.5",
   description: "React UI components and hooks for Lumia Passport authentication and Account Abstraction",
   type: "module",
   main: "./dist/index.cjs",
@@ -4785,6 +4787,15 @@ Button.displayName = "Button";
 
 // src/internal/components/Footer/Footer.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
+function Version({ className }) {
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+    "span",
+    {
+      className: cn("font-mono text-[10px] text-[var(--l-pass-fg-muted)]", className),
+      children: `v${package_default.version}`
+    }
+  );
+}
 function Footer() {
   const qc = (0, import_react_query2.useQueryClient)();
   const { callbacks } = useLumiaPassportConfig();
@@ -4823,7 +4834,7 @@ function Footer() {
     "div",
     {
       style: { borderTop: "1px solid var(--l-pass-bd)" },
-      className: cn("w-full flex flex-col gap-1 items-center p-[var(--l-pass-pd)] pb-5"),
+      className: "w-full flex flex-col items-center p-[var(--l-pass-pd)] pb-5",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "w-full flex items-center justify-between", children: [
           /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
@@ -4865,9 +4876,9 @@ function Footer() {
                 isDisconnecting ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react3.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_lucide_react3.LogOut, { className: "w-4 h-4" })
               ]
             }
-          ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "font-mono text-[10px] text-[var(--l-pass-fg-muted)]", children: `v${package_default.version}` })
+          ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Version, {})
         ] }),
-        !!address && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "font-mono text-[10px] text-[var(--l-pass-fg-muted)]", children: `v${package_default.version}` })
+        !!address && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Version, { className: "block w-fit mt-1" })
       ]
     }
   );
@@ -5520,8 +5531,34 @@ DialogDescription.displayName = DialogPrimitive.Description.displayName;
 var import_jsx_runtime13 = require("react/jsx-runtime");
 var VisuallyHidden = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("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
+// src/internal/hooks/useListenIframeAuthEvents.ts
 var import_react6 = require("react");
+function useListenIframeAuthEvents() {
+  const setPage = useLayoutDataStore((state) => state.setPage);
+  const setIsIframeReady = useLumiaPassportSession((state) => state.setIsIframeReady);
+  const handleIframeMessage = (0, import_react6.useCallback)(
+    (event) => {
+      if (event.data?.type === "LUMIA_PASSPORT_IFRAME_READY") {
+        console.log("[ IFRAME MESSAGE CACTHED ] Iframe is ready");
+        setIsIframeReady(true);
+      } else if (event.data?.type === "LUMIA_PASSPORT_SHOW_IFRAME") {
+        console.log("[ IFRAME MESSAGE CACTHED ] Consent screen shown - hiding auth modal");
+      } else if (event.data?.type === "LUMIA_PASSPORT_HIDE_IFRAME") {
+        console.log("[ IFRAME MESSAGE CACTHED ] Consent screen hidden");
+      } else if (event.data?.type === "KEYSHARE_RECOVERY_NEEDED") {
+        console.log("[ IFRAME MESSAGE  CACTHED] recovery neede");
+      }
+    },
+    [setPage, setIsIframeReady]
+  );
+  (0, import_react6.useEffect)(() => {
+    window.addEventListener("message", handleIframeMessage);
+    return () => window.removeEventListener("message", handleIframeMessage);
+  }, [handleIframeMessage]);
+}
+
+// src/internal/hooks/useAutoConnect.ts
+var import_react7 = require("react");
 function useAutoConnect() {
   const {
     config: { current: config },
@@ -5541,7 +5578,7 @@ function useAutoConnect() {
     setIsIframeReady,
     setIsLoading
   } = useLumiaPassportSession();
-  const createSessionWithKeyshare = (0, import_react6.useCallback)(
+  const createSessionWithKeyshare = (0, import_react7.useCallback)(
     async (userId, hasServerKeyshare, isNewUser) => {
       try {
         try {
@@ -5575,8 +5612,8 @@ function useAutoConnect() {
     },
     [usePaymaster, setStatus, callbacks]
   );
-  const autoConnectAttemptedRef = (0, import_react6.useRef)(false);
-  (0, import_react6.useEffect)(() => {
+  const autoConnectAttemptedRef = (0, import_react7.useRef)(false);
+  (0, import_react7.useEffect)(() => {
     if (autoConnectAttemptedRef.current) return;
     setIsLoading(true);
     const tryAutoConnect = async (attempt) => {
@@ -5698,14 +5735,13 @@ function useAutoConnect() {
 
 // src/internal/hooks/useBackupStatusChanges.ts
 var import_react_query5 = require("@tanstack/react-query");
-var import_react7 = require("react");
+var import_react8 = require("react");
 init_vaultClient();
 function useBackupStatusChanges() {
   const setHasServerVault = useLumiaPassportSession((st) => st.setHasServerVault);
   const { mutate: handleBackupStatusChanged } = (0, import_react_query5.useMutation)({
     mutationFn: async (event) => {
       const customEvent = event;
-      console.log("[BACKUP STATUS] changed:", customEvent.detail);
       return await getShareRecoveryStats();
     },
     onSuccess: (stats) => {
@@ -5722,7 +5758,7 @@ function useBackupStatusChanges() {
       console.warn("[BACKUP STATUS] Failed to fetch initial vault status:", error);
     }
   });
-  (0, import_react7.useEffect)(() => {
+  (0, import_react8.useEffect)(() => {
     window.addEventListener("lumia-passport-backup-status-changed", handleBackupStatusChanged);
     return () => {
       window.removeEventListener("lumia-passport-backup-status-changed", handleBackupStatusChanged);
@@ -5731,7 +5767,7 @@ function useBackupStatusChanges() {
 }
 
 // src/internal/hooks/useBackupWarning.ts
-var import_react8 = require("react");
+var import_react9 = require("react");
 var WARNING_TIMEOUT_MS = 24e3;
 function useBackupWarning() {
   const config = useLumiaPassportConfig().config;
@@ -5739,8 +5775,8 @@ function useBackupWarning() {
   const hasServerVault = useLumiaPassportSession((st) => st.hasServerVault);
   const page = useLayoutDataStore((st) => st.page);
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const timeoutRef = (0, import_react8.useRef)(null);
-  (0, import_react8.useEffect)(() => {
+  const timeoutRef = (0, import_react9.useRef)(null);
+  (0, import_react9.useEffect)(() => {
     if (timeoutRef.current) {
       clearTimeout(timeoutRef.current);
       timeoutRef.current = null;
@@ -5762,7 +5798,7 @@ function useBackupWarning() {
 
 // src/internal/hooks/useCheckVaultStatus.ts
 var import_react_query6 = require("@tanstack/react-query");
-var import_react9 = require("react");
+var import_react10 = require("react");
 init_vaultClient();
 function useCheckVaultStatus() {
   const address = useLumiaPassportSession((st) => st.address);
@@ -5781,7 +5817,7 @@ function useCheckVaultStatus() {
       setHasServerVault(false);
     }
   });
-  (0, import_react9.useEffect)(() => {
+  (0, import_react10.useEffect)(() => {
     if (!address) return setHasServerVault(false);
     checkVaultStatus();
   }, [address, checkVaultStatus]);
@@ -5789,12 +5825,12 @@ function useCheckVaultStatus() {
 
 // src/internal/hooks/useDetectMaxScrollHeight.ts
 var import_lodash_es2 = require("lodash-es");
-var import_react10 = require("react");
+var import_react11 = require("react");
 var DEBOUNCE_DELAY = 50;
 function useDetectMaxScrollHeight() {
   const setIsMobileView = useLayoutStore((state) => state.setIsMobileView);
   const setMaxScrollHeight = useLayoutStore((state) => state.setMaxScrollHeight);
-  const onResize = (0, import_react10.useCallback)(
+  const onResize = (0, import_react11.useCallback)(
     (0, import_lodash_es2.debounce)(({ width, height }) => {
       const limContentHeight = height * 0.92 - 116 - 72;
       setIsMobileView(width < height && (width < 475 || limContentHeight <= MAX_CONTENT_HEIGHT));
@@ -5802,7 +5838,7 @@ function useDetectMaxScrollHeight() {
     }, DEBOUNCE_DELAY),
     [setMaxScrollHeight, setIsMobileView]
   );
-  (0, import_react10.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     const obs = new ResizeObserver(([entry]) => onResize(entry.contentRect));
     const doc = window.document.getElementsByTagName("html")[0];
     if (doc) obs.observe(doc);
@@ -5815,9 +5851,34 @@ var import_react47 = require("react");
 
 // src/internal/components/AuthMenu/AuthMenu.tsx
 var import_framer_motion = require("framer-motion");
-var import_lucide_react17 = require("lucide-react");
+var import_lucide_react16 = require("lucide-react");
 var import_react21 = require("react");
 
+// src/internal/components/ui/highlight.tsx
+var import_jsx_runtime14 = require("react/jsx-runtime");
+var CARD_STYLES = {
+  info: "text-[var(--l-pass-info)] bg-[var(--l-pass-bg-info)]",
+  success: "text-[var(--l-pass-success)] bg-[var(--l-pass-bg-success)]",
+  warning: "text-[var(--l-pass-warning)] bg-[var(--l-pass-bg-warning)]",
+  error: "text-[var(--l-pass-error)] bg-[var(--l-pass-bg-error)]"
+};
+function Highlight(props) {
+  const { type = "info", children, className } = props;
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    "div",
+    {
+      className: cn(
+        "w-full text-xs rounded-[var(--l-pass-el-bdrs)] p-[var(--l-pass-pd)]",
+        "whitespace-pre-line",
+        type === "error" ? "break-all" : "break-normal",
+        CARD_STYLES[type],
+        className
+      ),
+      children
+    }
+  );
+}
+
 // src/internal/components/AuthMenu/AuthFailedStep.tsx
 var import_lucide_react9 = require("lucide-react");
 
@@ -5830,68 +5891,58 @@ var useAuthStore = (0, import_zustand3.create)((set) => ({
   expiresIn: null,
   codeSendError: null,
   passkeyStatus: "idle",
-  passkeyError: null,
-  failedMessage: null,
   failedType: "general",
-  verificationError: null,
   setStep: (step) => set({ step }),
-  setAlert: (alert2) => set({ alert: alert2 }),
   setEmail: (email) => set({ email }),
   setExpiresIn: (expiresIn) => set({ expiresIn }),
-  setCodeSendError: (error) => set({ codeSendError: error }),
   setPasskeyStatus: (status) => set({ passkeyStatus: status }),
-  setPasskeyError: (error) => set({ passkeyError: error }),
-  setFailedMessage: (message) => set({ failedMessage: message }),
-  setFailedType: (type) => set({ failedType: type }),
-  setVerificationError: (error) => set({ verificationError: error })
+  setAlert: (alert2) => set({ alert: alert2 }),
+  setFailedType: (type) => set({ failedType: type })
 }));
 
 // src/internal/components/AuthMenu/AuthFailedStep.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function AuthFailedStep() {
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
-  const { failedMessage, failedType, setStep, setFailedMessage, setFailedType } = useAuthStore();
+  const { failedType, setStep, setFailedType, setAlert } = useAuthStore();
   const isCritical = failedType === "critical" || failedType === "config";
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "w-full flex flex-col text-center gap-4 p-4", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "w-full flex flex-col text-center gap-4 p-4", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       "div",
       {
         className: cn(
           "w-full flex flex-col p-2 gap-2 rounded-[var(--l-pass-el-bdrs)]",
           isCritical ? "text-[var(--l-pass-error)] bg-[var(--l-pass-bg-error)]" : "text-[var(--l-pass-warning)] bg-[var(--l-pass-bg-warning)]"
         ),
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "w-full flex items-center justify-center gap-2", children: [
-            isCritical ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react9.AlertTriangle, { className: "w-5 h-5 text-[var(--l-pass-error)]" }) : /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_lucide_react9.Cross, { className: "w-5 h-5 text-[var(--l-pass-warning)]" }),
-            /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-center block text-xl font-bold", children: failedType === "config" ? "Configuration Error" : failedType === "critical" ? "Critical Error" : "Failed" })
-          ] }),
-          failedMessage && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "text-center block text-sm whitespace-pre-line leading-relaxed", children: failedMessage })
-        ]
+        children: /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "w-full flex items-center justify-center gap-2", children: [
+          isCritical ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react9.AlertTriangle, { className: "w-5 h-5 text-[var(--l-pass-error)]" }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(import_lucide_react9.Cross, { className: "w-5 h-5 text-[var(--l-pass-warning)]" }),
+          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "text-center block text-xl font-bold", children: failedType === "config" ? "Configuration Error" : failedType === "critical" ? "Critical Error" : "Failed" })
+        ] })
       }
     ),
-    failedType === "config" && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "p-2 rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-info)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "text-sm font-medium text-[var(--l-pass-info)] mb-2", children: "To fix this issue:" }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("ul", { className: "text-xs text-[var(--l-pass-info)] text-left space-y-1 list-disc list-inside", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "Contact your project administrator" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "Verify projectId is correctly configured" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "Check project metadata on the server" })
+    failedType === "config" && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "p-2 rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-info)]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-sm font-medium text-[var(--l-pass-info)] mb-2", children: "To fix this issue:" }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("ul", { className: "text-xs text-[var(--l-pass-info)] text-left space-y-1 list-disc list-inside", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "Contact your project administrator" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "Verify projectId is correctly configured" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "Check project metadata on the server" })
       ] })
     ] }),
-    failedType === "critical" && /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { className: "p-2 rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-error)] border", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "text-sm font-semibold text-[var(--l-pass-error)] mb-2", children: "What to do next:" }),
-      /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("ul", { className: "text-xs text-[var(--l-pass-error)] text-left space-y-1 list-disc list-inside", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "Contact support immediately" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "Provide your projectId and error details" }),
-        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("li", { children: "You may need to create a new account" })
+    failedType === "critical" && /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: "p-2 rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-error)] border", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "text-sm font-semibold text-[var(--l-pass-error)] mb-2", children: "What to do next:" }),
+      /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("ul", { className: "text-xs text-[var(--l-pass-error)] text-left space-y-1 list-disc list-inside", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "Contact support immediately" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "Provide your projectId and error details" }),
+        /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("li", { children: "You may need to create a new account" })
       ] })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-col gap-2", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
       Button,
       {
         size: "large",
         onClick: () => {
           setStep("signin");
-          setFailedMessage("");
+          setAlert(null);
           setFailedType("general");
           setIsLoading(false);
         },
@@ -5904,19 +5955,19 @@ function AuthFailedStep() {
 
 // src/internal/components/AuthMenu/DisaplayNameStep/DisplayNameInput.tsx
 var import_lucide_react10 = require("lucide-react");
-var import_react12 = require("react");
+var import_react13 = require("react");
 init_auth();
 init_profile();
 
 // src/internal/components/ui/input.tsx
-var import_react11 = __toESM(require("react"), 1);
-var import_jsx_runtime15 = require("react/jsx-runtime");
-var Input = import_react11.default.forwardRef((props, ref) => {
+var import_react12 = __toESM(require("react"), 1);
+var import_jsx_runtime16 = require("react/jsx-runtime");
+var Input = import_react12.default.forwardRef((props, ref) => {
   const { className, disabled, error, Icon, element, ...inputProps } = props;
-  const internalRef = (0, import_react11.useRef)(null);
-  (0, import_react11.useImperativeHandle)(ref, () => internalRef.current);
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)("div", { className: cn("w-full flex flex-col gap-1", className), children: [
-    /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(
+  const internalRef = (0, import_react12.useRef)(null);
+  (0, import_react12.useImperativeHandle)(ref, () => internalRef.current);
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: cn("w-full flex flex-col gap-1", className), children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(
       "div",
       {
         className: cn(
@@ -5932,8 +5983,8 @@ var Input = import_react11.default.forwardRef((props, ref) => {
           internalRef.current?.focus();
         },
         children: [
-          Icon && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("div", { className: "flex flex-none items-center justify-center w-6 h-6 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(Icon, { width: 16, height: 16, className: "text-[var(--l-pass-fg)]" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+          Icon && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "flex flex-none items-center justify-center w-6 h-6 p-1", children: /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Icon, { width: 16, height: 16, className: "text-[var(--l-pass-fg)]" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
             "input",
             {
               ref: internalRef,
@@ -5952,17 +6003,17 @@ var Input = import_react11.default.forwardRef((props, ref) => {
         ]
       }
     ),
-    !!error?.length && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "block text-[var(--l-pass-error)]", children: error })
+    !!error?.length && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "block text-[var(--l-pass-error)]", children: error })
   ] });
 });
 Input.displayName = "Input";
 
 // src/internal/components/AuthMenu/DisaplayNameStep/DisplayNameInput.tsx
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var DisplayNameInput = ({ onComplete, onSkip }) => {
-  const [displayName, setDisplayName] = (0, import_react12.useState)("");
-  const [isLoading, setIsLoading] = (0, import_react12.useState)(false);
-  const [error, setError] = (0, import_react12.useState)("");
+  const [displayName, setDisplayName] = (0, import_react13.useState)("");
+  const [isLoading, setIsLoading] = (0, import_react13.useState)(false);
+  const [error, setError] = (0, import_react13.useState)("");
   const handleSubmit = async (e) => {
     e.preventDefault();
     if (!displayName.trim()) {
@@ -5986,14 +6037,14 @@ var DisplayNameInput = ({ onComplete, onSkip }) => {
       setIsLoading(false);
     }
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(LumiaLogo, { size: 24, className: "w-6 h-6" }),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "font-bold text-xl leading-6", children: "What's your name?" })
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(LumiaLogo, { size: 24, className: "w-6 h-6" }),
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "font-bold text-xl leading-6", children: "What's your name?" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("span", { className: "block w-full text-xs text-center", children: "This helps personalize your experience" }),
-    /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("form", { onSubmit: handleSubmit, className: "w-full flex flex-col gap-[var(--l-pass-pd)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("span", { className: "block w-full text-xs text-center", children: "This helps personalize your experience" }),
+    /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("form", { onSubmit: handleSubmit, className: "w-full flex flex-col gap-[var(--l-pass-pd)]", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
         Input,
         {
           Icon: import_lucide_react10.User,
@@ -6010,8 +6061,8 @@ var DisplayNameInput = ({ onComplete, onSkip }) => {
           }
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { className: "w-full flex gap-[var(--l-pass-gap)]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+      /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "w-full flex gap-[var(--l-pass-gap)]", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           Button,
           {
             type: "submit",
@@ -6021,7 +6072,7 @@ var DisplayNameInput = ({ onComplete, onSkip }) => {
             children: isLoading ? "Saving..." : "Continue"
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
+        /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
           Button,
           {
             className: "flex-1 text-[var(--l-pass-fg-muted)]",
@@ -6039,17 +6090,16 @@ var DisplayNameInput = ({ onComplete, onSkip }) => {
 };
 
 // src/internal/components/AuthMenu/DisaplayNameStep/DisplayNameStep.tsx
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function DisplayNameStep(props) {
   const { onAuthSuccess } = props;
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const { setVerificationError, setStep, setEmail, setPasskeyError, setPasskeyStatus } = useAuthStore();
+  const { setStep, setEmail, setPasskeyStatus, setAlert } = useAuthStore();
   const onSkip = async () => {
     setPage(null);
     setStep("signin");
     setEmail("");
-    setVerificationError("");
-    setPasskeyError("");
+    setAlert(null);
     setPasskeyStatus("idle");
     await new Promise((resolve) => setTimeout(resolve, 250));
     if (onAuthSuccess) await onAuthSuccess();
@@ -6058,24 +6108,23 @@ function DisplayNameStep(props) {
     setPage(null);
     setStep("signin");
     setEmail("");
-    setVerificationError("");
-    setPasskeyError("");
+    setAlert(null);
     setPasskeyStatus("idle");
     await new Promise((resolve) => setTimeout(resolve, 250));
     if (onAuthSuccess) await onAuthSuccess();
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(DisplayNameInput, { onComplete, onSkip });
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(DisplayNameInput, { onComplete, onSkip });
 }
 
 // src/internal/components/AuthMenu/PassKeyStep.tsx
 var import_lucide_react11 = require("lucide-react");
-var import_react14 = require("react");
+var import_react15 = require("react");
 
 // src/internal/assets/PasskeyAddIcon.tsx
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function PasskeyAddIcon(props) {
   const { width = "24", height = "24", className = "w-6 h-6", ...rest } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
     "svg",
     {
       ...rest,
@@ -6088,11 +6137,11 @@ function PasskeyAddIcon(props) {
       strokeLinejoin: "round",
       xmlns: "http://www.w3.org/2000/svg",
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4" }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "m21 2-9.6 9.6" }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("circle", { cx: "7.5", cy: "15.5", r: "5.5" }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M18 15v6" }),
-        /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("path", { d: "M21 18h-6" })
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "m15.5 7.5 2.3 2.3a1 1 0 0 0 1.4 0l2.1-2.1a1 1 0 0 0 0-1.4L19 4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "m21 2-9.6 9.6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("circle", { cx: "7.5", cy: "15.5", r: "5.5" }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M18 15v6" }),
+        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("path", { d: "M21 18h-6" })
       ]
     }
   );
@@ -6102,16 +6151,16 @@ function PasskeyAddIcon(props) {
 init_auth();
 
 // src/internal/components/Expandable/hooks/useExpandable.ts
-var import_react13 = require("react");
+var import_react14 = require("react");
 var useExpandable = (props) => {
   const { isExpanded = false, children, initHeight = 0, minHeight = 0 } = props;
-  const expandableRef = (0, import_react13.useRef)(null);
-  const contentRef = (0, import_react13.useRef)(null);
-  (0, import_react13.useEffect)(() => {
+  const expandableRef = (0, import_react14.useRef)(null);
+  const contentRef = (0, import_react14.useRef)(null);
+  (0, import_react14.useEffect)(() => {
     if (!expandableRef.current) return;
     expandableRef.current.style.setProperty("--ifo-basic-expandable-h", `${initHeight}px )`);
   }, []);
-  const setExpandableHeight = (0, import_react13.useCallback)(
+  const setExpandableHeight = (0, import_react14.useCallback)(
     (isExpnd) => {
       if (!contentRef.current || !expandableRef.current) return;
       expandableRef.current.style.setProperty(
@@ -6122,7 +6171,7 @@ var useExpandable = (props) => {
     //  ON_RESIZE_DELEAY),
     [minHeight]
   );
-  (0, import_react13.useEffect)(() => {
+  (0, import_react14.useEffect)(() => {
     if (!contentRef.current || !expandableRef.current) return;
     const obs = new ResizeObserver(() => setExpandableHeight(isExpanded));
     obs.observe(expandableRef.current);
@@ -6135,24 +6184,24 @@ var useExpandable = (props) => {
 };
 
 // src/internal/components/Expandable/Expandable.tsx
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function Expandable(props) {
   const { children, className, contentClassName, minHeight, divProps } = props;
   const { expandableRef, contentRef } = useExpandable(props);
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     "div",
     {
       ...divProps,
       ref: expandableRef,
       className: cn("w-full overflow-y-hidden", className),
       style: { height: "var(--ifo-basic-expandable-h)", transition: "height 375ms ease" },
-      children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)("div", { className: cn("w-full", contentClassName), ref: contentRef, style: minHeight ? { minHeight } : void 0, children })
+      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: cn("w-full", contentClassName), ref: contentRef, style: minHeight ? { minHeight } : void 0, children })
     }
   );
 }
 
 // src/internal/components/AuthMenu/PassKeyStep.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function normalizeWebAuthnError(err) {
   const raw = err?.message || String(err || "");
   const lower = raw.toLowerCase();
@@ -6174,20 +6223,9 @@ function PassKeyStep(props) {
   const setPage = useLayoutDataStore((st) => st.setPage);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
   const autoCloseOnSuccess = !recoveryUserId;
-  const {
-    passkeyError,
-    passkeyStatus,
-    setStep,
-    setPasskeyError,
-    setPasskeyStatus,
-    setAlert,
-    setEmail,
-    setVerificationError,
-    setFailedMessage,
-    setFailedType
-  } = useAuthStore();
-  const onPasskeyRegister = (0, import_react14.useCallback)(async () => {
-    setPasskeyError("");
+  const { passkeyStatus, setStep, setPasskeyStatus, setAlert, setEmail, setFailedType } = useAuthStore();
+  const onPasskeyRegister = (0, import_react15.useCallback)(async () => {
+    setAlert(null);
     setPasskeyStatus("registering passkey...");
     setIsLoading(true);
     try {
@@ -6214,8 +6252,7 @@ function PassKeyStep(props) {
         if (onAuthSuccess) await onAuthSuccess();
         setStep("signin");
         setEmail("");
-        setVerificationError("");
-        setPasskeyError("");
+        setAlert(null);
         setPasskeyStatus("idle");
       } else {
         setPasskeyStatus("Passkey registered successfully!");
@@ -6237,7 +6274,10 @@ function PassKeyStep(props) {
           message: "This passkey is already registered for your account. No need to register again!"
         });
       } else if (!normalized.benignCancel) {
-        setPasskeyError(errorMessage);
+        setAlert({
+          title: "Passkey Error",
+          message: errorMessage
+        });
       }
       if (!normalized.benignCancel) {
         try {
@@ -6253,8 +6293,8 @@ function PassKeyStep(props) {
       setIsLoading(false);
     }
   }, [onAuthSuccess, setPage, callbacks]);
-  const onPasskeyAuth = (0, import_react14.useCallback)(async () => {
-    setPasskeyError("");
+  const onPasskeyAuth = (0, import_react15.useCallback)(async () => {
+    setAlert(null);
     setPasskeyStatus("checking available passkeys...");
     setIsLoading(true);
     try {
@@ -6270,9 +6310,10 @@ function PassKeyStep(props) {
       pendingLoginResponseRef.current = result.loginResponse;
       const hasKeyshare = result.loginResponse.hasKeyshare ?? false;
       if (!hasKeyshare && result.loginResponse.isNewUser === void 0) {
-        setFailedMessage(
-          "The backend could not determine user status. This indicates you probably already have used the passkey and did not create required backups.\n Unfortunately, your wallet cannot be recovered. You need to create account using a different passkey."
-        );
+        setAlert({
+          title: "Configuration Error",
+          message: "The backend could not determine user status. This indicates you probably already have used the passkey and did not create required backups.\n Unfortunately, your wallet cannot be recovered. You need to create account using a different passkey."
+        });
         setFailedType("config");
         setStep("failed");
         setPasskeyStatus("idle");
@@ -6280,9 +6321,10 @@ function PassKeyStep(props) {
         return;
       }
       if (!hasKeyshare && result.loginResponse.isNewUser === false) {
-        setFailedMessage(
-          "Your account data has been lost on the server.\nThis should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered.\nYou will need to create a new account.\n\nPlease contact support immediately with this error."
-        );
+        setAlert({
+          title: "Data has been lost",
+          message: "Your account data has been lost on the server.\nThis should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered.\nYou will need to create a new account.\n\nPlease contact support immediately with this error."
+        });
         setFailedType("critical");
         setStep("failed");
         setPasskeyStatus("idle");
@@ -6303,7 +6345,10 @@ function PassKeyStep(props) {
         if (onAuthSuccess) await onAuthSuccess();
       } catch (authError) {
         if (authError?.message?.includes("User denied authorization")) {
-          setFailedMessage("Authorization cancelled");
+          setAlert({
+            title: "Authorization Cancelled",
+            message: authError?.message || "You have cancelled the authorization process."
+          });
           setStep("failed");
           setPasskeyStatus("idle");
           return;
@@ -6313,8 +6358,7 @@ function PassKeyStep(props) {
       if (autoCloseOnSuccess) {
         setStep("signin");
         setEmail("");
-        setVerificationError("");
-        setPasskeyError("");
+        setAlert(null);
         setPasskeyStatus("idle");
         setPage(null);
       }
@@ -6322,7 +6366,10 @@ function PassKeyStep(props) {
       const normalized = normalizeWebAuthnError(e);
       const errorMessage = normalized.message || "Authentication failed";
       if (!normalized.benignCancel) {
-        setPasskeyError(errorMessage);
+        setAlert({
+          title: "Passkey Error",
+          message: errorMessage
+        });
         try {
           callbacks?.onLumiaPassportError?.({
             error: e instanceof Error ? e : new Error(errorMessage),
@@ -6337,11 +6384,11 @@ function PassKeyStep(props) {
       setIsLoading(false);
     }
   }, [onAuthSuccess, setPage, callbacks]);
-  return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Expandable, { isExpanded: true, contentClassName: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)("div", { className: "relative flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react11.Key, { className: "w-6 h-6" }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "font-bold text-xl leading-6", children: "Passkey" }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Expandable, { isExpanded: true, contentClassName: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)("div", { className: "relative flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react11.Key, { className: "w-6 h-6" }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "font-bold text-xl leading-6", children: "Passkey" }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
         Button,
         {
           style: { opacity: 0.5, transform: "translate(-4px, -4px)" },
@@ -6351,72 +6398,44 @@ function PassKeyStep(props) {
           className: "absolute left-0 top-0 w-5 h-5",
           onClick: () => setStep("signin"),
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react11.ArrowLeft, { className: "h-4 w-4" }),
-            /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "sr-only", children: "Back to SignIn" })
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react11.ArrowLeft, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "sr-only", children: "Back to SignIn" })
           ]
         }
       )
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Button, { variant: "default", size: "large", className: "w-full", onClick: onPasskeyAuth, disabled: isLoading, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_lucide_react11.Key, { className: "w-4 h-4" }),
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Button, { variant: "default", size: "large", className: "w-full", onClick: onPasskeyAuth, disabled: isLoading, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_lucide_react11.Key, { className: "w-4 h-4" }),
       "Sign in with existing Passkey"
     ] }),
-    config.passkey.showCreateButton && /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_jsx_runtime20.Fragment, { children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "block w-full text-center text-sm text-[var(--l-pass-fg-muted)]", children: "Don't have a passkey?" }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(Button, { variant: "outline", size: "large", className: "w-full", onClick: onPasskeyRegister, disabled: isLoading, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(PasskeyAddIcon, { className: "w-4 h-4" }),
+    config.passkey.showCreateButton && /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "block w-full text-center text-sm text-[var(--l-pass-fg-muted)]", children: "Don't have a passkey?" }),
+      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(Button, { variant: "outline", size: "large", className: "w-full", onClick: onPasskeyRegister, disabled: isLoading, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(PasskeyAddIcon, { className: "w-4 h-4" }),
         "Create Passkey"
       ] })
     ] }),
-    passkeyError && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "w-full p-[var(--l-pass-pd)] rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-error)]", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "w-full block text-sm text-[var(--l-pass-error)] break-words whitespace-pre-wrap text-center", children: passkeyError }) }),
-    !passkeyError && passkeyStatus !== "idle" && /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("div", { className: "w-full p-[var(--l-pass-pd)] rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-success)]", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)("span", { className: "w-full block text-sm text-[var(--l-pass-success)] break-words whitespace-pre-wrap text-center", children: passkeyStatus }) })
+    passkeyStatus !== "idle" && /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("div", { className: "w-full p-[var(--l-pass-pd)] rounded-[var(--l-pass-el-bdrs)] bg-[var(--l-pass-bg-success)]", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)("span", { className: "w-full block text-sm text-[var(--l-pass-success)] break-words whitespace-pre-wrap text-center", children: passkeyStatus }) })
   ] });
 }
 
 // src/internal/components/AuthMenu/SignInStep/SignInStep.tsx
-var import_lucide_react15 = require("lucide-react");
-var import_react17 = require("react");
+var import_lucide_react14 = require("lucide-react");
+var import_react18 = require("react");
 
 // src/internal/components/AuthMenu/SignInStep/Email.tsx
 init_lumiaPassport();
 var import_react_query7 = require("@tanstack/react-query");
 var import_lucide_react12 = require("lucide-react");
-var import_react15 = require("react");
+var import_react16 = require("react");
 init_projectId();
-
-// src/internal/components/ui/highlight.tsx
-var import_jsx_runtime21 = require("react/jsx-runtime");
-var CARD_STYLES = {
-  info: "text-[var(--l-pass-info)] bg-[var(--l-pass-bg-info)]",
-  success: "text-[var(--l-pass-success)] bg-[var(--l-pass-bg-success)]",
-  warning: "text-[var(--l-pass-warning)] bg-[var(--l-pass-bg-warning)]",
-  error: "text-[var(--l-pass-error)] bg-[var(--l-pass-bg-error)]"
-};
-function Highlight(props) {
-  const { type = "info", children, className } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-    "div",
-    {
-      className: cn(
-        "w-full text-xs rounded-[var(--l-pass-el-bdrs)] p-[var(--l-pass-pd)]",
-        "whitespace-pre-line",
-        type === "error" ? "break-all" : "break-normal",
-        CARD_STYLES[type],
-        className
-      ),
-      children
-    }
-  );
-}
-
-// src/internal/components/AuthMenu/SignInStep/Email.tsx
 var import_jsx_runtime22 = require("react/jsx-runtime");
 function Email() {
   const { config, callbacks } = useLumiaPassportConfig();
-  const buttonRef = (0, import_react15.useRef)(null);
+  const buttonRef = (0, import_react16.useRef)(null);
   const isLoading = useLumiaPassportSession((st) => st.isLoading);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
-  const { email, codeSendError, alert: alert2, setEmail, setCodeSendError, setExpiresIn, setStep, setAlert } = useAuthStore();
+  const { email, alert: alert2, setEmail, setExpiresIn, setStep, setAlert } = useAuthStore();
   const { mutate: onSendVerificationCode } = (0, import_react_query7.useMutation)({
     mutationFn: async (mail) => {
       const isEmailValid = mail.length !== 0 && /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(mail);
@@ -6424,7 +6443,7 @@ function Email() {
         throw new Error("Invalid email format, please correct and try again.");
       }
       setIsLoading(true);
-      setCodeSendError("");
+      setAlert(null);
       const apiUrl = addProjectIdToUrl(`${getServiceUrls().tssUrl}/api/auth/email/send-code`);
       return await fetch(apiUrl, {
         method: "POST",
@@ -6441,113 +6460,103 @@ function Email() {
       } else {
         if (response.status === 429) {
           const retryAfter = data.retryAfter || 60;
-          setCodeSendError(`Code already sent recently. Please wait ${retryAfter} seconds before requesting another.`);
+          setAlert({
+            title: "Code already sent recently (Too Many Requests)",
+            message: `Please wait ${retryAfter} seconds before requesting another.`
+          });
         } else if (response.status === 400) {
-          setCodeSendError(data.message || "Invalid email address");
+          setAlert({
+            title: "Failed to send verification code",
+            message: data.message || "Unknown error occurred"
+          });
         } else {
-          setCodeSendError(data.message || "Failed to send verification code");
+          setAlert({
+            title: "Failed to send verification code",
+            message: data.message || "Unknown error occurred"
+          });
         }
       }
       setIsLoading(false);
     },
     onError: (error) => {
       callbacks?.onLumiaPassportError?.({ error, message: error?.message || "" });
-      setCodeSendError(error?.message || "Network error. Please check your connection.");
+      setAlert({
+        title: "Failed to send verification code",
+        message: error?.message || "Unknown error occurred"
+      });
       setIsLoading(false);
     }
   });
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
-      "div",
-      {
-        className: "w-full flex gap-[10px] items-center",
-        onKeyDown: (e) => {
-          if (e.key === "Enter" && !isLoading && email) {
-            buttonRef.current?.click();
-          }
-        },
-        children: [
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            Input,
-            {
-              name: "signin-email",
-              Icon: import_lucide_react12.Mail,
-              type: "email",
-              autoComplete: "off",
-              placeholder: config.current?.email?.placeholder || "Enter your email",
-              value: email,
-              disabled: isLoading,
-              className: "flex-1 w-full",
-              onChange: (e) => {
-                if (alert2) setAlert(null);
-                setEmail(e.target.value);
-              }
-            }
-          ),
-          /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-            Button,
-            {
-              ref: buttonRef,
-              className: "w-12 h-12 flex-none",
-              variant: "default",
-              size: "large",
-              disabled: !email || isLoading,
-              onClick: () => onSendVerificationCode(email),
-              children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.ChevronRight, { className: "w-4 h-4" })
+  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(
+    "div",
+    {
+      className: "w-full flex gap-[10px] items-center",
+      onKeyDown: (e) => {
+        if (e.key === "Enter" && !isLoading && email) {
+          buttonRef.current?.click();
+        }
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          Input,
+          {
+            name: "signin-email",
+            Icon: import_lucide_react12.Mail,
+            type: "email",
+            autoComplete: "off",
+            placeholder: config.current?.email?.placeholder || "Enter your email",
+            value: email,
+            disabled: isLoading,
+            className: "flex-1 w-full",
+            onChange: (e) => {
+              if (alert2) setAlert(null);
+              setEmail(e.target.value);
             }
-          )
-        ]
-      }
-    ),
-    !!codeSendError && /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(Highlight, { type: "warning", className: "flex gap-[var(--l-pass-gap)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.Mail, { className: "w-4 h-4" }),
-      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)("span", { children: codeSendError })
-    ] })
-  ] });
-}
-
-// src/internal/components/AuthMenu/SignInStep/ErrorAlert.tsx
-var import_lucide_react13 = require("lucide-react");
-var import_jsx_runtime23 = require("react/jsx-runtime");
-function ErrorAlert(props) {
-  const { title, message } = props;
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(Highlight, { type: "error", className: "w-full flex gap-[var(--l-pass-gap)]", children: [
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react13.AlertTriangle, { className: "w-5 h-5 text-[var(--l-pass-error)]" }),
-    /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)("div", { className: "w-full flex-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "block w-full font-bold", children: title }),
-      /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "block w-full whitespace-pre-line", children: message })
-    ] })
-  ] });
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+          Button,
+          {
+            ref: buttonRef,
+            className: "w-12 h-12 flex-none",
+            variant: "default",
+            size: "large",
+            disabled: !email || isLoading,
+            onClick: () => onSendVerificationCode(email),
+            children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_lucide_react12.ChevronRight, { className: "w-4 h-4" })
+          }
+        )
+      ]
+    }
+  ) });
 }
 
 // src/internal/components/AuthMenu/SignInStep/Social.tsx
-var import_lucide_react14 = require("lucide-react");
-var import_react16 = require("react");
+var import_lucide_react13 = require("lucide-react");
+var import_react17 = require("react");
 init_assets();
 init_lumiaPassport();
 init_auth();
 init_projectId();
 
 // src/internal/components/AuthMenu/SignInStep/utils.ts
-var POSSIBLE_SIGNIN_METHODS = [
-  "email",
-  "passkey",
-  "social"
-  // 'wallet'
-];
+var POSSIBLE_SIGNIN_METHODS = ["email", "passkey", "social", "wallet"];
 function getSignInEnabledMethods(params) {
   const { order, config, exclude } = params;
   const enabled = new Array(POSSIBLE_SIGNIN_METHODS.length).fill(null);
+  const unordered = new Array(POSSIBLE_SIGNIN_METHODS.length).fill(null);
   POSSIBLE_SIGNIN_METHODS.forEach((sign) => {
     const orderedIdx = order.indexOf(sign);
     if (orderedIdx < 0) {
-      const unordered = config[sign]?.enabled ? sign : null;
-      enabled.push(unordered);
+      unordered.push(config[sign]?.enabled ? sign : null);
     } else {
       enabled[orderedIdx] = config[sign]?.enabled ? sign : null;
     }
   });
-  return enabled.filter(Boolean).filter((s) => !exclude.includes(s));
+  return [
+    ...enabled.filter(Boolean).filter((s) => !exclude.includes(s)),
+    ...unordered.filter(Boolean).filter((s) => !exclude.includes(s))
+  ];
 }
 async function normalizeSocialLoginResponse(rawLoginResponse, providerKey, userData) {
   if (!rawLoginResponse) {
@@ -6587,7 +6596,7 @@ async function normalizeSocialLoginResponse(rawLoginResponse, providerKey, userD
 }
 
 // src/internal/components/AuthMenu/SignInStep/Social.tsx
-var import_jsx_runtime24 = require("react/jsx-runtime");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 var SUPPORTED_PROVIDERS = ["telegram", "x", "twitter"];
 var SOCIAL_ICONS = {
   google: GoogleIcon,
@@ -6695,18 +6704,8 @@ function Social(props) {
   const { config, callbacks } = useLumiaPassportConfig();
   const isLoading = useLumiaPassportSession((st) => st.isLoading);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
-  const {
-    alert: alert2,
-    setStep,
-    setEmail,
-    setVerificationError,
-    setFailedType,
-    setAlert,
-    setFailedMessage,
-    setPasskeyError,
-    setPasskeyStatus
-  } = useAuthStore();
-  const onSocialAuth = (0, import_react16.useCallback)(
+  const { alert: alert2, setStep, setEmail, setFailedType, setAlert, setPasskeyStatus } = useAuthStore();
+  const onSocialAuth = (0, import_react17.useCallback)(
     async (providerId) => {
       const normalizedProviderId = providerId.toLowerCase();
       const provider = config.current?.social?.providers?.find(
@@ -6760,9 +6759,10 @@ function Social(props) {
               loginResponse2.hasKeyshare = false;
               loginResponse2.isNewUser = false;
             } else {
-              setFailedMessage(
-                "The backend could not determine user status. This indicates that your projectId is not properly configured or the project metadata is missing.\n\nPlease contact support with your projectId to resolve this issue."
-              );
+              setAlert({
+                title: "Configuration Error",
+                message: "The backend could not determine user status. This indicates that your projectId is not properly configured or the project metadata is missing.\n\nPlease contact support with your projectId to resolve this issue."
+              });
               setFailedType("config");
               setStep("failed");
               setIsLoading(false);
@@ -6771,9 +6771,10 @@ function Social(props) {
             }
           }
           if (loginResponse2.hasKeyshare === false && loginResponse2.isNewUser === false && providerKey !== "x") {
-            setFailedMessage(
-              "Your account data has been lost on the server.\nThis should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered.\nYou will need to create a new account.\n\nPlease contact support immediately with this error."
-            );
+            setAlert({
+              title: "Account Data Lost",
+              message: "Your account data has been lost on the server. This should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered. You will need to create a new account.\n\nPlease contact support immediately with this error."
+            });
             setFailedType("critical");
             setStep("failed");
             setIsLoading(false);
@@ -6823,16 +6824,14 @@ function Social(props) {
             onAuthSuccess?.();
             setStep("signin");
             setEmail("");
-            setVerificationError("");
-            setPasskeyError("");
+            setAlert(null);
             setPasskeyStatus("idle");
             setIsLoading(false);
           } else {
             onAuthSuccess?.();
             setStep("signin");
             setEmail("");
-            setVerificationError("");
-            setPasskeyError("");
+            setAlert(null);
             setPasskeyStatus("idle");
             setIsLoading(false);
           }
@@ -6922,13 +6921,13 @@ function Social(props) {
   );
   const isPasskey = config.current?.passkey?.enabled;
   const gridCols = (config.current?.social?.gridColumns || 1) + (isPasskey ? 1 : 0);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsxs)(
     "div",
     {
       className: "grid gap-[var(--l-pass-gap)]",
       style: { gridTemplateColumns: `repeat(${gridCols}, minmax(0, 1fr))` },
       children: [
-        isPasskey && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+        isPasskey && /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
           Button,
           {
             variant: "outline",
@@ -6940,7 +6939,7 @@ function Social(props) {
             },
             disabled: isLoading,
             title: "Passkey",
-            children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_lucide_react14.Key, { className: "w-5 h-5" })
+            children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_lucide_react13.Key, { className: "w-5 h-5" })
           }
         ),
         config.current?.social?.providers.filter((provider) => provider.enabled).map((provider) => {
@@ -6948,7 +6947,7 @@ function Social(props) {
           const isSupported = SUPPORTED_PROVIDERS.includes(providerId);
           const IconComponent = config.current?.ui?.useExternalIcons ? provider.icon : SOCIAL_ICONS[providerId];
           const handleClick = isSupported ? () => onSocialAuth(providerId) : () => setAlert({ title: "Coming Soon", message: `${provider.name} authentication is coming soon!` });
-          return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
             Button,
             {
               variant: "outline",
@@ -6960,7 +6959,7 @@ function Social(props) {
               },
               disabled: isLoading,
               title: provider.comingSoon ? `${provider.name} (Coming Soon)` : provider.name,
-              children: IconComponent ? /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(IconComponent, { className: "w-5 h-5" }) : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)("span", { className: "text-lg font-bold", children: provider.name.slice(0, 1).toUpperCase() })
+              children: IconComponent ? /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(IconComponent, { className: "w-5 h-5" }) : /* @__PURE__ */ (0, import_jsx_runtime23.jsx)("span", { className: "text-lg font-bold", children: provider.name.slice(0, 1).toUpperCase() })
             },
             provider.id
           );
@@ -6970,12 +6969,35 @@ function Social(props) {
   );
 }
 
+// src/internal/components/AuthMenu/SignInStep/Wallet.tsx
+var import_jsx_runtime24 = require("react/jsx-runtime");
+function Wallet() {
+  const setAlert = useAuthStore((st) => st.setAlert);
+  const setIsWalletLinking = useLayoutDataStore((st) => st.setIsWalletLinking);
+  const Icon = PROVIDERS_META2.wallet.icon;
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+    Button,
+    {
+      size: "large",
+      variant: "outline",
+      className: "w-full",
+      onClick: () => {
+        setAlert(null);
+        setIsWalletLinking(true);
+      },
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(Icon, { className: "w-5 h-5" }),
+        "Wallet"
+      ]
+    }
+  );
+}
+
 // src/internal/components/AuthMenu/SignInStep/SignInStep.tsx
 var import_jsx_runtime25 = require("react/jsx-runtime");
 function SignInStep(props) {
   const { pendingLoginResponseRef, onAuthSuccess, checkDisplayNameRequired } = props;
   const { config } = useLumiaPassportConfig();
-  const alert2 = useAuthStore((st) => st.alert);
   const setPage = useLayoutDataStore((st) => st.setPage);
   const enabledWoPasskey = getSignInEnabledMethods({
     config: config.current,
@@ -6991,24 +7013,22 @@ function SignInStep(props) {
         onAuthSuccess,
         checkDisplayNameRequired
       }
-    )
+    ),
+    wallet: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(Wallet, {})
   };
   return /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
     /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react15.UserCircle, { className: "w-6 h-6" }),
+      /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(import_lucide_react14.UserCircle, { className: "w-6 h-6" }),
       /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "font-bold text-xl leading-6", children: "Sign In" })
     ] }),
-    /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: [
-      enabledWoPasskey.map((kind, idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react17.Fragment, { children: [
-        idx > 0 && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { borderTop: "1px solid var(--l-pass-bd)" }, className: "flex-1" }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-none px-2 text-xs leading-4", children: "Or sign in using" }),
-          /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { borderTop: "1px solid var(--l-pass-bd)" }, className: "flex-1" })
-        ] }, `auth-method-${kind}-${idx}`),
-        signInMethods[kind]
-      ] }, `fragment-${idx}`)),
-      !!alert2 && /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(ErrorAlert, { title: alert2.title, message: alert2.message })
-    ] }),
+    /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: enabledWoPasskey.map((kind, idx) => /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)(import_react18.Fragment, { children: [
+      idx > 0 && /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "flex items-center", children: [
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { borderTop: "1px solid var(--l-pass-bd)" }, className: "flex-1" }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { className: "flex-none px-2 text-xs leading-4", children: "Or" }),
+        /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("div", { style: { borderTop: "1px solid var(--l-pass-bd)" }, className: "flex-1" })
+      ] }, `auth-method-${kind}-${idx}`),
+      signInMethods[kind]
+    ] }, `fragment-${idx}`)) }),
     /* @__PURE__ */ (0, import_jsx_runtime25.jsxs)("div", { className: "w-full flex items-center gap-2 justify-center", children: [
       /* @__PURE__ */ (0, import_jsx_runtime25.jsx)("span", { className: "text-[10px] font-medium", children: "By signing in, you agree to the" }),
       /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
@@ -7027,17 +7047,18 @@ function SignInStep(props) {
 
 // src/internal/components/AuthMenu/useAuthMenuHanders.ts
 var import_react_query8 = require("@tanstack/react-query");
-var import_react18 = require("react");
+var import_react19 = require("react");
 init_auth();
 function useAuthMenuHandlers() {
   const { config, callbacks } = useLumiaPassportConfig();
   const qc = (0, import_react_query8.useQueryClient)();
-  const pendingLoginResponseRef = (0, import_react18.useRef)(null);
+  const pendingLoginResponseRef = (0, import_react19.useRef)(null);
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const [telegramCleanup, setTelegramCleanup] = (0, import_react18.useState)(null);
+  const [telegramCleanup, setTelegramCleanup] = (0, import_react19.useState)(null);
   const { usePaymaster, setError, setStatus, setSession, setAddress, setRecoveryUserId, setHasServerVault } = useLumiaPassportSession();
-  const { setStep, setVerificationError, setCodeSendError, setFailedMessage } = useAuthStore();
-  const createSessionWithKeyshare = (0, import_react18.useCallback)(
+  const setStep = useAuthStore((st) => st.setStep);
+  const setAlert = useAuthStore((st) => st.setAlert);
+  const createSessionWithKeyshare = (0, import_react19.useCallback)(
     async (userId, hasServerKeyshare, isNewUser) => {
       try {
         try {
@@ -7071,7 +7092,7 @@ function useAuthMenuHandlers() {
     },
     [setStatus, callbacks, usePaymaster]
   );
-  const onAuthSuccess = (0, import_react18.useCallback)(async () => {
+  const onAuthSuccess = (0, import_react19.useCallback)(async () => {
     const loginResponse = pendingLoginResponseRef.current;
     if (!loginResponse || !loginResponse.userId) {
       setError("Authentication failed - no login data available");
@@ -7099,7 +7120,7 @@ function useAuthMenuHandlers() {
         jwt?.isNewUser
       );
       setError(null);
-      setFailedMessage(null);
+      setAlert(null);
       setSession(sess);
       setAddress(addr);
       setStatus("ready");
@@ -7137,7 +7158,10 @@ function useAuthMenuHandlers() {
         await import_auth3.jwtTokenManager.clearTokens();
         setStatus("error");
         setError(error?.message || String(error));
-        setFailedMessage("Authorization cancelled");
+        setAlert({
+          title: "Authorization cancelled",
+          message: error?.message || String(error) || "An unknown error occurred during authentication."
+        });
         setStep("failed");
       }
     }
@@ -7149,12 +7173,13 @@ function useAuthMenuHandlers() {
     setError,
     setStatus,
     setSession,
+    setAlert,
     setAddress,
     setRecoveryUserId,
     setHasServerVault,
     createSessionWithKeyshare
   ]);
-  const checkDisplayNameRequired = (0, import_react18.useCallback)(async (loginResponse) => {
+  const checkDisplayNameRequired = (0, import_react19.useCallback)(async (loginResponse) => {
     if (!config.current?.features?.displayNameNeeded) {
       return false;
     }
@@ -7178,15 +7203,14 @@ function useAuthMenuHandlers() {
       return false;
     }
   }, []);
-  const goBackToSignIn = (0, import_react18.useCallback)(() => {
+  const goBackToSignIn = (0, import_react19.useCallback)(() => {
     setStep("signin");
-    setVerificationError("");
-    setCodeSendError("");
+    setAlert(null);
     if (telegramCleanup) {
       telegramCleanup();
       setTelegramCleanup(null);
     }
-  }, [setStep, setVerificationError, setCodeSendError, telegramCleanup]);
+  }, [setStep, setAlert, telegramCleanup]);
   return {
     pendingLoginResponseRef,
     onAuthSuccess,
@@ -7195,39 +7219,10 @@ function useAuthMenuHandlers() {
   };
 }
 
-// src/internal/components/AuthMenu/useListenIframeAuthEvents.ts
-var import_react19 = require("react");
-function useListenIframeAuthEvents() {
-  const setPage = useLayoutDataStore((state) => state.setPage);
-  const setIsIframeReady = useLumiaPassportSession((state) => state.setIsIframeReady);
-  const handleIframeMessage = (0, import_react19.useCallback)(
-    (event) => {
-      console.log("[AuthMenu] Received iframe message:", event.data);
-      if (event.data?.type === "LUMIA_PASSPORT_IFRAME_READY") {
-        console.log("[AuthMenu] Iframe is ready");
-        setIsIframeReady(true);
-      } else if (event.data?.type === "LUMIA_PASSPORT_SHOW_IFRAME") {
-        console.log("[AuthMenu] Consent screen shown - hiding auth modal");
-        setPage(null);
-      } else if (event.data?.type === "LUMIA_PASSPORT_HIDE_IFRAME") {
-        console.log("[AuthMenu] Consent screen hidden");
-      } else if (event.data?.type === "KEYSHARE_RECOVERY_NEEDED") {
-        console.log("[AuthMenu] recovery neede");
-        setPage("keyshare-restore" /* KEYSHARE_RESTORE */);
-      }
-    },
-    [setPage, setIsIframeReady]
-  );
-  (0, import_react19.useEffect)(() => {
-    window.addEventListener("message", handleIframeMessage);
-    return () => window.removeEventListener("message", handleIframeMessage);
-  }, [handleIframeMessage]);
-}
-
 // src/internal/components/AuthMenu/VerifyStep/VerifyStep.tsx
 init_lumiaPassport();
 var import_react_query9 = require("@tanstack/react-query");
-var import_lucide_react16 = require("lucide-react");
+var import_lucide_react15 = require("lucide-react");
 
 // src/internal/assets/OtpIcon.tsx
 var import_jsx_runtime26 = require("react/jsx-runtime");
@@ -7250,8 +7245,8 @@ init_projectId();
 var import_react20 = require("react");
 var import_jsx_runtime27 = require("react/jsx-runtime");
 var VerificationCodeInput = (props) => {
-  const { onVerifyCode, onResendCode, isLoading, expiresIn, error } = props;
-  const setVerificationError = useAuthStore((st) => st.setVerificationError);
+  const { onVerifyCode, onResendCode, isLoading, expiresIn } = props;
+  const setAlert = useAuthStore((st) => st.setAlert);
   const [timeLeft, setTimeLeft] = (0, import_react20.useState)(expiresIn);
   (0, import_react20.useEffect)(() => setTimeLeft(expiresIn), [expiresIn]);
   (0, import_react20.useEffect)(() => {
@@ -7347,7 +7342,6 @@ var VerificationCodeInput = (props) => {
       },
       i
     )) }),
-    error && /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("div", { className: "w-full bg-[var(--l-pass-bg-error)] p-[var(--l-pass-pd)] rounded-[var(--l-pass-el-bdrs)]", children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)("span", { className: "w-full block text-sm text-[var(--l-pass-error)] break-words whitespace-pre-wrap text-center", children: error }) }),
     /* @__PURE__ */ (0, import_jsx_runtime27.jsxs)("div", { className: "text-xs", children: [
       "Code expires in ",
       mm,
@@ -7365,8 +7359,8 @@ var VerificationCodeInput = (props) => {
           className: "text-xs h-fit px-0 leading-4 text-[var(--l-pass-fg-muted)] underline underline-offset-4",
           onClick: () => {
             if (!timeLeft) return onResendCode();
-            setVerificationError("Please wait until the current code expires to resend.");
-            setTimeout(() => setVerificationError(""), 3e3);
+            setAlert({ title: "Please wait", message: "Please wait until the current code expires to resend." });
+            setTimeout(() => setAlert(null), 3e3);
           },
           children: "Resend"
         }
@@ -7387,18 +7381,16 @@ function VerifyStep(props) {
   const {
     email,
     expiresIn,
-    verificationError,
-    setVerificationError,
-    setFailedMessage,
     setFailedType,
     setStep,
     setEmail,
-    setExpiresIn
+    setExpiresIn,
+    setAlert
   } = useAuthStore();
   const { mutate: onVerifyCode, isPending: isCodeVerifying } = (0, import_react_query9.useMutation)({
     mutationFn: async (code) => {
       setIsLoading(true);
-      setVerificationError("");
+      setAlert(null);
       const { loginWithEmail: loginWithEmail2 } = await Promise.resolve().then(() => (init_auth(), auth_exports));
       const loginResponse = await loginWithEmail2(email, code, { skipTokenSave: true });
       pendingLoginResponseRef.current = loginResponse;
@@ -7406,9 +7398,10 @@ function VerifyStep(props) {
     },
     onSuccess: async (loginResponse) => {
       if (!loginResponse.hasKeyshare && loginResponse.isNewUser === void 0) {
-        setFailedMessage(
-          "The backend could not determine user status. This indicates that your projectId is not properly configured or the project metadata is missing.\n\nPlease contact support with your projectId to resolve this issue."
-        );
+        setAlert({
+          title: "Configuration Error",
+          message: "The backend could not determine user status. This indicates that your projectId is not properly configured or the project metadata is missing.\n\nPlease contact support with your projectId to resolve this issue."
+        });
         setFailedType("config");
         setStep("failed");
         pendingLoginResponseRef.current = null;
@@ -7416,9 +7409,10 @@ function VerifyStep(props) {
         return;
       }
       if (!loginResponse.hasKeyshare && loginResponse.isNewUser === false) {
-        setFailedMessage(
-          "Your account data has been lost on the server.\nThis should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered.\nYou will need to create a new account.\n\nPlease contact support immediately with this error."
-        );
+        setAlert({
+          title: "Account Data Lost",
+          message: "Your account data has been lost on the server. This should never happen and indicates a serious system failure.\n\nUnfortunately, your wallet cannot be recovered. You will need to create a new account.\n\nPlease contact support immediately with this error."
+        });
         setFailedType("critical");
         setStep("failed");
         pendingLoginResponseRef.current = null;
@@ -7444,7 +7438,7 @@ function VerifyStep(props) {
       if (!recoveryUserId && !needsRecovery) {
         setStep("signin");
         setEmail("");
-        setVerificationError("");
+        setAlert(null);
         setPage(null);
       }
       setIsLoading(false);
@@ -7460,7 +7454,10 @@ function VerifyStep(props) {
       } else {
         errorMessage = error.message || "Verification failed. Please try again.";
       }
-      setVerificationError(errorMessage);
+      setAlert({
+        title: "Verification failed",
+        message: errorMessage
+      });
       callbacks?.onLumiaPassportError?.({
         error: error instanceof Error ? error : new Error(errorMessage),
         message: errorMessage
@@ -7470,7 +7467,7 @@ function VerifyStep(props) {
   });
   const { mutate: onResendCode, isPending: isCodeResending } = (0, import_react_query9.useMutation)({
     mutationFn: async () => {
-      setVerificationError("");
+      setAlert(null);
       setIsLoading(true);
       const response = await fetch(addProjectIdToUrl(`${getServiceUrls().tssUrl}/api/auth/email/send-code`), {
         method: "POST",
@@ -7486,17 +7483,24 @@ function VerifyStep(props) {
         setExpiresIn(data.expiresIn || 300);
       }
       if (!response.ok && response.status === 429) {
-        setVerificationError(
-          `Code already sent recently. Please wait ${data.retryAfter || 60} seconds before requesting another.`
-        );
+        setAlert({
+          title: "Code already sent recently (Too Many Requests)",
+          message: `Please wait ${data.retryAfter || 60} seconds before requesting another.`
+        });
       }
       if (!response.ok && response.status !== 429) {
-        setVerificationError(data.message || "Failed to resend verification code");
+        setAlert({
+          title: "Failed to resend verification code",
+          message: data.message || "Unknown error occurred"
+        });
       }
       setIsLoading(false);
     },
     onError: (err) => {
-      setVerificationError(err.message || "Network error. Please check your connection.");
+      setAlert({
+        title: "Failed to resend verification code",
+        message: err.message || "Unknown error occurred"
+      });
       setIsLoading(false);
     }
   });
@@ -7505,7 +7509,7 @@ function VerifyStep(props) {
     /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)("div", { className: "relative flex items-center justify-center gap-2 px-5 pt-3 pb-6", children: [
       /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(OtpIcon, { className: "w-6 h-6" }),
       /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "font-bold text-xl leading-6", children: "Verification code" }),
-      isLoading && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.Loader, { className: "h-4 w-4 animate-spin" }),
+      isLoading && /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.Loader, { className: "h-4 w-4 animate-spin" }),
       /* @__PURE__ */ (0, import_jsx_runtime28.jsxs)(
         Button,
         {
@@ -7517,7 +7521,7 @@ function VerifyStep(props) {
           className: "absolute left-0 top-0 w-5 h-5",
           onClick: goBackToSignIn,
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react16.ArrowLeft, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(import_lucide_react15.ArrowLeft, { className: "h-4 w-4" }),
             /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("span", { className: "sr-only", children: "Back to SignIn" })
           ]
         }
@@ -7533,8 +7537,7 @@ function VerifyStep(props) {
         onVerifyCode,
         onResendCode,
         isLoading,
-        expiresIn,
-        error: verificationError
+        expiresIn
       }
     )
   ] });
@@ -7544,35 +7547,21 @@ function VerifyStep(props) {
 var import_jsx_runtime29 = require("react/jsx-runtime");
 var AuthMenu = () => {
   const isIframeReady = useLumiaPassportSession((st) => st.isIframeReady);
-  const page = useLayoutDataStore((st) => st.page);
   const setMainPageHeight = useLayoutDataStore((st) => st.setMainPageHeight);
-  (0, import_react21.useEffect)(() => setMainPageHeight(DEFAULT_AUTH_MENU_HEIGHT), [setMainPageHeight]);
-  const {
-    step,
-    setStep,
-    setPasskeyError,
-    setPasskeyStatus,
-    setEmail,
-    setVerificationError,
-    setFailedMessage,
-    setCodeSendError
-  } = useAuthStore();
+  const { step, alert: alert2, setStep, setPasskeyStatus, setEmail, setAlert } = useAuthStore();
+  (0, import_react21.useEffect)(() => setMainPageHeight(DEFAULT_AUTH_MENU_HEIGHT), []);
   (0, import_react21.useEffect)(() => {
-    if (page !== "auth" /* AUTH */) {
+    return () => {
       setStep("signin");
       setEmail("");
-      setVerificationError("");
-      setCodeSendError("");
-      setPasskeyError("");
       setPasskeyStatus("idle");
-      setFailedMessage("");
-    }
-  }, [page]);
-  useListenIframeAuthEvents();
+      setAlert(null);
+    };
+  }, []);
   const { pendingLoginResponseRef, onAuthSuccess, goBackToSignIn, checkDisplayNameRequired } = useAuthMenuHandlers();
   if (!isIframeReady) {
     return /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("div", { className: "w-full p-8 flex flex-col justify-center items-center gap-[var(--l-pass-gap)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react17.Loader, { className: "w-5 h-5 animate-spin" }),
+      /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react16.Loader, { className: "w-5 h-5 animate-spin" }),
       /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "text-sm text-[var(--l-pass-fg-muted)]", children: "Initializing wallet..." })
     ] });
   }
@@ -7608,25 +7597,32 @@ var AuthMenu = () => {
     }),
     [onAuthSuccess, goBackToSignIn, checkDisplayNameRequired]
   );
-  return (
-    // simple wrap by div
-    /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-full", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_framer_motion.AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(
-      import_framer_motion.motion.div,
-      {
-        initial: { opacity: 0, height: DEFAULT_AUTH_MENU_HEIGHT },
-        animate: { opacity: 1, height: "auto" },
-        exit: { opacity: 0, height: DEFAULT_AUTH_MENU_HEIGHT },
-        style: { overflow: "hidden" },
-        transition: Y_ANIMATION_SETUP,
-        children: stepContent[step]
-      },
-      step
-    ) }) })
-  );
+  return /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("div", { className: "w-full", children: /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_framer_motion.AnimatePresence, { mode: "wait", initial: false, children: /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(
+    import_framer_motion.motion.div,
+    {
+      initial: { opacity: 0, height: DEFAULT_AUTH_MENU_HEIGHT },
+      animate: { opacity: 1, height: "auto" },
+      exit: { opacity: 0, height: DEFAULT_AUTH_MENU_HEIGHT },
+      style: { overflow: "hidden" },
+      transition: Y_ANIMATION_SETUP,
+      children: [
+        stepContent[step],
+        !!alert2 && // <Expandable isExpanded contentClassName="px-[var(--l-pass-pd)]">
+        /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)(Highlight, { type: "error", className: "w-full flex gap-[var(--l-pass-gap)]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsx)(import_lucide_react16.AlertTriangle, { className: "w-5 h-5 text-[var(--l-pass-error)]" }),
+          /* @__PURE__ */ (0, import_jsx_runtime29.jsxs)("span", { className: "block w-full flex flex-col gap-1 flex-1", children: [
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "block font-bold leading-5", children: alert2.title }),
+            /* @__PURE__ */ (0, import_jsx_runtime29.jsx)("span", { className: "block whitespace-pre-line", children: alert2.message })
+          ] })
+        ] })
+      ]
+    },
+    step
+  ) }) });
 };
 
 // src/internal/components/BuyMenu/ByuMenu.tsx
-var import_lucide_react20 = require("lucide-react");
+var import_lucide_react19 = require("lucide-react");
 
 // src/internal/components/BuyMenu/assets/BinanceIcon.tsx
 var import_jsx_runtime30 = require("react/jsx-runtime");
@@ -7723,7 +7719,7 @@ function RampnowIcon() {
 
 // src/internal/components/BuyMenu/binance/Binance.tsx
 var import_react_query10 = require("@tanstack/react-query");
-var import_lucide_react18 = require("lucide-react");
+var import_lucide_react17 = require("lucide-react");
 var import_react23 = require("react");
 
 // src/internal/components/BuyMenu/components/PaymentSelector.tsx
@@ -7958,7 +7954,7 @@ function Binance(props) {
       Input,
       {
         ref: inputRef,
-        Icon: import_lucide_react18.DollarSign,
+        Icon: import_lucide_react17.DollarSign,
         name: "binance-onramp-input",
         disabled: isLoading,
         autoComplete: "off",
@@ -7971,7 +7967,7 @@ function Binance(props) {
     ),
     localError && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(Highlight, { type: "error", children: localError }),
     !localError && ((receiveLumiaAmount || 0) > 0 || isLoading) && /* @__PURE__ */ (0, import_jsx_runtime33.jsxs)("div", { className: cn("flex justify-between gap-4 mt-2 text-sm leading-4", { "opacity-60": srcInputAmount <= 0 }), children: [
-      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react18.LoaderIcon, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-[var(--l-pass-fg-muted)]", children: "You receive:" }),
+      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react17.LoaderIcon, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { className: "text-[var(--l-pass-fg-muted)]", children: "You receive:" }),
       (receiveLumiaAmount || 0) > 0 && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { children: `${receiveLumiaAmount || 0} LUMIA` })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(
@@ -7995,7 +7991,7 @@ function Binance(props) {
         variant: "default",
         onClick: () => checkoutFundWalletOrder(),
         children: [
-          redirecting && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react18.LoaderIcon, { size: 16, className: "animate-spin" }),
+          redirecting && /* @__PURE__ */ (0, import_jsx_runtime33.jsx)(import_lucide_react17.LoaderIcon, { size: 16, className: "animate-spin" }),
           /* @__PURE__ */ (0, import_jsx_runtime33.jsx)("span", { children: redirecting ? "REDIRECTING..." : "CONTINUE" })
         ]
       }
@@ -8005,7 +8001,7 @@ function Binance(props) {
 
 // src/internal/components/BuyMenu/rampnow/Rampnow.tsx
 var import_react_query11 = require("@tanstack/react-query");
-var import_lucide_react19 = require("lucide-react");
+var import_lucide_react18 = require("lucide-react");
 var import_react24 = require("react");
 
 // src/internal/components/BuyMenu/rampnow/api.ts
@@ -8144,7 +8140,7 @@ function Rampnow(props) {
       Input,
       {
         ref: inputRef,
-        Icon: import_lucide_react19.DollarSign,
+        Icon: import_lucide_react18.DollarSign,
         name: "rampnow-onramp-input",
         disabled: isLoading,
         autoComplete: "off",
@@ -8157,7 +8153,7 @@ function Rampnow(props) {
     ),
     localError && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(Highlight, { type: "error", children: localError }),
     !localError && ((receiveLumiaAmount || 0) > 0 || isLoading) && /* @__PURE__ */ (0, import_jsx_runtime34.jsxs)("div", { className: cn("flex justify-between gap-4 text-sm leading-4", { "opacity-60": srcInputAmount <= 0 }), children: [
-      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.LoaderIcon, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-[var(--l-pass-fg-muted)]", children: "You receive:" }),
+      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react18.LoaderIcon, { size: 16, className: "animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "text-[var(--l-pass-fg-muted)]", children: "You receive:" }),
       (receiveLumiaAmount || 0) > 0 && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { children: `${receiveLumiaAmount || 0} LUMIA` })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(
@@ -8178,7 +8174,7 @@ function Rampnow(props) {
         variant: "default",
         onClick: () => checkoutFundWalletOrder(),
         children: [
-          redirecting && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react19.LoaderIcon, { size: 16, className: "animate-spin" }),
+          redirecting && /* @__PURE__ */ (0, import_jsx_runtime34.jsx)(import_lucide_react18.LoaderIcon, { size: 16, className: "animate-spin" }),
           /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { children: redirecting ? "REDIRECTING..." : "CONTINUE" })
         ]
       }
@@ -8279,7 +8275,7 @@ function BuyMenu() {
       className: "list-scrollbar-y w-full flex flex-col gap-[var(--l-pass-gap)] p-[var(--l-pass-pd)]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime36.jsxs)("div", { className: "flex items-center gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react20.ArrowLeft, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(import_lucide_react19.ArrowLeft, { className: "h-4 w-4" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("span", { className: "text-xl font-semibold", children: "Buy LUMIA" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime36.jsx)("div", { className: "w-full flex items-center gap-[var(--l-pass-gap)]", children: AVAILABLE_RAMP_PROVIDERS.map(({ id, icon: Icon }) => /* @__PURE__ */ (0, import_jsx_runtime36.jsx)(
@@ -8302,13 +8298,13 @@ function BuyMenu() {
 
 // src/internal/components/KeyshareRestoreMenu/KeyshareRestoreMenu.tsx
 var import_react_query17 = require("@tanstack/react-query");
-var import_lucide_react27 = require("lucide-react");
+var import_lucide_react26 = require("lucide-react");
 var import_react31 = require("react");
 init_vaultClient();
 
 // src/internal/components/KeyshareRestoreMenu/components/MethodSelector.tsx
 var import_react_query15 = require("@tanstack/react-query");
-var import_lucide_react21 = require("lucide-react");
+var import_lucide_react20 = require("lucide-react");
 var import_react28 = require("react");
 init_vaultClient();
 
@@ -8724,7 +8720,7 @@ function useRestoreAccount() {
 var import_jsx_runtime37 = require("react/jsx-runtime");
 var RESTORE_METHODS = [
   { method: "server", label: "Server", Icon: OtpIcon },
-  { method: "file", label: "File", Icon: import_lucide_react21.FileDown }
+  { method: "file", label: "File", Icon: import_lucide_react20.FileDown }
   // { method: 'cloud', label: 'Cloud', Icon: Cloud }
 ];
 function MethodSelector(props) {
@@ -8771,7 +8767,7 @@ function MethodSelector(props) {
   }, [mode, serverRecoveryStatus]);
   if (!!selectedRecoveryMethod) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime37.jsxs)(import_react28.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "block w-full text-xs font-semibold text-center leading-8 text-[var(--l-pass-fg-muted)]", children: isBackupStatusLoading ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "block w-full h-8 flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react21.Loader, { className: "animate-spin w-4 h-4 mx-auto" }) }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "leading-8", children: mode === "restore" ? "Choose method to restore" : "Create or Update Backup via" }) }),
+    /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "block w-full text-xs font-semibold text-center leading-8 text-[var(--l-pass-fg-muted)]", children: isBackupStatusLoading ? /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "block w-full h-8 flex items-center", children: /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(import_lucide_react20.Loader, { className: "animate-spin w-4 h-4 mx-auto" }) }) : /* @__PURE__ */ (0, import_jsx_runtime37.jsx)("span", { className: "leading-8", children: mode === "restore" ? "Choose method to restore" : "Create or Update Backup via" }) }),
     /* @__PURE__ */ (0, import_jsx_runtime37.jsx)(
       "div",
       {
@@ -8821,7 +8817,7 @@ function MethodSelector(props) {
 }
 
 // src/internal/components/KeyshareRestoreMenu/components/NoBackupFound.tsx
-var import_lucide_react22 = require("lucide-react");
+var import_lucide_react21 = require("lucide-react");
 var import_jsx_runtime38 = require("react/jsx-runtime");
 var ACCOUNT_RECOVERY_TEXT = `This device doesn't have access to your wallet keyshare, and no backup was found in the Vault. To access your wallet: use the original device where you created the account, create a backup from that device first, then try restoring on this device.`;
 var ACCOUNT_FILE_RECOVERY_TEXT = `Try uploading a backup file if you have one saved locally, or create a different new account`;
@@ -8830,7 +8826,7 @@ function NoBackupFound(props) {
   const { restoreFile, setRestoreFile } = useRestoreStore();
   return /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(import_jsx_runtime38.Fragment, { children: [
     /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Highlight, { type: "error", className: "animate-glow-warning flex gap-[var(--l-pass-gap)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.AlertCircle, { className: "h-4 w-4 flex-0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.AlertCircle, { className: "h-4 w-4 flex-0" }),
       /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)("div", { className: "w-full flex-1 flex flex-col gap-2", children: [
         /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "block w-full text-xl leading-5 font-semibold", children: "No Keyshare Found! Account Recovery Needed" }),
         /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "block w-full text-xs", children: ACCOUNT_RECOVERY_TEXT })
@@ -8842,7 +8838,7 @@ function NoBackupFound(props) {
       /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("div", { style: { borderTop: "1px solid var(--l-pass-bd)" }, className: "flex-1" })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Highlight, { type: "warning", className: "flex gap-[var(--l-pass-gap)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.Upload, { className: "h-4 w-4 flex-0" }),
+      /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.Upload, { className: "h-4 w-4 flex-0" }),
       /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { className: "block w-full text-xs", children: ACCOUNT_FILE_RECOVERY_TEXT })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("label", { className: "block w-full flex items-center justify-center cursor-pointer", children: /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(
@@ -8861,14 +8857,14 @@ function NoBackupFound(props) {
       }
     ) }),
     /* @__PURE__ */ (0, import_jsx_runtime38.jsxs)(Button, { size: "large", className: "w-full", onClick: () => restoreFromFile(), disabled: isLoading || !restoreFile, children: [
-      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react22.RefreshCcw, { className: "w-4 h-4" }),
+      isLoading ? /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime38.jsx)(import_lucide_react21.RefreshCcw, { className: "w-4 h-4" }),
       /* @__PURE__ */ (0, import_jsx_runtime38.jsx)("span", { children: `Restore with ${restoreFile ? restoreFile.name : "File"}` })
     ] })
   ] });
 }
 
 // src/internal/components/KeyshareRestoreMenu/methods/File.tsx
-var import_lucide_react23 = require("lucide-react");
+var import_lucide_react22 = require("lucide-react");
 var import_jsx_runtime39 = require("react/jsx-runtime");
 function File2(props) {
   const { isLoading, mode = "restore", fileHandler } = props;
@@ -8888,7 +8884,7 @@ function File2(props) {
             setSuccess(null);
             setMethod(null);
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react23.ArrowLeft, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react22.ArrowLeft, { className: "h-4 w-4" })
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { className: "text-xl font-semibold", children: "File" })
@@ -8909,7 +8905,7 @@ function File2(props) {
       }
     ) }),
     restoreFile && /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(Button, { variant: "ghost", onClick: () => setRestoreFile(null), children: [
-      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react23.RefreshCcw, { className: "w-4 h-4" }),
+      /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react22.RefreshCcw, { className: "w-4 h-4" }),
       /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { children: "Clear selected File" })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime39.jsxs)(
@@ -8920,7 +8916,7 @@ function File2(props) {
         onClick: () => fileHandler(),
         disabled: !!isLoading || mode === "restore" && !restoreFile,
         children: [
-          isLoading ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react23.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react23.FileDown, { className: "w-4 h-4" }),
+          isLoading ? /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react22.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime39.jsx)(import_lucide_react22.FileDown, { className: "w-4 h-4" }),
           /* @__PURE__ */ (0, import_jsx_runtime39.jsx)("span", { children: `${actionText} ${restoreFile ? restoreFile.name : "Backup File"}` })
         ]
       }
@@ -8929,12 +8925,12 @@ function File2(props) {
 }
 
 // src/internal/components/KeyshareRestoreMenu/methods/Server.tsx
-var import_lucide_react25 = require("lucide-react");
+var import_lucide_react24 = require("lucide-react");
 var import_react29 = require("react");
 
 // src/internal/components/ui/checkbox.tsx
 var CheckboxPrimitive = __toESM(require("@radix-ui/react-checkbox"), 1);
-var import_lucide_react24 = require("lucide-react");
+var import_lucide_react23 = require("lucide-react");
 var import_jsx_runtime40 = require("react/jsx-runtime");
 function Checkbox({ className, ...props }) {
   return /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(
@@ -8952,7 +8948,7 @@ function Checkbox({ className, ...props }) {
         className
       ),
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "grid place-content-center transition-none", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react24.CheckIcon, { className: "w-4 h-4 text-[var(--l-pass-fg)]" }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(CheckboxPrimitive.Indicator, { "data-slot": "checkbox-indicator", className: "grid place-content-center transition-none", children: /* @__PURE__ */ (0, import_jsx_runtime40.jsx)(import_lucide_react23.CheckIcon, { className: "w-4 h-4 text-[var(--l-pass-fg)]" }) })
     }
   );
 }
@@ -8992,7 +8988,7 @@ function Server(props) {
             setSuccess(null);
             setMethod(null);
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react25.ArrowLeft, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react24.ArrowLeft, { className: "h-4 w-4" })
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { className: "text-xl font-semibold", children: passkeyOrPassword })
@@ -9013,7 +9009,7 @@ function Server(props) {
       Input,
       {
         autoComplete: "off",
-        Icon: import_lucide_react25.ServerIcon,
+        Icon: import_lucide_react24.ServerIcon,
         type: showPassword ? "text" : "password",
         placeholder: "Enter server backup  password",
         value: restorePassword,
@@ -9021,7 +9017,7 @@ function Server(props) {
         onKeyDown: (e) => {
           if (e.key === "Enter" && !isLoading && restorePassword) actionRef.current?.click();
         },
-        element: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { variant: "ghost", size: "icon", type: "button", onClick: () => setShowPassword(!showPassword), children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react25.EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react25.Eye, { className: "h-4 w-4" }) })
+        element: /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Button, { variant: "ghost", size: "icon", type: "button", onClick: () => setShowPassword(!showPassword), children: showPassword ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react24.EyeOff, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react24.Eye, { className: "h-4 w-4" }) })
       }
     ),
     /* @__PURE__ */ (0, import_jsx_runtime41.jsxs)(
@@ -9033,7 +9029,7 @@ function Server(props) {
         disabled: isLoading || !usePasskey && !restorePassword,
         className: "w-full",
         children: [
-          isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react25.Loader, { className: "animate-spin h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react25.ServerIcon, { className: "h-4 w-4" }),
+          isLoading ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react24.Loader, { className: "animate-spin h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(import_lucide_react24.ServerIcon, { className: "h-4 w-4" }),
           /* @__PURE__ */ (0, import_jsx_runtime41.jsx)("span", { children: isLoading ? loadingText : `${actionText} with ${passkeyOrPassword}` })
         ]
       }
@@ -9043,7 +9039,7 @@ function Server(props) {
 
 // src/internal/components/KeyshareRestoreMenu/methods/Cloud.tsx
 var import_react_query16 = require("@tanstack/react-query");
-var import_lucide_react26 = require("lucide-react");
+var import_lucide_react25 = require("lucide-react");
 var import_react30 = require("react");
 var import_jsx_runtime42 = require("react/jsx-runtime");
 function Cloud2(props) {
@@ -9090,12 +9086,12 @@ function Cloud2(props) {
             setSelectedCloudProvider(null);
             setMethod(null);
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react26.ArrowLeft, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react25.ArrowLeft, { className: "h-4 w-4" })
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "text-xl font-semibold", children: "Cloud" })
     ] }),
-    isCloudProvidersLoading && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react26.Loader, { className: "animate-spin w-4 h-4 mx-auto" }),
+    isCloudProvidersLoading && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react25.Loader, { className: "animate-spin w-4 h-4 mx-auto" }),
     !isCloudProvidersLoading && cloudProviders.length > 1 && /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(
       "select",
       {
@@ -9114,7 +9110,7 @@ function Cloud2(props) {
         onClick: () => cloudHandler?.(),
         disabled: isLoading || !selectedCloudProvider || cloudProviders.length === 0,
         children: [
-          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react26.CloudUpload, { className: "w-4 h-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime42.jsx)(import_lucide_react25.CloudUpload, { className: "w-4 h-4" }),
           isLoading ? loadingText : actionText
         ]
       }
@@ -9198,7 +9194,7 @@ var KeyshareRestoreMenu = () => {
       className: "list-scrollbar-y w-full",
       children: /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Expandable, { isExpanded: true, contentClassName: "w-full flex flex-col gap-[var(--l-pass-gap)] p-[var(--l-pass-pd)]", children: [
         checkingBackup && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)] text-center justify-center items-center", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.Loader, { className: "w-5 h-5 animate-spin" }),
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.Loader, { className: "w-5 h-5 animate-spin" }),
           /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "block w-full text-xs leading-4", children: "Checking for backups..." }),
           /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "block w-full text-xs leading-4", children: "Please wait while we check for available backups..." })
         ] }),
@@ -9211,7 +9207,7 @@ var KeyshareRestoreMenu = () => {
         ),
         !success && !checkingBackup && hasServerBackup && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(import_jsx_runtime43.Fragment, { children: [
           /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)("div", { className: "flex items-center justify-center gap-[var(--l-pass-gap)] px-[var(--l-pass-pd)] py-[var(--l-pass-gap)]", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.CloudUpload, { className: "w-6 h-6" }),
+            /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.CloudUpload, { className: "w-6 h-6" }),
             /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "font-bold text-xl leading-6", children: "Restore Account" })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(MethodSelector, { mode: "restore" }),
@@ -9237,18 +9233,18 @@ var KeyshareRestoreMenu = () => {
               disabled: isDisconnecting || isRestoringFromFile || isRestoringFromServer,
               className: "w-fit mx-auto",
               children: [
-                isDisconnecting ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.LogOut, { className: "w-4 h-4" }),
+                isDisconnecting ? /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.LogOut, { className: "w-4 h-4" }),
                 /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { children: "Disconnect" })
               ]
             }
           )
         ] }),
         error && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Highlight, { type: "error", className: "flex gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
           /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "w-full flex-1 block", children: error })
         ] }),
         success && /* @__PURE__ */ (0, import_jsx_runtime43.jsxs)(Highlight, { type: "success", className: "flex gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react27.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime43.jsx)(import_lucide_react26.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
           /* @__PURE__ */ (0, import_jsx_runtime43.jsx)("span", { className: "w-full flex-1 block", children: success })
         ] })
       ] })
@@ -9257,7 +9253,7 @@ var KeyshareRestoreMenu = () => {
 };
 
 // src/internal/components/KeyshareRestoreMenu/KeyshareBackupMenu.tsx
-var import_lucide_react28 = require("lucide-react");
+var import_lucide_react27 = require("lucide-react");
 var import_react32 = require("react");
 var import_jsx_runtime44 = require("react/jsx-runtime");
 var COMPONENTS = {
@@ -9317,13 +9313,13 @@ function KeyshareBackupMenu() {
                 setSuccess(null);
                 setPage("settings" /* SETTINGS */);
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react28.ArrowLeft, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react27.ArrowLeft, { className: "h-4 w-4" })
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "text-xl font-semibold", children: "Create Backup" })
         ] }),
         !isRecoveryLoading && !currentBackupMethod && !hasRecoveryData && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Highlight, { type: "warning", className: "flex gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react28.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react27.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
           /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "block flex-1", children: BACKUP_INFO_MESSAGE })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(MethodSelector, { mode: "backup" }),
@@ -9339,7 +9335,7 @@ function KeyshareBackupMenu() {
             }
           ),
           currentBackupMethod === "server" && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Highlight, { className: "flex items-start gap-[var(--l-pass-gap)]", type: "info", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react28.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
+            /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react27.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
             /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)("div", { children: [
               /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "font-medium", children: "Security Notice:" }),
               " All backups are encrypted with AES-256 using your ",
@@ -9351,11 +9347,11 @@ function KeyshareBackupMenu() {
           ] })
         ] }),
         error && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Highlight, { type: "error", className: "flex gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react28.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react27.AlertCircle, { className: "h-4 w-4 flex-shrink-0" }),
           /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "block w-full flex-1", children: error })
         ] }),
         success && /* @__PURE__ */ (0, import_jsx_runtime44.jsxs)(Highlight, { type: "success", className: "flex gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react28.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime44.jsx)(import_lucide_react27.CheckCircle2, { className: "h-4 w-4 flex-shrink-0" }),
           /* @__PURE__ */ (0, import_jsx_runtime44.jsx)("span", { className: "block w-full flex-1", children: success })
         ] })
       ] })
@@ -9364,7 +9360,7 @@ function KeyshareBackupMenu() {
 }
 
 // src/internal/components/MainMenu/MainMenu.tsx
-var import_lucide_react29 = require("lucide-react");
+var import_lucide_react28 = require("lucide-react");
 var import_react33 = require("react");
 
 // src/internal/components/ManageWalletMenu/hooks/useProvidersList.ts
@@ -9386,10 +9382,10 @@ function useProvidersList() {
 // src/internal/components/MainMenu/MainMenu.tsx
 var import_jsx_runtime45 = require("react/jsx-runtime");
 var MAIN_MENU_BUTTONS = [
-  { id: "send" /* SEND */, label: "Send", icon: import_lucide_react29.ChevronRight },
-  { id: "receive" /* RECEIVE */, label: "Receive", icon: import_lucide_react29.ChevronLeft },
-  { id: "buy" /* BUY */, label: "Buy", icon: import_lucide_react29.DollarSign },
-  { id: "assets" /* ASSETS */, label: "Portfolio", icon: import_lucide_react29.Wallet2 }
+  { id: "send" /* SEND */, label: "Send", icon: import_lucide_react28.ChevronRight },
+  { id: "receive" /* RECEIVE */, label: "Receive", icon: import_lucide_react28.ChevronLeft },
+  { id: "buy" /* BUY */, label: "Buy", icon: import_lucide_react28.DollarSign },
+  { id: "assets" /* ASSETS */, label: "Portfolio", icon: import_lucide_react28.Wallet2 }
 ];
 function MainMenu() {
   const address = useLumiaPassportSession((st) => st.address);
@@ -9416,7 +9412,7 @@ function MainMenu() {
 
 // src/internal/components/ManageWalletMenu/ManageWallet.tsx
 var import_lodash_es3 = require("lodash-es");
-var import_lucide_react33 = require("lucide-react");
+var import_lucide_react32 = require("lucide-react");
 var import_react37 = require("react");
 
 // src/modules/linkedProfiles.ts
@@ -9467,35 +9463,27 @@ init_passkey2();
 // src/internal/components/ManageWalletMenu/EmailForm.tsx
 init_lumiaPassport();
 var import_react_query20 = require("@tanstack/react-query");
-var import_lucide_react30 = require("lucide-react");
+var import_lucide_react29 = require("lucide-react");
 init_projectId();
 
 // src/internal/components/ManageWalletMenu/hooks/useStore.ts
 var import_zustand5 = require("zustand");
 var useManageWalletStore = (0, import_zustand5.create)((set) => ({
+  alert: null,
   emailStep: "input",
   email: "",
   emailCode: "",
-  emailCodeSentError: "",
   emailCodeExpiresIn: 0,
-  isWalletLinking: false,
   linkIsLoading: false,
-  linkError: "",
-  verificationError: "",
   providerType: null,
   confirmUnlink: null,
+  setAlert: (alert2) => set({ alert: alert2 }),
   setEmailStep: (emailStep) => set({ emailStep }),
   setEmail: (email) => set({ email }),
   setEmailCode: (emailCode) => set({ emailCode }),
-  setEmailCodeSentError: (emailCodeSentError) => set({ emailCodeSentError }),
   setEmailCodeExpiresIn: (emailCodeExpiresIn) => set({ emailCodeExpiresIn }),
-  setIsWalletLinking: (isWalletLinking) => set({ isWalletLinking }),
   setLinkIsLoading: (linkIsLoading) => set({ linkIsLoading }),
-  setLinkError: (linkError) => set({ linkError }),
-  setVerificationError: (verificationError) => set({ verificationError }),
-  setProviderType: (providerType) => {
-    set({ providerType });
-  },
+  setProviderType: (providerType) => set({ providerType }),
   setConfirmUnlink: (confirmUnlink) => set({ confirmUnlink })
 }));
 
@@ -9508,12 +9496,12 @@ function EmailForm() {
   } = useLumiaPassportConfig();
   const isLoading = useLumiaPassportSession((st) => st.isLoading);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
-  const { email, setEmail, setEmailCodeSentError, setEmailCodeExpiresIn, setEmailStep } = useManageWalletStore();
+  const { email, setEmail, setAlert, setEmailCodeExpiresIn, setEmailStep } = useManageWalletStore();
   const { mutate: onSendVerificationCode } = (0, import_react_query20.useMutation)({
     mutationFn: async () => {
       if (!email) return;
       setIsLoading(true);
-      setEmailCodeSentError("");
+      setAlert(null);
       try {
         const response = await fetch(addProjectIdToUrl(`${getServiceUrls().tssUrl}/api/auth/email/send-code`), {
           method: "POST",
@@ -9533,18 +9521,28 @@ function EmailForm() {
         } else {
           if (response.status === 429) {
             const retryAfter = data.retryAfter || 60;
-            setEmailCodeSentError(
-              `Code already sent recently. Please wait ${retryAfter} seconds before requesting another.`
-            );
+            setAlert({
+              title: "Too Many Requests",
+              message: `Code already sent recently. Please wait ${retryAfter} seconds before requesting another.`
+            });
           } else if (response.status === 400) {
-            setEmailCodeSentError(data.message || "Invalid email address");
+            setAlert({
+              title: "Invalid Email",
+              message: data.message || "Invalid email address"
+            });
           } else {
-            setEmailCodeSentError(data.message || "Failed to send verification code");
+            setAlert({
+              title: "Error",
+              message: data.message || "Failed to send verification code"
+            });
           }
         }
       } catch (error) {
         const errorMessage = "Network error. Please check your connection.";
-        setEmailCodeSentError(errorMessage);
+        setAlert({
+          title: "Network Error",
+          message: errorMessage
+        });
         try {
           callbacks?.onLumiaPassportError?.({
             error: error instanceof Error ? error : new Error(errorMessage),
@@ -9562,7 +9560,7 @@ function EmailForm() {
       Input,
       {
         name: "signin-email",
-        Icon: import_lucide_react30.Mail,
+        Icon: import_lucide_react29.Mail,
         type: "email",
         autoComplete: "off",
         placeholder: config.email.placeholder,
@@ -9579,7 +9577,7 @@ function EmailForm() {
         size: "large",
         disabled: !email || isLoading,
         onClick: () => onSendVerificationCode(),
-        children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react30.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react30.ChevronRight, { className: "w-4 h-4" })
+        children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react29.Loader, { className: "w-4 h-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime46.jsx)(import_lucide_react29.ChevronRight, { className: "w-4 h-4" })
       }
     )
   ] });
@@ -9589,19 +9587,21 @@ function EmailForm() {
 var import_react_query21 = require("@tanstack/react-query");
 init_email();
 function useSendVerificationCode() {
-  const { setVerificationError, setLinkIsLoading, setEmailCodeSentError, setEmailCodeExpiresIn } = useManageWalletStore();
+  const setAlert = useManageWalletStore((st) => st.setAlert);
+  const setLinkIsLoading = useManageWalletStore((st) => st.setLinkIsLoading);
+  const setEmailCodeExpiresIn = useManageWalletStore((st) => st.setEmailCodeExpiresIn);
   return (0, import_react_query21.useMutation)({
     mutationFn: async (email) => {
       if (!email) {
         throw new Error("Email is required");
       }
-      setVerificationError("");
+      setAlert(null);
       setLinkIsLoading(true);
       await sendEmailLinkCode(email);
     },
     onError: (error) => {
       console.error("Failed to send verification code", error.message);
-      setEmailCodeSentError(error?.message || "Failed to send verification code");
+      setAlert({ title: "Error", message: error?.message || "Failed to send verification code" });
       setLinkIsLoading(false);
     },
     onSuccess: () => {
@@ -9620,28 +9620,17 @@ function useVerifyCode() {
   const qc = (0, import_react_query22.useQueryClient)();
   const address = useLumiaPassportSession((st) => st.address);
   const setIsLoading = useLumiaPassportSession((st) => st.setIsLoading);
-  const {
-    email,
-    emailCode,
-    setEmail,
-    setEmailStep,
-    setEmailCode,
-    setProviderType,
-    setLinkIsLoading,
-    setVerificationError,
-    setEmailCodeSentError
-  } = useManageWalletStore();
+  const { email, emailCode, setEmail, setEmailStep, setEmailCode, setProviderType, setLinkIsLoading, setAlert } = useManageWalletStore();
   return (0, import_react_query22.useMutation)({
     mutationFn: async (codeToVerify) => {
       const code = codeToVerify ?? emailCode;
       if (!code) {
-        setEmailCodeSentError("Please enter the verification code");
+        setAlert({ title: "Error", message: "Please enter the verification code" });
         return;
       }
       setIsLoading(true);
       setLinkIsLoading(true);
-      setVerificationError("");
-      setEmailCodeSentError("");
+      setAlert(null);
       return await verifyEmailLinkCode(email, code);
     },
     onSuccess: async () => {
@@ -9650,8 +9639,7 @@ function useVerifyCode() {
       setProviderType(null);
       setEmail("");
       setEmailCode("");
-      setVerificationError("");
-      setEmailCodeSentError("");
+      setAlert(null);
       setEmailStep("input");
       try {
         callbacks?.onLumiaPassportUpdate?.({ providers: qc.getQueryData([PROVIDERS_QUERY_KEY, address]) });
@@ -9661,7 +9649,7 @@ function useVerifyCode() {
       setLinkIsLoading(false);
     },
     onError: (error) => {
-      setVerificationError(error?.message || "Failed to verify and link email");
+      setAlert({ title: "Error", message: error?.message || "Failed to verify and link email" });
       setIsLoading(false);
       setLinkIsLoading(false);
     }
@@ -9682,7 +9670,7 @@ function normalizePasskeyLinkError(msg) {
 }
 function AddProvider() {
   const qc = (0, import_react_query23.useQueryClient)();
-  const { callbacks } = useLumiaPassportConfig();
+  const callbacks = useLumiaPassportConfig().callbacks;
   const address = useLumiaPassportSession((st) => st.address);
   const {
     linkIsLoading,
@@ -9690,8 +9678,8 @@ function AddProvider() {
     email,
     emailStep,
     emailCodeExpiresIn,
+    setAlert,
     setProviderType,
-    setLinkError,
     setLinkIsLoading
   } = useManageWalletStore();
   const setPage = useLayoutDataStore((st) => st.setPage);
@@ -9731,7 +9719,7 @@ function AddProvider() {
           size: "medium",
           disabled: isLoading,
           onClick: async () => {
-            setLinkError("");
+            setAlert(null);
             setLinkIsLoading(true);
             try {
               await linkPasskeyWithWebAuthn({
@@ -9753,7 +9741,7 @@ function AddProvider() {
               setProviderType(null);
             } catch (e) {
               const msg = e?.message || "Failed to link passkey";
-              setLinkError(normalizePasskeyLinkError(msg));
+              setAlert({ title: "Error", message: normalizePasskeyLinkError(msg) });
             } finally {
               setLinkIsLoading(false);
             }
@@ -9772,7 +9760,7 @@ function AddProvider() {
           size: "medium",
           disabled: isLoading,
           onClick: async () => {
-            setLinkError("");
+            setAlert(null);
             setLinkIsLoading(true);
             try {
               await linkPasskeyWithWebAuthn({
@@ -9794,7 +9782,7 @@ function AddProvider() {
               setProviderType(null);
             } catch (e) {
               const msg = e?.message || "Failed to link passkey";
-              setLinkError(normalizePasskeyLinkError(msg));
+              setAlert({ title: "Error", message: normalizePasskeyLinkError(msg) });
             } finally {
               setLinkIsLoading(false);
             }
@@ -9812,7 +9800,7 @@ function AddProvider() {
 
 // src/internal/components/ManageWalletMenu/EmailNotConnectedWarning.tsx
 var import_framer_motion2 = require("framer-motion");
-var import_lucide_react31 = require("lucide-react");
+var import_lucide_react30 = require("lucide-react");
 init_auth();
 var import_jsx_runtime48 = require("react/jsx-runtime");
 function EmailNotConnectedWarning() {
@@ -9831,7 +9819,7 @@ function EmailNotConnectedWarning() {
       transition: Y_ANIMATION_SETUP,
       children: /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)(Highlight, { type: "warning", className: "flex flex-col gap-[var(--l-pass-gap)] items-center text-center", children: [
         /* @__PURE__ */ (0, import_jsx_runtime48.jsxs)("span", { className: "flex items-center gap-[var(--l-pass-gap)] text-lg font-bold", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react31.Mail, { className: "w-5 h-5" }),
+          /* @__PURE__ */ (0, import_jsx_runtime48.jsx)(import_lucide_react30.Mail, { className: "w-5 h-5" }),
           "CONNECT EMAIL"
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime48.jsx)("span", { className: "font-medium", children: "Connect your email for easier account recovery and additional security." })
@@ -9852,14 +9840,15 @@ function useLinkSocial() {
     callbacks
   } = useLumiaPassportConfig();
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const { providerType, linkIsLoading, isWalletLinking, setProviderType, setLinkIsLoading, setLinkError } = useManageWalletStore();
+  const isWalletLinking = useLayoutDataStore((st) => st.isWalletLinking);
+  const { providerType, linkIsLoading, setProviderType, setAlert, setLinkIsLoading } = useManageWalletStore();
   const handleLinkSocialProvider = import_react35.default.useCallback(
     async (providerIdRaw) => {
       const providerKey = providerIdRaw.toLowerCase();
       const normalizedKey = providerKey === "twitter" ? "x" : providerKey;
       try {
         setLinkIsLoading(true);
-        setLinkError("");
+        setAlert(null);
         const socialProvider = config.social?.providers?.find(
           (p) => (p.id || "").toLowerCase() === normalizedKey && p.enabled
         );
@@ -9897,7 +9886,7 @@ function useLinkSocial() {
       } catch (e) {
         console.error(`[ManageWallet] Failed to link ${providerIdRaw}:`, e);
         const message = e?.message || `Failed to link ${providerIdRaw}`;
-        setLinkError(message);
+        setAlert({ title: "Error", message });
         setProviderType(null);
       } finally {
         setLinkIsLoading(false);
@@ -9936,12 +9925,13 @@ function useLinkTelegram() {
   } = useLumiaPassportConfig();
   const qc = (0, import_react_query25.useQueryClient)();
   const address = useLumiaPassportSession((st) => st.address);
-  const { providerType, linkIsLoading, isWalletLinking, setLinkIsLoading, setProviderType, setLinkError } = useManageWalletStore();
+  const isWalletLinking = useLayoutDataStore((st) => st.isWalletLinking);
+  const { providerType, linkIsLoading, setLinkIsLoading, setProviderType, setAlert } = useManageWalletStore();
   const setPage = useLayoutDataStore((st) => st.setPage);
   const handleLinkTelegram = (0, import_react36.useCallback)(async () => {
     try {
       setLinkIsLoading(true);
-      setLinkError("");
+      setAlert(null);
       const telegramProvider = config.social?.providers?.find(
         (p) => (p.id || "").toLowerCase() === "telegram" && p.enabled
       );
@@ -9974,7 +9964,7 @@ function useLinkTelegram() {
       setProviderType(null);
     } catch (e) {
       console.error("[ManageWallet] Failed to link Telegram:", e);
-      setLinkError(e?.message || "Failed to link Telegram");
+      setAlert({ title: "Error", message: e?.message || "Failed to link Telegram" });
       setProviderType(null);
     } finally {
       setLinkIsLoading(false);
@@ -9982,7 +9972,12 @@ function useLinkTelegram() {
   }, [config.social?.providers, callbacks]);
   const [telegramLinkStarted, setTelegramLinkStarted] = (0, import_react36.useState)(false);
   (0, import_react36.useEffect)(() => {
-    console.log("[useLinkTelegram] Effect triggered:", { providerType, linkIsLoading, telegramLinkStarted, isWalletLinking });
+    console.log("[useLinkTelegram] Effect triggered:", {
+      providerType,
+      linkIsLoading,
+      telegramLinkStarted,
+      isWalletLinking
+    });
     if (isWalletLinking) {
       console.log("[useLinkTelegram] Skipping - wallet linking in progress");
       return;
@@ -10001,7 +9996,7 @@ function useLinkTelegram() {
 }
 
 // src/internal/components/ManageWalletMenu/ProviderCard.tsx
-var import_lucide_react32 = require("lucide-react");
+var import_lucide_react31 = require("lucide-react");
 init_types();
 var import_jsx_runtime49 = require("react/jsx-runtime");
 function ProviderCard(props) {
@@ -10030,7 +10025,7 @@ function ProviderCard(props) {
       )
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime49.jsxs)("div", { className: "w-fit flex items-center gap-[var(--l-pass-gap)] flex-none", children: [
-      props.verified ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react32.CheckCircle, { className: `w-4 h-4 text-[var(--l-pass-bg-success)]` }) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react32.Clock, { className: "w-4 h-4 text-[var(--l-pass-bg-warning)]" }),
+      props.verified ? /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react31.CheckCircle, { className: `w-4 h-4 text-[var(--l-pass-bg-success)]` }) : /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react31.Clock, { className: "w-4 h-4 text-[var(--l-pass-bg-warning)]" }),
       allowUnlink && /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(
         Button,
         {
@@ -10042,7 +10037,7 @@ function ProviderCard(props) {
             setConfirmUnlink({ provider: props.provider, providerName: info.name, externalId: props.externalId });
             setPage("unlink-provider" /* UNLINK_PROVIDER */);
           },
-          children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react32.Trash2, { className: "w-4 h-4 text-[var(--l-pass-bg-error)]" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime49.jsx)(import_lucide_react31.Trash2, { className: "w-4 h-4 text-[var(--l-pass-bg-error)]" })
         }
       )
     ] })
@@ -10083,22 +10078,18 @@ function ManageWalletMenu() {
     config: { current: config }
   } = useLumiaPassportConfig();
   const setPage = useLayoutDataStore((st) => st.setPage);
+  const isWalletLinking = useLayoutDataStore((st) => st.isWalletLinking);
+  const setIsWalletLinking = useLayoutDataStore((st) => st.setIsWalletLinking);
   const maxScrollHeight = useLayoutStore((st) => st.maxScrollHeight);
   const {
+    alert: alert2,
     providerType,
-    isWalletLinking,
-    linkError,
-    verificationError,
-    emailCodeSentError,
+    setAlert,
     setProviderType,
     setEmail,
     setEmailStep,
-    setEmailCodeSentError,
     setEmailCodeExpiresIn,
-    setEmailCode,
-    setLinkError,
-    setVerificationError,
-    setIsWalletLinking
+    setEmailCode
   } = useManageWalletStore();
   const configuredProviders = getConfiguredProviders(config);
   const { data: providers = [], isLoading: isProvidersLoading, error: providersError } = useProvidersList();
@@ -10124,17 +10115,16 @@ function ManageWalletMenu() {
               disabled: isWalletLinking,
               onClick: () => {
                 if (isWalletLinking) return;
+                setAlert(null);
                 switch (provider) {
                   case "email":
                     setEmail("");
                     setEmailCode("");
-                    setEmailCodeSentError("");
                     setEmailCodeExpiresIn(0);
                     setEmailStep("input");
                     setProviderType(provider);
                     break;
                   case "twitter":
-                    console.log("[ManageWallet] Twitter button clicked!");
                     setProviderType("twitter");
                     break;
                   case "wallet":
@@ -10162,7 +10152,7 @@ function ManageWalletMenu() {
   useLinkSocial();
   const showCurrentProviders = !isProvidersLoading && !providersError && (providerType !== "email" && providerType !== "passkey" || providerType === null);
   const showExtraProvidersUi = !isProvidersLoading && !providersError && (providerType === "email" || providerType === "passkey");
-  const combinedError = emailCodeSentError || linkError || verificationError || null;
+  const combinedAlertMessage = alert2?.message || providersError?.message || null;
   return /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(
     "div",
     {
@@ -10180,33 +10170,34 @@ function ManageWalletMenu() {
               size: "icon",
               title: "Back",
               onClick: () => {
+                setAlert(null);
                 if (providerType === "email") {
                   setEmail("");
                   setEmailCode("");
                   setEmailStep("input");
-                  setEmailCodeSentError("");
                   setEmailCodeExpiresIn(0);
-                  setVerificationError("");
                 }
-                setLinkError("");
                 if (!providerType) setPage("settings" /* SETTINGS */);
                 setProviderType(null);
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react33.ArrowLeft, { className: "h-4 w-4" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react32.ArrowLeft, { className: "h-4 w-4" })
             }
           ),
           /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "text-xl font-semibold", children: "Profiles" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: [
-          providersError && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Highlight, { type: "error", className: "flex items-start gap-[var(--l-pass-gap)] break-words whitespace-pre-wrap", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react33.AlertTriangle, { className: "w-4 h-4 shrink-0" }),
-            /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { className: "block", children: providersError.message })
-          ] }),
-          isProvidersLoading && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex items-center justify-center p-4 text-[var(--l-pass-fg-muted)]", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react33.Loader, { className: "w-5 h-5 animate-spin" }) }),
-          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(EmailNotConnectedWarning, {}),
-          showCurrentProviders && renderProviders.map((node) => node),
-          showExtraProvidersUi && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(AddProvider, {}),
-          combinedError && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(Highlight, { type: "error", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("span", { children: combinedError }) })
+        isProvidersLoading && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("div", { className: "flex items-center justify-center p-4 text-[var(--l-pass-fg-muted)]", children: /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react32.Loader, { className: "w-5 h-5 animate-spin" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(EmailNotConnectedWarning, {}),
+        showCurrentProviders && renderProviders.map((node) => node),
+        showExtraProvidersUi && /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(AddProvider, {}),
+        combinedAlertMessage && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(Highlight, { type: "error", className: "flex gap-[var(--l-pass-gap)]", children: [
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsx)(import_lucide_react32.AlertTriangle, { className: "w-4 h-4 shrink-0" }),
+          /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)("span", { className: "break-words whitespace-pre-wrap", children: [
+            alert2?.title && /* @__PURE__ */ (0, import_jsx_runtime50.jsxs)(import_jsx_runtime50.Fragment, { children: [
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("strong", { children: alert2.title }),
+              /* @__PURE__ */ (0, import_jsx_runtime50.jsx)("br", {})
+            ] }),
+            combinedAlertMessage
+          ] })
         ] })
       ]
     }
@@ -10215,7 +10206,7 @@ function ManageWalletMenu() {
 
 // src/internal/components/ManageWalletMenu/UnlinkProviderMenu.tsx
 var import_react_query26 = require("@tanstack/react-query");
-var import_lucide_react34 = require("lucide-react");
+var import_lucide_react33 = require("lucide-react");
 var import_react38 = require("react");
 init_auth();
 var import_jsx_runtime51 = require("react/jsx-runtime");
@@ -10224,7 +10215,7 @@ function UnlinkProviderMenu() {
   const address = useLumiaPassportSession((st) => st.address);
   const { callbacks } = useLumiaPassportConfig();
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const { confirmUnlink, setConfirmUnlink, setLinkError } = useManageWalletStore();
+  const { confirmUnlink, setConfirmUnlink, setAlert } = useManageWalletStore();
   const [confirmInput, setConfirmInput] = (0, import_react38.useState)("");
   const { mutate: handleUnlinkProvider, isPending: isProviderUnlinking } = (0, import_react_query26.useMutation)({
     mutationFn: async () => {
@@ -10246,7 +10237,7 @@ function UnlinkProviderMenu() {
       }
     },
     onError: (error) => {
-      setLinkError(error?.message || "Failed to unlink provider");
+      setAlert({ title: "Error", message: error?.message || "Failed to unlink provider" });
       setPage("manage-wallet" /* MANAGE_WALLET */);
     }
   });
@@ -10258,7 +10249,7 @@ function UnlinkProviderMenu() {
       /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(
         Input,
         {
-          Icon: import_lucide_react34.Key,
+          Icon: import_lucide_react33.Key,
           value: confirmInput,
           onChange: (e) => setConfirmInput(e.target.value),
           placeholder: "Enter provider ID"
@@ -10289,7 +10280,7 @@ function UnlinkProviderMenu() {
           disabled: !!isProviderUnlinking || !confirmUnlink || confirmInput !== confirmUnlink.externalId,
           className: "w-full flex-1",
           children: [
-            isProviderUnlinking && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_lucide_react34.Loader, { className: "animate-spin h-4 w-4" }),
+            isProviderUnlinking && /* @__PURE__ */ (0, import_jsx_runtime51.jsx)(import_lucide_react33.Loader, { className: "animate-spin h-4 w-4" }),
             isProviderUnlinking ? "Removing\u2026" : "Remove"
           ]
         }
@@ -10300,7 +10291,7 @@ function UnlinkProviderMenu() {
 
 // src/internal/components/PortfolioMenu/PortfolioMenu.tsx
 var import_react_query28 = require("@tanstack/react-query");
-var import_lucide_react36 = require("lucide-react");
+var import_lucide_react35 = require("lucide-react");
 var import_react40 = require("react");
 
 // src/modules/assets.ts
@@ -10466,7 +10457,7 @@ function useTokenBalance(tokenAddress, userAddress) {
 
 // src/internal/components/PortfolioMenu/PortfolioItem.tsx
 var import_react_query27 = require("@tanstack/react-query");
-var import_lucide_react35 = require("lucide-react");
+var import_lucide_react34 = require("lucide-react");
 init_base();
 var import_jsx_runtime52 = require("react/jsx-runtime");
 var price16 = Intl.NumberFormat("en-US", { minimumFractionDigits: 16, maximumFractionDigits: 16 });
@@ -10538,7 +10529,7 @@ function PortfolioItem(props) {
               /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { children: formatValue(Number(renderBalance)) }),
               /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { children: " " + asset.symbol })
             ] }),
-            isRateLoading && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react35.Loader, { className: "h-4 w-4 animate-spin" }),
+            isRateLoading && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)(import_lucide_react34.Loader, { className: "h-4 w-4 animate-spin" }),
             !isRateLoading && !isProjectAsset && !!assetRate?.price && /* @__PURE__ */ (0, import_jsx_runtime52.jsx)("span", { children: (Number(asset.formattedBalance) * Number(assetRate.price)).toLocaleString("en-US", {
               minimumFractionDigits: 2,
               maximumFractionDigits: 2,
@@ -10577,7 +10568,7 @@ function PortfolioMenu() {
       className: "list-scrollbar-y w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "flex items-center gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react36.ArrowLeft, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react35.ArrowLeft, { className: "h-4 w-4" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-xl font-semibold", children: "Your Assets" }),
           /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(
             Button,
@@ -10587,17 +10578,17 @@ function PortfolioMenu() {
               size: "icon",
               onClick: refreshAllAssetsBalances,
               disabled: isLoading,
-              children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react36.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react36.RefreshCw, { className: "h-4 w-4" })
+              children: isLoading ? /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react35.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react35.RefreshCw, { className: "h-4 w-4" })
             }
           )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: [
           isLoading && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "w-full flex items-center justify-center gap-[var(--l-pass-gap)] p-[var(--l-pass-pd)]", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react36.Loader, { className: "h-5 w-5 animate-spin" }),
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react35.Loader, { className: "h-5 w-5 animate-spin" }),
             /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("span", { className: "text-[var(--l-pass-muted)]", children: "Loading assets..." })
           ] }),
           !isLoading && assets.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "w-full flex flex-col items-center justify-center py-8 text-[var(--l-pass-muted)]", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react36.Gem, { className: "w-12 h-12 mb-2" }),
+            /* @__PURE__ */ (0, import_jsx_runtime53.jsx)(import_lucide_react35.Gem, { className: "w-12 h-12 mb-2" }),
             /* @__PURE__ */ (0, import_jsx_runtime53.jsx)("p", { children: "No assets found" })
           ] }),
           !isLoading && assets.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime53.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)] py-[var(--l-pass-pd)]", children: [
@@ -10619,7 +10610,7 @@ function PortfolioMenu() {
 
 // src/internal/components/SecurityMenu/SecurityMenu.tsx
 var import_react_query29 = require("@tanstack/react-query");
-var import_lucide_react37 = require("lucide-react");
+var import_lucide_react36 = require("lucide-react");
 var import_react41 = require("react");
 init_auth();
 init_keyshare();
@@ -10699,7 +10690,7 @@ function SecurityMenu() {
       className: "list-scrollbar-y w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.ArrowLeft, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.ArrowLeft, { className: "h-4 w-4" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-xl font-semibold", children: "Security" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center justify-between gap-[var(--l-pass-gap)]", children: [
@@ -10712,14 +10703,14 @@ function SecurityMenu() {
               title: "Refresh",
               disabled: isRecoveryRefreshing,
               onClick: () => qc.invalidateQueries({ queryKey: [KEYSHARE_RECOVERY_STATS_QUERY, userId] }),
-              children: isRecoveryRefreshing ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.RefreshCw, { className: "h-4 w-4" })
+              children: isRecoveryRefreshing ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.RefreshCw, { className: "h-4 w-4" })
             }
           )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "grid grid-cols-3 gap-[var(--l-pass-gap)]", children: [
           /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "space-y-2 text-center", children: [
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center justify-center gap-[var(--l-pass-gap)]", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Cloud, { className: "h-4 w-4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Cloud, { className: "h-4 w-4" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-xs font-medium", children: "Server" })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
@@ -10730,7 +10721,7 @@ function SecurityMenu() {
                   serverHasKeyshare ? "bg-[var(--l-pass-bg-success)]" : "bg-[var(--l-pass-bg-warning)]"
                 ),
                 children: [
-                  serverHasKeyshare ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.AlertTriangle, { className: "h-4 w-4" }),
+                  serverHasKeyshare ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.AlertTriangle, { className: "h-4 w-4" }),
                   serverHasKeyshare ? "Ready" : "Missing"
                 ]
               }
@@ -10738,7 +10729,7 @@ function SecurityMenu() {
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "space-y-2 text-center", children: [
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center justify-center gap-[var(--l-pass-gap)]", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Laptop, { className: "h-4 w-4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Laptop, { className: "h-4 w-4" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-xs font-medium", children: "Local" })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
@@ -10749,7 +10740,7 @@ function SecurityMenu() {
                   localInfo?.hasKeyshare ? "bg-[var(--l-pass-bg-success)]" : "bg-[var(--l-pass-bg-warning)]"
                 ),
                 children: [
-                  localInfo?.hasKeyshare ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.AlertTriangle, { className: "h-4 w-4" }),
+                  localInfo?.hasKeyshare ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.AlertTriangle, { className: "h-4 w-4" }),
                   localInfo?.hasKeyshare ? "Ready" : "Missing"
                 ]
               }
@@ -10757,7 +10748,7 @@ function SecurityMenu() {
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "space-y-2 text-center", children: [
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center justify-center gap-[var(--l-pass-gap)]", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Shield, { className: "h-4 w-4" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Shield, { className: "h-4 w-4" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsx)("span", { className: "text-xs font-medium", children: "Vault" })
             ] }),
             /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)(
@@ -10768,7 +10759,7 @@ function SecurityMenu() {
                   hasServerBackup ? "bg-[var(--l-pass-bg-success)]" : "bg-[var(--l-pass-bg-warning)]"
                 ),
                 children: [
-                  hasServerBackup ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.AlertTriangle, { className: "h-4 w-4" }),
+                  hasServerBackup ? /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.CheckCircle2, { className: "h-4 w-4" }) : /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.AlertTriangle, { className: "h-4 w-4" }),
                   hasServerBackup ? "Ready" : "None"
                 ]
               }
@@ -10793,28 +10784,28 @@ function SecurityMenu() {
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "space-y-0.5 text-[10px] leading-tight text-[var(--l-pass-fg-muted)]", children: [
             backup.server.enabled && backup.server.lastBackup && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Server, { className: "h-2.5 w-2.5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Server, { className: "h-2.5 w-2.5" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
                 "Server: ",
                 new Date(backup.server.lastBackup).toLocaleString()
               ] })
             ] }),
             !backup.server.lastBackup && recoveryCreatedAt && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Server, { className: "h-2.5 w-2.5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Server, { className: "h-2.5 w-2.5" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
                 "Server: ",
                 new Date(recoveryCreatedAt).toLocaleString()
               ] })
             ] }),
             backup.cloud.enabled && backup.cloud.lastBackup && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Cloud, { className: "h-2.5 w-2.5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Cloud, { className: "h-2.5 w-2.5" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
                 "Cloud: ",
                 new Date(backup.cloud.lastBackup).toLocaleString()
               ] })
             ] }),
             backup.local.enabled && backup.local.lastBackup && /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("div", { className: "flex items-center gap-1", children: [
-              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.HardDrive, { className: "h-2.5 w-2.5" }),
+              /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.HardDrive, { className: "h-2.5 w-2.5" }),
               /* @__PURE__ */ (0, import_jsx_runtime54.jsxs)("span", { children: [
                 "Local: ",
                 new Date(backup.local.lastBackup).toLocaleString()
@@ -10875,7 +10866,7 @@ function SecurityMenu() {
                         origin: app.origin,
                         hostname: new URL(app.origin).hostname
                       }),
-                      children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react37.Trash2, { className: "h-3 w-3" })
+                      children: /* @__PURE__ */ (0, import_jsx_runtime54.jsx)(import_lucide_react36.Trash2, { className: "h-3 w-3" })
                     }
                   )
                 ]
@@ -10903,7 +10894,7 @@ function SecurityMenu() {
 }
 
 // src/internal/components/SendRecieveMenu/SendLumiaMenu.tsx
-var import_lucide_react38 = require("lucide-react");
+var import_lucide_react37 = require("lucide-react");
 var import_react43 = require("react");
 var import_viem6 = require("viem");
 var import_wagmi3 = require("wagmi");
@@ -11049,7 +11040,7 @@ function SendLumiaMenu() {
   };
   return /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
     /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-[var(--l-pass-gap)]", children: [
-      txStep === "input" && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react38.ArrowLeft, { className: "h-4 w-4" }) }),
+      txStep === "input" && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react37.ArrowLeft, { className: "h-4 w-4" }) }),
       /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "text-xl font-semibold", children: "Send LUMIA" })
     ] }),
     txStep === "input" && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
@@ -11058,7 +11049,7 @@ function SendLumiaMenu() {
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(
           Input,
           {
-            Icon: import_lucide_react38.Wallet,
+            Icon: import_lucide_react37.Wallet,
             type: "text",
             value: recipient,
             onChange: (e) => setRecipient(e.target.value),
@@ -11101,7 +11092,7 @@ function SendLumiaMenu() {
         ] })
       ] }),
       (validationError || error) && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex items-center gap-2 p-3 bg-[var(--l-pass-bg-error)] text-[var(--l-pass-error)] rounded-[var(--l-pass-el-bdrs)]", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react38.AlertCircle, { className: "h-4 w-4" }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react37.AlertCircle, { className: "h-4 w-4" }),
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "text-sm", children: validationError || error })
       ] }),
       /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button, { onClick: handleSend, disabled: isLoading, className: "w-full", size: "large", children: "Continue" })
@@ -11130,13 +11121,13 @@ function SendLumiaMenu() {
       /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "flex gap-2", children: [
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(Button, { onClick: () => setTxStep("input"), variant: "outline", className: "flex-1", size: "large", children: "Back" }),
         /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(Button, { onClick: handleConfirm, disabled: isLoading, className: "flex-1", size: "large", children: [
-          isLoading && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react38.Loader, { className: "h-4 w-4 animate-spin" }),
+          isLoading && /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react37.Loader, { className: "h-4 w-4 animate-spin" }),
           "Confirm"
         ] })
       ] })
     ] }),
     txStep === "pending" && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "py-8 text-center space-y-4", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react38.Loader, { className: "h-5 w-5 animate-spin mx-auto" }),
+      /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react37.Loader, { className: "h-5 w-5 animate-spin mx-auto" }),
       /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { children: [
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "block font-medium", children: "Transaction Pending" }),
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("span", { className: "block text-sm mt-1", children: "Please wait while we process your transaction" })
@@ -11144,7 +11135,7 @@ function SendLumiaMenu() {
     ] }),
     txStep === "success" && userOpHash && /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)(import_jsx_runtime55.Fragment, { children: [
       /* @__PURE__ */ (0, import_jsx_runtime55.jsxs)("div", { className: "text-center py-4", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react38.CheckCircle2, { className: "h-12 w-12 text-[var(--l-pass-success)] mx-auto mb-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime55.jsx)(import_lucide_react37.CheckCircle2, { className: "h-12 w-12 text-[var(--l-pass-success)] mx-auto mb-3" }),
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "font-medium", children: "Transaction Sent!" }),
         /* @__PURE__ */ (0, import_jsx_runtime55.jsx)("p", { className: "text-sm mt-1", children: "Your transaction is being processed" })
       ] }),
@@ -11154,7 +11145,7 @@ function SendLumiaMenu() {
 }
 
 // src/internal/components/SendRecieveMenu/ReceiveLumiaMenu.tsx
-var import_lucide_react39 = require("lucide-react");
+var import_lucide_react38 = require("lucide-react");
 var import_qrcode = __toESM(require("qrcode"), 1);
 var import_react44 = require("react");
 init_clients();
@@ -11200,21 +11191,21 @@ function ReceiveLumiaMenu() {
       className: "list-scrollbar-y w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)("div", { className: "w-full flex items-center gap-[var(--l-pass-gap)]", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react39.ArrowLeft, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react38.ArrowLeft, { className: "h-4 w-4" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "text-xl font-semibold", children: "Receive LUMIA" })
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Highlight, { className: "text-center", type: "warning", children: [
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("strong", { className: "block w-full", children: `Network: ${lumiaBeam.name}` }),
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "block w-full", children: "Ensure sender is on the same network" })
         ] }),
-        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex items-center justify-center p-[var(--l-pass-pd)]", style: { minHeight: "216px" }, children: qrCodeUrl ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("img", { src: qrCodeUrl, alt: "Wallet QR Code", className: "w-48 h-48" }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react39.Loader, { className: "w-5 h-5 animate-spin text-[var(--l-pass-fg-muted)]" }) }),
+        /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("div", { className: "flex items-center justify-center p-[var(--l-pass-pd)]", style: { minHeight: "216px" }, children: qrCodeUrl ? /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("img", { src: qrCodeUrl, alt: "Wallet QR Code", className: "w-48 h-48" }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react38.Loader, { className: "w-5 h-5 animate-spin text-[var(--l-pass-fg-muted)]" }) }),
         /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(Highlight, { type: "info", children: [
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "block w-full text-center font-mono text-[10px] break-all mb-2", children: address }),
           /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(Button, { onClick: handleCopy, className: "w-full", size: "medium", children: copied ? /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react39.CheckCircle2, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react38.CheckCircle2, { className: "h-4 w-4" }),
             /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: "Copied!" })
           ] }) : /* @__PURE__ */ (0, import_jsx_runtime56.jsxs)(import_jsx_runtime56.Fragment, { children: [
-            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react39.Copy, { className: "h-4 w-4" }),
+            /* @__PURE__ */ (0, import_jsx_runtime56.jsx)(import_lucide_react38.Copy, { className: "h-4 w-4" }),
             /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { children: "Copy Address" })
           ] }) })
         ] }),
@@ -11225,11 +11216,11 @@ function ReceiveLumiaMenu() {
 }
 
 // src/internal/components/SettingsMenu/SettingsMenu.tsx
-var import_lucide_react41 = require("lucide-react");
+var import_lucide_react40 = require("lucide-react");
 var import_react45 = require("react");
 
 // src/internal/components/SettingsMenu/constants.ts
-var import_lucide_react40 = require("lucide-react");
+var import_lucide_react39 = require("lucide-react");
 
 // src/internal/assets/KycIcon.tsx
 var import_jsx_runtime57 = require("react/jsx-runtime");
@@ -11246,11 +11237,11 @@ function KycIcon(props) {
 
 // src/internal/components/SettingsMenu/constants.ts
 var NAV_BUTTONS = [
-  { id: "transactions" /* TRANSACTIONS */, name: "Transactions", Icon: import_lucide_react40.ArrowLeftRight },
+  { id: "transactions" /* TRANSACTIONS */, name: "Transactions", Icon: import_lucide_react39.ArrowLeftRight },
   { id: "kyc" /* KYC */, name: "KYC", Icon: KycIcon },
-  { id: "manage-wallet" /* MANAGE_WALLET */, name: "Profiles", Icon: import_lucide_react40.UsersRound },
-  { id: "security" /* SECURITY */, name: "Security", Icon: import_lucide_react40.LockKeyhole },
-  { id: "keysare-backup" /* KEYSARE_BACKUP */, name: "Backup", Icon: import_lucide_react40.DatabaseBackup }
+  { id: "manage-wallet" /* MANAGE_WALLET */, name: "Profiles", Icon: import_lucide_react39.UsersRound },
+  { id: "security" /* SECURITY */, name: "Security", Icon: import_lucide_react39.LockKeyhole },
+  { id: "keysare-backup" /* KEYSARE_BACKUP */, name: "Backup", Icon: import_lucide_react39.DatabaseBackup }
 ];
 
 // src/internal/components/SettingsMenu/SettingsMenu.tsx
@@ -11266,7 +11257,7 @@ function SettingsMenu() {
   const highlightedKeys = settingsNotifications.map((n) => n.target);
   return /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]", children: [
     /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)("div", { className: "flex items-center gap-[var(--l-pass-gap)]", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_lucide_react41.ArrowLeft, { className: "h-4 w-4" }) }),
+      /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("main-menu" /* MAIN_MENU */), children: /* @__PURE__ */ (0, import_jsx_runtime58.jsx)(import_lucide_react40.ArrowLeft, { className: "h-4 w-4" }) }),
       /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("span", { className: "text-xl font-semibold", children: "Settings" })
     ] }),
     /* @__PURE__ */ (0, import_jsx_runtime58.jsx)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: navItems.map(({ id, name, Icon, onClick }) => /* @__PURE__ */ (0, import_jsx_runtime58.jsxs)(
@@ -11292,7 +11283,7 @@ function SettingsMenu() {
 }
 
 // src/internal/components/TermsOfService.tsx
-var import_lucide_react42 = require("lucide-react");
+var import_lucide_react41 = require("lucide-react");
 var import_jsx_runtime59 = require("react/jsx-runtime");
 function TermsOfService() {
   const address = useLumiaPassportSession((st) => st.address);
@@ -11306,7 +11297,7 @@ function TermsOfService() {
           size: "icon",
           title: "Back",
           onClick: () => setPage(!!address ? "settings" /* SETTINGS */ : "auth" /* AUTH */),
-          children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_lucide_react42.ArrowLeft, { className: "h-4 w-4" })
+          children: /* @__PURE__ */ (0, import_jsx_runtime59.jsx)(import_lucide_react41.ArrowLeft, { className: "h-4 w-4" })
         }
       ),
       /* @__PURE__ */ (0, import_jsx_runtime59.jsx)("span", { className: "text-xl font-semibold", children: "Terms of Service" })
@@ -11320,7 +11311,7 @@ function TermsOfService() {
 
 // src/internal/components/TransactionsMenu/TransactionsMenu.tsx
 var import_react_query30 = require("@tanstack/react-query");
-var import_lucide_react44 = require("lucide-react");
+var import_lucide_react43 = require("lucide-react");
 var import_react46 = require("react");
 
 // src/internal/components/TransactionsMenu/api.ts
@@ -11612,7 +11603,7 @@ async function getTransactionsListQuery(address) {
 }
 
 // src/internal/components/TransactionsMenu/TransactionsGroup.tsx
-var import_lucide_react43 = require("lucide-react");
+var import_lucide_react42 = require("lucide-react");
 
 // src/internal/assets/NegativeIcon.tsx
 var import_jsx_runtime60 = require("react/jsx-runtime");
@@ -11708,7 +11699,7 @@ function TransactionsGroup(props) {
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex items-center justify-between gap-[var(--l-pass-gap)]", children: [
           /* @__PURE__ */ (0, import_jsx_runtime61.jsxs)("div", { className: "flex items-center gap-1 flex-0 w-fit", children: [
-            parent.direction === "in" ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react43.ChevronLeft, { className: "w-4 h-4" }) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react43.ChevronRight, { className: "w-4 h-4" }),
+            parent.direction === "in" ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react42.ChevronLeft, { className: "w-4 h-4" }) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react42.ChevronRight, { className: "w-4 h-4" }),
             /* @__PURE__ */ (0, import_jsx_runtime61.jsx)("span", { className: "text-[10px]", children: isIncoming ? "RECEIVED" : "SENT" }),
             parent.status === "ok" ? /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(PositiveIcon, {}) : /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(NegativeIcon, {})
           ] }),
@@ -11730,7 +11721,7 @@ function TransactionsGroup(props) {
                 onClick: (e) => {
                   e.stopPropagation();
                 },
-                children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react43.Copy, { className: "w-4 h-4" })
+                children: /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(import_lucide_react42.Copy, { className: "w-4 h-4" })
               }
             ),
             /* @__PURE__ */ (0, import_jsx_runtime61.jsx)(
@@ -11829,7 +11820,7 @@ function TransactionsMenu() {
       className: "list-scrollbar-y w-full p-[var(--l-pass-pd)] flex flex-col gap-[var(--l-pass-gap)]",
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "flex items-center gap-2", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react44.ArrowLeft, { className: "h-4 w-4" }) }),
+          /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Button, { variant: "ghost", size: "icon", title: "Back", onClick: () => setPage("settings" /* SETTINGS */), children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react43.ArrowLeft, { className: "h-4 w-4" }) }),
           /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "text-xl font-semibold", children: "Transaction History" }),
           /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
             Button,
@@ -11839,14 +11830,14 @@ function TransactionsMenu() {
               onClick: refreshTxHistory,
               disabled: isTxHistoryFetching,
               title: "Refresh transactions",
-              children: isTxHistoryFetching ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react44.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react44.RefreshCw, { className: "h-4 w-4" })
+              children: isTxHistoryFetching ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react43.Loader, { className: "h-4 w-4 animate-spin" }) : /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react43.RefreshCw, { className: "h-4 w-4" })
             }
           )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "w-full flex flex-col gap-[var(--l-pass-gap)]", children: [
-          isTxHistoryLoading && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react44.Loader, { className: "h-5 w-5 animate-spin" }) }),
+          isTxHistoryLoading && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "flex items-center justify-center p-8", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react43.Loader, { className: "h-5 w-5 animate-spin" }) }),
           !isTxHistoryLoading && txHistoryResolvedError && /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)(Highlight, { type: "error", className: "flex gap-[var(--l-pass-gap)]", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react44.XCircle, { className: "w-4 h-4 flex-none" }),
+            /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(import_lucide_react43.XCircle, { className: "w-4 h-4 flex-none" }),
             /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { className: "block w-full flex-1 text-center text-xs", children: txHistoryResolvedError })
           ] }),
           !isTxHistoryLoading && !txHistoryResolvedError && txHistoryGroups.length === 0 && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(Highlight, { type: "warning", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("span", { children: "No transactions found. Smart account transactions will appear here" }) }),
@@ -12086,6 +12077,7 @@ function LumiaPassportDialog() {
   useBackupStatusChanges();
   useDetectMaxScrollHeight();
   useSettingsNotifications();
+  useListenIframeAuthEvents();
   useBackupWarning();
   useWalletStatus();
   return /* @__PURE__ */ (0, import_jsx_runtime64.jsx)(
@@ -12168,43 +12160,47 @@ var import_wagmi4 = require("wagmi");
 init_wallet();
 function WalletConnectHandler() {
   const qc = (0, import_react_query31.useQueryClient)();
-  const { callbacks } = useLumiaPassportConfig();
-  const userAddress = useLumiaPassportSession((st) => st.address);
+  const callbacks = useLumiaPassportConfig().callbacks;
+  const passportWalletAddress = useLumiaPassportSession((st) => st.address);
   const { address: walletAddress, isConnected, chain, connector } = (0, import_wagmi4.useAccount)();
+  const { openConnectModal, connectModalOpen } = (0, import_rainbowkit.useConnectModal)();
   const { disconnect } = (0, import_wagmi4.useDisconnect)();
   const { signMessageAsync } = (0, import_wagmi4.useSignMessage)();
+  const isWalletLinking = useLayoutDataStore((st) => st.isWalletLinking);
   const setPage = useLayoutDataStore((st) => st.setPage);
-  const { isWalletLinking, setLinkError, setIsWalletLinking, setLinkIsLoading, setProviderType } = useManageWalletStore();
-  const onError = (0, import_react52.useCallback)((error) => {
-    setLinkError(error);
-    setIsWalletLinking(false);
-    setPage("manage-wallet" /* MANAGE_WALLET */);
-  }, []);
+  const setIsWalletLinking = useLayoutDataStore((st) => st.setIsWalletLinking);
+  const setAuthError = useAuthStore((st) => st.setAlert);
+  const setManageWalletLinkError = useManageWalletStore((st) => st.setLinkError);
+  const setLinkIsLoading = useManageWalletStore((st) => st.setLinkIsLoading);
+  const setProviderType = useManageWalletStore((st) => st.setProviderType);
   const onLinkingComplete = (0, import_react52.useCallback)(
     async (success) => {
-      console.log("[WalletConnectHandler] onLinkingComplete called:", { success, userAddress });
       setIsWalletLinking(false);
+      if (!success && !passportWalletAddress) {
+        setProviderType(null);
+        setPage("auth" /* AUTH */);
+        return;
+      }
+      if (!success && passportWalletAddress) {
+        setProviderType(null);
+        setPage("manage-wallet" /* MANAGE_WALLET */);
+        return;
+      }
       setProviderType(null);
       setPage("manage-wallet" /* MANAGE_WALLET */);
-      if (success) {
-        console.log("[WalletConnectHandler] Invalidating and refetching queries with key:", [
-          PROVIDERS_QUERY_KEY,
-          userAddress
-        ]);
-        await qc.invalidateQueries({ queryKey: [PROVIDERS_QUERY_KEY, userAddress], refetchType: "active" });
-        await qc.invalidateQueries({ queryKey: [LINKED_PROFILES_QUERY_KEY, userAddress], refetchType: "active" });
-        await qc.refetchQueries({ queryKey: [PROVIDERS_QUERY_KEY, userAddress] });
-        try {
-          callbacks?.onLumiaPassportUpdate?.({ providers: qc.getQueryData([PROVIDERS_QUERY_KEY, userAddress]) });
-        } catch {
-        }
+      await qc.invalidateQueries({ queryKey: [PROVIDERS_QUERY_KEY, passportWalletAddress], refetchType: "active" });
+      await qc.invalidateQueries({
+        queryKey: [LINKED_PROFILES_QUERY_KEY, passportWalletAddress],
+        refetchType: "active"
+      });
+      try {
+        callbacks?.onLumiaPassportUpdate?.({ providers: qc.getQueryData([PROVIDERS_QUERY_KEY, passportWalletAddress]) });
+      } catch {
       }
     },
-    [qc, userAddress, callbacks, setProviderType, setPage, setIsWalletLinking]
+    [qc, passportWalletAddress, callbacks, setProviderType, setPage, setIsWalletLinking]
   );
-  const { openConnectModal, connectModalOpen } = (0, import_rainbowkit.useConnectModal)();
   const [hasStartedLinking, setHasStartedLinking] = import_react52.default.useState(false);
-  const timeoutRef = import_react52.default.useRef();
   (0, import_react52.useEffect)(() => {
     if (isWalletLinking && !hasStartedLinking) {
       setHasStartedLinking(true);
@@ -12212,94 +12208,101 @@ function WalletConnectHandler() {
       if (isConnected) {
         disconnect();
         setTimeout(() => {
-          if (openConnectModal) {
-            setPage(null);
-            openConnectModal();
-          }
-        }, 500);
-      } else {
-        if (openConnectModal) {
           setPage(null);
           openConnectModal();
-        }
+        }, 500);
+      } else {
+        setPage(null);
+        openConnectModal();
       }
     }
     if (!isWalletLinking && hasStartedLinking) {
       setHasStartedLinking(false);
-      if (timeoutRef.current) clearTimeout(timeoutRef.current);
       if (isConnected) disconnect();
     }
   }, [isWalletLinking, hasStartedLinking, isConnected, openConnectModal, disconnect, setPage, setProviderType]);
   (0, import_react52.useEffect)(() => {
-    console.log("[WalletConnectHandler] Modal state check:", {
-      hasStartedLinking,
-      connectModalOpen,
-      isConnected,
-      isWalletLinking
-    });
     if (hasStartedLinking && !connectModalOpen && !isConnected && isWalletLinking) {
-      console.log("[WalletConnectHandler] Modal closed without connecting, resetting state");
+      console.log("[WalletConnectHandler] Modal closed without connecting");
       onLinkingComplete(false);
       setHasStartedLinking(false);
     }
   }, [connectModalOpen, hasStartedLinking, isConnected, isWalletLinking]);
-  (0, import_react52.useEffect)(() => {
-    if (isConnected && walletAddress && isWalletLinking && hasStartedLinking) {
-      handleWalletSign();
-    }
-  }, [isConnected, walletAddress, isWalletLinking, hasStartedLinking]);
-  const handleWalletSign = async () => {
-    if (timeoutRef.current) {
-      clearTimeout(timeoutRef.current);
-    }
-    if (!walletAddress || !chain) {
-      onError("No wallet connected");
-      disconnect();
-      onLinkingComplete(false);
-      setHasStartedLinking(false);
-      return;
-    }
-    try {
+  const { mutate: handleWalletSign, isPending: isWalletSigning } = (0, import_react_query31.useMutation)({
+    mutationFn: async (payload) => {
+      const { chainId, signingWalletAddress } = payload;
+      if (!signingWalletAddress || !chainId) {
+        disconnect();
+        if (passportWalletAddress) {
+          setManageWalletLinkError("Wallet error! No wallet available");
+        } else {
+          setAuthError({ title: "Wallet error", message: "No wallet available" });
+        }
+        setIsWalletLinking(false);
+        setHasStartedLinking(false);
+        onLinkingComplete(false);
+        setPage(passportWalletAddress ? "manage-wallet" /* MANAGE_WALLET */ : "auth" /* AUTH */);
+        return;
+      }
       setLinkIsLoading(true);
-      const message = createSignatureMessage(walletAddress);
-      const signature = await signMessageAsync({ message });
+      const message = createSignatureMessage(signingWalletAddress);
+      const signature = await signMessageAsync({ message, account: signingWalletAddress });
       if (!signature) {
         throw new Error("Failed to get signature");
       }
       const walletName = connector?.name || "Unknown Wallet";
       const walletType = connector?.id || "unknown";
-      console.log("[WalletConnectHandler] Wallet metadata:", {
-        walletName,
-        walletType,
-        connectorInfo: connector
-      });
-      await linkWallet({
-        address: walletAddress,
+      return await linkWallet({
+        // chainId: chain.id,
+        chainId,
+        address: signingWalletAddress,
         signature,
         message,
-        chainId: chain.id,
         walletName,
         walletType
       });
+    },
+    onSuccess: () => {
       disconnect();
+      setHasStartedLinking(false);
       onLinkingComplete(true);
+      setLinkIsLoading(false);
+    },
+    onError: (err) => {
+      disconnect();
+      setIsWalletLinking(false);
+      onLinkingComplete(false);
       setHasStartedLinking(false);
-    } catch (err) {
+      setLinkIsLoading(false);
       const errorMsg = err?.message || "Failed to link wallet";
       if (errorMsg.includes("User rejected") || errorMsg.includes("User denied")) {
-        onError("Signature request was cancelled");
+        if (passportWalletAddress) {
+          setManageWalletLinkError("Signature request was cancelled");
+        } else {
+          setAuthError({ title: "Signature error", message: "Signature request was cancelled" });
+        }
       } else if (errorMsg.includes("already linked")) {
-        onError("This wallet is already linked to another account");
+        if (passportWalletAddress) {
+          setManageWalletLinkError("This wallet is already linked to another account");
+        } else {
+          setAuthError({ title: "Wallet error", message: "This wallet is already linked to another account" });
+        }
       } else {
-        onError(errorMsg);
+        if (passportWalletAddress) {
+          setManageWalletLinkError(errorMsg);
+        } else {
+          setAuthError({ title: "Error", message: errorMsg });
+        }
       }
-      disconnect();
-      onLinkingComplete(false);
-      setHasStartedLinking(false);
-    } finally {
-      setLinkIsLoading(false);
+      setPage(passportWalletAddress ? "manage-wallet" /* MANAGE_WALLET */ : "auth" /* AUTH */);
     }
-  };
+  });
+  (0, import_react52.useEffect)(() => {
+    if (!!chain?.id && isConnected && walletAddress && isWalletLinking && hasStartedLinking) {
+      console.log("[WalletConnectHandler] handleWalletSign triggered");
+      handleWalletSign({ chainId: chain.id, signingWalletAddress: walletAddress });
+    }
+  }, [chain, isConnected, walletAddress, isWalletLinking, hasStartedLinking]);
   return null;
 }
 
@@ -12479,7 +12482,7 @@ var useLumiaPassportConfig = () => {
 };
 
 // src/components/ConnectWalletButton.tsx
-var import_lucide_react45 = require("lucide-react");
+var import_lucide_react44 = require("lucide-react");
 var import_react55 = require("react");
 init_auth();
 var import_jsx_runtime68 = (
@@ -12522,7 +12525,7 @@ function ConnectWalletButton(props) {
       disabled: isConnecting,
       onClick: () => setPage("auth" /* AUTH */),
       children: [
-        isConnecting && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_lucide_react45.Loader, { className: "w-4 h-4 animate-spin" }),
+        isConnecting && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_lucide_react44.Loader, { className: "w-4 h-4 animate-spin" }),
         connectButtonLabel
       ]
     }
@@ -12542,7 +12545,7 @@ function ConnectWalletButton(props) {
         "disabled:hover:bg-[var(--l-pass-bg)] disabled:active:bg-[var(--l-pass-bg)]"
       ),
       children: [
-        isConnecting && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_lucide_react45.Loader, { className: "w-4 h-4 animate-spin" }),
+        isConnecting && /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(import_lucide_react44.Loader, { className: "w-4 h-4 animate-spin" }),
         connectButtonLabel.toUpperCase()
       ]
     }
@@ -12570,7 +12573,7 @@ function ConnectWalletButton(props) {
         /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "flex items-center space-x-1", children: [
           /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "group relative", children: [
             /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-              import_lucide_react45.Cloud,
+              import_lucide_react44.Cloud,
               {
                 className: `w-3 h-3 ${indicators.server ? "text-[var(--l-pass-bg-success)]" : "text-[var(--l-pass-bg-warning)]"}`
               }
@@ -12592,7 +12595,7 @@ function ConnectWalletButton(props) {
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "group relative", children: [
             /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-              import_lucide_react45.Laptop,
+              import_lucide_react44.Laptop,
               {
                 className: `w-3 h-3 ${indicators.local ? "text-[var(--l-pass-bg-success)]" : "text-[var(--l-pass-bg-warning)]"}`
               }
@@ -12614,7 +12617,7 @@ function ConnectWalletButton(props) {
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime68.jsxs)("div", { className: "group relative", children: [
             /* @__PURE__ */ (0, import_jsx_runtime68.jsx)(
-              import_lucide_react45.Shield,
+              import_lucide_react44.Shield,
               {
                 className: `w-3 h-3 ${indicators.backup ? "text-[var(--l-pass-bg-success)]" : "text-[var(--l-pass-bg-warning)]"}`
               }
@@ -12728,7 +12731,7 @@ function useLumiaPassportColorMode() {
 }
 
 // src/components/ThemeToggle.tsx
-var import_lucide_react46 = require("lucide-react");
+var import_lucide_react45 = require("lucide-react");
 var import_jsx_runtime69 = require("react/jsx-runtime");
 function ThemeToggle(props) {
   const { colorMode, setColorMode } = useLumiaPassportColorMode();
@@ -12745,7 +12748,7 @@ function ThemeToggle(props) {
           variant: "ghost",
           onClick: () => setColorMode(colorMode === "light" ? "dark" : "light"),
           title: `Current theme: ${colorMode}. Click to switch.`,
-          children: colorMode === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_lucide_react46.Sun, { className: "w-4 h-4" }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_lucide_react46.Moon, { className: "w-4 h-4" })
+          children: colorMode === "dark" ? /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_lucide_react45.Sun, { className: "w-4 h-4" }) : /* @__PURE__ */ (0, import_jsx_runtime69.jsx)(import_lucide_react45.Moon, { className: "w-4 h-4" })
         }
       )
     }
@@ -13006,7 +13009,7 @@ function LumiaRainbowKitProvider({ children }) {
 }
 
 // src/internal/components/UserOpStatus.tsx
-var import_lucide_react48 = require("lucide-react");
+var import_lucide_react47 = require("lucide-react");
 var React13 = __toESM(require("react"), 1);
 init_base();
 
@@ -13018,7 +13021,7 @@ function cn2(...inputs) {
 }
 
 // src/internal/components/Address.tsx
-var import_lucide_react47 = require("lucide-react");
+var import_lucide_react46 = require("lucide-react");
 var React12 = __toESM(require("react"), 1);
 var import_jsx_runtime71 = require("react/jsx-runtime");
 function toExplorerAddressUrl(address, chain) {
@@ -13060,7 +13063,7 @@ var Address = ({
           } catch {
           }
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_lucide_react47.Copy, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_lucide_react46.Copy, { className: "h-4 w-4" })
       }
     ),
     showExplorer && explorer && /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(
@@ -13071,7 +13074,7 @@ var Address = ({
         rel: "noreferrer noopener",
         className: "inline-flex items-center justify-center h-10 w-10 rounded-md hover:bg-accent text-foreground",
         title: "Open in explorer",
-        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_lucide_react47.ExternalLink, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime71.jsx)(import_lucide_react46.ExternalLink, { className: "h-4 w-4" })
       }
     )
   ] });
@@ -13237,30 +13240,30 @@ var UserOpStatus = ({
     if (receipt) {
       const ok = !!receipt.success;
       return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Badge, { variant: ok ? "success" : "destructive", className: "gap-1", children: [
-        ok ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.CheckCircle2, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-3 w-3" }),
+        ok ? /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.CheckCircle2, { className: "h-3 w-3" }) : /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-3 w-3" }),
         ok ? "Included" : "Failed"
       ] });
     }
     if (rejected) {
       return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Badge, { variant: "destructive", className: "gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-3 w-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-3 w-3" }),
         " Rejected by bundler"
       ] });
     }
     if (timedOut) {
       return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Badge, { variant: "warning", className: "gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-3 w-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-3 w-3" }),
         " Timeout - may be rejected"
       ] });
     }
     if (mempool) {
       return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Badge, { variant: "outline", className: "gap-1", children: [
-        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.Clock, { className: "h-3 w-3" }),
+        /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.Clock, { className: "h-3 w-3" }),
         " Pending in bundler"
       ] });
     }
     return /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Badge, { variant: "secondary", className: "gap-1", children: [
-      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.Clock, { className: "h-3 w-3" }),
+      /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.Clock, { className: "h-3 w-3" }),
       " Waiting"
     ] });
   };
@@ -13279,7 +13282,7 @@ var UserOpStatus = ({
             /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "text-xs text-muted-foreground", children: "This is a UserOperation hash (EIP-4337), not a L2 tx hash." })
           ] }),
           /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)(Button, { variant: "ghost", size: "small", onClick: () => tick(), disabled: refreshing, className: "h-8", children: [
-            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.RefreshCw, { className: cn2("h-3.5 w-3.5 mr-1", refreshing && "animate-spin") }),
+            /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.RefreshCw, { className: cn2("h-3.5 w-3.5 mr-1", refreshing && "animate-spin") }),
             /* @__PURE__ */ (0, import_jsx_runtime73.jsx)("span", { className: "text-xs", children: "Refresh" })
           ] })
         ] }),
@@ -13298,7 +13301,7 @@ var UserOpStatus = ({
                 } catch {
                 }
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.Copy, { className: "h-3.5 w-3.5" })
             }
           )
         ] }),
@@ -13317,7 +13320,7 @@ var UserOpStatus = ({
                 } catch {
                 }
               },
-              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.Copy, { className: "h-3.5 w-3.5" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.Copy, { className: "h-3.5 w-3.5" })
             }
           ),
           chain?.blockExplorers?.default?.url && /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(
@@ -13328,7 +13331,7 @@ var UserOpStatus = ({
               rel: "noreferrer noopener",
               className: "inline-flex items-center justify-center h-8 w-8 rounded-md hover:bg-accent text-foreground",
               title: "Open in explorer",
-              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.ExternalLink, { className: "h-3.5 w-3.5" })
+              children: /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.ExternalLink, { className: "h-3.5 w-3.5" })
             }
           )
         ] }),
@@ -13357,16 +13360,16 @@ var UserOpStatus = ({
           ] })
         ] }),
         error && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "text-sm text-destructive flex items-center gap-1 mt-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-4 w-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-4 w-4" }),
           " ",
           error
         ] }),
         rejected && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "text-sm text-destructive flex items-center gap-1 mt-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-4 w-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-4 w-4" }),
           "UserOperation was dropped from bundler mempool. This usually means it was invalid or replaced."
         ] }),
         timedOut && /* @__PURE__ */ (0, import_jsx_runtime73.jsxs)("div", { className: "text-sm text-destructive flex items-center gap-1 mt-4", children: [
-          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react48.AlertCircle, { className: "h-4 w-4" }),
+          /* @__PURE__ */ (0, import_jsx_runtime73.jsx)(import_lucide_react47.AlertCircle, { className: "h-4 w-4" }),
           "Stopped polling after ",
           Math.round(maxPollTimeMs / 1e3),
           "s. UserOperation may have been rejected by the bundler."
@@ -13377,7 +13380,7 @@ var UserOpStatus = ({
 };
 
 // src/internal/components/Hash.tsx
-var import_lucide_react49 = require("lucide-react");
+var import_lucide_react48 = require("lucide-react");
 var React14 = __toESM(require("react"), 1);
 var import_jsx_runtime74 = require("react/jsx-runtime");
 function toExplorerUrl(kind, value, chain) {
@@ -13421,7 +13424,7 @@ var Hash = ({
           } catch {
           }
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react49.Copy, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react48.Copy, { className: "h-4 w-4" })
       }
     ),
     showExplorer && explorer && /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(
@@ -13432,7 +13435,7 @@ var Hash = ({
         rel: "noreferrer noopener",
         className: "inline-flex items-center justify-center h-10 w-10 rounded-md hover:bg-accent text-foreground",
         title: "Open in explorer",
-        children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react49.ExternalLink, { className: "h-4 w-4" })
+        children: /* @__PURE__ */ (0, import_jsx_runtime74.jsx)(import_lucide_react48.ExternalLink, { className: "h-4 w-4" })
       }
     )
   ] });