@auldrant/ui 0.8.1 → 0.9.0

package/dist/auldrant-ui.js

@@ -1,269 +1,482 @@
-import { jsx as l, jsxs as m, Fragment as V } from "preact/jsx-runtime";
-import { useId as v } from "preact/hooks";
-import { signal as A, useSignal as $, effect as J } from "@preact/signals";
-import { h as T, toChildArray as Q } from "preact";
-function b(...t) {
+import { jsx as r, jsxs as m, Fragment as se } from "preact/jsx-runtime";
+import { useId as x, useRef as P, useEffect as A } from "preact/hooks";
+import { signal as K, useSignal as E, effect as le } from "@preact/signals";
+import { h as M, toChildArray as re } from "preact";
+function v(...t) {
   return t.filter(Boolean).join(" ");
 }
-function g(...t) {
+function L(...t) {
   return t.filter(Boolean).join(" ") || void 0;
 }
-const X = "_button_4gn7y_1 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Y = {
-  button: X
-}, O = (t) => {
-  const { label: e, onClick: s, type: n = "button", disabled: r, class: o } = t;
-  return /* @__PURE__ */ l("button", { type: n, class: b(Y.button, o), onClick: s, disabled: r, children: e });
-}, ee = "_card_awzw5_1", te = {
-  card: ee
-}, ut = (t) => {
+const ae = "_button_4gn7y_1 _focus-ring_4u8pk_3 _disabled_4u8pk_8", oe = {
+  button: ae
+}, G = (t) => {
+  const { label: e, onClick: s, type: n = "button", disabled: l, class: a } = t;
+  return /* @__PURE__ */ r("button", { type: n, class: v(oe.button, a), onClick: s, disabled: l, children: e });
+}, ce = "_card_awzw5_1", ie = {
+  card: ce
+}, Et = (t) => {
   const { children: e, class: s } = t;
-  return /* @__PURE__ */ l("div", { class: b(te.card, s), children: e });
-}, se = "_field_17xwz_1", ne = "_input_17xwz_8 _check-input_4u8pk_32 _focus-ring_4u8pk_3 _disabled_4u8pk_8", re = "_error_17xwz_12 _field-error_4u8pk_36", L = {
-  field: se,
-  input: ne,
-  error: re
-}, _t = (t) => {
-  const { label: e, name: s, checked: n, required: r, disabled: o, error: a, onChange: c, class: i } = t, p = v(), h = `${p}-error`;
-  return /* @__PURE__ */ m("div", { class: b(L.field, i), children: [
-    /* @__PURE__ */ l(
+  return /* @__PURE__ */ r("div", { class: v(ie.card, s), children: e });
+}, de = "_field_17xwz_1", ue = "_input_17xwz_8 _check-input_4u8pk_32 _focus-ring_4u8pk_3 _disabled_4u8pk_8", _e = "_error_17xwz_12 _field-error_4u8pk_36", T = {
+  field: de,
+  input: ue,
+  error: _e
+}, Dt = (t) => {
+  const { label: e, name: s, checked: n, required: l, disabled: a, error: o, onChange: c, class: i } = t, h = x(), p = `${h}-error`;
+  return /* @__PURE__ */ m("div", { class: v(T.field, i), children: [
+    /* @__PURE__ */ r(
       "input",
       {
-        id: p,
-        class: L.input,
+        id: h,
+        class: T.input,
         type: "checkbox",
         name: s,
         checked: n,
-        required: r,
-        disabled: o,
-        "aria-invalid": !!a || void 0,
-        "aria-describedby": g(a && h),
-        onChange: c && ((u) => c(u.target.checked))
+        required: l,
+        disabled: a,
+        "aria-invalid": !!o || void 0,
+        "aria-describedby": L(o && p),
+        onChange: c && ((_) => c(_.target.checked))
       }
     ),
-    /* @__PURE__ */ l("label", { for: p, children: e }),
-    a && /* @__PURE__ */ l("p", { id: h, class: L.error, role: "alert", children: a })
+    /* @__PURE__ */ r("label", { for: h, children: e }),
+    o && /* @__PURE__ */ r("p", { id: p, class: T.error, role: "alert", children: o })
   ] });
-}, le = "_link_7wgic_1 _link_4u8pk_22 _focus-ring_4u8pk_3", ae = {
-  link: le
-}, pt = (t) => {
-  const { href: e, fileName: s, label: n, class: r } = t;
-  return /* @__PURE__ */ l("a", { href: e, download: s, class: b(ae.link, r), children: n });
-}, oe = "_form_jr324_1", ce = "_actions_jr324_6", ie = "_status_jr324_13", j = {
-  form: oe,
-  actions: ce,
-  status: ie
-}, ht = (t) => {
+}, pe = "_dialog_1lxj9_1", he = "_panel_1lxj9_14", fe = "_header_1lxj9_23", me = "_title_1lxj9_30", be = "_close_1lxj9_35 _focus-ring_4u8pk_3", ve = "_body_1lxj9_51", ke = "_message_1lxj9_56", ge = "_footer_1lxj9_60", ye = "_action_1lxj9_67 _focus-ring_4u8pk_3 _disabled_4u8pk_8", we = "_primary_1lxj9_82", y = {
+  dialog: pe,
+  panel: he,
+  header: fe,
+  title: me,
+  close: be,
+  body: ve,
+  message: ke,
+  footer: ge,
+  action: ye,
+  primary: we
+}, R = {
+  cancel: "Cancel",
+  cancelDescription: "Dismiss this dialog",
+  closeDescription: "Close this dialog"
+};
+function xe(t) {
+  const e = t.split("+"), s = e.at(-1) ?? "", n = e.slice(0, -1).map((l) => l.toLowerCase());
+  return {
+    key: s.toLowerCase(),
+    ctrl: n.includes("ctrl"),
+    shift: n.includes("shift"),
+    alt: n.includes("alt")
+  };
+}
+function z(t) {
+  return `(${t})`;
+}
+const Y = (t) => {
+  const {
+    open: e,
+    title: s,
+    alert: n,
+    onDismiss: l,
+    onBackdropClick: a,
+    message: o,
+    defaultAction: c,
+    actions: i,
+    cancelLabel: h,
+    onCancel: p,
+    focusCancel: _,
+    children: f,
+    class: d
+  } = t, b = P(null), g = P(null), $ = P(null), C = x();
+  A(() => {
+    const u = b.current;
+    u && (e && !u.open ? (u.showModal(), _ && $.current ? $.current.focus() : g.current && g.current.focus()) : !e && u.open && u.close());
+  }, [e, _]), A(() => {
+    const u = b.current;
+    if (!u)
+      return;
+    const k = (I) => {
+      I.preventDefault(), l();
+    };
+    return u.addEventListener("cancel", k), () => u.removeEventListener("cancel", k);
+  }, [l]), A(() => {
+    const u = b.current;
+    if (!u || !e)
+      return;
+    const k = [...i ?? [], ...c ? [c] : []];
+    if (k.length === 0)
+      return;
+    const I = k.map((w) => ({
+      parsed: xe(w.shortcut),
+      handler: w.onClick
+    })), N = (w) => {
+      for (const { parsed: S, handler: ne } of I)
+        if (w.key.toLowerCase() === S.key && w.ctrlKey === S.ctrl && w.shiftKey === S.shift && w.altKey === S.alt) {
+          w.preventDefault(), ne();
+          return;
+        }
+    };
+    return u.addEventListener("keydown", N), () => u.removeEventListener("keydown", N);
+  }, [e, i, c]), A(() => {
+    const u = b.current;
+    if (!u || !e || !a)
+      return;
+    const k = (I) => {
+      I.target === u && a();
+    };
+    return u.addEventListener("click", k), () => u.removeEventListener("click", k);
+  }, [e, a]);
+  const q = c || p || i && i.length > 0;
+  return /* @__PURE__ */ r(
+    "dialog",
+    {
+      ref: b,
+      class: v(y.dialog, d),
+      "aria-labelledby": C,
+      role: n ? "alertdialog" : void 0,
+      children: /* @__PURE__ */ m("div", { class: y.panel, children: [
+        /* @__PURE__ */ m("header", { class: y.header, children: [
+          /* @__PURE__ */ r("h2", { id: C, class: y.title, children: s }),
+          !n && /* @__PURE__ */ r(
+            "button",
+            {
+              type: "button",
+              class: y.close,
+              title: R.closeDescription,
+              onClick: l,
+              children: "×"
+            }
+          )
+        ] }),
+        /* @__PURE__ */ m("div", { class: y.body, children: [
+          o && /* @__PURE__ */ r("p", { class: y.message, children: o }),
+          f
+        ] }),
+        q && /* @__PURE__ */ m("footer", { class: y.footer, children: [
+          i?.map((u) => /* @__PURE__ */ m(
+            "button",
+            {
+              type: "button",
+              class: y.action,
+              title: u.description,
+              onClick: u.onClick,
+              children: [
+                u.label,
+                " ",
+                z(u.shortcut)
+              ]
+            },
+            u.label
+          )),
+          c && /* @__PURE__ */ m(
+            "button",
+            {
+              ref: g,
+              type: "button",
+              class: v(y.action, y.primary),
+              title: c.description,
+              onClick: c.onClick,
+              children: [
+                c.label,
+                " ",
+                z(c.shortcut)
+              ]
+            }
+          ),
+          p && /* @__PURE__ */ m(
+            "button",
+            {
+              ref: $,
+              type: "button",
+              class: y.action,
+              title: R.cancelDescription,
+              onClick: p,
+              children: [
+                h ?? R.cancel,
+                " ",
+                z("Esc")
+              ]
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+}, St = (t) => {
+  const {
+    open: e,
+    title: s,
+    onClose: n,
+    message: l,
+    defaultAction: a,
+    actions: o,
+    children: c,
+    class: i
+  } = t;
+  return /* @__PURE__ */ r(
+    Y,
+    {
+      open: e,
+      title: s,
+      onDismiss: n,
+      onBackdropClick: n,
+      message: l,
+      defaultAction: a,
+      actions: o,
+      class: i,
+      children: c
+    }
+  );
+}, $e = "_link_7wgic_1 _link_4u8pk_22 _focus-ring_4u8pk_3", Ce = {
+  link: $e
+}, At = (t) => {
+  const { href: e, fileName: s, label: n, class: l } = t;
+  return /* @__PURE__ */ r("a", { href: e, download: s, class: v(Ce.link, l), children: n });
+}, Ie = "_form_jr324_1", Le = "_actions_jr324_6", Ne = "_status_jr324_13", H = {
+  form: Ie,
+  actions: Le,
+  status: Ne
+}, Bt = (t) => {
   const {
     onSubmit: e,
     submitLabel: s = "Submit",
     resetLabel: n,
-    status: r,
-    children: o,
-    class: a
+    status: l,
+    children: a,
+    class: o
   } = t;
   return /* @__PURE__ */ m(
     "form",
     {
-      class: b(j.form, a),
+      class: v(H.form, o),
       onSubmit: (c) => {
         c.preventDefault();
         const i = new FormData(c.currentTarget);
         e(i);
       },
       children: [
-        o,
-        /* @__PURE__ */ m("div", { class: j.actions, children: [
-          /* @__PURE__ */ l(O, { type: "submit", label: s }),
-          n && /* @__PURE__ */ l(O, { type: "reset", label: n })
+        a,
+        /* @__PURE__ */ m("div", { class: H.actions, children: [
+          /* @__PURE__ */ r(G, { type: "submit", label: s }),
+          n && /* @__PURE__ */ r(G, { type: "reset", label: n })
         ] }),
-        r && /* @__PURE__ */ l("output", { class: j.status, children: r })
+        l && /* @__PURE__ */ r("output", { class: H.status, children: l })
       ]
     }
   );
-}, de = "_field_7l9ux_1", ue = "_label_7l9ux_8", _e = "_required_7l9ux_12", pe = "_error_7l9ux_16 _field-error_4u8pk_36", S = {
-  field: de,
-  label: ue,
-  required: _e,
-  error: pe
-}, x = (t) => {
-  const { for: e, label: s, required: n, error: r, errorId: o, children: a, class: c } = t;
-  return /* @__PURE__ */ m("div", { class: b(S.field, c), children: [
-    /* @__PURE__ */ m("label", { class: S.label, for: e, children: [
+}, je = "_field_7l9ux_1", Ee = "_label_7l9ux_8", De = "_required_7l9ux_12", Se = "_error_7l9ux_16 _field-error_4u8pk_36", B = {
+  field: je,
+  label: Ee,
+  required: De,
+  error: Se
+}, D = (t) => {
+  const { for: e, label: s, required: n, error: l, errorId: a, children: o, class: c } = t;
+  return /* @__PURE__ */ m("div", { class: v(B.field, c), children: [
+    /* @__PURE__ */ m("label", { class: B.label, for: e, children: [
       s,
       ":",
-      n && /* @__PURE__ */ m("span", { class: S.required, "aria-hidden": "true", children: [
+      n && /* @__PURE__ */ m("span", { class: B.required, "aria-hidden": "true", children: [
         " ",
         "*"
       ] })
     ] }),
-    a,
-    r && /* @__PURE__ */ l("p", { id: o, class: S.error, role: "alert", children: r })
+    o,
+    l && /* @__PURE__ */ r("p", { id: a, class: B.error, role: "alert", children: l })
   ] });
-}, he = "_input_1j10x_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", me = {
-  input: he
-}, be = {
+}, Ae = "_input_1j10x_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Be = {
+  input: Ae
+}, qe = {
   email: "email",
   tel: "tel",
   url: "url"
-}, mt = (t) => {
+}, qt = (t) => {
   const {
     label: e,
     name: s,
     type: n = "text",
-    value: r,
-    placeholder: o,
-    maxLength: a,
+    value: l,
+    placeholder: a,
+    maxLength: o,
     autocomplete: c,
     readOnly: i,
-    pattern: p,
-    required: h,
-    disabled: u,
-    error: _,
+    pattern: h,
+    required: p,
+    disabled: _,
+    error: f,
     onInput: d,
-    class: f
-  } = t, k = v(), y = `${k}-error`;
-  return /* @__PURE__ */ l(
-    x,
+    class: b
+  } = t, g = x(), $ = `${g}-error`;
+  return /* @__PURE__ */ r(
+    D,
     {
       label: e,
-      for: k,
-      required: h,
-      error: _,
-      errorId: y,
-      class: f,
-      children: /* @__PURE__ */ l(
+      for: g,
+      required: p,
+      error: f,
+      errorId: $,
+      class: b,
+      children: /* @__PURE__ */ r(
         "input",
         {
-          id: k,
-          class: me.input,
+          id: g,
+          class: Be.input,
           type: n,
           name: s,
-          value: r,
-          placeholder: o,
-          maxLength: a,
-          autoComplete: c ?? be[n],
+          value: l,
+          placeholder: a,
+          maxLength: o,
+          autoComplete: c ?? qe[n],
           readOnly: i,
-          pattern: p,
-          required: h,
-          disabled: u,
-          "aria-invalid": !!_ || void 0,
-          "aria-describedby": g(_ && y),
+          pattern: h,
+          required: p,
+          disabled: _,
+          "aria-invalid": !!f || void 0,
+          "aria-describedby": L(f && $),
           onInput: d && ((C) => d(C.target.value))
         }
       )
     }
   );
-}, P = A(window.location.pathname), G = A(window.location.hash.slice(1));
-function fe(t) {
+}, U = K(window.location.pathname), ee = K(window.location.hash.slice(1));
+function Pe(t) {
   const e = t.indexOf("#");
   let s = "", n = t;
   e >= 0 && (s = t.slice(e + 1), n = t.slice(0, e));
-  const r = n.indexOf("?");
-  let o = "", a = n;
-  return r >= 0 && (o = n.slice(r), a = n.slice(0, r)), { pathname: a || "/", search: o, hash: s };
+  const l = n.indexOf("?");
+  let a = "", o = n;
+  return l >= 0 && (a = n.slice(l), o = n.slice(0, l)), { pathname: o || "/", search: a, hash: s };
 }
-function ve(t, e) {
-  const { pathname: s, search: n, hash: r } = fe(t), o = s + n + (r ? `#${r}` : "");
-  e?.replace ? history.replaceState(null, "", o) : history.pushState(null, "", o), P.value = s, G.value = r;
+function Te(t, e) {
+  const { pathname: s, search: n, hash: l } = Pe(t), a = s + n + (l ? `#${l}` : "");
+  e?.replace ? history.replaceState(null, "", a) : history.pushState(null, "", a), U.value = s, ee.value = l;
 }
 window.addEventListener("popstate", () => {
-  P.value = window.location.pathname, G.value = window.location.hash.slice(1);
+  U.value = window.location.pathname, ee.value = window.location.hash.slice(1);
 });
-const ke = "_link_7wgic_1 _link_4u8pk_22 _focus-ring_4u8pk_3", H = {
-  link: ke
+const Re = "_link_7wgic_1 _link_4u8pk_22 _focus-ring_4u8pk_3", W = {
+  link: Re
 };
-function ge(t) {
+function ze(t) {
   try {
     return new URL(t, window.location.href).origin !== window.location.origin;
   } catch {
     return !1;
   }
 }
-const bt = (t) => {
-  const { href: e, children: s, external: n, class: r } = t;
-  return n ?? ge(e) ? /* @__PURE__ */ l("a", { href: e, class: b(H.link, r), rel: "noopener noreferrer", children: s }) : /* @__PURE__ */ l(
+const Pt = (t) => {
+  const { href: e, children: s, external: n, class: l } = t;
+  return n ?? ze(e) ? /* @__PURE__ */ r("a", { href: e, class: v(W.link, l), rel: "noopener noreferrer", children: s }) : /* @__PURE__ */ r(
     "a",
     {
       href: e,
-      class: b(H.link, r),
-      onClick: (a) => {
-        a.preventDefault(), ve(e);
+      class: v(W.link, l),
+      onClick: (o) => {
+        o.preventDefault(), Te(e);
       },
       children: s
     }
   );
-}, ye = "_nav_778nl_1", we = "_title_778nl_6", D = {
-  nav: ye,
-  title: we
-}, ft = (t) => {
-  const { title: e, children: s, class: n } = t, r = v();
-  return /* @__PURE__ */ m("nav", { class: b(D.nav, n), "aria-labelledby": e ? r : void 0, children: [
-    e && /* @__PURE__ */ l("h2", { id: r, class: D.title, children: e }),
+}, Tt = (t) => {
+  const {
+    open: e,
+    title: s,
+    onCancel: n,
+    cancelLabel: l,
+    message: a,
+    defaultAction: o,
+    actions: c,
+    focusCancel: i,
+    children: h,
+    class: p
+  } = t;
+  return /* @__PURE__ */ r(
+    Y,
+    {
+      open: e,
+      title: s,
+      alert: !0,
+      onDismiss: n,
+      onCancel: n,
+      cancelLabel: l,
+      message: a,
+      defaultAction: o,
+      actions: c,
+      focusCancel: i,
+      class: p,
+      children: h
+    }
+  );
+}, He = "_nav_778nl_1", Oe = "_title_778nl_6", Z = {
+  nav: He,
+  title: Oe
+}, Rt = (t) => {
+  const { title: e, children: s, class: n } = t, l = x();
+  return /* @__PURE__ */ m("nav", { class: v(Z.nav, n), "aria-labelledby": e ? l : void 0, children: [
+    e && /* @__PURE__ */ r("h2", { id: l, class: Z.title, children: e }),
     s
   ] });
-}, $e = "_input_1j10x_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", xe = {
-  input: $e
-}, vt = (t) => {
+}, Fe = "_input_1j10x_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Me = {
+  input: Fe
+}, zt = (t) => {
   const {
     label: e,
     name: s,
     min: n,
-    max: r,
-    step: o,
-    value: a,
+    max: l,
+    step: a,
+    value: o,
     placeholder: c,
     required: i,
-    disabled: p,
-    error: h,
-    onInput: u,
-    class: _
-  } = t, d = v(), f = `${d}-error`;
-  return /* @__PURE__ */ l(
-    x,
+    disabled: h,
+    error: p,
+    onInput: _,
+    class: f
+  } = t, d = x(), b = `${d}-error`;
+  return /* @__PURE__ */ r(
+    D,
     {
       label: e,
       for: d,
       required: i,
-      error: h,
-      errorId: f,
-      class: _,
-      children: /* @__PURE__ */ l(
+      error: p,
+      errorId: b,
+      class: f,
+      children: /* @__PURE__ */ r(
         "input",
         {
           id: d,
-          class: xe.input,
+          class: Me.input,
           type: "number",
           name: s,
           min: n,
-          max: r,
-          step: o,
-          value: a,
+          max: l,
+          step: a,
+          value: o,
           placeholder: c,
           required: i,
-          disabled: p,
-          "aria-invalid": !!h || void 0,
-          "aria-describedby": g(h && f),
-          onInput: u && ((k) => u(k.target.valueAsNumber))
+          disabled: h,
+          "aria-invalid": !!p || void 0,
+          "aria-describedby": L(p && b),
+          onInput: _ && ((g) => _(g.target.valueAsNumber))
         }
       )
     }
   );
-}, Ce = "_wrapper_16zfv_1", Ie = "_input_16zfv_5 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Ne = "_toggle_16zfv_11 _focus-ring_4u8pk_3 _disabled_4u8pk_8", q = {
-  wrapper: Ce,
-  input: Ie,
-  toggle: Ne
+}, Ke = "_wrapper_16zfv_1", Ue = "_input_16zfv_5 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Ge = "_toggle_16zfv_11 _focus-ring_4u8pk_3 _disabled_4u8pk_8", O = {
+  wrapper: Ke,
+  input: Ue,
+  toggle: Ge
 };
-const Se = (...t) => t.filter((e, s, n) => !!e && e.trim() !== "" && n.indexOf(e) === s).join(" ").trim();
-const F = (t) => t.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
-const Le = (t) => t.replace(
+const We = (...t) => t.filter((e, s, n) => !!e && e.trim() !== "" && n.indexOf(e) === s).join(" ").trim();
+const V = (t) => t.replace(/([a-z0-9])([A-Z])/g, "$1-$2").toLowerCase();
+const Ze = (t) => t.replace(
   /^([A-Z])|[\s-_]+(\w)/g,
   (e, s, n) => n ? n.toUpperCase() : s.toLowerCase()
 );
-const R = (t) => {
-  const e = Le(t);
+const J = (t) => {
+  const e = Ze(t);
   return e.charAt(0).toUpperCase() + e.slice(1);
 };
-var je = {
+var Ve = {
   xmlns: "http://www.w3.org/2000/svg",
   width: 24,
   height: 24,
@@ -274,53 +487,53 @@ var je = {
   "stroke-linecap": "round",
   "stroke-linejoin": "round"
 };
-const qe = (t) => {
+const Je = (t) => {
   for (const e in t)
     if (e.startsWith("aria-") || e === "role" || e === "title")
       return !0;
   return !1;
 };
-const Ee = ({
+const Qe = ({
   color: t = "currentColor",
   size: e = 24,
   strokeWidth: s = 2,
   absoluteStrokeWidth: n,
-  children: r,
-  iconNode: o,
-  class: a = "",
+  children: l,
+  iconNode: a,
+  class: o = "",
   ...c
-}) => T(
+}) => M(
   "svg",
   {
-    ...je,
+    ...Ve,
     width: String(e),
     height: e,
     stroke: t,
     "stroke-width": n ? Number(s) * 24 / Number(e) : s,
-    class: ["lucide", a].join(" "),
-    ...!r && !qe(c) && { "aria-hidden": "true" },
+    class: ["lucide", o].join(" "),
+    ...!l && !Je(c) && { "aria-hidden": "true" },
     ...c
   },
-  [...o.map(([i, p]) => T(i, p)), ...Q(r)]
+  [...a.map(([i, h]) => M(i, h)), ...re(l)]
 );
-const W = (t, e) => {
-  const s = ({ class: n = "", className: r = "", children: o, ...a }) => T(
-    Ee,
+const te = (t, e) => {
+  const s = ({ class: n = "", className: l = "", children: a, ...o }) => M(
+    Qe,
     {
-      ...a,
+      ...o,
       iconNode: e,
-      class: Se(
-        `lucide-${F(R(t))}`,
-        `lucide-${F(t)}`,
+      class: We(
+        `lucide-${V(J(t))}`,
+        `lucide-${V(t)}`,
         n,
-        r
+        l
       )
     },
-    o
+    a
   );
-  return s.displayName = R(t), s;
+  return s.displayName = J(t), s;
 };
-const Te = W("eye-off", [
+const Xe = te("eye-off", [
   [
     "path",
     {
@@ -338,7 +551,7 @@ const Te = W("eye-off", [
   ],
   ["path", { d: "m2 2 20 20", key: "1ooewy" }]
 ]);
-const Ae = W("eye", [
+const Ye = te("eye", [
   [
     "path",
     {
@@ -347,296 +560,306 @@ const Ae = W("eye", [
     }
   ],
   ["circle", { cx: "12", cy: "12", r: "3", key: "1v7zrd" }]
-]), Pe = {
+]), et = {
   current: "current-password",
   new: "new-password"
-}, kt = (t) => {
+}, Ht = (t) => {
   const {
     label: e,
     name: s,
     purpose: n,
-    value: r,
-    placeholder: o,
-    required: a,
+    value: l,
+    placeholder: a,
+    required: o,
     disabled: c,
     error: i,
-    onInput: p,
-    class: h
-  } = t, u = v(), _ = `${u}-error`, d = $(!1);
-  return /* @__PURE__ */ l(
-    x,
+    onInput: h,
+    class: p
+  } = t, _ = x(), f = `${_}-error`, d = E(!1);
+  return /* @__PURE__ */ r(
+    D,
     {
       label: e,
-      for: u,
-      required: a,
+      for: _,
+      required: o,
       error: i,
-      errorId: _,
-      class: h,
-      children: /* @__PURE__ */ m("div", { class: q.wrapper, children: [
-        /* @__PURE__ */ l(
+      errorId: f,
+      class: p,
+      children: /* @__PURE__ */ m("div", { class: O.wrapper, children: [
+        /* @__PURE__ */ r(
           "input",
           {
-            id: u,
-            class: q.input,
+            id: _,
+            class: O.input,
             type: d.value ? "text" : "password",
             name: s,
-            value: r,
-            placeholder: o,
-            autoComplete: Pe[n],
-            required: a,
+            value: l,
+            placeholder: a,
+            autoComplete: et[n],
+            required: o,
             disabled: c,
             "aria-invalid": !!i || void 0,
-            "aria-describedby": g(i && _),
-            onInput: p && ((f) => p(f.target.value))
+            "aria-describedby": L(i && f),
+            onInput: h && ((b) => h(b.target.value))
           }
         ),
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ r(
           "button",
           {
             type: "button",
-            class: q.toggle,
+            class: O.toggle,
             disabled: c,
             "aria-label": d.value ? "Hide password" : "Show password",
             onClick: () => {
               d.value = !d.value;
             },
-            children: d.value ? /* @__PURE__ */ l(Te, { size: "1em" }) : /* @__PURE__ */ l(Ae, { size: "1em" })
+            children: d.value ? /* @__PURE__ */ r(Xe, { size: "1em" }) : /* @__PURE__ */ r(Ye, { size: "1em" })
           }
         )
       ] })
     }
   );
-}, ze = "_fieldset_lymkd_1", Be = "_legend_lymkd_6", Oe = "_option_lymkd_11", He = "_input_lymkd_19 _check-input_4u8pk_32 _focus-ring_4u8pk_3", De = "_error_lymkd_23 _field-error_4u8pk_36", w = {
-  fieldset: ze,
-  legend: Be,
-  option: Oe,
-  input: He,
-  error: De
-}, gt = (t) => {
+}, tt = "_fieldset_lymkd_1", nt = "_legend_lymkd_6", st = "_option_lymkd_11", lt = "_input_lymkd_19 _check-input_4u8pk_32 _focus-ring_4u8pk_3", rt = "_error_lymkd_23 _field-error_4u8pk_36", j = {
+  fieldset: tt,
+  legend: nt,
+  option: st,
+  input: lt,
+  error: rt
+}, Ot = (t) => {
   const {
     legend: e,
     name: s,
     options: n,
-    value: r,
-    required: o,
-    disabled: a,
+    value: l,
+    required: a,
+    disabled: o,
     error: c,
     onChange: i,
-    class: p
-  } = t, h = v(), u = `${h}-error`;
+    class: h
+  } = t, p = x(), _ = `${p}-error`;
   return /* @__PURE__ */ m(
     "fieldset",
     {
-      class: b(w.fieldset, p),
+      class: v(j.fieldset, h),
       "aria-invalid": !!c || void 0,
-      "aria-describedby": g(c && u),
+      "aria-describedby": L(c && _),
       children: [
-        /* @__PURE__ */ l("legend", { class: w.legend, children: e }),
-        n.map((_) => {
-          const d = `${h}-${_.value}`;
-          return /* @__PURE__ */ m("div", { class: w.option, children: [
-            /* @__PURE__ */ l(
+        /* @__PURE__ */ r("legend", { class: j.legend, children: e }),
+        n.map((f) => {
+          const d = `${p}-${f.value}`;
+          return /* @__PURE__ */ m("div", { class: j.option, children: [
+            /* @__PURE__ */ r(
               "input",
               {
                 id: d,
-                class: w.input,
+                class: j.input,
                 type: "radio",
                 name: s,
-                value: _.value,
-                checked: r === _.value,
-                required: o,
-                disabled: a,
-                onChange: i && (() => i(_.value))
+                value: f.value,
+                checked: l === f.value,
+                required: a,
+                disabled: o,
+                onChange: i && (() => i(f.value))
               }
             ),
-            /* @__PURE__ */ l("label", { for: d, children: _.label })
-          ] }, _.value);
+            /* @__PURE__ */ r("label", { for: d, children: f.label })
+          ] }, f.value);
         }),
-        c && /* @__PURE__ */ l("p", { id: u, class: w.error, role: "alert", children: c })
+        c && /* @__PURE__ */ r("p", { id: _, class: j.error, role: "alert", children: c })
       ]
     }
   );
-}, yt = (t) => {
-  const { path: e, children: s } = t, n = P.value;
+}, Ft = (t) => {
+  const { path: e, children: s } = t, n = U.value;
   if (e.endsWith("/*")) {
-    const r = e.slice(0, -1);
-    if (!n.startsWith(r) && n !== r.slice(0, -1))
+    const l = e.slice(0, -1);
+    if (!n.startsWith(l) && n !== l.slice(0, -1))
       return null;
   } else if (n !== e)
     return null;
-  return /* @__PURE__ */ l(V, { children: s });
-}, Fe = "_section_4nogy_1", Re = {
-  section: Fe
-}, wt = (t) => {
-  const { title: e, level: s = 2, children: n, class: r } = t, o = v(), a = `h${s}`;
-  return /* @__PURE__ */ m("section", { class: b(Re.section, r), "aria-labelledby": o, children: [
-    /* @__PURE__ */ l(a, { id: o, children: e }),
+  return /* @__PURE__ */ r(se, { children: s });
+}, at = "_section_4nogy_1", ot = {
+  section: at
+}, Mt = (t) => {
+  const { title: e, level: s = 2, children: n, class: l } = t, a = x(), o = `h${s}`;
+  return /* @__PURE__ */ m("section", { class: v(ot.section, l), "aria-labelledby": a, children: [
+    /* @__PURE__ */ r(o, { id: a, children: e }),
     n
   ] });
-}, Me = "_select_1cxnx_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", Ue = {
-  select: Me
-}, Ge = (t) => "options" in t, $t = (t) => {
+}, ct = "_select_1cxnx_1 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", it = {
+  select: ct
+}, dt = (t) => "options" in t, Kt = (t) => {
   const {
     label: e,
     name: s,
     value: n,
-    placeholder: r,
-    options: o,
-    required: a,
+    placeholder: l,
+    options: a,
+    required: o,
     disabled: c,
     error: i,
-    onChange: p,
-    class: h
-  } = t, u = v(), _ = `${u}-error`;
-  return /* @__PURE__ */ l(
-    x,
+    onChange: h,
+    class: p
+  } = t, _ = x(), f = `${_}-error`;
+  return /* @__PURE__ */ r(
+    D,
     {
       label: e,
-      for: u,
-      required: a,
+      for: _,
+      required: o,
       error: i,
-      errorId: _,
-      class: h,
+      errorId: f,
+      class: p,
       children: /* @__PURE__ */ m(
         "select",
         {
-          id: u,
-          class: Ue.select,
+          id: _,
+          class: it.select,
           name: s,
           value: n,
-          required: a,
+          required: o,
           disabled: c,
           "aria-invalid": !!i || void 0,
-          "aria-describedby": g(i && _),
-          onChange: p && ((d) => p(d.target.value)),
+          "aria-describedby": L(i && f),
+          onChange: h && ((d) => h(d.target.value)),
           children: [
-            r && /* @__PURE__ */ l("option", { value: "", disabled: !0, children: r }),
-            o.map(
-              (d) => Ge(d) ? /* @__PURE__ */ l("optgroup", { label: d.label, children: d.options.map((f) => /* @__PURE__ */ l("option", { value: f.value, children: f.label }, f.value)) }, d.label) : /* @__PURE__ */ l("option", { value: d.value, children: d.label }, d.value)
+            l && /* @__PURE__ */ r("option", { value: "", disabled: !0, children: l }),
+            a.map(
+              (d) => dt(d) ? /* @__PURE__ */ r("optgroup", { label: d.label, children: d.options.map((b) => /* @__PURE__ */ r("option", { value: b.value, children: b.label }, b.value)) }, d.label) : /* @__PURE__ */ r("option", { value: d.value, children: d.label }, d.value)
             )
           ]
         }
       )
     }
   );
-}, We = "_skip_xbsul_1 _focus-ring_4u8pk_3", Ze = {
-  skip: We
-}, xt = (t) => {
+}, ut = "_skip_xbsul_1 _focus-ring_4u8pk_3", _t = {
+  skip: ut
+}, Ut = (t) => {
   const { target: e = "#main", label: s = "Skip to main content", class: n } = t;
-  return /* @__PURE__ */ l("a", { href: e, class: b(Ze.skip, n), children: s });
-}, Ke = "_table_dls60_1", Ve = "_caption_dls60_6", M = {
-  table: Ke,
-  caption: Ve
-}, Ct = (t) => {
-  const { caption: e, headers: s, data: n, class: r } = t;
-  return /* @__PURE__ */ m("table", { class: b(M.table, r), children: [
-    /* @__PURE__ */ l("caption", { class: M.caption, children: e }),
-    /* @__PURE__ */ l("thead", { children: /* @__PURE__ */ l("tr", { children: s.map((o, a) => /* @__PURE__ */ l("th", { scope: "col", children: o }, `${o}-${a}`)) }) }),
-    /* @__PURE__ */ l("tbody", { children: n.map((o, a) => /* @__PURE__ */ l("tr", { children: o.map((c, i) => /* @__PURE__ */ l("td", { children: c }, `${s[i]}-${a}-${i}`)) }, a)) })
+  return /* @__PURE__ */ r("a", { href: e, class: v(_t.skip, n), children: s });
+}, pt = "_table_dls60_1", ht = "_caption_dls60_6", Q = {
+  table: pt,
+  caption: ht
+}, Gt = (t) => {
+  const { caption: e, headers: s, data: n, class: l } = t;
+  return /* @__PURE__ */ m("table", { class: v(Q.table, l), children: [
+    /* @__PURE__ */ r("caption", { class: Q.caption, children: e }),
+    /* @__PURE__ */ r("thead", { children: /* @__PURE__ */ r("tr", { children: s.map((a, o) => /* @__PURE__ */ r("th", { scope: "col", children: a }, `${a}-${o}`)) }) }),
+    /* @__PURE__ */ r("tbody", { children: n.map((a, o) => /* @__PURE__ */ r("tr", { children: a.map((c, i) => /* @__PURE__ */ r("td", { children: c }, `${s[i]}-${o}-${i}`)) }, o)) })
   ] });
-}, Je = "_hidden_19nib_1 _visually-hidden_4u8pk_42", Qe = {
-  hidden: Je
-}, Xe = (t) => {
+}, ft = "_hidden_19nib_1 _visually-hidden_4u8pk_42", mt = {
+  hidden: ft
+}, bt = (t) => {
   const { children: e } = t;
-  return /* @__PURE__ */ l("span", { class: Qe.hidden, children: e });
-}, Ye = "_wrapper_1kyv1_1", et = "_textarea_1kyv1_6 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", tt = "_counter_1kyv1_11", E = {
-  wrapper: Ye,
-  textarea: et,
-  counter: tt
-}, U = [75, 90, 100], st = 10;
-function nt(t) {
-  for (let e = U.length - 1; e >= 0; e--) {
-    const s = U[e];
+  return /* @__PURE__ */ r("span", { class: mt.hidden, children: e });
+}, vt = "_wrapper_1kyv1_1", kt = "_textarea_1kyv1_6 _text-input_4u8pk_13 _focus-ring_4u8pk_3 _disabled_4u8pk_8", gt = "_counter_1kyv1_11", F = {
+  wrapper: vt,
+  textarea: kt,
+  counter: gt
+}, X = [75, 90, 100], yt = 10;
+function wt(t) {
+  for (let e = X.length - 1; e >= 0; e--) {
+    const s = X[e];
     if (s !== void 0 && t >= s)
       return s;
   }
   return 0;
 }
-const It = (t) => {
+const Wt = (t) => {
   const {
     label: e,
     name: s,
     maxChars: n,
-    value: r,
-    placeholder: o,
-    required: a,
+    value: l,
+    placeholder: a,
+    required: o,
     disabled: c,
     error: i,
-    onInput: p,
-    class: h
-  } = t, u = v(), _ = `${u}-error`, d = `${u}-counter`, f = $(r?.length ?? 0), k = $(""), y = $(0), C = $(!1);
-  return /* @__PURE__ */ l(
-    x,
+    onInput: h,
+    class: p
+  } = t, _ = x(), f = `${_}-error`, d = `${_}-counter`, b = E(l?.length ?? 0), g = E(""), $ = E(0), C = E(!1);
+  return /* @__PURE__ */ r(
+    D,
     {
       label: e,
-      for: u,
-      required: a,
+      for: _,
+      required: o,
       error: i,
-      errorId: _,
-      class: h,
-      children: /* @__PURE__ */ m("div", { class: E.wrapper, children: [
-        /* @__PURE__ */ l(
+      errorId: f,
+      class: p,
+      children: /* @__PURE__ */ m("div", { class: F.wrapper, children: [
+        /* @__PURE__ */ r(
           "textarea",
           {
-            id: u,
-            class: E.textarea,
+            id: _,
+            class: F.textarea,
             name: s,
             maxLength: n,
-            placeholder: o,
-            required: a,
+            placeholder: a,
+            required: o,
             disabled: c,
             "aria-invalid": !!i || void 0,
-            "aria-describedby": g(i && _, d),
-            onInput: (Z) => {
-              const I = Z.target.value;
-              f.value = I.length;
-              const N = n - I.length, K = I.length / n * 100, z = nt(K), B = !C.value && N <= st && N > 0;
-              (z > y.value || B) && (k.value = `${N} character${N === 1 ? "" : "s"} remaining`, y.value = z, B && (C.value = !0)), p?.(I);
+            "aria-describedby": L(i && f, d),
+            onInput: (q) => {
+              const u = q.target.value;
+              b.value = u.length;
+              const k = n - u.length, I = u.length / n * 100, N = wt(I), w = !C.value && k <= yt && k > 0;
+              (N > $.value || w) && (g.value = `${k} character${k === 1 ? "" : "s"} remaining`, $.value = N, w && (C.value = !0)), h?.(u);
             },
-            children: r
+            children: l
           }
         ),
-        /* @__PURE__ */ m("span", { id: d, class: E.counter, children: [
-          f,
+        /* @__PURE__ */ m("span", { id: d, class: F.counter, children: [
+          b,
           " / ",
           n
         ] }),
-        /* @__PURE__ */ l(Xe, { children: /* @__PURE__ */ l("span", { "aria-live": "polite", children: k }) })
+        /* @__PURE__ */ r(bt, { children: /* @__PURE__ */ r("span", { "aria-live": "polite", children: g }) })
       ] })
     }
   );
-}, rt = "_theme_1x47p_11", lt = {
-  theme: rt
-}, Nt = (t) => {
+}, xt = "_theme_1x47p_11", $t = {
+  theme: xt
+}, Zt = {
+  blue: "aui-blue",
+  purple: "aui-purple",
+  teal: "aui-teal",
+  red: "aui-red",
+  orange: "aui-orange",
+  yellow: "aui-yellow"
+}, Vt = (t) => {
   const { children: e, class: s } = t;
-  return /* @__PURE__ */ l("div", { class: b(lt.theme, s), children: e });
-}, at = A(document.title);
-J(() => {
-  document.title = at.value;
+  return /* @__PURE__ */ r("div", { class: v($t.theme, s), children: e });
+}, Ct = K(document.title);
+le(() => {
+  document.title = Ct.value;
 });
 export {
-  O as Button,
-  ut as Card,
-  _t as Checkbox,
-  pt as DownloadLink,
-  ht as Form,
-  mt as Input,
-  bt as Link,
-  ft as Nav,
-  vt as NumberInput,
-  kt as PasswordInput,
-  gt as RadioGroup,
-  yt as Route,
-  wt as Section,
-  $t as Select,
-  xt as SkipLink,
-  Ct as Table,
-  It as Textarea,
-  Nt as Theme,
-  Xe as VisuallyHidden,
-  b as cx,
-  G as hash,
-  P as location,
-  ve as navigate,
-  at as title
+  G as Button,
+  Et as Card,
+  Dt as Checkbox,
+  St as Dialog,
+  At as DownloadLink,
+  Bt as Form,
+  qt as Input,
+  Pt as Link,
+  Tt as Modal,
+  Rt as Nav,
+  zt as NumberInput,
+  Zt as Palette,
+  Ht as PasswordInput,
+  Ot as RadioGroup,
+  Ft as Route,
+  Mt as Section,
+  Kt as Select,
+  Ut as SkipLink,
+  Gt as Table,
+  Wt as Textarea,
+  Vt as Theme,
+  bt as VisuallyHidden,
+  v as cx,
+  ee as hash,
+  U as location,
+  Te as navigate,
+  Ct as title
 };