@mt-gloss/ui 0.1.103 → 0.1.105

package/composites-panels.js

@@ -1,79 +1,155 @@
-import { u as I, f as q, a as Z, g as N, c as w } from "./COMMITS-Dm8qIHaq.js";
-import { C as Ve, b as qe, P as Be, e as He, i as Ue, r as Ye, d as Ke } from "./COMMITS-Dm8qIHaq.js";
-import { jsx as s, jsxs as h, Fragment as ee } from "react/jsx-runtime";
-import { useState as y, useRef as B, createContext as H, useContext as U, useEffect as F, useLayoutEffect as te, useCallback as Y } from "react";
-function ne({ children: e }) {
+import { u as $, f as q, S as se, a as oe, g as E, c as A } from "./COMMITS-kaUvc5jL.js";
+import { C as Xe, b as Je, P as Ze, e as et, i as tt, r as nt, d as st } from "./COMMITS-kaUvc5jL.js";
+import { jsx as s, jsxs as p, Fragment as ae } from "react/jsx-runtime";
+import z, { useState as b, useRef as U, createContext as Y, useContext as K, useEffect as V, useLayoutEffect as re, useCallback as W } from "react";
+function le({ children: e }) {
   return /* @__PURE__ */ s("div", { className: "clone-stage", children: e });
 }
-function oe({ span: e, rotating: t = !0, children: o }) {
+function ie({ span: e, rotating: t = !0, children: o }) {
   const n = ["clone-card", `span-${e}`, t ? "rotating" : ""].filter(Boolean).join(" ");
   return /* @__PURE__ */ s("div", { className: n, children: o });
 }
-const se = ["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"];
-function Le({
+function ce({ value: e, onChange: t }) {
+  return /* @__PURE__ */ p("div", { className: "settings-shell__field settings-shell__field--threshold", children: [
+    /* @__PURE__ */ s("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Alert level (%)" }),
+    /* @__PURE__ */ p("div", { className: "settings-shell__slider-row", children: [
+      /* @__PURE__ */ s(
+        "input",
+        {
+          id: "settings-threshold-input",
+          type: "range",
+          min: 0,
+          max: 100,
+          value: e,
+          onChange: t,
+          "aria-label": "Threshold",
+          "aria-valuenow": e,
+          "aria-valuemin": 0,
+          "aria-valuemax": 100,
+          className: "settings-shell__slider"
+        }
+      ),
+      /* @__PURE__ */ p("span", { className: "settings-shell__slider-value", "aria-live": "polite", children: [
+        e,
+        "%"
+      ] })
+    ] })
+  ] });
+}
+function de({ value: e, onChange: t }) {
+  return /* @__PURE__ */ p("div", { className: "settings-shell__field settings-shell__field--timeframe", children: [
+    /* @__PURE__ */ s("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Rolling period (days)" }),
+    /* @__PURE__ */ p("div", { className: "settings-shell__slider-row", children: [
+      /* @__PURE__ */ s(
+        "input",
+        {
+          id: "settings-timeframe-input",
+          type: "range",
+          min: 7,
+          max: 90,
+          value: e,
+          onChange: t,
+          "aria-label": "Timeframe",
+          "aria-valuenow": e,
+          "aria-valuemin": 7,
+          "aria-valuemax": 90,
+          className: "settings-shell__slider"
+        }
+      ),
+      /* @__PURE__ */ p("span", { className: "settings-shell__slider-value", "aria-live": "polite", children: [
+        e,
+        " days"
+      ] })
+    ] })
+  ] });
+}
+const ue = ["Orders", "Quota", "Unassigned"];
+function pe() {
+  return /* @__PURE__ */ p("div", { className: "settings-shell__field settings-shell__field--slots", "aria-label": "Stack slots (display only)", children: [
+    /* @__PURE__ */ s("p", { className: "settings-shell__help", children: "Slots are currently fixed. Drag-to-reorder is coming in a later phase." }),
+    /* @__PURE__ */ s("ul", { className: "settings-shell__slots-list", children: ue.map((e) => /* @__PURE__ */ s("li", { className: "settings-shell__slot-pill", children: e }, e)) })
+  ] });
+}
+const me = ["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"];
+function he({ value: e, onSelect: t }) {
+  return /* @__PURE__ */ p("div", { className: "settings-shell__field settings-shell__field--color", role: "group", "aria-label": "Accent color", children: [
+    /* @__PURE__ */ s("span", { className: "settings-shell__label", children: "Accent color" }),
+    /* @__PURE__ */ s("div", { className: "settings-shell__swatch-row", children: me.map((o) => {
+      const n = e === o;
+      return /* @__PURE__ */ s(
+        "button",
+        {
+          type: "button",
+          "aria-pressed": n,
+          "aria-label": `Accent ${o}`,
+          className: `settings-shell__swatch${n ? " settings-shell__swatch--active" : ""}`,
+          style: { backgroundColor: o },
+          onClick: () => t(o)
+        },
+        o
+      );
+    }) })
+  ] });
+}
+const fe = ["threshold", "timeframe", "color"];
+function Be({
   isOpen: e,
   cardSpan: t,
   cardLabel: o = "Metric",
-  cardValue: n = "—"
+  cardValue: n = "—",
+  dimensions: r = fe,
+  initialTab: l
 }) {
-  const a = I(), r = a?.state.activeTrigger, d = r?.kind === "card-overflow" ? r.cardId : null, l = q(), i = r?.span, c = t ?? i ?? 1, u = d != null ? a?.state?.bufferByCard?.[d]?.changes ?? {} : {}, m = typeof u.threshold == "number" ? u.threshold : 50, f = typeof u.accent == "string" ? u.accent : null, v = (g) => {
-    d == null || a == null || a.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "threshold", value: Number(g.target.value) });
-  }, b = (g) => {
-    d == null || a == null || a.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accent", value: g });
+  const d = $(), i = d?.state.activeTrigger, a = i?.kind === "card-overflow" ? i.cardId : null, c = q(), u = i?.span, h = t ?? u ?? 1, g = r[0] ?? "threshold", [f, y] = z.useState(l ?? g);
+  z.useEffect(() => {
+    r.includes(f) || y(g);
+  }, [r, f, g]);
+  const v = a != null ? d?.state?.bufferByCard?.[a]?.changes ?? {} : {}, N = typeof v.threshold == "number" ? v.threshold : 80, S = typeof v.timeframe == "number" ? v.timeframe : 30, w = typeof v.accent == "string" ? v.accent : null, C = (_) => {
+    a == null || d == null || d.dispatch({ type: "SET_BUFFER_VALUE", cardId: a, key: "threshold", value: Number(_.target.value) });
+  }, te = (_) => {
+    a == null || d == null || d.dispatch({ type: "SET_BUFFER_VALUE", cardId: a, key: "timeframe", value: Number(_.target.value) });
+  }, ne = (_) => {
+    a == null || d == null || d.dispatch({ type: "SET_BUFFER_VALUE", cardId: a, key: "accent", value: _ });
   };
-  return /* @__PURE__ */ h("div", { "data-shell": "settings", "aria-hidden": !e, children: [
-    /* @__PURE__ */ s(ne, { children: /* @__PURE__ */ h(oe, { span: c, rotating: !l, children: [
+  return /* @__PURE__ */ p("div", { className: "settings-shell", "data-shell": "settings", "aria-hidden": !e, children: [
+    /* @__PURE__ */ s("div", { "aria-hidden": "true", children: /* @__PURE__ */ s(le, { children: /* @__PURE__ */ p(ie, { span: h, rotating: !c, children: [
       /* @__PURE__ */ s("div", { style: { fontSize: 9, textTransform: "uppercase", letterSpacing: "0.06em", color: "#9ca3af", marginBottom: 6 }, children: o }),
       /* @__PURE__ */ s("div", { style: { fontSize: 22, fontWeight: 700, color: "#111827", lineHeight: 1 }, children: n })
-    ] }) }),
-    /* @__PURE__ */ h("div", { className: "settings-shell__controls", children: [
-      /* @__PURE__ */ s("h3", { className: "settings-shell__heading", children: "Settings" }),
-      /* @__PURE__ */ h("label", { className: "settings-shell__field", children: [
-        /* @__PURE__ */ s("span", { className: "settings-shell__label", children: "Threshold" }),
-        /* @__PURE__ */ s(
-          "input",
-          {
-            type: "range",
-            min: 0,
-            max: 100,
-            step: 1,
-            value: m,
-            onChange: v,
-            className: "settings-shell__slider",
-            "aria-label": "Threshold",
-            "data-testid": "settings-threshold-slider"
-          }
-        ),
-        /* @__PURE__ */ s("span", { className: "settings-shell__value", "aria-live": "polite", children: m })
-      ] }),
-      /* @__PURE__ */ h("div", { className: "settings-shell__field", children: [
-        /* @__PURE__ */ s("span", { className: "settings-shell__label", children: "Accent" }),
-        /* @__PURE__ */ s("div", { className: "settings-shell__swatches", role: "radiogroup", "aria-label": "Accent color", children: se.map((g) => /* @__PURE__ */ s(
-          "button",
-          {
-            type: "button",
-            role: "radio",
-            "aria-pressed": f === g,
-            "aria-checked": f === g,
-            "aria-label": `Accent ${g}`,
-            className: "settings-shell__swatch",
-            style: { backgroundColor: g },
-            onClick: () => b(g),
-            "data-testid": `settings-swatch-${g}`
-          },
-          g
-        )) })
-      ] })
-    ] })
+    ] }) }) }),
+    /* @__PURE__ */ s(
+      se,
+      {
+        dimensions: r,
+        activeTab: f,
+        onSelect: y,
+        reduced: c
+      }
+    ),
+    /* @__PURE__ */ p(
+      "div",
+      {
+        role: "tabpanel",
+        id: `settings-tabpanel-${f}`,
+        "aria-label": "Settings dimension controls",
+        tabIndex: 0,
+        className: "settings-shell__tabpanel",
+        children: [
+          f === "threshold" && /* @__PURE__ */ s(ce, { value: N, onChange: C }),
+          f === "timeframe" && /* @__PURE__ */ s(de, { value: S, onChange: te }),
+          f === "slots" && /* @__PURE__ */ s(pe, {}),
+          f === "color" && /* @__PURE__ */ s(he, { value: w, onSelect: ne })
+        ]
+      }
+    )
   ] });
 }
-function K({ lenses: e, activeLens: t, onLensChange: o }) {
-  const [n, a] = y(!1), r = B(null), d = () => {
-    r.current != null && (window.clearTimeout(r.current), r.current = null);
-  }, l = () => {
-    d(), r.current = window.setTimeout(() => a(!1), 100);
-  }, i = e.filter((c) => c !== t);
-  return /* @__PURE__ */ s("div", { className: "cat-segmented-wrap", children: /* @__PURE__ */ h("div", { className: "cat-segmented", children: [
+function j({ lenses: e, activeLens: t, onLensChange: o }) {
+  const [n, r] = b(!1), l = U(null), d = () => {
+    l.current != null && (window.clearTimeout(l.current), l.current = null);
+  }, i = () => {
+    d(), l.current = window.setTimeout(() => r(!1), 100);
+  }, a = e.filter((c) => c !== t);
+  return /* @__PURE__ */ s("div", { className: "cat-segmented-wrap", children: /* @__PURE__ */ p("div", { className: "cat-segmented", children: [
     /* @__PURE__ */ s(
       "button",
       {
@@ -84,14 +160,14 @@ function K({ lenses: e, activeLens: t, onLensChange: o }) {
         children: t
       }
     ),
-    /* @__PURE__ */ h(
+    /* @__PURE__ */ p(
       "div",
       {
         className: "cat-seg-more",
         onMouseEnter: () => {
-          d(), a(!0);
+          d(), r(!0);
         },
-        onMouseLeave: l,
+        onMouseLeave: i,
         children: [
           /* @__PURE__ */ s("button", { type: "button", className: "cat-seg cat-seg-more-btn", "aria-haspopup": "menu", "aria-expanded": n, children: "More ▾" }),
           n && /* @__PURE__ */ s(
@@ -100,15 +176,15 @@ function K({ lenses: e, activeLens: t, onLensChange: o }) {
               className: "cat-seg-overflow",
               role: "menu",
               onMouseEnter: d,
-              onMouseLeave: l,
-              children: i.map((c) => /* @__PURE__ */ s(
+              onMouseLeave: i,
+              children: a.map((c) => /* @__PURE__ */ s(
                 "button",
                 {
                   type: "button",
                   "data-lens": c,
                   role: "menuitem",
                   onClick: () => {
-                    o(c), a(!1);
+                    o(c), r(!1);
                   },
                   children: c
                 },
@@ -121,48 +197,48 @@ function K({ lenses: e, activeLens: t, onLensChange: o }) {
     )
   ] }) });
 }
-function ae(e) {
+function ge(e) {
   return e.split("·").map((t, o) => {
-    const n = t.trim(), a = n.match(/^([$+\-]?[\d,]+(?:\.\d+)?[%+]?)\s*(.*)$/), r = a ? a[1] : "", d = a ? a[2] : n;
-    return /* @__PURE__ */ h("span", { children: [
-      /* @__PURE__ */ s("strong", { children: r }),
+    const n = t.trim(), r = n.match(/^([$+\-]?[\d,]+(?:\.\d+)?[%+]?)\s*(.*)$/), l = r ? r[1] : "", d = r ? r[2] : n;
+    return /* @__PURE__ */ p("span", { children: [
+      /* @__PURE__ */ s("strong", { children: l }),
       /* @__PURE__ */ s("small", { children: d })
     ] }, o);
   });
 }
-function j({ tiles: e, selectedTileId: t, onSelectTile: o }) {
+function G({ tiles: e, selectedTileId: t, onSelectTile: o }) {
   return /* @__PURE__ */ s("div", { className: "cat-tiles", children: e.map((n) => {
-    const a = n.id === t, r = n.stack === !0, d = ["cat-tile"];
-    return r && d.push("span-2"), a && d.push("selected"), /* @__PURE__ */ h(
+    const r = n.id === t, l = n.stack === !0, d = ["cat-tile"];
+    return l && d.push("span-2"), r && d.push("selected"), /* @__PURE__ */ p(
       "button",
       {
         type: "button",
         className: d.join(" "),
         "data-metric": n.id,
         "data-desc": n.desc,
-        "aria-pressed": a,
+        "aria-pressed": r,
         onClick: () => o(n.id, n.desc),
         children: [
           /* @__PURE__ */ s("span", { className: "cat-tile-label", children: n.label }),
-          /* @__PURE__ */ s("span", { className: "cat-tile-value", children: r ? ae(n.value) : n.value }),
-          n.variants && n.variants.length > 0 && /* @__PURE__ */ s("span", { className: "cat-tile-variants", "aria-hidden": "true", children: n.variants.map((l) => /* @__PURE__ */ s("span", { children: l }, l)) })
+          /* @__PURE__ */ s("span", { className: "cat-tile-value", children: l ? ge(n.value) : n.value }),
+          n.variants && n.variants.length > 0 && /* @__PURE__ */ s("span", { className: "cat-tile-variants", "aria-hidden": "true", children: n.variants.map((i) => /* @__PURE__ */ s("span", { children: i }, i)) })
         ]
       },
       n.id
     );
   }) });
 }
-const k = H(null);
-function re() {
-  return U(k);
+const R = Y(null);
+function ve() {
+  return K(R);
 }
-function le({ mode: e, dispatch: t }) {
-  const o = re();
+function be({ mode: e, dispatch: t }) {
+  const o = ve();
   if (o == null && e == null) return null;
-  const n = o?.mode ?? e ?? "add", a = o?.selectedTileId ?? null, r = o?.description ?? null, d = a == null;
-  return /* @__PURE__ */ h("div", { className: "panel-footer catalog", children: [
-    /* @__PURE__ */ s("div", { className: "cat-description", id: "cat-desc", children: r ?? /* @__PURE__ */ s("em", { children: "Tap a metric to see its description" }) }),
-    /* @__PURE__ */ h("div", { style: { display: "flex", padding: "10px 14px", gap: 8 }, children: [
+  const n = o?.mode ?? e ?? "add", r = o?.selectedTileId ?? null, l = o?.description ?? null, d = r == null;
+  return /* @__PURE__ */ p("div", { className: "panel-footer catalog", children: [
+    /* @__PURE__ */ s("div", { className: "cat-description", id: "cat-desc", children: l ?? /* @__PURE__ */ s("em", { children: "Tap a metric to see its description" }) }),
+    /* @__PURE__ */ p("div", { style: { display: "flex", padding: "10px 14px", gap: 8 }, children: [
       /* @__PURE__ */ s("div", { className: "spacer", style: { flex: 1 } }),
       /* @__PURE__ */ s(
         "button",
@@ -199,14 +275,14 @@ function le({ mode: e, dispatch: t }) {
     ] })
   ] });
 }
-const W = [
+const Q = [
   "Revenue",
   "Order flow",
   "Rep performance",
   "Brand portfolio",
   "Account coverage",
   "Commission"
-], G = "Order flow", Q = {
+], X = "Order flow", J = {
   Revenue: [
     { id: "rev-mtd", label: "Revenue MTD", value: "$184K", desc: "Month-to-date revenue across all manufacturers and territories." },
     { id: "rev-ytd", label: "Revenue YTD", value: "$2.1M", desc: "Year-to-date revenue including pending and posted orders.", variants: ["1×1", "1×3"] },
@@ -252,96 +328,96 @@ const W = [
     { id: "cm-rate", label: "Effective rate", value: "6.8%", desc: "Realized commission rate across all orders." }
   ]
 };
-function Te({
+function He({
   isOpen: e,
-  lenses: t = W,
-  defaultLens: o = G,
-  tilesByLens: n = Q,
-  footerSlot: a
+  lenses: t = Q,
+  defaultLens: o = X,
+  tilesByLens: n = J,
+  footerSlot: r
 }) {
-  const [r, d] = y(o), [l, i] = y(null), [c, u] = y(null), m = n[r] ?? [];
-  return /* @__PURE__ */ h(
-    k.Provider,
+  const [l, d] = b(o), [i, a] = b(null), [c, u] = b(null), h = n[l] ?? [];
+  return /* @__PURE__ */ p(
+    R.Provider,
     {
-      value: { mode: "add", selectedTileId: l, description: c },
+      value: { mode: "add", selectedTileId: i, description: c },
       children: [
-        /* @__PURE__ */ h("div", { "data-shell": "catalog-add", "aria-hidden": !e, children: [
+        /* @__PURE__ */ p("div", { "data-shell": "catalog-add", "aria-hidden": !e, children: [
           /* @__PURE__ */ s("h3", { children: "Add a metric" }),
           /* @__PURE__ */ s(
-            K,
+            j,
             {
               lenses: t,
-              activeLens: r,
-              onLensChange: (f) => {
-                d(f), i(null), u(null);
+              activeLens: l,
+              onLensChange: (g) => {
+                d(g), a(null), u(null);
               }
             }
           ),
           /* @__PURE__ */ s(
-            j,
+            G,
             {
-              tiles: m,
-              selectedTileId: l,
-              onSelectTile: (f, v) => {
-                i(f), u(v);
+              tiles: h,
+              selectedTileId: i,
+              onSelectTile: (g, f) => {
+                a(g), u(f);
               }
             }
           )
         ] }),
-        a
+        r
       ]
     }
   );
 }
-function Ie({
+function qe({
   isOpen: e,
   replacingLabel: t,
-  lenses: o = W,
-  defaultLens: n = G,
-  tilesByLens: a = Q,
-  footerSlot: r
+  lenses: o = Q,
+  defaultLens: n = X,
+  tilesByLens: r = J,
+  footerSlot: l
 }) {
-  const [d, l] = y(n), [i, c] = y(null), [u, m] = y(null), f = a[d] ?? [];
-  return /* @__PURE__ */ h(
-    k.Provider,
+  const [d, i] = b(n), [a, c] = b(null), [u, h] = b(null), g = r[d] ?? [];
+  return /* @__PURE__ */ p(
+    R.Provider,
     {
-      value: { mode: "replace", selectedTileId: i, description: u },
+      value: { mode: "replace", selectedTileId: a, description: u },
       children: [
-        /* @__PURE__ */ h("div", { "data-shell": "catalog-replace", "aria-hidden": !e, children: [
+        /* @__PURE__ */ p("div", { "data-shell": "catalog-replace", "aria-hidden": !e, children: [
           /* @__PURE__ */ s("h3", { children: "Replace metric" }),
-          t && /* @__PURE__ */ h("p", { className: "cat-subtitle", children: [
+          t && /* @__PURE__ */ p("p", { className: "cat-subtitle", children: [
             "replacing ",
             t
           ] }),
           /* @__PURE__ */ s(
-            K,
+            j,
             {
               lenses: o,
               activeLens: d,
-              onLensChange: (v) => {
-                l(v), c(null), m(null);
+              onLensChange: (f) => {
+                i(f), c(null), h(null);
               }
             }
           ),
           /* @__PURE__ */ s(
-            j,
+            G,
             {
-              tiles: f,
-              selectedTileId: i,
-              onSelectTile: (v, b) => {
-                c(v), m(b);
+              tiles: g,
+              selectedTileId: a,
+              onSelectTile: (f, y) => {
+                c(f), h(y);
               }
             }
           )
         ] }),
-        r
+        l
       ]
     }
   );
 }
-function ie({ page: e, onRename: t, onKebab: o, onDragStart: n }) {
-  const a = ["pm-row"];
-  return e.active && a.push("active"), /* @__PURE__ */ h("div", { className: a.join(" "), "data-page-id": e.id, role: "listitem", children: [
+function ye({ page: e, onRename: t, onKebab: o, onDragStart: n }) {
+  const r = ["pm-row"];
+  return e.active && r.push("active"), /* @__PURE__ */ p("div", { className: r.join(" "), "data-page-id": e.id, role: "listitem", children: [
     /* @__PURE__ */ s(
       "div",
       {
@@ -364,13 +440,13 @@ function ie({ page: e, onRename: t, onKebab: o, onDragStart: n }) {
     )
   ] });
 }
-const X = H(null);
-function ce() {
-  return U(X);
+const Z = Y(null);
+function Ce() {
+  return K(Z);
 }
-function de(e = {}) {
-  const o = ce()?.setPages;
-  return /* @__PURE__ */ h(
+function Pe(e = {}) {
+  const o = Ce()?.setPages;
+  return /* @__PURE__ */ p(
     "div",
     {
       className: "panel-footer pm",
@@ -396,38 +472,38 @@ function de(e = {}) {
     }
   );
 }
-const ue = [
+const _e = [
   { id: "p-pipeline", name: "My Pipeline", active: !0 },
   { id: "p-numbers", name: "My Numbers", active: !1 },
   { id: "p-morning", name: "My Morning", active: !1 },
   { id: "p-accounts", name: "My Accounts", active: !1 }
 ];
-function ke({
+function Ue({
   isOpen: e,
-  pages: t = ue,
+  pages: t = _e,
   footerSlot: o
 }) {
-  const [n, a] = y(() => [...t]);
-  return /* @__PURE__ */ h(X.Provider, { value: { pages: n, setPages: a }, children: [
-    /* @__PURE__ */ h("div", { "data-shell": "page-management", "aria-hidden": !e, children: [
+  const [n, r] = b(() => [...t]);
+  return /* @__PURE__ */ p(Z.Provider, { value: { pages: n, setPages: r }, children: [
+    /* @__PURE__ */ p("div", { "data-shell": "page-management", "aria-hidden": !e, children: [
       /* @__PURE__ */ s("h3", { children: "Manage pages" }),
-      /* @__PURE__ */ s("div", { className: "pm-list", role: "list", children: n.map((r) => /* @__PURE__ */ s(ie, { page: r }, r.id)) })
+      /* @__PURE__ */ s("div", { className: "pm-list", role: "list", children: n.map((l) => /* @__PURE__ */ s(ye, { page: l }, l.id)) })
     ] }),
     o
   ] });
 }
-const Me = {
+const Ye = {
   SETTINGS: "settings",
   CATALOG_ADD: "catalog-add",
   CATALOG_REPLACE: "catalog-replace",
   PAGE_MGMT: "page-management",
   NOTIFICATION_CENTER: "notification-center"
-}, pe = {
+}, Ne = {
   position: "fixed",
   inset: 0,
   pointerEvents: "none",
   zIndex: 55
-}, me = {
+}, Se = {
   position: "absolute",
   inset: 0,
   zIndex: 1,
@@ -436,66 +512,81 @@ const Me = {
   pointerEvents: "none",
   background: "rgba(0, 0, 0, 0.04)"
 };
-function $e() {
-  const { state: e, dispatch: t, getCloseLog: o } = Z();
-  F(() => {
+function Ke() {
+  const { state: e, dispatch: t, getCloseLog: o } = oe();
+  V(() => {
     if (e.activePanelId == null) return;
-    function r(d) {
+    function l(d) {
       d.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
     }
-    return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
+    return document.addEventListener("keydown", l), () => document.removeEventListener("keydown", l);
   }, [e.activePanelId, t]);
-  const n = B(e);
-  te(() => {
+  const n = U(e);
+  re(() => {
     n.current = e;
-  }), F(() => {
+  }), V(() => {
     if (process.env.NODE_ENV === "production") return;
-    const r = window;
-    return r.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), r.__panelsHostHandle = {
+    const l = window;
+    return l.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), l.__panelsHostHandle = {
       dispatch: t,
       getState: () => n.current,
       getCloseLog: o
     }, () => {
-      r.__panelsHostHandle?.dispatch === t && delete window.__panelsHostHandle;
+      l.__panelsHostHandle?.dispatch === t && delete window.__panelsHostHandle;
     };
   }, [t, o]);
-  const a = Y(() => {
+  const r = W(() => {
     t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
   }, [t]);
-  return /* @__PURE__ */ s("div", { "data-panel-host": "true", style: pe, children: e.activePanelId != null && /* @__PURE__ */ s(
+  return /* @__PURE__ */ s("div", { "data-panel-host": "true", style: Ne, children: e.activePanelId != null && /* @__PURE__ */ s(
     "div",
     {
       "data-panel-scrim": "true",
-      style: me,
-      onClick: a
+      style: Se,
+      onClick: r
     }
   ) });
 }
-function De({ panelComponents: e }) {
-  const t = I();
-  if (t == null) return null;
-  const { state: o, dispatch: n } = t;
-  if (o.activePanelId == null) return null;
-  const a = e[o.activePanelId];
-  if (a == null)
+function We({ panelComponents: e, children: t }) {
+  const o = $();
+  if (o == null) return null;
+  const { state: n, dispatch: r } = o;
+  if (n.activePanelId == null) return null;
+  const l = e?.[n.activePanelId];
+  if (l == null && t == null)
     return process.env.NODE_ENV !== "production" && console.error(
       "[panels] No panel component registered for activePanelId:",
-      o.activePanelId
+      n.activePanelId
     ), null;
-  if (o.activePanelId === "settings")
-    return /* @__PURE__ */ s(N, { isOpen: !0, children: /* @__PURE__ */ s(
-      w,
+  if (n.activePanelId === "settings") {
+    const d = n.isDirty, i = n.activeTrigger, a = i?.kind === "card-overflow" ? i.cardId : null;
+    return /* @__PURE__ */ s(E, { isOpen: !0, children: /* @__PURE__ */ s(
+      A,
       {
         isOpen: !0,
-        onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
-        footer: /* @__PURE__ */ h(ee, { children: [
+        onClose: () => r({ type: "CLOSE_PANEL", reason: "header-x" }),
+        footer: /* @__PURE__ */ p(ae, { children: [
+          /* @__PURE__ */ s(
+            "button",
+            {
+              id: "btn-reset",
+              type: "button",
+              className: "gloss-panel-chrome__footer-btn",
+              disabled: !d,
+              onClick: () => {
+                a != null && r({ type: "CLEAR_BUFFER", cardId: a });
+              },
+              children: "Reset"
+            }
+          ),
+          /* @__PURE__ */ s("span", { style: { flex: 1 } }),
           /* @__PURE__ */ s(
             "button",
             {
               id: "settings-cancel",
               type: "button",
               className: "gloss-panel-chrome__footer-btn",
-              onClick: () => n({ type: "CLOSE_PANEL", reason: "cancel-button" }),
+              onClick: () => r({ type: "CLOSE_PANEL", reason: "cancel-button" }),
               children: "Cancel"
             }
           ),
@@ -505,235 +596,238 @@ function De({ panelComponents: e }) {
               id: "settings-apply",
               type: "button",
               className: "gloss-panel-chrome__footer-btn gloss-panel-chrome__footer-btn--primary",
-              onClick: () => n({ type: "CLOSE_PANEL", reason: "apply-button" }),
+              disabled: !d,
+              onClick: () => r({ type: "CLOSE_PANEL", reason: "apply-button" }),
               children: "Apply"
             }
           )
         ] }),
-        children: /* @__PURE__ */ s(a, { isOpen: !0 })
+        children: l != null ? /* @__PURE__ */ s(l, { isOpen: !0 }) : t
       }
     ) });
-  if (o.activePanelId === "catalog-add" || o.activePanelId === "catalog-replace") {
-    const r = o.activePanelId === "catalog-replace" ? "replace" : "add";
-    return /* @__PURE__ */ s(N, { isOpen: !0, children: /* @__PURE__ */ s(
-      w,
+  }
+  if (n.activePanelId === "catalog-add" || n.activePanelId === "catalog-replace") {
+    if (l == null) return null;
+    const d = n.activePanelId === "catalog-replace" ? "replace" : "add";
+    return /* @__PURE__ */ s(E, { isOpen: !0, children: /* @__PURE__ */ s(
+      A,
       {
         isOpen: !0,
-        onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
+        onClose: () => r({ type: "CLOSE_PANEL", reason: "header-x" }),
         footer: null,
         children: /* @__PURE__ */ s(
-          a,
+          l,
           {
             isOpen: !0,
-            footerSlot: /* @__PURE__ */ s(le, { mode: r, dispatch: n })
+            footerSlot: /* @__PURE__ */ s(be, { mode: d, dispatch: r })
           }
         )
       }
     ) });
   }
-  return o.activePanelId === "page-management" ? /* @__PURE__ */ s(N, { isOpen: !0, children: /* @__PURE__ */ s(
-    w,
+  return n.activePanelId === "page-management" ? l == null ? null : /* @__PURE__ */ s(E, { isOpen: !0, children: /* @__PURE__ */ s(
+    A,
     {
       isOpen: !0,
-      onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
+      onClose: () => r({ type: "CLOSE_PANEL", reason: "header-x" }),
       footer: null,
-      children: /* @__PURE__ */ s(a, { isOpen: !0, footerSlot: /* @__PURE__ */ s(de, {}) })
+      children: /* @__PURE__ */ s(l, { isOpen: !0, footerSlot: /* @__PURE__ */ s(Pe, {}) })
     }
-  ) }) : /* @__PURE__ */ s(N, { isOpen: !0, children: /* @__PURE__ */ s(
-    w,
+  ) }) : /* @__PURE__ */ s(E, { isOpen: !0, children: /* @__PURE__ */ s(
+    A,
     {
       isOpen: !0,
-      onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
+      onClose: () => r({ type: "CLOSE_PANEL", reason: "header-x" }),
       footer: null,
-      children: /* @__PURE__ */ s(a, { isOpen: !0 })
+      children: l != null ? /* @__PURE__ */ s(l, { isOpen: !0 }) : t
     }
   ) });
 }
-function z(e) {
+function B(e) {
   return e === null ? null : e.kind === "manage-pages-action" ? `global-${e.align ?? "left"}` : e.kind === "card-overflow" || e.kind === "empty-cell" ? `section-${e.sectionIndex}` : null;
 }
-const he = 685, V = 627, fe = "cubic-bezier(0.22, 1, 0.36, 1)", ve = 200;
-function J(e, t) {
+const we = 685, H = 627, Ee = "cubic-bezier(0.22, 1, 0.36, 1)", Ae = 200;
+function ee(e, t) {
   if (typeof window > "u") return t;
   const o = window.getComputedStyle(document.documentElement).getPropertyValue(e).trim();
   if (!o) return t;
   const n = parseFloat(o);
   return Number.isNaN(n) ? t : o.endsWith("s") && !o.endsWith("ms") ? n * 1e3 : n;
 }
-function ge(e, t) {
+function xe(e, t) {
   return typeof window > "u" ? t : window.getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
 }
-function S(e) {
+function x(e) {
   e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
 }
-function ye(e) {
-  const { mountEl: t, chromeEl: o, reducedMotion: n, onAssert: a } = e;
+function Te(e) {
+  const { mountEl: t, chromeEl: o, reducedMotion: n, onAssert: r } = e;
   if (t == null || o == null) {
-    S(e), a?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
+    x(e), r?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
     return;
   }
   if (n) {
-    e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), a?.({ branch: "slide-reduced-motion", timestamp: Date.now() });
+    e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "slide-reduced-motion", timestamp: Date.now() });
     return;
   }
   if (typeof o.animate != "function") {
-    S(e), a?.({ branch: "slide-no-waapi", timestamp: Date.now() });
+    x(e), r?.({ branch: "slide-no-waapi", timestamp: Date.now() });
     return;
   }
-  const r = o.cloneNode(!0);
-  r.id = "panel-chrome-frozen", r.style.cssText = "position:absolute;left:8px;right:8px;top:8px;z-index:1;pointer-events:none;", t.appendChild(r), o.style.zIndex = "2", e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
-  const d = J("--panel-open-dur", he), l = ge("--panel-easing", fe), i = o.animate(
+  const l = o.cloneNode(!0);
+  l.id = "panel-chrome-frozen", l.style.cssText = "position:absolute;left:8px;right:8px;top:8px;z-index:1;pointer-events:none;", t.appendChild(l), o.style.zIndex = "2", e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
+  const d = ee("--panel-open-dur", we), i = xe("--panel-easing", Ee), a = o.animate(
     [{ transform: "translateY(100%)" }, { transform: "translateY(0)" }],
-    { duration: d, easing: l, fill: "forwards" }
+    { duration: d, easing: i, fill: "forwards" }
   );
-  i.addEventListener(
+  a.addEventListener(
     "finish",
     () => {
-      r.remove(), o.style.zIndex = "", i.cancel(), a?.({ branch: "slide-complete", frozen: "cleaned", timestamp: Date.now() });
+      l.remove(), o.style.zIndex = "", a.cancel(), r?.({ branch: "slide-complete", frozen: "cleaned", timestamp: Date.now() });
     },
     { once: !0 }
   );
 }
-function be(e) {
+function Le(e) {
   const { mountEl: t, onAssert: o } = e;
   if (t == null) {
-    e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => S(e), V), o?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
+    e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => x(e), H), o?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
     return;
   }
-  const n = J("--panel-close-dur", V);
-  let a = !1, r = null;
-  const d = (i) => {
-    i.target !== t || i.propertyName !== "max-height" || a || (a = !0, r != null && clearTimeout(r), t.removeEventListener("transitionend", d), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), o?.({ branch: "handoff-complete", timestamp: Date.now() }));
-  }, l = () => {
-    a || (a = !0, t.removeEventListener("transitionend", d), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), o?.({ branch: "handoff-forced", timestamp: Date.now() }));
+  const n = ee("--panel-close-dur", H);
+  let r = !1, l = null;
+  const d = (a) => {
+    a.target !== t || a.propertyName !== "max-height" || r || (r = !0, l != null && clearTimeout(l), t.removeEventListener("transitionend", d), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), o?.({ branch: "handoff-complete", timestamp: Date.now() }));
+  }, i = () => {
+    r || (r = !0, t.removeEventListener("transitionend", d), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), o?.({ branch: "handoff-forced", timestamp: Date.now() }));
   };
-  t.addEventListener("transitionend", d), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), r = setTimeout(l, n + ve);
+  t.addEventListener("transitionend", d), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), l = setTimeout(i, n + Ae);
 }
-function Pe(e) {
+function Oe(e) {
   const { state: t, onAssert: o } = e;
   if (t.activePanelId && t.isDirty) {
     e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), o?.({ branch: "blocked-dirty", timestamp: Date.now() });
     return;
   }
-  const n = z(t.activeTrigger), a = z(e.trigger);
-  if (!!t.activePanelId && n != null && n === a) {
-    ye(e);
+  const n = B(t.activeTrigger), r = B(e.trigger);
+  if (!!t.activePanelId && n != null && n === r) {
+    Te(e);
     return;
   }
   if (t.activePanelId) {
-    be(e);
+    Le(e);
     return;
   }
-  S(e), o?.({ branch: "fresh-open", timestamp: Date.now() });
+  x(e), o?.({ branch: "fresh-open", timestamp: Date.now() });
 }
-function Ce() {
+function Ie() {
   if (!(typeof window > "u"))
     return window.__panelsAsserter;
 }
-function Re() {
-  const e = I(), t = q();
-  return Y(
+function je() {
+  const e = $(), t = q();
+  return W(
     (o, n) => {
       if (!e)
         return;
-      const a = typeof document < "u" ? document.querySelector('[data-mount="panel"]') : null, r = typeof document < "u" ? document.querySelector('[data-chrome="panel"]') : null, d = {
+      const r = typeof document < "u" ? document.querySelector('[data-mount="panel"]') : null, l = typeof document < "u" ? document.querySelector('[data-chrome="panel"]') : null, d = {
         panelId: o,
         trigger: n,
         state: e.state,
         dispatch: e.dispatch,
-        mountEl: a,
-        chromeEl: r,
+        mountEl: r,
+        chromeEl: l,
         reducedMotion: t,
-        onAssert: (l) => {
-          Ce()?.recordTransition?.(l);
+        onAssert: (i) => {
+          Ie()?.recordTransition?.(i);
         }
       };
-      Pe(d);
+      Oe(d);
     },
     [e, t]
   );
 }
-let E = !1, _ = null;
-function T() {
+let T = !1, L = null;
+function D() {
   const e = [];
   let t = "cleaned";
   document.querySelectorAll("#panel-chrome-frozen").length > 0 && (e.push("#panel-chrome-frozen"), t = "lingering");
   const n = document.querySelectorAll(".gloss-panel-mount");
   n.length > 1 && e.push(`mount-count=${n.length}`);
-  const a = n[0] ?? null, r = a ? a.querySelectorAll(".gloss-panel-chrome") : [];
-  r.length > 1 && e.push(`chrome-count=${r.length}`);
-  const d = r[0] ?? null;
+  const r = n[0] ?? null, l = r ? r.querySelectorAll(".gloss-panel-chrome") : [];
+  l.length > 1 && e.push(`chrome-count=${l.length}`);
+  const d = l[0] ?? null;
   if (d) {
     const u = d.style.zIndex;
     u !== "" && u !== "2" && e.push(`chrome-zindex=${u}`);
   }
-  const l = a ? "present" : "absent", i = d ? "present" : "absent";
+  const i = r ? "present" : "absent", a = d ? "present" : "absent";
   return {
     valid: e.length === 0,
-    mount: l,
-    chrome: i,
+    mount: i,
+    chrome: a,
     frozen: t,
     orphans: e,
     timestamp: Date.now()
   };
 }
-const A = "8px 8px 0px", x = "64px", O = "inset(0px 0px 60px 0px)", L = "inset(0px -40px -40px -40px)";
-function p(e, t, o, n, a) {
-  return { id: e, constraint: t, expected: o, actual: n, pass: a };
+const O = "8px 8px 0px", I = "64px", k = "inset(0px 0px 60px 0px)", M = "inset(0px -40px -40px -40px)";
+function m(e, t, o, n, r) {
+  return { id: e, constraint: t, expected: o, actual: n, pass: r };
 }
 function P(e) {
   const t = parseInt(e, 10);
   return Number.isFinite(t) ? t : NaN;
 }
-function M() {
-  const e = [], t = document.querySelector(".gloss-panel-mount"), o = t?.querySelector(".gloss-panel-chrome") ?? null, n = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), a = document.querySelector(".bell-cutout"), r = document.querySelector(".bell-popover"), d = document.querySelector(".gloss-bottom-toolbar");
+function F() {
+  const e = [], t = document.querySelector(".gloss-panel-mount"), o = t?.querySelector(".gloss-panel-chrome") ?? null, n = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), r = document.querySelector(".bell-cutout"), l = document.querySelector(".bell-popover"), d = document.querySelector(".gloss-bottom-toolbar");
   if (!t)
-    e.push(p("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
+    e.push(m("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
   else {
-    const l = getComputedStyle(t), i = l.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), c = l.clipPath || t.style.clipPath || "", u = c.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), m = u ? parseInt(u[1], 10) : NaN, f = P(i), v = Number.isFinite(m) && Number.isFinite(f) && m === f;
+    const i = getComputedStyle(t), a = i.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), c = i.clipPath || t.style.clipPath || "", u = c.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), h = u ? parseInt(u[1], 10) : NaN, g = P(a), f = Number.isFinite(h) && Number.isFinite(g) && h === g;
     e.push(
-      p(
+      m(
         "C1",
         "mount --reveal-y matches clip-path inset-bottom Npx",
-        `inset(0 0 ${f}px 0) === --reveal-y(${f}px)`,
-        `--reveal-y=${i || "n/a"} clip-path=${c || "n/a"}`,
-        v
+        `inset(0 0 ${g}px 0) === --reveal-y(${g}px)`,
+        `--reveal-y=${a || "n/a"} clip-path=${c || "n/a"}`,
+        f
       )
     );
   }
   if (!t)
-    e.push(p("C2", "mount padding constant", A, "absent", !1));
+    e.push(m("C2", "mount padding constant", O, "absent", !1));
   else {
-    const l = t.style.padding, i = getComputedStyle(t), c = l || i.padding || "", u = c === A || c === "8px 8px 0px 8px";
-    e.push(p("C2", "mount padding constant", A, c || "n/a", u));
+    const i = t.style.padding, a = getComputedStyle(t), c = i || a.padding || "", u = c === O || c === "8px 8px 0px 8px";
+    e.push(m("C2", "mount padding constant", O, c || "n/a", u));
   }
   if (!t)
-    e.push(p("C3", "mount.bottom resolves to var(--tb-h)=64px", x, "absent", !1));
+    e.push(m("C3", "mount.bottom resolves to var(--tb-h)=64px", I, "absent", !1));
   else {
-    const i = getComputedStyle(t).bottom || t.style.bottom || "", c = i === x;
-    e.push(p("C3", "mount.bottom resolves to var(--tb-h)=64px", x, i || "n/a", c));
+    const a = getComputedStyle(t).bottom || t.style.bottom || "", c = a === I;
+    e.push(m("C3", "mount.bottom resolves to var(--tb-h)=64px", I, a || "n/a", c));
   }
   if (!o)
-    e.push(p("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
+    e.push(m("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
   else {
-    const l = getComputedStyle(o), i = P(
-      l.getPropertyValue("--row-h").trim() || o.style.getPropertyValue("--row-h").trim() || "0"
+    const i = getComputedStyle(o), a = P(
+      i.getPropertyValue("--row-h").trim() || o.style.getPropertyValue("--row-h").trim() || "0"
     ), c = P(
-      l.getPropertyValue("--row-gap").trim() || o.style.getPropertyValue("--row-gap").trim() || "0"
-    ), u = i * 3 + c * 3 - 8, m = P(l.height || o.style.height || ""), f = Number.isFinite(i) && Number.isFinite(c) && Number.isFinite(m) && Number.isFinite(u) && m === u;
+      i.getPropertyValue("--row-gap").trim() || o.style.getPropertyValue("--row-gap").trim() || "0"
+    ), u = a * 3 + c * 3 - 8, h = P(i.height || o.style.height || ""), g = Number.isFinite(a) && Number.isFinite(c) && Number.isFinite(h) && Number.isFinite(u) && h === u;
     e.push(
-      p(
+      m(
         "C4",
         "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px",
-        `${u}px (rh=${i} rg=${c})`,
-        `${m}px`,
-        f
+        `${u}px (rh=${a} rg=${c})`,
+        `${h}px`,
+        g
       )
     );
   }
   if (!n || !o)
     e.push(
-      p(
+      m(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "present",
@@ -742,19 +836,19 @@ function M() {
       )
     );
   else {
-    const l = getComputedStyle(n), i = getComputedStyle(o), c = l.perspective || n.style.perspective || "", u = (l.perspectiveOrigin || n.style.perspectiveOrigin || "").trim(), m = i.perspectiveStyle || o.style.perspectiveStyle || "", g = c !== "" && c !== "none" && (u === "center bottom" || u === "50% 100%") && m === "flat";
+    const i = getComputedStyle(n), a = getComputedStyle(o), c = i.perspective || n.style.perspective || "", u = (i.perspectiveOrigin || n.style.perspectiveOrigin || "").trim(), h = a.perspectiveStyle || o.style.perspectiveStyle || "", v = c !== "" && c !== "none" && (u === "center bottom" || u === "50% 100%") && h === "flat";
     e.push(
-      p(
+      m(
         "C5",
         'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
         "perspective:not-none, origin:center bottom, chrome-style:flat",
-        `perspective=${c} origin=${u} chrome-style=${m}`,
-        g
+        `perspective=${c} origin=${u} chrome-style=${h}`,
+        v
       )
     );
   }
   {
-    let l = !1, i = "absent";
+    let i = !1, a = "absent";
     try {
       for (const c of Array.from(document.styleSheets)) {
         let u = [];
@@ -763,81 +857,81 @@ function M() {
         } catch {
           continue;
         }
-        for (const m of u)
-          if (m.name === "stage-spin") {
-            const v = Array.from(m.cssRules), b = v.find((C) => C.keyText === "0%" || C.keyText === "from"), g = v.find((C) => C.keyText === "100%" || C.keyText === "to"), $ = b?.style.transform ?? "", D = g?.style.transform ?? "", R = /rotateY\(\s*0(?:deg)?\s*\)/;
-            l = R.test($) && R.test(D), i = `0%=${$ || "n/a"} 100%=${D || "n/a"}`;
+        for (const h of u)
+          if (h.name === "stage-spin") {
+            const f = Array.from(h.cssRules), y = f.find((C) => C.keyText === "0%" || C.keyText === "from"), v = f.find((C) => C.keyText === "100%" || C.keyText === "to"), N = y?.style.transform ?? "", S = v?.style.transform ?? "", w = /rotateY\(\s*0(?:deg)?\s*\)/;
+            i = w.test(N) && w.test(S), a = `0%=${N || "n/a"} 100%=${S || "n/a"}`;
             break;
           }
-        if (i !== "absent") break;
+        if (a !== "absent") break;
       }
     } catch {
-      i = "inspection-error";
+      a = "inspection-error";
     }
     e.push(
-      p(
+      m(
         "C6",
         "@keyframes stage-spin 0% AND 100% anchor at rotateY(0)",
         "both frames rotateY(0)",
-        i,
-        l
+        a,
+        i
       )
     );
   }
   {
-    const l = document.documentElement, i = getComputedStyle(l), c = i.getPropertyValue("--panel-open-dur").trim() || l.style.getPropertyValue("--panel-open-dur").trim(), u = i.getPropertyValue("--panel-close-dur").trim() || l.style.getPropertyValue("--panel-close-dur").trim(), m = P(c) || parseFloat(c) * (c.endsWith("s") && !c.endsWith("ms") ? 1e3 : 1), f = P(u) || parseFloat(u) * (u.endsWith("s") && !u.endsWith("ms") ? 1e3 : 1), v = Number.isFinite(m) && Number.isFinite(f) && m > f;
+    const i = document.documentElement, a = getComputedStyle(i), c = a.getPropertyValue("--panel-open-dur").trim() || i.style.getPropertyValue("--panel-open-dur").trim(), u = a.getPropertyValue("--panel-close-dur").trim() || i.style.getPropertyValue("--panel-close-dur").trim(), h = P(c) || parseFloat(c) * (c.endsWith("s") && !c.endsWith("ms") ? 1e3 : 1), g = P(u) || parseFloat(u) * (u.endsWith("s") && !u.endsWith("ms") ? 1e3 : 1), f = Number.isFinite(h) && Number.isFinite(g) && h > g;
     e.push(
-      p("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${c || "n/a"} close=${u || "n/a"}`, v)
+      m("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${c || "n/a"} close=${u || "n/a"}`, f)
     );
   }
-  if (!a)
-    e.push(p("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
+  if (!r)
+    e.push(m("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
   else {
-    const l = getComputedStyle(a), i = l.animationName || "", c = l.transitionProperty || "", u = (i === "" || i === "none") && (c === "" || c === "none" || c === "all");
+    const i = getComputedStyle(r), a = i.animationName || "", c = i.transitionProperty || "", u = (a === "" || a === "none") && (c === "" || c === "none" || c === "all");
     e.push(
-      p(
+      m(
         "C8",
         "BellCutout zero computed animation/transition",
         "animation:none AND transition:none",
-        `animation=${i || "n/a"} transition=${c || "n/a"}`,
+        `animation=${a || "n/a"} transition=${c || "n/a"}`,
         u
       )
     );
   }
   if (!t)
-    e.push(p("C9", "mount closed-state clipPath", O, "absent", !1));
+    e.push(m("C9", "mount closed-state clipPath", k, "absent", !1));
   else {
-    const l = t.style.clipPath, i = getComputedStyle(t), c = l || i.clipPath || "", u = c === O;
-    e.push(p("C9", "mount closed-state clipPath", O, c || "n/a", u));
+    const i = t.style.clipPath, a = getComputedStyle(t), c = i || a.clipPath || "", u = c === k;
+    e.push(m("C9", "mount closed-state clipPath", k, c || "n/a", u));
   }
-  if (!r)
-    e.push(p("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
+  if (!l)
+    e.push(m("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
   else {
-    const l = r.parentElement, i = l === document.body;
+    const i = l.parentElement, a = i === document.body;
     e.push(
-      p(
+      m(
         "C10",
         "bell-popover parentElement === document.body (open)",
         "body",
-        l === document.body ? "body" : l?.tagName ?? "n/a",
-        i
+        i === document.body ? "body" : i?.tagName ?? "n/a",
+        a
       )
     );
   }
   if (!n)
-    e.push(p("C11", "coordinator overflow === visible", "visible", "absent", !1));
+    e.push(m("C11", "coordinator overflow === visible", "visible", "absent", !1));
   else {
-    const i = getComputedStyle(n).overflow || n.style.overflow || "", c = i === "visible";
-    e.push(p("C11", "coordinator overflow === visible", "visible", i || "n/a", c));
+    const a = getComputedStyle(n).overflow || n.style.overflow || "", c = a === "visible";
+    e.push(m("C11", "coordinator overflow === visible", "visible", a || "n/a", c));
   }
   if (!d)
-    e.push(p("C12", "toolbar clipPath = inset(0 -40 -40 -40)", L, "absent", !1));
+    e.push(m("C12", "toolbar clipPath = inset(0 -40 -40 -40)", M, "absent", !1));
   else {
-    const l = d.style.clipPath, i = getComputedStyle(d), c = l || i.clipPath || "", u = c === L;
-    e.push(p("C12", "toolbar clipPath = inset(0 -40 -40 -40)", L, c || "n/a", u));
+    const i = d.style.clipPath, a = getComputedStyle(d), c = i || a.clipPath || "", u = c === M;
+    e.push(m("C12", "toolbar clipPath = inset(0 -40 -40 -40)", M, c || "n/a", u));
   }
   return e.push(
-    p(
+    m(
       "C13",
       "same-position slide via WAAPI (mid-transition getAnimations().length > 0)",
       "WAAPI driver wired in orchestrator (source-proof)",
@@ -845,7 +939,7 @@ function M() {
       "wiring_only"
     )
   ), e.push(
-    p(
+    m(
       "C14",
       'cross-position handoff transitionend filtered by propertyName="max-height"',
       "transitionend filter wired in orchestrator (source-proof)",
@@ -854,11 +948,11 @@ function M() {
     )
   ), e;
 }
-function Ne(e) {
-  return M().find((t) => t.id === e);
+function ke(e) {
+  return F().find((t) => t.id === e);
 }
-function we() {
-  const e = T();
+function Me() {
+  const e = D();
   return { q12: [
     {
       id: "Q12-12",
@@ -867,74 +961,74 @@ function we() {
       actual: `valid=${e.valid} mount=${e.mount} chrome=${e.chrome} frozen=${e.frozen} orphans=[${e.orphans.join(",")}]`,
       pass: e.valid
     }
-  ], cc: M() };
+  ], cc: F() };
 }
-function Se() {
+function De() {
   return {
-    enable: Ee,
-    disable: _e,
-    isEnabled: () => E,
-    getLastReport: () => _,
+    enable: $e,
+    disable: Re,
+    isEnabled: () => T,
+    getLastReport: () => L,
     recordTransition: (e) => {
-      E && (_ = { ...e, ...T() });
+      T && (L = { ...e, ...D() });
     },
     assertOnce: () => {
-      const e = T();
-      return _ = e, e;
+      const e = D();
+      return L = e, e;
     },
-    assertCcOnly: M,
-    getCcRowById: Ne,
-    assertPanelTruths: we
+    assertCcOnly: F,
+    getCcRowById: ke,
+    assertPanelTruths: Me
   };
 }
-function Ee() {
-  if (E = !0, typeof window > "u") return;
-  window.__panelsAsserter || (window.__panelsAsserter = Se(), console.info(
+function $e() {
+  if (T = !0, typeof window > "u") return;
+  window.__panelsAsserter || (window.__panelsAsserter = De(), console.info(
     "[panels] asserter enabled (P3b Q12-12 + P6 W5 cc:C1..C14). Inspect via window.__panelsAsserter."
   ));
 }
-function _e() {
-  E = !1;
+function Re() {
+  T = !1;
 }
 export {
-  Ve as COMMITS,
-  Te as CatalogAddShell,
-  le as CatalogFooter,
-  Ie as CatalogReplaceShell,
-  k as CatalogStateContext,
-  oe as CloneCard,
-  ne as CloneStage,
-  G as MOCK_DEFAULT_LENS,
-  W as MOCK_LENSES,
-  ue as MOCK_PAGES,
-  Q as MOCK_TILES_BY_LENS,
-  Me as PANEL_IDS,
-  de as PageMgmtFooter,
-  ke as PageMgmtShell,
-  X as PageMgmtStateContext,
-  w as PanelChrome,
-  qe as PanelHost,
-  $e as PanelHostShell,
-  N as PanelMount,
-  Be as PanelProvider,
-  De as PanelSlot,
-  Le as SettingsShell,
-  M as assertCcOnly,
-  T as assertPanelDomShape,
-  we as assertPanelTruths,
-  He as deriveSurfaceState,
-  _e as disablePanelAsserter,
-  Ee as enablePanelAsserter,
-  Ne as getCcRowById,
-  Ue as initialState,
-  z as positionKey,
-  Ye as reducer,
-  Pe as transitionToPanel,
-  re as useCatalogState,
-  ce as usePageMgmtState,
-  Z as usePanelContext,
-  I as usePanelContextOptional,
-  Ke as usePanelCoordinator,
+  Xe as COMMITS,
+  He as CatalogAddShell,
+  be as CatalogFooter,
+  qe as CatalogReplaceShell,
+  R as CatalogStateContext,
+  ie as CloneCard,
+  le as CloneStage,
+  X as MOCK_DEFAULT_LENS,
+  Q as MOCK_LENSES,
+  _e as MOCK_PAGES,
+  J as MOCK_TILES_BY_LENS,
+  Ye as PANEL_IDS,
+  Pe as PageMgmtFooter,
+  Ue as PageMgmtShell,
+  Z as PageMgmtStateContext,
+  A as PanelChrome,
+  Je as PanelHost,
+  Ke as PanelHostShell,
+  E as PanelMount,
+  Ze as PanelProvider,
+  We as PanelSlot,
+  Be as SettingsShell,
+  F as assertCcOnly,
+  D as assertPanelDomShape,
+  Me as assertPanelTruths,
+  et as deriveSurfaceState,
+  Re as disablePanelAsserter,
+  $e as enablePanelAsserter,
+  ke as getCcRowById,
+  tt as initialState,
+  B as positionKey,
+  nt as reducer,
+  Oe as transitionToPanel,
+  ve as useCatalogState,
+  Ce as usePageMgmtState,
+  oe as usePanelContext,
+  $ as usePanelContextOptional,
+  st as usePanelCoordinator,
   q as useReducedMotionPanel,
-  Re as useTransitionToPanel
+  je as useTransitionToPanel
 };