@cedros/login-react 0.0.14 → 0.0.16

package/dist/{AutosaveStatus-Ciyt350A.js → AutosaveStatus-BKc7T2Tw.js}

@@ -1,77 +1,15 @@
-import { useState as k, useRef as T, useEffect as O, useCallback as d, useMemo as S } from "react";
-import { u as E } from "./useSystemSettings-DBlAMjFi.js";
 import { jsx as t, jsxs as u, Fragment as f } from "react/jsx-runtime";
-const U = 800, I = 2e3;
-function X() {
-  const { settings: e, isLoading: l, error: a, fetchSettings: n, updateSettings: s } = E(), [i, p] = k({}), [r, o] = k("idle"), [c, m] = k(null), h = T(null), y = T(null), w = T({});
-  O(() => () => {
-    h.current && clearTimeout(h.current), y.current && clearTimeout(y.current);
-  }, []);
-  const N = d(async () => {
-    const _ = { ...w.current };
-    if (Object.keys(_).length === 0) {
-      o("idle");
-      return;
-    }
-    o("saving"), m(null);
-    const v = Object.entries(_).map(([b, g]) => ({
-      key: b,
-      value: g
-    }));
-    try {
-      await s(v), p((b) => {
-        const g = { ...b };
-        for (const C of Object.keys(_))
-          delete g[C];
-        return g;
-      });
-      for (const b of Object.keys(_))
-        delete w.current[b];
-      o("saved"), y.current && clearTimeout(y.current), y.current = setTimeout(() => {
-        o("idle");
-      }, I);
-    } catch (b) {
-      o("error"), m(b instanceof Error ? b.message : "Failed to save");
-    }
-  }, [s]), D = d(
-    (_, v) => {
-      p((b) => ({ ...b, [_]: v })), w.current[_] = v, m(null), o("pending"), h.current && clearTimeout(h.current), h.current = setTimeout(() => {
-        N();
-      }, U);
-    },
-    [N]
-  ), A = d(
-    (_) => {
-      if (i[_] !== void 0) return i[_];
-      for (const v of Object.values(e)) {
-        const b = v.find((g) => g.key === _);
-        if (b) return b.value;
-      }
-      return "";
-    },
-    [i, e]
-  );
-  return {
-    settings: e,
-    edits: i,
-    isLoading: l,
-    autosaveStatus: r,
-    autosaveError: c,
-    error: a,
-    fetchSettings: n,
-    handleChange: D,
-    getEffectiveValue: A
-  };
+import { useMemo as T, useCallback as d, useState as w, useRef as S, useEffect as O } from "react";
+import { u as E } from "./useSystemSettings-DBlAMjFi.js";
+function I(e) {
+  const s = Math.floor(e / 86400), a = Math.floor(e % 86400 / 3600), r = Math.floor(e % 3600 / 60), l = e % 60;
+  return { days: s, hours: a, minutes: r, seconds: l };
 }
 function M(e) {
-  const l = Math.floor(e / 86400), a = Math.floor(e % 86400 / 3600), n = Math.floor(e % 3600 / 60), s = e % 60;
-  return { days: l, hours: a, minutes: n, seconds: s };
+  const { days: s, hours: a, minutes: r } = I(e), l = [];
+  return s > 0 && l.push(`${s}d`), a > 0 && l.push(`${a}h`), r > 0 && l.push(`${r}m`), l.length === 0 && l.push(`${e}s`), l.join(" ");
 }
-function R(e) {
-  const { days: l, hours: a, minutes: n } = M(e), s = [];
-  return l > 0 && s.push(`${l}d`), a > 0 && s.push(`${a}h`), n > 0 && s.push(`${n}m`), s.length === 0 && s.push(`${e}s`), s.join(" ");
-}
-const q = {
+const R = {
   // ============= Authentication Providers =============
   // Email auth
   auth_email_enabled: {
@@ -96,53 +34,35 @@ const q = {
   auth_google_enabled: {
     key: "auth_google_enabled",
     label: "Enable Google Sign-In",
-    description: "Allow users to authenticate with their Google account.",
+    description: 'Allow users to authenticate with their Google account. Configure at <a href="https://console.cloud.google.com/apis/credentials" target="_blank" rel="noopener">Google Cloud Console &gt; Credentials</a>.',
     inputType: "boolean"
   },
   auth_google_client_id: {
     key: "auth_google_client_id",
     label: "Google Client ID",
-    description: "OAuth 2.0 client ID from Google Cloud Console.",
+    description: "OAuth 2.0 client ID from Google Cloud Console. Create a Web application credential and add your frontend URL to Authorized JavaScript origins.",
     inputType: "text"
   },
-  auth_google_client_secret: {
-    key: "auth_google_client_secret",
-    label: "Google Client Secret",
-    description: "OAuth 2.0 client secret from Google Cloud Console.",
-    inputType: "secret"
-  },
   // Apple OAuth
   auth_apple_enabled: {
     key: "auth_apple_enabled",
     label: "Enable Sign in with Apple",
-    description: "Allow users to authenticate with their Apple ID.",
+    description: 'Allow users to authenticate with their Apple ID. Configure at <a href="https://developer.apple.com/account/resources/identifiers" target="_blank" rel="noopener">Apple Developer &gt; Identifiers</a>.',
     inputType: "boolean"
   },
   auth_apple_client_id: {
     key: "auth_apple_client_id",
     label: "Apple Services ID",
-    description: "The Services ID configured in your Apple Developer account.",
-    inputType: "text"
+    description: "Your Client ID (e.g. com.yourdomain.service). Create at Identifiers &gt; Services IDs, then enable Sign in with Apple and add your frontend URL as a Return URL (e.g. https://yourdomain.com).",
+    inputType: "text",
+    placeholder: "com.yourdomain.service"
   },
   auth_apple_team_id: {
     key: "auth_apple_team_id",
     label: "Apple Team ID",
-    description: "Your Apple Developer Team ID.",
-    inputType: "text"
-  },
-  auth_apple_key_id: {
-    key: "auth_apple_key_id",
-    label: "Apple Key ID",
-    description: "The Key ID for your Sign in with Apple private key.",
+    description: 'Identifies your developer account. Found at the top-right of <a href="https://developer.apple.com/account" target="_blank" rel="noopener">Apple Developer</a>.',
     inputType: "text"
   },
-  auth_apple_private_key: {
-    key: "auth_apple_private_key",
-    label: "Apple Private Key",
-    description: "The private key file contents (PEM format) for Sign in with Apple.",
-    inputType: "secret",
-    multiline: !0
-  },
   // Solana auth
   auth_solana_enabled: {
     key: "auth_solana_enabled",
@@ -247,12 +167,12 @@ const q = {
   wallet_recovery_mode: {
     key: "wallet_recovery_mode",
     label: "Recovery Mode",
-    description: "How users can recover their wallet if they lose access.",
+    description: "Controls whether users can recover their embedded wallet seed. <b>Share C Only</b> lets users export a single key share (cannot reconstruct the full seed). <b>Full Seed</b> lets users export the complete seed phrase. <b>No Recovery</b> prevents any seed export — required when Private Deposits are enabled, because recoverable seeds would let users front-run privacy withdrawals.",
     inputType: "select",
     presets: [
       { label: "Share C Only (Recommended)", value: "share_c_only" },
       { label: "Full Seed Phrase", value: "full_seed" },
-      { label: "No Recovery", value: "none" }
+      { label: "No Recovery (Required for Private Deposits)", value: "none" }
     ]
   },
   feature_credits: {
@@ -264,7 +184,7 @@ const q = {
   feature_user_withdrawals: {
     key: "feature_user_withdrawals",
     label: "User Withdrawals",
-    description: "Allow users to withdraw SOL/SPL tokens from their embedded wallet to external addresses.",
+    description: "Allow users to initiate withdrawals from their embedded wallet to external addresses. This is separate from the automated privacy withdrawal worker, which moves funds from the privacy pool to the treasury.",
     inputType: "boolean"
   },
   // ============= Security Settings =============
@@ -326,7 +246,7 @@ const q = {
   email_provider: {
     key: "email_provider",
     label: "Email Provider",
-    description: "Select your email service provider for automatic configuration.",
+    description: "Select a provider to auto-configure SMTP host, port, and TLS. Choose Custom SMTP to enter settings manually.",
     inputType: "select",
     presets: [
       { label: "Mailgun", value: "mailgun" },
@@ -340,13 +260,14 @@ const q = {
   email_smtp_host: {
     key: "email_smtp_host",
     label: "SMTP Host",
-    description: "SMTP server hostname (e.g., smtp.sendgrid.net).",
-    inputType: "text"
+    description: "SMTP server hostname. Auto-filled when selecting a provider above.",
+    inputType: "text",
+    placeholder: "smtp.example.com"
   },
   email_smtp_port: {
     key: "email_smtp_port",
     label: "SMTP Port",
-    description: "SMTP server port. Common: 587 (TLS), 465 (SSL), 25 (unencrypted).",
+    description: "SMTP server port. Most providers use 587 (TLS).",
     inputType: "select",
     presets: [
       { label: "587 (TLS)", value: "587" },
@@ -357,32 +278,34 @@ const q = {
   email_smtp_user: {
     key: "email_smtp_user",
     label: "SMTP Username",
-    description: "Username for SMTP authentication.",
+    description: 'Username for SMTP authentication. For SendGrid use "apikey", for Postmark use your server API token, for Mailgun use your full Mailgun SMTP login.',
     inputType: "text"
   },
   email_smtp_password: {
     key: "email_smtp_password",
     label: "API Key",
-    description: "API key or password for your email provider.",
+    description: "API key or password for your email provider. For SendGrid this is your API key, for Postmark your server API token, for Mailgun your SMTP password.",
     inputType: "secret"
   },
   email_smtp_tls: {
     key: "email_smtp_tls",
     label: "Use TLS",
-    description: "Enable TLS encryption for SMTP connections.",
+    description: "Enable TLS encryption for SMTP connections. Required by most providers.",
     inputType: "boolean"
   },
   email_from_address: {
     key: "email_from_address",
     label: "From Address",
-    description: "Default sender email address (e.g., noreply@example.com).",
-    inputType: "text"
+    description: "Sender email address for verification, password reset, and instant link emails. Must be verified with your provider.",
+    inputType: "text",
+    placeholder: "noreply@yourdomain.com"
   },
   email_from_name: {
     key: "email_from_name",
     label: "From Name",
-    description: 'Default sender display name (e.g., "My App").',
-    inputType: "text"
+    description: 'Display name shown in the "From" field of outbound emails.',
+    inputType: "text",
+    placeholder: "My App"
   },
   // ============= Webhook Settings =============
   webhook_enabled: {
@@ -435,6 +358,12 @@ const q = {
     description: "Trust X-Forwarded-For headers. Enable if behind a reverse proxy.",
     inputType: "boolean"
   },
+  feature_cedros_pay: {
+    key: "feature_cedros_pay",
+    label: "Cedros Pay Integration",
+    description: "Enable Cedros Pay integration. When enabled, shows the Integrations tab with API key configuration. Not needed for co-located deployments using JWT/JWKS inter-service auth.",
+    inputType: "boolean"
+  },
   server_cedros_pay_api_key: {
     key: "server_cedros_pay_api_key",
     label: "Cedros Pay API Key",
@@ -940,7 +869,89 @@ const q = {
       message: "Very small withdrawals may lose significant value to fees."
     }
   }
-}, L = [
+}, X = {
+  // Auth providers (sorted alphabetically by subcategory)
+  "auth.apple": {
+    label: "Apple Sign-In",
+    description: "Configure Sign in with Apple OAuth integration.",
+    icon: ""
+  },
+  "auth.email": {
+    label: "Email Authentication",
+    description: "Configure email/password authentication settings.",
+    icon: ""
+  },
+  "auth.google": {
+    label: "Google Sign-In",
+    description: "Configure Google OAuth integration.",
+    icon: ""
+  },
+  "auth.solana": {
+    label: "Solana Wallet Auth",
+    description: "Configure Solana wallet signature authentication.",
+    icon: ""
+  },
+  "auth.webauthn": {
+    label: "WebAuthn / Passkeys",
+    description: "Configure FIDO2/WebAuthn passwordless authentication.",
+    icon: ""
+  },
+  "auth.instantlink": {
+    label: "Instant Link",
+    description: "Configure magic link passwordless authentication via email.",
+    icon: ""
+  },
+  "deposit.general": {
+    label: "General",
+    description: "Core deposit and credit system configuration.",
+    icon: ""
+  },
+  deposit: {
+    label: "Deposit Settings",
+    description: "Configure deposit tokens, fees, and related settings.",
+    icon: ""
+  },
+  email: {
+    label: "Email / SMTP",
+    description: "Configure outbound email delivery for verification, password reset, and notifications.",
+    icon: ""
+  },
+  features: {
+    label: "Feature Flags",
+    description: "Enable or disable major platform features.",
+    icon: ""
+  },
+  privacy: {
+    label: "Privacy Settings",
+    description: "Control the privacy period for deposits. Longer periods provide better timing privacy but delay fund availability.",
+    icon: ""
+  },
+  rate_limit: {
+    label: "Rate Limiting",
+    description: "Protect the system from abuse by limiting request rates. Balance security with user experience.",
+    icon: ""
+  },
+  security: {
+    label: "Security",
+    description: "Configure CORS, cookies, sessions, and JWT settings.",
+    icon: ""
+  },
+  server: {
+    label: "Server",
+    description: "Server infrastructure settings. Some may be overridden by environment variables.",
+    icon: ""
+  },
+  webhook: {
+    label: "Webhooks",
+    description: "Configure HTTP webhook notifications for auth events.",
+    icon: ""
+  },
+  withdrawal: {
+    label: "Withdrawal Worker",
+    description: "Configure how the automated withdrawal processor handles pending withdrawals. These settings affect throughput and privacy.",
+    icon: ""
+  }
+}, C = [
   "SOL",
   "USDC",
   "USDT",
@@ -952,49 +963,49 @@ const q = {
   "BONK",
   "ORE"
 ];
-function x(e) {
-  const l = e.split(/(<a\s[^>]*>.*?<\/a>)/g);
-  return l.length === 1 ? e : l.map((a, n) => {
-    const s = a.match(/^<a\s+href="([^"]+)"[^>]*>([^<]+)<\/a>$/);
-    return s ? /* @__PURE__ */ t("a", { href: s[1], target: "_blank", rel: "noopener noreferrer", children: s[2] }, n) : a;
+function P(e) {
+  const s = e.split(/(<a\s[^>]*>.*?<\/a>)/g);
+  return s.length === 1 ? e : s.map((a, r) => {
+    const l = a.match(/^<a\s+href="([^"]+)"[^>]*>([^<]+)<\/a>$/);
+    return l ? /* @__PURE__ */ t("a", { href: l[1], target: "_blank", rel: "noopener noreferrer", children: l[2] }, r) : a;
   });
 }
 function Q({
   settings: e,
-  edits: l,
+  edits: s,
   onChange: a,
-  externalWarnings: n
+  externalWarnings: r
 }) {
-  return /* @__PURE__ */ t("div", { className: "cedros-settings-grid", children: e.map((s) => /* @__PURE__ */ t(
-    F,
+  return /* @__PURE__ */ t("div", { className: "cedros-settings-grid", children: e.map((l) => /* @__PURE__ */ t(
+    U,
     {
-      setting: s,
-      editValue: l[s.key],
+      setting: l,
+      editValue: s[l.key],
       onChange: a,
-      externalWarning: n?.[s.key]
+      externalWarning: r?.[l.key]
     },
-    s.key
+    l.key
   )) });
 }
-function F({ setting: e, editValue: l, onChange: a, externalWarning: n }) {
-  const s = q[e.key], i = l ?? e.value, p = l !== void 0 && l !== e.value, r = s?.inputType === "boolean", o = S(() => {
-    if (n) return n;
-    if (!s?.warningThreshold) return null;
+function U({ setting: e, editValue: s, onChange: a, externalWarning: r }) {
+  const l = R[e.key], i = s ?? e.value, p = s !== void 0 && s !== e.value, n = l?.inputType === "boolean", o = T(() => {
+    if (r) return r;
+    if (!l?.warningThreshold) return null;
     const c = parseInt(i, 10);
     if (isNaN(c)) return null;
-    const { above: m, below: h, message: y } = s.warningThreshold;
-    return m !== void 0 && c > m || h !== void 0 && c < h ? y : null;
-  }, [i, s?.warningThreshold, n]);
-  return s ? /* @__PURE__ */ t(
+    const { above: m, below: y, message: _ } = l.warningThreshold;
+    return m !== void 0 && c > m || y !== void 0 && c < y ? _ : null;
+  }, [i, l?.warningThreshold, r]);
+  return l ? /* @__PURE__ */ t(
     "div",
     {
-      className: `cedros-setting-row ${p ? "cedros-setting-row-changed" : ""} ${o ? "cedros-setting-row-warning" : ""} ${r ? "cedros-setting-row-toggle" : ""}`,
-      children: r ? /* @__PURE__ */ u(f, { children: [
+      className: `cedros-setting-row ${p ? "cedros-setting-row-changed" : ""} ${o ? "cedros-setting-row-warning" : ""} ${n ? "cedros-setting-row-toggle" : ""}`,
+      children: n ? /* @__PURE__ */ u(f, { children: [
         /* @__PURE__ */ u("div", { className: "cedros-setting-control cedros-setting-control-toggle", children: [
           /* @__PURE__ */ t(
-            P,
+            x,
             {
-              meta: s,
+              meta: l,
               value: i,
               onChange: (c) => a(e.key, c)
             }
@@ -1002,19 +1013,19 @@ function F({ setting: e, editValue: l, onChange: a, externalWarning: n }) {
           o && /* @__PURE__ */ t("div", { className: "cedros-setting-warning", children: o })
         ] }),
         /* @__PURE__ */ u("div", { className: "cedros-setting-label", children: [
-          /* @__PURE__ */ t("span", { className: "cedros-setting-name", children: s.label }),
-          /* @__PURE__ */ t("span", { className: "cedros-setting-description", children: x(s.description) })
+          /* @__PURE__ */ t("span", { className: "cedros-setting-name", children: l.label }),
+          /* @__PURE__ */ t("span", { className: "cedros-setting-description", children: P(l.description) })
         ] })
       ] }) : /* @__PURE__ */ u(f, { children: [
         /* @__PURE__ */ u("div", { className: "cedros-setting-label", children: [
-          /* @__PURE__ */ t("span", { className: "cedros-setting-name", children: s.label }),
-          /* @__PURE__ */ t("span", { className: "cedros-setting-description", children: x(s.description) })
+          /* @__PURE__ */ t("span", { className: "cedros-setting-name", children: l.label }),
+          /* @__PURE__ */ t("span", { className: "cedros-setting-description", children: P(l.description) })
         ] }),
         /* @__PURE__ */ u("div", { className: "cedros-setting-control", children: [
           /* @__PURE__ */ t(
-            P,
+            x,
             {
-              meta: s,
+              meta: l,
               value: i,
               onChange: (c) => a(e.key, c)
             }
@@ -1039,15 +1050,15 @@ function F({ setting: e, editValue: l, onChange: a, externalWarning: n }) {
     ) })
   ] });
 }
-function P({ meta: e, value: l, onChange: a }) {
+function x({ meta: e, value: s, onChange: a }) {
   switch (e.inputType) {
     case "duration":
-      return /* @__PURE__ */ t($, { value: l, onChange: a, presets: e.presets, min: e.min });
+      return /* @__PURE__ */ t(F, { value: s, onChange: a, presets: e.presets, min: e.min });
     case "percentage":
       return /* @__PURE__ */ t(
-        j,
+        W,
         {
-          value: l,
+          value: s,
           onChange: a,
           min: e.min ?? 1,
           max: e.max ?? 100,
@@ -1057,9 +1068,9 @@ function P({ meta: e, value: l, onChange: a }) {
       );
     case "select":
       return /* @__PURE__ */ t(
-        W,
+        q,
         {
-          value: l,
+          value: s,
           onChange: a,
           presets: e.presets ?? [],
           unit: e.unit
@@ -1067,9 +1078,9 @@ function P({ meta: e, value: l, onChange: a }) {
       );
     case "number":
       return /* @__PURE__ */ t(
-        H,
+        $,
         {
-          value: l,
+          value: s,
           onChange: a,
           min: e.min,
           max: e.max,
@@ -1077,48 +1088,48 @@ function P({ meta: e, value: l, onChange: a }) {
         }
       );
     case "tokenList":
-      return /* @__PURE__ */ t(V, { value: l, onChange: a });
+      return /* @__PURE__ */ t(B, { value: s, onChange: a });
     case "text":
       return /* @__PURE__ */ t(
         "input",
         {
           type: "text",
-          value: l,
-          onChange: (n) => a(n.target.value),
+          value: s,
+          onChange: (r) => a(r.target.value),
           className: "cedros-setting-input",
           placeholder: e.label
         }
       );
     case "boolean":
-      return /* @__PURE__ */ t(B, { value: l, onChange: a });
+      return /* @__PURE__ */ t(j, { value: s, onChange: a });
     case "secret":
-      return /* @__PURE__ */ t(J, { value: l, onChange: a, multiline: e.multiline });
+      return /* @__PURE__ */ t(J, { value: s, onChange: a, multiline: e.multiline });
     case "tokenSymbolList":
-      return /* @__PURE__ */ t(G, { value: l, onChange: a });
+      return /* @__PURE__ */ t(G, { value: s, onChange: a });
     default:
       return /* @__PURE__ */ t(
         "input",
         {
           type: "text",
-          value: l,
-          onChange: (n) => a(n.target.value),
+          value: s,
+          onChange: (r) => a(r.target.value),
           className: "cedros-setting-input"
         }
       );
   }
 }
-function $({ value: e, onChange: l, presets: a, min: n = 0 }) {
-  const s = parseInt(e, 10) || 0, i = R(s), p = d(
+function F({ value: e, onChange: s, presets: a, min: r = 0 }) {
+  const l = parseInt(e, 10) || 0, i = M(l), p = d(
     (o) => {
-      o.target.value && l(o.target.value);
+      o.target.value && s(o.target.value);
     },
-    [l]
-  ), r = d(
+    [s]
+  ), n = d(
     (o) => {
-      const c = Math.max(n, parseInt(o.target.value, 10) || 0);
-      l(String(c));
+      const c = Math.max(r, parseInt(o.target.value, 10) || 0);
+      s(String(c));
     },
-    [l, n]
+    [s, r]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-duration-input", children: [
     a && a.length > 0 && /* @__PURE__ */ u(
@@ -1138,9 +1149,9 @@ function $({ value: e, onChange: l, presets: a, min: n = 0 }) {
         "input",
         {
           type: "number",
-          value: s,
-          onChange: r,
-          min: n,
+          value: l,
+          onChange: n,
+          min: r,
           className: "cedros-setting-input cedros-setting-input-sm"
         }
       ),
@@ -1152,24 +1163,24 @@ function $({ value: e, onChange: l, presets: a, min: n = 0 }) {
     ] })
   ] });
 }
-function j({
+function W({
   value: e,
-  onChange: l,
+  onChange: s,
   min: a,
-  max: n,
-  step: s,
+  max: r,
+  step: l,
   presets: i
 }) {
-  const p = parseInt(e, 10) || a, r = d(
+  const p = parseInt(e, 10) || a, n = d(
     (c) => {
-      l(c.target.value);
+      s(c.target.value);
     },
-    [l]
+    [s]
   ), o = d(
     (c) => {
-      l(c);
+      s(c);
     },
-    [l]
+    [s]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-percentage-input", children: [
     /* @__PURE__ */ u("div", { className: "cedros-percentage-slider-row", children: [
@@ -1178,10 +1189,10 @@ function j({
         {
           type: "range",
           value: p,
-          onChange: r,
+          onChange: n,
           min: a,
-          max: n,
-          step: s,
+          max: r,
+          step: l,
           className: "cedros-percentage-slider"
         }
       ),
@@ -1202,32 +1213,32 @@ function j({
     )) })
   ] });
 }
-function W({ value: e, onChange: l, presets: a, unit: n }) {
-  const s = !a.some((r) => r.value === e), i = d(
-    (r) => {
-      r.target.value !== "__custom__" && l(r.target.value);
+function q({ value: e, onChange: s, presets: a, unit: r }) {
+  const l = !a.some((n) => n.value === e), i = d(
+    (n) => {
+      n.target.value !== "__custom__" && s(n.target.value);
     },
-    [l]
+    [s]
   ), p = d(
-    (r) => {
-      l(r.target.value);
+    (n) => {
+      s(n.target.value);
     },
-    [l]
+    [s]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-select-input", children: [
     /* @__PURE__ */ u(
       "select",
       {
-        value: s ? "__custom__" : e,
+        value: l ? "__custom__" : e,
         onChange: i,
         className: "cedros-setting-select",
         children: [
-          a.map((r) => /* @__PURE__ */ t("option", { value: r.value, children: r.label }, r.value)),
+          a.map((n) => /* @__PURE__ */ t("option", { value: n.value, children: n.label }, n.value)),
           /* @__PURE__ */ t("option", { value: "__custom__", children: "Custom..." })
         ]
       }
     ),
-    s && /* @__PURE__ */ u("div", { className: "cedros-select-custom", children: [
+    l && /* @__PURE__ */ u("div", { className: "cedros-select-custom", children: [
       /* @__PURE__ */ t(
         "input",
         {
@@ -1237,16 +1248,16 @@ function W({ value: e, onChange: l, presets: a, unit: n }) {
           className: "cedros-setting-input cedros-setting-input-sm"
         }
       ),
-      n && /* @__PURE__ */ t("span", { className: "cedros-setting-unit", children: n })
+      r && /* @__PURE__ */ t("span", { className: "cedros-setting-unit", children: r })
     ] })
   ] });
 }
-function H({ value: e, onChange: l, min: a, max: n, unit: s }) {
+function $({ value: e, onChange: s, min: a, max: r, unit: l }) {
   const i = d(
     (p) => {
-      l(p.target.value);
+      s(p.target.value);
     },
-    [l]
+    [s]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-number-input", children: [
     /* @__PURE__ */ t(
@@ -1256,17 +1267,17 @@ function H({ value: e, onChange: l, min: a, max: n, unit: s }) {
         value: e,
         onChange: i,
         min: a,
-        max: n,
+        max: r,
         className: "cedros-setting-input"
       }
     ),
-    s && /* @__PURE__ */ t("span", { className: "cedros-setting-unit", children: s })
+    l && /* @__PURE__ */ t("span", { className: "cedros-setting-unit", children: l })
   ] });
 }
-function B({ value: e, onChange: l }) {
-  const a = e === "true", n = d(() => {
-    l(a ? "false" : "true");
-  }, [a, l]);
+function j({ value: e, onChange: s }) {
+  const a = e === "true", r = d(() => {
+    s(a ? "false" : "true");
+  }, [a, s]);
   return /* @__PURE__ */ u(
     "button",
     {
@@ -1274,7 +1285,7 @@ function B({ value: e, onChange: l }) {
       role: "switch",
       "aria-checked": a,
       className: `cedros-toggle ${a ? "cedros-toggle-on" : "cedros-toggle-off"}`,
-      onClick: n,
+      onClick: r,
       children: [
         /* @__PURE__ */ t("span", { className: "cedros-toggle-track", children: /* @__PURE__ */ t("span", { className: "cedros-toggle-thumb" }) }),
         /* @__PURE__ */ t("span", { className: "cedros-toggle-label", children: a ? "Enabled" : "Disabled" })
@@ -1282,18 +1293,18 @@ function B({ value: e, onChange: l }) {
     }
   );
 }
-function J({ value: e, onChange: l, multiline: a }) {
-  const [n, s] = k(!1), [i, p] = k(!1), r = e && e.length > 0, o = d(() => {
-    s(!0), p(!0);
+function J({ value: e, onChange: s, multiline: a }) {
+  const [r, l] = w(!1), [i, p] = w(!1), n = e && e.length > 0, o = d(() => {
+    l(!0), p(!0);
   }, []), c = d(() => {
-    s(!1), p(!1);
+    l(!1), p(!1);
   }, []), m = d(
-    (h) => {
-      l(h.target.value);
+    (y) => {
+      s(y.target.value);
     },
-    [l]
+    [s]
   );
-  return !n && r ? /* @__PURE__ */ u("div", { className: "cedros-secret-input cedros-secret-input-masked", children: [
+  return !r && n ? /* @__PURE__ */ u("div", { className: "cedros-secret-input cedros-secret-input-masked", children: [
     /* @__PURE__ */ t("span", { className: "cedros-secret-masked", children: "•".repeat(Math.min(e.length, 20)) }),
     /* @__PURE__ */ t("button", { type: "button", className: "cedros-secret-edit-btn", onClick: o, children: "Edit" })
   ] }) : /* @__PURE__ */ u("div", { className: "cedros-secret-input", children: [
@@ -1326,50 +1337,50 @@ function J({ value: e, onChange: l, multiline: a }) {
           children: i ? "Hide" : "Show"
         }
       ),
-      n && /* @__PURE__ */ t("button", { type: "button", className: "cedros-secret-done-btn", onClick: c, children: "Done" })
+      r && /* @__PURE__ */ t("button", { type: "button", className: "cedros-secret-done-btn", onClick: c, children: "Done" })
     ] })
   ] });
 }
-function V({ value: e, onChange: l }) {
-  const a = S(() => {
+function B({ value: e, onChange: s }) {
+  const a = T(() => {
     try {
       return JSON.parse(e || "[]");
     } catch {
       return [];
     }
-  }, [e]), n = d(
-    (r) => {
-      l(JSON.stringify(r));
+  }, [e]), r = d(
+    (n) => {
+      s(JSON.stringify(n));
     },
-    [l]
-  ), s = d(() => {
-    n([...a, { symbol: "", mint: "", decimals: 6 }]);
-  }, [a, n]), i = d(
-    (r, o, c) => {
+    [s]
+  ), l = d(() => {
+    r([...a, { symbol: "", mint: "", decimals: 6 }]);
+  }, [a, r]), i = d(
+    (n, o, c) => {
       const m = [...a];
-      m[r] = { ...m[r], [o]: c }, n(m);
+      m[n] = { ...m[n], [o]: c }, r(m);
     },
-    [a, n]
+    [a, r]
   ), p = d(
-    (r) => {
-      n(a.filter((o, c) => c !== r));
+    (n) => {
+      r(a.filter((o, c) => c !== n));
     },
-    [a, n]
+    [a, r]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-token-list-input", children: [
     /* @__PURE__ */ u("div", { className: "cedros-token-presets", children: [
       /* @__PURE__ */ t("span", { className: "cedros-token-presets-label", children: "Built-in tokens:" }),
-      /* @__PURE__ */ t("div", { className: "cedros-token-presets-list", children: L.map((r) => /* @__PURE__ */ t("span", { className: "cedros-token-preset-chip", children: r }, r)) })
+      /* @__PURE__ */ t("div", { className: "cedros-token-presets-list", children: C.map((n) => /* @__PURE__ */ t("span", { className: "cedros-token-preset-chip", children: n }, n)) })
     ] }),
     a.length === 0 && /* @__PURE__ */ t("p", { className: "cedros-token-list-empty", children: "No custom tokens added. Use the built-in tokens above or add your own." }),
-    a.map((r, o) => /* @__PURE__ */ u("div", { className: "cedros-token-row", children: [
+    a.map((n, o) => /* @__PURE__ */ u("div", { className: "cedros-token-row", children: [
       /* @__PURE__ */ u("div", { className: "cedros-token-row-fields", children: [
         /* @__PURE__ */ t(
           "input",
           {
             type: "text",
             placeholder: "Symbol",
-            value: r.symbol,
+            value: n.symbol,
             onChange: (c) => i(o, "symbol", c.target.value.toUpperCase()),
             className: "cedros-setting-input cedros-token-input-symbol",
             maxLength: 10
@@ -1380,7 +1391,7 @@ function V({ value: e, onChange: l }) {
           {
             type: "text",
             placeholder: "Mint address",
-            value: r.mint,
+            value: n.mint,
             onChange: (c) => i(o, "mint", c.target.value),
             className: "cedros-setting-input cedros-token-input-mint"
           }
@@ -1390,7 +1401,7 @@ function V({ value: e, onChange: l }) {
           {
             type: "number",
             placeholder: "Decimals",
-            value: r.decimals,
+            value: n.decimals,
             onChange: (c) => i(o, "decimals", parseInt(c.target.value, 10) || 0),
             className: "cedros-setting-input cedros-token-input-decimals",
             min: 0,
@@ -1402,7 +1413,7 @@ function V({ value: e, onChange: l }) {
           {
             type: "text",
             placeholder: "Logo URL (optional)",
-            value: r.logoUrl || "",
+            value: n.logoUrl || "",
             onChange: (c) => i(o, "logoUrl", c.target.value || void 0),
             className: "cedros-setting-input cedros-token-input-logo"
           }
@@ -1419,35 +1430,35 @@ function V({ value: e, onChange: l }) {
         }
       )
     ] }, o)),
-    /* @__PURE__ */ t("button", { type: "button", className: "cedros-token-add-btn", onClick: s, children: "+ Add Token" })
+    /* @__PURE__ */ t("button", { type: "button", className: "cedros-token-add-btn", onClick: l, children: "+ Add Token" })
   ] });
 }
-function G({ value: e, onChange: l }) {
-  const a = S(() => e.split(",").map((i) => i.trim()).filter(Boolean), [e]), n = d(
+function G({ value: e, onChange: s }) {
+  const a = T(() => e.split(",").map((i) => i.trim()).filter(Boolean), [e]), r = d(
     (i) => {
       if (!i || a.includes(i)) return;
       const p = [...a, i].join(", ");
-      l(p);
+      s(p);
     },
-    [a, l]
-  ), s = d(
+    [a, s]
+  ), l = d(
     (i) => {
-      const p = a.filter((r) => r !== i).join(", ");
-      l(p);
+      const p = a.filter((n) => n !== i).join(", ");
+      s(p);
     },
-    [a, l]
+    [a, s]
   );
   return /* @__PURE__ */ u("div", { className: "cedros-token-symbol-list-input", children: [
     /* @__PURE__ */ u("div", { className: "cedros-token-presets", children: [
       /* @__PURE__ */ t("span", { className: "cedros-token-presets-label", children: "Click to add:" }),
-      /* @__PURE__ */ t("div", { className: "cedros-token-presets-list", children: L.map((i) => {
+      /* @__PURE__ */ t("div", { className: "cedros-token-presets-list", children: C.map((i) => {
         const p = a.includes(i);
         return /* @__PURE__ */ u(
           "button",
           {
             type: "button",
             className: `cedros-token-preset-chip ${p ? "cedros-token-preset-chip-selected" : ""}`,
-            onClick: () => p ? s(i) : n(i),
+            onClick: () => p ? l(i) : r(i),
             title: p ? `Remove ${i}` : `Add ${i}`,
             children: [
               i,
@@ -1463,14 +1474,76 @@ function G({ value: e, onChange: l }) {
       {
         type: "text",
         value: e,
-        onChange: (i) => l(i.target.value),
+        onChange: (i) => s(i.target.value),
         className: "cedros-setting-input",
         placeholder: "USDC, SOL, BONK..."
       }
     )
   ] });
 }
-function Z({ status: e, error: l }) {
+const H = 800, V = 2e3;
+function Z() {
+  const { settings: e, isLoading: s, error: a, fetchSettings: r, updateSettings: l } = E(), [i, p] = w({}), [n, o] = w("idle"), [c, m] = w(null), y = S(null), _ = S(null), k = S({});
+  O(() => () => {
+    y.current && clearTimeout(y.current), _.current && clearTimeout(_.current);
+  }, []);
+  const N = d(async () => {
+    const h = { ...k.current };
+    if (Object.keys(h).length === 0) {
+      o("idle");
+      return;
+    }
+    o("saving"), m(null);
+    const v = Object.entries(h).map(([b, g]) => ({
+      key: b,
+      value: g
+    }));
+    try {
+      await l(v), p((b) => {
+        const g = { ...b };
+        for (const D of Object.keys(h))
+          delete g[D];
+        return g;
+      });
+      for (const b of Object.keys(h))
+        delete k.current[b];
+      o("saved"), _.current && clearTimeout(_.current), _.current = setTimeout(() => {
+        o("idle");
+      }, V);
+    } catch (b) {
+      o("error"), m(b instanceof Error ? b.message : "Failed to save");
+    }
+  }, [l]), A = d(
+    (h, v) => {
+      p((b) => ({ ...b, [h]: v })), k.current[h] = v, m(null), o("pending"), y.current && clearTimeout(y.current), y.current = setTimeout(() => {
+        N();
+      }, H);
+    },
+    [N]
+  ), L = d(
+    (h) => {
+      if (i[h] !== void 0) return i[h];
+      for (const v of Object.values(e)) {
+        const b = v.find((g) => g.key === h);
+        if (b) return b.value;
+      }
+      return "";
+    },
+    [i, e]
+  );
+  return {
+    settings: e,
+    edits: i,
+    isLoading: s,
+    autosaveStatus: n,
+    autosaveError: c,
+    error: a,
+    fetchSettings: r,
+    handleChange: A,
+    getEffectiveValue: L
+  };
+}
+function ee({ status: e, error: s }) {
   return e === "idle" ? null : /* @__PURE__ */ u("div", { className: `cedros-autosave-status cedros-autosave-status--${e}`, children: [
     e === "pending" && /* @__PURE__ */ u(f, { children: [
       /* @__PURE__ */ t("span", { className: "cedros-autosave-dot" }),
@@ -1486,12 +1559,14 @@ function Z({ status: e, error: l }) {
     ] }),
     e === "error" && /* @__PURE__ */ u(f, { children: [
       /* @__PURE__ */ t("span", { className: "cedros-autosave-error-icon", children: "!" }),
-      /* @__PURE__ */ t("span", { children: l || "Save failed" })
+      /* @__PURE__ */ t("span", { children: s || "Save failed" })
     ] })
   ] });
 }
 export {
-  Z as A,
+  ee as A,
+  X as C,
   Q as S,
-  X as u
+  R as a,
+  Z as u
 };