@mt-gloss/ui 0.1.136 → 0.1.137

package/{COMMITS-B_qGBoy7.js → COMMITS-B7dc_-m8.js}

@@ -363,7 +363,7 @@ function be() {
 function Pe() {
   return W(V);
 }
-const De = K.number().min(7).max(90), xe = K.array(K.string().min(1)).max(3);
+const De = K.number().min(7).max(90), xe = K.array(K.string().min(1)).max(6);
 function Ne(e, n) {
   if (e === "timeframe") {
     const t = De.safeParse(n);

package/composites-panels.js

@@ -1,5 +1,5 @@
-import { u as D, g as J, h as z, f as we, S as Te, b as xe, j as Ee } from "./COMMITS-B_qGBoy7.js";
-import { C as Rt, N as Ft, n as zt, o as Ht, k as Bt, c as Yt, m as Vt, P as Ut, l as Kt, e as qt, i as Gt, r as Qt, d as Wt } from "./COMMITS-B_qGBoy7.js";
+import { u as D, g as J, h as z, f as we, S as Te, b as xe, j as Ee } from "./COMMITS-B7dc_-m8.js";
+import { C as Rt, N as Ft, n as zt, o as Ht, k as Bt, c as Yt, m as Vt, P as Ut, l as Kt, e as qt, i as Gt, r as Qt, d as Wt } from "./COMMITS-B7dc_-m8.js";
 import { jsx as a, jsxs as y, Fragment as pe } from "react/jsx-runtime";
 import B, { useState as x, useRef as U, createContext as me, useContext as he, useMemo as re, useEffect as F, useCallback as L, useLayoutEffect as Ae } from "react";
 import { useSensors as De, useSensor as oe, PointerSensor as ke, KeyboardSensor as Le, DndContext as Me, closestCenter as Oe } from "@dnd-kit/core";
@@ -13,8 +13,8 @@ function St() {
   return t?.kind === "card-overflow" ? t.cardId : null;
 }
 function fe({ span: e, rotating: t = !0, children: s }) {
-  const l = ["clone-card", `span-${e}`, t ? "rotating" : ""].filter(Boolean).join(" "), n = s != null ? "full" : "fallback";
-  return /* @__PURE__ */ a("div", { className: l, "data-clone-fidelity": n, children: s });
+  const o = ["clone-card", `span-${e}`, t ? "rotating" : ""].filter(Boolean).join(" "), n = s != null ? "full" : "fallback";
+  return /* @__PURE__ */ a("div", { className: o, "data-clone-fidelity": n, children: s });
 }
 function Pt({ primary: e, secondary: t }) {
   return /* @__PURE__ */ y("div", { className: "gloss-panel-chrome-v2__footer-msg", children: [
@@ -54,8 +54,8 @@ function Ye({
   onActivate: t,
   disabled: s
 }) {
-  const l = "settings-shell__slot-pill settings-shell__slot-pill--ghost" + (s ? " settings-shell__slot-pill--ghost-disabled" : "");
-  return /* @__PURE__ */ a("li", { className: l, "data-ghost": "true", children: /* @__PURE__ */ a(
+  const o = "settings-shell__slot-pill settings-shell__slot-pill--ghost" + (s ? " settings-shell__slot-pill--ghost-disabled" : "");
+  return /* @__PURE__ */ a("li", { className: o, "data-ghost": "true", children: /* @__PURE__ */ a(
     "button",
     {
       type: "button",
@@ -72,7 +72,7 @@ function Ve({
   onRemove: t,
   removeDisabled: s
 }) {
-  const { attributes: l, listeners: n, setNodeRef: c, transform: p, transition: r, isDragging: i } = ze({ id: e }), o = {
+  const { attributes: o, listeners: n, setNodeRef: c, transform: p, transition: r, isDragging: i } = ze({ id: e }), l = {
     transform: He.Transform.toString(p),
     transition: r,
     opacity: i ? 0.6 : 1
@@ -81,7 +81,7 @@ function Ve({
     "li",
     {
       ref: c,
-      style: o,
+      style: l,
       className: `settings-shell__slot-pill${i ? " settings-shell__slot-pill--dragging" : ""}`,
       children: [
         /* @__PURE__ */ a(
@@ -90,7 +90,7 @@ function Ve({
             type: "button",
             className: "settings-shell__slot-pill__handle",
             "aria-label": `Reorder ${e}`,
-            ...l,
+            ...o,
             ...n,
             children: /* @__PURE__ */ a("span", { "aria-hidden": "true", className: "settings-shell__slot-pill__grip", children: "⋮⋮" })
           }
@@ -116,7 +116,7 @@ function Ue({
   onChange: t,
   naturalSlots: s
 }) {
-  const l = De(
+  const o = De(
     oe(ke, { activationConstraint: { distance: 4 } }),
     oe(Le, { coordinateGetter: Ie })
   ), n = (d) => {
@@ -129,11 +129,11 @@ function Ue({
   }, r = B.useMemo(() => new Set(e), [e]), i = B.useMemo(
     () => (s ?? []).filter((d) => !r.has(d)),
     [s, r]
-  ), o = e.length >= 3, u = (d) => {
-    o || t([...e, d]);
+  ), l = !1, u = (d) => {
+    t([...e, d]);
   };
   return /* @__PURE__ */ y("div", { className: "settings-shell__field settings-shell__field--slots", "aria-label": "Stack slots", children: [
-    /* @__PURE__ */ a(Me, { sensors: l, collisionDetection: Oe, onDragEnd: n, children: /* @__PURE__ */ a($e, { items: [...e], strategy: Re, children: /* @__PURE__ */ y("ul", { className: "settings-shell__slots-list", role: "list", children: [
+    /* @__PURE__ */ a(Me, { sensors: o, collisionDetection: Oe, onDragEnd: n, children: /* @__PURE__ */ a($e, { items: [...e], strategy: Re, children: /* @__PURE__ */ y("ul", { className: "settings-shell__slots-list", role: "list", children: [
       e.map((d) => /* @__PURE__ */ a(
         Ve,
         {
@@ -148,7 +148,7 @@ function Ue({
         {
           id: d,
           onActivate: () => u(d),
-          disabled: o
+          disabled: l
         },
         `ghost:${d}`
       ))
@@ -161,30 +161,30 @@ function wt({
   isOpen: e,
   cardSpan: t,
   cardLabel: s = "Metric",
-  cardValue: l = "—",
+  cardValue: o = "—",
   previewSlot: n,
   dimensions: c = qe,
   initialTab: p,
   initialValues: r,
   naturalSlots: i
 }) {
-  const o = D(), u = o?.state.activeTrigger, d = u?.kind === "card-overflow" ? u.cardId : null, h = J(), g = u?.span, m = t ?? g ?? 1, _ = c[0] ?? "timeframe", [v, N] = B.useState(p ?? _);
+  const l = D(), u = l?.state.activeTrigger, d = u?.kind === "card-overflow" ? u.cardId : null, h = J(), g = u?.span, m = t ?? g ?? 1, _ = c[0] ?? "timeframe", [v, N] = B.useState(p ?? _);
   B.useEffect(() => {
     c.includes(v) || N(_);
   }, [c, v, _]);
-  const C = d != null ? o?.state?.bufferByCard?.[d]?.changes ?? {} : {}, O = typeof C.timeframe == "number" ? C.timeframe : typeof r?.timeframe == "number" ? r.timeframe : 30, I = Array.isArray(C.slots) ? C.slots : Array.isArray(r?.slots) ? r.slots : Ke, $ = (R) => {
-    d == null || o == null || o.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "timeframe", value: Number(R.target.value) });
+  const C = d != null ? l?.state?.bufferByCard?.[d]?.changes ?? {} : {}, O = typeof C.timeframe == "number" ? C.timeframe : typeof r?.timeframe == "number" ? r.timeframe : 30, I = Array.isArray(C.slots) ? C.slots : Array.isArray(r?.slots) ? r.slots : Ke, $ = (R) => {
+    d == null || l == null || l.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "timeframe", value: Number(R.target.value) });
   }, S = (R) => {
-    d == null || o == null || o.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "slots", value: R });
-  }, E = o?.state.isDirty ?? !1, H = d;
+    d == null || l == null || l.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "slots", value: R });
+  }, E = l?.state.isDirty ?? !1, H = d;
   return /* @__PURE__ */ a(
     z,
     {
       variant: "with-stage",
-      onClose: () => o?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }),
+      onClose: () => l?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }),
       stage: /* @__PURE__ */ a(fe, { span: m, rotating: !h, children: n ?? /* @__PURE__ */ y(pe, { children: [
         /* @__PURE__ */ a("div", { style: { fontSize: 9, textTransform: "uppercase", letterSpacing: "0.06em", color: "#9ca3af", marginBottom: 6 }, children: s }),
-        /* @__PURE__ */ a("div", { style: { fontSize: 22, fontWeight: 700, color: "#111827", lineHeight: 1 }, children: l })
+        /* @__PURE__ */ a("div", { style: { fontSize: 22, fontWeight: 700, color: "#111827", lineHeight: 1 }, children: o })
       ] }) }),
       navigation: /* @__PURE__ */ a(
         we,
@@ -204,7 +204,7 @@ function wt({
             className: "gloss-panel-chrome-v2__footer-btn",
             disabled: !E,
             onClick: () => {
-              H != null && o?.dispatch({ type: "CLEAR_BUFFER", cardId: H });
+              H != null && l?.dispatch({ type: "CLEAR_BUFFER", cardId: H });
             },
             children: "Reset"
           }
@@ -216,7 +216,7 @@ function wt({
             type: "button",
             className: "gloss-panel-chrome-v2__footer-btn gloss-panel-chrome-v2__footer-btn--primary",
             disabled: !E,
-            onClick: () => o?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }),
+            onClick: () => l?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }),
             children: "Apply"
           }
         )
@@ -242,7 +242,7 @@ function Ge({
   isOpen: e,
   cardSpan: t,
   previewSlot: s,
-  metricInfo: l
+  metricInfo: o
 }) {
   const n = D(), c = n?.state.activeTrigger, p = J(), r = c?.span;
   return /* @__PURE__ */ a(
@@ -258,8 +258,8 @@ function Ge({
           "data-shell": "metric-info",
           "aria-hidden": !e,
           children: [
-            /* @__PURE__ */ a("h2", { className: "metric-info-shell__title", children: l.title }),
-            /* @__PURE__ */ a("p", { className: "metric-info-shell__description", children: l.description })
+            /* @__PURE__ */ a("h2", { className: "metric-info-shell__title", children: o.title }),
+            /* @__PURE__ */ a("p", { className: "metric-info-shell__description", children: o.description })
           ]
         }
       )
@@ -588,10 +588,10 @@ function Ce({
   lenses: e,
   activeLens: t,
   onLensChange: s,
-  variant: l = "pills",
+  variant: o = "pills",
   lensMeta: n = be
 }) {
-  return l === "pills" ? /* @__PURE__ */ a("div", { className: "cat-pills-wrap", children: /* @__PURE__ */ a("div", { className: "cat-pills", role: "tablist", "aria-label": "Metric lenses", children: e.map((c) => {
+  return o === "pills" ? /* @__PURE__ */ a("div", { className: "cat-pills-wrap", children: /* @__PURE__ */ a("div", { className: "cat-pills", role: "tablist", "aria-label": "Metric lenses", children: e.map((c) => {
     const p = c === t, r = n[c], i = ["cat-pill"];
     return p && i.push("active"), /* @__PURE__ */ y(
       "button",
@@ -618,11 +618,11 @@ function Qe({
   activeLens: t,
   onLensChange: s
 }) {
-  const [l, n] = x(!1), c = U(null), p = () => {
+  const [o, n] = x(!1), c = U(null), p = () => {
     c.current != null && (window.clearTimeout(c.current), c.current = null);
   }, r = () => {
     p(), c.current = window.setTimeout(() => n(!1), 100);
-  }, i = e.filter((o) => o !== t);
+  }, i = e.filter((l) => l !== t);
   return /* @__PURE__ */ a("div", { className: "cat-segmented-wrap", children: /* @__PURE__ */ y("div", { className: "cat-segmented", children: [
     /* @__PURE__ */ a(
       "button",
@@ -643,26 +643,26 @@ function Qe({
         },
         onMouseLeave: r,
         children: [
-          /* @__PURE__ */ a("button", { type: "button", className: "cat-seg cat-seg-more-btn", "aria-haspopup": "menu", "aria-expanded": l, children: "More ▾" }),
-          l && /* @__PURE__ */ a(
+          /* @__PURE__ */ a("button", { type: "button", className: "cat-seg cat-seg-more-btn", "aria-haspopup": "menu", "aria-expanded": o, children: "More ▾" }),
+          o && /* @__PURE__ */ a(
             "div",
             {
               className: "cat-seg-overflow",
               role: "menu",
               onMouseEnter: p,
               onMouseLeave: r,
-              children: i.map((o) => /* @__PURE__ */ a(
+              children: i.map((l) => /* @__PURE__ */ a(
                 "button",
                 {
                   type: "button",
-                  "data-lens": o,
+                  "data-lens": l,
                   role: "menuitem",
                   onClick: () => {
-                    s(o), n(!1);
+                    s(l), n(!1);
                   },
-                  children: o
+                  children: l
                 },
-                o
+                l
               ))
             }
           )
@@ -671,14 +671,14 @@ function Qe({
     )
   ] }) });
 }
-function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: l }) {
+function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: o }) {
   return /* @__PURE__ */ a("div", { className: "cat-tiles", children: e.map((n) => {
     const c = n.id === t, p = n.subStats != null && n.subStats.length > 0;
     let r = null;
     p ? n.subStats.length === 5 ? r = "span-5" : n.subStats.length === 3 ? r = "span-3" : r = "span-2" : n.stack === !0 && (r = "span-2");
     const i = ["cat-tile"];
     r && i.push(r), c && i.push("selected"), n.isNew && i.push("is-new"), n.startHere && i.push("start-here"), n.donut && i.push("has-donut");
-    const o = 1;
+    const l = 1;
     let u = 0.7;
     if (n.donut) {
       const d = /([\d.]+)\s*%/.exec(n.value);
@@ -694,7 +694,7 @@ function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: l }) {
         className: i.join(" "),
         "data-metric": n.id,
         "data-desc": n.desc,
-        "data-col-span": String(o),
+        "data-col-span": String(l),
         "data-donut": n.donut ? "true" : void 0,
         "data-accent": n.accent,
         "aria-pressed": c,
@@ -702,7 +702,7 @@ function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: l }) {
         style: n.accent ? { "--cat-tile-accent": n.accent } : void 0,
         children: [
           n.startHere && /* @__PURE__ */ a("span", { className: "cat-tile-start-here", "aria-hidden": "true", children: "START HERE" }),
-          l ? l(n) : /* @__PURE__ */ a(
+          o ? o(n) : /* @__PURE__ */ a(
             "div",
             {
               className: "cat-tile-primitive-wrapper gloss-metric-card",
@@ -718,7 +718,7 @@ function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: l }) {
                   donutValue: u,
                   donutMax: 1,
                   accentColor: n.accent,
-                  colSpan: o
+                  colSpan: l
                 }
               ) : /* @__PURE__ */ a(
                 le,
@@ -726,7 +726,7 @@ function Z({ tiles: e, selectedTileId: t, onSelectTile: s, renderTile: l }) {
                   variant: "standard",
                   label: n.label,
                   value: n.value,
-                  colSpan: o
+                  colSpan: l
                 }
               )
             }
@@ -746,7 +746,7 @@ function te() {
 function Tt({ mode: e, dispatch: t }) {
   const s = te();
   if (s == null && e == null) return null;
-  const l = s?.mode ?? e ?? "add", n = s?.selectedTileId ?? null, c = s?.description ?? null, p = n == null;
+  const o = s?.mode ?? e ?? "add", n = s?.selectedTileId ?? null, c = s?.description ?? null, p = n == null;
   return /* @__PURE__ */ y("div", { className: "panel-footer catalog", children: [
     /* @__PURE__ */ a("div", { className: "cat-description", id: "cat-desc", children: c ?? /* @__PURE__ */ a("em", { children: "Tap a metric to see its description" }) }),
     /* @__PURE__ */ y("div", { style: { display: "flex", padding: "10px 14px", gap: 8 }, children: [
@@ -761,7 +761,7 @@ function Tt({ mode: e, dispatch: t }) {
           children: "Cancel"
         }
       ),
-      l === "add" && /* @__PURE__ */ a(
+      o === "add" && /* @__PURE__ */ a(
         "button",
         {
           id: "btn-cat-add",
@@ -772,7 +772,7 @@ function Tt({ mode: e, dispatch: t }) {
           children: "Add metric"
         }
       ),
-      l === "replace" && /* @__PURE__ */ a(
+      o === "replace" && /* @__PURE__ */ a(
         "button",
         {
           id: "btn-cat-replace",
@@ -791,8 +791,8 @@ function ie(e, t) {
   const s = t.toLowerCase();
   if (e.label.toLowerCase().includes(s) || e.value.toLowerCase().includes(s)) return !0;
   if (e.subStats) {
-    for (const l of e.subStats)
-      if (l.label.toLowerCase().includes(s) || l.value.toLowerCase().includes(s)) return !0;
+    for (const o of e.subStats)
+      if (o.label.toLowerCase().includes(s) || o.value.toLowerCase().includes(s)) return !0;
   }
   return !1;
 }
@@ -804,12 +804,12 @@ function xt({
   isOpen: e,
   lenses: t = ge,
   defaultLens: s = ye,
-  tilesByLens: l = ve,
+  tilesByLens: o = ve,
   lensMeta: n = be,
   renderTile: c,
   onAdd: p
 }) {
-  const r = D(), [i, o] = x(s), [u, d] = x(null), [h, g] = x(null), [m, _] = x(""), v = l[i] ?? { primary: [] }, N = n[i], w = re(
+  const r = D(), [i, l] = x(s), [u, d] = x(null), [h, g] = x(null), [m, _] = x(""), v = o[i] ?? { primary: [] }, N = n[i], w = re(
     () => v.primary.filter((S) => ie(S, m)),
     [v.primary, m]
   ), C = re(
@@ -862,7 +862,7 @@ function xt({
                 lensMeta: n,
                 variant: "pills",
                 onLensChange: (S) => {
-                  o(S), d(null), g(null), _("");
+                  l(S), d(null), g(null), _("");
                 }
               }
             ),
@@ -914,15 +914,15 @@ function Et({
   isOpen: e,
   replacingLabel: t,
   lenses: s = ge,
-  defaultLens: l = ye,
+  defaultLens: o = ye,
   tilesByLens: n = ve,
   renderTile: c
 }) {
-  const p = D(), [r, i] = x(l), [o, u] = x(null), [d, h] = x(null), g = n[r] ?? { primary: [] }, m = [...g.primary, ...g.secondary ?? []], _ = () => p?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }), v = () => p?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), N = o == null;
+  const p = D(), [r, i] = x(o), [l, u] = x(null), [d, h] = x(null), g = n[r] ?? { primary: [] }, m = [...g.primary, ...g.secondary ?? []], _ = () => p?.dispatch({ type: "CLOSE_PANEL", reason: "apply-button" }), v = () => p?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }), N = l == null;
   return /* @__PURE__ */ a(
     ee.Provider,
     {
-      value: { mode: "replace", selectedTileId: o, description: d },
+      value: { mode: "replace", selectedTileId: l, description: d },
       children: /* @__PURE__ */ a(
         z,
         {
@@ -962,7 +962,7 @@ function Et({
               Z,
               {
                 tiles: m,
-                selectedTileId: o,
+                selectedTileId: l,
                 onSelectTile: (w, C) => {
                   u(w), h(C);
                 },
@@ -980,7 +980,7 @@ function Ne() {
   return he(_e);
 }
 function Ze(e = {}) {
-  const t = Ne(), s = t?.createPage, l = t?.setPages;
+  const t = Ne(), s = t?.createPage, o = t?.setPages;
   return /* @__PURE__ */ y(
     "div",
     {
@@ -999,7 +999,7 @@ function Ze(e = {}) {
                 s();
                 return;
               }
-              l && l((n) => [
+              o && o((n) => [
                 ...n,
                 { id: `new-${Date.now()}`, name: "Untitled", active: !1 }
               ]);
@@ -1011,7 +1011,7 @@ function Ze(e = {}) {
     }
   );
 }
-function ce({ page: e, onRename: t, onKebab: s, onDragStart: l, onSwitchPage: n }) {
+function ce({ page: e, onRename: t, onKebab: s, onDragStart: o, onSwitchPage: n }) {
   const c = Ne(), [p, r] = x(!1), i = U(null);
   F(() => {
     if (!p) return;
@@ -1020,7 +1020,7 @@ function ce({ page: e, onRename: t, onKebab: s, onDragStart: l, onSwitchPage: n
     };
     return document.addEventListener("mousedown", m, !0), () => document.removeEventListener("mousedown", m, !0);
   }, [p]);
-  const o = () => {
+  const l = () => {
     if (r(!1), t) return t(e.id);
     if (!c?.renamePage) return;
     const m = window.prompt("Rename page", e.name);
@@ -1038,7 +1038,7 @@ function ce({ page: e, onRename: t, onKebab: s, onDragStart: l, onSwitchPage: n
       {
         className: "pm-handle",
         "aria-hidden": "true",
-        onMouseDown: () => l?.(e.id),
+        onMouseDown: () => o?.(e.id),
         children: "⋮⋮"
       }
     ),
@@ -1082,7 +1082,7 @@ function ce({ page: e, onRename: t, onKebab: s, onDragStart: l, onSwitchPage: n
         onPointerDown: (m) => m.stopPropagation(),
         onMouseDown: (m) => m.stopPropagation(),
         children: [
-          /* @__PURE__ */ a("button", { type: "button", role: "menuitem", className: "pm-kebab-menu__item", onClick: o, children: "Rename" }),
+          /* @__PURE__ */ a("button", { type: "button", role: "menuitem", className: "pm-kebab-menu__item", onClick: l, children: "Rename" }),
           /* @__PURE__ */ a("button", { type: "button", role: "menuitem", className: "pm-kebab-menu__item", onClick: u, children: "Duplicate" }),
           /* @__PURE__ */ a(
             "button",
@@ -1109,13 +1109,13 @@ function At({
   isOpen: e,
   pages: t = Xe,
   externalPages: s,
-  activePageId: l,
+  activePageId: o,
   onRename: n,
   onDuplicate: c,
   onDelete: p,
   onReorder: r,
   onCreatePage: i,
-  onSwitchPage: o
+  onSwitchPage: l
 }) {
   const u = D(), [d, h] = x(() => [...t]), g = L((f, P) => {
     h((T) => T.map((A) => A.id === f ? { ...A, name: P } : A));
@@ -1137,7 +1137,7 @@ function At({
       const T = new Map(P.map((k) => [k.id, k])), A = f.map((k) => T.get(k)).filter(Boolean);
       return A.length === P.length ? A : P;
     });
-  }, []), N = s != null, w = N ? s : d, C = l != null ? w.map((f) => ({ ...f, active: f.id === l })) : [...w], O = n ?? (N ? void 0 : g), I = c ?? (N ? void 0 : m), $ = p ?? (N ? void 0 : _), S = r ?? (N ? void 0 : v), E = L(
+  }, []), N = s != null, w = N ? s : d, C = o != null ? w.map((f) => ({ ...f, active: f.id === o })) : [...w], O = n ?? (N ? void 0 : g), I = c ?? (N ? void 0 : m), $ = p ?? (N ? void 0 : _), S = r ?? (N ? void 0 : v), E = L(
     (f) => {
       N || h(f);
     },
@@ -1163,7 +1163,7 @@ function At({
         ce,
         {
           page: f,
-          onSwitchPage: o
+          onSwitchPage: l
         },
         f.id
       )
@@ -1173,7 +1173,7 @@ function At({
     ce,
     {
       page: f,
-      onSwitchPage: o
+      onSwitchPage: l
     },
     f.id
   )) }), R = () => u?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" });
@@ -1231,15 +1231,15 @@ function kt() {
     }
     return document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n);
   }, [e.activePanelId, t]);
-  const l = U(e);
+  const o = U(e);
   return Ae(() => {
-    l.current = e;
+    o.current = e;
   }), F(() => {
     if (process.env.NODE_ENV === "production") return;
     const n = window;
     return n.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), n.__panelsHostHandle = {
       dispatch: t,
-      getState: () => l.current,
+      getState: () => o.current,
       getCloseLog: s
     }, () => {
       n.__panelsHostHandle?.dispatch === t && delete window.__panelsHostHandle;
@@ -1254,27 +1254,27 @@ function kt() {
 }
 const tt = 700;
 function nt(e, t) {
-  const [s, l] = x(null), n = U(null);
+  const [s, o] = x(null), n = U(null);
   return F(() => {
     if (e != null) {
-      n.current != null && (clearTimeout(n.current), n.current = null), l(null);
+      n.current != null && (clearTimeout(n.current), n.current = null), o(null);
       return;
     }
     if (t) {
-      n.current != null && (clearTimeout(n.current), n.current = null), l(null);
+      n.current != null && (clearTimeout(n.current), n.current = null), o(null);
       return;
     }
     return n.current = setTimeout(() => {
-      l(null), n.current = null;
+      o(null), n.current = null;
     }, tt), () => {
       n.current != null && (clearTimeout(n.current), n.current = null);
     };
   }, [e, t]), F(() => {
-    e != null && l(e);
+    e != null && o(e);
   }, [e]), e != null ? { panelId: e, isOpen: !0 } : s != null ? { panelId: s, isOpen: !1 } : { panelId: null, isOpen: !1 };
 }
 function Lt({ panelComponents: e, children: t }) {
-  const s = D(), l = s?.state.lastClose?.reason === "section-hidden", n = nt(s?.state.activePanelId ?? null, l);
+  const s = D(), o = s?.state.lastClose?.reason === "section-hidden", n = nt(s?.state.activePanelId ?? null, o);
   if (s == null || n.panelId == null) return null;
   const c = n.panelId, p = n.isOpen, r = e?.[c];
   return r == null && t == null ? (process.env.NODE_ENV !== "production" && console.error(
@@ -1290,8 +1290,8 @@ function Se(e, t) {
   if (typeof window > "u") return t;
   const s = window.getComputedStyle(document.documentElement).getPropertyValue(e).trim();
   if (!s) return t;
-  const l = parseFloat(s);
-  return Number.isNaN(l) ? t : s.endsWith("s") && !s.endsWith("ms") ? l * 1e3 : l;
+  const o = parseFloat(s);
+  return Number.isNaN(o) ? t : s.endsWith("s") && !s.endsWith("ms") ? o * 1e3 : o;
 }
 function ot(e, t) {
   return typeof window > "u" ? t : window.getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
@@ -1300,12 +1300,12 @@ function Y(e) {
   e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
 }
 function lt(e) {
-  const { mountEl: t, chromeEl: s, reducedMotion: l, onAssert: n } = e;
+  const { mountEl: t, chromeEl: s, reducedMotion: o, onAssert: n } = e;
   if (t == null || s == null) {
     Y(e), n?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
     return;
   }
-  if (l) {
+  if (o) {
     e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), n?.({ branch: "slide-reduced-motion", timestamp: Date.now() });
     return;
   }
@@ -1333,14 +1333,14 @@ function it(e) {
     e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => Y(e), ue), s?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
     return;
   }
-  const l = Se("--panel-close-dur", ue);
+  const o = Se("--panel-close-dur", ue);
   let n = !1, c = null;
   const p = (i) => {
     i.target !== t || i.propertyName !== "max-height" || n || (n = !0, c != null && clearTimeout(c), t.removeEventListener("transitionend", p), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), s?.({ branch: "handoff-complete", timestamp: Date.now() }));
   }, r = () => {
     n || (n = !0, t.removeEventListener("transitionend", p), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), s?.({ branch: "handoff-forced", timestamp: Date.now() }));
   };
-  t.addEventListener("transitionend", p), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), c = setTimeout(r, l + rt);
+  t.addEventListener("transitionend", p), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), c = setTimeout(r, o + rt);
 }
 function ct(e) {
   const { state: t, onAssert: s } = e;
@@ -1348,8 +1348,8 @@ function ct(e) {
     e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), s?.({ branch: "blocked-dirty", timestamp: Date.now() });
     return;
   }
-  const l = de(t.activeTrigger), n = de(e.trigger);
-  if (!!t.activePanelId && l != null && l === n) {
+  const o = de(t.activeTrigger), n = de(e.trigger);
+  if (!!t.activePanelId && o != null && o === n) {
     lt(e);
     return;
   }
@@ -1366,12 +1366,12 @@ function dt() {
 function Mt() {
   const e = D(), t = J();
   return L(
-    (s, l) => {
+    (s, o) => {
       if (!e)
         return;
       const n = typeof document < "u" ? document.querySelector('[data-mount="panel"]') : null, c = typeof document < "u" ? document.querySelector('[data-chrome="panel"]') : null, p = {
         panelId: s,
-        trigger: l,
+        trigger: o,
         state: e.state,
         dispatch: e.dispatch,
         mountEl: n,
@@ -1394,9 +1394,9 @@ function X() {
   const e = [];
   let t = "cleaned";
   document.querySelectorAll("#panel-chrome-frozen").length > 0 && (e.push("#panel-chrome-frozen"), t = "lingering");
-  const l = document.querySelectorAll(".gloss-panel-mount");
-  l.length > 1 && e.push(`mount-count=${l.length}`);
-  const n = l[0] ?? null, c = n ? n.querySelectorAll(".gloss-panel-chrome") : [];
+  const o = document.querySelectorAll(".gloss-panel-mount");
+  o.length > 1 && e.push(`mount-count=${o.length}`);
+  const n = o[0] ?? null, c = n ? n.querySelectorAll(".gloss-panel-chrome") : [];
   c.length > 1 && e.push(`chrome-count=${c.length}`);
   const p = c[0] ?? null;
   if (p) {
@@ -1414,25 +1414,25 @@ function X() {
   };
 }
 const G = "8px 8px 0px", Q = "64px", W = "inset(0px 0px 60px 0px)", j = "inset(0px -40px -40px -40px)";
-function b(e, t, s, l, n) {
-  return { id: e, constraint: t, expected: s, actual: l, pass: n };
+function b(e, t, s, o, n) {
+  return { id: e, constraint: t, expected: s, actual: o, pass: n };
 }
 function M(e) {
   const t = parseInt(e, 10);
   return Number.isFinite(t) ? t : NaN;
 }
 function ne() {
-  const e = [], t = document.querySelector(".gloss-panel-mount"), s = t?.querySelector(".gloss-panel-chrome") ?? null, l = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), n = document.querySelector(".bell-cutout"), c = document.querySelector(".bell-popover"), p = document.querySelector(".gloss-bottom-toolbar");
+  const e = [], t = document.querySelector(".gloss-panel-mount"), s = t?.querySelector(".gloss-panel-chrome") ?? null, o = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), n = document.querySelector(".bell-cutout"), c = document.querySelector(".bell-popover"), p = document.querySelector(".gloss-bottom-toolbar");
   if (!t)
     e.push(b("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
   else {
-    const r = getComputedStyle(t), i = r.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), o = r.clipPath || t.style.clipPath || "", u = o.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), d = u ? parseInt(u[1], 10) : NaN, h = M(i), g = Number.isFinite(d) && Number.isFinite(h) && d === h;
+    const r = getComputedStyle(t), i = r.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), l = r.clipPath || t.style.clipPath || "", u = l.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), d = u ? parseInt(u[1], 10) : NaN, h = M(i), g = Number.isFinite(d) && Number.isFinite(h) && d === h;
     e.push(
       b(
         "C1",
         "mount --reveal-y matches clip-path inset-bottom Npx",
         `inset(0 0 ${h}px 0) === --reveal-y(${h}px)`,
-        `--reveal-y=${i || "n/a"} clip-path=${o || "n/a"}`,
+        `--reveal-y=${i || "n/a"} clip-path=${l || "n/a"}`,
         g
       )
     );
@@ -1440,51 +1440,51 @@ function ne() {
   if (!t)
     e.push(b("C2", "mount padding constant", G, "absent", !1));
   else {
-    const r = t.style.padding, i = getComputedStyle(t), o = r || i.padding || "", u = o === G || o === "8px 8px 0px 8px";
-    e.push(b("C2", "mount padding constant", G, o || "n/a", u));
+    const r = t.style.padding, i = getComputedStyle(t), l = r || i.padding || "", u = l === G || l === "8px 8px 0px 8px";
+    e.push(b("C2", "mount padding constant", G, l || "n/a", u));
   }
   if (!t)
     e.push(b("C3", "mount.bottom resolves to var(--tb-h)=64px", Q, "absent", !1));
   else {
-    const i = getComputedStyle(t).bottom || t.style.bottom || "", o = i === Q;
-    e.push(b("C3", "mount.bottom resolves to var(--tb-h)=64px", Q, i || "n/a", o));
+    const i = getComputedStyle(t).bottom || t.style.bottom || "", l = i === Q;
+    e.push(b("C3", "mount.bottom resolves to var(--tb-h)=64px", Q, i || "n/a", l));
   }
   if (!s)
     e.push(b("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
   else {
     const r = getComputedStyle(s), i = M(
       r.getPropertyValue("--row-h").trim() || s.style.getPropertyValue("--row-h").trim() || "0"
-    ), o = M(
+    ), l = M(
       r.getPropertyValue("--row-gap").trim() || s.style.getPropertyValue("--row-gap").trim() || "0"
-    ), u = i * 3 + o * 3 - 8, d = M(r.height || s.style.height || ""), h = Number.isFinite(i) && Number.isFinite(o) && Number.isFinite(d) && Number.isFinite(u) && d === u;
+    ), u = i * 3 + l * 3 - 8, d = M(r.height || s.style.height || ""), h = Number.isFinite(i) && Number.isFinite(l) && Number.isFinite(d) && Number.isFinite(u) && d === u;
     e.push(
       b(
         "C4",
         "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px",
-        `${u}px (rh=${i} rg=${o})`,
+        `${u}px (rh=${i} rg=${l})`,
         `${d}px`,
         h
       )
     );
   }
-  if (!l || !s)
+  if (!o || !s)
     e.push(
       b(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "present",
-        `coordinator=${l ? "present" : "absent"} chrome=${s ? "present" : "absent"}`,
+        `coordinator=${o ? "present" : "absent"} chrome=${s ? "present" : "absent"}`,
         !1
       )
     );
   else {
-    const r = getComputedStyle(l), i = getComputedStyle(s), o = r.perspective || l.style.perspective || "", u = (r.perspectiveOrigin || l.style.perspectiveOrigin || "").trim(), d = i.perspectiveStyle || s.style.perspectiveStyle || "", _ = o !== "" && o !== "none" && (u === "center bottom" || u === "50% 100%") && d === "flat";
+    const r = getComputedStyle(o), i = getComputedStyle(s), l = r.perspective || o.style.perspective || "", u = (r.perspectiveOrigin || o.style.perspectiveOrigin || "").trim(), d = i.perspectiveStyle || s.style.perspectiveStyle || "", _ = l !== "" && l !== "none" && (u === "center bottom" || u === "50% 100%") && d === "flat";
     e.push(
       b(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "perspective:not-none, origin:center bottom, chrome-style:flat",
-        `perspective=${o} origin=${u} chrome-style=${d}`,
+        `perspective=${l} origin=${u} chrome-style=${d}`,
         _
       )
     );
@@ -1492,10 +1492,10 @@ function ne() {
   {
     let r = !1, i = "absent";
     try {
-      for (const o of Array.from(document.styleSheets)) {
+      for (const l of Array.from(document.styleSheets)) {
         let u = [];
         try {
-          u = Array.from(o.cssRules ?? []);
+          u = Array.from(l.cssRules ?? []);
         } catch {
           continue;
         }
@@ -1521,21 +1521,21 @@ function ne() {
     );
   }
   {
-    const r = document.documentElement, i = getComputedStyle(r), o = i.getPropertyValue("--panel-open-dur").trim() || r.style.getPropertyValue("--panel-open-dur").trim(), u = i.getPropertyValue("--panel-close-dur").trim() || r.style.getPropertyValue("--panel-close-dur").trim(), d = M(o) || parseFloat(o) * (o.endsWith("s") && !o.endsWith("ms") ? 1e3 : 1), h = M(u) || parseFloat(u) * (u.endsWith("s") && !u.endsWith("ms") ? 1e3 : 1), g = Number.isFinite(d) && Number.isFinite(h) && d > h;
+    const r = document.documentElement, i = getComputedStyle(r), l = i.getPropertyValue("--panel-open-dur").trim() || r.style.getPropertyValue("--panel-open-dur").trim(), u = i.getPropertyValue("--panel-close-dur").trim() || r.style.getPropertyValue("--panel-close-dur").trim(), d = M(l) || parseFloat(l) * (l.endsWith("s") && !l.endsWith("ms") ? 1e3 : 1), h = M(u) || parseFloat(u) * (u.endsWith("s") && !u.endsWith("ms") ? 1e3 : 1), g = Number.isFinite(d) && Number.isFinite(h) && d > h;
     e.push(
-      b("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${o || "n/a"} close=${u || "n/a"}`, g)
+      b("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${l || "n/a"} close=${u || "n/a"}`, g)
     );
   }
   if (!n)
     e.push(b("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
   else {
-    const r = getComputedStyle(n), i = r.animationName || "", o = r.transitionProperty || "", u = (i === "" || i === "none") && (o === "" || o === "none" || o === "all");
+    const r = getComputedStyle(n), i = r.animationName || "", l = r.transitionProperty || "", u = (i === "" || i === "none") && (l === "" || l === "none" || l === "all");
     e.push(
       b(
         "C8",
         "BellCutout zero computed animation/transition",
         "animation:none AND transition:none",
-        `animation=${i || "n/a"} transition=${o || "n/a"}`,
+        `animation=${i || "n/a"} transition=${l || "n/a"}`,
         u
       )
     );
@@ -1543,8 +1543,8 @@ function ne() {
   if (!t)
     e.push(b("C9", "mount closed-state clipPath", W, "absent", !1));
   else {
-    const r = t.style.clipPath, i = getComputedStyle(t), o = r || i.clipPath || "", u = o === W;
-    e.push(b("C9", "mount closed-state clipPath", W, o || "n/a", u));
+    const r = t.style.clipPath, i = getComputedStyle(t), l = r || i.clipPath || "", u = l === W;
+    e.push(b("C9", "mount closed-state clipPath", W, l || "n/a", u));
   }
   if (!c)
     e.push(b("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
@@ -1560,17 +1560,17 @@ function ne() {
       )
     );
   }
-  if (!l)
+  if (!o)
     e.push(b("C11", "coordinator overflow === visible", "visible", "absent", !1));
   else {
-    const i = getComputedStyle(l).overflow || l.style.overflow || "", o = i === "visible";
-    e.push(b("C11", "coordinator overflow === visible", "visible", i || "n/a", o));
+    const i = getComputedStyle(o).overflow || o.style.overflow || "", l = i === "visible";
+    e.push(b("C11", "coordinator overflow === visible", "visible", i || "n/a", l));
   }
   if (!p)
     e.push(b("C12", "toolbar clipPath = inset(0 -40 -40 -40)", j, "absent", !1));
   else {
-    const r = p.style.clipPath, i = getComputedStyle(p), o = r || i.clipPath || "", u = o === j;
-    e.push(b("C12", "toolbar clipPath = inset(0 -40 -40 -40)", j, o || "n/a", u));
+    const r = p.style.clipPath, i = getComputedStyle(p), l = r || i.clipPath || "", u = l === j;
+    e.push(b("C12", "toolbar clipPath = inset(0 -40 -40 -40)", j, l || "n/a", u));
   }
   return e.push(
     b(

package/index.js

@@ -4,8 +4,8 @@ import { jsxs as f, jsx as r, Fragment as I } from "react/jsx-runtime";
 import * as O from "react";
 import V, { useRef as M, useEffect as E, useState as A, useCallback as C, useId as Ne, useMemo as ce, useLayoutEffect as ke, createContext as Ge, useContext as He } from "react";
 import { motion as z, useMotionValue as We, AnimatePresence as Ve, useDragControls as je } from "framer-motion";
-import { u as Ke } from "./COMMITS-B_qGBoy7.js";
-import { N as Cl, C as Nl, c as kl, P as Sl, f as Dl, S as xl, e as Tl, i as Rl, r as Ml, b as Pl, d as Al, a as El } from "./COMMITS-B_qGBoy7.js";
+import { u as Ke } from "./COMMITS-B7dc_-m8.js";
+import { N as Cl, C as Nl, c as kl, P as Sl, f as Dl, S as xl, e as Tl, i as Rl, r as Ml, b as Pl, d as Al, a as El } from "./COMMITS-B7dc_-m8.js";
 import { createPortal as Se } from "react-dom";
 import { B as Ue, U as de } from "./UIContext-CGQI_KJk.js";
 import { a as Il, u as Ll } from "./UIContext-CGQI_KJk.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mt-gloss/ui",
-  "version": "0.1.136",
+  "version": "0.1.137",
   "type": "module",
   "publishConfig": {
     "access": "restricted"