@volr/react-ui 0.1.0

package/dist/index.cjs

@@ -0,0 +1,3141 @@
+'use strict';
+
+var React3 = require('react');
+var reactDom = require('react-dom');
+var react = require('@volr/react');
+var jsxRuntime = require('react/jsx-runtime');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React3__default = /*#__PURE__*/_interopDefault(React3);
+
+// src/providers/VolrUIProvider.tsx
+
+// src/i18n/locales/en.ts
+var en = {
+  common: {
+    back: "Back",
+    loading: "Loading..."
+  },
+  login: {
+    title: "Sign in",
+    description: "Choose your preferred sign-in method",
+    or: "or",
+    poweredBy: "Powered by Volr",
+    terms: "By continuing, you agree to our Terms of Service and Privacy Policy",
+    email: {
+      title: "Sign in with email",
+      description: "Enter your email to receive a verification code",
+      label: "Email Login",
+      emailLabel: "Email address",
+      placeholder: "Enter Email",
+      sendCode: "Send verification code",
+      codeLabel: "6-digit verification code",
+      codePlaceholder: "000000",
+      verifyTitle: "Enter verification code",
+      verifyDescription: "We sent a code to",
+      resend: "Resend code",
+      submit: "Verify"
+    },
+    social: {
+      google: "Sign in with Google",
+      twitter: "Sign in with Twitter",
+      apple: "Sign in with Apple"
+    },
+    wallet: {
+      title: "Sign in with wallet",
+      signDescription: "Sign the message to verify your wallet",
+      connected: "Connected",
+      connect: "Connect wallet",
+      sign: "Sign message",
+      label: "Wallet Login"
+    }
+  },
+  passkey: {
+    touchId: "Use Touch ID to create your passkey",
+    faceId: "Use Face ID to create your passkey",
+    fingerprint: "Use your fingerprint to create your passkey",
+    biometric: "Use biometric authentication to create your passkey",
+    creating: "Creating your secure passkey...",
+    encrypting: "Encrypting your wallet...",
+    uploading: "Uploading encrypted data...",
+    registering: "Registering wallet provider...",
+    start: "Create passkey",
+    logout: "Logout",
+    errors: {
+      cancelled: "Passkey creation was cancelled. Please try again.",
+      alreadyExists: "A passkey already exists for this account.",
+      notSupported: "Your device doesn't support passkeys.",
+      generic: "Failed to create passkey. Please try again."
+    }
+  },
+  success: {
+    title: "Success!",
+    message: "You're all set. Redirecting..."
+  },
+  deposit: {
+    selectTitle: "Select asset to deposit",
+    qrTitle: "Deposit",
+    scanInstruction: "Scan QR code to deposit",
+    yourAddress: "Your deposit address",
+    copy: "Copy address",
+    copied: "Copied!",
+    listening: "Waiting for deposit...",
+    detected: "Deposit confirmed!",
+    completed: "Deposit completed",
+    completedDescription: "Your deposit has been credited to your account.",
+    amount: "Amount",
+    previousBalance: "Previous balance",
+    newBalance: "New balance",
+    seeMore: "See more",
+    seeLess: "See less",
+    noAssets: "No deposit assets configured.",
+    otherToken: "Deposit with another token",
+    noToken: "Don't have this token?",
+    getOtherToken: "Deposit with another token"
+  },
+  errors: {
+    webauthnNotSupported: "WebAuthn API is not supported",
+    passkeyCreationFailed: "Failed to create passkey",
+    passkeyCreationError: "An error occurred while creating passkey",
+    emailLoginFailed: "Email login failed",
+    socialLoginFailed: "Social login failed",
+    walletConnectionFailed: "Wallet connection failed",
+    passkeySetupFailed: "Passkey setup failed"
+  }
+};
+
+// src/i18n/locales/ko.ts
+var ko = {
+  common: {
+    back: "\uB4A4\uB85C",
+    loading: "\uB85C\uB529 \uC911..."
+  },
+  login: {
+    title: "\uB85C\uADF8\uC778",
+    description: "\uB85C\uADF8\uC778 \uBC29\uC2DD\uC744 \uC120\uD0DD\uD558\uC138\uC694",
+    or: "\uB610\uB294",
+    poweredBy: "Powered by Volr",
+    terms: "\uACC4\uC18D \uC9C4\uD589\uD558\uBA74 \uC11C\uBE44\uC2A4 \uC57D\uAD00 \uBC0F \uAC1C\uC778\uC815\uBCF4 \uBCF4\uD638\uC815\uCC45\uC5D0 \uB3D9\uC758\uD558\uB294 \uAC83\uC785\uB2C8\uB2E4",
+    email: {
+      title: "\uC774\uBA54\uC77C\uB85C \uB85C\uADF8\uC778",
+      description: "\uC778\uC99D \uCF54\uB4DC\uB97C \uBC1B\uC744 \uC774\uBA54\uC77C \uC8FC\uC18C\uB97C \uC785\uB825\uD558\uC138\uC694",
+      label: "\uC774\uBA54\uC77C \uB85C\uADF8\uC778",
+      emailLabel: "\uC774\uBA54\uC77C \uC8FC\uC18C",
+      placeholder: "\uC774\uBA54\uC77C \uC785\uB825",
+      sendCode: "\uC778\uC99D\uCF54\uB4DC \uC804\uC1A1",
+      codeLabel: "6\uC790\uB9AC \uC778\uC99D\uCF54\uB4DC",
+      codePlaceholder: "000000",
+      verifyTitle: "\uC778\uC99D\uCF54\uB4DC \uC785\uB825",
+      verifyDescription: "\uB2E4\uC74C \uC8FC\uC18C\uB85C \uCF54\uB4DC\uB97C \uC804\uC1A1\uD588\uC2B5\uB2C8\uB2E4",
+      resend: "\uCF54\uB4DC \uC7AC\uC804\uC1A1",
+      submit: "\uD655\uC778"
+    },
+    social: {
+      google: "\uAD6C\uAE00\uB85C \uB85C\uADF8\uC778",
+      twitter: "\uD2B8\uC704\uD130\uB85C \uB85C\uADF8\uC778",
+      apple: "\uC560\uD50C\uB85C \uB85C\uADF8\uC778"
+    },
+    wallet: {
+      title: "\uC9C0\uAC11\uC73C\uB85C \uB85C\uADF8\uC778",
+      signDescription: "\uBA54\uC2DC\uC9C0\uC5D0 \uC11C\uBA85\uD558\uC5EC \uC9C0\uAC11\uC744 \uC778\uC99D\uD558\uC138\uC694",
+      connected: "\uC5F0\uACB0\uB428",
+      connect: "\uC9C0\uAC11 \uC5F0\uACB0",
+      sign: "\uBA54\uC2DC\uC9C0 \uC11C\uBA85",
+      label: "\uC9C0\uAC11 \uB85C\uADF8\uC778"
+    }
+  },
+  passkey: {
+    touchId: "Touch ID\uB97C \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
+    faceId: "Face ID\uB97C \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
+    fingerprint: "\uC9C0\uBB38\uC744 \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
+    biometric: "\uC0DD\uCCB4 \uC778\uC99D\uC744 \uC0AC\uC6A9\uD558\uC5EC \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uC138\uC694",
+    creating: "\uBCF4\uC548 \uD328\uC2A4\uD0A4\uB97C \uC0DD\uC131\uD558\uB294 \uC911...",
+    encrypting: "\uC9C0\uAC11\uC744 \uC554\uD638\uD654\uD558\uB294 \uC911...",
+    uploading: "\uC554\uD638\uD654\uB41C \uB370\uC774\uD130\uB97C \uC5C5\uB85C\uB4DC\uD558\uB294 \uC911...",
+    registering: "\uC9C0\uAC11 \uACF5\uAE09\uC790\uB97C \uB4F1\uB85D\uD558\uB294 \uC911...",
+    start: "\uD328\uC2A4\uD0A4 \uC0DD\uC131",
+    logout: "\uB85C\uADF8\uC544\uC6C3",
+    errors: {
+      cancelled: "\uD328\uC2A4\uD0A4 \uC0DD\uC131\uC774 \uCDE8\uC18C\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.",
+      alreadyExists: "\uC774\uBBF8 \uC774 \uACC4\uC815\uC5D0 \uD328\uC2A4\uD0A4\uAC00 \uC874\uC7AC\uD569\uB2C8\uB2E4.",
+      notSupported: "\uC774 \uAE30\uAE30\uB294 \uD328\uC2A4\uD0A4\uB97C \uC9C0\uC6D0\uD558\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.",
+      generic: "\uD328\uC2A4\uD0A4 \uC0DD\uC131\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694."
+    }
+  },
+  success: {
+    title: "\uC644\uB8CC!",
+    message: "\uBAA8\uB4E0 \uC124\uC815\uC774 \uC644\uB8CC\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uB9AC\uB2E4\uC774\uB809\uD2B8 \uC911..."
+  },
+  deposit: {
+    selectTitle: "\uCDA9\uC804\uD560 \uC790\uC0B0\uC744 \uC120\uD0DD\uD558\uC138\uC694",
+    qrTitle: "\uC785\uAE08\uD558\uAE30",
+    scanInstruction: "QR \uCF54\uB4DC\uB97C \uC2A4\uCE94\uD558\uC5EC \uC785\uAE08\uD558\uC138\uC694",
+    yourAddress: "Your deposit address",
+    copy: "\uC8FC\uC18C \uBCF5\uC0AC",
+    copied: "\uBCF5\uC0AC\uB418\uC5C8\uC2B5\uB2C8\uB2E4!",
+    listening: "\uC785\uAE08\uC744 \uAE30\uB2E4\uB9AC\uB294 \uC911...",
+    detected: "\uC785\uAE08\uC774 \uD655\uC778\uB418\uC5C8\uC2B5\uB2C8\uB2E4!",
+    completed: "\uC785\uAE08 \uC644\uB8CC",
+    completedDescription: "\uC785\uAE08\uC774 \uACC4\uC815\uC5D0 \uC785\uAE08\uB418\uC5C8\uC2B5\uB2C8\uB2E4.",
+    amount: "\uC785\uAE08 \uAE08\uC561",
+    previousBalance: "\uC774\uC804 \uC794\uC561",
+    newBalance: "\uC0C8 \uC794\uC561",
+    seeMore: "\uC790\uC138\uD788 \uBCF4\uAE30",
+    seeLess: "\uAC04\uB2E8\uD788 \uBCF4\uAE30",
+    noAssets: "\uC124\uC815\uB41C \uCDA9\uC804 \uC790\uC0B0\uC774 \uC5C6\uC2B5\uB2C8\uB2E4.",
+    otherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uCDA9\uC804\uD558\uAE30",
+    noToken: "\uC774 \uD1A0\uD070\uC774 \uC5C6\uC73C\uC2E0\uAC00\uC694?",
+    getOtherToken: "\uB2E4\uB978 \uD1A0\uD070\uC73C\uB85C \uC785\uAE08\uD558\uAE30"
+  },
+  errors: {
+    webauthnNotSupported: "WebAuthn API\uAC00 \uC9C0\uC6D0\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4.",
+    passkeyCreationFailed: "\uD328\uC2A4\uD0A4 \uC0DD\uC131\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.",
+    passkeyCreationError: "\uD328\uC2A4\uD0A4 \uC0DD\uC131 \uC911 \uBB38\uC81C\uAC00 \uBC1C\uC0DD\uD588\uC2B5\uB2C8\uB2E4.",
+    emailLoginFailed: "\uC774\uBA54\uC77C \uB85C\uADF8\uC778\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.",
+    socialLoginFailed: "\uC18C\uC15C \uB85C\uADF8\uC778\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.",
+    walletConnectionFailed: "\uC9C0\uAC11 \uC5F0\uACB0\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4.",
+    passkeySetupFailed: "\uD328\uC2A4\uD0A4 \uC124\uC815\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4."
+  }
+};
+
+// src/i18n/index.ts
+var translations = {
+  en,
+  ko
+};
+function getTranslations(locale = "en") {
+  return translations[locale] || translations.en;
+}
+var I18nContext = React3.createContext(null);
+function useI18n() {
+  const context = React3.useContext(I18nContext);
+  if (!context) {
+    return {
+      locale: "en",
+      translations: getTranslations("en"),
+      t: (key) => {
+        const translations2 = getTranslations("en");
+        const keys = key.split(".");
+        let value = translations2;
+        for (const k of keys) {
+          if (value && typeof value === "object" && k in value) {
+            value = value[k];
+          } else {
+            if (process.env.NODE_ENV !== "production") {
+              console.warn(`[i18n] Missing key: ${key} (locale: en)`);
+            }
+            return key;
+          }
+        }
+        return typeof value === "string" ? value : key;
+      },
+      setLocale: () => {
+      }
+    };
+  }
+  return context;
+}
+function detectLocale() {
+  if (typeof window === "undefined" || !window.navigator?.language) {
+    return "en";
+  }
+  const lang = window.navigator.language.toLowerCase();
+  return lang.startsWith("ko") ? "ko" : "en";
+}
+function I18nProvider({ children }) {
+  const [locale, setLocale] = React3.useState(detectLocale());
+  const translations2 = React3.useMemo(() => getTranslations(locale), [locale]);
+  const t = React3.useMemo(() => {
+    return (key) => {
+      const keys = key.split(".");
+      let value2 = translations2;
+      for (const k of keys) {
+        if (value2 && typeof value2 === "object" && k in value2) {
+          value2 = value2[k];
+        } else {
+          if (process.env.NODE_ENV !== "production") {
+            console.warn(`[i18n] Missing key: ${key} (locale: ${locale})`);
+          }
+          return key;
+        }
+      }
+      return typeof value2 === "string" ? value2 : key;
+    };
+  }, [translations2]);
+  const value = React3.useMemo(
+    () => ({
+      locale,
+      translations: translations2,
+      t,
+      setLocale
+    }),
+    [locale, translations2, t, setLocale]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(I18nContext.Provider, { value, children });
+}
+var useTranslation = useI18n;
+var VolrModalContext = React3.createContext(null);
+var useVolrModal = () => {
+  const context = React3.useContext(VolrModalContext);
+  if (!context) {
+    throw new Error("useVolrModal must be used within VolrUIProvider");
+  }
+  return context;
+};
+var VolrModalProvider = ({
+  children
+}) => {
+  const [isOpen, setIsOpen] = React3.useState(false);
+  const [mode, setMode] = React3.useState("auth");
+  const { user } = react.useVolr();
+  const open = React3.useCallback(() => {
+    setMode(user ? "deposit" : "auth");
+    setIsOpen(true);
+  }, [user]);
+  const close = React3.useCallback(() => {
+    setIsOpen(false);
+  }, []);
+  const toggle = React3.useCallback(() => {
+    setIsOpen((prev) => !prev);
+  }, []);
+  return /* @__PURE__ */ jsxRuntime.jsx(VolrModalContext.Provider, { value: { isOpen, mode, open, close, toggle }, children });
+};
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+function useMediaQuery(query) {
+  const [matches, setMatches] = React3.useState(() => {
+    if (typeof window === "undefined") return false;
+    return window.matchMedia(query).matches;
+  });
+  React3.useEffect(() => {
+    if (typeof window === "undefined") return;
+    const mql = window.matchMedia(query);
+    const handler = (event) => setMatches(event.matches);
+    mql.addEventListener("change", handler);
+    setMatches(mql.matches);
+    return () => mql.removeEventListener("change", handler);
+  }, [query]);
+  return matches;
+}
+var Modal = ({
+  open,
+  onOpenChange,
+  children,
+  className,
+  onPointerDownOutside,
+  onEscapeKeyDown,
+  variant: explicitVariant,
+  contentClassName
+}) => {
+  const isMobile = useMediaQuery("(max-width: 500px)");
+  const variant = explicitVariant ?? (isMobile ? "bottom-sheet" : "centered");
+  React3__default.default.useEffect(() => {
+    const handleEscape = (e) => {
+      if (e.key === "Escape" && open) {
+        if (onEscapeKeyDown) {
+          onEscapeKeyDown(e);
+        } else {
+          onOpenChange(false);
+        }
+      }
+    };
+    if (open) {
+      document.addEventListener("keydown", handleEscape);
+    }
+    return () => document.removeEventListener("keydown", handleEscape);
+  }, [open, onOpenChange, onEscapeKeyDown]);
+  if (!open) return null;
+  const isBottomSheet = variant === "bottom-sheet";
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "volr:fixed volr:inset-0 volr:z-40 volr:bg-black/45",
+        onClick: (e) => {
+          if (onPointerDownOutside) {
+            onPointerDownOutside(e);
+          } else {
+            onOpenChange(false);
+          }
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: cn(
+          "volr:fixed volr:inset-0 volr:z-50 volr:flex volr:items-center volr:justify-center",
+          isBottomSheet && "volr:items-end"
+        ),
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "div",
+          {
+            className: cn(
+              "volr:bg-white volr:border volr:border-slate-300 volr:shadow-xl volr:overflow-y-auto volr:relative volr:w-full",
+              isBottomSheet ? "volr:max-w-full volr:max-h-[85vh] volr:rounded-t-3xl volr:px-4 volr:py-6 volr:shadow-2xl" : "volr:rounded-2xl volr:p-5 volr:max-w-md volr:w-full volr:max-h-[90vh]",
+              className,
+              contentClassName
+            ),
+            onClick: (e) => e.stopPropagation(),
+            children
+          }
+        )
+      }
+    )
+  ] });
+};
+var ModalHeader = ({
+  className,
+  back = false,
+  onBack,
+  onClose,
+  children,
+  ...props
+}) => {
+  const { t } = useI18n();
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "volr:flex volr:items-center volr:justify-between volr:mb-3",
+        className
+      ),
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-4 volr:flex-1", children: [
+          back && onBack && /* @__PURE__ */ jsxRuntime.jsxs(
+            "button",
+            {
+              onClick: onBack,
+              className: "volr:p-2 volr:-ml-2 volr:rounded-lg volr:text-slate-500 hover:volr:text-slate-700 hover:volr:bg-slate-100 volr:transition-colors volr:flex volr:items-center volr:gap-1",
+              type: "button",
+              children: [
+                /* @__PURE__ */ jsxRuntime.jsx(
+                  "svg",
+                  {
+                    width: "20",
+                    height: "20",
+                    viewBox: "0 0 24 24",
+                    fill: "none",
+                    stroke: "currentColor",
+                    strokeWidth: "2",
+                    children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M19 12H5M12 19l-7-7 7-7" })
+                  }
+                ),
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium", children: t("common.back") })
+              ]
+            }
+          ),
+          children
+        ] }),
+        onClose && /* @__PURE__ */ jsxRuntime.jsx(
+          "button",
+          {
+            type: "button",
+            onClick: onClose,
+            className: "volr:p-1 volr:rounded-lg volr:text-slate-400 hover:volr:text-slate-600 hover:volr:bg-slate-100 volr:transition-colors",
+            "aria-label": "Close",
+            children: /* @__PURE__ */ jsxRuntime.jsxs(
+              "svg",
+              {
+                width: "20",
+                height: "20",
+                viewBox: "0 0 24 24",
+                fill: "none",
+                xmlns: "http://www.w3.org/2000/svg",
+                stroke: "currentColor",
+                strokeWidth: "2",
+                strokeLinecap: "round",
+                strokeLinejoin: "round",
+                children: [
+                  /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                  /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                ]
+              }
+            )
+          }
+        )
+      ]
+    }
+  );
+};
+var ModalTitle = ({
+  className,
+  ...props
+}) => /* @__PURE__ */ jsxRuntime.jsx(
+  "h2",
+  {
+    className: cn(
+      "volr:text-lg volr:font-semibold volr:leading-none volr:tracking-tight",
+      className
+    ),
+    ...props
+  }
+);
+var sizeClasses = {
+  xl: "volr:text-xl",
+  "2xl": "volr:text-2xl",
+  "3xl": "volr:text-3xl"
+};
+var spacingClasses = {
+  tight: "volr:mb-3",
+  normal: "volr:mb-5",
+  loose: "volr:mb-7"
+};
+function ModalTitle2({
+  children,
+  size = "2xl",
+  spacing = "normal",
+  as: Component = "h2",
+  className = ""
+}) {
+  const sizeClass = sizeClasses[size];
+  const spacingClass = spacingClasses[spacing];
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Component,
+    {
+      className: `volr:font-bold volr:text-slate-900 ${sizeClass} ${spacingClass} ${className}`,
+      children
+    }
+  );
+}
+
+// src/components/features/passkey/utils/biometric.ts
+function getBiometricType() {
+  const ua = navigator.userAgent;
+  if (/iPhone|iPad|iPod/.test(ua)) {
+    return "faceId";
+  }
+  if (/Macintosh|MacIntel/.test(ua)) {
+    return "touchId";
+  }
+  return "fingerprint";
+}
+function getUserFriendlyError(error, t) {
+  const msg = error.message.toLowerCase();
+  if (msg.includes("timed out") || msg.includes("not allowed") || msg.includes("cancelled")) {
+    return t("passkey.errors.cancelled");
+  }
+  if (msg.includes("already registered") || msg.includes("already exists")) {
+    return t("passkey.errors.alreadyExists");
+  }
+  if (msg.includes("not supported")) {
+    return t("passkey.errors.notSupported");
+  }
+  return t("passkey.errors.generic");
+}
+function WalletConnectedView({ user }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { size: "3xl", children: "Wallet Connected" }),
+    user.evmAddress ? /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:bg-slate-50 volr:rounded-lg volr:p-5 volr:mb-6 volr:text-left", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-slate-500 volr:mb-1 volr:font-medium", children: "Wallet Address" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:text-slate-900 volr:font-mono volr:break-all", children: user.evmAddress })
+      ] }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-slate-500 volr:mb-1 volr:font-medium", children: "Key Storage Type" }),
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:text-slate-900 volr:capitalize", children: user.keyStorageType })
+      ] })
+    ] }) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:bg-slate-50 volr:rounded-lg volr:p-5 volr:mb-6 volr:text-left", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:text-slate-500 volr:mb-2", children: "Passkey is set up" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-slate-400", children: "Wallet address will be available after provider is restored." })
+    ] })
+  ] });
+}
+function FaceIdIcon({ size }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          d: "M7.5,3 C7.77614237,3 8,3.22385763 8,3.5 C8,3.77614237 7.77614237,4 7.5,4 L5.5,4 C4.67157288,4 4,4.67157288 4,5.5 L4,7.53112887 C4,7.80727125 3.77614237,8.03112887 3.5,8.03112887 C3.22385763,8.03112887 3,7.80727125 3,7.53112887 L3,5.5 C3,4.11928813 4.11928813,3 5.5,3 L7.5,3 Z M16.5,4 C16.2238576,4 16,3.77614237 16,3.5 C16,3.22385763 16.2238576,3 16.5,3 L18.5,3 C19.8807119,3 21,4.11928813 21,5.5 L21,7.5 C21,7.77614237 20.7761424,8 20.5,8 C20.2238576,8 20,7.77614237 20,7.5 L20,5.5 C20,4.67157288 19.3284271,4 18.5,4 L16.5,4 Z M20,16.5 C20,16.2238576 20.2238576,16 20.5,16 C20.7761424,16 21,16.2238576 21,16.5 L21,18.5 C21,19.8807119 19.8807119,21 18.5,21 L16.5,21 C16.2238576,21 16,20.7761424 16,20.5 C16,20.2238576 16.2238576,20 16.5,20 L18.5,20 C19.3284271,20 20,19.3284271 20,18.5 L20,16.5 Z M3,16.5 C3,16.2238576 3.22385763,16 3.5,16 C3.77614237,16 4,16.2238576 4,16.5 L4,18.5 C4,19.3284271 4.67157288,20 5.5,20 L7.5,20 C7.77614237,20 8,20.2238576 8,20.5 C8,20.7761424 7.77614237,21 7.5,21 L5.5,21 C4.11928813,21 3,19.8807119 3,18.5 L3,16.5 Z M8,8.5 C8,8.22385763 8.22385763,8 8.5,8 C8.77614237,8 9,8.22385763 9,8.5 L9,9.5 C9,9.77614237 8.77614237,10 8.5,10 C8.22385763,10 8,9.77614237 8,9.5 L8,8.5 Z M16,8.5 C16,8.22385763 16.2238576,8 16.5,8 C16.7761424,8 17,8.22385763 17,8.5 L17,9.5 C17,9.77614237 16.7761424,10 16.5,10 C16.2238576,10 16,9.77614237 16,9.5 L16,8.5 Z M12,8.5 C12,8.22385763 12.2238576,8 12.5,8 C12.7761424,8 13,8.22385763 13,8.5 L13,12.5 C13,13.3284271 12.3284271,14 11.5,14 C11.2238576,14 11,13.7761424 11,13.5 C11,13.2238576 11.2238576,13 11.5,13 C11.7761424,13 12,12.7761424 12,12.5 L12,8.5 Z M8.1,15.8 C7.93431458,15.5790861 7.9790861,15.2656854 8.2,15.1 C8.4209139,14.9343146 8.73431458,14.9790861 8.9,15.2 C9.81096778,16.4146237 10.8353763,17 12,17 C13.1646237,17 14.1890322,16.4146237 15.1,15.2 C15.2656854,14.9790861 15.5790861,14.9343146 15.8,15.1 C16.0209139,15.2656854 16.0656854,15.5790861 15.9,15.8 C14.8109678,17.252043 13.502043,18 12,18 C10.497957,18 9.18903222,17.252043 8.1,15.8 Z",
+          fill: "#3b82f6"
+        }
+      )
+    }
+  );
+}
+function TouchIdIcon({ size }) {
+  const fill = "#ef4444";
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M18.4558 14.6734C18.4921 15.5205 18.3742 16.4404 18.2653 17.3604C18.2562 17.4514 18.238 17.5425 18.2108 17.6245C18.1564 17.8613 18.0384 18.0708 17.7571 18.0252C17.4759 17.9706 17.4123 17.7429 17.4577 17.497C17.5484 16.8958 17.5938 16.2947 17.6483 15.6936C17.8025 13.9539 17.6483 12.2325 17.2218 10.5474C16.5322 7.84233 13.801 6.12999 11.0879 6.62183C8.28416 7.13189 6.33331 9.63663 6.58737 12.4419C6.65996 13.2435 6.88681 14.0268 6.83237 14.8374C6.82329 15.0013 6.82329 15.1744 6.787 15.3383C6.74163 15.5569 6.63274 15.7573 6.3696 15.73C6.08832 15.7027 5.98851 15.4841 6.01573 15.2382C6.05202 14.8465 6.07925 14.4548 6.0248 14.0632C5.8887 13.0158 5.68908 11.9683 5.8887 10.9027C6.4422 7.96073 9.00099 5.77477 11.9681 5.75656C14.8898 5.73834 17.5121 7.89698 18.0838 10.8025C18.3288 12.0503 18.483 13.3163 18.4558 14.6734Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M21.0963 11.112C21.1053 11.4399 21.1235 11.7132 20.7877 11.7496C20.4702 11.786 20.3885 11.531 20.3431 11.276C20.1344 9.84601 19.7443 8.47978 18.8913 7.29572C16.7772 4.35379 13.9099 3.19705 10.3802 3.78908C7.16809 4.32646 4.55485 6.95872 3.8471 10.183C3.78359 10.4745 3.79266 10.9208 3.3299 10.8206C2.83992 10.7204 3.03047 10.3014 3.10306 9.99174C3.99228 6.10255 7.24975 3.26992 11.1242 2.88737C15.7337 2.43197 20.1617 5.63804 20.9874 10.5018C21.0327 10.7386 21.069 10.9663 21.0963 11.112Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M12.1405 2.22257C7.19532 2.04952 2.73105 5.82029 2.23199 11.2123C2.14126 12.2051 2.27736 13.1797 2.43161 14.1543C2.58587 15.0924 2.30458 15.9212 1.72386 16.659C1.56054 16.8685 1.35184 17.078 1.07963 16.8503C0.798344 16.6226 0.961671 16.3858 1.13407 16.1763C1.68757 15.5023 1.76016 14.7281 1.61498 13.8992C0.607796 7.85141 4.50042 2.44117 10.5617 1.50303C11.4418 1.3664 12.3401 1.32997 13.2293 1.4757C13.4834 1.52124 13.7375 1.585 13.7193 1.90378C13.6921 2.259 13.4199 2.24989 13.1477 2.24079C12.812 2.21346 12.4762 2.22257 12.1405 2.22257Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M14.1094 14.6278C14.064 17.9432 13.075 20.9398 11.0969 23.6085C10.9335 23.8271 10.7521 24.1003 10.4345 23.8726C10.1351 23.654 10.2802 23.399 10.4526 23.1622C11.9498 21.1402 12.8844 18.8813 13.2111 16.3766C13.4107 14.8373 13.3472 13.3254 13.0477 11.8134C12.9207 11.1667 12.3581 10.8297 11.723 10.9664C11.1876 11.0848 10.8519 11.6221 10.9698 12.2324C11.2511 13.7261 11.2874 15.2108 11.0152 16.7045C10.9608 17.0051 10.9608 17.4423 10.5162 17.3785C10.0625 17.3147 10.1986 16.914 10.253 16.6043C10.4889 15.229 10.498 13.8627 10.2258 12.4965C9.98988 11.3034 10.6069 10.3834 11.7502 10.1739C12.7392 9.99178 13.6466 10.7022 13.8553 11.8316C13.9188 12.1777 13.9823 12.5147 14.0095 12.8609C14.0549 13.4438 14.1457 14.0358 14.1094 14.6278Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M22.8111 14.6825C22.8564 15.484 22.7748 16.3402 22.684 17.1963C22.6568 17.4787 22.6477 17.8885 22.2122 17.8248C21.7948 17.761 21.8765 17.3876 21.9128 17.087C22.2122 14.5732 22.1033 12.0775 21.4863 9.63656C20.6424 6.25743 18.5192 3.98039 15.2799 2.73257C15.2073 2.70525 15.1347 2.68703 15.0621 2.65971C14.8443 2.56863 14.6719 2.432 14.7536 2.17698C14.8443 1.90373 15.0712 1.87641 15.3162 1.94927C15.9423 2.14054 16.5411 2.39557 17.1037 2.72347C20.2704 4.55421 22.0307 7.33219 22.5388 10.939C22.7112 12.1595 22.8473 13.38 22.8111 14.6825Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M11.8227 7.21389C12.0042 7.21389 12.0677 7.20478 12.1221 7.21389C12.3853 7.24121 12.6847 7.28675 12.6938 7.61465C12.7029 7.97897 12.3944 8.02451 12.104 8.02451C10.5796 7.99719 9.41817 8.63476 8.61061 9.91901C8.07526 10.7752 7.90286 11.7133 8.09341 12.7152C8.70135 16.0033 7.81212 18.8359 5.4711 21.204C5.38944 21.286 5.2987 21.3771 5.19889 21.4499C4.99927 21.6139 4.7815 21.6685 4.60002 21.4499C4.42762 21.2496 4.51836 21.0492 4.68169 20.8852C5.17167 20.4116 5.6435 19.9198 6.0246 19.3551C7.28585 17.4697 7.81212 15.4021 7.35844 13.1706C6.7505 10.1103 8.80116 7.3414 11.8227 7.21389Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M17.0128 14.3092C17.0037 17.7065 16.2415 20.6303 14.7171 23.3627C14.6899 23.4173 14.6627 23.472 14.6264 23.5175C14.4812 23.7543 14.2907 23.9001 14.0275 23.7361C13.7825 23.5904 13.8279 23.3536 13.9549 23.135C14.2635 22.5976 14.5357 22.042 14.7897 21.4682C15.7969 19.2003 16.2597 16.823 16.2415 14.3456C16.2324 13.2435 16.1145 12.1323 15.8604 11.0576C15.6517 10.1377 15.1618 9.39078 14.4086 8.81697C14.2544 8.69856 14.082 8.58926 13.9368 8.47086C13.7825 8.34334 13.6918 8.18851 13.8098 7.99723C13.9277 7.79686 14.1092 7.75131 14.3179 7.8515C14.826 8.10653 15.2434 8.46175 15.6154 8.89894C16.3504 9.76422 16.668 10.7934 16.8132 11.8955C16.9221 12.7881 17.04 13.6716 17.0128 14.3092Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M12.0223 0.0183811C13.7554 -0.100025 15.3796 0.309842 16.9493 1.01117C16.9947 1.02939 17.031 1.0476 17.0763 1.06582C17.3395 1.17512 17.5572 1.32996 17.4302 1.64874C17.2941 1.97664 17.0219 1.88555 16.7769 1.76715C15.924 1.36639 15.0348 1.0476 14.1092 0.910981C9.6994 0.218761 6.03362 1.56677 3.16632 5.02787C2.97577 5.26468 2.80337 5.67455 2.42227 5.39219C2.01396 5.09163 2.37691 4.79106 2.56745 4.54514C4.62719 1.96753 7.30394 0.464681 10.5705 0.0274892C11.0423 -0.0362679 11.5323 0.0183811 12.0223 0.0183811Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M19.9166 14.3454C19.9257 16.9595 19.5264 19.2456 18.7461 21.468C18.6916 21.6137 18.6372 21.7504 18.5827 21.8961C18.492 22.1329 18.3378 22.306 18.0655 22.2058C17.8024 22.1056 17.7752 21.887 17.8659 21.6411C17.9839 21.2949 18.1018 20.9579 18.2107 20.6027C18.8822 18.5078 19.2179 16.3492 19.1362 14.145C19.0637 12.287 18.9638 10.4107 18.0565 8.70747C17.9204 8.45244 17.757 8.21563 17.6119 7.9606C17.4939 7.75112 17.4757 7.54163 17.6844 7.3959C17.9113 7.23195 18.0837 7.35946 18.2289 7.54163C18.9003 8.43423 19.2996 9.44523 19.5173 10.52C19.7805 11.8771 19.9438 13.2251 19.9166 14.3454Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M4.61846 14.4365C4.57309 14.136 4.50958 13.6714 4.44606 13.2069C4.06496 10.4471 4.90882 8.12457 6.94133 6.23007C7.01392 6.15721 7.10466 6.09345 7.18632 6.02969C7.35872 5.9204 7.53112 5.92039 7.6763 6.07523C7.83056 6.23007 7.80334 6.41224 7.6763 6.56707C7.55835 6.7037 7.42224 6.83121 7.29521 6.95873C5.48954 8.74392 4.80901 10.8843 5.26269 13.3891C5.64379 15.4931 5.07215 17.3238 3.66572 18.8995C3.48425 19.0999 3.26648 19.273 3.04871 19.4369C2.88538 19.5553 2.70391 19.5644 2.55873 19.4005C2.40447 19.2183 2.44077 19.0361 2.59502 18.8722C2.73113 18.7265 2.87631 18.599 3.01241 18.4532C4.05589 17.3785 4.57309 16.0942 4.61846 14.4365Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M12.6577 14.6552C12.5942 17.8886 11.5688 20.7668 9.50003 23.2715C9.45466 23.3262 9.40929 23.3899 9.35485 23.4446C9.18245 23.6358 8.97376 23.7269 8.76506 23.5448C8.56544 23.3808 8.61081 23.1622 8.75599 22.971C9.00098 22.6431 9.26412 22.3334 9.50003 21.9964C11.0335 19.856 11.7957 17.4514 11.8955 14.8192C11.9227 13.9994 11.8138 13.1888 11.6868 12.3782C11.6687 12.2871 11.6505 12.196 11.6414 12.1049C11.6233 11.8681 11.6868 11.6677 11.9499 11.6313C12.2131 11.5858 12.3401 11.7497 12.3855 11.9865C12.567 12.87 12.6668 13.7626 12.6577 14.6552Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M23.9998 11.5857C23.9998 11.7679 23.9998 11.95 23.9998 12.1322C23.9998 12.369 23.9363 12.5694 23.655 12.5785C23.3737 12.5876 23.2648 12.3872 23.2467 12.1322C23.2285 11.6768 23.2195 11.2214 23.165 10.7751C22.7839 7.55078 21.2868 4.95495 18.7371 2.96937C18.5102 2.78721 18.1382 2.61415 18.3923 2.25894C18.6373 1.92193 18.9367 2.17696 19.1726 2.35913C22.2214 4.6726 23.773 7.77848 23.9998 11.5857Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M15.5522 14.0449C15.5522 14.1815 15.5522 14.3181 15.5522 14.4547C15.5431 14.7007 15.4615 14.9284 15.1711 14.9284C14.8807 14.9284 14.8082 14.7098 14.7991 14.4547C14.7537 13.5348 14.6811 12.6149 14.5178 11.7041C14.1821 9.86423 12.3583 8.92609 10.7794 9.79137C10.2532 10.0828 9.85391 10.52 9.64521 11.1029C9.61799 11.1758 9.59077 11.2487 9.57262 11.3215C9.49096 11.5766 9.39115 11.8498 9.05542 11.7496C8.69247 11.6403 8.76506 11.3306 8.84673 11.0665C9.20967 9.95532 9.9265 9.17201 11.0516 8.84412C12.9662 8.27941 14.8082 9.40883 15.2437 11.3944C15.4342 12.2597 15.5068 13.1523 15.5522 14.0449Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M9.73564 14.6279C9.69934 17.497 8.67401 19.9653 6.70502 22.0511C6.6415 22.1149 6.57799 22.1786 6.51447 22.2424C6.32392 22.4245 6.09708 22.5338 5.87931 22.3152C5.64339 22.0875 5.7795 21.8689 5.97005 21.6868C6.62335 21.0492 7.17685 20.3388 7.63961 19.5464C8.65587 17.7794 9.11863 15.8849 8.93715 13.8355C8.92808 13.6807 8.919 13.535 8.919 13.3801C8.90993 13.1342 8.97345 12.8974 9.25473 12.8792C9.54509 12.8519 9.63583 13.0705 9.67212 13.3164C9.69934 13.4985 9.73564 13.6716 9.74471 13.8538C9.74471 14.1088 9.73564 14.3638 9.73564 14.6279Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M0.00881775 12.0866C-0.0274771 10.1648 0.389914 8.4616 1.15211 6.83124C1.20655 6.70372 1.27007 6.58532 1.35173 6.47602C1.46061 6.33029 1.61487 6.25742 1.78727 6.3485C1.97782 6.43959 2.05041 6.60353 1.97782 6.80391C1.88708 7.05894 1.76912 7.30486 1.66024 7.55989C0.743789 9.72763 0.516946 11.9682 0.997854 14.2817C1.06137 14.5823 1.28821 15.0013 0.798232 15.1197C0.308251 15.2381 0.308251 14.7644 0.244735 14.4639C0.0814075 13.6441 -0.0365509 12.8153 0.00881775 12.0866Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M11.9136 4.29004C13.6648 4.3538 15.171 4.80921 16.5049 5.78378C16.5502 5.82021 16.6047 5.85665 16.65 5.89308C16.8497 6.07524 17.1309 6.25741 16.886 6.56708C16.65 6.87676 16.4051 6.66727 16.1782 6.50333C14.0731 4.95494 11.7956 4.69991 9.36385 5.61073C9.3094 5.62894 9.25496 5.65627 9.19145 5.67448C8.97368 5.75646 8.75591 5.75646 8.64702 5.51965C8.51999 5.25551 8.67424 5.08245 8.90109 4.97316C9.58162 4.65437 10.2894 4.47221 11.0243 4.37202C11.3601 4.33559 11.6867 4.31737 11.9136 4.29004Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M15.4521 16.5042C15.2797 17.9068 14.9531 19.2457 14.454 20.5391C14.0457 21.5865 13.5467 22.5884 12.9206 23.5266C12.8571 23.6268 12.7935 23.7361 12.7119 23.8271C12.5486 24.0184 12.3399 24.0548 12.1493 23.9273C11.9406 23.7907 11.9769 23.5903 12.0858 23.3991C12.2763 23.0712 12.4941 22.7615 12.6847 22.4336C13.71 20.6484 14.3724 18.7448 14.6355 16.6954C14.6446 16.5861 14.6718 16.486 14.699 16.3858C14.7535 16.1672 14.8896 16.0306 15.1255 16.0579C15.3705 16.0943 15.4521 16.2856 15.4521 16.5042Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M21.3501 14.7098C21.3773 16.4676 21.1414 18.1891 20.7331 19.8923C20.7149 19.947 20.7059 20.0107 20.6877 20.0654C20.6061 20.3295 20.5425 20.6574 20.1705 20.5572C19.8166 20.4661 19.8529 20.1655 19.9255 19.8832C20.1161 19.1454 20.2703 18.4077 20.3611 17.6517C20.5425 16.2673 20.6786 14.8828 20.5425 13.4802C20.5153 13.1978 20.5516 12.9246 20.8783 12.879C21.2503 12.8335 21.3229 13.134 21.332 13.4255C21.3592 13.8536 21.3501 14.2817 21.3501 14.7098Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M3.94694 14.5094C3.8925 16.0031 3.3753 17.1872 2.34089 18.1435C2.16849 18.2984 1.97794 18.3894 1.77832 18.2073C1.56963 18.016 1.59685 17.7792 1.7874 17.6061C3.15753 16.3583 3.34808 14.8099 2.96698 13.0976C2.91254 12.8517 2.92161 12.5875 2.92161 12.3325C2.93069 12.1321 3.04864 11.9773 3.25734 11.9773C3.46604 11.9682 3.61122 12.0957 3.63844 12.2961C3.7564 13.0612 3.85621 13.8263 3.94694 14.5094Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M10.3619 18.9908C10.2711 19.2002 10.1532 19.4735 10.0262 19.7467C9.48173 20.9035 8.78305 21.96 7.89382 22.8799C7.70328 23.0712 7.49458 23.2534 7.24052 23.0075C7.0046 22.7798 7.14978 22.5612 7.32218 22.379C8.30214 21.3316 9.05526 20.1384 9.60876 18.8086C9.6995 18.59 9.8356 18.3987 10.1169 18.4807C10.3256 18.5445 10.3891 18.7084 10.3619 18.9908Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M6.33312 17.2874C6.3059 17.3785 6.26054 17.506 6.21517 17.6244C5.75241 18.7174 5.05373 19.6282 4.17358 20.4115C3.96488 20.6028 3.71989 20.7121 3.50212 20.448C3.29343 20.202 3.46583 19.9835 3.65638 19.8286C4.50023 19.1091 5.11725 18.2256 5.54371 17.2055C5.64352 16.9778 5.77055 16.8047 6.05184 16.8594C6.23331 16.914 6.32405 17.0506 6.33312 17.2874Z",
+            fill
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M17.8026 19.5554C17.7753 19.6647 17.7572 19.7831 17.7209 19.9015C17.4215 20.9216 17.0676 21.9144 16.5957 22.8708C16.4778 23.1167 16.3145 23.3444 16.006 23.1987C15.7156 23.062 15.7882 22.7979 15.8971 22.5702C16.3508 21.5774 16.7409 20.5573 17.0313 19.5099C17.0948 19.2639 17.2218 19.0909 17.5122 19.1455C17.7209 19.1911 17.8026 19.3459 17.8026 19.5554Z",
+            fill
+          }
+        )
+      ]
+    }
+  );
+}
+function FingerprintIcon({ size }) {
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "svg",
+    {
+      width: size,
+      height: size,
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      children: /* @__PURE__ */ jsxRuntime.jsx(
+        "path",
+        {
+          d: "M17.81 4.47c-.08 0-.16-.02-.23-.06C15.66 3.42 14 3 12.01 3c-1.98 0-3.86.47-5.57 1.41-.24.13-.54.04-.68-.2-.13-.24-.04-.55.2-.68C7.82 2.52 9.86 2 12.01 2c2.13 0 3.99.47 6.03 1.52.25.13.34.43.21.67-.09.18-.26.28-.44.28zM3.5 9.72c-.1 0-.2-.03-.29-.09-.23-.16-.28-.47-.12-.7.99-1.4 2.25-2.5 3.75-3.27C9.98 4.04 14 4.03 17.15 5.65c1.5.77 2.76 1.86 3.75 3.25.16.22.11.54-.12.7-.23.16-.54.11-.7-.12-.9-1.26-2.04-2.25-3.39-2.94-2.87-1.47-6.54-1.47-9.4.01-1.36.7-2.5 1.7-3.4 2.96-.08.14-.23.21-.39.21zm6.25 12.07c-.13 0-.26-.05-.35-.15-.87-.87-1.34-1.43-2.01-2.64-.69-1.23-1.05-2.73-1.05-4.34 0-2.97 2.54-5.39 5.66-5.39s5.66 2.42 5.66 5.39c0 .28-.22.5-.5.5s-.5-.22-.5-.5c0-2.42-2.09-4.39-4.66-4.39-2.57 0-4.66 1.97-4.66 4.39 0 1.44.32 2.77.93 3.85.64 1.15 1.08 1.64 1.85 2.42.19.2.19.51 0 .71-.11.1-.24.15-.37.15zm7.17-1.85c-1.19 0-2.24-.3-3.1-.89-1.49-1.01-2.38-2.65-2.38-4.39 0-.28.22-.5.5-.5s.5.22.5.5c0 1.41.72 2.74 1.94 3.56.71.48 1.54.71 2.54.71.24 0 .64-.03 1.04-.1.27-.05.53.13.58.41.05.27-.13.53-.41.58-.57.11-1.07.12-1.21.12zM14.91 22c-.04 0-.09-.01-.13-.02-1.59-.44-2.63-1.03-3.72-2.1-1.4-1.39-2.17-3.24-2.17-5.22 0-1.62 1.38-2.94 3.08-2.94 1.7 0 3.08 1.32 3.08 2.94 0 1.07.93 1.94 2.08 1.94s2.08-.87 2.08-1.94c0-3.77-3.25-6.83-7.25-6.83-2.84 0-5.44 1.58-6.61 4.03-.39.81-.59 1.76-.59 2.8 0 .78.07 2.01.67 3.61.1.26-.03.55-.29.64-.26.1-.55-.04-.64-.29-.49-1.31-.73-2.61-.73-3.96 0-1.2.23-2.29.68-3.24 1.33-2.79 4.28-4.6 7.51-4.6 4.55 0 8.25 3.51 8.25 7.83 0 1.62-1.38 2.94-3.08 2.94s-3.08-1.32-3.08-2.94c0-1.07-.93-1.94-2.08-1.94s-2.08.87-2.08 1.94c0 1.71.66 3.31 1.87 4.51.95.94 1.86 1.46 3.27 1.85.27.07.42.35.35.61-.05.23-.26.38-.47.38z",
+          fill: "#3b82f6"
+        }
+      )
+    }
+  );
+}
+function BiometricIcon({ type, size = 80, animate = false }) {
+  const className = animate ? "volr:animate-pulse" : "";
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className, children: [
+    type === "faceId" && /* @__PURE__ */ jsxRuntime.jsx(FaceIdIcon, { size }),
+    type === "touchId" && /* @__PURE__ */ jsxRuntime.jsx(TouchIdIcon, { size }),
+    type === "fingerprint" && /* @__PURE__ */ jsxRuntime.jsx(FingerprintIcon, { size })
+  ] });
+}
+function PasskeyEnrollForm({
+  biometricType,
+  biometricMessage,
+  errorMessage,
+  accentColor,
+  onEnroll,
+  onLogout,
+  buttonText,
+  logoutText
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:my-8 volr:flex volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(BiometricIcon, { type: biometricType, size: 60 }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:text-slate-600 volr:mb-8", children: biometricMessage }),
+    errorMessage && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6 volr:p-3 volr:rounded-lg volr:bg-rose-50 volr:border volr:border-rose-200 volr:text-rose-700 volr:text-sm volr:flex volr:items-start volr:gap-2 volr:text-left", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", className: "volr:flex-shrink-0 volr:mt-0.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: errorMessage })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onEnroll,
+          className: "volr:w-full volr:py-3 volr:px-6 volr:rounded-lg volr:text-white volr:text-base volr:font-medium volr:transition-colors",
+          style: { backgroundColor: accentColor },
+          children: buttonText
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onLogout,
+          className: "volr:w-full volr:py-3 volr:text-sm volr:font-medium volr:text-slate-600 volr:rounded-lg volr:transition-colors hover:volr:bg-slate-50",
+          children: logoutText
+        }
+      )
+    ] })
+  ] });
+}
+function PasskeyEnrollLoading({
+  biometricType,
+  stepMessage,
+  isEnrolling,
+  accentColor,
+  onRetry,
+  onLogout,
+  buttonText,
+  logoutText,
+  progress = 0
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-8 volr:flex volr:justify-center volr:items-center volr:min-h-[120px]", children: /* @__PURE__ */ jsxRuntime.jsx(BiometricIcon, { type: biometricType, size: 60, animate: isEnrolling }) }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:text-slate-500 volr:mb-4", children: stepMessage }),
+    isEnrolling && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-full volr:mb-6", children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-full volr:h-2 volr:bg-slate-100 volr:rounded-full volr:overflow-hidden", children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "volr:h-full volr:rounded-full volr:transition-all volr:duration-500 volr:ease-out",
+        style: {
+          backgroundColor: accentColor,
+          width: `${progress}%`
+        }
+      }
+    ) }) }),
+    !isEnrolling && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3 volr:mt-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onRetry,
+          className: "volr:w-full volr:py-3 volr:px-6 volr:rounded-lg volr:text-white volr:text-base volr:font-medium volr:transition-colors",
+          style: { backgroundColor: accentColor },
+          children: buttonText
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "button",
+        {
+          onClick: onLogout,
+          className: "volr:w-full volr:py-3 volr:text-sm volr:font-medium volr:text-slate-600 volr:rounded-lg volr:transition-colors hover:volr:bg-slate-50",
+          children: logoutText
+        }
+      )
+    ] })
+  ] });
+}
+function PasskeyEnrollView({
+  onComplete,
+  onError,
+  onLogout,
+  onClose,
+  isOpen = true,
+  wrapInModal = true
+}) {
+  const { user, logout, setUser } = react.useVolr();
+  const { client } = react.useInternalAuth();
+  const { t } = useI18n();
+  const { accentColor } = useVolrUI();
+  const {
+    enroll,
+    step,
+    isEnrolling,
+    error: enrollmentError
+  } = react.usePasskeyEnrollment();
+  const [hasStarted, setHasStarted] = React3.useState(false);
+  const [errorMessage, setErrorMessage] = React3.useState(null);
+  const [isRefreshing, setIsRefreshing] = React3.useState(false);
+  const biometricType = getBiometricType();
+  const hasPasskey = user?.keyStorageType === "passkey";
+  React3.useEffect(() => {
+    console.log("[PasskeyEnrollView] User state:", {
+      user,
+      keyStorageType: user?.keyStorageType,
+      evmAddress: user?.evmAddress,
+      hasPasskey
+    });
+  }, [user, hasPasskey]);
+  React3.useEffect(() => {
+    if (hasPasskey && !user?.evmAddress && !isRefreshing) {
+      const refreshUserData = async () => {
+        try {
+          setIsRefreshing(true);
+          const response = await client.post(
+            "/auth/refresh",
+            {}
+          );
+          if (response.user) {
+            console.log(
+              "[PasskeyEnrollView] Updated user data:",
+              response.user
+            );
+            setUser({
+              ...user,
+              ...response.user
+            });
+          }
+        } catch (error) {
+          console.error(
+            "[PasskeyEnrollView] Failed to refresh user data:",
+            error
+          );
+        } finally {
+          setIsRefreshing(false);
+        }
+      };
+      refreshUserData();
+    }
+  }, [hasPasskey, user?.evmAddress, isRefreshing, client, setUser, user]);
+  React3.useEffect(() => {
+    if (!user?.id) {
+      const error = new Error("User ID is required for passkey enrollment");
+      setErrorMessage(getUserFriendlyError(error, t));
+      if (onError) {
+        onError(error);
+      }
+    }
+    if (!user?.email) {
+      const error = new Error("User email is required for passkey enrollment");
+      setErrorMessage(getUserFriendlyError(error, t));
+      if (onError) {
+        onError(error);
+      }
+    }
+  }, [user, onError, t]);
+  React3.useEffect(() => {
+    if (enrollmentError) {
+      const friendlyMessage = getUserFriendlyError(enrollmentError, t);
+      setErrorMessage(friendlyMessage);
+      if (onError) {
+        onError(enrollmentError);
+      }
+    }
+  }, [enrollmentError, onError, t]);
+  const handleEnroll = async () => {
+    if (!user?.id || !user?.email) {
+      const error = new Error(
+        "User ID and email are required for passkey enrollment"
+      );
+      setErrorMessage(getUserFriendlyError(error, t));
+      if (onError) {
+        onError(error);
+      }
+      return;
+    }
+    try {
+      setErrorMessage(null);
+      await enroll();
+      setHasStarted(false);
+      onComplete();
+    } catch (error) {
+      setHasStarted(false);
+    }
+  };
+  const handleLogout = async () => {
+    try {
+      await logout();
+      if (onLogout) {
+        onLogout();
+      }
+    } catch (error) {
+      if (onError) {
+        onError(error instanceof Error ? error : new Error("Logout failed"));
+      }
+    }
+  };
+  const getStepMessage = () => {
+    switch (step) {
+      case "creating":
+        return t("passkey.creating");
+      case "encrypting":
+        return t("passkey.encrypting");
+      case "uploading":
+        return t("passkey.uploading");
+      case "registering":
+        return t("passkey.registering");
+      default:
+        return "";
+    }
+  };
+  const getProgress = () => {
+    switch (step) {
+      case "creating":
+        return 25;
+      case "encrypting":
+        return 50;
+      case "uploading":
+        return 75;
+      case "registering":
+        return 90;
+      default:
+        return 0;
+    }
+  };
+  const getBiometricMessage = () => {
+    if (biometricType === "faceId") {
+      return t("passkey.faceId");
+    }
+    if (biometricType === "touchId") {
+      return t("passkey.touchId");
+    }
+    return t("passkey.fingerprint");
+  };
+  if (hasPasskey) {
+    const handleClose = () => {
+      if (onClose) {
+        onClose();
+      } else if (onComplete) {
+        onComplete();
+      }
+    };
+    const walletContent = /* @__PURE__ */ jsxRuntime.jsx(WalletConnectedView, { user });
+    if (!wrapInModal) {
+      return walletContent;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && handleClose(), children: walletContent });
+  }
+  const content = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { size: "xl", children: t("passkey.start") }),
+    !hasStarted ? /* @__PURE__ */ jsxRuntime.jsx(
+      PasskeyEnrollForm,
+      {
+        biometricType,
+        biometricMessage: getBiometricMessage(),
+        errorMessage,
+        accentColor,
+        onEnroll: () => {
+          setHasStarted(true);
+          handleEnroll();
+        },
+        onLogout: handleLogout,
+        buttonText: t("passkey.start"),
+        logoutText: t("passkey.logout")
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      PasskeyEnrollLoading,
+      {
+        biometricType,
+        stepMessage: getStepMessage(),
+        isEnrolling,
+        accentColor,
+        progress: getProgress(),
+        onRetry: handleEnroll,
+        onLogout: handleLogout,
+        buttonText: t("passkey.start"),
+        logoutText: t("passkey.logout")
+      }
+    )
+  ] });
+  if (!wrapInModal) {
+    return content;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: isOpen, onOpenChange: (open) => !open && onLogout?.(), children: content });
+}
+function MpcConnectView({
+  onComplete,
+  onError,
+  isOpen = true,
+  wrapInModal = true
+}) {
+  const {
+    connect,
+    step,
+    isConnecting,
+    error: connectionError
+  } = react.useMpcConnection();
+  const [errorMessage, setErrorMessage] = React3.useState(null);
+  React3.useEffect(() => {
+    if (connectionError) {
+      setErrorMessage(connectionError.message);
+      if (onError) {
+        onError(connectionError);
+      }
+    }
+  }, [connectionError, onError]);
+  React3.useEffect(() => {
+    handleConnect();
+  }, []);
+  const handleConnect = async () => {
+    try {
+      setErrorMessage(null);
+      await connect();
+      setTimeout(() => {
+        onComplete();
+      }, 1e3);
+    } catch (error) {
+    }
+  };
+  const getStepMessage = () => {
+    switch (step) {
+      case "connecting":
+        return "Establishing secure connection...";
+      case "registering":
+        return "Registering wallet provider...";
+      default:
+        return "";
+    }
+  };
+  const content = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:p-8 volr:max-w-md volr:mx-auto volr:text-center", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-2xl volr:font-bold volr:mb-6 volr:font-georama", children: "Connecting to MPC Provider" }),
+    errorMessage && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg volr:text-red-700 volr:text-sm volr:text-left", children: errorMessage }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-8 volr:flex volr:justify-center volr:items-center volr:min-h-[120px]", children: /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: `volr:text-8xl ${isConnecting ? "volr:animate-pulse" : ""}`,
+        children: "\u{1F512}"
+      }
+    ) }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:text-gray-500 volr:mb-6 volr:leading-relaxed volr:font-georama", children: getStepMessage() })
+  ] });
+  if (!wrapInModal) {
+    return content;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Modal,
+    {
+      open: isOpen,
+      onOpenChange: (open) => {
+        if (!open && !isConnecting && onError) {
+          onError(new Error("Connection cancelled"));
+        }
+      },
+      onPointerDownOutside: (e) => {
+        if (isConnecting) e.preventDefault();
+      },
+      onEscapeKeyDown: (e) => {
+        if (isConnecting) e.preventDefault();
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-md mx-auto", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { className: "sr-only", children: "MPC Connection" }),
+        content
+      ] })
+    }
+  );
+}
+function OptionButton({
+  icon,
+  title,
+  description,
+  onClick,
+  className,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      type: "button",
+      onClick,
+      className: cn(
+        "volr:group volr:flex volr:items-center volr:gap-3 volr:rounded-lg volr:border volr:border-slate-200 volr:bg-white volr:p-3 volr:transition-colors volr:focus-visible:outline-none volr:focus-visible:ring-2 volr:focus-visible:ring-slate-300 volr:hover:bg-slate-50",
+        className
+      ),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:flex volr:h-8 volr:w-8 volr:items-center volr:justify-center volr:text-slate-700", children: icon }),
+        /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:flex volr:min-w-0 volr:flex-col", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:truncate volr:text-left volr:text-sm volr:font-medium volr:text-slate-900", children: title }),
+          description ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:truncate volr:text-left volr:text-xs volr:text-slate-500", children: description }) : null
+        ] })
+      ]
+    }
+  );
+}
+function GoogleIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09z",
+        fill: "#4285F4"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23z",
+        fill: "#34A853"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M5.84 14.09c-.22-.66-.35-1.36-.35-2.09s.13-1.43.35-2.09V7.07H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.93l2.85-2.22.81-.62z",
+        fill: "#FBBC05"
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "path",
+      {
+        d: "M12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.07l3.66 2.84c.87-2.6 3.3-4.53 6.16-4.53z",
+        fill: "#EA4335"
+      }
+    )
+  ] });
+}
+function TwitterXIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      d: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z",
+      fill: "#000000"
+    }
+  ) });
+}
+function AppleIcon() {
+  return /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: /* @__PURE__ */ jsxRuntime.jsx(
+    "path",
+    {
+      d: "M18.71 19.5c-.83 1.24-1.71 2.45-3.05 2.47-1.34.03-1.77-.79-3.29-.79-1.53 0-2 .77-3.27.82-1.31.05-2.3-1.32-3.14-2.53C4.25 17 2.94 12.45 4.7 9.39c.87-1.52 2.43-2.48 4.12-2.51 1.28-.02 2.5.87 3.29.87.78 0 2.26-1.07 3.81-.91.65.03 2.47.26 3.64 1.98-.09.06-2.17 1.28-2.15 3.81.03 3.02 2.65 4.03 2.68 4.04-.03.07-.42 1.44-1.38 2.83M13 3.5c.73-.83 1.94-1.46 2.94-1.5.13 1.17-.34 2.35-1.04 3.19-.69.85-1.83 1.51-2.95 1.42-.15-1.15.41-2.35 1.05-3.11z",
+      fill: "#000000"
+    }
+  ) });
+}
+function SocialOption({
+  provider,
+  onClick
+}) {
+  const { t } = useI18n();
+  const icons = {
+    google: /* @__PURE__ */ jsxRuntime.jsx(GoogleIcon, {}),
+    twitter: /* @__PURE__ */ jsxRuntime.jsx(TwitterXIcon, {}),
+    apple: /* @__PURE__ */ jsxRuntime.jsx(AppleIcon, {})
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    OptionButton,
+    {
+      onClick,
+      icon: icons[provider],
+      title: t(`login.social.${provider}`)
+    }
+  );
+}
+function WalletIcon(props) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "svg",
+    {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg",
+      "aria-hidden": "true",
+      ...props,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M4 7.5C4 6.11929 5.11929 5 6.5 5H16.5C17.3284 5 18 5.67157 18 6.5C18 7.32843 17.3284 8 16.5 8H6.5C5.11929 8 4 6.88071 4 5.5V7.5Z",
+            stroke: "currentColor",
+            strokeWidth: "1.6",
+            strokeLinecap: "round"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          "rect",
+          {
+            x: "3.2",
+            y: "7.6",
+            width: "17.6",
+            height: "11.2",
+            rx: "2.4",
+            stroke: "currentColor",
+            strokeWidth: "1.6"
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "16.6", cy: "13.2", r: "1.2", fill: "currentColor" })
+      ]
+    }
+  );
+}
+function WalletOption({ onClick }) {
+  const { t } = useI18n();
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    OptionButton,
+    {
+      onClick,
+      icon: /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-700", children: /* @__PURE__ */ jsxRuntime.jsx(WalletIcon, {}) }),
+      title: t("login.wallet.label")
+    }
+  );
+}
+function PoweredBy() {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mt-8 volr:text-xs volr:text-slate-400 volr:text-center volr:flex volr:items-baseline volr:justify-center volr:gap-1", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("span", { children: "Powered by" }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "svg",
+      {
+        viewBox: "0 0 943 289",
+        fill: "none",
+        xmlns: "http://www.w3.org/2000/svg",
+        className: "volr:inline-block",
+        style: { height: "0.8em", width: "auto", verticalAlign: "baseline" },
+        "aria-label": "Volr",
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "path",
+          {
+            d: "M138.4 284L-0.00019535 0H87.1998L184.4 208L281.2 0H363.6L225.2 284H138.4ZM471.931 288.8C453.531 288.8 435.931 286.533 419.131 282C402.331 277.2 387.264 270.267 373.931 261.2C360.864 252.133 350.464 240.933 342.731 227.6C335.264 214.267 331.531 198.8 331.531 181.2C331.531 157.733 337.664 138 349.931 122C362.464 106 379.398 94 400.731 86C422.064 77.7333 445.798 73.6 471.931 73.6C498.064 73.6 521.664 77.7333 542.731 86C564.064 94 580.864 106 593.131 122C605.664 138 611.931 157.733 611.931 181.2C611.931 198.8 608.064 214.267 600.331 227.6C592.864 240.933 582.464 252.133 569.131 261.2C556.064 270.267 541.131 277.2 524.331 282C507.531 286.533 490.064 288.8 471.931 288.8ZM471.931 236C490.598 236 505.531 231.2 516.731 221.6C528.198 211.733 533.931 198.933 533.931 183.2V179.2C533.931 163.2 528.198 150.4 516.731 140.8C505.531 131.2 490.598 126.4 471.931 126.4C453.264 126.4 438.198 131.2 426.731 140.8C415.264 150.4 409.531 163.2 409.531 179.2V183.2C409.531 198.933 415.264 211.733 426.731 221.6C438.198 231.2 453.264 236 471.931 236ZM643.865 284V0H721.465V284H643.865ZM763.006 284V78.4H839.406V106.8C848.739 95.3333 860.473 86.9333 874.606 81.6C888.739 76.2667 903.406 73.6 918.606 73.6C921.539 73.6 925.006 73.7333 929.006 74C933.006 74.2667 937.406 74.8 942.206 75.6V135.2C935.006 134.4 926.873 133.733 917.806 133.2C909.006 132.667 900.073 132.8 891.006 133.6C881.939 134.4 873.539 136.4 865.806 139.6C858.339 142.533 852.206 147.333 847.406 154C842.873 160.667 840.606 169.733 840.606 181.2V284H763.006Z",
+            fill: "#303030"
+          }
+        )
+      }
+    )
+  ] });
+}
+function EmailInlineInput({ onSubmit, accentColor }) {
+  const { t } = useI18n();
+  const [email, setEmail] = React3.useState("");
+  const [error, setError] = React3.useState(null);
+  const [isLoading, setIsLoading] = React3.useState(false);
+  const handleSubmit = async (e) => {
+    e.preventDefault();
+    setError(null);
+    setIsLoading(true);
+    try {
+      await onSubmit(email);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to send code");
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("form", { onSubmit: handleSubmit, children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:absolute volr:left-3 volr:top-1/2 volr:-translate-y-1/2 volr:pointer-events-none", children: /* @__PURE__ */ jsxRuntime.jsxs(
+        "svg",
+        {
+          width: "20",
+          height: "20",
+          viewBox: "0 0 24 24",
+          fill: "none",
+          xmlns: "http://www.w3.org/2000/svg",
+          className: "volr:text-slate-400",
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "path",
+              {
+                d: "M3 8L10.89 13.26C11.2187 13.4793 11.6049 13.5963 12 13.5963C12.3951 13.5963 12.7813 13.4793 13.11 13.26L21 8",
+                stroke: "currentColor",
+                strokeWidth: "1.8",
+                strokeLinecap: "round",
+                strokeLinejoin: "round"
+              }
+            ),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "rect",
+              {
+                x: "3",
+                y: "6",
+                width: "18",
+                height: "12",
+                rx: "2.2",
+                stroke: "currentColor",
+                strokeWidth: "1.8"
+              }
+            )
+          ]
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "input",
+        {
+          type: "email",
+          value: email,
+          onChange: (e) => setEmail(e.target.value),
+          required: true,
+          placeholder: t("login.email.placeholder"),
+          className: "volr:w-full volr:pl-11 volr:pr-3 volr:py-3 volr:rounded-lg volr:border volr:border-slate-300 volr:text-base volr:outline-none focus:volr:ring-2 focus:volr:ring-slate-300 focus:volr:border-slate-400"
+        }
+      )
+    ] }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mt-2 volr:rounded-lg volr:border volr:bg-rose-50 volr:border-rose-200 volr:text-rose-800 volr:text-sm volr:p-3", children: error }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "submit",
+        disabled: isLoading || !email,
+        className: "volr:w-full volr:mt-3 volr:px-6 volr:py-3 volr:rounded-lg volr:text-white volr:text-base volr:font-medium volr:transition disabled:volr:cursor-not-allowed",
+        style: { backgroundColor: isLoading || !email ? "#cbd5e1" : accentColor },
+        children: isLoading ? t("common.loading") : t("login.email.sendCode")
+      }
+    )
+  ] });
+}
+function Divider({ text = "\uB610\uB294" }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-3 volr:my-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex-1 volr:h-px volr:bg-slate-200" }),
+    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-400", children: text }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex-1 volr:h-px volr:bg-slate-200" })
+  ] });
+}
+function BrandingPanel({ config }) {
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { backgroundColor: config.backgroundColor }, children: config.component });
+}
+function SigninSelectScreen({
+  onSelectMethod,
+  onEmailSubmit,
+  branding,
+  onClose
+}) {
+  const { t } = useI18n();
+  const {
+    accentColor,
+    enabledLoginMethods = ["email", "social", "siwe"],
+    socialProviders = ["google", "twitter", "apple"]
+  } = useVolrUI();
+  const isWide = useMediaQuery("(min-width: 896px)");
+  const showBrandingColumn = Boolean(branding) && isWide;
+  const isEmailEnabled = enabledLoginMethods.includes("email");
+  const isSocialEnabled = enabledLoginMethods.includes("social");
+  const isSiweEnabled = enabledLoginMethods.includes("siwe");
+  const hasEmailAndOthers = isEmailEnabled && (isSocialEnabled || isSiweEnabled);
+  const hasOnlySocialAndWallet = !isEmailEnabled && isSocialEnabled && isSiweEnabled;
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: showBrandingColumn ? "volr:max-w-4xl volr:w-full volr:mx-auto volr:grid volr:grid-cols-[minmax(0,1.1fr)_minmax(0,1fr)] volr:gap-4" : "volr:max-w-md volr:w-full volr:mx-auto",
+      children: [
+        showBrandingColumn && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex", children: /* @__PURE__ */ jsxRuntime.jsx(BrandingPanel, { config: branding }) }),
+        /* @__PURE__ */ jsxRuntime.jsxs(
+          "div",
+          {
+            className: `volr:flex volr:flex-col volr:gap-4 ${showBrandingColumn ? "volr:p-4" : ""}`,
+            children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { onClose }),
+              /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { size: "2xl", children: t("login.title") }),
+              isEmailEnabled && /* @__PURE__ */ jsxRuntime.jsx(
+                EmailInlineInput,
+                {
+                  onSubmit: onEmailSubmit,
+                  accentColor
+                }
+              ),
+              hasEmailAndOthers && /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:gap-3", children: [
+                isSocialEnabled && socialProviders.map((provider) => /* @__PURE__ */ jsxRuntime.jsx(
+                  SocialOption,
+                  {
+                    provider,
+                    onClick: () => onSelectMethod(provider)
+                  },
+                  provider
+                )),
+                hasOnlySocialAndWallet && /* @__PURE__ */ jsxRuntime.jsx(Divider, {}),
+                isSiweEnabled && /* @__PURE__ */ jsxRuntime.jsx(WalletOption, { onClick: () => onSelectMethod("siwe") })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx(PoweredBy, {})
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+function CodeInputScreen({ email, onSubmit, onResend }) {
+  const { t } = useI18n();
+  const { accentColor } = useVolrUI();
+  const [digits, setDigits] = React3.useState(Array(6).fill(""));
+  const [error, setError] = React3.useState(null);
+  const [isLoading, setIsLoading] = React3.useState(false);
+  const inputRefs = React3.useRef([]);
+  React3.useEffect(() => {
+    inputRefs.current[0]?.focus();
+  }, []);
+  React3.useEffect(() => {
+    const code = digits.join("");
+    if (code.length === 6 && !isLoading) {
+      handleSubmit(code);
+    }
+  }, [digits]);
+  const handleSubmit = async (code) => {
+    if (code.length !== 6) return;
+    setError(null);
+    setIsLoading(true);
+    try {
+      await onSubmit(code);
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Invalid code");
+      setDigits(Array(6).fill(""));
+      inputRefs.current[0]?.focus();
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const handleChange = (index, value) => {
+    if (!/^\d*$/.test(value)) return;
+    const newDigits = [...digits];
+    newDigits[index] = value.slice(-1);
+    setDigits(newDigits);
+    if (value && index < 5) {
+      inputRefs.current[index + 1]?.focus();
+    }
+  };
+  const handleKeyDown = (index, e) => {
+    if (e.key === "Backspace") {
+      if (!digits[index] && index > 0) {
+        inputRefs.current[index - 1]?.focus();
+      } else {
+        const newDigits = [...digits];
+        newDigits[index] = "";
+        setDigits(newDigits);
+      }
+    } else if (e.key === "ArrowLeft" && index > 0) {
+      inputRefs.current[index - 1]?.focus();
+    } else if (e.key === "ArrowRight" && index < 5) {
+      inputRefs.current[index + 1]?.focus();
+    }
+  };
+  const handlePaste = (e) => {
+    e.preventDefault();
+    const pastedData = e.clipboardData.getData("text").replace(/\D/g, "").slice(0, 6);
+    const newDigits = pastedData.split("").concat(Array(6).fill("")).slice(0, 6);
+    setDigits(newDigits);
+    const lastIndex = Math.min(pastedData.length, 5);
+    inputRefs.current[lastIndex]?.focus();
+  };
+  const handleResend = async () => {
+    setError(null);
+    try {
+      await onResend();
+    } catch (err) {
+      setError(err instanceof Error ? err.message : "Failed to resend code");
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { size: "3xl", spacing: "tight", children: t("login.email.verifyTitle") }),
+    /* @__PURE__ */ jsxRuntime.jsxs("p", { className: "volr:text-sm volr:text-slate-500 volr:mb-8", children: [
+      t("login.email.verifyDescription"),
+      " ",
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:font-medium volr:text-slate-700", children: email })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:gap-3 volr:mb-6 volr:justify-center", children: digits.map((digit, index) => /* @__PURE__ */ jsxRuntime.jsx(
+      "input",
+      {
+        ref: (el) => inputRefs.current[index] = el,
+        type: "text",
+        inputMode: "numeric",
+        maxLength: 1,
+        value: digit,
+        onChange: (e) => handleChange(index, e.target.value),
+        onKeyDown: (e) => handleKeyDown(index, e),
+        onPaste: index === 0 ? handlePaste : void 0,
+        disabled: isLoading,
+        className: "volr:w-12 volr:h-14 volr:text-center volr:text-2xl volr:font-semibold volr:rounded-lg volr:border-2 volr:border-slate-300 volr:outline-none volr:transition-all disabled:volr:bg-slate-50 disabled:volr:cursor-not-allowed",
+        style: {
+          borderColor: digit ? accentColor : void 0
+        },
+        onFocus: (e) => {
+          e.target.style.borderColor = accentColor;
+          e.target.style.boxShadow = `0 0 0 3px ${accentColor}20`;
+        },
+        onBlur: (e) => {
+          if (!digit) {
+            e.target.style.borderColor = "#cbd5e1";
+          }
+          e.target.style.boxShadow = "none";
+        }
+      },
+      index
+    )) }),
+    error && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-6 volr:p-3 volr:rounded-lg volr:bg-rose-50 volr:border volr:border-rose-200 volr:text-rose-700 volr:text-sm volr:flex volr:items-start volr:gap-2", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "16", height: "16", viewBox: "0 0 24 24", fill: "currentColor", className: "volr:flex-shrink-0 volr:mt-0.5", children: /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z" }) }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { children: error })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        type: "button",
+        onClick: handleResend,
+        disabled: isLoading,
+        className: "volr:w-full volr:py-3 volr:text-sm volr:font-medium volr:rounded-lg volr:transition-colors disabled:volr:opacity-50 disabled:volr:cursor-not-allowed hover:volr:bg-slate-50",
+        style: { color: accentColor },
+        children: t("login.email.resend")
+      }
+    )
+  ] });
+}
+function SiweLoginScreen({
+  isOpen = true,
+  wrapInModal = true,
+  onSuccess,
+  onBack,
+  onError,
+  onClose
+}) {
+  const { t } = useI18n();
+  const { accentColor } = useVolrUI();
+  const { requestSiweNonce, verifySiweSignature } = react.useVolrLogin();
+  const [isLoading, setIsLoading] = React3.useState(false);
+  const [step, setStep] = React3.useState("connect");
+  const [account, setAccount] = React3.useState(null);
+  const [error, setError] = React3.useState(null);
+  const [walletConnector, setWalletConnector] = React3.useState(
+    void 0
+  );
+  const detectWalletConnector = () => {
+    if (typeof window === "undefined" || !window.ethereum) {
+      return void 0;
+    }
+    const provider = window.ethereum;
+    console.log(provider.info);
+    if (provider.info?.rdns) {
+      return provider.info.rdns;
+    }
+    if (provider.isMetaMask) return "io.metamask";
+    if (provider.isCoinbaseWallet) return "com.coinbase.wallet";
+    if (provider.isRabby) return "io.rabby";
+    if (provider.isZerion) return "io.zerion";
+    if (provider.isBraveWallet) return "com.brave.wallet";
+    return "unknown";
+  };
+  React3.useEffect(() => {
+    if (typeof window !== "undefined" && window.ethereum) {
+      window.ethereum.request({ method: "eth_accounts" }).then((accounts) => {
+        if (accounts.length > 0) {
+          setAccount(accounts[0]);
+          setStep("sign");
+          setWalletConnector(detectWalletConnector());
+        }
+      }).catch(() => {
+      });
+    }
+  }, []);
+  const handleConnectWallet = async () => {
+    setError(null);
+    setIsLoading(true);
+    try {
+      if (typeof window === "undefined" || !window.ethereum) {
+        throw new Error(
+          "No Ethereum wallet found. Please install MetaMask or another wallet."
+        );
+      }
+      const accounts = await window.ethereum.request({
+        method: "eth_requestAccounts"
+      });
+      if (accounts.length === 0) {
+        throw new Error("No accounts found");
+      }
+      setAccount(accounts[0]);
+      setStep("sign");
+      setWalletConnector(detectWalletConnector());
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to connect wallet";
+      setError(errorMessage);
+      onError(err instanceof Error ? err : new Error(errorMessage));
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const handleSign = async () => {
+    if (!account) return;
+    setError(null);
+    setIsLoading(true);
+    try {
+      const chainIdHex = await window.ethereum.request({
+        method: "eth_chainId"
+      });
+      const chainId = parseInt(chainIdHex, 16);
+      const nonce = await requestSiweNonce();
+      const domain = typeof window !== "undefined" ? window.location.host : "localhost";
+      const origin = typeof window !== "undefined" ? window.location.origin : "http://localhost";
+      const statement = "Sign in with Ethereum to continue";
+      const issuedAt = (/* @__PURE__ */ new Date()).toISOString();
+      const message = `${domain} wants you to sign in with your Ethereum account:
+${account}
+
+${statement}
+
+URI: ${origin}
+Version: 1
+Chain ID: ${chainId}
+Nonce: ${nonce}
+Issued At: ${issuedAt}`;
+      const signature = await window.ethereum.request({
+        method: "personal_sign",
+        params: [message, account]
+      });
+      const result = await verifySiweSignature(message, signature, {
+        walletConnector,
+        chainId
+      });
+      onSuccess({
+        userId: result.userId,
+        isNewUser: result.isNewUser,
+        keyStorageType: result.keyStorageType,
+        signerType: result.signerType || null
+      });
+    } catch (err) {
+      const errorMessage = err instanceof Error ? err.message : "Failed to sign message";
+      setError(errorMessage);
+      onError(err instanceof Error ? err : new Error(errorMessage));
+    } finally {
+      setIsLoading(false);
+    }
+  };
+  const content = /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:max-w-md volr:mx-auto", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "button",
+      {
+        onClick: onBack,
+        className: "volr:flex volr:items-center volr:gap-1 volr:p-1 volr:border-none volr:bg-transparent volr:cursor-pointer volr:text-sm volr:text-gray-500 volr:mb-4 volr:rounded-lg hover:volr:bg-slate-100 volr:transition-colors",
+        children: [
+          "\u2190 ",
+          t("common.back")
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { children: t("login.wallet.title") }),
+    account && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:p-3 volr:bg-gray-100 volr:rounded-lg volr:mb-6", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-gray-500 volr:mb-1", children: t("login.wallet.connected") }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-sm volr:font-medium volr:text-gray-900 volr:font-mono", children: [
+        account.slice(0, 6),
+        "...",
+        account.slice(-4)
+      ] })
+    ] }),
+    error && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:mb-4 volr:p-3 volr:bg-red-50 volr:border volr:border-red-200 volr:rounded-lg volr:text-red-700 volr:text-sm", children: error }),
+    step === "connect" ? /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: handleConnectWallet,
+        disabled: isLoading,
+        className: `volr:w-full volr:py-3 volr:px-6 volr:text-white volr:border-none volr:rounded-lg volr:text-base volr:font-medium volr:transition-all volr:duration-200 ${isLoading ? "volr:bg-gray-400 volr:cursor-not-allowed" : "volr:cursor-pointer"}`,
+        style: {
+          backgroundColor: isLoading ? void 0 : accentColor
+        },
+        children: isLoading ? t("common.loading") : t("login.wallet.connect")
+      }
+    ) : /* @__PURE__ */ jsxRuntime.jsx(
+      "button",
+      {
+        onClick: handleSign,
+        disabled: isLoading,
+        className: `volr:w-full volr:py-3 volr:px-6 volr:text-white volr:border-none volr:rounded-lg volr:text-base volr:font-medium volr:transition-all volr:duration-200 ${isLoading ? "volr:bg-gray-400 volr:cursor-not-allowed" : "volr:cursor-pointer"}`,
+        style: {
+          backgroundColor: isLoading ? void 0 : accentColor
+        },
+        children: isLoading ? t("common.loading") : t("login.wallet.sign")
+      }
+    )
+  ] });
+  if (!wrapInModal) {
+    return content;
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    Modal,
+    {
+      open: isOpen,
+      onOpenChange: (open) => !open && (onClose?.() || onBack?.()),
+      children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-md mx-auto", children: [
+        /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { className: "sr-only", children: t("login.wallet.title") }),
+        content
+      ] })
+    }
+  );
+}
+function LoginSuccessScreen({
+  onClose,
+  delay = 1500
+}) {
+  const { t } = useI18n();
+  const { accentColor } = useVolrUI();
+  React3.useEffect(() => {
+    const timer = setTimeout(() => {
+      onClose();
+    }, delay);
+    return () => {
+      clearTimeout(timer);
+    };
+  }, [onClose, delay]);
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:flex-col volr:items-center volr:justify-center volr:py-12 volr:px-4", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative volr:mb-8", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:inset-0 volr:rounded-full volr:blur-2xl volr:opacity-30",
+          style: {
+            backgroundColor: accentColor,
+            animation: "volr-pulse 2s ease-in-out infinite"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:relative volr:w-24 volr:h-24 volr:rounded-full volr:flex volr:items-center volr:justify-center volr:shadow-lg",
+          style: {
+            backgroundColor: accentColor + "c0",
+            animation: "volr-scale-in 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards"
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              width: "48",
+              height: "48",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              xmlns: "http://www.w3.org/2000/svg",
+              style: {
+                animation: "volr-fade-in 0.3s ease-out 0.3s both"
+              },
+              children: /* @__PURE__ */ jsxRuntime.jsx(
+                "path",
+                {
+                  d: "M5 13L9 17L19 7",
+                  stroke: "white",
+                  strokeWidth: "2.5",
+                  strokeLinecap: "round",
+                  strokeLinejoin: "round",
+                  style: {
+                    strokeDasharray: "24",
+                    strokeDashoffset: "24",
+                    animation: "volr-check-draw 0.4s ease-out 0.3s forwards"
+                  }
+                }
+              )
+            }
+          )
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs(
+      "div",
+      {
+        className: "volr:text-center volr:space-y-2",
+        style: {
+          animation: "volr-fade-in-up 0.5s ease-out 0.5s both"
+        },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { size: "2xl", spacing: "tight", children: t("success.title") }),
+          /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-base volr:text-slate-600", children: t("success.message") || "You're all set. Redirecting..." })
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+          @keyframes volr-scale-in {
+            0% {
+              transform: scale(0);
+              opacity: 0;
+            }
+            100% {
+              transform: scale(1);
+              opacity: 1;
+            }
+          }
+
+          @keyframes volr-check-draw {
+            0% {
+              stroke-dashoffset: 24;
+            }
+            100% {
+              stroke-dashoffset: 0;
+            }
+          }
+
+          @keyframes volr-fade-in {
+            0% {
+              opacity: 0;
+            }
+            100% {
+              opacity: 1;
+            }
+          }
+
+          @keyframes volr-fade-in-up {
+            0% {
+              opacity: 0;
+              transform: translateY(10px);
+            }
+            100% {
+              opacity: 1;
+              transform: translateY(0);
+            }
+          }
+
+          @keyframes volr-pulse {
+            0%, 100% {
+              transform: scale(1);
+              opacity: 0.3;
+            }
+            50% {
+              transform: scale(1.1);
+              opacity: 0.2;
+            }
+          }
+        ` })
+  ] });
+}
+function SigninModal({ isOpen, onClose, onError }) {
+  const { config, logout, user } = react.useVolr();
+  const { appName, branding } = useVolrUI();
+  const { requestEmailCode, verifyEmailCode } = react.useVolrLogin();
+  const [currentScreen, setCurrentScreen] = React3.useState("method-select");
+  const [email, setEmail] = React3.useState("");
+  const hasPasskey = user?.keyStorageType === "passkey";
+  const isMobile = useMediaQuery("(max-width: 500px)");
+  const isWideViewport = useMediaQuery("(min-width: 864px)");
+  const shouldUseWideLayout = !isMobile && isWideViewport && Boolean(branding) && currentScreen === "method-select";
+  React3.useEffect(() => {
+    if (!isOpen) {
+      setCurrentScreen("method-select");
+      setEmail("");
+    }
+  }, [isOpen]);
+  if (!isOpen) {
+    return null;
+  }
+  const handleSelectMethod = (method) => {
+    if (method === "siwe") {
+      setCurrentScreen("siwe-login");
+    } else {
+      handleSocialLogin(method);
+    }
+  };
+  const handleSocialLogin = (provider) => {
+    const baseUrl = config.apiBaseUrl.replace(/\/+$/, "");
+    const projectApiKey = config.projectApiKey;
+    window.location.href = `${baseUrl}/auth/${provider}?projectApiKey=${encodeURIComponent(
+      projectApiKey
+    )}`;
+  };
+  const handleEmailSubmit = async (emailValue) => {
+    setEmail(emailValue);
+    await requestEmailCode(emailValue);
+    setCurrentScreen("code-input");
+  };
+  const handleCodeSubmit = async (code) => {
+    const result = await verifyEmailCode(email, code);
+    if (result.keyStorageType) {
+      setCurrentScreen("success");
+      return;
+    }
+    if (result.isNewUser) {
+      setCurrentScreen("passkey-setup");
+    } else {
+      setCurrentScreen("success");
+    }
+  };
+  const handleSiweSuccess = (data) => {
+    if (data.keyStorageType) {
+      setCurrentScreen("success");
+      return;
+    }
+    setCurrentScreen("passkey-setup");
+  };
+  const handlePasskeyComplete = () => {
+    setCurrentScreen("success");
+  };
+  const handlePasskeyError = (error) => {
+    if (onError) {
+      onError(error);
+    }
+  };
+  const handleLogout = async () => {
+    try {
+      await logout();
+      setCurrentScreen("method-select");
+      setEmail("");
+      onClose();
+    } catch (error) {
+      if (onError) {
+        onError(error instanceof Error ? error : new Error("Logout failed"));
+      }
+    }
+  };
+  const handleSuccessClose = () => {
+    setCurrentScreen("method-select");
+    setEmail("");
+    onClose();
+  };
+  const handleBackdropClick = (_e) => {
+    if (currentScreen !== "passkey-setup" || hasPasskey) {
+      setCurrentScreen("method-select");
+      setEmail("");
+      onClose();
+    }
+  };
+  const handleModalClose = () => {
+    onClose();
+  };
+  const renderCurrentScreen = () => {
+    switch (currentScreen) {
+      case "method-select":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          SigninSelectScreen,
+          {
+            onClose,
+            onSelectMethod: handleSelectMethod,
+            onEmailSubmit: handleEmailSubmit,
+            appName,
+            branding: shouldUseWideLayout ? branding : void 0
+          },
+          "method-select"
+        );
+      case "code-input":
+        return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            ModalHeader,
+            {
+              back: true,
+              onBack: () => setCurrentScreen("method-select"),
+              onClose
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsx(
+            CodeInputScreen,
+            {
+              email,
+              onSubmit: handleCodeSubmit,
+              onBack: () => setCurrentScreen("method-select"),
+              onResend: () => requestEmailCode(email)
+            },
+            "code-input"
+          )
+        ] });
+      case "siwe-login":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          SiweLoginScreen,
+          {
+            wrapInModal: false,
+            onSuccess: handleSiweSuccess,
+            onBack: () => setCurrentScreen("method-select"),
+            onError: handlePasskeyError
+          },
+          "siwe-login"
+        );
+      case "passkey-setup":
+        return /* @__PURE__ */ jsxRuntime.jsx(
+          PasskeyEnrollView,
+          {
+            wrapInModal: false,
+            onComplete: handlePasskeyComplete,
+            onError: handlePasskeyError,
+            onLogout: handleLogout,
+            onClose: handleSuccessClose
+          },
+          "passkey-setup"
+        );
+      case "success":
+        return /* @__PURE__ */ jsxRuntime.jsx(LoginSuccessScreen, { onClose: handleSuccessClose }, "success");
+      default:
+        return null;
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    Modal,
+    {
+      open: isOpen,
+      onOpenChange: (open) => !open && handleModalClose(),
+      onPointerDownOutside: (e) => {
+        handleBackdropClick();
+      },
+      onEscapeKeyDown: (e) => {
+        if (currentScreen === "passkey-setup" && !hasPasskey) {
+          e.preventDefault();
+        }
+      },
+      contentClassName: isMobile ? "volr:max-w-none" : shouldUseWideLayout ? "volr:max-w-4xl volr:w-full volr:p-3" : void 0,
+      children: [
+        renderCurrentScreen(),
+        /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+          @keyframes spin {
+            from {
+              transform: rotate(0deg);
+            }
+            to {
+              transform: rotate(360deg);
+            }
+          }
+        ` })
+      ]
+    }
+  );
+}
+function AssetSelectView({
+  assets,
+  onSelect
+}) {
+  const { t } = useI18n();
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:px-6 volr:pb-6", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("h2", { className: "volr:text-2xl volr:font-bold volr:text-slate-900 volr:mb-2 volr:text-center", children: t("deposit.selectTitle") }),
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-500 volr:mb-8 volr:text-center", children: "Supported token" }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:space-y-3", children: assets.map((a, idx) => {
+      const isNative = a.token === "native";
+      const tokenSymbol = isNative ? "ETH" : a.token.symbol;
+      const tokenName = isNative ? "Ethereum" : a.token.symbol;
+      return /* @__PURE__ */ jsxRuntime.jsxs(
+        "button",
+        {
+          className: cn(
+            "volr:w-full volr:p-4 volr:rounded-xl volr:border-2 volr:border-slate-200",
+            "volr:text-left volr:transition-all",
+            "hover:volr:border-slate-300 hover:volr:bg-slate-50 hover:volr:shadow-sm",
+            "volr:flex volr:items-center volr:gap-4"
+          ),
+          onClick: () => onSelect(idx),
+          children: [
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex-shrink-0", children: !isNative && a.token.iconUrl ? /* @__PURE__ */ jsxRuntime.jsx(
+              "img",
+              {
+                alt: a.token.symbol,
+                src: a.token.iconUrl,
+                className: "volr:w-10 volr:h-10 volr:rounded-full volr:border volr:border-slate-200"
+              }
+            ) : /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-10 volr:h-10 volr:rounded-full volr:bg-gradient-to-br volr:from-blue-500 volr:to-purple-600 volr:flex volr:items-center volr:justify-center volr:text-white volr:font-bold volr:text-sm", children: tokenSymbol.slice(0, 2) }) }),
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:gap-2 volr:mb-1", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-base volr:font-semibold volr:text-slate-900", children: tokenSymbol }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr:px-2 volr:py-0.5 volr:rounded-full volr:bg-slate-100 volr:text-slate-600 volr:font-medium", children: [
+                  "Chain ",
+                  a.chainId
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-sm volr:text-slate-500", children: tokenName }),
+              !isNative && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-slate-400 volr:font-mono volr:truncate volr:mt-1", children: a.token.address })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex-shrink-0 volr:text-slate-400", children: /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "9 18 15 12 9 6" }) }) })
+          ]
+        },
+        `${a.chainId}-${idx}`
+      );
+    }) })
+  ] });
+}
+var CopyButton = ({ text, className, onCopy }) => {
+  const [copied, setCopied] = React3.useState(false);
+  const handleCopy = async () => {
+    try {
+      await navigator.clipboard.writeText(text);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2e3);
+      onCopy?.();
+    } catch (error) {
+      console.error("Copy failed:", error);
+    }
+  };
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "button",
+    {
+      onClick: handleCopy,
+      className: cn(
+        "volr:p-2 volr:rounded-lg volr:text-slate-400 hover:volr:text-slate-700 hover:volr:bg-white volr:transition-all",
+        className
+      ),
+      "aria-label": "Copy",
+      children: copied ? /* @__PURE__ */ jsxRuntime.jsx("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2.5", children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" }) }) : /* @__PURE__ */ jsxRuntime.jsxs("svg", { width: "18", height: "18", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
+        /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1" })
+      ] })
+    }
+  );
+};
+var TextLinkButton = React3__default.default.forwardRef(({ showArrow = false, className, children, ...props }, ref) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "button",
+    {
+      ref,
+      type: "button",
+      className: cn(
+        "volr:text-slate-600 hover:volr:text-slate-900 volr:underline volr:transition-colors",
+        className
+      ),
+      ...props,
+      children: [
+        children,
+        showArrow && " \u2192"
+      ]
+    }
+  );
+});
+TextLinkButton.displayName = "TextLinkButton";
+var OtherTokenModal = ({
+  open,
+  onOpenChange
+}) => {
+  return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(ModalHeader, { onClose: () => onOpenChange(false) }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:px-6 volr:pb-6 volr:text-center", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { className: "volr:mb-4", children: "Coming Soon" }),
+      /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: "Swap and bridge recommendations will be available here soon." })
+    ] })
+  ] });
+};
+var DepositQRStatusOverlay = ({
+  status
+}) => {
+  if (status !== "detected") return null;
+  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "volr:absolute volr:inset-0 volr:rounded-2xl volr:pointer-events-none",
+        style: {
+          boxShadow: "0 0 0 4px rgba(16, 185, 129, 0.3), 0 0 30px rgba(16, 185, 129, 0.4)",
+          animation: "volrPulseGlow 1.5s ease-out infinite"
+        }
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:absolute volr:inset-0 volr:overflow-visible volr:pointer-events-none volr:-z-10", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-48 volr:h-48 volr:rounded-full volr:opacity-0",
+          style: {
+            background: "radial-gradient(circle, rgba(16,185,129,0.7) 0%, rgba(16,185,129,0) 60%)",
+            filter: "blur(50px)",
+            top: "5%",
+            left: "0%",
+            animation: "volrGlowPulse 1.8s ease-out forwards"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-44 volr:h-44 volr:rounded-full volr:opacity-0",
+          style: {
+            background: "radial-gradient(circle, rgba(6,182,212,0.65) 0%, rgba(6,182,212,0) 60%)",
+            filter: "blur(45px)",
+            bottom: "10%",
+            right: "-5%",
+            animation: "volrGlowPulse 2s ease-out 0.1s forwards"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-40 volr:h-40 volr:rounded-full volr:opacity-0",
+          style: {
+            background: "radial-gradient(circle, rgba(20,184,166,0.6) 0%, rgba(20,184,166,0) 60%)",
+            filter: "blur(40px)",
+            top: "50%",
+            left: "50%",
+            transform: "translateX(-50%)",
+            animation: "volrGlowPulse 2.2s ease-out 0.2s forwards"
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      "div",
+      {
+        className: "volr:absolute volr:-top-3 volr:-right-3 volr:rounded-full volr:p-3 volr:bg-gradient-to-br volr:from-emerald-400 volr:to-teal-500 volr:shadow-2xl volr:shadow-emerald-500/50 volr:border-4 volr:border-white volr:z-20",
+        style: {
+          animation: "volrBounceIn 0.5s cubic-bezier(0.68, -0.55, 0.265, 1.55) forwards"
+        },
+        children: /* @__PURE__ */ jsxRuntime.jsx(
+          "svg",
+          {
+            width: "20",
+            height: "20",
+            viewBox: "0 0 24 24",
+            fill: "none",
+            stroke: "white",
+            strokeWidth: "3",
+            strokeLinecap: "round",
+            strokeLinejoin: "round",
+            children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
+          }
+        )
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:absolute volr:inset-0 volr:pointer-events-none volr:overflow-visible", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-2 volr:h-2 volr:bg-emerald-400 volr:rounded-full volr:opacity-0",
+          style: {
+            top: "20%",
+            left: "20%",
+            animation: "volrParticle1 1s ease-out forwards"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-1.5 volr:h-1.5 volr:bg-cyan-400 volr:rounded-full volr:opacity-0",
+          style: {
+            top: "30%",
+            right: "25%",
+            animation: "volrParticle2 1.2s ease-out 0.1s forwards"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-2 volr:h-2 volr:bg-teal-400 volr:rounded-full volr:opacity-0",
+          style: {
+            bottom: "25%",
+            left: "30%",
+            animation: "volrParticle3 1.1s ease-out 0.2s forwards"
+          }
+        }
+      ),
+      /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          className: "volr:absolute volr:w-1.5 volr:h-1.5 volr:bg-emerald-300 volr:rounded-full volr:opacity-0",
+          style: {
+            bottom: "30%",
+            right: "20%",
+            animation: "volrParticle4 1.3s ease-out 0.15s forwards"
+          }
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+        @keyframes volrGlowPulse {
+          0% {
+            transform: scale(0.5);
+            opacity: 0;
+          }
+          40% {
+            opacity: 1;
+          }
+          100% {
+            transform: scale(1.6);
+            opacity: 0;
+          }
+        }
+        @keyframes volrBounceIn {
+          0% {
+            transform: scale(0);
+            opacity: 0;
+          }
+          50% {
+            transform: scale(1.2);
+          }
+          70% {
+            transform: scale(0.9);
+          }
+          100% {
+            transform: scale(1);
+            opacity: 1;
+          }
+        }
+        @keyframes volrPulseGlow {
+          0%, 100% {
+            opacity: 0.6;
+          }
+          50% {
+            opacity: 1;
+          }
+        }
+        @keyframes volrParticle1 {
+          0% {
+            transform: translate(0, 0) scale(0);
+            opacity: 0;
+          }
+          20% {
+            opacity: 1;
+          }
+          100% {
+            transform: translate(-20px, -30px) scale(1);
+            opacity: 0;
+          }
+        }
+        @keyframes volrParticle2 {
+          0% {
+            transform: translate(0, 0) scale(0);
+            opacity: 0;
+          }
+          20% {
+            opacity: 1;
+          }
+          100% {
+            transform: translate(25px, -35px) scale(1);
+            opacity: 0;
+          }
+        }
+        @keyframes volrParticle3 {
+          0% {
+            transform: translate(0, 0) scale(0);
+            opacity: 0;
+          }
+          20% {
+            opacity: 1;
+          }
+          100% {
+            transform: translate(-30px, 25px) scale(1);
+            opacity: 0;
+          }
+        }
+        @keyframes volrParticle4 {
+          0% {
+            transform: translate(0, 0) scale(0);
+            opacity: 0;
+          }
+          20% {
+            opacity: 1;
+          }
+          100% {
+            transform: translate(30px, 30px) scale(1);
+            opacity: 0;
+          }
+        }
+      ` })
+  ] });
+};
+var DepositCompletedToast = ({
+  onClose,
+  previousBalance,
+  newBalance,
+  delta,
+  decimals,
+  symbol
+}) => {
+  const { t } = useI18n();
+  const [expanded, setExpanded] = React3.useState(false);
+  const formatAmount = (amount) => {
+    const divisor = BigInt(10 ** decimals);
+    const whole = amount / divisor;
+    const fraction = amount % divisor;
+    const fractionStr = fraction.toString().padStart(decimals, "0").slice(0, 4);
+    return `${whole}.${fractionStr}`;
+  };
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "div",
+    {
+      className: cn(
+        "volr:absolute volr:bottom-0 volr:left-0 volr:right-0",
+        "volr:bg-white volr:border-t volr:border-slate-200 volr:shadow-lg",
+        "volr:transition-all volr:duration-300 volr:ease-out",
+        expanded ? "volr:max-h-96" : "volr:max-h-24"
+      ),
+      style: {
+        animation: "volrSlideUp 0.3s ease-out"
+      },
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:p-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:gap-3", children: [
+          /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex-shrink-0 volr:w-10 volr:h-10 volr:rounded-full volr:bg-gradient-to-br volr:from-emerald-500 volr:to-teal-500 volr:flex volr:items-center volr:justify-center", children: /* @__PURE__ */ jsxRuntime.jsx(
+            "svg",
+            {
+              width: "20",
+              height: "20",
+              viewBox: "0 0 24 24",
+              fill: "none",
+              stroke: "white",
+              strokeWidth: "2.5",
+              strokeLinecap: "round",
+              strokeLinejoin: "round",
+              children: /* @__PURE__ */ jsxRuntime.jsx("polyline", { points: "20 6 9 17 4 12" })
+            }
+          ) }),
+          /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex-1 volr:min-w-0", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-start volr:justify-between volr:gap-2 volr:mb-1", children: [
+              /* @__PURE__ */ jsxRuntime.jsx("h3", { className: "volr:text-sm volr:font-semibold volr:text-slate-900", children: t("deposit.completed") }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                "button",
+                {
+                  onClick: onClose,
+                  className: "volr:flex-shrink-0 volr:text-slate-400 hover:volr:text-slate-600 volr:transition-colors",
+                  "aria-label": "Close",
+                  children: /* @__PURE__ */ jsxRuntime.jsxs(
+                    "svg",
+                    {
+                      width: "16",
+                      height: "16",
+                      viewBox: "0 0 24 24",
+                      fill: "none",
+                      stroke: "currentColor",
+                      strokeWidth: "2",
+                      children: [
+                        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+                        /* @__PURE__ */ jsxRuntime.jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+                      ]
+                    }
+                  )
+                }
+              )
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-xs volr:text-slate-600 volr:mb-3", children: t("deposit.completedDescription") }),
+            expanded && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-2 volr:mb-3 volr:animate-[volrFadeIn_0.2s_ease-out]", children: [
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.amount") }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-900 volr:font-medium", children: [
+                  "+",
+                  formatAmount(delta),
+                  " ",
+                  symbol
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.previousBalance") }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-600", children: [
+                  formatAmount(previousBalance),
+                  " ",
+                  symbol
+                ] })
+              ] }),
+              /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:justify-between volr:text-xs", children: [
+                /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-500", children: t("deposit.newBalance") }),
+                /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:font-mono volr:text-slate-900 volr:font-semibold", children: [
+                  formatAmount(newBalance),
+                  " ",
+                  symbol
+                ] })
+              ] })
+            ] }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              "button",
+              {
+                onClick: () => setExpanded(!expanded),
+                className: "volr:w-full volr:py-2 volr:text-xs volr:font-medium volr:text-slate-700 hover:volr:text-slate-900 volr:bg-slate-50 hover:volr:bg-slate-100 volr:rounded-lg volr:transition-colors",
+                children: expanded ? t("deposit.seeLess") : t("deposit.seeMore")
+              }
+            )
+          ] })
+        ] }) }),
+        /* @__PURE__ */ jsxRuntime.jsx("style", { children: `
+        @keyframes volrSlideUp {
+          from {
+            transform: translateY(100%);
+            opacity: 0;
+          }
+          to {
+            transform: translateY(0);
+            opacity: 1;
+          }
+        }
+        @keyframes volrFadeIn {
+          from {
+            opacity: 0;
+          }
+          to {
+            opacity: 1;
+          }
+        }
+      ` })
+      ]
+    }
+  );
+};
+function DepositQRView(props) {
+  const { t } = useI18n();
+  const { config } = react.useVolr();
+  const { client } = react.useInternalAuth();
+  const [chainName, setChainName] = React3.useState(null);
+  const [showOtherTokenModal, setShowOtherTokenModal] = React3.useState(false);
+  const [showToast, setShowToast] = React3.useState(false);
+  const eip681 = React3.useMemo(() => {
+    return `ethereum:${props.address}`;
+  }, [props.address]);
+  const status = react.useDepositListener({
+    chainId: props.chainId,
+    asset: props.asset === "native" ? { kind: "native" } : {
+      kind: "erc20",
+      token: {
+        address: props.asset.address,
+        decimals: props.asset.decimals
+      }
+    },
+    address: props.address
+  });
+  React3.useEffect(() => {
+    console.log("[DepositQRView] Status changed:", status);
+    if (status.state === "detected") {
+      setShowToast(true);
+    }
+  }, [status.state]);
+  const getNetworkInfo = React3.useCallback(
+    react.createGetNetworkInfo({ client, rpcOverrides: config.rpcOverrides }),
+    [client, config.rpcOverrides]
+  );
+  React3.useEffect(() => {
+    let cancelled = false;
+    const loadChainName = async () => {
+      try {
+        const info = await getNetworkInfo(props.chainId, false);
+        if (!cancelled) {
+          setChainName(info.name);
+        }
+      } catch (error) {
+        if (!cancelled) {
+          setChainName(`Chain ${props.chainId}`);
+        }
+      }
+    };
+    loadChainName();
+    return () => {
+      cancelled = true;
+    };
+  }, [getNetworkInfo, props.chainId]);
+  const tokenSymbol = props.asset === "native" ? "ETH" : props.asset.symbol;
+  const displayChainName = chainName || `Chain ${props.chainId}`;
+  const decimals = props.asset === "native" ? 18 : props.asset.decimals;
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative volr:px-5 volr:pb-5", children: [
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:mb-8", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ModalTitle2, { className: "volr:mb-3", children: t("deposit.qrTitle") }),
+      /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:inline-flex volr:items-center volr:gap-2 volr:px-3 volr:py-1.5 volr:rounded-lg volr:bg-slate-100", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:font-medium volr:text-slate-700", children: tokenSymbol }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-slate-400", children: "\u2022" }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-sm volr:text-slate-500", children: displayChainName })
+      ] })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:flex volr:justify-center volr:mb-4", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:relative", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:relative volr:rounded-2xl volr:bg-white volr:p-5 volr:shadow-sm volr:border volr:border-slate-200/50 volr:z-10", children: /* @__PURE__ */ jsxRuntime.jsx(
+        "img",
+        {
+          alt: "Deposit QR",
+          width: 240,
+          height: 240,
+          src: `https://api.qrserver.com/v1/create-qr-code/?size=240x240&data=${encodeURIComponent(
+            eip681
+          )}`,
+          className: "volr:rounded-lg volr:relative volr:z-10"
+        }
+      ) }),
+      /* @__PURE__ */ jsxRuntime.jsx(DepositQRStatusOverlay, { status: status.state })
+    ] }) }),
+    status.state === "listening" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-center volr:gap-2 volr:mb-4", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:w-1.5 volr:h-1.5 volr:bg-blue-500 volr:rounded-full volr:animate-pulse" }),
+      /* @__PURE__ */ jsxRuntime.jsx("span", { className: "volr:text-xs volr:text-slate-600", children: t("deposit.listening") })
+    ] }),
+    status.state === "idle" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-slate-500 volr:text-center volr:mb-4", children: "Initializing..." }),
+    status.state === "error" && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:text-xs volr:text-red-500 volr:text-center volr:mb-4", children: [
+      "Error: ",
+      status.message
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:space-y-3", children: [
+      /* @__PURE__ */ jsxRuntime.jsx("div", { children: /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:relative volr:bg-slate-50/50 volr:border volr:border-slate-200/50 volr:rounded-lg volr:p-3 volr:group hover:volr:bg-slate-50 hover:volr:border-slate-200 volr:transition-all", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "volr:flex volr:items-center volr:justify-between volr:gap-3", children: [
+        /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:font-mono volr:text-xs volr:font-medium volr:text-slate-700 volr:flex-1 volr:text-center", children: `${props.address.slice(0, 10)}...${props.address.slice(-8)}` }),
+        /* @__PURE__ */ jsxRuntime.jsx(
+          CopyButton,
+          {
+            text: props.address,
+            className: "volr:flex-shrink-0 volr:absolute volr:right-2"
+          }
+        )
+      ] }) }) }),
+      status.state === "error" && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-xs volr:text-red-500 volr:text-center volr:mb-4", children: status.message })
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:pt-4 volr:border-t volr:border-slate-100", children: /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "volr:text-xs volr:text-slate-500", children: [
+      t("deposit.noToken"),
+      " ",
+      /* @__PURE__ */ jsxRuntime.jsx(
+        TextLinkButton,
+        {
+          onClick: () => setShowOtherTokenModal(true),
+          showArrow: true,
+          children: t("deposit.getOtherToken")
+        }
+      )
+    ] }) }),
+    /* @__PURE__ */ jsxRuntime.jsx(
+      OtherTokenModal,
+      {
+        open: showOtherTokenModal,
+        onOpenChange: setShowOtherTokenModal
+      }
+    ),
+    showToast && status.state === "detected" && /* @__PURE__ */ jsxRuntime.jsx(
+      DepositCompletedToast,
+      {
+        onClose: () => setShowToast(false),
+        previousBalance: status.previousBalance,
+        newBalance: status.newBalance,
+        delta: status.delta,
+        decimals,
+        symbol: tokenSymbol
+      }
+    )
+  ] });
+}
+var DepositModal = ({
+  open,
+  onOpenChange
+}) => {
+  const { config, user } = react.useVolr();
+  const supportedAssets = config.deposit?.supportedAssets ?? [];
+  const hasAssets = supportedAssets.length > 0;
+  const [selectedIdx, setSelectedIdx] = React3.useState(
+    supportedAssets.length === 1 ? 0 : -1
+  );
+  const selected = React3.useMemo(
+    () => supportedAssets[selectedIdx],
+    [supportedAssets, selectedIdx]
+  );
+  const showSelector = hasAssets && supportedAssets.length > 1 && selectedIdx === -1;
+  const showQR = hasAssets && user?.evmAddress && selectedIdx >= 0;
+  const body = React3.useMemo(() => {
+    if (!hasAssets) {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: "No deposit assets configured. Please contact the app developer." }) });
+    }
+    if (!user?.evmAddress) {
+      return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "volr:text-center volr:py-8", children: /* @__PURE__ */ jsxRuntime.jsx("p", { className: "volr:text-sm volr:text-slate-600", children: "Wallet address is not ready. Please finish wallet setup first." }) });
+    }
+    if (supportedAssets.length === 1) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        DepositQRView,
+        {
+          chainId: supportedAssets[0].chainId,
+          asset: supportedAssets[0].token,
+          address: user.evmAddress,
+          onBack: void 0
+        }
+      );
+    }
+    if (showSelector) {
+      return /* @__PURE__ */ jsxRuntime.jsx(
+        AssetSelectView,
+        {
+          assets: supportedAssets,
+          onSelect: (idx) => setSelectedIdx(idx)
+        }
+      );
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      DepositQRView,
+      {
+        chainId: selected.chainId,
+        asset: selected.token,
+        address: user.evmAddress,
+        onBack: () => setSelectedIdx(-1)
+      }
+    );
+  }, [
+    hasAssets,
+    selected,
+    selectedIdx,
+    showSelector,
+    supportedAssets,
+    user?.evmAddress
+  ]);
+  return /* @__PURE__ */ jsxRuntime.jsxs(Modal, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsxRuntime.jsx(
+      ModalHeader,
+      {
+        back: showQR && supportedAssets.length > 1,
+        onBack: showQR ? () => setSelectedIdx(-1) : void 0,
+        onClose: () => onOpenChange(false)
+      }
+    ),
+    body
+  ] });
+};
+
+// src/generated/volr-sdk-css.ts
+var VOLR_SDK_CSS = '/*! tailwindcss v4.1.17 | MIT License | https://tailwindcss.com */\n@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--volr-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--volr-color-red-50:oklch(97.1% .013 17.38);--volr-color-red-200:oklch(88.5% .062 18.334);--volr-color-red-500:oklch(63.7% .237 25.331);--volr-color-red-600:oklch(57.7% .245 27.325);--volr-color-red-700:oklch(50.5% .213 27.518);--volr-color-green-600:oklch(62.7% .194 149.214);--volr-color-emerald-300:oklch(84.5% .143 164.978);--volr-color-emerald-400:oklch(76.5% .177 163.223);--volr-color-emerald-500:oklch(69.6% .17 162.48);--volr-color-teal-400:oklch(77.7% .152 181.912);--volr-color-teal-500:oklch(70.4% .14 182.503);--volr-color-cyan-400:oklch(78.9% .154 211.53);--volr-color-blue-500:oklch(62.3% .214 259.815);--volr-color-purple-600:oklch(55.8% .288 302.321);--volr-color-rose-50:oklch(96.9% .015 12.422);--volr-color-rose-200:oklch(89.2% .058 10.001);--volr-color-rose-700:oklch(51.4% .222 16.935);--volr-color-rose-800:oklch(45.5% .188 13.697);--volr-color-slate-50:oklch(98.4% .003 247.858);--volr-color-slate-100:oklch(96.8% .007 247.896);--volr-color-slate-200:oklch(92.9% .013 255.508);--volr-color-slate-300:oklch(86.9% .022 252.894);--volr-color-slate-400:oklch(70.4% .04 256.788);--volr-color-slate-500:oklch(55.4% .046 257.417);--volr-color-slate-600:oklch(44.6% .043 257.281);--volr-color-slate-700:oklch(37.2% .044 257.287);--volr-color-slate-900:oklch(20.8% .042 265.755);--volr-color-gray-100:oklch(96.7% .003 264.542);--volr-color-gray-400:oklch(70.7% .022 261.325);--volr-color-gray-500:oklch(55.1% .027 264.364);--volr-color-gray-900:oklch(21% .034 264.665);--volr-color-black:#000;--volr-color-white:#fff;--volr-spacing:.25rem;--volr-container-md:28rem;--volr-container-4xl:56rem;--volr-text-xs:.75rem;--volr-text-xs--line-height:calc(1/.75);--volr-text-sm:.875rem;--volr-text-sm--line-height:calc(1.25/.875);--volr-text-base:1rem;--volr-text-base--line-height:calc(1.5/1);--volr-text-lg:1.125rem;--volr-text-lg--line-height:calc(1.75/1.125);--volr-text-xl:1.25rem;--volr-text-xl--line-height:calc(1.75/1.25);--volr-text-2xl:1.5rem;--volr-text-2xl--line-height:calc(2/1.5);--volr-text-3xl:1.875rem;--volr-text-3xl--line-height:calc(2.25/1.875);--volr-text-8xl:6rem;--volr-text-8xl--line-height:1;--volr-font-weight-medium:500;--volr-font-weight-semibold:600;--volr-font-weight-bold:700;--volr-tracking-tight:-.025em;--volr-leading-relaxed:1.625;--volr-radius-lg:.5rem;--volr-radius-xl:.75rem;--volr-radius-2xl:1rem;--volr-radius-3xl:1.5rem;--volr-ease-out:cubic-bezier(0,0,.2,1);--volr-animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--volr-blur-2xl:40px;--volr-default-transition-duration:.15s;--volr-default-transition-timing-function:cubic-bezier(.4,0,.2,1)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}body{line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1;color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentColor 50%,transparent)}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}[data-volr-root]{color:inherit;font-family:inherit;font-size:1rem;line-height:1.5}[data-volr-root] *{font-family:inherit}}@layer components{.volr-dialog-overlay{inset:calc(var(--volr-spacing)*0);z-index:40;background-color:var(--volr-color-black);position:fixed}@supports (color:color-mix(in lab, red, red)){.volr-dialog-overlay{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr-dialog-content{z-index:50;border-radius:var(--volr-radius-2xl);border-style:var(--tw-border-style);border-width:1px;border-color:var(--volr-color-slate-300);background-color:var(--volr-color-white);padding:calc(var(--volr-spacing)*7);--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);width:calc(100% - 2rem);max-width:28rem;max-height:85vh;position:fixed;top:50%;left:50%;overflow-y:auto;transform:translate(-50%,-50%)}@media (max-width:640px){.volr-dialog-content{top:auto;right:calc(var(--volr-spacing)*0);bottom:calc(var(--volr-spacing)*0);left:calc(var(--volr-spacing)*0);border-radius:1.25rem 1.25rem 0 0;width:100%;max-width:100%;margin:0 auto;transform:translateY(0)}}.volr-dialog-close{top:calc(var(--volr-spacing)*4);right:calc(var(--volr-spacing)*4);height:calc(var(--volr-spacing)*8);width:calc(var(--volr-spacing)*8);color:var(--volr-color-slate-400);cursor:pointer;background-color:#0000;border:none;border-radius:3.40282e38px;justify-content:center;align-items:center;display:inline-flex;position:absolute}.volr-dialog-close:hover{color:#475569;background-color:#f1f5f9}.volr-dialog-close:focus-visible{outline:none;box-shadow:0 0 0 2px #94a3b8b3}.volr-dialog-close-icon{height:calc(var(--volr-spacing)*4);width:calc(var(--volr-spacing)*4)}}@layer utilities{.volr\\:pointer-events-none{pointer-events:none}.volr\\:absolute{position:absolute}.volr\\:fixed{position:fixed}.volr\\:relative{position:relative}.volr\\:inset-0{inset:calc(var(--volr-spacing)*0)}.volr\\:-top-3{top:calc(var(--volr-spacing)*-3)}.volr\\:top-1\\/2{top:50%}.volr\\:-right-3{right:calc(var(--volr-spacing)*-3)}.volr\\:right-0{right:calc(var(--volr-spacing)*0)}.volr\\:right-2{right:calc(var(--volr-spacing)*2)}.volr\\:bottom-0{bottom:calc(var(--volr-spacing)*0)}.volr\\:left-0{left:calc(var(--volr-spacing)*0)}.volr\\:left-3{left:calc(var(--volr-spacing)*3)}.volr\\:-z-10{z-index:calc(10*-1)}.volr\\:z-10{z-index:10}.volr\\:z-20{z-index:20}.volr\\:z-40{z-index:40}.volr\\:z-50{z-index:50}.volr\\:mx-auto{margin-inline:auto}.volr\\:my-6{margin-block:calc(var(--volr-spacing)*6)}.volr\\:my-8{margin-block:calc(var(--volr-spacing)*8)}.volr\\:mt-0\\.5{margin-top:calc(var(--volr-spacing)*.5)}.volr\\:mt-1{margin-top:calc(var(--volr-spacing)*1)}.volr\\:mt-2{margin-top:calc(var(--volr-spacing)*2)}.volr\\:mt-3{margin-top:calc(var(--volr-spacing)*3)}.volr\\:mt-6{margin-top:calc(var(--volr-spacing)*6)}.volr\\:mt-8{margin-top:calc(var(--volr-spacing)*8)}.volr\\:mb-1{margin-bottom:calc(var(--volr-spacing)*1)}.volr\\:mb-2{margin-bottom:calc(var(--volr-spacing)*2)}.volr\\:mb-3{margin-bottom:calc(var(--volr-spacing)*3)}.volr\\:mb-4{margin-bottom:calc(var(--volr-spacing)*4)}.volr\\:mb-5{margin-bottom:calc(var(--volr-spacing)*5)}.volr\\:mb-6{margin-bottom:calc(var(--volr-spacing)*6)}.volr\\:mb-7{margin-bottom:calc(var(--volr-spacing)*7)}.volr\\:mb-8{margin-bottom:calc(var(--volr-spacing)*8)}.volr\\:-ml-2{margin-left:calc(var(--volr-spacing)*-2)}.volr\\:flex{display:flex}.volr\\:grid{display:grid}.volr\\:inline-block{display:inline-block}.volr\\:inline-flex{display:inline-flex}.volr\\:h-1\\.5{height:calc(var(--volr-spacing)*1.5)}.volr\\:h-2{height:calc(var(--volr-spacing)*2)}.volr\\:h-8{height:calc(var(--volr-spacing)*8)}.volr\\:h-10{height:calc(var(--volr-spacing)*10)}.volr\\:h-14{height:calc(var(--volr-spacing)*14)}.volr\\:h-24{height:calc(var(--volr-spacing)*24)}.volr\\:h-40{height:calc(var(--volr-spacing)*40)}.volr\\:h-44{height:calc(var(--volr-spacing)*44)}.volr\\:h-48{height:calc(var(--volr-spacing)*48)}.volr\\:h-full{height:100%}.volr\\:h-px{height:1px}.volr\\:max-h-24{max-height:calc(var(--volr-spacing)*24)}.volr\\:max-h-96{max-height:calc(var(--volr-spacing)*96)}.volr\\:max-h-\\[85vh\\]{max-height:85vh}.volr\\:max-h-\\[90vh\\]{max-height:90vh}.volr\\:min-h-\\[120px\\]{min-height:120px}.volr\\:w-1\\.5{width:calc(var(--volr-spacing)*1.5)}.volr\\:w-2{width:calc(var(--volr-spacing)*2)}.volr\\:w-8{width:calc(var(--volr-spacing)*8)}.volr\\:w-10{width:calc(var(--volr-spacing)*10)}.volr\\:w-12{width:calc(var(--volr-spacing)*12)}.volr\\:w-24{width:calc(var(--volr-spacing)*24)}.volr\\:w-40{width:calc(var(--volr-spacing)*40)}.volr\\:w-44{width:calc(var(--volr-spacing)*44)}.volr\\:w-48{width:calc(var(--volr-spacing)*48)}.volr\\:w-full{width:100%}.volr\\:max-w-4xl{max-width:var(--volr-container-4xl)}.volr\\:max-w-full{max-width:100%}.volr\\:max-w-md{max-width:var(--volr-container-md)}.volr\\:max-w-none{max-width:none}.volr\\:min-w-0{min-width:calc(var(--volr-spacing)*0)}.volr\\:flex-1{flex:1}.volr\\:flex-shrink-0{flex-shrink:0}.volr\\:-translate-y-1\\/2{--tw-translate-y:calc(calc(1/2*100%)*-1);translate:var(--tw-translate-x)var(--tw-translate-y)}.volr\\:animate-\\[volrFadeIn_0\\.2s_ease-out\\]{animation:.2s ease-out volrFadeIn}.volr\\:animate-pulse{animation:var(--volr-animate-pulse)}.volr\\:cursor-not-allowed{cursor:not-allowed}.volr\\:cursor-pointer{cursor:pointer}.volr\\:grid-cols-\\[minmax\\(0\\,1\\.1fr\\)_minmax\\(0\\,1fr\\)\\]{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.volr\\:flex-col{flex-direction:column}.volr\\:items-baseline{align-items:baseline}.volr\\:items-center{align-items:center}.volr\\:items-end{align-items:flex-end}.volr\\:items-start{align-items:flex-start}.volr\\:justify-between{justify-content:space-between}.volr\\:justify-center{justify-content:center}.volr\\:gap-1{gap:calc(var(--volr-spacing)*1)}.volr\\:gap-2{gap:calc(var(--volr-spacing)*2)}.volr\\:gap-3{gap:calc(var(--volr-spacing)*3)}.volr\\:gap-4{gap:calc(var(--volr-spacing)*4)}:where(.volr\\:space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.volr\\:space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--volr-spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--volr-spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}.volr\\:truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.volr\\:overflow-hidden{overflow:hidden}.volr\\:overflow-visible{overflow:visible}.volr\\:overflow-y-auto{overflow-y:auto}.volr\\:rounded-2xl{border-radius:var(--volr-radius-2xl)}.volr\\:rounded-full{border-radius:3.40282e38px}.volr\\:rounded-lg{border-radius:var(--volr-radius-lg)}.volr\\:rounded-xl{border-radius:var(--volr-radius-xl)}.volr\\:rounded-t-3xl{border-top-left-radius:var(--volr-radius-3xl);border-top-right-radius:var(--volr-radius-3xl)}.volr\\:border{border-style:var(--tw-border-style);border-width:1px}.volr\\:border-2{border-style:var(--tw-border-style);border-width:2px}.volr\\:border-4{border-style:var(--tw-border-style);border-width:4px}.volr\\:border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.volr\\:border-none{--tw-border-style:none;border-style:none}.volr\\:border-red-200{border-color:var(--volr-color-red-200)}.volr\\:border-rose-200{border-color:var(--volr-color-rose-200)}.volr\\:border-slate-100{border-color:var(--volr-color-slate-100)}.volr\\:border-slate-200,.volr\\:border-slate-200\\/50{border-color:var(--volr-color-slate-200)}@supports (color:color-mix(in lab, red, red)){.volr\\:border-slate-200\\/50{border-color:color-mix(in oklab,var(--volr-color-slate-200)50%,transparent)}}.volr\\:border-slate-300{border-color:var(--volr-color-slate-300)}.volr\\:border-white{border-color:var(--volr-color-white)}.volr\\:bg-black\\/45{background-color:var(--volr-color-black)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-black\\/45{background-color:color-mix(in oklab,var(--volr-color-black)45%,transparent)}}.volr\\:bg-blue-500{background-color:var(--volr-color-blue-500)}.volr\\:bg-cyan-400{background-color:var(--volr-color-cyan-400)}.volr\\:bg-emerald-300{background-color:var(--volr-color-emerald-300)}.volr\\:bg-emerald-400{background-color:var(--volr-color-emerald-400)}.volr\\:bg-gray-100{background-color:var(--volr-color-gray-100)}.volr\\:bg-gray-400{background-color:var(--volr-color-gray-400)}.volr\\:bg-red-50{background-color:var(--volr-color-red-50)}.volr\\:bg-rose-50{background-color:var(--volr-color-rose-50)}.volr\\:bg-slate-50,.volr\\:bg-slate-50\\/50{background-color:var(--volr-color-slate-50)}@supports (color:color-mix(in lab, red, red)){.volr\\:bg-slate-50\\/50{background-color:color-mix(in oklab,var(--volr-color-slate-50)50%,transparent)}}.volr\\:bg-slate-100{background-color:var(--volr-color-slate-100)}.volr\\:bg-slate-200{background-color:var(--volr-color-slate-200)}.volr\\:bg-teal-400{background-color:var(--volr-color-teal-400)}.volr\\:bg-transparent{background-color:#0000}.volr\\:bg-white{background-color:var(--volr-color-white)}.volr\\:bg-gradient-to-br{--tw-gradient-position:to bottom right in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.volr\\:from-blue-500{--tw-gradient-from:var(--volr-color-blue-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.volr\\:from-emerald-400{--tw-gradient-from:var(--volr-color-emerald-400);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.volr\\:from-emerald-500{--tw-gradient-from:var(--volr-color-emerald-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.volr\\:to-purple-600{--tw-gradient-to:var(--volr-color-purple-600);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.volr\\:to-teal-500{--tw-gradient-to:var(--volr-color-teal-500);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.volr\\:p-1{padding:calc(var(--volr-spacing)*1)}.volr\\:p-2{padding:calc(var(--volr-spacing)*2)}.volr\\:p-3{padding:calc(var(--volr-spacing)*3)}.volr\\:p-4{padding:calc(var(--volr-spacing)*4)}.volr\\:p-5{padding:calc(var(--volr-spacing)*5)}.volr\\:p-8{padding:calc(var(--volr-spacing)*8)}.volr\\:px-2{padding-inline:calc(var(--volr-spacing)*2)}.volr\\:px-3{padding-inline:calc(var(--volr-spacing)*3)}.volr\\:px-4{padding-inline:calc(var(--volr-spacing)*4)}.volr\\:px-5{padding-inline:calc(var(--volr-spacing)*5)}.volr\\:px-6{padding-inline:calc(var(--volr-spacing)*6)}.volr\\:py-0\\.5{padding-block:calc(var(--volr-spacing)*.5)}.volr\\:py-1\\.5{padding-block:calc(var(--volr-spacing)*1.5)}.volr\\:py-2{padding-block:calc(var(--volr-spacing)*2)}.volr\\:py-3{padding-block:calc(var(--volr-spacing)*3)}.volr\\:py-4{padding-block:calc(var(--volr-spacing)*4)}.volr\\:py-6{padding-block:calc(var(--volr-spacing)*6)}.volr\\:py-8{padding-block:calc(var(--volr-spacing)*8)}.volr\\:py-12{padding-block:calc(var(--volr-spacing)*12)}.volr\\:pt-4{padding-top:calc(var(--volr-spacing)*4)}.volr\\:pr-3{padding-right:calc(var(--volr-spacing)*3)}.volr\\:pb-5{padding-bottom:calc(var(--volr-spacing)*5)}.volr\\:pb-6{padding-bottom:calc(var(--volr-spacing)*6)}.volr\\:pl-11{padding-left:calc(var(--volr-spacing)*11)}.volr\\:text-center{text-align:center}.volr\\:text-left{text-align:left}.volr\\:font-mono{font-family:var(--volr-font-mono)}.volr\\:text-2xl{font-size:var(--volr-text-2xl);line-height:var(--tw-leading,var(--volr-text-2xl--line-height))}.volr\\:text-3xl{font-size:var(--volr-text-3xl);line-height:var(--tw-leading,var(--volr-text-3xl--line-height))}.volr\\:text-8xl{font-size:var(--volr-text-8xl);line-height:var(--tw-leading,var(--volr-text-8xl--line-height))}.volr\\:text-base{font-size:var(--volr-text-base);line-height:var(--tw-leading,var(--volr-text-base--line-height))}.volr\\:text-lg{font-size:var(--volr-text-lg);line-height:var(--tw-leading,var(--volr-text-lg--line-height))}.volr\\:text-sm{font-size:var(--volr-text-sm);line-height:var(--tw-leading,var(--volr-text-sm--line-height))}.volr\\:text-xl{font-size:var(--volr-text-xl);line-height:var(--tw-leading,var(--volr-text-xl--line-height))}.volr\\:text-xs{font-size:var(--volr-text-xs);line-height:var(--tw-leading,var(--volr-text-xs--line-height))}.volr\\:leading-none{--tw-leading:1;line-height:1}.volr\\:leading-relaxed{--tw-leading:var(--volr-leading-relaxed);line-height:var(--volr-leading-relaxed)}.volr\\:font-bold{--tw-font-weight:var(--volr-font-weight-bold);font-weight:var(--volr-font-weight-bold)}.volr\\:font-medium{--tw-font-weight:var(--volr-font-weight-medium);font-weight:var(--volr-font-weight-medium)}.volr\\:font-semibold{--tw-font-weight:var(--volr-font-weight-semibold);font-weight:var(--volr-font-weight-semibold)}.volr\\:tracking-tight{--tw-tracking:var(--volr-tracking-tight);letter-spacing:var(--volr-tracking-tight)}.volr\\:break-all{word-break:break-all}.volr\\:text-gray-500{color:var(--volr-color-gray-500)}.volr\\:text-gray-900{color:var(--volr-color-gray-900)}.volr\\:text-green-600{color:var(--volr-color-green-600)}.volr\\:text-red-500{color:var(--volr-color-red-500)}.volr\\:text-red-600{color:var(--volr-color-red-600)}.volr\\:text-red-700{color:var(--volr-color-red-700)}.volr\\:text-rose-700{color:var(--volr-color-rose-700)}.volr\\:text-rose-800{color:var(--volr-color-rose-800)}.volr\\:text-slate-400{color:var(--volr-color-slate-400)}.volr\\:text-slate-500{color:var(--volr-color-slate-500)}.volr\\:text-slate-600{color:var(--volr-color-slate-600)}.volr\\:text-slate-700{color:var(--volr-color-slate-700)}.volr\\:text-slate-900{color:var(--volr-color-slate-900)}.volr\\:text-white{color:var(--volr-color-white)}.volr\\:capitalize{text-transform:capitalize}.volr\\:underline{text-decoration-line:underline}.volr\\:opacity-0{opacity:0}.volr\\:opacity-30{opacity:.3}.volr\\:shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.volr\\:shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.volr\\:shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.volr\\:shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.volr\\:shadow-emerald-500\\/50{--tw-shadow-color:var(--volr-color-emerald-500)}@supports (color:color-mix(in lab, red, red)){.volr\\:shadow-emerald-500\\/50{--tw-shadow-color:color-mix(in oklab,color-mix(in oklab,var(--volr-color-emerald-500)50%,transparent)var(--tw-shadow-alpha),transparent)}}.volr\\:blur-2xl{--tw-blur:blur(var(--volr-blur-2xl));filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.volr\\:transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--volr-default-transition-duration))}.volr\\:transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--volr-default-transition-timing-function));transition-duration:var(--tw-duration,var(--volr-default-transition-duration))}.volr\\:duration-200{--tw-duration:.2s;transition-duration:.2s}.volr\\:duration-300{--tw-duration:.3s;transition-duration:.3s}.volr\\:duration-500{--tw-duration:.5s;transition-duration:.5s}.volr\\:ease-out{--tw-ease:var(--volr-ease-out);transition-timing-function:var(--volr-ease-out)}.volr\\:outline-none{--tw-outline-style:none;outline-style:none}@media (hover:hover){.volr\\:hover\\:bg-slate-50:hover{background-color:var(--volr-color-slate-50)}}.volr\\:focus-visible\\:ring-2:focus-visible{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.volr\\:focus-visible\\:ring-slate-300:focus-visible{--tw-ring-color:var(--volr-color-slate-300)}.volr\\:focus-visible\\:outline-none:focus-visible{--tw-outline-style:none;outline-style:none}.volr-mono{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes pulse{50%{opacity:.5}}';
+
+// src/styles/inject-volr-styles.ts
+var injected = false;
+function ensureVolrStylesInjected() {
+  if (typeof document === "undefined") return;
+  if (injected) return;
+  const id = "volr-sdk-styles";
+  if (document.getElementById(id)) {
+    injected = true;
+    return;
+  }
+  const style = document.createElement("style");
+  style.id = id;
+  style.textContent = VOLR_SDK_CSS;
+  document.head.appendChild(style);
+  injected = true;
+}
+var VolrUIContext = React3__default.default.createContext(null);
+var useVolrUI = () => {
+  const context = React3.useContext(VolrUIContext);
+  if (!context) {
+    throw new Error("useVolrUI must be used within VolrUIProvider");
+  }
+  return context;
+};
+function OnboardingFlow({
+  keyStorageType,
+  onComplete
+}) {
+  const { logout } = react.useVolr();
+  const handleEnrollComplete = () => {
+    onComplete();
+  };
+  const handleEnrollError = (_err) => {
+  };
+  const handleLogout = async () => {
+    try {
+      await logout();
+      onComplete();
+    } catch (error) {
+    }
+  };
+  if (keyStorageType === "passkey") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      PasskeyEnrollView,
+      {
+        onComplete: handleEnrollComplete,
+        onError: handleEnrollError,
+        onLogout: handleLogout
+      }
+    );
+  }
+  if (keyStorageType === "mpc") {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      MpcConnectView,
+      {
+        onComplete: handleEnrollComplete,
+        onError: handleEnrollError
+      }
+    );
+  }
+  return null;
+}
+var VolrUIProvider = ({
+  config,
+  children
+}) => {
+  const {
+    appName,
+    accentColor = "#303030",
+    enabledLoginMethods = ["email", "social", "siwe"],
+    socialProviders = ["google", "twitter", "apple"],
+    branding,
+    keyStorageType
+  } = config;
+  const providerPolicy = config.providerPolicy ?? {
+    enforceOnFirstLogin: true
+  };
+  const [showOnboarding, setShowOnboarding] = React3.useState(false);
+  const [keyStorageTypeError, setKeyStorageTypeError] = React3.useState(
+    null
+  );
+  React3.useEffect(() => {
+    ensureVolrStylesInjected();
+  }, []);
+  React3.useEffect(() => {
+    if (providerPolicy.enforceOnFirstLogin !== false && !keyStorageType) {
+      const errorMessage = "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider.";
+      console.error(errorMessage);
+      setKeyStorageTypeError(errorMessage);
+    } else {
+      setKeyStorageTypeError(null);
+    }
+  }, [keyStorageType, providerPolicy.enforceOnFirstLogin]);
+  if (keyStorageTypeError) {
+    return /* @__PURE__ */ jsxRuntime.jsx(Modal, { open: true, onOpenChange: () => {
+    }, children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-md mx-auto", children: [
+      /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { className: "text-red-600", children: "Configuration Error" }),
+      /* @__PURE__ */ jsxRuntime.jsx("div", { className: "text-sm text-gray-700 mb-6 leading-relaxed", children: keyStorageTypeError })
+    ] }) });
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(react.VolrProvider, { config, children: /* @__PURE__ */ jsxRuntime.jsx(I18nProvider, { children: /* @__PURE__ */ jsxRuntime.jsx(
+    VolrUIContext.Provider,
+    {
+      value: {
+        accentColor,
+        appName,
+        enabledLoginMethods,
+        socialProviders,
+        branding,
+        keyStorageType
+      },
+      children: /* @__PURE__ */ jsxRuntime.jsxs(VolrModalProvider, { children: [
+        /* @__PURE__ */ jsxRuntime.jsx(
+          OnboardingChecker,
+          {
+            keyStorageType,
+            enforceSelection: providerPolicy.enforceOnFirstLogin ?? true,
+            onShowOnboarding: () => setShowOnboarding(true),
+            onHideOnboarding: () => setShowOnboarding(false)
+          }
+        ),
+        /* @__PURE__ */ jsxRuntime.jsx(LoginModalPortal, {}),
+        /* @__PURE__ */ jsxRuntime.jsx(DepositModalPortal, {}),
+        showOnboarding && keyStorageType && /* @__PURE__ */ jsxRuntime.jsx(
+          Modal,
+          {
+            open: true,
+            onOpenChange: () => setShowOnboarding(false),
+            onPointerDownOutside: (e) => e.preventDefault(),
+            children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "max-w-md mx-auto", children: [
+              /* @__PURE__ */ jsxRuntime.jsx(ModalTitle, { className: "sr-only", children: "Onboarding" }),
+              /* @__PURE__ */ jsxRuntime.jsx(
+                OnboardingFlow,
+                {
+                  keyStorageType,
+                  onComplete: () => setShowOnboarding(false)
+                }
+              )
+            ] })
+          }
+        ),
+        children
+      ] })
+    }
+  ) }) });
+};
+function LoginModalPortal() {
+  const { isOpen, mode, close } = useVolrModal();
+  const [portalRoot, setPortalRoot] = React3.useState(null);
+  const [error, setError] = React3.useState(null);
+  React3.useEffect(() => {
+    if (typeof window === "undefined") return;
+    let root = document.getElementById("volr-modal-root");
+    if (!root) {
+      root = document.createElement("div");
+      root.id = "volr-modal-root";
+      document.body.appendChild(root);
+    }
+    setPortalRoot(root);
+    return () => {
+      if (root && root.childNodes.length === 0) {
+        root.remove();
+      }
+    };
+  }, []);
+  const handleClose = () => {
+    console.log("[LoginModalPortal] handleClose called");
+    setError(null);
+    close();
+  };
+  const handleError = (err) => {
+    console.error("[LoginModal] Error:", err);
+    setError(err);
+  };
+  if (!portalRoot) return null;
+  return reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+      /* @__PURE__ */ jsxRuntime.jsx(
+        SigninModal,
+        {
+          isOpen: isOpen && mode === "auth",
+          onClose: handleClose,
+          onError: handleError
+        }
+      ),
+      error && /* @__PURE__ */ jsxRuntime.jsx(
+        "div",
+        {
+          style: {
+            position: "fixed",
+            bottom: "20px",
+            right: "20px",
+            backgroundColor: "#fef2f2",
+            border: "1px solid #fecaca",
+            borderRadius: "8px",
+            padding: "12px 16px",
+            maxWidth: "400px",
+            boxShadow: "0 10px 15px -3px rgba(0, 0, 0, 0.1)",
+            zIndex: 10001
+          },
+          children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { fontSize: "14px", color: "#991b1b" }, children: error.message })
+        }
+      )
+    ] }),
+    portalRoot
+  );
+}
+function DepositModalPortal() {
+  const { isOpen, mode, close } = useVolrModal();
+  const [portalRoot, setPortalRoot] = React3.useState(null);
+  React3.useEffect(() => {
+    if (typeof window === "undefined") return;
+    let root = document.getElementById("volr-modal-root");
+    if (!root) {
+      root = document.createElement("div");
+      root.id = "volr-modal-root";
+      document.body.appendChild(root);
+    }
+    setPortalRoot(root);
+    return () => {
+      if (root && root.childNodes.length === 0) {
+        root.remove();
+      }
+    };
+  }, []);
+  if (!portalRoot) return null;
+  return reactDom.createPortal(
+    /* @__PURE__ */ jsxRuntime.jsx(DepositModal, { open: isOpen && mode === "deposit", onOpenChange: close }),
+    portalRoot
+  );
+}
+function OnboardingChecker({
+  keyStorageType,
+  enforceSelection,
+  onShowOnboarding,
+  onHideOnboarding
+}) {
+  const { user, provider, isLoading } = react.useVolr();
+  const { isOpen: isLoginModalOpen } = useVolrModal();
+  React3.useEffect(() => {
+    if (isLoading) {
+      return;
+    }
+    if (isLoginModalOpen) {
+      onHideOnboarding();
+      return;
+    }
+    if (user && !provider) {
+      if (user.keyStorageType) {
+        onHideOnboarding();
+        return;
+      }
+      if (enforceSelection) {
+        if (!keyStorageType) {
+          console.error(
+            "keyStorageType must be specified in VolrUIProvider props. Please set keyStorageType prop in VolrUIProvider."
+          );
+          return;
+        }
+        onShowOnboarding();
+      }
+    } else if (provider) {
+      onHideOnboarding();
+    }
+  }, [
+    user,
+    provider,
+    isLoading,
+    isLoginModalOpen,
+    enforceSelection,
+    keyStorageType,
+    onShowOnboarding,
+    onHideOnboarding
+  ]);
+  return null;
+}
+function useSwitchNetwork() {
+  const { client } = react.useInternalAuth();
+  return React3.useCallback(
+    async (chainId) => {
+      if (typeof window === "undefined" || !window.ethereum) {
+        throw new Error("No wallet found");
+      }
+      const ethereum = window.ethereum;
+      const chainIdHex = `0x${chainId.toString(16)}`;
+      try {
+        await ethereum.request({
+          method: "wallet_switchEthereumChain",
+          params: [{ chainId: chainIdHex }]
+        });
+      } catch (switchError) {
+        if (switchError.code === 4902) {
+          try {
+            const response = await client.get(
+              `/networks/${chainId}?includeWalletConfig=true&includeRpcUrl=true`
+            );
+            if (!response.rpcUrl) {
+              throw new Error(`RPC URL not available for chainId ${chainId}`);
+            }
+            if (!response.nativeCurrency) {
+              throw new Error(`Native currency configuration not available for chainId ${chainId}`);
+            }
+            await ethereum.request({
+              method: "wallet_addEthereumChain",
+              params: [
+                {
+                  chainId: chainIdHex,
+                  chainName: response.name,
+                  nativeCurrency: response.nativeCurrency,
+                  rpcUrls: [response.rpcUrl],
+                  blockExplorerUrls: response.blockExplorerUrl ? [response.blockExplorerUrl] : void 0
+                }
+              ]
+            });
+          } catch (addError) {
+            throw new Error(
+              `Failed to add network: ${addError instanceof Error ? addError.message : "Unknown error"}`
+            );
+          }
+        } else {
+          throw new Error(
+            `Failed to switch network: ${switchError.message || "Unknown error"}`
+          );
+        }
+      }
+    },
+    [client]
+  );
+}
+async function switchNetwork(chainId, client) {
+  const chainIdHex = `0x${chainId.toString(16)}`;
+  if (typeof window === "undefined" || !window.ethereum) {
+    throw new Error("No wallet found");
+  }
+  const ethereum = window.ethereum;
+  try {
+    await ethereum.request({
+      method: "wallet_switchEthereumChain",
+      params: [{ chainId: chainIdHex }]
+    });
+  } catch (switchError) {
+    if (switchError.code === 4902) {
+      try {
+        const response = await client.get(
+          `/networks/${chainId}?includeWalletConfig=true&includeRpcUrl=true`
+        );
+        if (!response.rpcUrl) {
+          throw new Error(`RPC URL not available for chainId ${chainId}`);
+        }
+        if (!response.nativeCurrency) {
+          throw new Error(`Native currency configuration not available for chainId ${chainId}`);
+        }
+        await ethereum.request({
+          method: "wallet_addEthereumChain",
+          params: [
+            {
+              chainId: chainIdHex,
+              chainName: response.name,
+              nativeCurrency: response.nativeCurrency,
+              rpcUrls: [response.rpcUrl],
+              blockExplorerUrls: response.blockExplorerUrl ? [response.blockExplorerUrl] : void 0
+            }
+          ]
+        });
+      } catch (addError) {
+        throw new Error(
+          `Failed to add network: ${addError instanceof Error ? addError.message : "Unknown error"}`
+        );
+      }
+    } else {
+      throw new Error(
+        `Failed to switch network: ${switchError.message || "Unknown error"}`
+      );
+    }
+  }
+}
+async function getCurrentChainId() {
+  if (typeof window === "undefined" || !window.ethereum) {
+    throw new Error("No wallet found");
+  }
+  const chainIdHex = await window.ethereum.request({
+    method: "eth_chainId"
+  });
+  return parseInt(chainIdHex, 16);
+}
+
+exports.I18nContext = I18nContext;
+exports.I18nProvider = I18nProvider;
+exports.MpcConnectView = MpcConnectView;
+exports.PasskeyEnrollView = PasskeyEnrollView;
+exports.VolrUIProvider = VolrUIProvider;
+exports.getCurrentChainId = getCurrentChainId;
+exports.switchNetwork = switchNetwork;
+exports.useI18n = useI18n;
+exports.useSwitchNetwork = useSwitchNetwork;
+exports.useTranslation = useTranslation;
+exports.useVolrModal = useVolrModal;
+exports.useVolrUI = useVolrUI;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map