@apliteni/apliteni-ui 0.133.0 → 0.137.0

package/react/dist/index.js

@@ -282,24 +282,30 @@ var StatusDot = forwardRef5(function StatusDot2({
 });
 
 // src/primitives/Card.tsx
-import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
-function Card({ title, sub, level = 2, className, children }) {
+import { icon as kitIcon, safeUrl } from "@apliteni/apliteni-ui";
+import { Fragment, jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
+function Card({ title, sub, level = 2, variant, pad: pad2, icon: icon8, href, className, children }) {
   const n = Number(level);
-  const Heading = `h${[2, 3, 4, 5, 6].includes(n) ? n : 2}`;
+  const Heading = href != null ? "div" : `h${[2, 3, 4, 5, 6].includes(n) ? n : 2}`;
   const titled = title != null && title !== false && title !== "";
-  return /* @__PURE__ */ jsxs5("div", { className: ["ui-card", className].filter(Boolean).join(" "), children: [
-    titled && /* @__PURE__ */ jsx9(Heading, { className: "ui-card__title", children: title }),
+  const classes = ["ui-card", variant && `ui-card--${variant}`, pad2 && `ui-card--pad-${pad2}`, href != null && "ui-card--interactive", className].filter(Boolean).join(" ");
+  const inner = /* @__PURE__ */ jsxs5(Fragment, { children: [
+    titled && /* @__PURE__ */ jsxs5(Heading, { className: "ui-card__title", children: [
+      icon8 && /* @__PURE__ */ jsx9("span", { className: "ui-card__icon", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: kitIcon(icon8) } }),
+      title
+    ] }),
     sub != null && /* @__PURE__ */ jsx9("div", { className: "ui-card__sub", children: sub }),
     children
   ] });
+  return href != null ? /* @__PURE__ */ jsx9("a", { className: classes, href: safeUrl(href), children: inner }) : /* @__PURE__ */ jsx9("div", { className: classes, children: inner });
 }
 
 // src/primitives/Callout.tsx
-import { calloutIcons, icon as kitIcon } from "@apliteni/apliteni-ui";
+import { calloutIcons, icon as kitIcon2 } from "@apliteni/apliteni-ui";
 import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
 function Callout({ variant, icon: icon8 = calloutIcons[variant ?? "neutral"], children, actions }) {
   return /* @__PURE__ */ jsxs6("div", { className: `ui-callout${variant && variant !== "neutral" ? ` ui-callout--${variant}` : ""}`, role: variant === "danger" ? "alert" : void 0, children: [
-    /* @__PURE__ */ jsx10("span", { className: "ui-callout__icon", dangerouslySetInnerHTML: { __html: kitIcon(icon8) } }),
+    /* @__PURE__ */ jsx10("span", { className: "ui-callout__icon", dangerouslySetInnerHTML: { __html: kitIcon2(icon8) } }),
     /* @__PURE__ */ jsxs6("div", { className: "ui-callout__body", children: [
       children,
       actions != null && /* @__PURE__ */ jsx10("div", { className: "ui-toolbar ui-callout__actions", children: actions })
@@ -351,7 +357,7 @@ function placeTip(host, mark, tip, bound, placement = "top") {
 
 // src/Tooltip.tsx
 import { useEffect, useId as useId2, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState as useState2 } from "react";
-import { Fragment, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
+import { Fragment as Fragment2, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
 var DOC_EVENTS = ["pointerdown", "pointercancel", "click", "keydown", "touchend"];
 var CAPTURED = /* @__PURE__ */ new Set(["pointerdown", "pointercancel"]);
 var wirings = /* @__PURE__ */ new WeakMap();
@@ -378,7 +384,7 @@ function wireDocument(doc, handlers) {
     wirings.delete(doc);
   };
 }
-var Text = ({ label = "", value = "", detail: detail2 = "" }) => /* @__PURE__ */ jsxs7(Fragment, { children: [
+var Text2 = ({ label = "", value = "", detail: detail2 = "" }) => /* @__PURE__ */ jsxs7(Fragment2, { children: [
   /* @__PURE__ */ jsx11("span", { className: "ui-tip__label", hidden: !label, children: label }),
   /* @__PURE__ */ jsx11("span", { className: "ui-tip__value", hidden: !value, children: value }),
   /* @__PURE__ */ jsx11("span", { className: "ui-tip__detail", hidden: !detail2, children: detail2 })
@@ -532,14 +538,14 @@ function Tooltip({ text: text2, label = text2, value, detail: detail2, placement
       },
       children: [
         /* @__PURE__ */ jsx11("span", { ref: trigger, className: "ui-focusable", tabIndex: 0, "aria-describedby": id, children }),
-        /* @__PURE__ */ jsx11("span", { ref: tip, id, "data-tip": "", role: "tooltip", className: `ui-tip${open ? " is-open" : ""}`, children: /* @__PURE__ */ jsx11(Text, { label, value, detail: detail2 }) })
+        /* @__PURE__ */ jsx11("span", { ref: tip, id, "data-tip": "", role: "tooltip", className: `ui-tip${open ? " is-open" : ""}`, children: /* @__PURE__ */ jsx11(Text2, { label, value, detail: detail2 }) })
       ]
     }
   );
 }
 
 // src/primitives/StatBand.tsx
-import { Fragment as Fragment2, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
+import { Fragment as Fragment3, jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
 var GLYPH = { up: "arrowUp", down: "arrowDown", flat: "minus" };
 var directionOf = (text2) => {
   const t = text2.trim();
@@ -548,7 +554,7 @@ var directionOf = (text2) => {
 var hasChange = (d) => !!d && d.value != null && d.value !== "";
 function ContextRow({ caption, delta, basisId }) {
   if (!hasChange(delta)) return caption ? /* @__PURE__ */ jsx12("dd", { className: "ui-stat__caption", children: caption }) : null;
-  const lead = caption ? /* @__PURE__ */ jsxs8(Fragment2, { children: [
+  const lead = caption ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
     /* @__PURE__ */ jsx12("span", { className: "ui-stat__caption", children: caption }),
     " "
   ] }) : null;
@@ -558,7 +564,7 @@ function ContextRow({ caption, delta, basisId }) {
     lead,
     /* @__PURE__ */ jsx12(Icon, { name: GLYPH[dir] }),
     delta.tooltip ? /* @__PURE__ */ jsx12(Tooltip, { text: delta.tooltip, children: /* @__PURE__ */ jsx12("span", { className: "ui-stat__change", children: delta.value }) }) : /* @__PURE__ */ jsx12("span", { className: "ui-stat__change", children: delta.value }),
-    own ? /* @__PURE__ */ jsxs8(Fragment2, { children: [
+    own ? /* @__PURE__ */ jsxs8(Fragment3, { children: [
       " ",
       /* @__PURE__ */ jsx12("span", { className: "ui-stat__basis", children: own })
     ] }) : null
@@ -677,10 +683,12 @@ function sync() {
     else document.removeEventListener("keydown", onKey);
   }
 }
-function returnFocus(opener) {
+function returnFocus(opener, fallback) {
   const live = opener && !opener.isConnected && opener.id ? document.getElementById(opener.id) : opener;
-  if (live?.isConnected) live.focus?.();
-  if (document.activeElement !== live) document.activeElement?.blur?.();
+  const visible = live?.isConnected && (!fallback || live instanceof HTMLElement && !live.closest('[hidden], [aria-hidden="true"], [inert]') && !live.matches(':disabled, [aria-disabled="true"]') && (typeof live.checkVisibility !== "function" || live.checkVisibility({ visibilityProperty: true })));
+  const target = visible ? live : fallback?.isConnected ? fallback : null;
+  if (target) target.focus?.();
+  if (document.activeElement !== target) document.activeElement?.blur?.();
 }
 function enter(entry) {
   const at = stack.findIndex((e) => {
@@ -710,7 +718,7 @@ function exit(entry) {
   if (above) return;
   const next = stack[stack.length - 1];
   if (!next) {
-    returnFocus(entry.opener);
+    returnFocus(entry.opener, entry.fallback);
     return;
   }
   const back = [entry.opener, next.resume].find((el) => el?.isConnected && next.panel.contains(el));
@@ -766,7 +774,7 @@ function usePresence(open, root, panel) {
   }, [open, present]);
   return { mounted: present, shown };
 }
-function useDialog(active, { root, panel, body, initialFocus }, onClose) {
+function useDialog(active, { root, panel, body, initialFocus, fallbackFocus }, onClose) {
   const parent = useContext(DialogScope);
   const [scope] = useState3(() => ({ parent }));
   const close = useRef3(onClose);
@@ -783,6 +791,7 @@ function useDialog(active, { root, panel, body, initialFocus }, onClose) {
       initialFocus: initialFocus?.current ?? null,
       close: () => close.current(),
       opener: document.activeElement,
+      fallback: fallbackFocus?.current ?? null,
       resume: null
     };
     enter(entry);
@@ -829,7 +838,7 @@ function Modal({ open, title, onClose, footer, children, initialFocusRef, role =
 }
 
 // src/Confirm.tsx
-import { Fragment as Fragment3, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
+import { Fragment as Fragment4, jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
 function Confirm({
   open,
   title,
@@ -850,7 +859,7 @@ function Confirm({
       onClose: onCancel,
       role: "alertdialog",
       initialFocusRef: safeAction,
-      footer: /* @__PURE__ */ jsxs10(Fragment3, { children: [
+      footer: /* @__PURE__ */ jsxs10(Fragment4, { children: [
         /* @__PURE__ */ jsx14(Button, { ref: safeAction, variant: "ghost", onClick: onCancel, children: cancelLabel }),
         /* @__PURE__ */ jsx14(Button, { variant: danger ? "danger" : "primary", busy, onClick: onConfirm, children: confirmLabel })
       ] }),
@@ -859,10 +868,250 @@ function Confirm({
   );
 }
 
-// src/Drawer.tsx
-import { useId as useId5, useRef as useRef6 } from "react";
+// src/Feedback.tsx
+import { useEffect as useEffect3, useRef as useRef6, useState as useState4 } from "react";
 import { createPortal as createPortal2 } from "react-dom";
-import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+import { nearestSection } from "@apliteni/apliteni-ui";
+import { Fragment as Fragment5, jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
+var defaultSection = (h) => {
+  if (!h) return { label: "this page", title: "", anchor: "" };
+  const t = (h.textContent || "").replace(/\s+/g, " ").trim();
+  return { label: t, title: t, anchor: h.id || "" };
+};
+var RETURN_CONTROL = 'a[href], button:not(:disabled), input:not(:disabled), select:not(:disabled), textarea:not(:disabled), summary, [role="button"], [role="link"], [role="checkbox"], [role="switch"], [role="tab"], [contenteditable="true"]';
+function Feedback({
+  container,
+  onSend,
+  minChars = 3,
+  section = defaultSection,
+  label = "Give feedback",
+  placeholder = "What's off, missing, or worth adding here?",
+  sentMessage = "Thanks, your note is sent."
+}) {
+  const [pill, setPill] = useState4(null);
+  const [open, setOpen] = useState4(false);
+  const openRef = useRef6(false);
+  const [note, setNote] = useState4("");
+  const [state, setState] = useState4("ready");
+  const [error, setError] = useState4("");
+  const pending = useRef6(null);
+  const [view, setView] = useState4({ chip: "this page", quote: "" });
+  const mark = useRef6(null);
+  const opening = useRef6(0);
+  const pillRef = useRef6(null);
+  const root = useRef6(null);
+  const panel = useRef6(null);
+  const body = useRef6(null);
+  const noteRef = useRef6(null);
+  const doneClose = useRef6(null);
+  const opts = useRef6({ minChars, section });
+  opts.current = { minChars, section };
+  useEffect3(() => {
+    function onSelect() {
+      if (openRef.current) return;
+      const el = container.current;
+      const sel = window.getSelection();
+      if (!el || !sel || sel.isCollapsed || !sel.rangeCount) {
+        setPill(null);
+        return;
+      }
+      const range = sel.getRangeAt(0);
+      if (!el.contains(range.commonAncestorContainer)) {
+        setPill(null);
+        return;
+      }
+      const text2 = sel.toString().trim();
+      if (text2.length < opts.current.minChars) {
+        setPill(null);
+        return;
+      }
+      const rect = range.getBoundingClientRect();
+      if (!rect.width && !rect.height) return;
+      const s = opts.current.section(nearestSection(range.startContainer, el)) || {};
+      pending.current = { text: text2, anchor: s.anchor || "", label: s.label || "", title: s.title || "", range: range.cloneRange() };
+      setPill({ left: window.scrollX + rect.left + rect.width / 2, top: window.scrollY + rect.top });
+    }
+    const later = () => {
+      setTimeout(onSelect, 0);
+    };
+    const onKeyUp = (e) => {
+      if (e.shiftKey || e.key === "Shift") later();
+    };
+    const hide = () => {
+      if (!openRef.current) setPill(null);
+    };
+    const onMouseUp = (e) => {
+      const target = e.target;
+      if (target instanceof Node && (root.current?.contains(target) || pillRef.current?.contains(target))) return;
+      later();
+    };
+    document.addEventListener("mouseup", onMouseUp);
+    document.addEventListener("keyup", onKeyUp);
+    window.addEventListener("scroll", hide, { passive: true });
+    return () => {
+      document.removeEventListener("mouseup", onMouseUp);
+      document.removeEventListener("keyup", onKeyUp);
+      window.removeEventListener("scroll", hide);
+    };
+  }, [container]);
+  function clearMark() {
+    const m = mark.current;
+    mark.current = null;
+    const span = m?.span;
+    if (!m || !span?.parentNode) return;
+    const restoreRange = () => {
+      if (!m.start?.isConnected || !m.end?.isConnected) return;
+      const range = document.createRange();
+      range.setStart(m.start, m.startOffset);
+      range.setEnd(m.end, m.endOffset);
+      m.selection.range = range;
+    };
+    const kids = Array.from(span.childNodes);
+    const first = kids[0];
+    const last = kids[kids.length - 1];
+    if (m.start && m.start === m.end) {
+      const tail = span.nextSibling;
+      if (kids.length === 1 && first instanceof Text && span.previousSibling === m.start && tail instanceof Text) {
+        m.start.data += first.data + tail.data;
+        tail.remove();
+        span.remove();
+        restoreRange();
+        return;
+      }
+    } else {
+      if (m.start && first instanceof Text && span.previousSibling === m.start) {
+        m.start.data += first.data;
+        first.remove();
+      }
+      if (m.end && last instanceof Text && last !== first && span.nextSibling === m.end) {
+        m.end.data = last.data + m.end.data;
+        last.remove();
+      }
+    }
+    span.replaceWith(...Array.from(span.childNodes));
+    restoreRange();
+  }
+  useEffect3(() => () => {
+    opening.current++;
+    clearMark();
+  }, []);
+  const { mounted, shown } = usePresence(open, root, panel);
+  function close() {
+    opening.current++;
+    openRef.current = false;
+    setOpen(false);
+    clearMark();
+  }
+  useDialog(shown, { root, panel, body, initialFocus: noteRef, fallbackFocus: pillRef }, close);
+  function start() {
+    const p = pending.current;
+    if (!p) return;
+    opening.current++;
+    openRef.current = true;
+    const before = document.activeElement;
+    if (!(before instanceof HTMLElement) || before.tabIndex < 0 || !before.matches(RETURN_CONTROL) || before.getAttribute("aria-disabled") === "true" || typeof before.checkVisibility === "function" && !before.checkVisibility({ visibilityProperty: true })) {
+      pillRef.current?.focus({ preventScroll: true });
+    }
+    setView({ chip: p.label || "this page", quote: p.text.length > 200 ? `${p.text.slice(0, 200)}\u2026` : p.text });
+    setNote("");
+    setError("");
+    setState("ready");
+    try {
+      const span = document.createElement("span");
+      span.className = "ui-fbmark";
+      const start2 = p.range.startContainer instanceof Text ? p.range.startContainer : null;
+      const end = p.range.endContainer instanceof Text ? p.range.endContainer : null;
+      const startOffset = p.range.startOffset;
+      const endOffset = p.range.endOffset;
+      p.range.surroundContents(span);
+      mark.current = { span, start: start2, end, startOffset, endOffset, selection: p };
+    } catch {
+      mark.current = null;
+    }
+    window.getSelection()?.removeAllRanges();
+    setOpen(true);
+  }
+  async function send() {
+    const p = pending.current;
+    if (state !== "ready" || !p || !note.trim()) return;
+    const sentOpening = opening.current;
+    setError("");
+    setState("sending");
+    try {
+      const res = await onSend({ note: note.trim(), excerpt: p.text, anchor: p.anchor, sectionLabel: p.label, sectionTitle: p.title });
+      if (opening.current !== sentOpening) return;
+      if (!res || !res.ok) throw new Error(res?.error);
+      clearMark();
+      setState("sent");
+      setTimeout(() => {
+        if (opening.current === sentOpening) doneClose.current?.focus();
+      }, 0);
+    } catch (e) {
+      if (opening.current !== sentOpening) return;
+      setError(e instanceof Error && e.message || "Could not send just now \u2014 try again in a moment.");
+      setState("ready");
+    }
+  }
+  return createPortal2(/* @__PURE__ */ jsxs11(Fragment5, { children: [
+    /* @__PURE__ */ jsxs11(
+      "button",
+      {
+        ref: pillRef,
+        type: "button",
+        className: pill ? "ui-fbpill show" : "ui-fbpill",
+        tabIndex: pill ? 0 : -1,
+        "aria-hidden": pill ? void 0 : true,
+        style: pill ?? void 0,
+        onMouseDown: (e) => e.preventDefault(),
+        onClick: start,
+        children: [
+          /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ jsx15("path", { d: "M21 15a2 2 0 0 1-2 2H8l-4 4V5a2 2 0 0 1 2-2h13a2 2 0 0 1 2 2z" }) }),
+          label
+        ]
+      }
+    ),
+    mounted && /* @__PURE__ */ jsxs11("div", { ref: root, children: [
+      /* @__PURE__ */ jsx15("div", { className: shown ? "ui-fbscrim show" : "ui-fbscrim", onClick: close }),
+      /* @__PURE__ */ jsx15("div", { ref: panel, className: shown ? "ui-fbcomposer show" : "ui-fbcomposer", role: "dialog", "aria-modal": "true", "aria-label": "Leave feedback", tabIndex: -1, children: state === "sent" ? /* @__PURE__ */ jsxs11("div", { className: "ui-fbc__done", ref: body, children: [
+        /* @__PURE__ */ jsx15("p", { role: "status", children: sentMessage }),
+        /* @__PURE__ */ jsx15("div", { className: "row", children: /* @__PURE__ */ jsx15(Button, { ref: doneClose, variant: "ghost", onClick: close, children: "Close" }) })
+      ] }) : /* @__PURE__ */ jsxs11("div", { ref: body, children: [
+        /* @__PURE__ */ jsxs11("div", { className: "ui-fbc__head", children: [
+          /* @__PURE__ */ jsxs11("span", { className: "ui-fbc__chip", children: [
+            /* @__PURE__ */ jsx15("svg", { viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ jsx15("path", { d: "M4 5h16M4 12h10M4 19h7" }) }),
+            /* @__PURE__ */ jsx15("span", { children: view.chip })
+          ] }),
+          /* @__PURE__ */ jsx15(Button, { variant: "ghost", size: "sm", iconOnly: true, icon: "x", "aria-label": "Close", style: { marginLeft: "auto" }, onClick: close })
+        ] }),
+        /* @__PURE__ */ jsxs11("div", { className: "ui-fbc__quote", children: [
+          /* @__PURE__ */ jsx15("span", { className: "ui-fbc__qm", children: "\u201C" }),
+          /* @__PURE__ */ jsx15("q", { children: view.quote })
+        ] }),
+        /* @__PURE__ */ jsx15("div", { className: "ui-fbc__body", children: /* @__PURE__ */ jsx15(
+          "textarea",
+          {
+            ref: noteRef,
+            maxLength: 6e3,
+            value: note,
+            placeholder,
+            "aria-label": "Your note",
+            onChange: (e) => setNote(e.target.value)
+          }
+        ) }),
+        error && /* @__PURE__ */ jsx15("div", { className: "ui-fbc__err show is-entering", role: "alert", children: error }),
+        /* @__PURE__ */ jsxs11("div", { className: "ui-fbc__foot", children: [
+          /* @__PURE__ */ jsx15(Button, { variant: "ghost", onClick: close, children: "Cancel" }),
+          /* @__PURE__ */ jsx15(Button, { variant: "primary", busy: state === "sending", disabled: !note.trim(), onClick: send, children: "Send feedback" })
+        ] })
+      ] }) })
+    ] })
+  ] }), document.body);
+}
+
+// src/Drawer.tsx
+import { useId as useId5, useRef as useRef7 } from "react";
+import { createPortal as createPortal3 } from "react-dom";
+import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
 function Drawer({
   open,
   title,
@@ -873,18 +1122,18 @@ function Drawer({
   children,
   closeLabel = "Close"
 }) {
-  const root = useRef6(null);
-  const panel = useRef6(null);
-  const body = useRef6(null);
+  const root = useRef7(null);
+  const panel = useRef7(null);
+  const body = useRef7(null);
   const titleId = useId5();
   const { mounted, shown } = usePresence(open, root, panel);
   const scope = useDialog(shown, { root, panel, body }, onClose);
   if (!mounted) return null;
   const cls = ["ui-drawer", `ui-drawer--${side}`, `ui-drawer--${size}`, shown && "is-open"].filter(Boolean).join(" ");
-  return createPortal2(
-    /* @__PURE__ */ jsx15(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs11("div", { className: cls, ref: root, children: [
-      /* @__PURE__ */ jsx15("div", { className: "ui-drawer__scrim", onMouseDown: dismissOnScrim(onClose) }),
-      /* @__PURE__ */ jsxs11(
+  return createPortal3(
+    /* @__PURE__ */ jsx16(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs12("div", { className: cls, ref: root, children: [
+      /* @__PURE__ */ jsx16("div", { className: "ui-drawer__scrim", onMouseDown: dismissOnScrim(onClose) }),
+      /* @__PURE__ */ jsxs12(
         "aside",
         {
           className: "ui-drawer__panel",
@@ -894,12 +1143,12 @@ function Drawer({
           tabIndex: -1,
           ref: panel,
           children: [
-            /* @__PURE__ */ jsxs11("header", { className: "ui-drawer__header", children: [
-              /* @__PURE__ */ jsx15("h2", { className: "ui-drawer__title", id: titleId, children: title }),
-              /* @__PURE__ */ jsx15("button", { type: "button", className: "ui-drawer__close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx15(Icon, { name: "x" }) })
+            /* @__PURE__ */ jsxs12("header", { className: "ui-drawer__header", children: [
+              /* @__PURE__ */ jsx16("h2", { className: "ui-drawer__title", id: titleId, children: title }),
+              /* @__PURE__ */ jsx16("button", { type: "button", className: "ui-drawer__close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx16(Icon, { name: "x" }) })
             ] }),
-            /* @__PURE__ */ jsx15("div", { className: "ui-drawer__body", ref: body, children }),
-            footer && /* @__PURE__ */ jsx15("footer", { className: "ui-drawer__footer", children: footer })
+            /* @__PURE__ */ jsx16("div", { className: "ui-drawer__body", ref: body, children }),
+            footer && /* @__PURE__ */ jsx16("footer", { className: "ui-drawer__footer", children: footer })
           ]
         }
       )
@@ -909,12 +1158,12 @@ function Drawer({
 }
 
 // src/CommandPalette.tsx
-import { useCallback as useCallback2, useEffect as useEffect3, useId as useId6, useMemo, useRef as useRef7, useState as useState4 } from "react";
-import { createPortal as createPortal3 } from "react-dom";
+import { useCallback as useCallback2, useEffect as useEffect4, useId as useId6, useMemo, useRef as useRef8, useState as useState5 } from "react";
+import { createPortal as createPortal4 } from "react-dom";
 import { rankGroups, icon as icon3 } from "@apliteni/apliteni-ui";
-import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
+import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
 var cx2 = (...a) => a.filter(Boolean).join(" ");
-var Glyph = ({ name, className }) => /* @__PURE__ */ jsx16("span", { className, "aria-hidden": "true", dangerouslySetInnerHTML: { __html: icon3(name) } });
+var Glyph = ({ name, className }) => /* @__PURE__ */ jsx17("span", { className, "aria-hidden": "true", dangerouslySetInnerHTML: { __html: icon3(name) } });
 var keysOf = (shortcut) => shortcut == null ? [] : Array.isArray(shortcut) ? shortcut : [shortcut];
 function CommandPalette({
   open,
@@ -930,12 +1179,12 @@ function CommandPalette({
   onQueryChange
 }) {
   const uid = useId6().replace(/:/g, "");
-  const root = useRef7(null);
-  const panel = useRef7(null);
-  const search = useRef7(null);
-  const [query, setQuery] = useState4("");
-  const [at, setAt] = useState4(0);
-  useEffect3(() => {
+  const root = useRef8(null);
+  const panel = useRef8(null);
+  const search = useRef8(null);
+  const [query, setQuery] = useState5("");
+  const [at, setAt] = useState5(0);
+  useEffect4(() => {
     if (open) {
       setQuery("");
       setAt(0);
@@ -947,7 +1196,7 @@ function CommandPalette({
   );
   const rows = useMemo(() => shown.flatMap((g) => g.items).filter((it) => !isDisabled(it)), [shown]);
   const active = rows[Math.min(at, rows.length - 1)];
-  useEffect3(() => {
+  useEffect4(() => {
     setAt(0);
   }, [query]);
   const scope = useDialog(open, { root, panel, body: search }, onClose);
@@ -978,10 +1227,10 @@ function CommandPalette({
   if (!open) return null;
   const listId = `${uid}-list`;
   let n = 0;
-  return createPortal3(
-    /* @__PURE__ */ jsx16(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs12("div", { className: cx2("ui-cmdk", density === "roomy" && "ui-cmdk--roomy", "is-open"), ref: root, children: [
-      /* @__PURE__ */ jsx16("div", { className: "ui-cmdk__scrim", onMouseDown: dismissOnScrim(onClose) }),
-      /* @__PURE__ */ jsxs12(
+  return createPortal4(
+    /* @__PURE__ */ jsx17(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs13("div", { className: cx2("ui-cmdk", density === "roomy" && "ui-cmdk--roomy", "is-open"), ref: root, children: [
+      /* @__PURE__ */ jsx17("div", { className: "ui-cmdk__scrim", onMouseDown: dismissOnScrim(onClose) }),
+      /* @__PURE__ */ jsxs13(
         "div",
         {
           className: "ui-cmdk__panel",
@@ -992,9 +1241,9 @@ function CommandPalette({
           ref: panel,
           onKeyDown,
           children: [
-            /* @__PURE__ */ jsxs12("div", { className: "ui-cmdk__search", ref: search, children: [
-              /* @__PURE__ */ jsx16(Glyph, { name: "search", className: "ui-cmdk__search-ic" }),
-              /* @__PURE__ */ jsx16(
+            /* @__PURE__ */ jsxs13("div", { className: "ui-cmdk__search", ref: search, children: [
+              /* @__PURE__ */ jsx17(Glyph, { name: "search", className: "ui-cmdk__search-ic" }),
+              /* @__PURE__ */ jsx17(
                 "input",
                 {
                   className: "ui-cmdk__input",
@@ -1016,19 +1265,19 @@ function CommandPalette({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx16("div", { className: "ui-cmdk__list", id: listId, role: "listbox", "aria-label": `${label} results`, children: shown.map((group, gi) => /* @__PURE__ */ jsxs12(
+            /* @__PURE__ */ jsx17("div", { className: "ui-cmdk__list", id: listId, role: "listbox", "aria-label": `${label} results`, children: shown.map((group, gi) => /* @__PURE__ */ jsxs13(
               "div",
               {
                 className: "ui-cmdk__group",
                 role: "group",
                 "aria-labelledby": group.label ? `${uid}-g${gi}` : void 0,
                 children: [
-                  group.label && /* @__PURE__ */ jsx16("div", { className: "ui-cmdk__group-head", id: `${uid}-g${gi}`, children: group.label }),
+                  group.label && /* @__PURE__ */ jsx17("div", { className: "ui-cmdk__group-head", id: `${uid}-g${gi}`, children: group.label }),
                   group.items.map((item) => {
                     const disabled = isDisabled(item);
                     const id = `${uid}-o${n++}`;
                     const on = item === active;
-                    return /* @__PURE__ */ jsxs12(
+                    return /* @__PURE__ */ jsxs13(
                       "div",
                       {
                         id,
@@ -1048,13 +1297,13 @@ function CommandPalette({
                         },
                         onClick: (e) => run(item, e.metaKey || e.ctrlKey),
                         children: [
-                          item.icon && /* @__PURE__ */ jsx16(Glyph, { name: item.icon, className: "ui-cmdk__ic" }),
-                          /* @__PURE__ */ jsxs12("span", { className: "ui-cmdk__main", children: [
-                            /* @__PURE__ */ jsx16("span", { className: "ui-cmdk__label", children: item.label }),
-                            item.description && /* @__PURE__ */ jsx16("span", { className: "ui-cmdk__desc", children: item.description })
+                          item.icon && /* @__PURE__ */ jsx17(Glyph, { name: item.icon, className: "ui-cmdk__ic" }),
+                          /* @__PURE__ */ jsxs13("span", { className: "ui-cmdk__main", children: [
+                            /* @__PURE__ */ jsx17("span", { className: "ui-cmdk__label", children: item.label }),
+                            item.description && /* @__PURE__ */ jsx17("span", { className: "ui-cmdk__desc", children: item.description })
                           ] }),
-                          item.badge && /* @__PURE__ */ jsx16("span", { className: "ui-cmdk__badge", children: item.badge }),
-                          keysOf(item.shortcut).length > 0 && /* @__PURE__ */ jsx16("span", { className: "ui-cmdk__keys", "aria-hidden": "true", children: keysOf(item.shortcut).map((k) => /* @__PURE__ */ jsx16("kbd", { className: "ui-cmdk__key", children: k }, k)) })
+                          item.badge && /* @__PURE__ */ jsx17("span", { className: "ui-cmdk__badge", children: item.badge }),
+                          keysOf(item.shortcut).length > 0 && /* @__PURE__ */ jsx17("span", { className: "ui-cmdk__keys", "aria-hidden": "true", children: keysOf(item.shortcut).map((k) => /* @__PURE__ */ jsx17("kbd", { className: "ui-cmdk__key", children: k }, k)) })
                         ]
                       },
                       item.id
@@ -1064,20 +1313,20 @@ function CommandPalette({
               },
               group.label ?? `g${gi}`
             )) }),
-            /* @__PURE__ */ jsx16("p", { className: "ui-cmdk__empty", hidden: countOf(shown) > 0, children: empty }),
-            /* @__PURE__ */ jsx16("p", { className: "ui-sr", role: "status", "aria-live": "polite", children: countOf(shown) === 0 ? "No results" : `${countOf(shown)} result${countOf(shown) === 1 ? "" : "s"}` }),
-            hint && /* @__PURE__ */ jsxs12("div", { className: "ui-cmdk__foot", "aria-hidden": "true", children: [
-              /* @__PURE__ */ jsxs12("span", { children: [
-                /* @__PURE__ */ jsx16("kbd", { className: "ui-cmdk__key", children: "\u2191" }),
-                /* @__PURE__ */ jsx16("kbd", { className: "ui-cmdk__key", children: "\u2193" }),
+            /* @__PURE__ */ jsx17("p", { className: "ui-cmdk__empty", hidden: countOf(shown) > 0, children: empty }),
+            /* @__PURE__ */ jsx17("p", { className: "ui-sr", role: "status", "aria-live": "polite", children: countOf(shown) === 0 ? "No results" : `${countOf(shown)} result${countOf(shown) === 1 ? "" : "s"}` }),
+            hint && /* @__PURE__ */ jsxs13("div", { className: "ui-cmdk__foot", "aria-hidden": "true", children: [
+              /* @__PURE__ */ jsxs13("span", { children: [
+                /* @__PURE__ */ jsx17("kbd", { className: "ui-cmdk__key", children: "\u2191" }),
+                /* @__PURE__ */ jsx17("kbd", { className: "ui-cmdk__key", children: "\u2193" }),
                 " move"
               ] }),
-              /* @__PURE__ */ jsxs12("span", { children: [
-                /* @__PURE__ */ jsx16("kbd", { className: "ui-cmdk__key", children: "\u21B5" }),
+              /* @__PURE__ */ jsxs13("span", { children: [
+                /* @__PURE__ */ jsx17("kbd", { className: "ui-cmdk__key", children: "\u21B5" }),
                 " run"
               ] }),
-              /* @__PURE__ */ jsxs12("span", { children: [
-                /* @__PURE__ */ jsx16("kbd", { className: "ui-cmdk__key", children: "esc" }),
+              /* @__PURE__ */ jsxs13("span", { children: [
+                /* @__PURE__ */ jsx17("kbd", { className: "ui-cmdk__key", children: "esc" }),
                 " close"
               ] })
             ] })
@@ -1102,13 +1351,13 @@ function rowId(uid, groups, item) {
 }
 
 // src/DataTable.tsx
-import { useCallback as useCallback3, useEffect as useEffect5, useMemo as useMemo2, useRef as useRef9, useState as useState6 } from "react";
+import { Fragment as Fragment6, useCallback as useCallback3, useEffect as useEffect6, useMemo as useMemo2, useRef as useRef10, useState as useState7 } from "react";
 import { DEFAULT_PAGE_SIZE as DEFAULT_PAGE_SIZE2 } from "@apliteni/apliteni-ui";
 
 // src/Pagination.tsx
-import { useEffect as useEffect4, useId as useId7, useRef as useRef8, useState as useState5 } from "react";
+import { useEffect as useEffect5, useId as useId7, useRef as useRef9, useState as useState6 } from "react";
 import { DEFAULT_PAGE_SIZE } from "@apliteni/apliteni-ui";
-import { jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
+import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
 var GHOST_SM = "ui-btn ui-btn--ghost ui-btn--sm";
 var VARIANTS = ["steps", "numbered", "jump"];
 var cx3 = (...a) => a.filter(Boolean).join(" ");
@@ -1151,10 +1400,10 @@ function Pagination({
   onPageSizeChange
 }) {
   const auto = useId7();
-  const [draft, setDraft] = useState5("");
-  const [drafting, setDrafting] = useState5(false);
-  const nav = useRef8(null);
-  const pressed = useRef8(null);
+  const [draft, setDraft] = useState6("");
+  const [drafting, setDrafting] = useState6(false);
+  const nav = useRef9(null);
+  const pressed = useRef9(null);
   const uid = id ?? auto;
   const kind = VARIANTS.includes(variant) ? variant : "steps";
   const size = sizeOf(pageSize, DEFAULT_PAGE_SIZE);
@@ -1163,7 +1412,7 @@ function Pagination({
   const rows = counted ? Math.max(0, asRows) : null;
   const last = counted ? Math.max(1, Math.ceil(rows / size)) : null;
   const at = counted ? Math.min(Math.max(1, int(page, 1)), last) : Math.min(Math.max(1, int(page, 1)), CAP - 1);
-  const [draftFor, setDraftFor] = useState5(at);
+  const [draftFor, setDraftFor] = useState6(at);
   if (draftFor !== at) {
     setDraftFor(at);
     setDraft("");
@@ -1171,7 +1420,7 @@ function Pagination({
   }
   const offered = (Array.isArray(pageSizes) ? pageSizes : []).slice(0, 12).map((s) => int(s, 0)).filter((s) => s > 0);
   const sizes = offered.length ? [.../* @__PURE__ */ new Set([...offered, size])].sort((a, b) => a - b) : [];
-  useEffect4(() => {
+  useEffect5(() => {
     const was = pressed.current;
     if (!was || loading) return;
     pressed.current = null;
@@ -1200,7 +1449,7 @@ function Pagination({
   const step = (label_, target, disabled) => (
     // A control at an end is disabled and stays where it is: removing it slides
     // the next control under a pointer already travelling toward it.
-    /* @__PURE__ */ jsx17(
+    /* @__PURE__ */ jsx18(
       "button",
       {
         type: "button",
@@ -1239,14 +1488,14 @@ function Pagination({
   if (single) {
     steps = null;
   } else if (!counted) {
-    steps = /* @__PURE__ */ jsxs13("div", { className: "ui-pager__steps", children: [
+    steps = /* @__PURE__ */ jsxs14("div", { className: "ui-pager__steps", children: [
       step("Prev", Math.max(1, at - 1), atStart),
       step("Next", at + 1, !hasMore)
     ] });
   } else {
     let middle = null;
     if (kind === "numbered") {
-      middle = slotsFor(at, last).map((n, i) => n == null ? /* @__PURE__ */ jsx17("span", { className: "ui-pager__gap", "aria-hidden": "true", children: "\u2026" }, `gap${i}`) : /* @__PURE__ */ jsx17(
+      middle = slotsFor(at, last).map((n, i) => n == null ? /* @__PURE__ */ jsx18("span", { className: "ui-pager__gap", "aria-hidden": "true", children: "\u2026" }, `gap${i}`) : /* @__PURE__ */ jsx18(
         "button",
         {
           type: "button",
@@ -1261,9 +1510,9 @@ function Pagination({
         n
       ));
     } else if (kind === "jump") {
-      middle = /* @__PURE__ */ jsxs13("span", { className: "ui-pager__jump", children: [
-        /* @__PURE__ */ jsx17("label", { htmlFor: `${uid}-jump`, children: "Page" }),
-        /* @__PURE__ */ jsx17(
+      middle = /* @__PURE__ */ jsxs14("span", { className: "ui-pager__jump", children: [
+        /* @__PURE__ */ jsx18("label", { htmlFor: `${uid}-jump`, children: "Page" }),
+        /* @__PURE__ */ jsx18(
           "input",
           {
             className: "ui-input ui-pager__jump-input",
@@ -1286,13 +1535,13 @@ function Pagination({
             }
           }
         ),
-        /* @__PURE__ */ jsxs13("span", { className: "ui-pager__jump-of", children: [
+        /* @__PURE__ */ jsxs14("span", { className: "ui-pager__jump-of", children: [
           "of ",
           fmt(last)
         ] })
       ] });
     }
-    steps = /* @__PURE__ */ jsxs13("div", { className: "ui-pager__steps", children: [
+    steps = /* @__PURE__ */ jsxs14("div", { className: "ui-pager__steps", children: [
       ends ? step("First", 1, atStart) : null,
       step("Prev", Math.max(1, at - 1), atStart),
       middle,
@@ -1300,7 +1549,7 @@ function Pagination({
       ends ? step("Last", last, atEnd) : null
     ] });
   }
-  return /* @__PURE__ */ jsxs13(
+  return /* @__PURE__ */ jsxs14(
     "nav",
     {
       ref: nav,
@@ -1308,10 +1557,10 @@ function Pagination({
       "aria-label": label,
       "aria-busy": loading ? true : void 0,
       children: [
-        /* @__PURE__ */ jsx17("p", { className: "ui-pager__status", "aria-live": "polite", "aria-atomic": "true", children: status }),
-        sizes.length ? /* @__PURE__ */ jsxs13("div", { className: "ui-pager__size", children: [
-          /* @__PURE__ */ jsx17("label", { className: "ui-pager__size-label", htmlFor: `${uid}-size`, children: "Rows" }),
-          /* @__PURE__ */ jsx17(
+        /* @__PURE__ */ jsx18("p", { className: "ui-pager__status", "aria-live": "polite", "aria-atomic": "true", children: status }),
+        sizes.length ? /* @__PURE__ */ jsxs14("div", { className: "ui-pager__size", children: [
+          /* @__PURE__ */ jsx18("label", { className: "ui-pager__size-label", htmlFor: `${uid}-size`, children: "Rows" }),
+          /* @__PURE__ */ jsx18(
             "select",
             {
               className: "ui-select ui-pager__size-select",
@@ -1319,7 +1568,7 @@ function Pagination({
               disabled: loading,
               value: size,
               onChange: (e) => onPageSizeChange?.(Number(e.target.value)),
-              children: sizes.map((s) => /* @__PURE__ */ jsx17("option", { value: s, children: fmt(s) }, s))
+              children: sizes.map((s) => /* @__PURE__ */ jsx18("option", { value: s, children: fmt(s) }, s))
             }
           )
         ] }) : null,
@@ -1330,7 +1579,8 @@ function Pagination({
 }
 
 // src/DataTable.tsx
-import { Fragment as Fragment4, jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
+import { Fragment as Fragment7, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+var CELL_CLASS = { title: "ui-table__title", code: "ui-table__code", long: "ui-table__long", strong: "ui-table__num--strong", act: "ui-table__act" };
 var NO_SORT = { key: void 0, dir: -1 };
 function sortTableRows(rows, sort) {
   if (sort.key === void 0) return [...rows];
@@ -1340,6 +1590,12 @@ function sortTableRows(rows, sort) {
 function DataTable({
   columns,
   rows,
+  zebra = false,
+  hover = true,
+  stack: stack2 = false,
+  rowState,
+  footer,
+  caption,
   dense = false,
   density,
   stickyHeader = false,
@@ -1366,14 +1622,14 @@ function DataTable({
   hasMore = false
 }) {
   const scrollable = stickyHeader || pinnedIdentity;
-  const table = useRef9(null);
-  const [pagerHost, setPagerHost] = useState6(null);
+  const table = useRef10(null);
+  const [pagerHost, setPagerHost] = useState7(null);
   const holdPagerBox = useCallback3(
     (box) => setPagerHost(box?.parentElement ?? null),
     []
   );
-  const [strip2, setStrip] = useState6();
-  useEffect5(() => {
+  const [strip2, setStrip] = useState7();
+  useEffect6(() => {
     const el = table.current;
     const host = pagerHost;
     if (!el || !host || typeof ResizeObserver === "undefined") {
@@ -1393,16 +1649,16 @@ function DataTable({
     measure();
     return () => observer.disconnect();
   }, [pagerHost, columns, rows]);
-  const [localSort, setLocalSort] = useState6(
+  const [localSort, setLocalSort] = useState7(
     { key: columns.find((c) => c.sortable)?.key, dir: -1 }
   );
   const owned = controlledPage === void 0;
   const sort = controlledSort ?? (owned ? localSort : NO_SORT);
   const sortIsKnown = owned || controlledSort !== void 0;
-  const [localPage, setLocalPage] = useState6(1);
-  const [localSize, setLocalSize] = useState6(DEFAULT_PAGE_SIZE2);
+  const [localPage, setLocalPage] = useState7(1);
+  const [localSize, setLocalSize] = useState7(DEFAULT_PAGE_SIZE2);
   const size = sizeOf(pageSize, owned ? localSize : rows.length || DEFAULT_PAGE_SIZE2);
-  const [pagedSort, setPagedSort] = useState6(sort);
+  const [pagedSort, setPagedSort] = useState7(sort);
   if (pagedSort.key !== sort.key || pagedSort.dir !== sort.dir) {
     setPagedSort(sort);
     setLocalPage(1);
@@ -1425,7 +1681,7 @@ function DataTable({
     onSortChange?.(next);
     toFirstPage();
   };
-  const caret = (k) => /* @__PURE__ */ jsx18(
+  const caret = (k) => /* @__PURE__ */ jsx19(
     "svg",
     {
       className: "rx-caret",
@@ -1437,70 +1693,72 @@ function DataTable({
       strokeLinejoin: "round",
       "aria-hidden": "true",
       focusable: "false",
-      children: sort.key === k ? /* @__PURE__ */ jsx18("path", { d: "m8 10 4 4 4-4" }) : /* @__PURE__ */ jsxs14(Fragment4, { children: [
-        /* @__PURE__ */ jsx18("path", { d: "m8 9 4-4 4 4" }),
-        /* @__PURE__ */ jsx18("path", { d: "m8 15 4 4 4-4" })
+      children: sort.key === k ? /* @__PURE__ */ jsx19("path", { d: "m8 10 4 4 4-4" }) : /* @__PURE__ */ jsxs15(Fragment7, { children: [
+        /* @__PURE__ */ jsx19("path", { d: "m8 9 4-4 4 4" }),
+        /* @__PURE__ */ jsx19("path", { d: "m8 15 4 4 4-4" })
       ] })
     }
   );
+  const Wrap = scrollable ? "div" : Fragment6;
   const pageAllOn = selectable && slice.length > 0 && slice.every((r) => selected.has(r.name));
   const pageSomeOn = selectable && !pageAllOn && slice.some((r) => selected.has(r.name));
-  return /* @__PURE__ */ jsxs14(Fragment4, { children: [
-    /* @__PURE__ */ jsx18(
-      "div",
+  return /* @__PURE__ */ jsxs15(Fragment7, { children: [
+    /* @__PURE__ */ jsx19(Wrap, { ...scrollable ? { className: "ui-table-scroll", role: "region", "aria-label": scrollLabel, tabIndex: 0 } : {}, children: /* @__PURE__ */ jsxs15(
+      "table",
       {
-        className: scrollable ? "ui-table-scroll" : void 0,
-        role: scrollable ? "region" : void 0,
-        "aria-label": scrollable ? scrollLabel : void 0,
-        tabIndex: scrollable ? 0 : void 0,
-        children: /* @__PURE__ */ jsxs14(
-          "table",
-          {
-            ref: table,
-            className: ["ui-table ui-table--hover", (density === "dense" || !density && dense) && "ui-table--dense", density === "compact" && "ui-table--compact", stickyHeader && "ui-table--sticky", pinnedIdentity && "ui-table--pinned"].filter(Boolean).join(" "),
-            "aria-busy": loading || void 0,
-            children: [
-              /* @__PURE__ */ jsx18("thead", { children: /* @__PURE__ */ jsxs14("tr", { children: [
-                selectable ? /* @__PURE__ */ jsx18("th", { scope: "col", className: "ui-table__selection", children: /* @__PURE__ */ jsx18(
-                  "input",
-                  {
-                    type: "checkbox",
-                    checked: pageAllOn,
-                    "aria-label": "Select all rows on this page",
-                    ref: (input) => {
-                      if (input) input.indeterminate = pageSomeOn;
-                    },
-                    onChange: () => onTogglePage(slice.map((r) => r.name))
-                  }
-                ) }) : null,
-                columns.map((c, columnIndex) => (
-                  // The sort control is a real <button> inside the header cell. It used to be
-                  // role="button" ON the <th>, which threw away the columnheader role and put
-                  // aria-sort on a role that forbids it.
-                  /* @__PURE__ */ jsx18(
-                    "th",
-                    {
-                      scope: "col",
-                      className: [pinnedIdentity && columnIndex === 0 && "ui-table__identity", c.num && "ui-table__num", c.sortable && "rx-sortable"].filter(Boolean).join(" "),
-                      "aria-sort": sort.key === c.key ? sort.dir === 1 ? "ascending" : "descending" : c.sortable && sortIsKnown ? "none" : void 0,
-                      children: c.sortable ? (
-                        // The label is its own box so it can truncate: in a pinned
-                        // identity column on a phone the header is capped, and a bare
-                        // text node would push the caret out of the cell instead.
-                        /* @__PURE__ */ jsxs14("button", { type: "button", className: "rx-sort", onClick: () => onSort(c.key), children: [
-                          /* @__PURE__ */ jsx18("span", { className: "rx-sort__label", children: c.label }),
-                          caret(c.key)
-                        ] })
-                      ) : c.label
-                    },
-                    c.key
-                  )
-                ))
-              ] }) }),
-              /* @__PURE__ */ jsxs14("tbody", { children: [
-                !slice.length && /* @__PURE__ */ jsx18("tr", { children: /* @__PURE__ */ jsx18("td", { colSpan: columns.length + (selectable ? 1 : 0), children: loading ? "Loading rows\u2026" : empty }) }),
-                slice.map((r) => /* @__PURE__ */ jsxs14("tr", { children: [
-                  selectable ? /* @__PURE__ */ jsx18("td", { className: "ui-table__selection", children: /* @__PURE__ */ jsx18(
+        ref: table,
+        className: ["ui-table", hover && "ui-table--hover", zebra && "ui-table--zebra", stack2 && "ui-table--stack", (density === "dense" || !density && dense) && "ui-table--dense", density === "compact" && "ui-table--compact", stickyHeader && "ui-table--sticky", pinnedIdentity && "ui-table--pinned"].filter(Boolean).join(" "),
+        "aria-busy": loading || void 0,
+        role: stack2 ? "table" : void 0,
+        children: [
+          caption ? /* @__PURE__ */ jsx19("caption", { className: "ui-sr", children: caption }) : null,
+          /* @__PURE__ */ jsx19("thead", { role: stack2 ? "rowgroup" : void 0, children: /* @__PURE__ */ jsxs15("tr", { role: stack2 ? "row" : void 0, children: [
+            selectable ? /* @__PURE__ */ jsx19("th", { scope: "col", role: stack2 ? "columnheader" : void 0, className: "ui-table__selection", children: /* @__PURE__ */ jsx19(
+              "input",
+              {
+                type: "checkbox",
+                checked: pageAllOn,
+                "aria-label": "Select all rows on this page",
+                ref: (input) => {
+                  if (input) input.indeterminate = pageSomeOn;
+                },
+                onChange: () => onTogglePage(slice.map((r) => r.name))
+              }
+            ) }) : null,
+            columns.map((c, columnIndex) => (
+              // The sort control is a real <button> inside the header cell. It used to be
+              // role="button" ON the <th>, which threw away the columnheader role and put
+              // aria-sort on a role that forbids it.
+              /* @__PURE__ */ jsx19(
+                "th",
+                {
+                  scope: "col",
+                  role: stack2 ? "columnheader" : void 0,
+                  className: [pinnedIdentity && columnIndex === 0 && "ui-table__identity", c.num && "ui-table__num", c.sortable && "rx-sortable"].filter(Boolean).join(" "),
+                  "aria-sort": sort.key === c.key ? sort.dir === 1 ? "ascending" : "descending" : c.sortable && sortIsKnown ? "none" : void 0,
+                  children: c.sortable ? (
+                    // The label is its own box so it can truncate: in a pinned
+                    // identity column on a phone the header is capped, and a bare
+                    // text node would push the caret out of the cell instead.
+                    /* @__PURE__ */ jsxs15("button", { type: "button", className: "rx-sort", onClick: () => onSort(c.key), children: [
+                      /* @__PURE__ */ jsx19("span", { className: "rx-sort__label", children: c.label }),
+                      caret(c.key)
+                    ] })
+                  ) : c.label
+                },
+                c.key
+              )
+            ))
+          ] }) }),
+          /* @__PURE__ */ jsxs15("tbody", { role: stack2 ? "rowgroup" : void 0, children: [
+            !slice.length && /* @__PURE__ */ jsx19("tr", { role: stack2 ? "row" : void 0, children: /* @__PURE__ */ jsx19("td", { role: stack2 ? "cell" : void 0, colSpan: columns.length + (selectable ? 1 : 0), children: loading ? "Loading rows\u2026" : empty }) }),
+            slice.map((r) => /* @__PURE__ */ jsxs15(
+              "tr",
+              {
+                role: stack2 ? "row" : void 0,
+                className: rowState?.(r) ? `is-${rowState(r)}` : void 0,
+                children: [
+                  selectable ? /* @__PURE__ */ jsx19("td", { role: stack2 ? "cell" : void 0, className: "ui-table__selection", children: /* @__PURE__ */ jsx19(
                     "input",
                     {
                       type: "checkbox",
@@ -1509,26 +1767,41 @@ function DataTable({
                       onChange: () => onToggle(r.name)
                     }
                   ) }) : null,
-                  columns.map((c, columnIndex) => /* @__PURE__ */ jsx18("td", { className: [c.num && "ui-table__num", pinnedIdentity && columnIndex === 0 && "ui-table__identity", c.linked && "ui-table__linked"].filter(Boolean).join(" "), children: c.render ? c.render(r) : String(r[c.key]) }, c.key))
-                ] }, r.name))
-              ] })
-            ]
-          }
-        )
+                  columns.map((c, columnIndex) => {
+                    const Cell = c.rowHeader ? "th" : "td";
+                    return /* @__PURE__ */ jsx19(
+                      Cell,
+                      {
+                        scope: c.rowHeader ? "row" : void 0,
+                        role: stack2 ? c.rowHeader ? "rowheader" : "cell" : void 0,
+                        "data-label": stack2 && c.num && typeof c.label === "string" ? c.label : void 0,
+                        className: [c.num && "ui-table__num", c.cell && CELL_CLASS[c.cell], pinnedIdentity && columnIndex === 0 && "ui-table__identity", c.linked && "ui-table__linked"].filter(Boolean).join(" ") || void 0,
+                        children: c.render ? c.render(r) : String(r[c.key])
+                      },
+                      c.key
+                    );
+                  })
+                ]
+              },
+              r.name
+            ))
+          ] }),
+          footer ? /* @__PURE__ */ jsx19("tfoot", { role: stack2 ? "rowgroup" : void 0, children: footer }) : null
+        ]
       }
-    ),
+    ) }),
     pager ? (
       // The strip that pages a table may not be wider than the rows it pages (#504).
       // The two are siblings, and no selector sizes one to the other, so the width is
       // measured: a cap rather than a width, so a pager wider than the table wraps
       // inside it and a table wider than the room still leaves the strip in the room.
-      /* @__PURE__ */ jsx18(
+      /* @__PURE__ */ jsx19(
         "div",
         {
           className: "rx-table-pager",
           ref: holdPagerBox,
           style: strip2 ? { maxWidth: strip2.width, marginInlineStart: strip2.inset || void 0 } : void 0,
-          children: /* @__PURE__ */ jsx18(
+          children: /* @__PURE__ */ jsx19(
             Pagination,
             {
               page,
@@ -1556,7 +1829,7 @@ function DataTable({
 import { PAGE_SIZES as KIT_PAGE_SIZES, DEFAULT_PAGE_SIZE as KIT_DEFAULT_PAGE_SIZE } from "@apliteni/apliteni-ui";
 
 // src/Loading.tsx
-import { jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
+import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
 var cx4 = (...a) => a.filter(Boolean).join(" ");
 function Skeleton({ lines = 3, width, height, radius, className }) {
   const widths = Array.isArray(lines) ? lines : null;
@@ -1566,19 +1839,19 @@ function Skeleton({ lines = 3, width, height, radius, className }) {
     if (!w && !height && !radius) return void 0;
     return { ...w && { width: w }, ...height && { height }, ...radius && { borderRadius: radius } };
   };
-  return /* @__PURE__ */ jsx19("div", { className: cx4("ui-skel", className), "aria-hidden": "true", children: Array.from({ length: n }, (_, i) => /* @__PURE__ */ jsx19("span", { className: "ui-skel__bar m-skeleton", style: styleFor(i) }, i)) });
+  return /* @__PURE__ */ jsx20("div", { className: cx4("ui-skel", className), "aria-hidden": "true", children: Array.from({ length: n }, (_, i) => /* @__PURE__ */ jsx20("span", { className: "ui-skel__bar m-skeleton", style: styleFor(i) }, i)) });
 }
 function SkeletonTable({ rows = 5, cols = 4, head = true }) {
-  const cells = Array.from({ length: Math.max(1, cols) }, (_, i) => /* @__PURE__ */ jsx19("span", { className: "ui-skel__bar m-skeleton" }, i));
-  return /* @__PURE__ */ jsxs15(
+  const cells = Array.from({ length: Math.max(1, cols) }, (_, i) => /* @__PURE__ */ jsx20("span", { className: "ui-skel__bar m-skeleton" }, i));
+  return /* @__PURE__ */ jsxs16(
     "div",
     {
       className: "ui-skel ui-skel--table",
       style: { "--skel-cols": Math.max(1, cols) },
       "aria-hidden": "true",
       children: [
-        head && /* @__PURE__ */ jsx19("div", { className: "ui-skel__row ui-skel__row--head", children: cells }),
-        Array.from({ length: Math.max(1, rows) }, (_, i) => /* @__PURE__ */ jsx19("div", { className: "ui-skel__row", children: cells }, i))
+        head && /* @__PURE__ */ jsx20("div", { className: "ui-skel__row ui-skel__row--head", children: cells }),
+        Array.from({ length: Math.max(1, rows) }, (_, i) => /* @__PURE__ */ jsx20("div", { className: "ui-skel__row", children: cells }, i))
       ]
     }
   );
@@ -1591,7 +1864,7 @@ function BusyRegion({
   className,
   children
 }) {
-  return /* @__PURE__ */ jsxs15(
+  return /* @__PURE__ */ jsxs16(
     "div",
     {
       className: cx4("ui-busy", className),
@@ -1599,8 +1872,8 @@ function BusyRegion({
       "aria-live": "polite",
       "aria-busy": busy,
       children: [
-        /* @__PURE__ */ jsx19("span", { className: "ui-sr", children: busy ? label : message }),
-        /* @__PURE__ */ jsx19("div", { className: "ui-busy__body", children: busy ? placeholder ?? /* @__PURE__ */ jsx19(Skeleton, { lines: 3 }) : children })
+        /* @__PURE__ */ jsx20("span", { className: "ui-sr", children: busy ? label : message }),
+        /* @__PURE__ */ jsx20("div", { className: "ui-busy__body", children: busy ? placeholder ?? /* @__PURE__ */ jsx20(Skeleton, { lines: 3 }) : children })
       ]
     }
   );
@@ -1613,27 +1886,27 @@ function Denied({
   className,
   children
 }) {
-  return /* @__PURE__ */ jsxs15("div", { className: cx4("ui-denied", className), children: [
-    /* @__PURE__ */ jsx19("div", { className: "ui-denied__seal", children: /* @__PURE__ */ jsx19(Icon, { name: icon8 }) }),
-    /* @__PURE__ */ jsx19("div", { className: "ui-denied__title", children: title }),
-    sub && /* @__PURE__ */ jsx19("div", { className: "ui-denied__sub", children: sub }),
-    need && /* @__PURE__ */ jsxs15("div", { className: "ui-denied__need", children: [
+  return /* @__PURE__ */ jsxs16("div", { className: cx4("ui-denied", className), children: [
+    /* @__PURE__ */ jsx20("div", { className: "ui-denied__seal", children: /* @__PURE__ */ jsx20(Icon, { name: icon8 }) }),
+    /* @__PURE__ */ jsx20("div", { className: "ui-denied__title", children: title }),
+    sub && /* @__PURE__ */ jsx20("div", { className: "ui-denied__sub", children: sub }),
+    need && /* @__PURE__ */ jsxs16("div", { className: "ui-denied__need", children: [
       "Needs ",
-      /* @__PURE__ */ jsx19("code", { className: "ui-code", children: need })
+      /* @__PURE__ */ jsx20("code", { className: "ui-code", children: need })
     ] }),
-    children && /* @__PURE__ */ jsx19("div", { className: "ui-denied__actions", children })
+    children && /* @__PURE__ */ jsx20("div", { className: "ui-denied__actions", children })
   ] });
 }
 
 // src/DatePicker.tsx
 import {
   useCallback as useCallback4,
-  useEffect as useEffect6,
+  useEffect as useEffect7,
   useMemo as useMemo3,
-  useRef as useRef10,
-  useState as useState7
+  useRef as useRef11,
+  useState as useState8
 } from "react";
-import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
+import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
 var cx5 = (...a) => a.filter(Boolean).join(" ");
 var pad = (n) => String(n).padStart(2, "0");
 var DAY_MS = 864e5;
@@ -1642,8 +1915,8 @@ var MONTH_RE = /^(\d{4})-(\d{2})$/;
 var DAY_RE = /^(\d{4})-(\d{2})-(\d{2})$/;
 var PHONE_MAX = 560;
 function usePhone() {
-  const [phone, setPhone] = useState7(false);
-  useEffect6(() => {
+  const [phone, setPhone] = useState8(false);
+  useEffect7(() => {
     const query = typeof window === "undefined" ? null : window.matchMedia?.(`(max-width: ${PHONE_MAX}px)`);
     if (!query) return;
     const read = () => setPhone(query.matches);
@@ -1738,14 +2011,14 @@ function DatePicker({
   const picksRange = mode === "range" || mode === "day-range";
   const phone = usePhone();
   const asSheet = sheet ?? phone;
-  const root = useRef10(null);
-  const trigger = useRef10(null);
-  const grid = useRef10(null);
-  const [selfOpen, setSelfOpen] = useState7(defaultOpen);
+  const root = useRef11(null);
+  const trigger = useRef11(null);
+  const grid = useRef11(null);
+  const [selfOpen, setSelfOpen] = useState8(defaultOpen);
   const open = openProp ?? selfOpen;
-  const [selfValue, setSelfValue] = useState7(defaultValue);
+  const [selfValue, setSelfValue] = useState8(defaultValue);
   const picked = value !== void 0 ? value : selfValue;
-  const [selfRange, setSelfRange] = useState7(defaultRange ?? { start: null, end: null });
+  const [selfRange, setSelfRange] = useState8(defaultRange ?? { start: null, end: null });
   const span = range !== void 0 ? range : selfRange;
   const names = useMemo3(() => ({
     month: new Intl.DateTimeFormat(locale, { month: "long", timeZone: "UTC" }),
@@ -1776,20 +2049,20 @@ function DatePicker({
     return grain === "month" ? monthOf(now) : now;
   }, [today, grain]);
   const anchor = toIndex(picked, grain) ?? toIndex(picksRange ? span.start ?? span.end : null, grain) ?? todayIndex;
-  const [cursor, setCursor] = useState7(() => clamp(anchor, lo, hi));
-  const land = useRef10(false);
+  const [cursor, setCursor] = useState8(() => clamp(anchor, lo, hi));
+  const land = useRef11(false);
   const setOpen = useCallback4((next) => {
     if (openProp === void 0) setSelfOpen(next);
     onOpenChange?.(next);
   }, [openProp, onOpenChange]);
-  const close = useRef10(setOpen);
+  const close = useRef11(setOpen);
   useIsoLayoutEffect(() => {
     close.current = setOpen;
   });
-  useEffect6(() => {
+  useEffect7(() => {
     if (open) setCursor(clamp(anchor, lo, hi));
   }, [open]);
-  useEffect6(() => {
+  useEffect7(() => {
     if (!open || asSheet) return;
     const doc = root.current?.ownerDocument ?? document;
     const onClick = (e) => {
@@ -1951,10 +2224,10 @@ function DatePicker({
   }
   const noneBefore = lo != null && first <= lo;
   const noneAfter = hi != null && last >= hi;
-  const calendar = /* @__PURE__ */ jsxs16("div", { className: cx5("ui-datepicker__body", asSheet && "is-sheet"), children: [
-    picksRange && presets?.length ? /* @__PURE__ */ jsx20("div", { className: "ui-datepicker__presets", role: "group", "aria-label": "Period shortcuts", children: presets.map((preset) => {
+  const calendar = /* @__PURE__ */ jsxs17("div", { className: cx5("ui-datepicker__body", asSheet && "is-sheet"), children: [
+    picksRange && presets?.length ? /* @__PURE__ */ jsx21("div", { className: "ui-datepicker__presets", role: "group", "aria-label": "Period shortcuts", children: presets.map((preset) => {
       const within = allowed(preset);
-      return /* @__PURE__ */ jsx20(
+      return /* @__PURE__ */ jsx21(
         "button",
         {
           type: "button",
@@ -1966,9 +2239,9 @@ function DatePicker({
         preset.label
       );
     }) }) : null,
-    /* @__PURE__ */ jsxs16("div", { className: "ui-datepicker__calendar", children: [
-      /* @__PURE__ */ jsxs16("div", { className: "ui-datepicker__head", children: [
-        /* @__PURE__ */ jsx20(
+    /* @__PURE__ */ jsxs17("div", { className: "ui-datepicker__calendar", children: [
+      /* @__PURE__ */ jsxs17("div", { className: "ui-datepicker__head", children: [
+        /* @__PURE__ */ jsx21(
           "button",
           {
             type: "button",
@@ -1976,11 +2249,11 @@ function DatePicker({
             "aria-label": stepBack,
             disabled: noneBefore,
             onClick: () => stepPage(-1),
-            children: /* @__PURE__ */ jsx20(Icon, { name: "chevronLeft" })
+            children: /* @__PURE__ */ jsx21(Icon, { name: "chevronLeft" })
           }
         ),
-        /* @__PURE__ */ jsx20("span", { className: "ui-datepicker__caption", "aria-live": "polite", children: caption }),
-        /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx21("span", { className: "ui-datepicker__caption", "aria-live": "polite", children: caption }),
+        /* @__PURE__ */ jsx21(
           "button",
           {
             type: "button",
@@ -1988,11 +2261,11 @@ function DatePicker({
             "aria-label": stepOn,
             disabled: noneAfter,
             onClick: () => stepPage(1),
-            children: /* @__PURE__ */ jsx20(Icon, { name: "chevronRight" })
+            children: /* @__PURE__ */ jsx21(Icon, { name: "chevronRight" })
           }
         )
       ] }),
-      /* @__PURE__ */ jsxs16(
+      /* @__PURE__ */ jsxs17(
         "div",
         {
           className: cx5("ui-datepicker__grid", grain === "day" && "is-days"),
@@ -2001,7 +2274,7 @@ function DatePicker({
           ref: grid,
           onKeyDown: onGridKeyDown,
           children: [
-            weekdays.length > 0 && /* @__PURE__ */ jsx20("div", { className: "ui-datepicker__row", role: "row", children: weekdays.map((weekday) => /* @__PURE__ */ jsx20(
+            weekdays.length > 0 && /* @__PURE__ */ jsx21("div", { className: "ui-datepicker__row", role: "row", children: weekdays.map((weekday) => /* @__PURE__ */ jsx21(
               "span",
               {
                 className: "ui-datepicker__weekday",
@@ -2011,13 +2284,13 @@ function DatePicker({
               },
               weekday.long
             )) }),
-            rows.map((cellsInRow, r) => /* @__PURE__ */ jsx20("div", { className: "ui-datepicker__row", role: "row", children: cellsInRow.map((cell, c) => cell ? /* @__PURE__ */ jsx20(
+            rows.map((cellsInRow, r) => /* @__PURE__ */ jsx21("div", { className: "ui-datepicker__row", role: "row", children: cellsInRow.map((cell, c) => cell ? /* @__PURE__ */ jsx21(
               "span",
               {
                 className: "ui-datepicker__cell",
                 role: "gridcell",
                 "aria-selected": isPicked(cell.index),
-                children: /* @__PURE__ */ jsx20(
+                children: /* @__PURE__ */ jsx21(
                   "button",
                   {
                     type: "button",
@@ -2036,12 +2309,12 @@ function DatePicker({
                     "aria-label": state(cell),
                     onClick: () => pick(cell),
                     onFocus: () => setCursor(cell.index),
-                    children: /* @__PURE__ */ jsx20("span", { className: "ui-datepicker__num", children: cell.label })
+                    children: /* @__PURE__ */ jsx21("span", { className: "ui-datepicker__num", children: cell.label })
                   }
                 )
               },
               cell.period
-            ) : /* @__PURE__ */ jsx20("span", { className: "ui-datepicker__cell is-empty", role: "gridcell" }, `e${r}-${c}`)) }, `r${r}`))
+            ) : /* @__PURE__ */ jsx21("span", { className: "ui-datepicker__cell is-empty", role: "gridcell" }, `e${r}-${c}`)) }, `r${r}`))
           ]
         }
       )
@@ -2051,8 +2324,8 @@ function DatePicker({
     // `open` on the root whichever form the panel takes, so the trigger's
     // chevron flips for the sheet as it does for the popover. The panel rules
     // it also switches on have no panel to find while the sheet is up.
-    /* @__PURE__ */ jsxs16("div", { className: cx5("ui-dropdown", "ui-datepicker", open && "open"), ref: root, children: [
-      /* @__PURE__ */ jsxs16(
+    /* @__PURE__ */ jsxs17("div", { className: cx5("ui-dropdown", "ui-datepicker", open && "open"), ref: root, children: [
+      /* @__PURE__ */ jsxs17(
         "button",
         {
           type: "button",
@@ -2068,8 +2341,8 @@ function DatePicker({
             setOpen(!open);
           },
           children: [
-            /* @__PURE__ */ jsx20("span", { className: "ui-dropdown__value", children: shown ?? empty }),
-            /* @__PURE__ */ jsx20("span", { className: "ui-dropdown__chevron", "aria-hidden": "true" })
+            /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__value", children: shown ?? empty }),
+            /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__chevron", "aria-hidden": "true" })
           ]
         }
       ),
@@ -2080,8 +2353,8 @@ function DatePicker({
         // without taking the sheet's affordances left a phone reader with no
         // visible way out and a Tab that walked into the live page behind it.
         // why: guidelines/drawer.md
-        /* @__PURE__ */ jsx20(Drawer, { open, side: "bottom", size: "md", title: name, onClose: () => setOpen(false), children: calendar })
-      ) : /* @__PURE__ */ jsx20(
+        /* @__PURE__ */ jsx21(Drawer, { open, side: "bottom", size: "md", title: name, onClose: () => setOpen(false), children: calendar })
+      ) : /* @__PURE__ */ jsx21(
         "div",
         {
           className: cx5("ui-dropdown__panel", "ui-datepicker__panel", align === "end" && "is-end"),
@@ -2098,13 +2371,13 @@ function DatePicker({
 
 // src/Dropdown.tsx
 import {
-  Fragment as Fragment5,
+  Fragment as Fragment8,
   useCallback as useCallback5,
   useContext as useContext2,
-  useEffect as useEffect7,
+  useEffect as useEffect8,
   useId as useId8,
-  useRef as useRef11,
-  useState as useState8
+  useRef as useRef12,
+  useState as useState9
 } from "react";
 import {
   icon as icon4,
@@ -2126,7 +2399,7 @@ import { createContext as createContext2 } from "react";
 var FieldContext = createContext2(null);
 
 // src/Dropdown.tsx
-import { Fragment as Fragment6, jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
+import { Fragment as Fragment9, jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
 var EXIT_SLACK_MS2 = 50;
 var SETTLE_MS = 450;
 var inPanel = (node) => {
@@ -2135,7 +2408,7 @@ var inPanel = (node) => {
 };
 var cx6 = (...a) => a.filter(Boolean).join(" ");
 var isRow = (it) => Boolean(it) && it !== "---" && !it.separator;
-var Glyph2 = ({ name, className, hidden }) => /* @__PURE__ */ jsx21(
+var Glyph2 = ({ name, className, hidden }) => /* @__PURE__ */ jsx22(
   "span",
   {
     className,
@@ -2148,7 +2421,7 @@ function RowBadge({ badge }) {
   const given = typeof badge === "string" ? "" : badge.tone || "";
   let tone = given || (/^live$/i.test(String(text2)) ? "live" : "neutral");
   if (!given && tone === "neutral" && /^(?:off|unset|disabled|archive|archived)$/i.test(text2)) tone = "state";
-  return /* @__PURE__ */ jsx21("span", { className: `ui-dropdown__badge is-${tone}`, children: text2 });
+  return /* @__PURE__ */ jsx22("span", { className: `ui-dropdown__badge is-${tone}`, children: text2 });
 }
 var keyOf = (it) => it.value != null ? `v:${it.value}` : `l:${it.label}`;
 var itemsIn = (panel) => Array.from(panel?.querySelectorAll("[data-dd-item]") ?? []).filter((el) => el.getAttribute("aria-disabled") !== "true" && !el.hidden);
@@ -2192,18 +2465,18 @@ function Dropdown({
   onSelect,
   row
 }) {
-  const [selfOpen, setSelfOpen] = useState8(defaultOpen);
+  const [selfOpen, setSelfOpen] = useState9(defaultOpen);
   const open = openProp ?? selfOpen;
-  const [pick, setPick] = useState8(null);
-  const [query, setQuery] = useState8(() => search && search !== true ? search.query || "" : "");
-  const [activeKey, setActiveKey] = useState8(null);
-  const root = useRef11(null);
-  const panel = useRef11(null);
-  const trigger = useRef11(null);
-  const field = useRef11(null);
-  const landOn = useRef11(null);
-  const revealed = useRef11(false);
-  const at = useRef11("");
+  const [pick, setPick] = useState9(null);
+  const [query, setQuery] = useState9(() => search && search !== true ? search.query || "" : "");
+  const [activeKey, setActiveKey] = useState9(null);
+  const root = useRef12(null);
+  const panel = useRef12(null);
+  const trigger = useRef12(null);
+  const field = useRef12(null);
+  const landOn = useRef12(null);
+  const revealed = useRef12(false);
+  const at = useRef12("");
   const auto = useId8().replace(/:/g, "");
   const uid = id ?? auto;
   const inField = useContext2(FieldContext);
@@ -2212,7 +2485,7 @@ function Dropdown({
     if (openProp === void 0) setSelfOpen(next);
     onOpenChange?.(next);
   }, [openProp, onOpenChange]);
-  const close = useRef11(setOpen);
+  const close = useRef12(setOpen);
   useIsoLayoutEffect(() => {
     close.current = setOpen;
   });
@@ -2265,7 +2538,7 @@ function Dropdown({
       stop.forEach((off) => off());
     };
   }, [open]);
-  const opened = useRef11(false);
+  const opened = useRef12(false);
   useIsoLayoutEffect(() => {
     const el = panel.current;
     if (open) {
@@ -2312,7 +2585,7 @@ function Dropdown({
   const given = rows.find((it) => it.selected);
   const givenKey = given ? keyOf(given) : null;
   const pickedKey = pick && pick.against === givenKey ? pick.key : null;
-  useEffect7(() => {
+  useEffect8(() => {
     if (pick && pick.against !== givenKey) setPick(null);
   }, [givenKey, pick]);
   const picked = pickedKey != null ? rows.find((it) => keyOf(it) === pickedKey) : void 0;
@@ -2328,7 +2601,7 @@ function Dropdown({
   const rowIds = /* @__PURE__ */ new Map();
   rows.forEach((it, i) => rowIds.set(it, `${uid}-opt-${i}`));
   const listId = `${uid}-list`;
-  useEffect7(() => {
+  useEffect8(() => {
     if (!open) return;
     const mine = () => close.current(false);
     for (const other of [...openNow]) other();
@@ -2337,7 +2610,7 @@ function Dropdown({
       openNow.delete(mine);
     };
   }, [open]);
-  useEffect7(() => {
+  useEffect8(() => {
     if (!open) return;
     const doc = root.current?.ownerDocument ?? document;
     const onClick = (e) => {
@@ -2567,7 +2840,7 @@ function Dropdown({
   };
   function renderRow(entry, key) {
     if (!isRow(entry)) {
-      return /* @__PURE__ */ jsx21("div", { className: "ui-dropdown__sep", role: "separator", hidden: filtering || void 0 }, key);
+      return /* @__PURE__ */ jsx22("div", { className: "ui-dropdown__sep", role: "separator", hidden: filtering || void 0 }, key);
     }
     const disabled2 = !!entry.disabled;
     const selected = selectedOf(entry);
@@ -2589,23 +2862,23 @@ function Dropdown({
       ...asLink ? { href: entry.href, ...entry.target ? { target: entry.target } : null } : null,
       ...sx ? { id: rowIds.get(entry), hidden: hiddenBy(entry) || void 0 } : null,
       onClick: (e) => choose(entry, e),
-      children: /* @__PURE__ */ jsxs17(Fragment6, { children: [
-        entry.avatar ? /* @__PURE__ */ jsx21(Avatar, { personKey: entry.avatar.key, name: entry.avatar.name, src: entry.avatar.src, empty: entry.avatar.empty }) : entry.icon && /* @__PURE__ */ jsx21(Glyph2, { name: entry.icon, className: "ui-dropdown__ic" }),
-        /* @__PURE__ */ jsxs17("span", { className: "ui-dropdown__main", children: [
-          /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__label", children: entry.label }),
-          entry.description && /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__desc", children: entry.description })
+      children: /* @__PURE__ */ jsxs18(Fragment9, { children: [
+        entry.avatar ? /* @__PURE__ */ jsx22(Avatar, { personKey: entry.avatar.key, name: entry.avatar.name, src: entry.avatar.src, empty: entry.avatar.empty }) : entry.icon && /* @__PURE__ */ jsx22(Glyph2, { name: entry.icon, className: "ui-dropdown__ic" }),
+        /* @__PURE__ */ jsxs18("span", { className: "ui-dropdown__main", children: [
+          /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__label", children: entry.label }),
+          entry.description && /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__desc", children: entry.description })
         ] }),
-        entry.badge ? /* @__PURE__ */ jsx21(RowBadge, { badge: entry.badge }) : null,
-        asOption && /* @__PURE__ */ jsx21(Glyph2, { name: "check", className: "ui-dropdown__tick", hidden: true })
+        entry.badge ? /* @__PURE__ */ jsx22(RowBadge, { badge: entry.badge }) : null,
+        asOption && /* @__PURE__ */ jsx22(Glyph2, { name: "check", className: "ui-dropdown__tick", hidden: true })
       ] })
     };
-    if (row) return /* @__PURE__ */ jsx21(Fragment5, { children: row(entry, props) }, key);
+    if (row) return /* @__PURE__ */ jsx22(Fragment8, { children: row(entry, props) }, key);
     const Tag = asLink ? "a" : "div";
-    return /* @__PURE__ */ jsx21(Tag, { ...props }, key);
+    return /* @__PURE__ */ jsx22(Tag, { ...props }, key);
   }
   const body = sections?.length ? sections.map((section, si) => {
     const gone = filtering && !(section.items || []).some((it) => isRow(it) && !hiddenBy(it));
-    return /* @__PURE__ */ jsxs17(
+    return /* @__PURE__ */ jsxs18(
       "div",
       {
         className: "ui-dropdown__section",
@@ -2613,7 +2886,7 @@ function Dropdown({
         "aria-label": section.label || void 0,
         hidden: gone || void 0,
         children: [
-          section.label && /* @__PURE__ */ jsx21("div", { className: "ui-dropdown__group", role: "presentation", children: section.label }),
+          section.label && /* @__PURE__ */ jsx22("div", { className: "ui-dropdown__group", role: "presentation", children: section.label }),
           (section.items || []).map((entry, i) => renderRow(entry, `s${si}-${i}`))
         ]
       },
@@ -2621,12 +2894,12 @@ function Dropdown({
     );
   }) : (items || []).map((entry, i) => renderRow(entry, `i${i}`));
   const cap = scroll && scroll !== true ? { "--ui-dropdown-cap": typeof scroll === "number" ? `${scroll}px` : scroll } : void 0;
-  const none = sx && filtering && !visible.length ? /* @__PURE__ */ jsxs17(Fragment6, { children: [
-    /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__none-title", children: sx.empty.replace("{q}", () => query.trim()) }),
-    /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__none-hint", children: sx.hint })
+  const none = sx && filtering && !visible.length ? /* @__PURE__ */ jsxs18(Fragment9, { children: [
+    /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__none-title", children: sx.empty.replace("{q}", () => query.trim()) }),
+    /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__none-hint", children: sx.hint })
   ] }) : null;
-  return /* @__PURE__ */ jsxs17("div", { className: cx6("ui-dropdown", open && "open"), id, ref: root, onKeyDown, children: [
-    /* @__PURE__ */ jsxs17(
+  return /* @__PURE__ */ jsxs18("div", { className: cx6("ui-dropdown", open && "open"), id, ref: root, onKeyDown, children: [
+    /* @__PURE__ */ jsxs18(
       "button",
       {
         type: "button",
@@ -2646,16 +2919,16 @@ function Dropdown({
           setOpen(!open);
         },
         children: [
-          triggerContent != null ? triggerContent : /* @__PURE__ */ jsxs17(Fragment6, { children: [
-            marked2 && (chosen?.avatar ? /* @__PURE__ */ jsx21(Avatar, { personKey: chosen.avatar.key, name: chosen.avatar.name, src: chosen.avatar.src, empty: chosen.avatar.empty }) : /* @__PURE__ */ jsx21(Avatar, { empty: true })),
-            label && /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__pre", children: label }),
-            /* @__PURE__ */ jsx21("span", { className: cx6("ui-dropdown__value", marked2 && !chosen && "is-placeholder"), children: shown != null ? shown : placeholder })
+          triggerContent != null ? triggerContent : /* @__PURE__ */ jsxs18(Fragment9, { children: [
+            marked2 && (chosen?.avatar ? /* @__PURE__ */ jsx22(Avatar, { personKey: chosen.avatar.key, name: chosen.avatar.name, src: chosen.avatar.src, empty: chosen.avatar.empty }) : /* @__PURE__ */ jsx22(Avatar, { empty: true })),
+            label && /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__pre", children: label }),
+            /* @__PURE__ */ jsx22("span", { className: cx6("ui-dropdown__value", marked2 && !chosen && "is-placeholder"), children: shown != null ? shown : placeholder })
           ] }),
-          chevron && /* @__PURE__ */ jsx21("span", { className: "ui-dropdown__chevron", "aria-hidden": "true" })
+          chevron && /* @__PURE__ */ jsx22("span", { className: "ui-dropdown__chevron", "aria-hidden": "true" })
         ]
       }
     ),
-    /* @__PURE__ */ jsxs17(
+    /* @__PURE__ */ jsxs18(
       "div",
       {
         className: cx6(
@@ -2676,10 +2949,10 @@ function Dropdown({
         onMouseMove,
         children: [
           header,
-          sx ? /* @__PURE__ */ jsxs17(Fragment6, { children: [
-            /* @__PURE__ */ jsxs17("div", { className: "ui-dropdown__search", children: [
-              /* @__PURE__ */ jsx21(Glyph2, { name: "search", className: "ui-dropdown__search-ic", hidden: true }),
-              /* @__PURE__ */ jsx21(
+          sx ? /* @__PURE__ */ jsxs18(Fragment9, { children: [
+            /* @__PURE__ */ jsxs18("div", { className: "ui-dropdown__search", children: [
+              /* @__PURE__ */ jsx22(Glyph2, { name: "search", className: "ui-dropdown__search-ic", hidden: true }),
+              /* @__PURE__ */ jsx22(
                 "input",
                 {
                   className: "ui-dropdown__search-input",
@@ -2703,8 +2976,8 @@ function Dropdown({
                 }
               )
             ] }),
-            /* @__PURE__ */ jsx21("div", { className: "ui-dropdown__list", role: "listbox", id: listId, "aria-label": name, style: cap, children: body }),
-            /* @__PURE__ */ jsx21(
+            /* @__PURE__ */ jsx22("div", { className: "ui-dropdown__list", role: "listbox", id: listId, "aria-label": name, style: cap, children: body }),
+            /* @__PURE__ */ jsx22(
               "div",
               {
                 className: "ui-dropdown__none",
@@ -2729,7 +3002,7 @@ function strip(o) {
 }
 
 // src/BackLink.tsx
-import { jsx as jsx22, jsxs as jsxs18 } from "react/jsx-runtime";
+import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
 var BARE = "Back";
 var SCRIPTED = /^javascript:/i;
 var LEADING = /^[\u0000-\u0020]+/;
@@ -2748,7 +3021,7 @@ function BackLink({
   const name = text(label).replace(SAID, "");
   const bare = !name || name.toLowerCase() === BARE.toLowerCase();
   const Tag = as ?? "a";
-  return /* @__PURE__ */ jsxs18(
+  return /* @__PURE__ */ jsxs19(
     Tag,
     {
       className: ["ui-back", className].filter(Boolean).join(" "),
@@ -2756,8 +3029,8 @@ function BackLink({
       "aria-label": bare ? void 0 : `${BARE} to ${name}`,
       ...rest,
       children: [
-        /* @__PURE__ */ jsx22(Icon, { name: "chevronLeft" }),
-        /* @__PURE__ */ jsx22("span", { className: "ui-back__label", children: bare ? BARE : name })
+        /* @__PURE__ */ jsx23(Icon, { name: "chevronLeft" }),
+        /* @__PURE__ */ jsx23("span", { className: "ui-back__label", children: bare ? BARE : name })
       ]
     }
   );
@@ -2765,41 +3038,41 @@ function BackLink({
 
 // src/TableValues.tsx
 import { formatNumericValue, formatDeltaValue } from "@apliteni/apliteni-ui";
-import { jsx as jsx23, jsxs as jsxs19 } from "react/jsx-runtime";
+import { jsx as jsx24, jsxs as jsxs20 } from "react/jsx-runtime";
 function NumericValue(props) {
   const value = formatNumericValue(props);
-  return /* @__PURE__ */ jsx23("span", { children: /* @__PURE__ */ jsxs19("span", { className: "ui-value", "aria-label": value.missing, children: [
+  return /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsxs20("span", { className: "ui-value", "aria-label": value.missing, children: [
     value.text,
-    value.unit && /* @__PURE__ */ jsx23("span", { className: "ui-value__unit", children: value.unit })
+    value.unit && /* @__PURE__ */ jsx24("span", { className: "ui-value__unit", children: value.unit })
   ] }) });
 }
 function DeltaValue(props) {
   const value = formatDeltaValue(props);
-  return /* @__PURE__ */ jsx23("span", { children: /* @__PURE__ */ jsx23("span", { className: value.className, "aria-describedby": value.basisId || void 0, children: value.text }) });
+  return /* @__PURE__ */ jsx24("span", { children: /* @__PURE__ */ jsx24("span", { className: value.className, "aria-describedby": value.basisId || void 0, children: value.text }) });
 }
 function RowIdentity({ symbol, name, logo, href }) {
   const Tag = href ? "a" : "span";
-  return /* @__PURE__ */ jsxs19(Tag, { className: "ui-identity", href, children: [
-    /* @__PURE__ */ jsxs19("span", { className: "ui-identity__logo", "aria-hidden": "true", children: [
-      /* @__PURE__ */ jsx23("span", { children: symbol.slice(0, 1) }),
-      logo && /* @__PURE__ */ jsx23("img", { src: logo, alt: "", onLoad: (e) => {
+  return /* @__PURE__ */ jsxs20(Tag, { className: "ui-identity", href, children: [
+    /* @__PURE__ */ jsxs20("span", { className: "ui-identity__logo", "aria-hidden": "true", children: [
+      /* @__PURE__ */ jsx24("span", { children: symbol.slice(0, 1) }),
+      logo && /* @__PURE__ */ jsx24("img", { src: logo, alt: "", onLoad: (e) => {
         e.currentTarget.hidden = false;
       }, onError: (e) => {
         e.currentTarget.hidden = true;
       } })
     ] }),
-    /* @__PURE__ */ jsx23("span", { className: "ui-identity__symbol", children: symbol }),
-    /* @__PURE__ */ jsx23("span", { className: "ui-identity__name", children: name })
+    /* @__PURE__ */ jsx24("span", { className: "ui-identity__symbol", children: symbol }),
+    /* @__PURE__ */ jsx24("span", { className: "ui-identity__name", children: name })
   ] });
 }
 
 // src/Segmented.tsx
 import { segmentedNextIndex } from "@apliteni/apliteni-ui";
-import { jsx as jsx24 } from "react/jsx-runtime";
+import { jsx as jsx25 } from "react/jsx-runtime";
 function Segmented({ options, value, onChange, label, appearance = "pill", size, block = false, disabled = false }) {
   const enabled = options.filter((o) => !o.disabled);
   const tabValue = enabled.some((o) => o.value === value) ? value : enabled[0]?.value;
-  return /* @__PURE__ */ jsx24("div", { className: `ui-seg${size === "sm" ? " ui-seg--sm" : ""}${block ? " ui-seg--block" : ""}${appearance === "underline" ? " ui-seg--underline" : ""}`, role: "toolbar", "aria-label": label, children: options.map((option) => /* @__PURE__ */ jsx24(
+  return /* @__PURE__ */ jsx25("div", { className: `ui-seg${size === "sm" ? " ui-seg--sm" : ""}${block ? " ui-seg--block" : ""}${appearance === "underline" ? " ui-seg--underline" : ""}`, role: "toolbar", "aria-label": label, children: options.map((option) => /* @__PURE__ */ jsx25(
     "button",
     {
       type: "button",
@@ -2825,17 +3098,17 @@ function Segmented({ options, value, onChange, label, appearance = "pill", size,
 }
 
 // src/FilterBar.tsx
-import { useRef as useRef12, useState as useState9 } from "react";
+import { useRef as useRef13, useState as useState10 } from "react";
 import { filterChipText, filterChipName, filterChipUnset, filterChipItems, focusNextStop } from "@apliteni/apliteni-ui";
-import { Fragment as Fragment7, jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
+import { Fragment as Fragment10, jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
 var SEARCH_AT = 10;
 var isRow2 = (entry) => entry !== "---" && !entry.separator;
 function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clearVariant = "ghost", add, addLabel = "Filter", disabled = false, busy = false, onRemove, onClear, onChange, onAdd }) {
-  const bar = useRef12(null);
-  const focused = useRef12(null);
-  const landing = useRef12(null);
-  const [opened, setOpened] = useState9({});
-  const [adding, setAdding] = useState9(false);
+  const bar = useRef13(null);
+  const focused = useRef13(null);
+  const landing = useRef13(null);
+  const [opened, setOpened] = useState10({});
+  const [adding, setAdding] = useState10(false);
   const blocked = disabled || busy;
   const offer = (add || []).filter((entry) => !filters.some((filter) => filter.id === entry.id));
   const source = /* @__PURE__ */ new Map();
@@ -2870,7 +3143,7 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
     if (target) target.focus();
     else focusNextStop(bar.current);
   });
-  return /* @__PURE__ */ jsx25("div", { children: /* @__PURE__ */ jsxs20(
+  return /* @__PURE__ */ jsx26("div", { children: /* @__PURE__ */ jsxs21(
     "fieldset",
     {
       ref: bar,
@@ -2883,8 +3156,8 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
         if (event.relatedTarget && !event.currentTarget.contains(event.relatedTarget)) focused.current = null;
       },
       children: [
-        /* @__PURE__ */ jsx25("legend", { className: "ui-filter-bar__legend", children: label }),
-        filters.map((filter, index) => /* @__PURE__ */ jsxs20(
+        /* @__PURE__ */ jsx26("legend", { className: "ui-filter-bar__legend", children: label }),
+        filters.map((filter, index) => /* @__PURE__ */ jsxs21(
           "fieldset",
           {
             className: "ui-filter-bar__chip",
@@ -2894,14 +3167,14 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
               focused.current = { id: filter.id, index };
             },
             children: [
-              /* @__PURE__ */ jsx25("legend", { className: "ui-filter-bar__legend", children: filter.label }),
-              /* @__PURE__ */ jsx25(
+              /* @__PURE__ */ jsx26("legend", { className: "ui-filter-bar__legend", children: filter.label }),
+              /* @__PURE__ */ jsx26(
                 Dropdown,
                 {
                   items: filterChipItems(filter),
                   variant: "select",
                   ariaLabel: filterChipName(filter),
-                  triggerContent: /* @__PURE__ */ jsx25("span", { className: filterChipUnset(filter) ? "ui-dropdown__value is-placeholder" : "ui-dropdown__value", children: filterChipText(filter) }),
+                  triggerContent: /* @__PURE__ */ jsx26("span", { className: filterChipUnset(filter) ? "ui-dropdown__value is-placeholder" : "ui-dropdown__value", children: filterChipText(filter) }),
                   open: !blocked && !filter.disabled && (opened[filter.id] && opened[filter.id].against === filter.open ? opened[filter.id].open : !!filter.open),
                   onOpenChange: (open) => setOpened((previous) => ({ ...previous, [filter.id]: { open, against: filter.open } })),
                   onSelect: (value) => {
@@ -2909,7 +3182,7 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
                   }
                 }
               ),
-              /* @__PURE__ */ jsx25(
+              /* @__PURE__ */ jsx26(
                 "button",
                 {
                   type: "button",
@@ -2926,16 +3199,16 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
           },
           filter.id
         )),
-        offering && /* @__PURE__ */ jsx25("div", { "data-filter-add": "", onFocus: () => {
+        offering && /* @__PURE__ */ jsx26("div", { "data-filter-add": "", onFocus: () => {
           focused.current = null;
-        }, children: /* @__PURE__ */ jsx25(
+        }, children: /* @__PURE__ */ jsx26(
           Dropdown,
           {
             variant: "menu",
             sections,
             ariaLabel: addLabel,
-            triggerContent: /* @__PURE__ */ jsxs20(Fragment7, { children: [
-              /* @__PURE__ */ jsx25(Icon, { name: "plus" }),
+            triggerContent: /* @__PURE__ */ jsxs21(Fragment10, { children: [
+              /* @__PURE__ */ jsx26(Icon, { name: "plus" }),
               addLabel
             ] }),
             search: options >= SEARCH_AT && { label: `Search ${label.toLowerCase()}` },
@@ -2949,9 +3222,9 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
             }
           }
         ) }),
-        filters.length > 0 && /* @__PURE__ */ jsx25("span", { "data-filter-clear": "", onFocus: () => {
+        filters.length > 0 && /* @__PURE__ */ jsx26("span", { "data-filter-clear": "", onFocus: () => {
           focused.current = { id: null, index: 0 };
-        }, children: /* @__PURE__ */ jsx25(Button, { size: "sm", variant: clearVariant, onClick: () => {
+        }, children: /* @__PURE__ */ jsx26(Button, { size: "sm", variant: clearVariant, onClick: () => {
           if (!blocked) onClear();
         }, children: clearLabel }) })
       ]
@@ -2960,37 +3233,37 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all", clear
 }
 
 // src/KeyValueList.tsx
-import { jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
+import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
 function detail({ value, redacted }) {
-  if (redacted) return /* @__PURE__ */ jsxs21("span", { className: "ui-kv__hidden", children: [
-    /* @__PURE__ */ jsx26(Icon, { name: "eyeOff" }),
+  if (redacted) return /* @__PURE__ */ jsxs22("span", { className: "ui-kv__hidden", children: [
+    /* @__PURE__ */ jsx27(Icon, { name: "eyeOff" }),
     "Hidden"
   ] });
   if (value == null) return "\u2014";
   return typeof value === "boolean" ? String(value) : value;
 }
 function KeyValueList({ rows, columns = 1, className, ...rest }) {
-  return /* @__PURE__ */ jsx26("dl", { ...rest, className: ["ui-kv", columns === 2 && "ui-kv--two-columns", className].filter(Boolean).join(" "), children: rows.map((row, index) => /* @__PURE__ */ jsxs21("div", { className: "ui-drawer__row", children: [
-    /* @__PURE__ */ jsx26("dt", { children: row.label }),
-    /* @__PURE__ */ jsx26("dd", { children: detail(row) })
+  return /* @__PURE__ */ jsx27("dl", { ...rest, className: ["ui-kv", columns === 2 && "ui-kv--two-columns", className].filter(Boolean).join(" "), children: rows.map((row, index) => /* @__PURE__ */ jsxs22("div", { className: "ui-drawer__row", children: [
+    /* @__PURE__ */ jsx27("dt", { children: row.label }),
+    /* @__PURE__ */ jsx27("dd", { children: detail(row) })
   ] }, index)) });
 }
 function DrawerSection({ title, headingLevel = 3, className, children, ...rest }) {
   const Heading = `h${headingLevel}`;
-  return /* @__PURE__ */ jsxs21("section", { ...rest, className: ["ui-drawer__section", className].filter(Boolean).join(" "), children: [
-    title != null && /* @__PURE__ */ jsx26(Heading, { className: "ui-drawer__section-title", children: title }),
+  return /* @__PURE__ */ jsxs22("section", { ...rest, className: ["ui-drawer__section", className].filter(Boolean).join(" "), children: [
+    title != null && /* @__PURE__ */ jsx27(Heading, { className: "ui-drawer__section-title", children: title }),
     children
   ] });
 }
 
 // src/Snippet.tsx
-import { useEffect as useEffect8, useRef as useRef13, useState as useState10 } from "react";
-import { Fragment as Fragment8, jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
+import { useEffect as useEffect9, useRef as useRef14, useState as useState11 } from "react";
+import { Fragment as Fragment11, jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
 function Snippet({ label = "shell", code = "", children, copy = true, reveal = false, copyLabel = "Copy code" }) {
-  const [status, setStatus] = useState10("idle");
-  const request = useRef13(0);
-  const timer = useRef13(void 0);
-  useEffect8(() => {
+  const [status, setStatus] = useState11("idle");
+  const request = useRef14(0);
+  const timer = useRef14(void 0);
+  useEffect9(() => {
     setStatus("idle");
     return () => {
       request.current++;
@@ -3010,11 +3283,11 @@ function Snippet({ label = "shell", code = "", children, copy = true, reveal = f
       if (current === request.current) setStatus("failed");
     }
   }
-  return /* @__PURE__ */ jsxs22("div", { className: reveal ? "ui-snippet ui-snippet--reveal" : "ui-snippet", children: [
-    /* @__PURE__ */ jsxs22("div", { className: "ui-snippet__bar", children: [
-      /* @__PURE__ */ jsx27("span", { children: label }),
-      copy && /* @__PURE__ */ jsxs22(Fragment8, { children: [
-        /* @__PURE__ */ jsx27(
+  return /* @__PURE__ */ jsxs23("div", { className: reveal ? "ui-snippet ui-snippet--reveal" : "ui-snippet", children: [
+    /* @__PURE__ */ jsxs23("div", { className: "ui-snippet__bar", children: [
+      /* @__PURE__ */ jsx28("span", { children: label }),
+      copy && /* @__PURE__ */ jsxs23(Fragment11, { children: [
+        /* @__PURE__ */ jsx28(
           "button",
           {
             type: "button",
@@ -3022,31 +3295,31 @@ function Snippet({ label = "shell", code = "", children, copy = true, reveal = f
             "aria-label": copyLabel,
             title: copyLabel,
             onClick: handleCopy,
-            children: /* @__PURE__ */ jsx27(Icon, { name: status === "idle" ? "copy" : "check" })
+            children: /* @__PURE__ */ jsx28(Icon, { name: status === "idle" ? "copy" : "check" })
           }
         ),
-        /* @__PURE__ */ jsx27("span", { className: "ui-sr ui-snippet__status", role: "status", "aria-live": "polite", children: status === "copied" ? "Copied" : status === "failed" ? "Copy failed" : "" })
+        /* @__PURE__ */ jsx28("span", { className: "ui-sr ui-snippet__status", role: "status", "aria-live": "polite", children: status === "copied" ? "Copied" : status === "failed" ? "Copy failed" : "" })
       ] })
     ] }),
-    /* @__PURE__ */ jsx27("pre", { children: children ?? code })
+    /* @__PURE__ */ jsx28("pre", { children: children ?? code })
   ] });
 }
 
 // src/Tabs.tsx
-import { useEffect as useEffect9, useId as useId9, useRef as useRef14 } from "react";
+import { useEffect as useEffect10, useId as useId9, useRef as useRef15 } from "react";
 import { playEntrance } from "@apliteni/apliteni-ui/motion";
-import { Fragment as Fragment9, jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
 function Tabs({ items, value, onChange, label }) {
   const id = useId9();
-  const previous = useRef14(value);
-  const activePanel = useRef14(null);
-  const buttons = useRef14([]);
-  useEffect9(() => {
+  const previous = useRef15(value);
+  const activePanel = useRef15(null);
+  const buttons = useRef15([]);
+  useEffect10(() => {
     if (previous.current !== value) playEntrance(activePanel.current);
     previous.current = value;
   }, [value]);
-  return /* @__PURE__ */ jsxs23("div", { className: "ui-tabs", children: [
-    /* @__PURE__ */ jsx28("div", { className: "ui-tabs__list", role: "tablist", "aria-label": label, children: items.map((item, i) => /* @__PURE__ */ jsxs23(
+  return /* @__PURE__ */ jsxs24("div", { className: "ui-tabs", children: [
+    /* @__PURE__ */ jsx29("div", { className: "ui-tabs__list", role: "tablist", "aria-label": label, children: items.map((item, i) => /* @__PURE__ */ jsxs24(
       "button",
       {
         type: "button",
@@ -3084,7 +3357,7 @@ function Tabs({ items, value, onChange, label }) {
         },
         children: [
           item.label,
-          item.count != null && /* @__PURE__ */ jsxs23(Fragment9, { children: [
+          item.count != null && /* @__PURE__ */ jsxs24(Fragment12, { children: [
             " ",
             item.count
           ] })
@@ -3092,7 +3365,7 @@ function Tabs({ items, value, onChange, label }) {
       },
       item.value
     )) }),
-    /* @__PURE__ */ jsx28("div", { className: "ui-tabs__panels", children: items.map((item, i) => /* @__PURE__ */ jsx28(
+    /* @__PURE__ */ jsx29("div", { className: "ui-tabs__panels", children: items.map((item, i) => /* @__PURE__ */ jsx29(
       "div",
       {
         className: "ui-tabs__panel",
@@ -3110,14 +3383,14 @@ function Tabs({ items, value, onChange, label }) {
 }
 
 // src/Timeline.tsx
-import { useEffect as useEffect10, useRef as useRef15 } from "react";
+import { useEffect as useEffect11, useRef as useRef16 } from "react";
 import { playEntrance as playEntrance2, prefersReducedMotion } from "@apliteni/apliteni-ui/motion";
-import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
+import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
 var kindIcons = { person: "user", rule: "bolt", reversal: "refresh" };
 function Timeline({ events, className, ...rest }) {
-  const previousIds = useRef15(new Set(events.map((event) => event.id)));
-  const rows = useRef15(/* @__PURE__ */ new Map());
-  useEffect10(() => {
+  const previousIds = useRef16(new Set(events.map((event) => event.id)));
+  const rows = useRef16(/* @__PURE__ */ new Map());
+  useEffect11(() => {
     if (previousIds.current.size > 0 && !prefersReducedMotion()) {
       for (const event of events) {
         if (previousIds.current.has(event.id)) continue;
@@ -3129,7 +3402,7 @@ function Timeline({ events, className, ...rest }) {
     }
     previousIds.current = new Set(events.map((event) => event.id));
   }, [events]);
-  return /* @__PURE__ */ jsx29("ol", { ...rest, role: "list", className: ["ui-timeline", events.some((event) => event.kind) && "ui-timeline--kinds", className].filter(Boolean).join(" "), children: events.map((event, index) => /* @__PURE__ */ jsxs24(
+  return /* @__PURE__ */ jsx30("ol", { ...rest, role: "list", className: ["ui-timeline", events.some((event) => event.kind) && "ui-timeline--kinds", className].filter(Boolean).join(" "), children: events.map((event, index) => /* @__PURE__ */ jsxs25(
     "li",
     {
       className: "ui-timeline__event",
@@ -3138,20 +3411,20 @@ function Timeline({ events, className, ...rest }) {
         else rows.current.delete(event.id);
       },
       children: [
-        /* @__PURE__ */ jsx29("span", { "aria-hidden": "true", className: [
+        /* @__PURE__ */ jsx30("span", { "aria-hidden": "true", className: [
           "ui-timeline__marker",
           event.kind && "ui-timeline__marker--kind",
           event.kind === "reversal" && "ui-timeline__marker--reversal"
-        ].filter(Boolean).join(" "), children: event.kind && /* @__PURE__ */ jsx29(Icon, { name: kindIcons[event.kind] }) }),
-        /* @__PURE__ */ jsxs24("div", { className: "ui-timeline__head", children: [
-          /* @__PURE__ */ jsx29("span", { className: "ui-timeline__actor", children: event.actor }),
-          /* @__PURE__ */ jsx29("time", { dateTime: event.dateTime, children: event.timestamp }),
-          index === events.length - 1 && event.relativeTimestamp && /* @__PURE__ */ jsx29("span", { className: "ui-timeline__relative", children: event.relativeTimestamp })
+        ].filter(Boolean).join(" "), children: event.kind && /* @__PURE__ */ jsx30(Icon, { name: kindIcons[event.kind] }) }),
+        /* @__PURE__ */ jsxs25("div", { className: "ui-timeline__head", children: [
+          /* @__PURE__ */ jsx30("span", { className: "ui-timeline__actor", children: event.actor }),
+          /* @__PURE__ */ jsx30("time", { dateTime: event.dateTime, children: event.timestamp }),
+          index === events.length - 1 && event.relativeTimestamp && /* @__PURE__ */ jsx30("span", { className: "ui-timeline__relative", children: event.relativeTimestamp })
         ] }),
-        /* @__PURE__ */ jsx29("p", { className: "ui-timeline__description", children: event.description }),
-        (event.meta != null || event.undo) && /* @__PURE__ */ jsxs24("div", { className: "ui-timeline__meta", children: [
-          event.meta != null && /* @__PURE__ */ jsx29("span", { children: event.meta }),
-          event.undo && /* @__PURE__ */ jsx29(Button, { variant: "ghost", size: "xs", className: "ui-btn ui-btn--ghost ui-btn--xs ui-timeline__undo", "aria-label": event.undo.label, onClick: event.undo.onUndo, children: "Undo" })
+        /* @__PURE__ */ jsx30("p", { className: "ui-timeline__description", children: event.description }),
+        (event.meta != null || event.undo) && /* @__PURE__ */ jsxs25("div", { className: "ui-timeline__meta", children: [
+          event.meta != null && /* @__PURE__ */ jsx30("span", { children: event.meta }),
+          event.undo && /* @__PURE__ */ jsx30(Button, { variant: "ghost", size: "xs", className: "ui-btn ui-btn--ghost ui-btn--xs ui-timeline__undo", "aria-label": event.undo.label, onClick: event.undo.onUndo, children: "Undo" })
         ] })
       ]
     },
@@ -3160,20 +3433,20 @@ function Timeline({ events, className, ...rest }) {
 }
 
 // src/Field.tsx
-import { forwardRef as forwardRef6, useEffect as useEffect11, useId as useId10, useRef as useRef16, useState as useState11 } from "react";
+import { forwardRef as forwardRef6, useEffect as useEffect12, useId as useId10, useRef as useRef17, useState as useState12 } from "react";
 import { esc, icon as icon5 } from "@apliteni/apliteni-ui";
-import { jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
+import { jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
 function messages(id, hint, error) {
   return [error && `${id}-error`, hint && `${id}-hint`].filter(Boolean).join(" ") || void 0;
 }
 function Frame({ id, labelId, label, hint, error, required, children }) {
-  return /* @__PURE__ */ jsxs25("div", { className: "ui-field", children: [
-    /* @__PURE__ */ jsxs25("label", { className: "ui-field__label", id: labelId, htmlFor: id, children: [
+  return /* @__PURE__ */ jsxs26("div", { className: "ui-field", children: [
+    /* @__PURE__ */ jsxs26("label", { className: "ui-field__label", id: labelId, htmlFor: id, children: [
       label,
-      required && /* @__PURE__ */ jsx30("span", { className: "ui-field__req", "aria-hidden": "true", children: "*" })
+      required && /* @__PURE__ */ jsx31("span", { className: "ui-field__req", "aria-hidden": "true", children: "*" })
     ] }),
     children,
-    error && /* @__PURE__ */ jsx30(
+    error && /* @__PURE__ */ jsx31(
       "div",
       {
         id: `${id}-error`,
@@ -3182,7 +3455,7 @@ function Frame({ id, labelId, label, hint, error, required, children }) {
         dangerouslySetInnerHTML: { __html: icon5("alert") + esc(error) }
       }
     ),
-    hint && /* @__PURE__ */ jsx30("div", { id: `${id}-hint`, className: "ui-field__hint", children: hint })
+    hint && /* @__PURE__ */ jsx31("div", { id: `${id}-hint`, className: "ui-field__hint", children: hint })
   ] });
 }
 function wiring(id, hint, error) {
@@ -3192,13 +3465,13 @@ function Field({ id: suppliedId, label, hint, error, required, children }) {
   const generatedId = useId10();
   const id = suppliedId ?? generatedId;
   const labelId = `${id}-label`;
-  return /* @__PURE__ */ jsx30(Frame, { ...{ id, labelId, label, hint, error, required }, children: /* @__PURE__ */ jsx30(FieldContext.Provider, { value: { id, labelId }, children: children({ ...wiring(id, hint, error), required }) }) });
+  return /* @__PURE__ */ jsx31(Frame, { ...{ id, labelId, label, hint, error, required }, children: /* @__PURE__ */ jsx31(FieldContext.Provider, { value: { id, labelId }, children: children({ ...wiring(id, hint, error), required }) }) });
 }
 var TextField = forwardRef6(function TextField2({ label, hint, error, required, type = "text", unit, icon: glyph, className = "", ...props }, ref) {
   const id = useId10();
   const hasUnit = type === "number" && !!unit;
   const describedBy = [messages(id, hint, error), hasUnit ? `${id}-unit` : ""].filter(Boolean).join(" ") || void 0;
-  const control = /* @__PURE__ */ jsx30(
+  const control = /* @__PURE__ */ jsx31(
     "input",
     {
       ref,
@@ -3211,19 +3484,19 @@ var TextField = forwardRef6(function TextField2({ label, hint, error, required,
       className: `ui-input${error ? " is-invalid" : ""} ${className}`
     }
   );
-  const unitSpan = hasUnit ? /* @__PURE__ */ jsx30("span", { id: `${id}-unit`, className: "ui-field-number__unit", children: unit }) : null;
-  return /* @__PURE__ */ jsx30(Frame, { ...{ id, label, hint, error, required }, children: glyph ? /* @__PURE__ */ jsxs25("div", { className: `ui-input-group${hasUnit ? " ui-field-number" : ""}`, children: [
-    /* @__PURE__ */ jsx30("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon5(glyph) } }),
+  const unitSpan = hasUnit ? /* @__PURE__ */ jsx31("span", { id: `${id}-unit`, className: "ui-field-number__unit", children: unit }) : null;
+  return /* @__PURE__ */ jsx31(Frame, { ...{ id, label, hint, error, required }, children: glyph ? /* @__PURE__ */ jsxs26("div", { className: `ui-input-group${hasUnit ? " ui-field-number" : ""}`, children: [
+    /* @__PURE__ */ jsx31("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon5(glyph) } }),
     control,
     unitSpan
-  ] }) : hasUnit ? /* @__PURE__ */ jsxs25("div", { className: "ui-field-number", children: [
+  ] }) : hasUnit ? /* @__PURE__ */ jsxs26("div", { className: "ui-field-number", children: [
     control,
     unitSpan
   ] }) : control });
 });
 function TextArea({ label, hint, error, required, className = "", ...props }) {
   const id = useId10();
-  return /* @__PURE__ */ jsx30(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx31(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx31(
     "textarea",
     {
       rows: 4,
@@ -3236,7 +3509,7 @@ function TextArea({ label, hint, error, required, className = "", ...props }) {
 }
 function SelectField({ label, hint, error, required, className = "", children, ...props }) {
   const id = useId10();
-  return /* @__PURE__ */ jsx30(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx30(
+  return /* @__PURE__ */ jsx31(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx31(
     "select",
     {
       ...props,
@@ -3249,10 +3522,10 @@ function SelectField({ label, hint, error, required, className = "", children, .
 }
 function FileField({ label, hint, error, required, disabled, onFileChange, className = "", ...props }) {
   const id = useId10();
-  const input = useRef16(null);
-  const [file, setFile] = useState11(null);
-  const [dragging, setDragging] = useState11(false);
-  useEffect11(() => {
+  const input = useRef17(null);
+  const [file, setFile] = useState12(null);
+  const [dragging, setDragging] = useState12(false);
+  useEffect12(() => {
     const form = input.current?.form;
     const reset = () => {
       setFile(null);
@@ -3265,7 +3538,7 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
     setFile(next);
     onFileChange?.(next);
   };
-  return /* @__PURE__ */ jsx30(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsxs25(
+  return /* @__PURE__ */ jsx31(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsxs26(
     "div",
     {
       className: `ui-file${dragging && !disabled ? " is-dragging" : ""}${file ? " has-file" : ""}${error ? " is-invalid" : ""}${disabled ? " is-disabled" : ""}`,
@@ -3286,12 +3559,12 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
         update(transfer.files[0]);
       },
       children: [
-        /* @__PURE__ */ jsx30("span", { className: "ui-file__glyph", children: /* @__PURE__ */ jsx30(Icon, { name: "upload" }) }),
-        /* @__PURE__ */ jsx30("div", { "aria-live": "polite", children: file ? file.name : "Drop a file here" }),
-        /* @__PURE__ */ jsx30("div", { children: "or choose one from your device" }),
-        /* @__PURE__ */ jsxs25("span", { className: "ui-file__choose", children: [
-          /* @__PURE__ */ jsx30("span", { className: "ui-btn ui-btn--secondary ui-btn--sm", "aria-hidden": "true", "aria-disabled": disabled || void 0, children: file ? "Replace file" : "Choose file" }),
-          /* @__PURE__ */ jsx30(
+        /* @__PURE__ */ jsx31("span", { className: "ui-file__glyph", children: /* @__PURE__ */ jsx31(Icon, { name: "upload" }) }),
+        /* @__PURE__ */ jsx31("div", { "aria-live": "polite", children: file ? file.name : "Drop a file here" }),
+        /* @__PURE__ */ jsx31("div", { children: "or choose one from your device" }),
+        /* @__PURE__ */ jsxs26("span", { className: "ui-file__choose", children: [
+          /* @__PURE__ */ jsx31("span", { className: "ui-btn ui-btn--secondary ui-btn--sm", "aria-hidden": "true", "aria-disabled": disabled || void 0, children: file ? "Replace file" : "Choose file" }),
+          /* @__PURE__ */ jsx31(
             "input",
             {
               ...props,
@@ -3311,11 +3584,11 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
 }
 
 // src/FileDrop.tsx
-import { useRef as useRef17, useState as useState12 } from "react";
+import { useRef as useRef18, useState as useState13 } from "react";
 
 // src/EmptyState.tsx
-import { icon as kitIcon2, illo } from "@apliteni/apliteni-ui";
-import { jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
+import { icon as kitIcon3, illo } from "@apliteni/apliteni-ui";
+import { jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
 var cases = {
   "first-run": { title: "Nothing needs you yet", sub: "New items will appear here when they need your attention.", icon: "check" },
   "no-matches": { title: "No results in this view", sub: "Try another search or clear your filters.", icon: "search" },
@@ -3327,16 +3600,16 @@ function EmptyState({ variant = "first-run", title, sub, icon: icon8, art, actio
   const heading = title ?? preset.title;
   const guidance = sub ?? preset.sub;
   const glyph = icon8 ?? preset.icon;
-  return /* @__PURE__ */ jsxs26("div", { className: "ui-empty", children: [
-    art ? typeof art === "string" ? /* @__PURE__ */ jsx31("div", { className: "ui-empty__art", dangerouslySetInnerHTML: { __html: /<svg/.test(art) ? art : illo(art) } }) : /* @__PURE__ */ jsx31("div", { className: "ui-empty__art", "aria-hidden": "true", children: art }) : glyph ? /* @__PURE__ */ jsx31("div", { className: "ui-empty__icon", dangerouslySetInnerHTML: { __html: kitIcon2(glyph) } }) : null,
-    heading && /* @__PURE__ */ jsx31("div", { className: "ui-empty__title", children: heading }),
-    guidance && /* @__PURE__ */ jsx31("div", { className: "ui-empty__sub", children: guidance }),
-    actions && /* @__PURE__ */ jsx31("div", { className: "ui-empty__actions", children: actions })
+  return /* @__PURE__ */ jsxs27("div", { className: "ui-empty", children: [
+    art ? typeof art === "string" ? /* @__PURE__ */ jsx32("div", { className: "ui-empty__art", dangerouslySetInnerHTML: { __html: /<svg/.test(art) ? art : illo(art) } }) : /* @__PURE__ */ jsx32("div", { className: "ui-empty__art", "aria-hidden": "true", children: art }) : glyph ? /* @__PURE__ */ jsx32("div", { className: "ui-empty__icon", dangerouslySetInnerHTML: { __html: kitIcon3(glyph) } }) : null,
+    heading && /* @__PURE__ */ jsx32("div", { className: "ui-empty__title", children: heading }),
+    guidance && /* @__PURE__ */ jsx32("div", { className: "ui-empty__sub", children: guidance }),
+    actions && /* @__PURE__ */ jsx32("div", { className: "ui-empty__actions", children: actions })
   ] });
 }
 
 // src/FileDrop.tsx
-import { Fragment as Fragment10, jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
+import { Fragment as Fragment13, jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
 var MARKS = {
   uploading: "clock",
   done: "circleCheck",
@@ -3372,8 +3645,8 @@ function FileDrop({
   children,
   className
 }) {
-  const input = useRef17(null);
-  const [over, setOver] = useState12(false);
+  const input = useRef18(null);
+  const [over, setOver] = useState13(false);
   const status = file?.status ?? "uploading";
   const word = status === "error" ? file?.error ?? WORDS.error : file?.state ?? WORDS[status];
   const [stem, ext] = splitName(file?.name ?? "");
@@ -3389,7 +3662,7 @@ function FileDrop({
   const pick = () => {
     if (!disabled) input.current?.click();
   };
-  const picker = /* @__PURE__ */ jsx32(
+  const picker = /* @__PURE__ */ jsx33(
     "input",
     {
       ref: input,
@@ -3422,20 +3695,20 @@ function FileDrop({
       take(Array.from(event.dataTransfer.files));
     }
   };
-  if (title !== void 0) return /* @__PURE__ */ jsxs27(
+  if (title !== void 0) return /* @__PURE__ */ jsxs28(
     "div",
     {
       className: cx7("ui-drop", "ui-drop--area", showTarget && "is-dragging", disabled && "is-disabled", className),
       onClick: pick,
       ...drag,
       children: [
-        /* @__PURE__ */ jsx32(
+        /* @__PURE__ */ jsx33(
           EmptyState,
           {
             icon: "upload",
             title,
             sub: note ?? "",
-            actions: /* @__PURE__ */ jsx32(
+            actions: /* @__PURE__ */ jsx33(
               Button,
               {
                 variant: "primary",
@@ -3455,18 +3728,18 @@ function FileDrop({
       ]
     }
   );
-  return /* @__PURE__ */ jsxs27("div", { className: cx7("ui-drop", disabled && "is-disabled", className), ...drag, children: [
+  return /* @__PURE__ */ jsxs28("div", { className: cx7("ui-drop", disabled && "is-disabled", className), ...drag, children: [
     children,
-    /* @__PURE__ */ jsxs27("div", { className: "ui-drop__row", children: [
-      file ? /* @__PURE__ */ jsxs27("div", { className: cx7("ui-drop__file", status === "error" && "ui-drop__file--failed"), children: [
-        /* @__PURE__ */ jsxs27("div", { className: "ui-drop__line", children: [
-          /* @__PURE__ */ jsxs27("span", { className: "ui-drop__name", title: file.name, children: [
-            /* @__PURE__ */ jsx32("span", { className: "ui-drop__stem", children: stem }),
-            /* @__PURE__ */ jsx32("span", { className: "ui-drop__ext", children: ext })
+    /* @__PURE__ */ jsxs28("div", { className: "ui-drop__row", children: [
+      file ? /* @__PURE__ */ jsxs28("div", { className: cx7("ui-drop__file", status === "error" && "ui-drop__file--failed"), children: [
+        /* @__PURE__ */ jsxs28("div", { className: "ui-drop__line", children: [
+          /* @__PURE__ */ jsxs28("span", { className: "ui-drop__name", title: file.name, children: [
+            /* @__PURE__ */ jsx33("span", { className: "ui-drop__stem", children: stem }),
+            /* @__PURE__ */ jsx33("span", { className: "ui-drop__ext", children: ext })
           ] }),
-          (onRemove || status === "error" && onRetry) && /* @__PURE__ */ jsxs27("span", { className: "ui-drop__actions", children: [
-            status === "error" && onRetry && /* @__PURE__ */ jsx32(Button, { size: "sm", icon: "refresh", onClick: onRetry, disabled, children: retryLabel }),
-            onRemove && /* @__PURE__ */ jsx32(
+          (onRemove || status === "error" && onRetry) && /* @__PURE__ */ jsxs28("span", { className: "ui-drop__actions", children: [
+            status === "error" && onRetry && /* @__PURE__ */ jsx33(Button, { size: "sm", icon: "refresh", onClick: onRetry, disabled, children: retryLabel }),
+            onRemove && /* @__PURE__ */ jsx33(
               Button,
               {
                 variant: "ghost",
@@ -3478,21 +3751,21 @@ function FileDrop({
             )
           ] })
         ] }),
-        (showSize || showWord) && /* @__PURE__ */ jsxs27(
+        (showSize || showWord) && /* @__PURE__ */ jsxs28(
           "div",
           {
             className: cx7("ui-drop__facts", status === "error" && "ui-drop__error"),
             role: status === "error" ? "alert" : void 0,
             children: [
-              showSize && /* @__PURE__ */ jsx32("span", { className: "ui-drop__size", children: file.size }),
-              showWord && /* @__PURE__ */ jsxs27("span", { className: "ui-drop__state", children: [
-                /* @__PURE__ */ jsx32(Icon, { name: MARKS[status] }),
-                /* @__PURE__ */ jsx32("span", { className: "ui-drop__word", title: word, children: word })
+              showSize && /* @__PURE__ */ jsx33("span", { className: "ui-drop__size", children: file.size }),
+              showWord && /* @__PURE__ */ jsxs28("span", { className: "ui-drop__state", children: [
+                /* @__PURE__ */ jsx33(Icon, { name: MARKS[status] }),
+                /* @__PURE__ */ jsx33("span", { className: "ui-drop__word", title: word, children: word })
               ] })
             ]
           }
         ),
-        hasBar && /* @__PURE__ */ jsx32(
+        hasBar && /* @__PURE__ */ jsx33(
           "span",
           {
             className: "ui-drop__bar",
@@ -3501,11 +3774,11 @@ function FileDrop({
             "aria-valuenow": file.progress,
             "aria-valuemin": 0,
             "aria-valuemax": 100,
-            children: /* @__PURE__ */ jsx32("span", { style: { width: `${file.progress}%` } })
+            children: /* @__PURE__ */ jsx33("span", { style: { width: `${file.progress}%` } })
           }
         )
-      ] }) : /* @__PURE__ */ jsxs27(Fragment10, { children: [
-        /* @__PURE__ */ jsx32(
+      ] }) : /* @__PURE__ */ jsxs28(Fragment13, { children: [
+        /* @__PURE__ */ jsx33(
           Button,
           {
             size: "sm",
@@ -3515,22 +3788,22 @@ function FileDrop({
             children: label
           }
         ),
-        note && /* @__PURE__ */ jsx32("p", { className: "ui-drop__note", children: note })
+        note && /* @__PURE__ */ jsx33("p", { className: "ui-drop__note", children: note })
       ] }),
       picker
     ] }),
-    showTarget && /* @__PURE__ */ jsx32("div", { className: "ui-drop__target", "aria-hidden": "true", children: dropLabel })
+    showTarget && /* @__PURE__ */ jsx33("div", { className: "ui-drop__target", "aria-hidden": "true", children: dropLabel })
   ] });
 }
 
 // src/SearchField.tsx
 import { forwardRef as forwardRef7 } from "react";
 import { icon as icon6 } from "@apliteni/apliteni-ui";
-import { jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
 var SearchField = forwardRef7(function SearchField2({ ariaLabel, className, ...props }, ref) {
-  return /* @__PURE__ */ jsxs28("div", { className: "ui-input-group", children: [
-    /* @__PURE__ */ jsx33("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon6("search") } }),
-    /* @__PURE__ */ jsx33(
+  return /* @__PURE__ */ jsxs29("div", { className: "ui-input-group", children: [
+    /* @__PURE__ */ jsx34("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon6("search") } }),
+    /* @__PURE__ */ jsx34(
       "input",
       {
         ref,
@@ -3544,9 +3817,9 @@ var SearchField = forwardRef7(function SearchField2({ ariaLabel, className, ...p
 });
 
 // src/Toast.tsx
-import { createContext as createContext3, useCallback as useCallback6, useContext as useContext3, useEffect as useEffect12, useLayoutEffect as useLayoutEffect4, useRef as useRef18, useState as useState13 } from "react";
-import { createPortal as createPortal4 } from "react-dom";
-import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
+import { createContext as createContext3, useCallback as useCallback6, useContext as useContext3, useEffect as useEffect13, useLayoutEffect as useLayoutEffect4, useRef as useRef19, useState as useState14 } from "react";
+import { createPortal as createPortal5 } from "react-dom";
+import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
 var Context = createContext3(null);
 var glyphs = { success: "circleCheck", danger: "circleX", warn: "circleAlert", info: "info", neutral: "bolt" };
 function useToast() {
@@ -3555,23 +3828,23 @@ function useToast() {
   return push;
 }
 function Notice({ notice, remove }) {
-  const root = useRef18(null);
-  const [leaving2, setLeaving] = useState13(false);
-  const dismissed = useRef18(false);
-  const [hovered, setHovered] = useState13(false);
-  const [focused, setFocused] = useState13(false);
+  const root = useRef19(null);
+  const [leaving2, setLeaving] = useState14(false);
+  const dismissed = useRef19(false);
+  const [hovered, setHovered] = useState14(false);
+  const [focused, setFocused] = useState14(false);
   const paused = hovered || focused;
   const tone = notice.tone ?? "success";
   const timed = !notice.action && notice.timer !== false && notice.timer !== 0;
   const duration = typeof notice.timer === "number" ? notice.timer * 1e3 : 5e3;
-  const remaining = useRef18(duration);
+  const remaining = useRef19(duration);
   const dismiss = useCallback6(() => {
     if (dismissed.current) return;
     dismissed.current = true;
     if (typeof matchMedia === "function" && matchMedia("(prefers-reduced-motion: reduce)").matches) remove();
     else setLeaving(true);
   }, [remove]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (leaving2) {
       const element = root.current;
       const finish = (event) => {
@@ -3585,7 +3858,7 @@ function Notice({ notice, remove }) {
       };
     }
   }, [leaving2, remove]);
-  useEffect12(() => {
+  useEffect13(() => {
     if (leaving2 || !timed || paused) return;
     const started = Date.now();
     const timer = setTimeout(dismiss, remaining.current);
@@ -3594,7 +3867,7 @@ function Notice({ notice, remove }) {
       remaining.current = Math.max(0, remaining.current - (Date.now() - started));
     };
   }, [dismiss, leaving2, paused, timed]);
-  return /* @__PURE__ */ jsxs29(
+  return /* @__PURE__ */ jsxs30(
     "div",
     {
       ref: root,
@@ -3608,12 +3881,12 @@ function Notice({ notice, remove }) {
         if (!event.currentTarget.contains(event.relatedTarget)) setFocused(false);
       },
       children: [
-        /* @__PURE__ */ jsx34("span", { className: "ui-toast__icon", children: /* @__PURE__ */ jsx34(Icon, { name: glyphs[tone] }) }),
-        /* @__PURE__ */ jsxs29("div", { className: "ui-toast__body", children: [
-          /* @__PURE__ */ jsx34("div", { className: "ui-toast__title", children: notice.title }),
-          !notice.compact && notice.text && /* @__PURE__ */ jsx34("div", { className: "ui-toast__text", children: notice.text })
+        /* @__PURE__ */ jsx35("span", { className: "ui-toast__icon", children: /* @__PURE__ */ jsx35(Icon, { name: glyphs[tone] }) }),
+        /* @__PURE__ */ jsxs30("div", { className: "ui-toast__body", children: [
+          /* @__PURE__ */ jsx35("div", { className: "ui-toast__title", children: notice.title }),
+          !notice.compact && notice.text && /* @__PURE__ */ jsx35("div", { className: "ui-toast__text", children: notice.text })
         ] }),
-        notice.action && /* @__PURE__ */ jsx34(
+        notice.action && /* @__PURE__ */ jsx35(
           "button",
           {
             type: "button",
@@ -3628,8 +3901,8 @@ function Notice({ notice, remove }) {
             children: notice.action.label
           }
         ),
-        notice.dismissible !== false && /* @__PURE__ */ jsx34("button", { type: "button", className: "ui-toast__close", "aria-label": "Dismiss", disabled: leaving2, onClick: dismiss, children: /* @__PURE__ */ jsx34(Icon, { name: "x" }) }),
-        timed && /* @__PURE__ */ jsx34(
+        notice.dismissible !== false && /* @__PURE__ */ jsx35("button", { type: "button", className: "ui-toast__close", "aria-label": "Dismiss", disabled: leaving2, onClick: dismiss, children: /* @__PURE__ */ jsx35(Icon, { name: "x" }) }),
+        timed && /* @__PURE__ */ jsx35(
           "span",
           {
             className: "ui-toast__timer is-running",
@@ -3662,41 +3935,41 @@ function usePublishedReach(stack2, count) {
   }, [stack2, count]);
 }
 function Toast({ children }) {
-  const [entries, setEntries] = useState13([]);
-  const nextId = useRef18(0);
-  const stack2 = useRef18(null);
+  const [entries, setEntries] = useState14([]);
+  const nextId = useRef19(0);
+  const stack2 = useRef19(null);
   const push = useCallback6((notice) => {
     const id = nextId.current++;
     const remove = () => setEntries((current) => current.filter((entry) => entry.id !== id));
     setEntries((current) => [...current, { id, notice, remove }]);
   }, []);
   usePublishedReach(stack2, entries.length);
-  return /* @__PURE__ */ jsxs29(Context.Provider, { value: push, children: [
+  return /* @__PURE__ */ jsxs30(Context.Provider, { value: push, children: [
     children,
-    typeof document !== "undefined" && createPortal4(
-      /* @__PURE__ */ jsx34("div", { className: "ui-toast-stack rx-toast-stack", ref: stack2, children: entries.map((entry) => /* @__PURE__ */ jsx34(Notice, { notice: entry.notice, remove: entry.remove }, entry.id)) }),
+    typeof document !== "undefined" && createPortal5(
+      /* @__PURE__ */ jsx35("div", { className: "ui-toast-stack rx-toast-stack", ref: stack2, children: entries.map((entry) => /* @__PURE__ */ jsx35(Notice, { notice: entry.notice, remove: entry.remove }, entry.id)) }),
       document.body
     )
   ] });
 }
 
 // src/AppShell.tsx
-import { useEffect as useEffect14, useId as useId12, useRef as useRef19, useState as useState15 } from "react";
+import { useEffect as useEffect15, useId as useId12, useRef as useRef20, useState as useState16 } from "react";
 import { paletteHotkey, prism, railCollapsed } from "@apliteni/apliteni-ui";
 
 // src/SidebarNav.tsx
-import { forwardRef as forwardRef8, useEffect as useEffect13, useId as useId11, useState as useState14 } from "react";
+import { forwardRef as forwardRef8, useEffect as useEffect14, useId as useId11, useState as useState15 } from "react";
 import { ENTRANCE_FALLBACK_MS } from "@apliteni/apliteni-ui/motion";
-import { Fragment as Fragment11, jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
+import { Fragment as Fragment14, jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
 var badgeText = (badge) => typeof badge === "object" ? badge.text : badge;
 function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
   const uid = useId11();
   const group = !sub && !!item.items?.length;
   const childActive = group && item.items.some((child) => child.id === active);
-  const [expanded, setExpanded] = useState14();
+  const [expanded, setExpanded] = useState15();
   const open = expanded ?? item.defaultOpen ?? childActive;
-  const [entering, setEntering] = useState14(false);
-  useEffect13(() => {
+  const [entering, setEntering] = useState15(false);
+  useEffect14(() => {
     if (!entering) return;
     const timer = setTimeout(() => setEntering(false), ENTRANCE_FALLBACK_MS);
     return () => clearTimeout(timer);
@@ -3713,15 +3986,15 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
     item.disabled && "is-disabled",
     item.danger && "is-danger"
   ].filter(Boolean).join(" ");
-  const children = /* @__PURE__ */ jsxs30(Fragment11, { children: [
-    (item.leading ?? item.icon) && /* @__PURE__ */ jsx35("span", { className: "ui-nav__ic", children: item.leading ?? /* @__PURE__ */ jsx35(Icon, { name: item.icon }) }),
-    /* @__PURE__ */ jsx35("span", { className: "ui-nav__label", children: item.label }),
-    count != null && count !== "" && /* @__PURE__ */ jsx35("span", { className: `ui-nav__badge is-${typeof item.badge === "object" ? item.badge.tone ?? "neutral" : "neutral"}`, children: count }),
-    group && /* @__PURE__ */ jsx35("span", { className: "ui-nav__caret", "aria-hidden": "true" })
+  const children = /* @__PURE__ */ jsxs31(Fragment14, { children: [
+    (item.leading ?? item.icon) && /* @__PURE__ */ jsx36("span", { className: "ui-nav__ic", children: item.leading ?? /* @__PURE__ */ jsx36(Icon, { name: item.icon }) }),
+    /* @__PURE__ */ jsx36("span", { className: "ui-nav__label", children: item.label }),
+    count != null && count !== "" && /* @__PURE__ */ jsx36("span", { className: `ui-nav__badge is-${typeof item.badge === "object" ? item.badge.tone ?? "neutral" : "neutral"}`, children: count }),
+    group && /* @__PURE__ */ jsx36("span", { className: "ui-nav__caret", "aria-hidden": "true" })
   ] });
   const common = { className, "aria-label": name, title: collapsed ? name : void 0, children };
-  if (group) return /* @__PURE__ */ jsxs30("li", { className: `ui-nav__group${open ? " is-open" : ""}`, children: [
-    /* @__PURE__ */ jsx35(
+  if (group) return /* @__PURE__ */ jsxs31("li", { className: `ui-nav__group${open ? " is-open" : ""}`, children: [
+    /* @__PURE__ */ jsx36(
       "button",
       {
         ...common,
@@ -3735,22 +4008,22 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
         }
       }
     ),
-    /* @__PURE__ */ jsx35("ul", { id: uid, className: `ui-nav__sub${entering ? " is-entering" : ""}`, hidden: !open, onAnimationEnd: () => setEntering(false), children: item.items.map((child) => /* @__PURE__ */ jsx35(Row, { item: child, active, activeIs, collapsed, renderLink, sub: true }, child.id)) })
+    /* @__PURE__ */ jsx36("ul", { id: uid, className: `ui-nav__sub${entering ? " is-entering" : ""}`, hidden: !open, onAnimationEnd: () => setEntering(false), children: item.items.map((child) => /* @__PURE__ */ jsx36(Row, { item: child, active, activeIs, collapsed, renderLink, sub: true }, child.id)) })
   ] });
-  if (item.disabled) return /* @__PURE__ */ jsx35("li", { children: /* @__PURE__ */ jsx35("span", { ...common, role: "link", "aria-disabled": "true" }) });
+  if (item.disabled) return /* @__PURE__ */ jsx36("li", { children: /* @__PURE__ */ jsx36("span", { ...common, role: "link", "aria-disabled": "true" }) });
   const props = {
     ...common,
     href: item.href ?? `#${item.id}`,
     target: item.target,
     "aria-current": isActive ? activeIs === "section" ? "true" : "page" : void 0
   };
-  return /* @__PURE__ */ jsx35("li", { children: renderLink ? renderLink(item, props) : /* @__PURE__ */ jsx35("a", { ...props }) });
+  return /* @__PURE__ */ jsx36("li", { children: renderLink ? renderLink(item, props) : /* @__PURE__ */ jsx36("a", { ...props }) });
 }
 function Section({ section, ...props }) {
   const uid = useId11();
-  return /* @__PURE__ */ jsxs30("div", { className: "ui-nav__section", children: [
-    section.label && /* @__PURE__ */ jsx35("div", { className: "ui-nav__cap", id: uid, "aria-hidden": props.collapsed || void 0, children: section.label }),
-    /* @__PURE__ */ jsx35("ul", { className: "ui-nav__list", "aria-labelledby": section.label ? uid : void 0, children: section.items.map((item) => /* @__PURE__ */ jsx35(Row, { item, ...props }, item.id)) })
+  return /* @__PURE__ */ jsxs31("div", { className: "ui-nav__section", children: [
+    section.label && /* @__PURE__ */ jsx36("div", { className: "ui-nav__cap", id: uid, "aria-hidden": props.collapsed || void 0, children: section.label }),
+    /* @__PURE__ */ jsx36("ul", { className: "ui-nav__list", "aria-labelledby": section.label ? uid : void 0, children: section.items.map((item) => /* @__PURE__ */ jsx36(Row, { item, ...props }, item.id)) })
   ] });
 }
 var SidebarNav = forwardRef8(function SidebarNav2({
@@ -3765,8 +4038,8 @@ var SidebarNav = forwardRef8(function SidebarNav2({
   "aria-label": label = "Sidebar",
   ...rest
 }, ref) {
-  return /* @__PURE__ */ jsxs30("nav", { ...rest, ref, "aria-label": label, className: ["ui-nav", "ui-nav--side", collapsed && "is-collapsed", className].filter(Boolean).join(" "), children: [
-    (sections?.length ? sections : [{ items }]).map((section, index) => /* @__PURE__ */ jsx35(
+  return /* @__PURE__ */ jsxs31("nav", { ...rest, ref, "aria-label": label, className: ["ui-nav", "ui-nav--side", collapsed && "is-collapsed", className].filter(Boolean).join(" "), children: [
+    (sections?.length ? sections : [{ items }]).map((section, index) => /* @__PURE__ */ jsx36(
       Section,
       {
         section,
@@ -3777,14 +4050,14 @@ var SidebarNav = forwardRef8(function SidebarNav2({
       },
       index
     )),
-    footer && /* @__PURE__ */ jsx35("div", { className: "ui-nav__foot", children: footer })
+    footer && /* @__PURE__ */ jsx36("div", { className: "ui-nav__foot", children: footer })
   ] });
 });
 
 // src/ThemeToggle.tsx
 import { useSyncExternalStore } from "react";
 import { themeIcon } from "@apliteni/apliteni-ui";
-import { jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
+import { jsx as jsx37, jsxs as jsxs32 } from "react/jsx-runtime";
 var STORAGE_KEY = "apliteni-strategy-theme";
 var CHOICE_EVENT = "apliteni-theme-choice";
 var THEME_INIT_SCRIPT = `(()=>{let t;try{t=localStorage.getItem('apliteni-strategy-theme')}catch{}document.documentElement.setAttribute('data-theme',t==='dark'||t==='light'?t:window.matchMedia?.('(prefers-color-scheme: light)').matches?'light':'dark')})()`;
@@ -3842,10 +4115,10 @@ function ThemeToggle({ labelled = false }) {
     }
     window.dispatchEvent(new Event(CHOICE_EVENT));
   };
-  const button = /* @__PURE__ */ jsx36("button", { type: "button", className: "toggle", "aria-label": name, title: name, onClick: toggle, children: /* @__PURE__ */ jsx36("span", { className: "ic", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: themeIcon(theme) } }) });
-  return labelled ? /* @__PURE__ */ jsxs31("span", { className: "ui-theme-toggle", children: [
+  const button = /* @__PURE__ */ jsx37("button", { type: "button", className: "toggle", "aria-label": name, title: name, onClick: toggle, children: /* @__PURE__ */ jsx37("span", { className: "ic", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: themeIcon(theme) } }) });
+  return labelled ? /* @__PURE__ */ jsxs32("span", { className: "ui-theme-toggle", children: [
     button,
-    /* @__PURE__ */ jsxs31("span", { children: [
+    /* @__PURE__ */ jsxs32("span", { children: [
       label,
       " theme"
     ] })
@@ -3853,7 +4126,7 @@ function ThemeToggle({ labelled = false }) {
 }
 
 // src/AppShell.tsx
-import { Fragment as Fragment12, jsx as jsx37, jsxs as jsxs32 } from "react/jsx-runtime";
+import { Fragment as Fragment15, jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
 var path = (value) => value.split(/[?#]/)[0].replace(/\/+$/, "") || "/";
 function AppShell({
   sections,
@@ -3877,20 +4150,20 @@ function AppShell({
   renderLink
 }) {
   const uid = useId12();
-  const [collapsed, setCollapsed] = useState15(defaultCollapsed);
-  const [search, setSearch] = useState15(false);
-  const [menu, setMenu] = useState15(false);
-  const menuButton = useRef19(null);
+  const [collapsed, setCollapsed] = useState16(defaultCollapsed);
+  const [search, setSearch] = useState16(false);
+  const [menu, setMenu] = useState16(false);
+  const menuButton = useRef20(null);
   const current = path(pathname);
   const active = sections.filter((section) => current === path(section.href) || path(section.href) !== "/" && current.startsWith(`${path(section.href)}/`)).sort((a, b) => path(b.href).length - path(a.href).length)[0];
-  useEffect14(() => {
+  useEffect15(() => {
     setCollapsed(railCollapsed() ?? defaultCollapsed);
   }, [defaultCollapsed]);
-  useEffect14(() => {
+  useEffect15(() => {
     setMenu(false);
     setSearch(false);
   }, [pathname]);
-  useEffect14(() => {
+  useEffect15(() => {
     if (!menu) return;
     const grown = () => {
       const button = menuButton.current;
@@ -3899,7 +4172,7 @@ function AppShell({
     window.addEventListener("resize", grown);
     return () => window.removeEventListener("resize", grown);
   }, [menu]);
-  useEffect14(() => {
+  useEffect15(() => {
     const hotkey = (event) => {
       if (!(event.metaKey || event.ctrlKey) || event.altKey || event.shiftKey || event.key.toLowerCase() !== "k") return;
       const target = event.target;
@@ -3918,7 +4191,7 @@ function AppShell({
     } catch {
     }
   };
-  const sidebar = (label) => /* @__PURE__ */ jsx37(
+  const sidebar = (label) => /* @__PURE__ */ jsx38(
     SidebarNav,
     {
       "aria-label": label,
@@ -3930,33 +4203,33 @@ function AppShell({
         const linkProps = { ...props, onClick: (event) => {
           if (!event.metaKey && !event.ctrlKey && !event.shiftKey && !event.altKey) setMenu(false);
         } };
-        return renderLink ? renderLink(section, linkProps) : /* @__PURE__ */ jsx37("a", { ...linkProps });
+        return renderLink ? renderLink(section, linkProps) : /* @__PURE__ */ jsx38("a", { ...linkProps });
       }
     }
   );
   const foldLabel = collapsed ? "Expand sidebar" : "Collapse sidebar";
   const navigable = sections.length > 1 || Boolean(back);
-  const lockup = /* @__PURE__ */ jsxs32("a", { className: "ui-app__brand", href: brandHref, "aria-label": word, children: [
-    brand ?? /* @__PURE__ */ jsx37("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(uid, 24) } }),
-    /* @__PURE__ */ jsx37("span", { children: word })
+  const lockup = /* @__PURE__ */ jsxs33("a", { className: "ui-app__brand", href: brandHref, "aria-label": word, children: [
+    brand ?? /* @__PURE__ */ jsx38("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(uid, 24) } }),
+    /* @__PURE__ */ jsx38("span", { children: word })
   ] });
-  return /* @__PURE__ */ jsxs32("div", { className: `ui-app ui-app--topbar ui-react-app${collapsed ? " is-collapsed" : ""}`, children: [
-    navigable && /* @__PURE__ */ jsxs32("div", { className: "ui-app__rail", role: "region", "aria-label": "Sidebar", children: [
-      /* @__PURE__ */ jsx37("div", { className: "ui-app__head", children: lockup }),
+  return /* @__PURE__ */ jsxs33("div", { className: `ui-app ui-app--topbar ui-react-app${collapsed ? " is-collapsed" : ""}`, children: [
+    navigable && /* @__PURE__ */ jsxs33("div", { className: "ui-app__rail", role: "region", "aria-label": "Sidebar", children: [
+      /* @__PURE__ */ jsx38("div", { className: "ui-app__head", children: lockup }),
       sidebar("Sections"),
-      /* @__PURE__ */ jsx37("div", { className: "ui-app__foot", children: /* @__PURE__ */ jsx37("div", { className: "ui-app__fold-row", children: /* @__PURE__ */ jsxs32("button", { type: "button", className: "ui-nav__item ui-app__fold", "aria-expanded": !collapsed, "aria-label": foldLabel, onClick: fold, children: [
-        /* @__PURE__ */ jsx37("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsxs32("svg", { className: "ui-icon", viewBox: "0 0 24 24", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsx37("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
-          /* @__PURE__ */ jsx37("path", { className: "ui-app__fold-seam", d: "M9 3v18" }),
-          /* @__PURE__ */ jsx37("path", { className: "ui-app__fold-arrow", d: "m16 15-3-3 3-3" })
+      /* @__PURE__ */ jsx38("div", { className: "ui-app__foot", children: /* @__PURE__ */ jsx38("div", { className: "ui-app__fold-row", children: /* @__PURE__ */ jsxs33("button", { type: "button", className: "ui-nav__item ui-app__fold", "aria-expanded": !collapsed, "aria-label": foldLabel, onClick: fold, children: [
+        /* @__PURE__ */ jsx38("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsxs33("svg", { className: "ui-icon", viewBox: "0 0 24 24", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+          /* @__PURE__ */ jsx38("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
+          /* @__PURE__ */ jsx38("path", { className: "ui-app__fold-seam", d: "M9 3v18" }),
+          /* @__PURE__ */ jsx38("path", { className: "ui-app__fold-arrow", d: "m16 15-3-3 3-3" })
         ] }) }),
-        /* @__PURE__ */ jsx37("span", { className: "ui-nav__label", children: foldLabel })
+        /* @__PURE__ */ jsx38("span", { className: "ui-nav__label", children: foldLabel })
       ] }) }) })
     ] }),
-    /* @__PURE__ */ jsxs32("div", { className: "ui-app__well", children: [
-      /* @__PURE__ */ jsxs32("header", { className: "ui-app__bar", children: [
-        navigable && /* @__PURE__ */ jsxs32(Fragment12, { children: [
-          /* @__PURE__ */ jsx37(
+    /* @__PURE__ */ jsxs33("div", { className: "ui-app__well", children: [
+      /* @__PURE__ */ jsxs33("header", { className: "ui-app__bar", children: [
+        navigable && /* @__PURE__ */ jsxs33(Fragment15, { children: [
+          /* @__PURE__ */ jsx38(
             Button,
             {
               ref: menuButton,
@@ -3970,19 +4243,19 @@ function AppShell({
               onClick: () => setMenu(true)
             }
           ),
-          /* @__PURE__ */ jsx37("a", { className: "ui-app__brand ui-app__brand--band", href: brandHref, "aria-label": word, children: brand ?? /* @__PURE__ */ jsx37("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(`${uid}-band`, 24) } }) })
+          /* @__PURE__ */ jsx38("a", { className: "ui-app__brand ui-app__brand--band", href: brandHref, "aria-label": word, children: brand ?? /* @__PURE__ */ jsx38("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(`${uid}-band`, 24) } }) })
         ] }),
         !navigable && lockup,
-        /* @__PURE__ */ jsxs32("button", { type: "button", className: "ui-app__search", "aria-haspopup": "dialog", onClick: () => setSearch(true), children: [
-          /* @__PURE__ */ jsx37("span", { className: "ui-app__search-ic", children: /* @__PURE__ */ jsx37(Icon, { name: "search" }) }),
-          /* @__PURE__ */ jsx37("span", { className: "ui-app__search-txt", children: searchLabel }),
-          /* @__PURE__ */ jsx37("span", { className: "ui-app__search-short", "aria-hidden": "true", children: searchShortLabel }),
-          /* @__PURE__ */ jsx37("kbd", { className: "ui-cmdk__key", children: paletteHotkey() })
+        /* @__PURE__ */ jsxs33("button", { type: "button", className: "ui-app__search", "aria-haspopup": "dialog", onClick: () => setSearch(true), children: [
+          /* @__PURE__ */ jsx38("span", { className: "ui-app__search-ic", children: /* @__PURE__ */ jsx38(Icon, { name: "search" }) }),
+          /* @__PURE__ */ jsx38("span", { className: "ui-app__search-txt", children: searchLabel }),
+          /* @__PURE__ */ jsx38("span", { className: "ui-app__search-short", "aria-hidden": "true", children: searchShortLabel }),
+          /* @__PURE__ */ jsx38("kbd", { className: "ui-cmdk__key", children: paletteHotkey() })
         ] }),
-        /* @__PURE__ */ jsx37("span", { className: "ui-app__bar-gap" }),
-        bandControl && /* @__PURE__ */ jsx37("span", { className: "ui-react-app__band-control", children: bandControl }),
-        /* @__PURE__ */ jsx37(ThemeToggle, {}),
-        /* @__PURE__ */ jsx37("div", { className: "ui-app__user ui-app__user--bar", children: /* @__PURE__ */ jsx37(
+        /* @__PURE__ */ jsx38("span", { className: "ui-app__bar-gap" }),
+        bandControl && /* @__PURE__ */ jsx38("span", { className: "ui-react-app__band-control", children: bandControl }),
+        /* @__PURE__ */ jsx38(ThemeToggle, {}),
+        /* @__PURE__ */ jsx38("div", { className: "ui-app__user ui-app__user--bar", children: /* @__PURE__ */ jsx38(
           Dropdown,
           {
             variant: "menu",
@@ -3991,35 +4264,105 @@ function AppShell({
             ariaLabel: `Signed in as ${account.name}, ${account.email}`,
             triggerClass: "ui-app__user-trigger",
             panelClass: "ui-app__user-panel",
-            triggerContent: /* @__PURE__ */ jsx37("span", { className: "ui-app__av", "aria-hidden": "true", children: /* @__PURE__ */ jsx37(Avatar, { personKey: account.email || account.name, name: account.name, size: 32 }) }),
-            header: /* @__PURE__ */ jsxs32("div", { className: "ui-dropdown__head", children: [
-              /* @__PURE__ */ jsx37("b", { children: account.name }),
-              /* @__PURE__ */ jsx37("span", { children: account.email })
+            triggerContent: /* @__PURE__ */ jsx38("span", { className: "ui-app__av", "aria-hidden": "true", children: /* @__PURE__ */ jsx38(Avatar, { personKey: account.email || account.name, name: account.name, size: 32 }) }),
+            header: /* @__PURE__ */ jsxs33("div", { className: "ui-dropdown__head", children: [
+              /* @__PURE__ */ jsx38("b", { children: account.name }),
+              /* @__PURE__ */ jsx38("span", { children: account.email })
             ] }),
             items: [{ label: "Sign out", icon: "logout", danger: true }],
             onSelect: onSignOut
           }
         ) })
       ] }),
-      /* @__PURE__ */ jsxs32("main", { className: `ui-app__main${width === "wide" ? " ui-app__main--wide" : ""}`, children: [
-        back && /* @__PURE__ */ jsx37(BackLink, { ...back }),
-        /* @__PURE__ */ jsx37("h1", { children: title }),
-        lede && /* @__PURE__ */ jsx37("p", { className: "ui-app__sub", children: lede }),
-        actions && /* @__PURE__ */ jsx37("div", { className: "ui-react-app__actions", children: actions }),
-        /* @__PURE__ */ jsx37("div", { className: "ui-app__body", children })
+      /* @__PURE__ */ jsxs33("main", { className: `ui-app__main${width === "wide" ? " ui-app__main--wide" : ""}`, children: [
+        back && /* @__PURE__ */ jsx38(BackLink, { ...back }),
+        /* @__PURE__ */ jsx38("h1", { children: title }),
+        lede && /* @__PURE__ */ jsx38("p", { className: "ui-app__sub", children: lede }),
+        actions && /* @__PURE__ */ jsx38("div", { className: "ui-react-app__actions", children: actions }),
+        /* @__PURE__ */ jsx38("div", { className: "ui-app__body", children })
       ] })
     ] }),
-    navigable && /* @__PURE__ */ jsx37(Drawer, { open: menu, onClose: () => setMenu(false), title: word, side: "left", size: "sm", children: /* @__PURE__ */ jsx37("div", { className: "ui-react-app__menu", children: sidebar("Menu sections") }) }),
-    /* @__PURE__ */ jsx37(CommandPalette, { ...palette ?? { groups: [{ items: sections.map((section) => ({ id: section.href, ...section })) }] }, open: search, onClose: () => setSearch(false) })
+    navigable && /* @__PURE__ */ jsx38(Drawer, { open: menu, onClose: () => setMenu(false), title: word, side: "left", size: "sm", children: /* @__PURE__ */ jsx38("div", { className: "ui-react-app__menu", children: sidebar("Menu sections") }) }),
+    /* @__PURE__ */ jsx38(CommandPalette, { ...palette ?? { groups: [{ items: sections.map((section) => ({ id: section.href, ...section })) }] }, open: search, onClose: () => setSearch(false) })
   ] });
 }
 
+// src/Footer.tsx
+import { useId as useId13 } from "react";
+import { prism as prism2, safeUrl as safeUrl2 } from "@apliteni/apliteni-ui";
+import { jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
+var SOCIAL_GLYPHS = {
+  github: '<path d="M12 2a10 10 0 0 0-3.16 19.49c.5.09.68-.22.68-.48v-1.7c-2.78.6-3.37-1.34-3.37-1.34-.45-1.16-1.11-1.47-1.11-1.47-.9-.62.07-.6.07-.6 1 .07 1.53 1.03 1.53 1.03.9 1.53 2.34 1.09 2.91.83.09-.65.35-1.09.63-1.34-2.22-.25-4.55-1.11-4.55-4.94 0-1.09.39-1.98 1.03-2.68-.1-.25-.45-1.27.1-2.64 0 0 .84-.27 2.75 1.02a9.5 9.5 0 0 1 5 0c1.91-1.29 2.75-1.02 2.75-1.02.55 1.37.2 2.39.1 2.64.64.7 1.03 1.59 1.03 2.68 0 3.84-2.34 4.68-4.57 4.93.36.31.68.92.68 1.85v2.74c0 .27.18.58.69.48A10 10 0 0 0 12 2z"/>',
+  x: '<path d="M4 3h4.5l4 5.5L17.5 3H21l-6.5 8.5L21 21h-4.5l-4.3-5.9L7 21H3.5l6.8-8.9z"/>',
+  linkedin: '<path d="M416 32H31.9C14.3 32 0 46.5 0 64.3v383.4C0 465.5 14.3 480 31.9 480H416c17.6 0 32-14.5 32-32.3V64.3c0-17.8-14.4-32.3-32-32.3zM135.4 416H69V202.2h66.5V416zm-33.2-243c-21.3 0-38.5-17.3-38.5-38.5S80.9 96 102.2 96c21.2 0 38.5 17.3 38.5 38.5 0 21.3-17.2 38.5-38.5 38.5zm282.1 243h-66.4V312c0-24.8-.5-56.7-34.5-56.7-34.6 0-39.9 27-39.9 54.9V416h-66.4V202.2h63.7v29.2h.9c8.9-16.8 30.6-34.5 62.9-34.5 67.2 0 79.7 44.3 79.7 101.9V416z"/>',
+  mail: '<rect x="3" y="5" width="18" height="14" rx="2" fill="none" stroke="currentColor" stroke-width="1.7"/><path d="m3 7 9 6 9-6" fill="none" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/>'
+};
+var escapeText = (t) => t.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;");
+function Legal({ legal, legalLinks, switcher }) {
+  return /* @__PURE__ */ jsxs34("div", { className: "ui-footer__bar", children: [
+    /* @__PURE__ */ jsx39("span", { className: "ui-footer__legal", children: legal }),
+    legalLinks && legalLinks.length > 0 && /* @__PURE__ */ jsx39("nav", { className: "ui-footer__legal-links", "aria-label": "Legal", children: legalLinks.map(({ label, href: to }) => /* @__PURE__ */ jsx39("a", { href: safeUrl2(to ?? "#"), children: label }, label)) }),
+    switcher ? /* @__PURE__ */ jsx39("div", { className: "ui-footer__switcher", children: switcher }) : null
+  ] });
+}
+function Footer({
+  variant = "full",
+  word = "Strategy",
+  brandHref = "/",
+  brand,
+  tagline,
+  columns = [],
+  links,
+  social = [],
+  legal = `\xA9 ${(/* @__PURE__ */ new Date()).getFullYear()} Apliteni`,
+  legalLinks = [],
+  switcher,
+  className,
+  ...rest
+}) {
+  const uid = useId13();
+  const cls = ["ui-footer", `ui-footer--${variant}`, className].filter(Boolean).join(" ");
+  const bar = /* @__PURE__ */ jsx39(Legal, { legal, legalLinks, switcher });
+  if (variant !== "full") {
+    return /* @__PURE__ */ jsx39("footer", { ...rest, className: cls, role: "contentinfo", children: /* @__PURE__ */ jsx39("div", { className: "ui-footer__in", children: bar }) });
+  }
+  const mark = prism2(uid.replace(/:/g, ""), 22);
+  const lockup = brand ?? /* @__PURE__ */ jsx39(
+    "a",
+    {
+      className: "brand",
+      href: safeUrl2(brandHref),
+      "aria-label": `Apliteni ${word}`,
+      dangerouslySetInnerHTML: { __html: `${mark}<span>${escapeText(word)}</span>` }
+    }
+  );
+  return /* @__PURE__ */ jsx39("footer", { ...rest, className: cls, role: "contentinfo", children: /* @__PURE__ */ jsxs34("div", { className: "ui-footer__in", children: [
+    /* @__PURE__ */ jsxs34("div", { className: "ui-footer__top", children: [
+      brand !== false && /* @__PURE__ */ jsxs34("div", { className: "ui-footer__brand", children: [
+        lockup,
+        tagline && /* @__PURE__ */ jsx39("p", { className: "ui-footer__tagline", children: tagline }),
+        social.length > 0 && /* @__PURE__ */ jsx39("div", { className: "ui-footer__socials", children: social.map(({ label, href: to, icon: icon8 = "github" }) => {
+          const markup = SOCIAL_GLYPHS[icon8];
+          const fill = icon8 === "mail" ? "none" : "currentColor";
+          const viewBox = icon8 === "linkedin" ? "0 0 448 512" : "0 0 24 24";
+          return /* @__PURE__ */ jsx39("a", { className: "ui-footer__social", href: safeUrl2(to ?? "#"), "aria-label": label, children: /* @__PURE__ */ jsx39("svg", { viewBox, fill, "aria-hidden": "true", dangerouslySetInnerHTML: { __html: markup } }) }, label);
+        }) })
+      ] }),
+      (links || columns.length > 0) && /* @__PURE__ */ jsx39("nav", { className: "ui-footer__nav", "aria-label": "Footer", children: links ?? columns.map(({ title, links: columnLinks }, i) => /* @__PURE__ */ jsxs34("div", { className: "ui-footer__col", children: [
+        title && /* @__PURE__ */ jsx39("h2", { className: "ui-footer__col-title", children: title }),
+        /* @__PURE__ */ jsx39("ul", { className: "ui-footer__links", children: columnLinks.map(({ label, href: to, target }) => /* @__PURE__ */ jsx39("li", { children: /* @__PURE__ */ jsx39("a", { href: safeUrl2(to ?? "#"), target, rel: target ? "noreferrer" : void 0, children: label }) }, label)) })
+      ] }, title ?? i)) })
+    ] }),
+    bar
+  ] }) });
+}
+
 // src/Success.tsx
-import { forwardRef as forwardRef9, useEffect as useEffect15, useRef as useRef20, useState as useState16 } from "react";
-import { jsx as jsx38, jsxs as jsxs33 } from "react/jsx-runtime";
+import { forwardRef as forwardRef9, useEffect as useEffect16, useRef as useRef21, useState as useState17 } from "react";
+import { jsx as jsx40, jsxs as jsxs35 } from "react/jsx-runtime";
 var SuccessCheck = forwardRef9(function SuccessCheck2({ variant = "line", className, ...rest }, ref) {
   const circled = variant === "circled";
-  return /* @__PURE__ */ jsxs33(
+  return /* @__PURE__ */ jsxs35(
     "svg",
     {
       ...rest,
@@ -4031,18 +4374,18 @@ var SuccessCheck = forwardRef9(function SuccessCheck2({ variant = "line", classN
       "aria-hidden": "true",
       focusable: "false",
       children: [
-        circled && /* @__PURE__ */ jsx38("path", { className: "ui-sx__circle", d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
-        /* @__PURE__ */ jsx38("path", { className: "ui-sx__tick", d: circled ? "M22 4L12 14.01l-3-3" : "M20 6L9 17l-5-5" })
+        circled && /* @__PURE__ */ jsx40("path", { className: "ui-sx__circle", d: "M22 11.08V12a10 10 0 1 1-5.93-9.14" }),
+        /* @__PURE__ */ jsx40("path", { className: "ui-sx__tick", d: circled ? "M22 4L12 14.01l-3-3" : "M20 6L9 17l-5-5" })
       ]
     }
   );
 });
 var SuccessPanel = forwardRef9(function SuccessPanel2({ title = "Done", sub, check = "line", className, ...rest }, ref) {
   const circled = check === "circled";
-  return /* @__PURE__ */ jsxs33("div", { ...rest, ref, className: ["ui-success", className].filter(Boolean).join(" "), children: [
-    /* @__PURE__ */ jsx38("div", { className: ["ui-success__check", circled && "ui-success__check--circled"].filter(Boolean).join(" "), children: /* @__PURE__ */ jsx38(SuccessCheck, { variant: circled ? "circled" : "line" }) }),
-    /* @__PURE__ */ jsx38("div", { className: "ui-success__title", children: title }),
-    sub && /* @__PURE__ */ jsx38("div", { className: "ui-success__sub", children: sub })
+  return /* @__PURE__ */ jsxs35("div", { ...rest, ref, className: ["ui-success", className].filter(Boolean).join(" "), children: [
+    /* @__PURE__ */ jsx40("div", { className: ["ui-success__check", circled && "ui-success__check--circled"].filter(Boolean).join(" "), children: /* @__PURE__ */ jsx40(SuccessCheck, { variant: circled ? "circled" : "line" }) }),
+    /* @__PURE__ */ jsx40("div", { className: "ui-success__title", children: title }),
+    sub && /* @__PURE__ */ jsx40("div", { className: "ui-success__sub", children: sub })
   ] });
 });
 var pieces = [
@@ -4062,12 +4405,12 @@ var pieces = [
   [80, 0.36, -20, "c", 1.05]
 ];
 function Countdown({ seconds, label = "Redirecting", onDone }) {
-  const [remaining, setRemaining] = useState16(seconds);
-  const callback = useRef20(onDone);
-  useEffect15(() => {
+  const [remaining, setRemaining] = useState17(seconds);
+  const callback = useRef21(onDone);
+  useEffect16(() => {
     callback.current = onDone;
   }, [onDone]);
-  useEffect15(() => {
+  useEffect16(() => {
     let count = seconds;
     const timer = setInterval(() => {
       count -= 1;
@@ -4079,12 +4422,12 @@ function Countdown({ seconds, label = "Redirecting", onDone }) {
     }, 1e3);
     return () => clearInterval(timer);
   }, [seconds]);
-  return /* @__PURE__ */ jsxs33("div", { className: "ui-sx__count", "data-sx-count": "", style: { "--sx-secs": `${seconds}s` }, children: [
-    /* @__PURE__ */ jsx38("span", { className: "ui-sx__count-ring", "aria-hidden": "true" }),
-    /* @__PURE__ */ jsxs33("span", { className: "ui-sx__count-text", children: [
+  return /* @__PURE__ */ jsxs35("div", { className: "ui-sx__count", "data-sx-count": "", style: { "--sx-secs": `${seconds}s` }, children: [
+    /* @__PURE__ */ jsx40("span", { className: "ui-sx__count-ring", "aria-hidden": "true" }),
+    /* @__PURE__ */ jsxs35("span", { className: "ui-sx__count-text", children: [
       label,
       " in ",
-      /* @__PURE__ */ jsx38("b", { "data-sx-num": "", children: remaining }),
+      /* @__PURE__ */ jsx40("b", { "data-sx-num": "", children: remaining }),
       "s"
     ] })
   ] });
@@ -4111,7 +4454,7 @@ var Success = forwardRef9(function Success2({
   const seconds = countdown?.seconds;
   const duration = seconds != null && Number.isFinite(seconds) && seconds >= 1 ? Math.floor(seconds) : 5;
   const mark = check === "circled" ? "circled" : "line";
-  return /* @__PURE__ */ jsxs33(
+  return /* @__PURE__ */ jsxs35(
     "div",
     {
       role: "status",
@@ -4120,16 +4463,16 @@ var Success = forwardRef9(function Success2({
       ref,
       className: ["ui-sx", `ui-sx--${layout}`, `ui-sx--check-${mark}`, confetti && "ui-sx--confetti", className].filter(Boolean).join(" "),
       children: [
-        confetti && /* @__PURE__ */ jsx38("div", { className: "ui-sx__confetti", "aria-hidden": "true", children: pieces.map(
-          ([x, d, r, t, s], index) => /* @__PURE__ */ jsx38("i", { className: `ui-sx__piece ui-sx__piece--${t}`, style: { left: `${x}%`, "--sx-d": `${d}s`, "--sx-r": `${r}deg`, "--sx-s": s } }, index)
+        confetti && /* @__PURE__ */ jsx40("div", { className: "ui-sx__confetti", "aria-hidden": "true", children: pieces.map(
+          ([x, d, r, t, s], index) => /* @__PURE__ */ jsx40("i", { className: `ui-sx__piece ui-sx__piece--${t}`, style: { left: `${x}%`, "--sx-d": `${d}s`, "--sx-r": `${r}deg`, "--sx-s": s } }, index)
         ) }),
-        /* @__PURE__ */ jsxs33("div", { className: "ui-sx__inner", children: [
-          /* @__PURE__ */ jsx38("div", { className: "ui-sx__visual", children: /* @__PURE__ */ jsx38(SuccessCheck, { variant: mark }) }),
-          /* @__PURE__ */ jsxs33("div", { className: "ui-sx__content", children: [
-            /* @__PURE__ */ jsx38(Heading, { className: "ui-sx__title", children: title }),
-            body && /* @__PURE__ */ jsx38("p", { className: "ui-sx__body", children: body }),
-            hasActions && /* @__PURE__ */ jsx38("div", { className: "ui-sx__actions", children: actions }),
-            countdown && /* @__PURE__ */ jsx38(Countdown, { seconds: duration, label: countdown.label, onDone: onCountdownEnd }, duration)
+        /* @__PURE__ */ jsxs35("div", { className: "ui-sx__inner", children: [
+          /* @__PURE__ */ jsx40("div", { className: "ui-sx__visual", children: /* @__PURE__ */ jsx40(SuccessCheck, { variant: mark }) }),
+          /* @__PURE__ */ jsxs35("div", { className: "ui-sx__content", children: [
+            /* @__PURE__ */ jsx40(Heading, { className: "ui-sx__title", children: title }),
+            body && /* @__PURE__ */ jsx40("p", { className: "ui-sx__body", children: body }),
+            hasActions && /* @__PURE__ */ jsx40("div", { className: "ui-sx__actions", children: actions }),
+            countdown && /* @__PURE__ */ jsx40(Countdown, { seconds: duration, label: countdown.label, onDone: onCountdownEnd }, duration)
           ] })
         ] })
       ]
@@ -4140,15 +4483,15 @@ var Success = forwardRef9(function Success2({
 // src/Chart.tsx
 import {
   useCallback as useCallback7,
-  useEffect as useEffect16,
-  useId as useId13,
+  useEffect as useEffect17,
+  useId as useId14,
   useLayoutEffect as useLayoutEffect5,
   useMemo as useMemo4,
-  useRef as useRef21,
-  useState as useState17
+  useRef as useRef22,
+  useState as useState18
 } from "react";
 import { CHART_FLOOR, bridgeWalk, chartScale, pointTarget } from "@apliteni/apliteni-ui";
-import { Fragment as Fragment13, jsx as jsx39, jsxs as jsxs34 } from "react/jsx-runtime";
+import { Fragment as Fragment16, jsx as jsx41, jsxs as jsxs36 } from "react/jsx-runtime";
 var HEIGHT = { months: 216, bridge: 216, spark: 32 };
 var PAD = 2;
 var ZERO_INSET = 1.5;
@@ -4186,8 +4529,8 @@ function barPath(m) {
   return `M${px(x)} ${px(roundBottom ? bottom - r : bottom)}V${px(roundTop ? top + r : top)}` + (roundTop ? `${arc(r, -r, 1)}h${px(w - r * 2)}${arc(r, r, 1)}` : `h${px(w)}`) + `V${px(roundBottom ? bottom - r : bottom)}` + (roundBottom ? `${arc(-r, r, 1)}h${px(-(w - r * 2))}${arc(-r, -r, 1)}` : `h${px(-w)}`) + "z";
 }
 function useTapFloor() {
-  const [floor, setFloor] = useState17(TARGET);
-  useEffect16(() => {
+  const [floor, setFloor] = useState18(TARGET);
+  useEffect17(() => {
     const query = typeof window === "undefined" ? null : window.matchMedia?.(`(max-width: ${PHONE_MAX2}px) and (pointer: coarse)`);
     if (!query) return;
     const read = () => setFloor(query.matches ? TAP_FLOOR : TARGET);
@@ -4309,23 +4652,23 @@ function Chart(props) {
   const spark = variant === "spark";
   const plotHeight = height ?? HEIGHT[variant];
   const showTable = table ?? !spark;
-  const uid = useId13().replace(/[^\w-]/g, "");
-  const frameEl = useRef21(null);
-  const scroller = useRef21(null);
-  const plot = useRef21(null);
-  const tipEl = useRef21(null);
-  const svgEl = useRef21(null);
-  const ignoreMouseUntil = useRef21(0);
-  const touchMoved = useRef21(false);
-  const dismissed = useRef21(null);
-  const opening = useRef21(false);
-  const pointerFocus = useRef21(false);
+  const uid = useId14().replace(/[^\w-]/g, "");
+  const frameEl = useRef22(null);
+  const scroller = useRef22(null);
+  const plot = useRef22(null);
+  const tipEl = useRef22(null);
+  const svgEl = useRef22(null);
+  const ignoreMouseUntil = useRef22(0);
+  const touchMoved = useRef22(false);
+  const dismissed = useRef22(null);
+  const opening = useRef22(false);
+  const pointerFocus = useRef22(false);
   const floor = useTapFloor();
-  const [width, setWidth] = useState17(0);
-  const [openId, setOpenId] = useState17(null);
-  const [rawCursor, setCursor] = useState17(0);
-  const [said, setSaid] = useState17("");
-  const [ownPick, setOwnPick] = useState17(null);
+  const [width, setWidth] = useState18(0);
+  const [openId, setOpenId] = useState18(null);
+  const [rawCursor, setCursor] = useState18(0);
+  const [said, setSaid] = useState18("");
+  const [ownPick, setOwnPick] = useState18(null);
   const pick = selected === void 0 ? ownPick : selected;
   const steps = props.variant === "bridge" ? props.steps : void 0;
   const bridgeTones = props.variant === "bridge" ? props.tones : void 0;
@@ -4429,7 +4772,7 @@ function Chart(props) {
   const byId = useMemo4(() => new Map(marks.map((m) => [m.id, m])), [marks]);
   const lead = useCallback7((column) => marks.find((m) => m.column === column), [marks]);
   const open = openId ? byId.get(openId) : void 0;
-  useEffect16(() => {
+  useEffect17(() => {
     const el = plot.current;
     if (!el) return;
     const read = () => setWidth(el.clientWidth);
@@ -4446,13 +4789,13 @@ function Chart(props) {
     el.classList.toggle("is-more-before", el.scrollLeft > 1);
     el.classList.toggle("is-more-after", el.scrollLeft < last - 1);
   }, []);
-  useEffect16(syncEdges, [syncEdges, plotWidth, count]);
+  useEffect17(syncEdges, [syncEdges, plotWidth, count]);
   useLayoutEffect5(() => {
     if (!openId || !frameEl.current || !tipEl.current || !svgEl.current) return;
     const anchor = [...svgEl.current.querySelectorAll("[data-anchor]")].find((el) => el.getAttribute("data-anchor") === openId);
     if (anchor) placeTip(frameEl.current, anchor, tipEl.current, frameEl.current);
   }, [openId, plotWidth, plotHeight]);
-  useEffect16(() => {
+  useEffect17(() => {
     if (!openId) return;
     const doc = frameEl.current?.ownerDocument;
     const view = doc?.defaultView;
@@ -4524,7 +4867,7 @@ function Chart(props) {
   const estimated = columns.filter((c) => c.estimated);
   const estimatedTone = marks.find((m) => m.estimated && m.kind === "bar")?.tone ?? keys[0]?.tone ?? "neutral";
   const hitBand = (band) => band === "up" ? { y: PAD, h: Math.max(zero - PAD, TARGET) } : band === "down" ? { y: zero, h: Math.max(plotHeight - PAD - zero, TARGET) } : { y: PAD, h: Math.max(plotHeight - PAD * 2, TARGET) };
-  return /* @__PURE__ */ jsxs34(
+  return /* @__PURE__ */ jsxs36(
     "div",
     {
       className: cx8("ui-chart", `ui-chart--${variant}`, selectable && "ui-chart--pick", className),
@@ -4535,9 +4878,9 @@ function Chart(props) {
         "--ui-chart-pad": `${PAD}px`
       },
       children: [
-        !spark && keys.length > 0 && /* @__PURE__ */ jsxs34("ul", { className: "ui-chart__legend", children: [
-          keys.map((key) => /* @__PURE__ */ jsxs34("li", { className: cx8("ui-chart__key", `ui-chart__tone--${key.tone}`), children: [
-            key.shape === "line" ? /* @__PURE__ */ jsx39("svg", { className: "ui-chart__key-mark", width: "18", height: "12", viewBox: "0 0 18 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx39("path", { className: "ui-chart__key-line", d: "M1 9 L6 5 L12 7 L17 3" }) }) : /* @__PURE__ */ jsx39("svg", { className: "ui-chart__key-mark", width: "12", height: "12", viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx39(
+        !spark && keys.length > 0 && /* @__PURE__ */ jsxs36("ul", { className: "ui-chart__legend", children: [
+          keys.map((key) => /* @__PURE__ */ jsxs36("li", { className: cx8("ui-chart__key", `ui-chart__tone--${key.tone}`), children: [
+            key.shape === "line" ? /* @__PURE__ */ jsx41("svg", { className: "ui-chart__key-mark", width: "18", height: "12", viewBox: "0 0 18 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx41("path", { className: "ui-chart__key-line", d: "M1 9 L6 5 L12 7 L17 3" }) }) : /* @__PURE__ */ jsx41("svg", { className: "ui-chart__key-mark", width: "12", height: "12", viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx41(
               "rect",
               {
                 className: "ui-chart__key-swatch",
@@ -4550,12 +4893,12 @@ function Chart(props) {
             ) }),
             key.name
           ] }, key.id)),
-          estimated.length > 0 && /* @__PURE__ */ jsxs34("li", { className: cx8("ui-chart__key", `ui-chart__tone--${estimatedTone}`), children: [
-            /* @__PURE__ */ jsx39("svg", { className: "ui-chart__key-mark", width: "12", height: "12", viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx39("rect", { className: "ui-chart__key-estimated", x: "1.5", y: "1.5", width: "9", height: "9", rx: "1" }) }),
+          estimated.length > 0 && /* @__PURE__ */ jsxs36("li", { className: cx8("ui-chart__key", `ui-chart__tone--${estimatedTone}`), children: [
+            /* @__PURE__ */ jsx41("svg", { className: "ui-chart__key-mark", width: "12", height: "12", viewBox: "0 0 12 12", "aria-hidden": "true", children: /* @__PURE__ */ jsx41("rect", { className: "ui-chart__key-estimated", x: "1.5", y: "1.5", width: "9", height: "9", rx: "1" }) }),
             "Estimated"
           ] })
         ] }),
-        /* @__PURE__ */ jsxs34(
+        /* @__PURE__ */ jsxs36(
           "div",
           {
             ref: frameEl,
@@ -4579,8 +4922,8 @@ function Chart(props) {
               setSaid("");
             },
             children: [
-              !spark && scale.ticks.length > 0 && /* @__PURE__ */ jsx39("div", { className: "ui-chart__axis", "aria-hidden": "true", children: [...scale.ticks].reverse().map((tick) => /* @__PURE__ */ jsx39("span", { className: "ui-chart__tick", children: formatAxis(tick) }, tick)) }),
-              /* @__PURE__ */ jsx39("div", { ref: scroller, className: "ui-chart__scroll", tabIndex: -1, onScroll: () => {
+              !spark && scale.ticks.length > 0 && /* @__PURE__ */ jsx41("div", { className: "ui-chart__axis", "aria-hidden": "true", children: [...scale.ticks].reverse().map((tick) => /* @__PURE__ */ jsx41("span", { className: "ui-chart__tick", children: formatAxis(tick) }, tick)) }),
+              /* @__PURE__ */ jsx41("div", { ref: scroller, className: "ui-chart__scroll", tabIndex: -1, onScroll: () => {
                 syncEdges();
                 const anchor = [...svgEl.current?.querySelectorAll("[data-anchor]") ?? []].find((el) => el.getAttribute("data-anchor") === openId);
                 if (!anchor || !scroller.current || !frameEl.current || !tipEl.current) return;
@@ -4588,8 +4931,8 @@ function Chart(props) {
                 const view = scroller.current.getBoundingClientRect();
                 if (mark.right <= view.left || mark.left >= view.right) setOpenId(null);
                 else placeTip(frameEl.current, anchor, tipEl.current, frameEl.current);
-              }, children: /* @__PURE__ */ jsxs34("div", { ref: plot, className: "ui-chart__plot", children: [
-                /* @__PURE__ */ jsxs34(
+              }, children: /* @__PURE__ */ jsxs36("div", { ref: plot, className: "ui-chart__plot", children: [
+                /* @__PURE__ */ jsxs36(
                   "svg",
                   {
                     ref: svgEl,
@@ -4649,7 +4992,7 @@ function Chart(props) {
                       announce(mark.column, selectable ? mark.column : pick);
                     },
                     children: [
-                      !spark && pick !== null && pick >= 0 && pick < count && /* @__PURE__ */ jsx39(
+                      !spark && pick !== null && pick >= 0 && pick < count && /* @__PURE__ */ jsx41(
                         "rect",
                         {
                           className: "ui-chart__band",
@@ -4662,7 +5005,7 @@ function Chart(props) {
                       frame.links && frame.bars.slice(0, -1).map((bar, i) => {
                         const from = byId.get(bar.id);
                         const to = byId.get(frame.bars[i + 1].id);
-                        return from && to ? /* @__PURE__ */ jsx39(
+                        return from && to ? /* @__PURE__ */ jsx41(
                           "line",
                           {
                             className: "ui-chart__carry",
@@ -4674,7 +5017,7 @@ function Chart(props) {
                           `carry-${bar.id}`
                         ) : null;
                       }),
-                      !spark && scale.ticks.filter((tick) => tick !== 0).map((tick) => /* @__PURE__ */ jsx39(
+                      !spark && scale.ticks.filter((tick) => tick !== 0).map((tick) => /* @__PURE__ */ jsx41(
                         "line",
                         {
                           className: "ui-chart__grid",
@@ -4685,7 +5028,7 @@ function Chart(props) {
                         },
                         `grid-${tick}`
                       )),
-                      !spark && scale.ticks.includes(0) && /* @__PURE__ */ jsx39(
+                      !spark && scale.ticks.includes(0) && /* @__PURE__ */ jsx41(
                         "line",
                         {
                           className: "ui-chart__zero",
@@ -4695,7 +5038,7 @@ function Chart(props) {
                           y2: px(y(0))
                         }
                       ),
-                      marks.filter((m) => m.kind === "bar").map((mark) => /* @__PURE__ */ jsx39(
+                      marks.filter((m) => m.kind === "bar").map((mark) => /* @__PURE__ */ jsx41(
                         "path",
                         {
                           className: cx8(
@@ -4708,7 +5051,7 @@ function Chart(props) {
                         `bar-${mark.id}`
                       )),
                       ["casing", "stroke"].map((layer) => lines.flatMap(
-                        (line) => line.values.slice(1).map((value, i) => Number.isFinite(value) && Number.isFinite(line.values[i]) ? /* @__PURE__ */ jsx39(
+                        (line) => line.values.slice(1).map((value, i) => Number.isFinite(value) && Number.isFinite(line.values[i]) ? /* @__PURE__ */ jsx41(
                           "line",
                           {
                             className: layer === "casing" ? "ui-chart__line-casing" : cx8(
@@ -4724,7 +5067,7 @@ function Chart(props) {
                           `${line.id}-${layer}-${i}`
                         ) : null)
                       )),
-                      lines.flatMap((line) => line.values.map((value, i) => Number.isFinite(value) && !Number.isFinite(line.values[i - 1]) && !Number.isFinite(line.values[i + 1]) ? /* @__PURE__ */ jsx39(
+                      lines.flatMap((line) => line.values.map((value, i) => Number.isFinite(value) && !Number.isFinite(line.values[i - 1]) && !Number.isFinite(line.values[i + 1]) ? /* @__PURE__ */ jsx41(
                         "circle",
                         {
                           className: cx8("ui-chart__isolated", `ui-chart__tone--${line.tone}`),
@@ -4734,8 +5077,8 @@ function Chart(props) {
                         },
                         `isolated-${line.id}-${i}`
                       ) : null)),
-                      marks.map((mark) => /* @__PURE__ */ jsxs34("g", { "data-mark": mark.id, children: [
-                        mark.kind === "bar" ? /* @__PURE__ */ jsx39(
+                      marks.map((mark) => /* @__PURE__ */ jsxs36("g", { "data-mark": mark.id, children: [
+                        mark.kind === "bar" ? /* @__PURE__ */ jsx41(
                           "rect",
                           {
                             className: "ui-chart__hit",
@@ -4744,7 +5087,7 @@ function Chart(props) {
                             y: px(hitBand(mark.band).y),
                             height: px(hitBand(mark.band).h)
                           }
-                        ) : /* @__PURE__ */ jsx39(
+                        ) : /* @__PURE__ */ jsx41(
                           "rect",
                           {
                             className: "ui-chart__hit",
@@ -4754,7 +5097,7 @@ function Chart(props) {
                             height: px(mark.hit?.h ?? TARGET)
                           }
                         ),
-                        /* @__PURE__ */ jsx39(
+                        /* @__PURE__ */ jsx41(
                           "rect",
                           {
                             "data-anchor": mark.id,
@@ -4769,7 +5112,7 @@ function Chart(props) {
                     ]
                   }
                 ),
-                !spark && /* @__PURE__ */ jsx39("div", { className: "ui-chart__periods", "aria-hidden": "true", children: columns.map((column, i) => /* @__PURE__ */ jsx39(
+                !spark && /* @__PURE__ */ jsx41("div", { className: "ui-chart__periods", "aria-hidden": "true", children: columns.map((column, i) => /* @__PURE__ */ jsx41(
                   "span",
                   {
                     className: cx8("ui-chart__period", pick === i && "is-selected"),
@@ -4778,35 +5121,35 @@ function Chart(props) {
                   `${column.label}-${i}`
                 )) })
               ] }) }),
-              /* @__PURE__ */ jsx39("span", { ref: tipEl, className: cx8("ui-tip", openId && "is-open"), role: open ? "tooltip" : void 0, children: open && /* @__PURE__ */ jsxs34(Fragment13, { children: [
-                /* @__PURE__ */ jsx39("span", { className: "ui-tip__label", children: spark ? columns[open.column]?.label : `${open.name}, ${columns[open.column]?.label}` }),
-                /* @__PURE__ */ jsx39("span", { className: "ui-tip__value", children: format(open.value) }),
-                (stateOf(columns[open.column]) || open.detail) && /* @__PURE__ */ jsx39("span", { className: "ui-tip__detail", children: stateOf(columns[open.column]) || open.detail })
+              /* @__PURE__ */ jsx41("span", { ref: tipEl, className: cx8("ui-tip", openId && "is-open"), role: open ? "tooltip" : void 0, children: open && /* @__PURE__ */ jsxs36(Fragment16, { children: [
+                /* @__PURE__ */ jsx41("span", { className: "ui-tip__label", children: spark ? columns[open.column]?.label : `${open.name}, ${columns[open.column]?.label}` }),
+                /* @__PURE__ */ jsx41("span", { className: "ui-tip__value", children: format(open.value) }),
+                (stateOf(columns[open.column]) || open.detail) && /* @__PURE__ */ jsx41("span", { className: "ui-tip__detail", children: stateOf(columns[open.column]) || open.detail })
               ] }) })
             ]
           }
         ),
-        /* @__PURE__ */ jsx39("div", { className: "ui-sr", role: "status", children: said }),
-        showTable && /* @__PURE__ */ jsxs34("details", { className: "ui-chart__data", children: [
-          /* @__PURE__ */ jsx39("summary", { className: "ui-focusable", children: "Values as a table" }),
-          /* @__PURE__ */ jsx39(
+        /* @__PURE__ */ jsx41("div", { className: "ui-sr", role: "status", children: said }),
+        showTable && /* @__PURE__ */ jsxs36("details", { className: "ui-chart__data", children: [
+          /* @__PURE__ */ jsx41("summary", { className: "ui-focusable", children: "Values as a table" }),
+          /* @__PURE__ */ jsx41(
             "div",
             {
               className: "ui-table-scroll",
               role: "region",
               tabIndex: 0,
               "aria-label": `${title}, as a table. Scroll for more columns.`,
-              children: /* @__PURE__ */ jsxs34("table", { className: "ui-table", "aria-label": title, children: [
-                /* @__PURE__ */ jsx39("thead", { children: /* @__PURE__ */ jsx39("tr", { children: tableHead.map((head, i) => /* @__PURE__ */ jsx39("th", { scope: "col", className: cx8(i > 0 && "ui-table__num"), children: head }, head)) }) }),
-                /* @__PURE__ */ jsx39("tbody", { children: tableRows.map((row, i) => /* @__PURE__ */ jsxs34("tr", { "aria-current": pick === i ? true : void 0, children: [
-                  /* @__PURE__ */ jsxs34("th", { scope: "row", children: [
+              children: /* @__PURE__ */ jsxs36("table", { className: "ui-table", "aria-label": title, children: [
+                /* @__PURE__ */ jsx41("thead", { children: /* @__PURE__ */ jsx41("tr", { children: tableHead.map((head, i) => /* @__PURE__ */ jsx41("th", { scope: "col", className: cx8(i > 0 && "ui-table__num"), children: head }, head)) }) }),
+                /* @__PURE__ */ jsx41("tbody", { children: tableRows.map((row, i) => /* @__PURE__ */ jsxs36("tr", { "aria-current": pick === i ? true : void 0, children: [
+                  /* @__PURE__ */ jsxs36("th", { scope: "row", children: [
                     row.column.label,
-                    row.column.estimated && /* @__PURE__ */ jsxs34(Fragment13, { children: [
+                    row.column.estimated && /* @__PURE__ */ jsxs36(Fragment16, { children: [
                       " ",
-                      /* @__PURE__ */ jsx39("span", { className: "ui-chart__state", children: stateOf(row.column) })
+                      /* @__PURE__ */ jsx41("span", { className: "ui-chart__state", children: stateOf(row.column) })
                     ] })
                   ] }),
-                  row.cells.map((cell, j) => /* @__PURE__ */ jsx39("td", { className: "ui-table__num", children: cell }, tableHead[j + 1]))
+                  row.cells.map((cell, j) => /* @__PURE__ */ jsx41("td", { className: "ui-table__num", children: cell }, tableHead[j + 1]))
                 ] }, `${row.column.label}-${i}`)) })
               ] })
             }
@@ -4820,7 +5163,7 @@ function Chart(props) {
 // src/AccentPicker.tsx
 import { forwardRef as forwardRef10 } from "react";
 import { ACCENTS, accentSwatchStyle } from "@apliteni/apliteni-ui";
-import { jsx as jsx40 } from "react/jsx-runtime";
+import { jsx as jsx42 } from "react/jsx-runtime";
 var AccentPicker = forwardRef10(function AccentPicker2({
   value,
   onChange,
@@ -4829,7 +5172,7 @@ var AccentPicker = forwardRef10(function AccentPicker2({
   "aria-label": label = "Accent",
   ...rest
 }, ref) {
-  return /* @__PURE__ */ jsx40(
+  return /* @__PURE__ */ jsx42(
     "div",
     {
       ...rest,
@@ -4840,7 +5183,7 @@ var AccentPicker = forwardRef10(function AccentPicker2({
       "aria-label": label,
       children: options.map((accent) => {
         const title = accent.charAt(0).toUpperCase() + accent.slice(1);
-        return /* @__PURE__ */ jsx40(
+        return /* @__PURE__ */ jsx42(
           "button",
           {
             type: "button",
@@ -4859,9 +5202,9 @@ var AccentPicker = forwardRef10(function AccentPicker2({
 });
 
 // src/NavTabs.tsx
-import { Fragment as Fragment14, forwardRef as forwardRef11, useEffect as useEffect17, useRef as useRef22, useImperativeHandle as useImperativeHandle2 } from "react";
-import { safeUrl, observeNavFit, revealCurrentNav, revealFocusedNav } from "@apliteni/apliteni-ui";
-import { Fragment as Fragment15, jsx as jsx41, jsxs as jsxs35 } from "react/jsx-runtime";
+import { Fragment as Fragment17, forwardRef as forwardRef11, useEffect as useEffect18, useRef as useRef23, useImperativeHandle as useImperativeHandle2 } from "react";
+import { safeUrl as safeUrl3, observeNavFit, revealCurrentNav, revealFocusedNav } from "@apliteni/apliteni-ui";
+import { Fragment as Fragment18, jsx as jsx43, jsxs as jsxs37 } from "react/jsx-runtime";
 var NavTabs = forwardRef11(function NavTabs2({
   items,
   active,
@@ -4872,14 +5215,14 @@ var NavTabs = forwardRef11(function NavTabs2({
   "aria-label": ariaLabel = "Tabs",
   ...rest
 }, ref) {
-  const navRef = useRef22(null);
+  const navRef = useRef23(null);
   useImperativeHandle2(ref, () => navRef.current, []);
   const signature = items.map((item) => item.id).join("\0");
-  useEffect17(() => observeNavFit(navRef.current), []);
-  useEffect17(() => {
+  useEffect18(() => observeNavFit(navRef.current), []);
+  useEffect18(() => {
     if (navRef.current) revealCurrentNav(navRef.current);
   }, [active, signature]);
-  return /* @__PURE__ */ jsx41(
+  return /* @__PURE__ */ jsx43(
     "nav",
     {
       ...rest,
@@ -4892,20 +5235,20 @@ var NavTabs = forwardRef11(function NavTabs2({
       },
       children: items.map((item) => {
         const badge = item.badge != null && typeof item.badge === "object" ? item.badge : { text: item.badge, tone: void 0 };
-        const inner = /* @__PURE__ */ jsxs35(Fragment15, { children: [
-          /* @__PURE__ */ jsx41("span", { className: "ui-nav__tab-label", children: item.label }),
-          badge.text != null && badge.text !== "" && /* @__PURE__ */ jsx41("span", { className: `ui-nav__badge is-${badge.tone || "neutral"}`, children: badge.text })
+        const inner = /* @__PURE__ */ jsxs37(Fragment18, { children: [
+          /* @__PURE__ */ jsx43("span", { className: "ui-nav__tab-label", children: item.label }),
+          badge.text != null && badge.text !== "" && /* @__PURE__ */ jsx43("span", { className: `ui-nav__badge is-${badge.tone || "neutral"}`, children: badge.text })
         ] });
-        if (item.disabled) return /* @__PURE__ */ jsx41("span", { className: "ui-nav__tab is-disabled", "aria-disabled": "true", children: inner }, item.id);
+        if (item.disabled) return /* @__PURE__ */ jsx43("span", { className: "ui-nav__tab is-disabled", "aria-disabled": "true", children: inner }, item.id);
         const current = item.id === active;
         const linkProps = {
           className: ["ui-nav__tab", current && "is-active"].filter(Boolean).join(" "),
-          href: safeUrl(item.href || `#${item.id}`),
+          href: safeUrl3(item.href || `#${item.id}`),
           target: item.target,
           "aria-current": current ? "page" : void 0,
           children: inner
         };
-        return /* @__PURE__ */ jsx41(Fragment14, { children: renderLink ? renderLink(item, linkProps) : /* @__PURE__ */ jsx41("a", { ...linkProps }) }, item.id);
+        return /* @__PURE__ */ jsx43(Fragment17, { children: renderLink ? renderLink(item, linkProps) : /* @__PURE__ */ jsx43("a", { ...linkProps }) }, item.id);
       })
     }
   );
@@ -4913,8 +5256,8 @@ var NavTabs = forwardRef11(function NavTabs2({
 
 // src/Breadcrumbs.tsx
 import { forwardRef as forwardRef12 } from "react";
-import { icon as icon7, safeUrl as safeUrl2 } from "@apliteni/apliteni-ui";
-import { Fragment as Fragment16, jsx as jsx42, jsxs as jsxs36 } from "react/jsx-runtime";
+import { icon as icon7, safeUrl as safeUrl4 } from "@apliteni/apliteni-ui";
+import { Fragment as Fragment19, jsx as jsx44, jsxs as jsxs38 } from "react/jsx-runtime";
 var Breadcrumbs = forwardRef12(function Breadcrumbs2({
   items,
   renderLink,
@@ -4922,21 +5265,21 @@ var Breadcrumbs = forwardRef12(function Breadcrumbs2({
   "aria-label": ariaLabel = "Breadcrumb",
   ...rest
 }, ref) {
-  return /* @__PURE__ */ jsx42(
+  return /* @__PURE__ */ jsx44(
     "nav",
     {
       ...rest,
       ref,
       className: ["ui-nav", "ui-nav--crumbs", className].filter(Boolean).join(" "),
       "aria-label": ariaLabel,
-      children: /* @__PURE__ */ jsx42("ol", { className: "ui-nav__crumbs", children: items.map((item, index) => {
+      children: /* @__PURE__ */ jsx44("ol", { className: "ui-nav__crumbs", children: items.map((item, index) => {
         const current = index === items.length - 1;
-        const inner = /* @__PURE__ */ jsxs36(Fragment16, { children: [
-          item.icon && /* @__PURE__ */ jsx42("span", { className: "ui-nav__ic", dangerouslySetInnerHTML: { __html: icon7(item.icon) } }),
-          /* @__PURE__ */ jsx42("span", { className: "ui-nav__crumb-label", children: item.label })
+        const inner = /* @__PURE__ */ jsxs38(Fragment19, { children: [
+          item.icon && /* @__PURE__ */ jsx44("span", { className: "ui-nav__ic", dangerouslySetInnerHTML: { __html: icon7(item.icon) } }),
+          /* @__PURE__ */ jsx44("span", { className: "ui-nav__crumb-label", children: item.label })
         ] });
-        const linkProps = !current && item.href ? { className: "ui-nav__crumb", href: safeUrl2(item.href), target: item.target, children: inner } : null;
-        return /* @__PURE__ */ jsx42("li", { className: "ui-nav__crumb-item", children: linkProps ? renderLink ? renderLink(item, linkProps) : /* @__PURE__ */ jsx42("a", { ...linkProps }) : /* @__PURE__ */ jsx42(
+        const linkProps = !current && item.href ? { className: "ui-nav__crumb", href: safeUrl4(item.href), target: item.target, children: inner } : null;
+        return /* @__PURE__ */ jsx44("li", { className: "ui-nav__crumb-item", children: linkProps ? renderLink ? renderLink(item, linkProps) : /* @__PURE__ */ jsx44("a", { ...linkProps }) : /* @__PURE__ */ jsx44(
           "span",
           {
             className: ["ui-nav__crumb", current && "is-current"].filter(Boolean).join(" "),
@@ -4977,10 +5320,12 @@ export {
   DrawerSection,
   Dropdown,
   EmptyState,
+  Feedback,
   Field,
   FileDrop,
   FileField,
   FilterBar,
+  Footer,
   Icon,
   KeyValueList,
   Modal,