@apliteni/apliteni-ui 0.131.0 → 0.133.0

package/react/dist/index.js

@@ -219,8 +219,7 @@ var Button = forwardRef3(function Button2({
 // src/primitives/Badge.tsx
 import { jsx as jsx5 } from "react/jsx-runtime";
 function Badge({ variant = "neutral", children }) {
-  const cls = ["ui-badge", variant !== "neutral" && `ui-badge--${variant}`].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsx5("span", { className: cls, children });
+  return /* @__PURE__ */ jsx5("span", { className: `ui-badge ui-badge--${variant}`, children });
 }
 
 // src/primitives/Avatar.tsx
@@ -2115,6 +2114,10 @@ import {
   transitionMs as transitionMs2,
   dropdownViewportFit,
   dropdownHeightFit,
+  dropdownLift,
+  dropdownReveal,
+  dropdownRest,
+  dropdownSnap,
   filterPanelRow
 } from "@apliteni/apliteni-ui";
 
@@ -2199,6 +2202,7 @@ function Dropdown({
   const trigger = useRef11(null);
   const field = useRef11(null);
   const landOn = useRef11(null);
+  const revealed = useRef11(false);
   const at = useRef11("");
   const auto = useId8().replace(/:/g, "");
   const uid = id ?? auto;
@@ -2352,24 +2356,39 @@ function Dropdown({
     };
   }, [open]);
   useIsoLayoutEffect(() => {
-    if (!open) return;
     const el = panel.current;
-    if (!el) return;
+    if (!el || !root.current) return void 0;
+    return dropdownRest(root.current, el, open);
+  }, [open]);
+  useIsoLayoutEffect(() => {
+    const dd = root.current;
+    const el = panel.current;
+    if (!open || !el || !dd) return;
     const size = () => {
-      const avail = dropdownHeightFit(root.current, el);
+      const avail = dropdownHeightFit(dd, el);
       if (avail == null) return;
       if (Number.isFinite(avail)) el.style.setProperty("--ui-dropdown-avail", `${avail}px`);
       else el.style.removeProperty("--ui-dropdown-avail");
-      const cap2 = el.ownerDocument.defaultView?.getComputedStyle(el).getPropertyValue("--ui-dropdown-cap").trim();
-      el.classList.toggle("is-unbounded", !Number.isFinite(avail) && !cap2);
+      el.classList.toggle("is-unbounded", !Number.isFinite(avail));
+      dropdownSnap(dd, el);
     };
+    dropdownLift(dd, el);
     size();
+    revealed.current = dropdownReveal(dd, el) !== 0;
+    const follow = () => {
+      if (el.hasAttribute("data-dd-lifted")) dropdownLift(dd, el);
+    };
+    const resize = () => {
+      dropdownLift(dd, el);
+      size();
+      dropdownReveal(dd, el);
+    };
     const view = el.ownerDocument?.defaultView ?? window;
-    view.addEventListener("scroll", size, true);
-    view.addEventListener("resize", size);
+    view.addEventListener("scroll", follow, true);
+    view.addEventListener("resize", resize);
     return () => {
-      view.removeEventListener("scroll", size, true);
-      view.removeEventListener("resize", size);
+      view.removeEventListener("scroll", follow, true);
+      view.removeEventListener("resize", resize);
     };
   }, [open, direction]);
   useIsoLayoutEffect(() => {
@@ -2390,7 +2409,7 @@ function Dropdown({
         panel.current.style.minWidth = "";
         if (panel.current.offsetWidth) panel.current.style.minWidth = `${panel.current.offsetWidth}px`;
       }
-      field.current?.focus();
+      field.current?.focus(revealed.current ? { preventScroll: true } : void 0);
       return;
     }
     if (want == null) return;
@@ -2398,7 +2417,7 @@ function Dropdown({
     if (!els.length) return;
     const sel = els.findIndex((el) => el.getAttribute("aria-selected") === "true");
     const to = want === "selected" ? sel >= 0 ? sel : 0 : want;
-    (els[to] || els[0]).focus();
+    (els[to] || els[0]).focus(revealed.current ? { preventScroll: true } : void 0);
   }, [open]);
   useIsoLayoutEffect(() => {
     if (!sx || !open || !active) return;
@@ -2415,6 +2434,7 @@ function Dropdown({
     const el = panel.current;
     if (!el || el.closest(".ui-filter-bar")) return;
     const fit = () => {
+      if (el.hasAttribute("data-dd-lifted")) return;
       let got = dropdownViewportFit(el);
       if (!got) return;
       el.style.setProperty("--ui-dropdown-ceiling", got.max > 0 ? `${got.max}px` : "");
@@ -2522,6 +2542,7 @@ function Dropdown({
       e.preventDefault();
       const els = itemsIn(panel.current);
       els[els.length - 1]?.focus();
+      dropdownReveal(root.current, panel.current);
     } else if ((e.key === "Enter" || e.key === " ") && open && e.target.matches?.("[data-dd-item]")) {
       e.preventDefault();
       e.target.click();
@@ -3291,7 +3312,31 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
 
 // src/FileDrop.tsx
 import { useRef as useRef17, useState as useState12 } from "react";
-import { Fragment as Fragment10, jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
+
+// src/EmptyState.tsx
+import { icon as kitIcon2, illo } from "@apliteni/apliteni-ui";
+import { jsx as jsx31, jsxs as jsxs26 } 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" },
+  "not-found": { title: "We can't find that page", sub: "Check the address or return to the home page.", icon: "folder" },
+  "not-yet-built": { title: "This ships later", sub: "This screen is not available yet. Check back later.", icon: "clock" }
+};
+function EmptyState({ variant = "first-run", title, sub, icon: icon8, art, actions }) {
+  const preset = cases[variant];
+  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 })
+  ] });
+}
+
+// src/FileDrop.tsx
+import { Fragment as Fragment10, jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
 var MARKS = {
   uploading: "clock",
   done: "circleCheck",
@@ -3311,6 +3356,8 @@ var cx7 = (...a) => a.filter(Boolean).join(" ");
 function FileDrop({
   label = "Upload",
   note,
+  title,
+  multiple,
   accept,
   dropLabel = "Drop to upload",
   removeLabel = "Remove",
@@ -3319,6 +3366,7 @@ function FileDrop({
   dragging,
   disabled,
   onFile,
+  onFiles,
   onRemove,
   onRetry,
   children,
@@ -3334,118 +3382,155 @@ function FileDrop({
   const showSize = Boolean(file?.size) && status !== "error";
   const showTarget = (dragging ?? over) && !disabled;
   const take = (chosen) => {
-    if (chosen && !disabled) onFile?.(chosen);
+    if (!chosen.length || disabled) return;
+    onFile?.(chosen[0]);
+    onFiles?.(chosen);
   };
-  return /* @__PURE__ */ jsxs26(
+  const pick = () => {
+    if (!disabled) input.current?.click();
+  };
+  const picker = /* @__PURE__ */ jsx32(
+    "input",
+    {
+      ref: input,
+      type: "file",
+      accept,
+      multiple,
+      disabled,
+      hidden: true,
+      tabIndex: -1,
+      onClick: (event) => event.stopPropagation(),
+      onChange: (event) => {
+        take(Array.from(event.currentTarget.files ?? []));
+        event.currentTarget.value = "";
+      }
+    }
+  );
+  const drag = {
+    onDragOver: (event) => {
+      if (disabled || !carriesFiles(event)) return;
+      event.preventDefault();
+      setOver(true);
+    },
+    onDragLeave: (event) => {
+      if (!event.currentTarget.contains(event.relatedTarget)) setOver(false);
+    },
+    onDrop: (event) => {
+      if (disabled || !carriesFiles(event)) return;
+      event.preventDefault();
+      setOver(false);
+      take(Array.from(event.dataTransfer.files));
+    }
+  };
+  if (title !== void 0) return /* @__PURE__ */ jsxs27(
     "div",
     {
-      className: cx7("ui-drop", disabled && "is-disabled", className),
-      onDragOver: (event) => {
-        if (disabled || !carriesFiles(event)) return;
-        event.preventDefault();
-        setOver(true);
-      },
-      onDragLeave: (event) => {
-        if (!event.currentTarget.contains(event.relatedTarget)) setOver(false);
-      },
-      onDrop: (event) => {
-        if (disabled || !carriesFiles(event)) return;
-        event.preventDefault();
-        setOver(false);
-        take(event.dataTransfer.files[0]);
-      },
+      className: cx7("ui-drop", "ui-drop--area", showTarget && "is-dragging", disabled && "is-disabled", className),
+      onClick: pick,
+      ...drag,
       children: [
-        children,
-        /* @__PURE__ */ jsxs26("div", { className: "ui-drop__row", children: [
-          file ? /* @__PURE__ */ jsxs26("div", { className: cx7("ui-drop__file", status === "error" && "ui-drop__file--failed"), children: [
-            /* @__PURE__ */ jsxs26("div", { className: "ui-drop__line", children: [
-              /* @__PURE__ */ jsxs26("span", { className: "ui-drop__name", title: file.name, children: [
-                /* @__PURE__ */ jsx31("span", { className: "ui-drop__stem", children: stem }),
-                /* @__PURE__ */ jsx31("span", { className: "ui-drop__ext", children: ext })
-              ] }),
-              (onRemove || status === "error" && onRetry) && /* @__PURE__ */ jsxs26("span", { className: "ui-drop__actions", children: [
-                status === "error" && onRetry && /* @__PURE__ */ jsx31(Button, { size: "sm", icon: "refresh", onClick: onRetry, disabled, children: retryLabel }),
-                onRemove && /* @__PURE__ */ jsx31(
-                  Button,
-                  {
-                    variant: "ghost",
-                    size: "sm",
-                    onClick: onRemove,
-                    disabled,
-                    children: removeLabel
-                  }
-                )
-              ] })
-            ] }),
-            (showSize || showWord) && /* @__PURE__ */ jsxs26(
-              "div",
-              {
-                className: cx7("ui-drop__facts", status === "error" && "ui-drop__error"),
-                role: status === "error" ? "alert" : void 0,
-                children: [
-                  showSize && /* @__PURE__ */ jsx31("span", { className: "ui-drop__size", children: file.size }),
-                  showWord && /* @__PURE__ */ jsxs26("span", { className: "ui-drop__state", children: [
-                    /* @__PURE__ */ jsx31(Icon, { name: MARKS[status] }),
-                    /* @__PURE__ */ jsx31("span", { className: "ui-drop__word", title: word, children: word })
-                  ] })
-                ]
-              }
-            ),
-            hasBar && /* @__PURE__ */ jsx31(
-              "span",
-              {
-                className: "ui-drop__bar",
-                role: "progressbar",
-                "aria-label": `${word} ${file.name}`,
-                "aria-valuenow": file.progress,
-                "aria-valuemin": 0,
-                "aria-valuemax": 100,
-                children: /* @__PURE__ */ jsx31("span", { style: { width: `${file.progress}%` } })
-              }
-            )
-          ] }) : /* @__PURE__ */ jsxs26(Fragment10, { children: [
-            /* @__PURE__ */ jsx31(
+        /* @__PURE__ */ jsx32(
+          EmptyState,
+          {
+            icon: "upload",
+            title,
+            sub: note ?? "",
+            actions: /* @__PURE__ */ jsx32(
               Button,
               {
+                variant: "primary",
                 size: "sm",
                 icon: "upload",
                 disabled,
-                onClick: () => input.current?.click(),
+                onClick: (event) => {
+                  event.stopPropagation();
+                  pick();
+                },
                 children: label
               }
-            ),
-            note && /* @__PURE__ */ jsx31("p", { className: "ui-drop__note", children: note })
-          ] }),
-          /* @__PURE__ */ jsx31(
-            "input",
-            {
-              ref: input,
-              type: "file",
-              accept,
-              disabled,
-              hidden: true,
-              tabIndex: -1,
-              onChange: (event) => {
-                take(event.currentTarget.files?.[0]);
-                event.currentTarget.value = "";
-              }
-            }
-          )
-        ] }),
-        showTarget && /* @__PURE__ */ jsx31("div", { className: "ui-drop__target", "aria-hidden": "true", children: dropLabel })
+            )
+          }
+        ),
+        picker
       ]
     }
   );
+  return /* @__PURE__ */ jsxs27("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 })
+          ] }),
+          (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(
+              Button,
+              {
+                variant: "ghost",
+                size: "sm",
+                onClick: onRemove,
+                disabled,
+                children: removeLabel
+              }
+            )
+          ] })
+        ] }),
+        (showSize || showWord) && /* @__PURE__ */ jsxs27(
+          "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 })
+              ] })
+            ]
+          }
+        ),
+        hasBar && /* @__PURE__ */ jsx32(
+          "span",
+          {
+            className: "ui-drop__bar",
+            role: "progressbar",
+            "aria-label": `${word} ${file.name}`,
+            "aria-valuenow": file.progress,
+            "aria-valuemin": 0,
+            "aria-valuemax": 100,
+            children: /* @__PURE__ */ jsx32("span", { style: { width: `${file.progress}%` } })
+          }
+        )
+      ] }) : /* @__PURE__ */ jsxs27(Fragment10, { children: [
+        /* @__PURE__ */ jsx32(
+          Button,
+          {
+            size: "sm",
+            icon: "upload",
+            disabled,
+            onClick: pick,
+            children: label
+          }
+        ),
+        note && /* @__PURE__ */ jsx32("p", { className: "ui-drop__note", children: note })
+      ] }),
+      picker
+    ] }),
+    showTarget && /* @__PURE__ */ jsx32("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 jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
+import { jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
 var SearchField = forwardRef7(function SearchField2({ ariaLabel, className, ...props }, ref) {
-  return /* @__PURE__ */ jsxs27("div", { className: "ui-input-group", children: [
-    /* @__PURE__ */ jsx32("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon6("search") } }),
-    /* @__PURE__ */ jsx32(
+  return /* @__PURE__ */ jsxs28("div", { className: "ui-input-group", children: [
+    /* @__PURE__ */ jsx33("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon6("search") } }),
+    /* @__PURE__ */ jsx33(
       "input",
       {
         ref,
@@ -3461,7 +3546,7 @@ 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 jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
+import { jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
 var Context = createContext3(null);
 var glyphs = { success: "circleCheck", danger: "circleX", warn: "circleAlert", info: "info", neutral: "bolt" };
 function useToast() {
@@ -3509,7 +3594,7 @@ function Notice({ notice, remove }) {
       remaining.current = Math.max(0, remaining.current - (Date.now() - started));
     };
   }, [dismiss, leaving2, paused, timed]);
-  return /* @__PURE__ */ jsxs28(
+  return /* @__PURE__ */ jsxs29(
     "div",
     {
       ref: root,
@@ -3523,12 +3608,12 @@ function Notice({ notice, remove }) {
         if (!event.currentTarget.contains(event.relatedTarget)) setFocused(false);
       },
       children: [
-        /* @__PURE__ */ jsx33("span", { className: "ui-toast__icon", children: /* @__PURE__ */ jsx33(Icon, { name: glyphs[tone] }) }),
-        /* @__PURE__ */ jsxs28("div", { className: "ui-toast__body", children: [
-          /* @__PURE__ */ jsx33("div", { className: "ui-toast__title", children: notice.title }),
-          !notice.compact && notice.text && /* @__PURE__ */ jsx33("div", { className: "ui-toast__text", children: notice.text })
+        /* @__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 })
         ] }),
-        notice.action && /* @__PURE__ */ jsx33(
+        notice.action && /* @__PURE__ */ jsx34(
           "button",
           {
             type: "button",
@@ -3543,8 +3628,8 @@ function Notice({ notice, remove }) {
             children: notice.action.label
           }
         ),
-        notice.dismissible !== false && /* @__PURE__ */ jsx33("button", { type: "button", className: "ui-toast__close", "aria-label": "Dismiss", disabled: leaving2, onClick: dismiss, children: /* @__PURE__ */ jsx33(Icon, { name: "x" }) }),
-        timed && /* @__PURE__ */ jsx33(
+        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(
           "span",
           {
             className: "ui-toast__timer is-running",
@@ -3586,10 +3671,10 @@ function Toast({ children }) {
     setEntries((current) => [...current, { id, notice, remove }]);
   }, []);
   usePublishedReach(stack2, entries.length);
-  return /* @__PURE__ */ jsxs28(Context.Provider, { value: push, children: [
+  return /* @__PURE__ */ jsxs29(Context.Provider, { value: push, children: [
     children,
     typeof document !== "undefined" && createPortal4(
-      /* @__PURE__ */ jsx33("div", { className: "ui-toast-stack rx-toast-stack", ref: stack2, children: entries.map((entry) => /* @__PURE__ */ jsx33(Notice, { notice: entry.notice, remove: entry.remove }, entry.id)) }),
+      /* @__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)) }),
       document.body
     )
   ] });
@@ -3602,7 +3687,7 @@ 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 { ENTRANCE_FALLBACK_MS } from "@apliteni/apliteni-ui/motion";
-import { Fragment as Fragment11, jsx as jsx34, jsxs as jsxs29 } from "react/jsx-runtime";
+import { Fragment as Fragment11, jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
 var badgeText = (badge) => typeof badge === "object" ? badge.text : badge;
 function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
   const uid = useId11();
@@ -3628,15 +3713,15 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
     item.disabled && "is-disabled",
     item.danger && "is-danger"
   ].filter(Boolean).join(" ");
-  const children = /* @__PURE__ */ jsxs29(Fragment11, { children: [
-    (item.leading ?? item.icon) && /* @__PURE__ */ jsx34("span", { className: "ui-nav__ic", children: item.leading ?? /* @__PURE__ */ jsx34(Icon, { name: item.icon }) }),
-    /* @__PURE__ */ jsx34("span", { className: "ui-nav__label", children: item.label }),
-    count != null && count !== "" && /* @__PURE__ */ jsx34("span", { className: `ui-nav__badge is-${typeof item.badge === "object" ? item.badge.tone ?? "neutral" : "neutral"}`, children: count }),
-    group && /* @__PURE__ */ jsx34("span", { className: "ui-nav__caret", "aria-hidden": "true" })
+  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 common = { className, "aria-label": name, title: collapsed ? name : void 0, children };
-  if (group) return /* @__PURE__ */ jsxs29("li", { className: `ui-nav__group${open ? " is-open" : ""}`, children: [
-    /* @__PURE__ */ jsx34(
+  if (group) return /* @__PURE__ */ jsxs30("li", { className: `ui-nav__group${open ? " is-open" : ""}`, children: [
+    /* @__PURE__ */ jsx35(
       "button",
       {
         ...common,
@@ -3650,22 +3735,22 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
         }
       }
     ),
-    /* @__PURE__ */ jsx34("ul", { id: uid, className: `ui-nav__sub${entering ? " is-entering" : ""}`, hidden: !open, onAnimationEnd: () => setEntering(false), children: item.items.map((child) => /* @__PURE__ */ jsx34(Row, { item: child, active, activeIs, collapsed, renderLink, sub: true }, child.id)) })
+    /* @__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)) })
   ] });
-  if (item.disabled) return /* @__PURE__ */ jsx34("li", { children: /* @__PURE__ */ jsx34("span", { ...common, role: "link", "aria-disabled": "true" }) });
+  if (item.disabled) return /* @__PURE__ */ jsx35("li", { children: /* @__PURE__ */ jsx35("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__ */ jsx34("li", { children: renderLink ? renderLink(item, props) : /* @__PURE__ */ jsx34("a", { ...props }) });
+  return /* @__PURE__ */ jsx35("li", { children: renderLink ? renderLink(item, props) : /* @__PURE__ */ jsx35("a", { ...props }) });
 }
 function Section({ section, ...props }) {
   const uid = useId11();
-  return /* @__PURE__ */ jsxs29("div", { className: "ui-nav__section", children: [
-    section.label && /* @__PURE__ */ jsx34("div", { className: "ui-nav__cap", id: uid, "aria-hidden": props.collapsed || void 0, children: section.label }),
-    /* @__PURE__ */ jsx34("ul", { className: "ui-nav__list", "aria-labelledby": section.label ? uid : void 0, children: section.items.map((item) => /* @__PURE__ */ jsx34(Row, { item, ...props }, item.id)) })
+  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)) })
   ] });
 }
 var SidebarNav = forwardRef8(function SidebarNav2({
@@ -3680,8 +3765,8 @@ var SidebarNav = forwardRef8(function SidebarNav2({
   "aria-label": label = "Sidebar",
   ...rest
 }, ref) {
-  return /* @__PURE__ */ jsxs29("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__ */ jsx34(
+  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(
       Section,
       {
         section,
@@ -3692,14 +3777,14 @@ var SidebarNav = forwardRef8(function SidebarNav2({
       },
       index
     )),
-    footer && /* @__PURE__ */ jsx34("div", { className: "ui-nav__foot", children: footer })
+    footer && /* @__PURE__ */ jsx35("div", { className: "ui-nav__foot", children: footer })
   ] });
 });
 
 // src/ThemeToggle.tsx
 import { useSyncExternalStore } from "react";
 import { themeIcon } from "@apliteni/apliteni-ui";
-import { jsx as jsx35, jsxs as jsxs30 } from "react/jsx-runtime";
+import { jsx as jsx36, jsxs as jsxs31 } 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')})()`;
@@ -3757,10 +3842,10 @@ function ThemeToggle({ labelled = false }) {
     }
     window.dispatchEvent(new Event(CHOICE_EVENT));
   };
-  const button = /* @__PURE__ */ jsx35("button", { type: "button", className: "toggle", "aria-label": name, title: name, onClick: toggle, children: /* @__PURE__ */ jsx35("span", { className: "ic", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: themeIcon(theme) } }) });
-  return labelled ? /* @__PURE__ */ jsxs30("span", { className: "ui-theme-toggle", children: [
+  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: [
     button,
-    /* @__PURE__ */ jsxs30("span", { children: [
+    /* @__PURE__ */ jsxs31("span", { children: [
       label,
       " theme"
     ] })
@@ -3768,7 +3853,7 @@ function ThemeToggle({ labelled = false }) {
 }
 
 // src/AppShell.tsx
-import { Fragment as Fragment12, jsx as jsx36, jsxs as jsxs31 } from "react/jsx-runtime";
+import { Fragment as Fragment12, jsx as jsx37, jsxs as jsxs32 } from "react/jsx-runtime";
 var path = (value) => value.split(/[?#]/)[0].replace(/\/+$/, "") || "/";
 function AppShell({
   sections,
@@ -3833,7 +3918,7 @@ function AppShell({
     } catch {
     }
   };
-  const sidebar = (label) => /* @__PURE__ */ jsx36(
+  const sidebar = (label) => /* @__PURE__ */ jsx37(
     SidebarNav,
     {
       "aria-label": label,
@@ -3845,33 +3930,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__ */ jsx36("a", { ...linkProps });
+        return renderLink ? renderLink(section, linkProps) : /* @__PURE__ */ jsx37("a", { ...linkProps });
       }
     }
   );
   const foldLabel = collapsed ? "Expand sidebar" : "Collapse sidebar";
   const navigable = sections.length > 1 || Boolean(back);
-  const lockup = /* @__PURE__ */ jsxs31("a", { className: "ui-app__brand", href: brandHref, "aria-label": word, children: [
-    brand ?? /* @__PURE__ */ jsx36("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(uid, 24) } }),
-    /* @__PURE__ */ jsx36("span", { children: word })
+  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 })
   ] });
-  return /* @__PURE__ */ jsxs31("div", { className: `ui-app ui-app--topbar ui-react-app${collapsed ? " is-collapsed" : ""}`, children: [
-    navigable && /* @__PURE__ */ jsxs31("div", { className: "ui-app__rail", role: "region", "aria-label": "Sidebar", children: [
-      /* @__PURE__ */ jsx36("div", { className: "ui-app__head", children: lockup }),
+  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 }),
       sidebar("Sections"),
-      /* @__PURE__ */ jsx36("div", { className: "ui-app__foot", children: /* @__PURE__ */ jsx36("div", { className: "ui-app__fold-row", children: /* @__PURE__ */ jsxs31("button", { type: "button", className: "ui-nav__item ui-app__fold", "aria-expanded": !collapsed, "aria-label": foldLabel, onClick: fold, children: [
-        /* @__PURE__ */ jsx36("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsxs31("svg", { className: "ui-icon", viewBox: "0 0 24 24", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-          /* @__PURE__ */ jsx36("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
-          /* @__PURE__ */ jsx36("path", { className: "ui-app__fold-seam", d: "M9 3v18" }),
-          /* @__PURE__ */ jsx36("path", { className: "ui-app__fold-arrow", d: "m16 15-3-3 3-3" })
+      /* @__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__ */ jsx36("span", { className: "ui-nav__label", children: foldLabel })
+        /* @__PURE__ */ jsx37("span", { className: "ui-nav__label", children: foldLabel })
       ] }) }) })
     ] }),
-    /* @__PURE__ */ jsxs31("div", { className: "ui-app__well", children: [
-      /* @__PURE__ */ jsxs31("header", { className: "ui-app__bar", children: [
-        navigable && /* @__PURE__ */ jsxs31(Fragment12, { children: [
-          /* @__PURE__ */ jsx36(
+    /* @__PURE__ */ jsxs32("div", { className: "ui-app__well", children: [
+      /* @__PURE__ */ jsxs32("header", { className: "ui-app__bar", children: [
+        navigable && /* @__PURE__ */ jsxs32(Fragment12, { children: [
+          /* @__PURE__ */ jsx37(
             Button,
             {
               ref: menuButton,
@@ -3885,19 +3970,19 @@ function AppShell({
               onClick: () => setMenu(true)
             }
           ),
-          /* @__PURE__ */ jsx36("a", { className: "ui-app__brand ui-app__brand--band", href: brandHref, "aria-label": word, children: brand ?? /* @__PURE__ */ jsx36("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(`${uid}-band`, 24) } }) })
+          /* @__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) } }) })
         ] }),
         !navigable && lockup,
-        /* @__PURE__ */ jsxs31("button", { type: "button", className: "ui-app__search", "aria-haspopup": "dialog", onClick: () => setSearch(true), children: [
-          /* @__PURE__ */ jsx36("span", { className: "ui-app__search-ic", children: /* @__PURE__ */ jsx36(Icon, { name: "search" }) }),
-          /* @__PURE__ */ jsx36("span", { className: "ui-app__search-txt", children: searchLabel }),
-          /* @__PURE__ */ jsx36("span", { className: "ui-app__search-short", "aria-hidden": "true", children: searchShortLabel }),
-          /* @__PURE__ */ jsx36("kbd", { className: "ui-cmdk__key", children: paletteHotkey() })
+        /* @__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__ */ jsx36("span", { className: "ui-app__bar-gap" }),
-        bandControl && /* @__PURE__ */ jsx36("span", { className: "ui-react-app__band-control", children: bandControl }),
-        /* @__PURE__ */ jsx36(ThemeToggle, {}),
-        /* @__PURE__ */ jsx36("div", { className: "ui-app__user ui-app__user--bar", children: /* @__PURE__ */ jsx36(
+        /* @__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(
           Dropdown,
           {
             variant: "menu",
@@ -3906,48 +3991,26 @@ function AppShell({
             ariaLabel: `Signed in as ${account.name}, ${account.email}`,
             triggerClass: "ui-app__user-trigger",
             panelClass: "ui-app__user-panel",
-            triggerContent: /* @__PURE__ */ jsx36("span", { className: "ui-app__av", "aria-hidden": "true", children: /* @__PURE__ */ jsx36(Avatar, { personKey: account.email || account.name, name: account.name, size: 32 }) }),
-            header: /* @__PURE__ */ jsxs31("div", { className: "ui-dropdown__head", children: [
-              /* @__PURE__ */ jsx36("b", { children: account.name }),
-              /* @__PURE__ */ jsx36("span", { children: account.email })
+            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 })
             ] }),
             items: [{ label: "Sign out", icon: "logout", danger: true }],
             onSelect: onSignOut
           }
         ) })
       ] }),
-      /* @__PURE__ */ jsxs31("main", { className: `ui-app__main${width === "wide" ? " ui-app__main--wide" : ""}`, children: [
-        back && /* @__PURE__ */ jsx36(BackLink, { ...back }),
-        /* @__PURE__ */ jsx36("h1", { children: title }),
-        lede && /* @__PURE__ */ jsx36("p", { className: "ui-app__sub", children: lede }),
-        actions && /* @__PURE__ */ jsx36("div", { className: "ui-react-app__actions", children: actions }),
-        /* @__PURE__ */ jsx36("div", { className: "ui-app__body", children })
+      /* @__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 })
       ] })
     ] }),
-    navigable && /* @__PURE__ */ jsx36(Drawer, { open: menu, onClose: () => setMenu(false), title: word, side: "left", size: "sm", children: /* @__PURE__ */ jsx36("div", { className: "ui-react-app__menu", children: sidebar("Menu sections") }) }),
-    /* @__PURE__ */ jsx36(CommandPalette, { ...palette ?? { groups: [{ items: sections.map((section) => ({ id: section.href, ...section })) }] }, open: search, onClose: () => setSearch(false) })
-  ] });
-}
-
-// src/EmptyState.tsx
-import { icon as kitIcon2, illo } from "@apliteni/apliteni-ui";
-import { jsx as jsx37, jsxs as jsxs32 } 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" },
-  "not-found": { title: "We can't find that page", sub: "Check the address or return to the home page.", icon: "folder" },
-  "not-yet-built": { title: "This ships later", sub: "This screen is not available yet. Check back later.", icon: "clock" }
-};
-function EmptyState({ variant = "first-run", title, sub, icon: icon8, art, actions }) {
-  const preset = cases[variant];
-  const heading = title ?? preset.title;
-  const guidance = sub ?? preset.sub;
-  const glyph = icon8 ?? preset.icon;
-  return /* @__PURE__ */ jsxs32("div", { className: "ui-empty", children: [
-    art ? typeof art === "string" ? /* @__PURE__ */ jsx37("div", { className: "ui-empty__art", dangerouslySetInnerHTML: { __html: /<svg/.test(art) ? art : illo(art) } }) : /* @__PURE__ */ jsx37("div", { className: "ui-empty__art", "aria-hidden": "true", children: art }) : glyph ? /* @__PURE__ */ jsx37("div", { className: "ui-empty__icon", dangerouslySetInnerHTML: { __html: kitIcon2(glyph) } }) : null,
-    heading && /* @__PURE__ */ jsx37("div", { className: "ui-empty__title", children: heading }),
-    guidance && /* @__PURE__ */ jsx37("div", { className: "ui-empty__sub", children: guidance }),
-    actions && /* @__PURE__ */ jsx37("div", { className: "ui-empty__actions", children: actions })
+    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) })
   ] });
 }