@alfadocs/ui-kit 1.3.13 → 1.4.0

package/dist/_chunks/hcg-doubling-Cv_vH61p.js

@@ -0,0 +1,312 @@
+import { jsxs as b, jsx as s } from "react/jsx-runtime";
+import { forwardRef as W, useState as x, useMemo as H, useEffect as Z, useRef as Y } from "react";
+import { c as q } from "./index-D2ZczOXr.js";
+import { useTranslation as J } from "react-i18next";
+import { u as Q } from "./registry-DvAUVLHh.js";
+import { F as S } from "./form-field-M5UpX65Z.js";
+import { N as P } from "./number-input-DOe5VYei.js";
+import { D as G } from "./date-time-picker-DafkGDGO.js";
+import { C as B } from "./card-DPmk26CL.js";
+import { B as X } from "./badge-DCOqV9mI.js";
+import { I as ee } from "./insert-result-D074GtHX.js";
+import { c as te } from "./date-picker-variants-pKAJfnWr.js";
+import { p as ne } from "./parseISO-fOGpHKXm.js";
+import { t as se, e as h } from "./format-4HNwNGrN.js";
+function ae(e, l) {
+  const i = se(e, l == null ? void 0 : l.in);
+  if (isNaN(+i))
+    throw new RangeError("Invalid time value");
+  let r = "", g = "";
+  const d = "-", o = ":";
+  {
+    const c = h(i.getDate(), 2), u = h(i.getMonth() + 1, 2);
+    r = `${h(i.getFullYear(), 4)}${d}${u}${d}${c}`;
+  }
+  {
+    const c = i.getTimezoneOffset();
+    if (c !== 0) {
+      const N = Math.abs(c), m = h(Math.trunc(N / 60), 2), T = h(N % 60, 2);
+      g = `${c < 0 ? "+" : "-"}${m}:${T}`;
+    } else
+      g = "Z";
+    const u = h(i.getHours(), 2), v = h(i.getMinutes(), 2), w = h(i.getSeconds(), 2), I = r === "" ? "" : "T", t = [u, v, w].join(o);
+    r = `${r}${I}${t}${g}`;
+  }
+  return r;
+}
+const V = (e) => ({
+  oneOf: [{ type: "number", exclusiveMinimum: 0 }, { type: "null" }],
+  description: `${e} in mIU/mL, or null to clear it.`
+}), j = (e) => ({
+  oneOf: [{ type: "string", format: "date-time" }, { type: "null" }],
+  description: `${e} as an ISO-8601 timestamp with offset (e.g. 2026-08-01T09:30:00+02:00), not in the future, or null to clear it.`
+}), ie = {
+  id: "hcg-doubling",
+  // set_value → the `set_samples` action + the `samples` state slot.
+  capabilities: ["set_value"],
+  state: {
+    samples: {
+      type: "{ hcg1: number | null, date1: string | null, hcg2: number | null, date2: string | null }",
+      descriptionKey: "ui.agent.hcgDoubling.state.samples",
+      description: "The two timed β-hCG samples as entered — value in mIU/mL plus the draw time as an ISO-8601 timestamp. Null where unset. Read this to see why a result is still null.",
+      read: (e) => e.getSamples()
+    },
+    result: {
+      type: "{ intervalHours: number, ratio: number, percentRise: number, twoDayRisePercent: number, doublingTimeHours: number | null, trend: 'rising-normal' | 'rising-slow' | 'plateau-falling' } | null",
+      descriptionKey: "ui.agent.hcgDoubling.state.result",
+      description: "Computed doubling time in hours (null when not rising), the rise normalised to 48 hours, and the trend band against the minimal-rise benchmark. Null until both samples are set and the second is after the first.",
+      read: (e) => e.getResult()
+    }
+  },
+  actions: {
+    set_samples: {
+      // Drives the same local input state a user types into; nothing is
+      // persisted to a record, and every value is reversible in the same UI.
+      safety: "write",
+      argsType: "{ hcg1?: number | null, date1?: string | null, hcg2?: number | null, date2?: string | null }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          hcg1: V("First β-hCG value"),
+          date1: j("When the first sample was drawn"),
+          hcg2: V("Second β-hCG value"),
+          date2: j("When the second sample was drawn")
+        },
+        additionalProperties: !1
+      },
+      idempotent: !0,
+      returns: "boolean",
+      returnsSchema: {
+        type: "boolean",
+        description: "True when the samples were applied."
+      },
+      errors: [
+        "Returns false and writes nothing when a value is not positive, a timestamp is unparseable, or a timestamp is in the future — the payload applies all-or-nothing.",
+        "Applies cleanly but leaves `result` null when the second sample is not strictly after the first — the analysis needs a forward interval."
+      ],
+      examples: [
+        {
+          args: {
+            hcg1: 1200,
+            date1: "2026-08-01T09:00:00+02:00",
+            hcg2: 2500,
+            date2: "2026-08-03T09:00:00+02:00"
+          },
+          note: "A doubling over 48 hours → the rising-normal band."
+        }
+      ],
+      descriptionKey: "ui.agent.hcgDoubling.actions.setSamples",
+      description: "Set any subset of the two timed β-hCG samples. Omitted keys are left unchanged; an explicit null clears one. All four are needed before a trend is computed.",
+      invoke: (e, l) => e.setSamples(l)
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "hcg-doubling",
+      description: "Marks the HcgDoubling calculator (serum β-hCG doubling time from two timed values)."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop. Also the registry key — without an `id` the instance does not register and the handle-driven action/state are unreachable."
+    }
+  }
+}, le = 1e3 * 60 * 60, re = 35;
+function oe(e) {
+  const { hcg1: l, hcg2: i, date1: r, date2: g } = e;
+  if (!(l > 0) || !(i > 0)) return null;
+  const d = (g.getTime() - r.getTime()) / le;
+  if (!(d > 0)) return null;
+  const o = i / l, c = (o - 1) * 100, u = (o ** (48 / d) - 1) * 100, v = o > 1 ? d * Math.LN2 / Math.log(o) : null, w = o <= 1 ? "plateau-falling" : u >= re ? "rising-normal" : "rising-slow";
+  return {
+    intervalHours: d,
+    ratio: o,
+    percentRise: c,
+    twoDayRisePercent: u,
+    doublingTimeHours: v,
+    trend: w
+  };
+}
+const de = q("ds:flex ds:flex-col ds:gap-[var(--spacing-lg)]", {
+  variants: {
+    width: { full: "ds:w-full", auto: "ds:inline-flex" }
+  },
+  defaultVariants: { width: "full" }
+}), ce = {
+  "rising-normal": "success",
+  "rising-slow": "warning",
+  "plateau-falling": "error"
+}, ue = {
+  "rising-normal": "--success",
+  "rising-slow": "--warning-readable",
+  "plateau-falling": "--destructive"
+}, K = (e) => ae(e), ge = (e) => {
+  const l = ne(e);
+  return Number.isNaN(l.getTime()) ? null : l;
+}, me = (e) => e == null || Number.isFinite(e) && e > 0, he = W(
+  ({
+    defaultDate1: e,
+    defaultDate2: l,
+    onResultChange: i,
+    onInsert: r,
+    insertVariant: g = "insert",
+    onCopy: d,
+    onError: o,
+    insertBrand: c,
+    id: u,
+    width: v,
+    className: w
+  }, I) => {
+    const { t, i18n: N } = J(), [m, T] = x(null), [p, k] = x(e), [D, E] = x(null), [y, _] = x(l), A = H(() => /* @__PURE__ */ new Date(), []), a = H(() => m === null || D === null || !p || !y ? null : oe({ hcg1: m, date1: p, hcg2: D, date2: y }), [m, p, D, y]);
+    Z(() => {
+      i == null || i(a);
+    }, [a, i]);
+    const R = Y({ hcg1: m, date1: p, hcg2: D, date2: y, result: a });
+    R.current = { hcg1: m, date1: p, hcg2: D, date2: y, result: a };
+    const z = H(
+      () => ({
+        getSamples: () => {
+          const n = R.current;
+          return {
+            hcg1: n.hcg1,
+            date1: n.date1 ? K(n.date1) : null,
+            hcg2: n.hcg2,
+            date2: n.date2 ? K(n.date2) : null
+          };
+        },
+        getResult: () => R.current.result,
+        setSamples: (n) => {
+          const U = /* @__PURE__ */ new Date(), $ = {};
+          for (const f of ["hcg1", "hcg2"])
+            if (f in n && !me(n[f])) return !1;
+          for (const f of ["date1", "date2"]) {
+            if (!(f in n)) continue;
+            const M = n[f];
+            if (M == null) {
+              $[f] = void 0;
+              continue;
+            }
+            const L = ge(M);
+            if (!L || te(L, U)) return !1;
+            $[f] = L;
+          }
+          return "hcg1" in n && T(n.hcg1 ?? null), "hcg2" in n && E(n.hcg2 ?? null), "date1" in n && k($.date1), "date2" in n && _($.date2), !0;
+        }
+      }),
+      []
+    );
+    Q(ie, z, u);
+    const C = H(
+      () => new Intl.NumberFormat(N.language, { maximumFractionDigits: 0 }),
+      [N.language]
+    ), O = (n) => n.doublingTimeHours === null ? "—" : t("hcgDoubling.hoursValue", {
+      hours: C.format(n.doublingTimeHours)
+    }), F = (n) => t("hcgDoubling.percentValue", { value: C.format(n.twoDayRisePercent) });
+    return /* @__PURE__ */ b(
+      "div",
+      {
+        ref: I,
+        "data-component": "hcg-doubling",
+        "data-component-id": u,
+        className: de({ width: v, className: w }),
+        children: [
+          /* @__PURE__ */ b("div", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-2", children: [
+            /* @__PURE__ */ s(
+              S,
+              {
+                label: `${t("hcgDoubling.hcg1")} (${t("hcgDoubling.units")})`,
+                children: /* @__PURE__ */ s(
+                  P,
+                  {
+                    mode: "decimal",
+                    min: 0,
+                    value: m,
+                    onChange: T
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ s(S, { label: t("hcgDoubling.date1"), children: /* @__PURE__ */ s(G, { value: p, onChange: k, maxDate: A }) }),
+            /* @__PURE__ */ s(
+              S,
+              {
+                label: `${t("hcgDoubling.hcg2")} (${t("hcgDoubling.units")})`,
+                children: /* @__PURE__ */ s(
+                  P,
+                  {
+                    mode: "decimal",
+                    min: 0,
+                    value: D,
+                    onChange: E
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ s(S, { label: t("hcgDoubling.date2"), children: /* @__PURE__ */ s(G, { value: y, onChange: _, maxDate: A }) })
+          ] }),
+          /* @__PURE__ */ s("p", { className: "ds:sr-only", role: "status", "aria-live": "polite", children: a ? `${t("hcgDoubling.doublingLabel")}: ${O(a)}. ${t(
+            `hcgDoubling.trend.${a.trend}`
+          )}.` : "" }),
+          a ? /* @__PURE__ */ s(B, { variant: "elevated", children: /* @__PURE__ */ b(B.Body, { className: "ds:flex ds:flex-col ds:gap-[var(--spacing-md)]", children: [
+            /* @__PURE__ */ b("dl", { className: "ds:grid ds:grid-cols-1 ds:gap-[var(--spacing-md)] ds:sm:grid-cols-3", children: [
+              /* @__PURE__ */ b("div", { className: "ds:flex ds:flex-col ds:items-start ds:gap-[var(--spacing-xs)]", children: [
+                /* @__PURE__ */ s("dt", { className: "type-label ds:text-muted-foreground", children: t("hcgDoubling.doublingLabel") }),
+                /* @__PURE__ */ s("dd", { className: "type-metric ds:text-foreground", children: O(a) })
+              ] }),
+              /* @__PURE__ */ b("div", { className: "ds:flex ds:flex-col ds:items-start ds:gap-[var(--spacing-xs)]", children: [
+                /* @__PURE__ */ s("dt", { className: "type-label ds:text-muted-foreground", children: t("hcgDoubling.riseLabel") }),
+                /* @__PURE__ */ s("dd", { className: "type-body ds:text-foreground", children: F(a) })
+              ] }),
+              /* @__PURE__ */ b("div", { className: "ds:flex ds:flex-col ds:items-end ds:gap-[var(--spacing-xs)] ds:text-end", children: [
+                /* @__PURE__ */ s("dt", { className: "type-label ds:text-muted-foreground", children: t("hcgDoubling.trendLabel") }),
+                /* @__PURE__ */ s("dd", { children: /* @__PURE__ */ s(X, { variant: ce[a.trend], size: "lg", children: t(`hcgDoubling.trend.${a.trend}`) }) })
+              ] })
+            ] }),
+            /* @__PURE__ */ s("p", { className: "type-body-sm ds:text-muted-foreground", children: t("hcgDoubling.disclaimer") }),
+            g === "copy" || r ? /* @__PURE__ */ s(
+              ee,
+              {
+                onInsert: r,
+                variant: g,
+                onCopy: d,
+                onError: o,
+                card: {
+                  title: t("insert.title.hcg"),
+                  icon: "activity",
+                  highlight: t(`hcgDoubling.trend.${a.trend}`),
+                  highlightToken: ue[a.trend],
+                  brand: c,
+                  fields: [
+                    {
+                      icon: "clock",
+                      label: t("hcgDoubling.doublingLabel"),
+                      value: O(a)
+                    },
+                    {
+                      icon: "trending-up",
+                      label: t("hcgDoubling.riseLabel"),
+                      value: F(a)
+                    },
+                    {
+                      icon: "tag",
+                      label: t("hcgDoubling.trendLabel"),
+                      value: t(`hcgDoubling.trend.${a.trend}`)
+                    }
+                  ]
+                }
+              }
+            ) : null
+          ] }) }) : /* @__PURE__ */ s("p", { className: "type-body ds:text-muted-foreground", children: t("hcgDoubling.empty") })
+        ]
+      }
+    );
+  }
+);
+he.displayName = "HcgDoubling";
+export {
+  he as H,
+  re as M,
+  oe as a
+};
+//# sourceMappingURL=hcg-doubling-Cv_vH61p.js.map

package/dist/_chunks/header-settings-Cn5fPXCE.js

@@ -0,0 +1,335 @@
+import { jsx as t, jsxs as p } from "react/jsx-runtime";
+import { forwardRef as I, useRef as c, useImperativeHandle as C, useCallback as R, useMemo as E } from "react";
+import { c as _ } from "./index-D2ZczOXr.js";
+import { useTranslation as K } from "react-i18next";
+import { I as l } from "./icon-button-C_kbcd7I.js";
+import { I as M } from "./icon-button-group-BLHPN6jg.js";
+import { D as r } from "./dropdown-menu-DU-Hrf33.js";
+import { S as N } from "./switch-OILsBLWo.js";
+import { c as S, a as j, L as H } from "./locale-picker-D9Kv2zrK.js";
+import { u as O } from "./use-locale-BkCIHujH.js";
+import { u as P } from "./use-theme-CAuo6EYT.js";
+import { u as V } from "./registry-DvAUVLHh.js";
+import { S as D } from "./settings-d25ju_6L.js";
+import { S as q, M as z } from "./sun-Bj9Mr553.js";
+import { M as F } from "./monitor-xXSrufmP.js";
+const U = {
+  id: "header-settings",
+  // Each setter persists a single preference value (locale / theme /
+  // accessibility) — `set_value` semantics, not an ephemeral view switch.
+  capabilities: ["set_value"],
+  // Read-back for all three setters. None of these preferences is
+  // recoverable from the DOM — `useTheme` resolves preference + OS into
+  // a single applied class, so `theme: 'system'` and `theme: 'light'`
+  // both paint `.theme-light` — and `set_locale` swallows unknown tags.
+  // Without these slots an agent cannot distinguish "switched to
+  // Italian" from "the tag was dropped on the floor". All four are UI
+  // preferences: no PHI, no patient-identifiable data (§7).
+  state: {
+    locale: {
+      type: "string",
+      descriptionKey: "ui.agent.headerSettings.state.locale",
+      description: 'Active IETF language tag (e.g. "en", "it", "ar"). Read after `set_locale` to confirm the switch landed — an unknown tag is silently dropped and leaves this unchanged.',
+      read: (e) => e.getLocale()
+    },
+    theme: {
+      type: "'light' | 'dark' | 'system'",
+      descriptionKey: "ui.agent.headerSettings.state.theme",
+      description: "Stored base-theme preference. `'system'` means no override is set and the OS decides — read `resolvedTheme` for what is actually painted.",
+      read: (e) => e.getTheme()
+    },
+    accessibility: {
+      type: "'default' | 'accessible' | 'system'",
+      descriptionKey: "ui.agent.headerSettings.state.accessibility",
+      description: "Stored AAA-contrast preference. `'system'` means no override is set and `prefers-contrast` decides.",
+      read: (e) => e.getAccessibility()
+    },
+    resolvedTheme: {
+      type: "'light' | 'dark' | 'light-accessible' | 'dark-accessible'",
+      descriptionKey: "ui.agent.headerSettings.state.resolvedTheme",
+      description: 'The theme actually applied to the document once preference and OS signals resolve. This is what makes a `set_theme("system")` or `set_accessibility("system")` write verifiable.',
+      read: (e) => e.getResolvedTheme()
+    }
+  },
+  actions: {
+    set_locale: {
+      safety: "write",
+      argsType: "{ locale: string }",
+      argsSchema: {
+        type: "object",
+        properties: {
+          locale: {
+            type: "string",
+            description: 'IETF language tag (e.g. "en", "it", "ar"). Unknown tags are silently dropped.'
+          }
+        },
+        required: ["locale"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.headerSettings.actions.setLocale",
+      description: "Switch the active locale to the given IETF tag. Unknown tags are silently dropped — read the `locale` state slot afterwards to confirm.",
+      errors: [
+        "Silently ignored when the tag names a locale the kit ships no bundle for — `locale` is unchanged."
+      ],
+      examples: [{ args: { locale: "it" }, note: "Switch to Italian." }],
+      invoke: (e, s) => {
+        e.setLocale(s.locale);
+      }
+    },
+    set_theme: {
+      safety: "write",
+      argsType: '{ theme: "light" | "dark" | "system" }',
+      argsSchema: {
+        type: "object",
+        properties: { theme: { enum: ["light", "dark", "system"] } },
+        required: ["theme"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.headerSettings.actions.setTheme",
+      description: "Switch the theme preference. Verify with the `theme` slot (the stored preference) and `resolvedTheme` (what is actually painted).",
+      examples: [
+        { args: { theme: "dark" }, note: "Switch to the dark theme." }
+      ],
+      invoke: (e, s) => {
+        e.setTheme(s.theme);
+      }
+    },
+    set_accessibility: {
+      safety: "write",
+      argsType: '{ accessibility: "default" | "accessible" | "system" }',
+      argsSchema: {
+        type: "object",
+        properties: {
+          accessibility: {
+            enum: ["default", "accessible", "system"],
+            description: "`'system'` clears the override and follows `prefers-contrast`."
+          }
+        },
+        required: ["accessibility"]
+      },
+      idempotent: !0,
+      descriptionKey: "ui.agent.headerSettings.actions.setAccessibility",
+      description: "Switch the accessibility preference. Verify with the `accessibility` slot (the stored preference) and `resolvedTheme` (what is actually painted).",
+      examples: [
+        {
+          args: { accessibility: "accessible" },
+          note: "Enable the AAA-accessible profile."
+        }
+      ],
+      invoke: (e, s) => {
+        e.setAccessibility(s.accessibility);
+      }
+    }
+  },
+  domHooks: {
+    root: {
+      attr: "data-component",
+      value: "header-settings",
+      description: "Marks the HeaderSettings wrapper."
+    },
+    instanceId: {
+      attr: "data-component-id",
+      sourceProp: "id",
+      description: "Sourced from the id prop (forwarded via HTMLAttributes)."
+    }
+  }
+};
+function B(e, s) {
+  if (!(typeof window > "u"))
+    try {
+      window.localStorage.setItem(e, s);
+    } catch {
+    }
+}
+function G(e) {
+  if (typeof document > "u") return;
+  const s = document.documentElement;
+  s.lang = e, s.dir = S[e].dir;
+}
+const W = _("ds:inline-flex ds:items-center", {
+  variants: {
+    align: {
+      start: "",
+      end: ""
+    }
+  },
+  defaultVariants: { align: "end" }
+}), Y = [
+  "ds:w-[20rem] ds:p-[var(--spacing-xs)]",
+  "ds:rounded-[var(--radius-md)] ds:border ds:border-border",
+  "ds:bg-background ds:text-foreground ds:shadow-[var(--shadow-lg)]"
+].join(" "), J = I(
+  (e, s) => {
+    const {
+      align: h = "end",
+      size: w = "md",
+      disabled: T = !1,
+      className: k,
+      id: g,
+      ...A
+    } = e, { t: i } = K(), n = P(), { locale: m, setLocale: u } = O(), y = c(null);
+    C(s, () => y.current, []);
+    const f = R(
+      (a) => {
+        u(a), G(a), B(H, a);
+      },
+      [u]
+    ), b = c(f);
+    b.current = f;
+    const v = c(m);
+    v.current = m;
+    const o = c(n);
+    o.current = n;
+    const L = E(
+      () => ({
+        setLocale: (a) => {
+          Object.prototype.hasOwnProperty.call(S, a) && b.current(a);
+        },
+        setTheme: (a) => o.current.setTheme(a),
+        setAccessibility: (a) => o.current.setAccessibility(a),
+        // Read-back. None of the three preferences is recoverable from
+        // the DOM: `useTheme` resolves preference + OS into one applied
+        // class, so `theme: 'system'` and `theme: 'light'` both paint
+        // `.theme-light`. Without these an agent cannot tell a switch
+        // that landed from one that was dropped.
+        getLocale: () => v.current,
+        getTheme: () => o.current.theme,
+        getAccessibility: () => o.current.accessibility,
+        getResolvedTheme: () => o.current.resolvedTheme
+      }),
+      []
+    );
+    V(U, L, g);
+    const x = n.accessibility === "accessible";
+    return /* @__PURE__ */ t(
+      "div",
+      {
+        ref: y,
+        "data-component": "header-settings",
+        "data-component-id": g,
+        className: W({ align: h, className: k }),
+        ...A,
+        children: /* @__PURE__ */ p(r.Root, { children: [
+          /* @__PURE__ */ t(r.Trigger, { asChild: !0, children: /* @__PURE__ */ t(
+            l,
+            {
+              size: w,
+              disabled: T,
+              icon: /* @__PURE__ */ t(D, { "aria-hidden": !0 }),
+              "aria-label": i("navigation.headerSettings.trigger")
+            }
+          ) }),
+          /* @__PURE__ */ t(r.Portal, { children: /* @__PURE__ */ p(
+            r.Content,
+            {
+              align: h,
+              sideOffset: 8,
+              className: Y,
+              onKeyDownCapture: (a) => {
+                const d = a.target;
+                (d == null ? void 0 : d.tagName) === "INPUT" && // Always allow Escape so the menu can close.
+                a.key !== "Escape" && a.stopPropagation();
+              },
+              children: [
+                /* @__PURE__ */ t(r.Label, { children: i("navigation.headerSettings.language.label") }),
+                /* @__PURE__ */ t(
+                  "div",
+                  {
+                    role: "group",
+                    "aria-label": i("navigation.headerSettings.language.label"),
+                    className: [
+                      "ds:px-[var(--spacing-sm)] ds:py-[var(--spacing-xs)]",
+                      // Stretch the compact LocalePicker to the full menu
+                      // width so it reads as a single row affordance (not
+                      // a centred pill). The picker's root is
+                      // inline-flex; the `*:` child selector + `flex-1`
+                      // gives it `flex: 1 1 0%` once it's a child of the
+                      // flex container we make this div into.
+                      "ds:flex ds:[&>*]:flex-1"
+                    ].join(" "),
+                    children: /* @__PURE__ */ t(j, { variant: "compact", popoverSide: "end" })
+                  }
+                ),
+                /* @__PURE__ */ t(r.Separator, {}),
+                /* @__PURE__ */ t(r.Label, { children: i("navigation.headerSettings.appearance.label") }),
+                /* @__PURE__ */ t(
+                  "div",
+                  {
+                    role: "group",
+                    "aria-label": i("navigation.headerSettings.appearance.label"),
+                    className: "ds:px-[var(--spacing-sm)] ds:py-[var(--spacing-xs)]",
+                    children: /* @__PURE__ */ p(
+                      M,
+                      {
+                        role: "radiogroup",
+                        mode: "toggle-single",
+                        size: "sm",
+                        "aria-label": i("navigation.headerSettings.appearance.label"),
+                        value: n.theme,
+                        onValueChange: (a) => n.setTheme(a),
+                        children: [
+                          /* @__PURE__ */ t(
+                            l,
+                            {
+                              icon: /* @__PURE__ */ t(q, { "aria-hidden": !0 }),
+                              "aria-label": i("navigation.headerSettings.appearance.light"),
+                              value: "light"
+                            }
+                          ),
+                          /* @__PURE__ */ t(
+                            l,
+                            {
+                              icon: /* @__PURE__ */ t(z, { "aria-hidden": !0 }),
+                              "aria-label": i("navigation.headerSettings.appearance.dark"),
+                              value: "dark"
+                            }
+                          ),
+                          /* @__PURE__ */ t(
+                            l,
+                            {
+                              icon: /* @__PURE__ */ t(F, { "aria-hidden": !0 }),
+                              "aria-label": i(
+                                "navigation.headerSettings.appearance.system"
+                              ),
+                              value: "system"
+                            }
+                          )
+                        ]
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ t(r.Separator, {}),
+                /* @__PURE__ */ t(
+                  "div",
+                  {
+                    role: "group",
+                    "aria-label": i(
+                      "navigation.headerSettings.appearance.accessible"
+                    ),
+                    className: "ds:px-[var(--spacing-sm)] ds:py-[var(--spacing-sm)]",
+                    children: /* @__PURE__ */ t(
+                      N,
+                      {
+                        label: i("navigation.headerSettings.appearance.accessible"),
+                        labelSide: "start",
+                        size: "sm",
+                        checked: x,
+                        onCheckedChange: (a) => n.setAccessibility(a ? "accessible" : "default")
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ) })
+        ] })
+      }
+    );
+  }
+);
+J.displayName = "HeaderSettings";
+export {
+  J as H
+};
+//# sourceMappingURL=header-settings-Cn5fPXCE.js.map