@versini/sassysaint 8.45.4 → 8.45.6

package/dist/chunks/SettingsEntry.CIijARba.js

@@ -0,0 +1,889 @@
+import { jsxs as g, jsx as a } from "react/jsx-runtime";
+import { o as pe, h as ie, i as ge, x as ye, n as be, getCacheInfo as xe, isServiceWorkerEnabled as ke, SETTINGS_TITLE as we, S as H, CARDS as O, Oe as Ne, C as se, PROMPTS_DESCRIPTION as Ee, L as Te, j as de, getCurrentGeoLocation as ve, handleServiceWorkerToggle as Se } from "./index.Ddqbg8Ks.js";
+import { useUserPreferences as Ce, se as Ie, mutateCall as ue, SERVICE_TYPES as me } from "./App.Cwzj_7TG.js";
+import _e, { useState as f, useEffect as ne, useRef as U, useLayoutEffect as q, useCallback as Le } from "react";
+import c from "clsx";
+function Me({
+  value: e,
+  defaultValue: s,
+  finalValue: o,
+  onChange: l = () => {
+  },
+  initialControlledDelay: r = 0
+}) {
+  const [n, u] = f(!1), [h, x] = f(
+    s !== void 0 ? s : o
+  ), k = (m) => {
+    x(m), l?.(m);
+  };
+  return ne(() => {
+    (async () => e !== void 0 && !n && r > 0 && (await new Promise(
+      (m) => setTimeout(m, r)
+    ), u(!0)))();
+  }, [e, r, n]), e !== void 0 ? !n && r > 0 ? ["", l, !0] : [e, l, !0] : [h, k, !1];
+}
+const fe = "av-text-area", Pe = "av-text-area-wrapper", le = "av-text-area-helper-text", Ae = "av-text-area__control--right", Oe = "av-text-area__control--left", Be = () => "rounded-md text-base h-20 min-h-[80px] resize-none overflow-hidden px-4 py-7", De = ({ mode: e }) => c({
+  "bg-surface-darker text-copy-lighter caret-copy-light": e === "dark",
+  "bg-surface-lighter text-copy-dark caret-copy-dark": e === "light",
+  "bg-surface-lighter text-copy-dark caret-copy-dark dark:bg-surface-darker dark:text-copy-lighter dark:caret-copy-light": e === "system",
+  "bg-surface-darker text-copy-lighter caret-copy-light dark:bg-surface-lighter dark:text-copy-dark dark:caret-copy-dark": e === "alt-system"
+}), Re = ({
+  focusMode: e
+}) => c("focus:outline focus:outline-2 focus:outline-offset-2", {
+  "focus:outline-focus-dark": e === "dark",
+  "focus:outline-focus-light": e === "light",
+  "focus:outline-focus-light dark:focus:outline-focus-dark": e === "alt-system",
+  "focus:outline-focus-dark dark:focus:outline-focus-light": e === "system"
+}), Ge = ({
+  noBorder: e,
+  error: s
+}) => c("border-2", {
+  "border-border-dark": !e && !s,
+  "focus:border-border-dark": !e && s,
+  "border-border-error-dark": !e && s,
+  "border-transparent": e
+}), He = ({
+  disabled: e,
+  raw: s,
+  error: o,
+  mode: l,
+  leftElement: r,
+  rightElement: n
+}) => {
+  if (s)
+    return "";
+  if (e)
+    return c(
+      "transform translate-y-0 scale-100 absolute px-2 cursor-not-allowed opacity-50 font-medium",
+      {
+        "translate-x-[12px]": n === !0 && !r || !n && !r
+      }
+    );
+  if (!o)
+    return c(
+      "absolute px-2 cursor-text font-medium transform translate-y-0 scale-100",
+      {
+        "translate-x-[12px]": n === !0 && !r || !n && !r,
+        "text-copy-medium": l === "dark",
+        "text-copy-dark": l === "light",
+        "text-copy-dark dark:text-copy-medium": l === "system",
+        "text-copy-medium dark:text-copy-dark": l === "alt-system"
+      }
+    );
+  if (o)
+    return c(
+      "absolute px-2 cursor-text font-medium transform translate-y-0 scale-100",
+      {
+        "translate-x-[12px]": n === !0 && !r || !n && !r,
+        "text-copy-medium": l === "dark",
+        "text-copy-error-dark": l === "light",
+        "text-copy-error-dark dark:text-copy-error-light": l === "system",
+        "text-copy-medium dark:text-copy-error-dark": l === "alt-system"
+      }
+    );
+}, Ue = ({
+  error: e,
+  raw: s,
+  mode: o,
+  disabled: l
+}) => {
+  if (s)
+    return "";
+  if (l)
+    return c(
+      le,
+      "absolute px-2 cursor-not-allowed opacity-50 font-medium"
+    );
+  if (!e)
+    return c(le, "absolute px-2 font-medium", {
+      "text-copy-medium": o === "dark",
+      "text-copy-dark": o === "light",
+      "text-copy-dark dark:text-copy-medium": o === "system",
+      "text-copy-medium dark:text-copy-dark": o === "alt-system"
+    });
+  if (e)
+    return c(le, "absolute px-2 font-medium", {
+      "text-copy-error-light": o === "dark",
+      "text-copy-error-dark": o === "light",
+      "text-copy-error-dark dark:text-copy-error-light": o === "system",
+      "dark:text-copy-error-dark text-copy-error-light": o === "alt-system"
+    });
+}, Ve = ({
+  className: e,
+  textAreaClassName: s,
+  raw: o,
+  focusMode: l,
+  disabled: r,
+  noBorder: n,
+  error: u,
+  mode: h,
+  leftElement: x,
+  rightElement: k
+}) => {
+  const m = o ? e : c(
+    "relative flex w-full flex-col justify-center",
+    Pe,
+    e
+  ), T = o ? c(s) : c(
+    fe,
+    s,
+    Be(),
+    De({ mode: h }),
+    Re({ focusMode: l }),
+    Ge({
+      noBorder: n,
+      error: u
+    }),
+    {
+      "disabled:cursor-not-allowed disabled:opacity-50": r
+    }
+  ), C = o ? void 0 : "sr-only", D = He({
+    disabled: r,
+    raw: o,
+    error: u,
+    mode: h,
+    rightElement: k,
+    leftElement: x
+  }), y = Ue({
+    error: u,
+    raw: o,
+    mode: h,
+    disabled: r
+  }), I = o ? void 0 : c(Ae, "absolute"), w = o ? void 0 : c(Oe, "absolute");
+  return {
+    wrapper: m,
+    textArea: T,
+    accessibleLabel: C,
+    visibleLabel: D,
+    helperText: y,
+    rightElement: I,
+    leftElement: w
+  };
+}, $e = ({
+  scrollHeight: e,
+  currentHeight: s,
+  currentLabelOffset: o = 0,
+  currentHelperTextOffset: l = 0
+}) => {
+  let r, n;
+  if (e > 0 && e !== s) {
+    const u = e - s, h = Math.abs(u / 24);
+    r = o + -1 * Math.sign(u) * (12 * h), n = l + Math.sign(u) * (12 * h);
+  }
+  return {
+    labelOffset: r,
+    helperTextOffset: n,
+    scrollHeight: e
+  };
+}, ce = _e.forwardRef(
+  ({
+    id: e,
+    name: s,
+    label: o,
+    error: l = !1,
+    raw: r = !1,
+    className: n,
+    textAreaClassName: u,
+    mode: h = "system",
+    focusMode: x = "system",
+    value: k,
+    defaultValue: m,
+    disabled: T = !1,
+    noBorder: C = !1,
+    labelId: D,
+    helperText: y = "",
+    helperTextOnFocus: I = !1,
+    rightElement: w,
+    leftElement: v,
+    onChange: V,
+    onFocus: L,
+    onBlur: $,
+    ...R
+  }, J) => {
+    const p = U(null), K = pe([J, p]), [Q, M] = ie(), [Z, S] = ie(), W = U(80), ee = U(-25), G = U(null), re = U(30), te = U(null), P = ge({ id: e, prefix: `${fe}-` }), [z, j] = f(0), [F, t] = f(0), [d, _] = f(
+      !!(!I && y)
+    ), Y = `${s} error, ${y}`, b = Ve({
+      className: n,
+      textAreaClassName: u,
+      error: l,
+      raw: r,
+      focusMode: x,
+      disabled: T,
+      noBorder: C,
+      mode: h,
+      rightElement: !!w,
+      leftElement: !!v
+    }), [i, N] = Me({
+      value: k,
+      initialControlledDelay: 20,
+      defaultValue: m,
+      onChange: (E) => {
+        V && V({
+          target: {
+            value: E
+          }
+        });
+      }
+    }), A = (E) => {
+      N(E.target.value);
+    }, X = (E) => {
+      I && y && _(!0), L && L(E);
+    }, ae = (E) => {
+      I && y && !i && _(!1), $ && $(E);
+    };
+    return q(() => {
+      M && M.width && j(M.width + 18 + 10);
+    }, [M]), q(() => {
+      S && S.width && t(S.width + 18 + 10);
+    }, [S]), q(() => {
+      r || p && p.current && i !== void 0 && (p.current.style.height = "inherit", p.current.style.height = p.current.scrollHeight + "px");
+    }, [i, r]), q(() => {
+      r || setTimeout(() => {
+        G?.current?.style.setProperty(
+          "--av-text-area-wrapper-transition",
+          i ? "none" : "all 0.2s ease-out"
+        );
+      }, 0);
+    }, [i, r]), q(() => {
+      if (!r && p && p.current && i !== void 0) {
+        const { labelOffset: E, helperTextOffset: oe, scrollHeight: he } = $e({
+          scrollHeight: p.current.scrollHeight,
+          currentHeight: W.current,
+          currentLabelOffset: ee.current,
+          currentHelperTextOffset: re.current
+        });
+        E && (ee.current = E, G?.current?.style.setProperty(
+          "--av-text-area-label",
+          `${E}px`
+        )), oe && (re.current = oe, te?.current?.style.setProperty(
+          "--av-text-area-helper-text",
+          `${oe}px`
+        )), W.current = he || W.current;
+      }
+    }, [i, r]), S.width > 0 && G?.current?.style.setProperty(
+      "--tw-translate-x",
+      `${12 + S.width + 5}px`
+    ), /* @__PURE__ */ g("div", { className: b.wrapper, children: [
+      /* @__PURE__ */ a(
+        "label",
+        {
+          htmlFor: P,
+          id: D,
+          className: b.accessibleLabel,
+          children: o
+        }
+      ),
+      v && /* @__PURE__ */ a(
+        "div",
+        {
+          ref: Z,
+          className: b.leftElement,
+          children: v
+        }
+      ),
+      /* @__PURE__ */ a(
+        "textarea",
+        {
+          ref: K,
+          id: P,
+          name: s,
+          disabled: T,
+          placeholder: r ? void 0 : " ",
+          className: b.textArea,
+          rows: 1,
+          ...y && { "aria-describedby": `${P}-helper` },
+          ...l && { "aria-invalid": "true" },
+          ...w && !v && !r && { style: { paddingRight: z } },
+          ...v && !w && !r && { style: { paddingLeft: F } },
+          ...w && v && !r && {
+            style: {
+              paddingRight: z,
+              paddingLeft: F
+            }
+          },
+          value: i,
+          onChange: A,
+          onFocus: X,
+          onBlur: ae,
+          ...R
+        }
+      ),
+      !r && /* @__PURE__ */ a(
+        "label",
+        {
+          ref: G,
+          "aria-hidden": !0,
+          htmlFor: P,
+          className: `${b.visibleLabel}`,
+          children: o
+        }
+      ),
+      d && /* @__PURE__ */ a(
+        "div",
+        {
+          ref: te,
+          id: `${P}-helper`,
+          className: b.helperText,
+          children: y
+        }
+      ),
+      w && /* @__PURE__ */ a(
+        "div",
+        {
+          ref: Q,
+          className: b.rightElement,
+          children: w
+        }
+      ),
+      l && y && /* @__PURE__ */ a(ye, { politeness: "polite", clearAnnouncementDelay: 500, children: Y })
+    ] });
+  }
+);
+ce.displayName = "TextArea";
+/*!
+  @versini/ui-textarea v5.0.1
+  © 2025 gizmette.com
+*/
+try {
+  window.__VERSINI_UI_TEXTAREA__ || (window.__VERSINI_UI_TEXTAREA__ = {
+    version: "5.0.1",
+    buildTime: "09/01/2025 04:01 PM EDT",
+    homepage: "https://github.com/aversini/ui-components",
+    license: "MIT"
+  });
+} catch {
+}
+const We = "av-toggle", ze = ({ narrow: e }) => c(
+  "peer",
+  "rounded-full",
+  {
+    "h-6 w-11": !e,
+    "h-5 w-12": e
+  },
+  // Smooth background/border transition when toggling
+  "transition-colors duration-300 ease-in-out motion-reduce:transition-none"
+), je = ({
+  focusMode: e
+}) => c(
+  "peer-focus:outline",
+  "peer-focus:outline-2",
+  "peer-focus:outline-offset-2",
+  {
+    "peer-focus:outline-focus-dark": e === "dark",
+    "peer-focus:outline-focus-light": e === "light",
+    "peer-focus:outline-focus-light dark:peer-focus:outline-focus-dark": e === "alt-system",
+    "peer-focus:outline-focus-dark dark:peer-focus:outline-focus-light": e === "system"
+  }
+), Fe = ({ narrow: e }) => c(
+  {
+    "peer-checked:after:translate-x-full": !e,
+    "peer-checked:after:translate-x-4": e
+  },
+  // background color when checked
+  "peer-checked:bg-action-light",
+  // knob circle and border color when checked
+  "peer-checked:after:bg-white",
+  "peer-checked:after:border-white"
+), Ye = ({ narrow: e }) => c(
+  "after:left-[2px]",
+  "after:top-[2px]",
+  "after:border",
+  "after:border-surface-light dark:after:border-surface-medium",
+  "after:bg-surface-light dark:after:bg-surface-medium",
+  "after:absolute",
+  "after:transition-all after:duration-300 after:ease-in-out after:motion-reduce:transition-none after:will-change-transform",
+  "after:content-['']",
+  "after:rounded-full",
+  {
+    // Normal toggle knob (circle)
+    "after:h-5 after:w-5": !e,
+    // Narrow toggle knob (oval)
+    " after:h-4 after:w-7": e
+  }
+), Xe = ({
+  mode: e,
+  noBorder: s
+}) => c({
+  border: !s,
+  "border-border-medium bg-surface-medium": e === "light",
+  "border-border-light bg-surface-darker": e === "dark",
+  "border-border-light bg-surface-darker dark:border-border-dark dark:bg-surface-medium": e === "alt-system",
+  "border-border-medium bg-surface-medium dark:border-border-light dark:bg-surface-darker": e === "system"
+}), qe = ({
+  mode: e,
+  labelHidden: s
+}) => s ? "sr-only" : c("ml-2 text-sm", {
+  "text-copy-dark": e === "light",
+  "text-copy-lighter": e === "dark",
+  "text-copy-lighter dark:text-copy-dark": e === "alt-system",
+  "text-copy-dark dark:text-copy-lighter": e === "system"
+}), Je = ({ className: e }) => c(
+  We,
+  "relative flex cursor-pointer items-center",
+  e
+), Ke = ({
+  mode: e,
+  focusMode: s,
+  labelHidden: o,
+  className: l,
+  noBorder: r,
+  narrow: n
+}) => ({
+  toggle: c(
+    ze({ narrow: n }),
+    Xe({ mode: e, noBorder: r }),
+    je({ focusMode: s }),
+    Ye({ narrow: n }),
+    Fe({ narrow: n })
+  ),
+  label: qe({ mode: e, labelHidden: o }),
+  input: "peer sr-only",
+  wrapper: Je({ className: l })
+}), B = ({
+  checked: e = !1,
+  onChange: s,
+  label: o,
+  labelHidden: l = !1,
+  name: r,
+  mode: n = "system",
+  focusMode: u = "system",
+  className: h,
+  noBorder: x = !1,
+  narrow: k = !1
+}) => {
+  const m = Ke({
+    mode: n,
+    focusMode: u,
+    labelHidden: l,
+    className: h,
+    noBorder: x,
+    narrow: k
+  }), T = (C) => {
+    s?.(C.target.checked);
+  };
+  return /* @__PURE__ */ g("label", { className: m.wrapper, children: [
+    /* @__PURE__ */ a(
+      "input",
+      {
+        name: r,
+        checked: e,
+        type: "checkbox",
+        className: m.input,
+        onChange: T
+      }
+    ),
+    /* @__PURE__ */ a("div", { className: m.toggle }),
+    /* @__PURE__ */ a("span", { className: m.label, children: o })
+  ] });
+};
+/*!
+  @versini/ui-toggle v5.0.1
+  © 2025 gizmette.com
+*/
+try {
+  window.__VERSINI_UI_TOGGLE__ || (window.__VERSINI_UI_TOGGLE__ = {
+    version: "5.0.1",
+    buildTime: "09/01/2025 04:01 PM EDT",
+    homepage: "https://github.com/aversini/ui-components",
+    license: "MIT"
+  });
+} catch {
+}
+const ar = ({
+  open: e,
+  onOpenChange: s
+}) => {
+  const { getAccessToken: o, user: l } = be(), {
+    data: r,
+    isSuccess: n,
+    refetch: u
+  } = Ce({
+    user: l?.username,
+    getAccessToken: o
+  }), [h, x] = f({
+    loadingLocation: !1
+  }), [k, m] = f({
+    prompts: []
+  }), [T, C] = f(""), [D, y] = f(""), [I, w] = f(!1), [v, V] = f(!1), [L, $] = f(!1), [R, J] = f(!1), [p, K] = f(null), [Q, M] = f(!1), [Z, S] = f(!1), W = (t) => {
+    S(t);
+  }, ee = (t) => {
+    w(t);
+  }, G = (t) => {
+    V(t);
+  }, re = (t) => {
+    J(t);
+  }, te = async (t) => {
+    t.preventDefault();
+    try {
+      await ue({
+        accessToken: await o(),
+        type: me.SET_USER_PREFERENCES,
+        params: {
+          user: l?.username,
+          instructions: T,
+          location: D,
+          provider: r?.provider,
+          tags: k.prompts,
+          sendOnEnter: I,
+          useMemory: v,
+          showDetails: Z
+        }
+      }), R !== L && (await Se(R), $(R)), u(), x({
+        loadingLocation: !1
+      });
+    } catch {
+    }
+  }, P = async () => {
+    x({
+      loadingLocation: !0
+    }), y("...");
+    try {
+      const t = Date.now(), d = await ve(), _ = await ue({
+        accessToken: await o(),
+        type: me.GET_LOCATION,
+        params: {
+          latitude: d.latitude,
+          longitude: d.longitude
+        }
+      }), b = Date.now() - t;
+      if (b < 2e3 && await new Promise((i) => setTimeout(i, 2e3 - b)), _.status === 200) {
+        const { city: i, state: N, country: A, displayName: X } = _.data, ae = i && N && A ? `${i}, ${N}, ${A}` : X;
+        x({
+          loadingLocation: !1
+        }), y(ae);
+      } else
+        x({
+          loadingLocation: !1
+        });
+    } catch {
+    }
+  }, z = () => {
+    u(), s(!1);
+  }, j = ({
+    enabled: t = !1,
+    privateChat: d = !1,
+    clipboardAccess: _ = !1,
+    ...Y
+  }) => {
+    m((b) => {
+      const i = b.prompts, N = {
+        ...Y,
+        enabled: t,
+        privateChat: d,
+        clipboardAccess: _
+      };
+      _ ? N.content = N.content.replace(/{{clipboard}}/g, "") + " {{clipboard}}" : N.content = N.content.replace(/{{clipboard}}/g, "");
+      const A = i.findIndex((X) => X.slot === Y.slot);
+      return A === -1 ? {
+        ...b,
+        prompts: [...i, { ...N }]
+      } : (i[A] = N, {
+        ...b,
+        prompts: [...i]
+      });
+    });
+  }, F = Le(async () => {
+    try {
+      M(!0);
+      const t = await xe();
+      K(t);
+    } catch {
+    } finally {
+      M(!1);
+    }
+  }, []);
+  return ne(() => {
+    if (!r)
+      return;
+    r.instructions && C(r.instructions), r.location && y(r.location), r.tags && m({ prompts: r.tags }), r.sendOnEnter !== void 0 && w(r.sendOnEnter), r.useMemory !== void 0 && V(r.useMemory), r.showDetails !== void 0 && S(r.showDetails);
+    const t = ke();
+    $(t), J(t);
+  }, [r]), ne(() => {
+    L ? F() : K(null);
+  }, [L, F]), n ? /* @__PURE__ */ g(
+    Ie,
+    {
+      open: e,
+      onOpenChange: z,
+      title: we,
+      animation: !0,
+      animationType: "fade",
+      footer: /* @__PURE__ */ g(
+        Te,
+        {
+          columnGap: 2,
+          alignHorizontal: "flex-end",
+          className: "pb-8 sm:pb-0",
+          children: [
+            /* @__PURE__ */ a(de, { children: /* @__PURE__ */ a(
+              se,
+              {
+                mode: "dark",
+                variant: "secondary",
+                focusMode: "light",
+                noBorder: !0,
+                onClick: z,
+                children: "Cancel"
+              }
+            ) }),
+            /* @__PURE__ */ a(de, { children: /* @__PURE__ */ a(
+              se,
+              {
+                mode: "dark",
+                focusMode: "light",
+                onClick: async (t) => {
+                  s(!1), await te(t);
+                },
+                children: "Save"
+              }
+            ) })
+          ]
+        }
+      ),
+      children: [
+        /* @__PURE__ */ g(
+          H,
+          {
+            header: O.SETTINGS_DETAILS.TITLE,
+            className: "prose-dark dark:prose-lighter",
+            noBorder: !0,
+            children: [
+              /* @__PURE__ */ a("p", { className: "text-sm", children: O.SETTINGS_DETAILS.DETAILS }),
+              /* @__PURE__ */ a(
+                B,
+                {
+                  narrow: !0,
+                  className: "mt-2",
+                  label: "Show Message Statistics",
+                  name: "show-message-statistics",
+                  onChange: W,
+                  checked: Z
+                }
+              ),
+              /* @__PURE__ */ a("p", { className: "text-sm mt-5", children: O.SETTINGS_DETAILS.SEND_ON_ENTER }),
+              /* @__PURE__ */ a(
+                B,
+                {
+                  narrow: !0,
+                  className: "mt-2",
+                  label: "Send Message on Enter",
+                  name: "send-message-on-enter",
+                  onChange: ee,
+                  checked: I
+                }
+              ),
+              /* @__PURE__ */ a("p", { className: "text-sm mt-5", children: O.SETTINGS_DETAILS.USE_MEMORY }),
+              /* @__PURE__ */ a(
+                B,
+                {
+                  narrow: !0,
+                  className: "mt-2",
+                  label: "Use Memory",
+                  name: "use-memory",
+                  onChange: G,
+                  checked: v
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ g(
+          H,
+          {
+            header: "Custom Instructions",
+            className: "prose-dark dark:prose-lighter mt-4",
+            noBorder: !0,
+            children: [
+              /* @__PURE__ */ g("p", { className: "text-sm", children: [
+                "What would you like ",
+                /* @__PURE__ */ a("em", { children: Ne }),
+                " to know about you to provide better responses?"
+              ] }),
+              /* @__PURE__ */ a(
+                ce,
+                {
+                  mode: "alt-system",
+                  autoCapitalize: "off",
+                  autoComplete: "off",
+                  autoCorrect: "off",
+                  name: "customInstructions",
+                  label: "Custom Instructions",
+                  value: T,
+                  onChange: (t) => {
+                    C(t.target.value);
+                  },
+                  helperText: "Press ENTER to add a new line."
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ g(
+          H,
+          {
+            header: "Location",
+            className: "prose-dark dark:prose-lighter mt-4",
+            noBorder: !0,
+            children: [
+              /* @__PURE__ */ a("p", { className: "text-sm", children: "You can share your location to receive customized responses based on your area." }),
+              /* @__PURE__ */ a(
+                ce,
+                {
+                  mode: "alt-system",
+                  name: "location",
+                  label: "Location",
+                  value: D,
+                  onChange: (t) => {
+                    y(t.target.value);
+                  },
+                  helperText: "Enter your location or press auto-detect."
+                }
+              ),
+              /* @__PURE__ */ a(
+                se,
+                {
+                  className: "mt-2",
+                  size: "small",
+                  noBorder: !0,
+                  variant: "secondary",
+                  disabled: h.loadingLocation,
+                  onClick: P,
+                  children: h.loadingLocation ? "Detecting..." : "Auto-detect"
+                }
+              )
+            ]
+          }
+        ),
+        /* @__PURE__ */ g(
+          H,
+          {
+            header: O.SETTINGS_PROMPTS.TITLE,
+            className: "prose-dark dark:prose-lighter mt-4",
+            noBorder: !0,
+            children: [
+              /* @__PURE__ */ a("p", { className: "text-sm", children: Ee }),
+              k.prompts && k.prompts.slice(0, 3).map((t) => /* @__PURE__ */ g(
+                H,
+                {
+                  mode: "dark",
+                  noBorder: !0,
+                  header: t.label.replace("...", ""),
+                  className: "prose-light mb-2",
+                  children: [
+                    /* @__PURE__ */ a("p", { className: "text-sm", children: t.description }),
+                    /* @__PURE__ */ a(
+                      B,
+                      {
+                        narrow: !0,
+                        mode: "dark",
+                        focusMode: "light",
+                        className: "mt-2",
+                        noBorder: !0,
+                        label: "Enabled",
+                        name: t.slot.toString(),
+                        onChange: (d) => {
+                          j({
+                            ...t,
+                            enabled: d
+                          });
+                        },
+                        checked: t.enabled
+                      }
+                    ),
+                    /* @__PURE__ */ a(
+                      B,
+                      {
+                        narrow: !0,
+                        mode: "dark",
+                        focusMode: "light",
+                        className: "mt-2",
+                        noBorder: !0,
+                        label: "Private Chat",
+                        name: `private-${t.slot.toString()}`,
+                        onChange: (d) => {
+                          j({
+                            ...t,
+                            privateChat: d
+                          });
+                        },
+                        checked: t.privateChat
+                      }
+                    ),
+                    /* @__PURE__ */ a(
+                      B,
+                      {
+                        narrow: !0,
+                        mode: "dark",
+                        focusMode: "light",
+                        className: "mt-2",
+                        noBorder: !0,
+                        label: "Use Clipboard",
+                        name: `clipboard-${t.slot.toString()}`,
+                        onChange: (d) => {
+                          j({
+                            ...t,
+                            clipboardAccess: d
+                          });
+                        },
+                        checked: t.clipboardAccess
+                      }
+                    )
+                  ]
+                },
+                `prompt-slot-${t.slot}`
+              ))
+            ]
+          }
+        ),
+        /* @__PURE__ */ g(
+          H,
+          {
+            header: O.SETTINGS_CACHING.TITLE,
+            className: "prose-dark dark:prose-lighter mt-4 ",
+            noBorder: !0,
+            children: [
+              /* @__PURE__ */ a("p", { className: "text-sm", children: O.SETTINGS_CACHING.DESCRIPTION }),
+              /* @__PURE__ */ a(
+                B,
+                {
+                  narrow: !0,
+                  className: "mt-2",
+                  label: "Enable Assets Caching",
+                  name: "enable-service-worker",
+                  onChange: re,
+                  checked: R
+                }
+              ),
+              L && /* @__PURE__ */ g("div", { className: "mt-4 p-3 border border-dashed border-neutral-700 dark:border-neutral-400 rounded @container/optimizations", children: [
+                /* @__PURE__ */ a("h3", { className: "m-0 mb-2 text-xs uppercase opacity-70", children: "Cache Info" }),
+                p ? /* @__PURE__ */ g("div", { className: "text-xs space-y-2", children: [
+                  /* @__PURE__ */ g("p", { className: "m-0", children: [
+                    "Version: ",
+                    /* @__PURE__ */ a("strong", { children: p.version })
+                  ] }),
+                  /* @__PURE__ */ g("p", { className: "m-0", children: [
+                    "Total Items: ",
+                    /* @__PURE__ */ a("strong", { children: p.totalItems })
+                  ] }),
+                  p.caches.map((t) => /* @__PURE__ */ a("div", { children: /* @__PURE__ */ a("ul", { className: "not-prose font-mono mt-2 list-none w-[95cqw]", children: t.urls.map((d) => /* @__PURE__ */ a(
+                    "li",
+                    {
+                      className: "truncate text-xs text-copy-dark dark:text-copy-light overflow-hidden text-ellipsis",
+                      title: d,
+                      children: new URL(d).pathname
+                    },
+                    d
+                  )) }) }, t.name)),
+                  p.totalItems === 0 && !Q && /* @__PURE__ */ a("p", { className: "italic m-0 opacity-70", children: "No cached assets yet." })
+                ] }) : /* @__PURE__ */ a("p", { className: "text-xs opacity-70 m-0", children: Q ? "Loading cache info..." : "No cache info available." })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  ) : null;
+};
+export {
+  ar as SettingsPanel
+};