@mt-gloss/ui 0.1.80 → 0.1.81

package/index.js

@@ -1,8 +1,8 @@
 import { u as Ze, C as qe } from "./Expandable-Deyl6mWK.js";
 import { Q as Sr, V as kr, T as Dr, U as xr, a5 as Tr, b8 as Rr, aB as Mr, aj as Pr, $ as Ir, ap as Er, N as Ar, aa as Fr, bo as Or, P as Lr, B as $r, a as zr, A as Br, K as Kr, bj as Gr, J as Hr, L as Wr, E as Vr, D as jr, H as Ur, F as Yr, by as Zr, b as qr, c as Qr, O as Xr, q as Jr, af as es, aP as ts, A as as, K as ns, J as rs, L as ss, E as is, D as os, H as ls, F as cs, b1 as ds, b4 as us, b3 as ms, b2 as gs, b5 as ps, aE as hs, a7 as fs, a6 as bs, as as vs, m as ys, o as ws, aH as _s, ad as Cs, ba as Ns, ab as Ss, bp as ks, _ as Ds, bI as xs, bH as Ts, bJ as Rs, ar as Ms, aS as Ps, bc as Is, bN as Es, bw as As, p as Fs, ao as Os, bC as Ls, bt as $s, a2 as zs, at as Bs, a4 as Ks, bB as Gs, bS as Hs, G as Ws, f as Vs, ac as js, bK as Us, aV as Ys, t as Zs, x as qs, I as Qs, i as Xs, ay as Js, bO as ei, M as ti, y as ai, W as ni, Z as ri, X as si, Y as ii, au as oi, bi as li, bQ as ci, bM as di, aq as ui, w as mi, bq as gi, aU as pi, al as hi, aM as fi, ai as bi, an as vi, aw as yi, aT as wi, ae as _i, av as Ci, e as Ni, R as Si, l as ki, r as Di, aJ as xi, bz as Ti, bA as Ri, ak as Mi, ag as Pi, j as Ii, z as Ei, b9 as Ai, ah as Fi, bP as Oi, be as Li, bh as $i, bf as zi, bg as Bi, k as Ki, bb as Gi, bn as Hi, S as Wi, bl as Vi, bm as ji, ax as Ui, bd as Yi, bR as Zi, am as qi, v as Qi, bL as Xi, n as Ji, h as eo, s as to, a0 as ao, a1 as no, a9 as ro, bk as so, bx as io, bE as oo, aC as lo, aD as co, a8 as uo, aQ as mo, aR as go, aF as po, aG as ho, aI as fo, aX as bo, aY as vo, br as yo, bG as wo, bF as _o, a_ as Co, a$ as No, az as So, aA as ko, b7 as Do, b6 as xo, b0 as To, aN as Ro, aO as Mo, aZ as Po, aK as Io, aL as Eo, d as Ao, bD as Fo, bs as Oo, bu as Lo, bv as $o, aW as zo, a3 as Bo, bT as Ko, g as Go } from "./Expandable-Deyl6mWK.js";
-import { jsxs as v, jsx as r, Fragment as $ } from "react/jsx-runtime";
+import { jsxs as w, jsx as r, Fragment as $ } from "react/jsx-runtime";
 import * as B from "react";
-import F, { useRef as P, useEffect as A, useState as E, useCallback as _, useId as Qe, forwardRef as Xe, useMemo as re, createContext as Je, useContext as et } from "react";
+import F, { useRef as P, useEffect as A, useState as E, useCallback as C, useId as Qe, forwardRef as Xe, useMemo as re, createContext as Je, useContext as et } from "react";
 import { motion as G, useMotionValue as tt, AnimatePresence as at, useDragControls as nt } from "framer-motion";
 import { B as rt, a as X, b as ce, U as fe } from "./UIContext-DP6JGCto.js";
 import { c as Wo, u as Vo } from "./UIContext-DP6JGCto.js";
@@ -36,63 +36,63 @@ function nn(e) {
     isItemDisabled: l,
     onSelect: u,
     onEscape: c
-  } = e, [m, f] = E(-1), d = n !== void 0 ? n : m, g = _(
+  } = e, [m, h] = E(-1), d = n !== void 0 ? n : m, g = C(
     (p) => {
-      n === void 0 && f(p), a?.(p);
+      n === void 0 && h(p), a?.(p);
     },
     [n, a]
-  ), w = _(() => t.map((p, b) => ({ item: p, index: b })).filter(({ item: p, index: b }) => !l?.(p, b)).map(({ index: p }) => p), [t, l]), N = _(
-    (p, b) => {
-      const y = w();
-      if (y.length === 0) return -1;
-      const D = y.indexOf(p);
+  ), y = C(() => t.map((p, v) => ({ item: p, index: v })).filter(({ item: p, index: v }) => !l?.(p, v)).map(({ index: p }) => p), [t, l]), k = C(
+    (p, v) => {
+      const _ = y();
+      if (_.length === 0) return -1;
+      const D = _.indexOf(p);
       if (D === -1)
-        return b === 1 ? y.find((x) => x > p) ?? (i ? y[0] : -1) : [...y].reverse().find((I) => I < p) ?? (i ? y[y.length - 1] : -1);
-      let T = D + b;
-      return i ? T = (T + y.length) % y.length : T = Math.max(0, Math.min(y.length - 1, T)), y[T];
+        return v === 1 ? _.find((x) => x > p) ?? (i ? _[0] : -1) : [..._].reverse().find((I) => I < p) ?? (i ? _[_.length - 1] : -1);
+      let T = D + v;
+      return i ? T = (T + _.length) % _.length : T = Math.max(0, Math.min(_.length - 1, T)), _[T];
     },
-    [w, i]
-  ), h = _(() => {
-    const p = w();
+    [y, i]
+  ), f = C(() => {
+    const p = y();
     p.length > 0 && g(p[0]);
-  }, [w, g]), S = _(() => {
-    const p = w();
+  }, [y, g]), b = C(() => {
+    const p = y();
     p.length > 0 && g(p[p.length - 1]);
-  }, [w, g]), M = _(() => {
-    const p = N(d, 1);
+  }, [y, g]), M = C(() => {
+    const p = k(d, 1);
     p !== -1 && g(p);
-  }, [d, N, g]), C = _(() => {
-    const p = N(d, -1);
+  }, [d, k, g]), N = C(() => {
+    const p = k(d, -1);
     p !== -1 && g(p);
-  }, [d, N, g]), k = _(() => {
+  }, [d, k, g]), S = C(() => {
     g(-1);
-  }, [g]), R = _(
+  }, [g]), R = C(
     (p) => {
       if (!o) return;
-      const { key: b } = p, y = b === "ArrowUp" && (s === "vertical" || s === "both"), D = b === "ArrowDown" && (s === "vertical" || s === "both"), T = b === "ArrowLeft" && (s === "horizontal" || s === "both"), x = b === "ArrowRight" && (s === "horizontal" || s === "both");
-      if (y || T) {
-        p.preventDefault(), d === -1 ? S() : C();
+      const { key: v } = p, _ = v === "ArrowUp" && (s === "vertical" || s === "both"), D = v === "ArrowDown" && (s === "vertical" || s === "both"), T = v === "ArrowLeft" && (s === "horizontal" || s === "both"), x = v === "ArrowRight" && (s === "horizontal" || s === "both");
+      if (_ || T) {
+        p.preventDefault(), d === -1 ? b() : N();
         return;
       }
       if (D || x) {
-        p.preventDefault(), d === -1 ? h() : M();
+        p.preventDefault(), d === -1 ? f() : M();
         return;
       }
-      if (b === "Home") {
-        p.preventDefault(), h();
+      if (v === "Home") {
+        p.preventDefault(), f();
         return;
       }
-      if (b === "End") {
-        p.preventDefault(), S();
+      if (v === "End") {
+        p.preventDefault(), b();
         return;
       }
-      if ((b === "Enter" || b === " ") && d >= 0 && d < t.length) {
+      if ((v === "Enter" || v === " ") && d >= 0 && d < t.length) {
         p.preventDefault();
         const I = t[d];
         l?.(I, d) || u?.(I, d);
         return;
       }
-      if (b === "Escape") {
+      if (v === "Escape") {
         c?.();
         return;
       }
@@ -102,10 +102,10 @@ function nn(e) {
       s,
       d,
       t,
-      h,
-      S,
+      f,
+      b,
       M,
-      C,
+      N,
       l,
       u,
       c
@@ -115,11 +115,11 @@ function nn(e) {
     focusedIndex: d,
     setFocusedIndex: g,
     handleKeyDown: R,
-    focusFirst: h,
-    focusLast: S,
+    focusFirst: f,
+    focusLast: b,
     focusNext: M,
-    focusPrevious: C,
-    resetFocus: k
+    focusPrevious: N,
+    resetFocus: S
   };
 }
 const mt = ({
@@ -135,14 +135,14 @@ const mt = ({
     Number.isNaN(g) || a(g);
   }, c = (g) => {
     g.key === "Enter" ? (g.preventDefault(), u()) : g.key === "Escape" && (g.preventDefault(), i?.());
-  }, m = Qe(), f = `gloss-target-input-field-${m}`, d = s ? `gloss-target-input-hint-${m}` : void 0;
-  return /* @__PURE__ */ v("div", { className: "gloss-target-input", children: [
-    /* @__PURE__ */ r("label", { className: "gloss-target-input__label", htmlFor: f, children: e }),
-    /* @__PURE__ */ v("div", { className: "gloss-target-input__field-row", children: [
+  }, m = Qe(), h = `gloss-target-input-field-${m}`, d = s ? `gloss-target-input-hint-${m}` : void 0;
+  return /* @__PURE__ */ w("div", { className: "gloss-target-input", children: [
+    /* @__PURE__ */ r("label", { className: "gloss-target-input__label", htmlFor: h, children: e }),
+    /* @__PURE__ */ w("div", { className: "gloss-target-input__field-row", children: [
       /* @__PURE__ */ r(
         "input",
         {
-          id: f,
+          id: h,
           type: "number",
           className: "gloss-target-input__field",
           value: o,
@@ -155,7 +155,7 @@ const mt = ({
       t && /* @__PURE__ */ r("span", { className: "gloss-target-input__unit", children: t })
     ] }),
     s && /* @__PURE__ */ r("p", { id: d, className: "gloss-target-input__hint", children: s }),
-    /* @__PURE__ */ v("div", { className: "gloss-target-input__actions", children: [
+    /* @__PURE__ */ w("div", { className: "gloss-target-input__actions", children: [
       /* @__PURE__ */ r(
         "button",
         {
@@ -295,7 +295,7 @@ function yt({
   overflowActions: s,
   onClose: o
 }) {
-  const [l, u] = E(null), c = P(null), m = _(() => {
+  const [l, u] = E(null), c = P(null), m = C(() => {
     if (!t) return { ...ye, top: 0, left: 0 };
     const g = t.getBoundingClientRect();
     return {
@@ -306,18 +306,18 @@ function yt({
   }, [t]);
   if (A(() => {
     if (!e) return;
-    const g = (w) => {
-      w.key === "Escape" && o();
+    const g = (y) => {
+      y.key === "Escape" && o();
     };
     return document.addEventListener("keydown", g), () => document.removeEventListener("keydown", g);
   }, [e, o]), A(() => {
     if (!e) return;
-    const g = (w) => {
-      c.current && !c.current.contains(w.target) && o();
+    const g = (y) => {
+      c.current && !c.current.contains(y.target) && o();
     };
     return document.addEventListener("pointerdown", g, !0), () => document.removeEventListener("pointerdown", g, !0);
   }, [e, o]), !e) return null;
-  const f = s && s.length > 0, d = /* @__PURE__ */ v(
+  const h = s && s.length > 0, d = /* @__PURE__ */ w(
     "div",
     {
       ref: c,
@@ -352,8 +352,8 @@ function yt({
             children: "Show on graph"
           }
         ),
-        f && /* @__PURE__ */ r("div", { style: vt }),
-        f && s?.map((g) => /* @__PURE__ */ r(
+        h && /* @__PURE__ */ r("div", { style: vt }),
+        h && s?.map((g) => /* @__PURE__ */ r(
           "button",
           {
             role: "menuitem",
@@ -557,7 +557,7 @@ function Ae(e) {
     staggerMs: u
   } = e;
   if (!t) return null;
-  const c = n === "grow", m = c ? s + a : s + i, f = c ? o - i : o - a, d = Math.max(0, f - m);
+  const c = n === "grow", m = c ? s + a : s + i, h = c ? o - i : o - a, d = Math.max(0, h - m);
   return /* @__PURE__ */ r(
     "div",
     {
@@ -577,7 +577,7 @@ function Ae(e) {
         left: m,
         width: d
       },
-      children: (n === "grow" ? [0, 1, 2, 3, 4] : [4, 3, 2, 1, 0]).map((w, N) => /* @__PURE__ */ r(
+      children: (n === "grow" ? [0, 1, 2, 3, 4] : [4, 3, 2, 1, 0]).map((y, k) => /* @__PURE__ */ r(
         G.span,
         {
           className: [
@@ -592,11 +592,11 @@ function Ae(e) {
             duration: l / 1e3,
             repeat: 1 / 0,
             ease: "easeInOut",
-            delay: w * u / 1e3
+            delay: y * u / 1e3
           },
           children: "›"
         },
-        N
+        k
       ))
     }
   );
@@ -625,7 +625,7 @@ function Ce(e) {
 }
 function Fe(e) {
   const { visible: t, currentTarget: n, previewTarget: a, mode: i, showSizeTooltip: s = !0 } = e;
-  return !t || s === !1 ? null : /* @__PURE__ */ v(
+  return !t || s === !1 ? null : /* @__PURE__ */ w(
     G.div,
     {
       "aria-hidden": "true",
@@ -637,7 +637,7 @@ function Fe(e) {
       exit: { opacity: 0 },
       transition: { duration: 0.18 },
       children: [
-        i === "directional" && /* @__PURE__ */ v($, { children: [
+        i === "directional" && /* @__PURE__ */ w($, { children: [
           /* @__PURE__ */ r(
             _e,
             {
@@ -654,7 +654,7 @@ function Fe(e) {
             }
           )
         ] }),
-        i === "sized" && /* @__PURE__ */ v($, { children: [
+        i === "sized" && /* @__PURE__ */ w($, { children: [
           /* @__PURE__ */ r("span", { className: "gloss-resize-pill-tooltip__label", children: Ce(n) }),
           /* @__PURE__ */ r("span", { className: "gloss-resize-pill-tooltip__arrow", children: "→" }),
           /* @__PURE__ */ r("span", { className: "gloss-resize-pill-tooltip__label", children: Ce(a) })
@@ -725,13 +725,13 @@ function kt(e) {
     buttonHeight: c,
     buttonWidth: m
   } = e;
-  let f = null;
+  let h = null;
   if (a === "directional") {
     const d = typeof t == "number" && typeof n == "number" && t < n ? "left" : "right";
-    f = /* @__PURE__ */ r(Ct, { direction: d });
+    h = /* @__PURE__ */ r(Ct, { direction: d });
   } else
-    f = /* @__PURE__ */ r(St, { target: t });
-  return /* @__PURE__ */ v(
+    h = /* @__PURE__ */ r(St, { target: t });
+  return /* @__PURE__ */ w(
     "button",
     {
       type: "button",
@@ -750,7 +750,7 @@ function kt(e) {
       onPointerLeave: () => u?.(),
       "aria-label": `Resize to ${String(t)}`,
       children: [
-        /* @__PURE__ */ r("span", { className: "gloss-resize-pill__glyph", children: f }),
+        /* @__PURE__ */ r("span", { className: "gloss-resize-pill__glyph", children: h }),
         /* @__PURE__ */ r("span", { className: "gloss-resize-pill__check", children: /* @__PURE__ */ r(Nt, {}) })
       ]
     }
@@ -761,8 +761,8 @@ const Dt = Xe(
     const a = {
       ...Ie,
       ...t.physics
-    }, i = t.pillVisible && !t.forceIdle && t.resizePillEnabled !== !1, s = t.availableTargets, o = t.orientation ?? "vertical", l = t.buttonHover !== null && t.previewTarget !== void 0 && t.previewTarget !== null && t.previewTarget !== t.currentTarget && !t.forceIdle && t.resizePillEnabled !== !1, u = l && t.previewTarget != null ? t.resolveTargetWidth(t.previewTarget) : t.hostWidth, c = t.chainStartX ?? 0, m = t.chainEndX ?? t.hostWidth, f = t.chainDirection ?? "grow";
-    return /* @__PURE__ */ v(at, { children: [
+    }, i = t.pillVisible && !t.forceIdle && t.resizePillEnabled !== !1, s = t.availableTargets, o = t.orientation ?? "vertical", l = t.buttonHover !== null && t.previewTarget !== void 0 && t.previewTarget !== null && t.previewTarget !== t.currentTarget && !t.forceIdle && t.resizePillEnabled !== !1, u = l && t.previewTarget != null ? t.resolveTargetWidth(t.previewTarget) : t.hostWidth, c = t.chainStartX ?? 0, m = t.chainEndX ?? t.hostWidth, h = t.chainDirection ?? "grow";
+    return /* @__PURE__ */ w(at, { children: [
       i && /* @__PURE__ */ r(
         G.div,
         {
@@ -828,7 +828,7 @@ const Dt = Xe(
         Ae,
         {
           visible: !0,
-          direction: f,
+          direction: h,
           pillClearancePx: a.pillClearancePx,
           ghostClearancePx: a.ghostClearancePx,
           startX: c,
@@ -857,54 +857,54 @@ function fn(e) {
   const t = {
     ...Ie,
     ...e.physics
-  }, [n, a] = E("idle"), [i, s] = E(e.currentTarget), [o, l] = E(null), u = P(!1), c = P(null), m = P(null), f = P(e.currentTarget);
-  f.current = e.currentTarget;
+  }, [n, a] = E("idle"), [i, s] = E(e.currentTarget), [o, l] = E(null), u = P(!1), c = P(null), m = P(null), h = P(e.currentTarget);
+  h.current = e.currentTarget;
   const d = P(e.onCommit);
   d.current = e.onCommit;
   const g = P(e.forceIdle);
   g.current = e.forceIdle;
-  const w = P(e.onPhaseChange);
-  w.current = e.onPhaseChange, A(() => {
-    w.current?.(n);
+  const y = P(e.onPhaseChange);
+  y.current = e.onPhaseChange, A(() => {
+    y.current?.(n);
   }, [n]), A(() => {
     e.forceIdle && (m.current && (clearTimeout(m.current), m.current = null), a("idle"), l(null));
   }, [e.forceIdle]), A(() => () => {
     c.current && clearTimeout(c.current), m.current && clearTimeout(m.current);
   }, []);
-  const N = _(() => {
-    u.current || g.current || (s(f.current), a("pill-visible"));
-  }, []), h = _(() => {
+  const k = C(() => {
+    u.current || g.current || (s(h.current), a("pill-visible"));
+  }, []), f = C(() => {
     a("idle"), l(null);
-  }, []), S = _(
+  }, []), b = C(
     (x) => {
       u.current = !0, c.current && clearTimeout(c.current), c.current = setTimeout(() => {
         u.current = !1, c.current = null;
       }, t.fadeGraceMs), l(null), a("fading"), d.current(x);
     },
     [t.fadeGraceMs]
-  ), M = _(() => {
-    m.current && (clearTimeout(m.current), m.current = null), N();
-  }, [N]), C = _(() => {
+  ), M = C(() => {
+    m.current && (clearTimeout(m.current), m.current = null), k();
+  }, [k]), N = C(() => {
     m.current && clearTimeout(m.current), m.current = setTimeout(() => {
-      h(), m.current = null;
+      f(), m.current = null;
     }, t.hoverHideGraceMs);
-  }, [h, t.hoverHideGraceMs]), k = _(() => {
+  }, [f, t.hoverHideGraceMs]), S = C(() => {
     m.current && (clearTimeout(m.current), m.current = null);
-  }, []), R = _(() => {
+  }, []), R = C(() => {
     m.current && clearTimeout(m.current), m.current = setTimeout(() => {
-      h(), m.current = null;
+      f(), m.current = null;
     }, t.hoverHideGraceMs);
-  }, [h, t.hoverHideGraceMs]), p = _((x) => {
-    const I = f.current;
+  }, [f, t.hoverHideGraceMs]), p = C((x) => {
+    const I = h.current;
     let L;
     x === "compact" || x === "medium" || x === "full" ? L = x : typeof I == "number" && typeof x == "number" ? L = x > I ? "grow" : "shrink" : L = "grow", l(L), a("pre-commit");
-  }, []), b = _(() => {
+  }, []), v = C(() => {
     l(null), a((x) => x === "pre-commit" ? "pill-visible" : x);
-  }, []), y = _(
+  }, []), _ = C(
     (x) => {
-      S(x);
+      b(x);
     },
-    [S]
+    [b]
   );
   let D = null;
   return o !== null && (o === "compact" || o === "medium" || o === "full" ? (D = o, D === e.currentTarget && (D = null)) : o === "grow" && typeof e.currentTarget == "number" ? D = e.currentTarget + 1 : o === "shrink" && typeof e.currentTarget == "number" && (D = e.currentTarget - 1)), {
@@ -915,14 +915,14 @@ function fn(e) {
     previewTarget: D,
     handlers: {
       onTriggerEnter: M,
-      onTriggerLeave: C,
-      onPillEnter: k,
+      onTriggerLeave: N,
+      onPillEnter: S,
       onPillLeave: R,
       onButtonEnter: p,
-      onButtonLeave: b,
-      onButtonClick: y
+      onButtonLeave: v,
+      onButtonClick: _
     },
-    commit: S
+    commit: b
   };
 }
 function bn(e) {
@@ -1210,22 +1210,22 @@ function Oe({
   onCreatePage: o,
   onManagePages: l
 }) {
-  const u = _(
+  const u = C(
     (d) => {
       s(d), t();
     },
     [s, t]
-  ), c = _(
+  ), c = C(
     (d, g) => {
       (g.key === "Enter" || g.key === " ") && (g.preventDefault(), u(d));
     },
     [u]
-  ), m = _(() => {
+  ), m = C(() => {
     o(), t();
-  }, [o, t]), f = _(() => {
+  }, [o, t]), h = C(() => {
     l(), t();
   }, [l, t]);
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     rt,
     {
       definition: {
@@ -1241,7 +1241,7 @@ function Oe({
       children: [
         /* @__PURE__ */ r("ul", { role: "menu", className: "gloss-page-dropdown__list", children: a.map((d) => {
           const g = d.id === i;
-          return /* @__PURE__ */ v(
+          return /* @__PURE__ */ w(
             "li",
             {
               role: "menuitemradio",
@@ -1250,7 +1250,7 @@ function Oe({
               tabIndex: 0,
               className: `gloss-page-dropdown__item${g ? " gloss-page-dropdown__item--active" : ""}`,
               onClick: () => u(d.id),
-              onKeyDown: (w) => c(d.id, w),
+              onKeyDown: (y) => c(d.id, y),
               children: [
                 /* @__PURE__ */ r(
                   "span",
@@ -1287,7 +1287,7 @@ function Oe({
           {
             role: "menuitem",
             className: "gloss-page-dropdown__action gloss-page-dropdown__action--muted",
-            onClick: f,
+            onClick: h,
             children: "Manage pages"
           }
         )
@@ -1307,12 +1307,12 @@ const Et = function({
   displayMode: u = "count",
   activePage: c
 }) {
-  const m = P(null), [f, d] = E(!1), g = _(() => {
-    d((S) => !S);
-  }, []), w = _(() => {
+  const m = P(null), [h, d] = E(!1), g = C(() => {
+    d((b) => !b);
+  }, []), y = C(() => {
     d(!1);
-  }, []), N = a[t]?.id ?? "";
-  return /* @__PURE__ */ v(
+  }, []), k = a[t]?.id ?? "";
+  return /* @__PURE__ */ w(
     "div",
     {
       className: "gloss-page-chip",
@@ -1332,13 +1332,13 @@ const Et = function({
           {
             className: `gloss-page-chip__trigger${u === "name" ? " gloss-page-chip__trigger--name" : ""}`,
             "aria-haspopup": "menu",
-            "aria-expanded": f,
+            "aria-expanded": h,
             "aria-label": u === "name" ? `${c ?? "Page"}. Click to switch pages.` : `Page ${t + 1} of ${n}. Click to switch pages.`,
             onClick: g,
-            children: u === "name" ? /* @__PURE__ */ v($, { children: [
+            children: u === "name" ? /* @__PURE__ */ w($, { children: [
               /* @__PURE__ */ r("span", { className: "gloss-page-chip__trigger-name", children: c ?? "" }),
               /* @__PURE__ */ r("span", { className: "gloss-page-chip__trigger-chevron", "aria-hidden": "true", children: "▾" })
-            ] }) : /* @__PURE__ */ v($, { children: [
+            ] }) : /* @__PURE__ */ w($, { children: [
               t + 1,
               " / ",
               n
@@ -1348,11 +1348,11 @@ const Et = function({
         /* @__PURE__ */ r(
           Oe,
           {
-            open: f,
-            onDismiss: w,
+            open: h,
+            onDismiss: y,
             anchorRef: m,
             pages: a,
-            activePageId: N,
+            activePageId: k,
             onPageChange: i,
             onCreatePage: s,
             onManagePages: o
@@ -2043,28 +2043,28 @@ const Ht = ({
 }) => {
   const s = P(null), o = P([]), l = Gt(), u = re(() => Array.from(e), [e]);
   if (u.length === 0) return null;
-  const c = a ? `Configure ${a}: choose a dimension` : void 0, m = l ? "10ms" : "200ms", f = (d, g) => {
-    const w = u.length - 1, N = (h) => {
-      const S = o.current[h];
-      S && S.focus();
+  const c = a ? `Configure ${a}: choose a dimension` : void 0, m = l ? "10ms" : "200ms", h = (d, g) => {
+    const y = u.length - 1, k = (f) => {
+      const b = o.current[f];
+      b && b.focus();
     };
     switch (d.key) {
       case "ArrowRight":
       case "ArrowDown": {
-        d.preventDefault(), N(g === w ? 0 : g + 1);
+        d.preventDefault(), k(g === y ? 0 : g + 1);
         break;
       }
       case "ArrowLeft":
       case "ArrowUp": {
-        d.preventDefault(), N(g === 0 ? w : g - 1);
+        d.preventDefault(), k(g === 0 ? y : g - 1);
         break;
       }
       case "Home": {
-        d.preventDefault(), N(0);
+        d.preventDefault(), k(0);
         break;
       }
       case "End": {
-        d.preventDefault(), N(w);
+        d.preventDefault(), k(y);
         break;
       }
       case "Enter":
@@ -2088,25 +2088,25 @@ const Ht = ({
         "--gloss-reconfig-backside-buttons-transition-duration": m
       },
       children: u.map((d, g) => {
-        const w = Kt[d], N = n === d;
-        return /* @__PURE__ */ v(
+        const y = Kt[d], k = n === d;
+        return /* @__PURE__ */ w(
           "button",
           {
-            ref: (h) => {
-              o.current[g] = h;
+            ref: (f) => {
+              o.current[g] = f;
             },
             type: "button",
             "data-dimension": d,
             className: Se(
               "gloss-reconfig-backside-buttons__button",
-              N && "gloss-reconfig-backside-buttons__button--active"
+              k && "gloss-reconfig-backside-buttons__button--active"
             ),
-            "aria-current": N ? "true" : void 0,
+            "aria-current": k ? "true" : void 0,
             onClick: () => t(d),
-            onKeyDown: (h) => f(h, g),
+            onKeyDown: (f) => h(f, g),
             children: [
               /* @__PURE__ */ r(
-                w,
+                y,
                 {
                   className: "gloss-reconfig-backside-buttons__button-icon",
                   "aria-hidden": "true"
@@ -2297,7 +2297,7 @@ const Vt = function(t) {
       }
     );
   const { cards: n, composite: a } = t;
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
       className: "gloss-metric-group gloss-metric-group--composite",
@@ -2323,7 +2323,7 @@ const Vt = function(t) {
             style: { background: a.accentColor }
           }
         ),
-        a?.label && /* @__PURE__ */ v("div", { className: "gloss-metric-group__label", children: [
+        a?.label && /* @__PURE__ */ w("div", { className: "gloss-metric-group__label", children: [
           /* @__PURE__ */ r("span", { children: a.label }),
           a?.trend && /* @__PURE__ */ r(
             "span",
@@ -2390,17 +2390,17 @@ function Yt() {
       } catch {
       }
   }, [e]);
-  const n = _(
+  const n = C(
     (s, o) => {
       t((l) => ({ ...l, [s]: o }));
     },
     []
-  ), a = _(
+  ), a = C(
     (s) => {
       t((o) => ({ ...o, [s]: V[s] }));
     },
     []
-  ), i = _(() => {
+  ), i = C(() => {
     t({ ...V });
   }, []);
   return { values: e, setValue: n, resetRow: a, resetAll: i };
@@ -2420,7 +2420,7 @@ function qt(e, t) {
   return t >= 1 ? String(Math.round(e)) : t >= 0.1 ? e.toFixed(1) : e.toFixed(2);
 }
 function Qt() {
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "svg",
     {
       width: "14",
@@ -2440,13 +2440,13 @@ function Qt() {
   );
 }
 function Xt({ spec: e, value: t, onChange: n, onReset: a, flashing: i }) {
-  const s = _(
+  const s = C(
     (o) => {
       (o.key === "r" || o.key === "R") && (o.preventDefault(), a());
     },
     [a]
   );
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
       className: `gloss-dev-tuning-panel__row${i ? " gloss-dev-tuning-panel__row--flash" : ""}`,
@@ -2454,7 +2454,7 @@ function Xt({ spec: e, value: t, onChange: n, onReset: a, flashing: i }) {
       onKeyDown: s,
       children: [
         /* @__PURE__ */ r("label", { className: "gloss-dev-tuning-panel__label", htmlFor: `gloss-dtp-${e.key}`, children: e.label }),
-        /* @__PURE__ */ v("span", { className: "gloss-dev-tuning-panel__value", "aria-live": "off", children: [
+        /* @__PURE__ */ w("span", { className: "gloss-dev-tuning-panel__value", "aria-live": "off", children: [
           qt(t, e.step),
           e.unit ? ` ${e.unit}` : ""
         ] }),
@@ -2499,17 +2499,17 @@ function ea(e = {}) {
 }
 ea.displayName = "DevTuningPanel";
 function ta() {
-  const e = Yt(), { values: t, setValue: n, resetRow: a, resetAll: i } = e, [s, o] = E(null), l = P(null), u = _((d) => {
+  const e = Yt(), { values: t, setValue: n, resetRow: a, resetAll: i } = e, [s, o] = E(null), l = P(null), u = C((d) => {
     l.current && clearTimeout(l.current), o(d), l.current = setTimeout(() => {
       o(null), l.current = null;
     }, 200);
-  }, []), c = _(
+  }, []), c = C(
     (d, g) => {
       n(d, g), d === "snapInPx" && g > t.snapOutPx && (n("snapOutPx", g), u("snapOutPx"));
     },
     [n, t.snapOutPx, u]
-  ), m = re(() => Zt, []), f = nt();
-  return /* @__PURE__ */ v(
+  ), m = re(() => Zt, []), h = nt();
+  return /* @__PURE__ */ w(
     G.div,
     {
       className: "gloss-dev-tuning-panel",
@@ -2518,14 +2518,14 @@ function ta() {
       "data-testid": "gloss-dev-tuning-panel",
       drag: !0,
       dragListener: !1,
-      dragControls: f,
+      dragControls: h,
       dragMomentum: !1,
       children: [
-        /* @__PURE__ */ v(
+        /* @__PURE__ */ w(
           "div",
           {
             className: "gloss-dev-tuning-panel__header",
-            onPointerDown: (d) => f.start(d),
+            onPointerDown: (d) => h.start(d),
             children: [
               /* @__PURE__ */ r("span", { className: "gloss-dev-tuning-panel__title", children: "Resize Tuning — dev only" }),
               /* @__PURE__ */ r("span", { className: "gloss-dev-tuning-panel__hint", children: "?devtune=1" })
@@ -2568,11 +2568,11 @@ function Yn({
   bottomY: u,
   enterMs: c = U.envelopeEnterMs,
   exitMs: m = U.envelopeExitMs,
-  className: f,
+  className: h,
   style: d
 }) {
   if (e === "hidden") return null;
-  const g = Math.max(0, i - a), w = Math.max(0, u - l), N = {
+  const g = Math.max(0, i - a), y = Math.max(0, u - l), k = {
     "--gloss-resize-envelope-enter-ms": `${c}ms`,
     "--gloss-resize-envelope-exit-ms": `${m}ms`,
     "--gloss-resize-envelope-origin-x": `${t - a}px`,
@@ -2580,16 +2580,16 @@ function Yn({
     left: a,
     top: l,
     width: g,
-    height: w,
+    height: y,
     ...d
   };
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
-      className: ["gloss-resize-envelope", `gloss-resize-envelope--state-${e}`, f].filter(Boolean).join(" "),
+      className: ["gloss-resize-envelope", `gloss-resize-envelope--state-${e}`, h].filter(Boolean).join(" "),
       "data-state": e,
       "data-testid": "gloss-resize-envelope",
-      style: N,
+      style: k,
       "aria-hidden": "true",
       children: [
         /* @__PURE__ */ r(
@@ -2616,14 +2616,14 @@ function Yn({
             style: { left: g - 1 }
           }
         ),
-        o.filter((h) => h > s && h < i).map((h) => /* @__PURE__ */ r(
+        o.filter((f) => f > s && f < i).map((f) => /* @__PURE__ */ r(
           "div",
           {
             className: "gloss-resize-envelope__snap-line",
             "data-snap-line": !0,
-            style: { left: h - a }
+            style: { left: f - a }
           },
-          h
+          f
         ))
       ]
     }
@@ -2815,8 +2815,8 @@ function nr({
   onPack: l,
   ariaLabel: u
 }) {
-  const c = a ?? "Add card to this cell", m = i ?? u ?? "Pack row — shift cards left", f = t ?? l, { affordancesVisible: d } = Ze();
-  return /* @__PURE__ */ v(B.Fragment, { children: [
+  const c = a ?? "Add card to this cell", m = i ?? u ?? "Pack row — shift cards left", h = t ?? l, { affordancesVisible: d } = Ze();
+  return /* @__PURE__ */ w(B.Fragment, { children: [
     /* @__PURE__ */ r(De, { visible: d, variant: "pack", trigger: "hover+focus", children: /* @__PURE__ */ r(
       "button",
       {
@@ -2844,7 +2844,7 @@ function nr({
         className: ["gloss-empty-cell-pack-affordance", s].filter(Boolean).join(" "),
         style: o,
         onClick: (g) => {
-          g.stopPropagation(), f?.();
+          g.stopPropagation(), h?.();
         },
         children: /* @__PURE__ */ r("span", { "aria-hidden": "true", className: "gloss-empty-cell-pack-affordance__glyph", children: "×" })
       }
@@ -2866,16 +2866,16 @@ function rr({
   return de("drag-ghost", () => {
     if (process.env.NODE_ENV === "production")
       return { values: {}, spec: null, state: "idle", t: performance.now() };
-    const f = m.current?.getBoundingClientRect() ?? null;
+    const h = m.current?.getBoundingClientRect() ?? null;
     return {
       values: {
         x: s.get(),
         y: o.get(),
-        bounds_x: f?.x ?? 0,
-        bounds_y: f?.y ?? 0,
-        bounds_w: f?.width ?? 0,
-        bounds_h: f?.height ?? 0,
-        visible: f ? 1 : 0
+        bounds_x: h?.x ?? 0,
+        bounds_y: h?.y ?? 0,
+        bounds_w: h?.width ?? 0,
+        bounds_h: h?.height ?? 0,
+        visible: h ? 1 : 0
       },
       spec: {
         tint: e,
@@ -2889,38 +2889,38 @@ function rr({
   }), de("commit-ghost-singleton", () => {
     if (process.env.NODE_ENV === "production")
       return { values: {}, spec: null, state: "idle", t: performance.now() };
-    const f = m.current;
-    let d = 0, g = "", w = "", N = "";
-    if (f)
+    const h = m.current;
+    let d = 0, g = "", y = "", k = "";
+    if (h)
       try {
-        const M = window.getComputedStyle(f), C = M.outline || "", k = M.border || "", R = M.boxShadow || "", p = !!C && C !== "none" && !/^0px(\s+none)?(\s+rgba?\(0,\s*0,\s*0,\s*0\))?$/i.test(C), b = !!k && k !== "none" && !/^0px(\s+none)?(\s+rgba?\(0,\s*0,\s*0,\s*0\))?$/i.test(k), y = !!R && R !== "none";
-        d = p || b || y ? 1 : 0, g = p ? C : "", w = b ? k : "", N = y ? R : "";
+        const M = window.getComputedStyle(h), N = M.outline || "", S = M.border || "", R = M.boxShadow || "", p = !!N && N !== "none" && !/^0px(\s+none)?(\s+rgba?\(0,\s*0,\s*0,\s*0\))?$/i.test(N), v = !!S && S !== "none" && !/^0px(\s+none)?(\s+rgba?\(0,\s*0,\s*0,\s*0\))?$/i.test(S), _ = !!R && R !== "none";
+        d = p || v || _ ? 1 : 0, g = p ? N : "", y = v ? S : "", k = _ ? R : "";
       } catch {
       }
-    const h = f?.getBoundingClientRect() ?? null, S = f ? "drag-clone" : "subsumed-by-tracking-outline";
+    const f = h?.getBoundingClientRect() ?? null, b = h ? "drag-clone" : "subsumed-by-tracking-outline";
     return {
       values: {
         x: s.get(),
         y: o.get(),
-        bounds_x: h?.x ?? 0,
-        bounds_y: h?.y ?? 0,
-        bounds_w: h?.width ?? 0,
-        bounds_h: h?.height ?? 0,
-        visible: f ? 1 : 0,
+        bounds_x: f?.x ?? 0,
+        bounds_y: f?.y ?? 0,
+        bounds_w: f?.width ?? 0,
+        bounds_h: f?.height ?? 0,
+        visible: h ? 1 : 0,
         outlineOnClone: d
       },
       spec: {
-        mode: S,
+        mode: b,
         tint: e,
         outlineSrc: g,
-        borderSrc: w,
-        boxShadowSrc: N
+        borderSrc: y,
+        boxShadowSrc: k
         // D-01 contract: Frame 1 (current/buggy) shows outline-on-clone=true;
         // Frame 2 (decided): outline-on-clone=false (subsumed by tracking
         // outline). Wave 2 audit-D-01 reads this field across drag mid-flight
         // + post-drop frames and records frame match.
       },
-      state: f ? "active" : "idle",
+      state: h ? "active" : "idle",
       t: performance.now()
     };
   }), /* @__PURE__ */ r(
@@ -2953,7 +2953,7 @@ function Ge({
   className: u,
   motionWidth: c
 }) {
-  const m = n * a + (n - 1) * i, d = (t.section * na + t.col) * (a + i), g = t.row * (s + i), w = e === "resize" ? 2.5 : 2, N = o === "dashed-retreated" ? "dashed" : "solid", h = e === "drag" ? "gloss-snap-outline" : "gloss-tracking-outline", S = {
+  const m = n * a + (n - 1) * i, d = (t.section * na + t.col) * (a + i), g = t.row * (s + i), y = e === "resize" ? 2.5 : 2, k = o === "dashed-retreated" ? "dashed" : "solid", f = e === "drag" ? "gloss-snap-outline" : "gloss-tracking-outline", b = {
     className: [
       "gloss-tracking-outline",
       `gloss-tracking-outline--${e}`,
@@ -2963,7 +2963,7 @@ function Ge({
       e === "drag" ? "gloss-drag-feedback-snap-outline" : null,
       u
     ].filter(Boolean).join(" "),
-    "data-testid": h,
+    "data-testid": f,
     "data-tracking-outline": "",
     "data-gesture": e,
     "data-pattern": o,
@@ -2972,25 +2972,25 @@ function Ge({
   return c ? /* @__PURE__ */ r(
     G.div,
     {
-      ...S,
+      ...b,
       style: {
         transform: `translate(${d}px, ${g}px)`,
         width: c,
         height: s,
-        borderWidth: w,
-        borderStyle: N
+        borderWidth: y,
+        borderStyle: k
       }
     }
   ) : /* @__PURE__ */ r(
     "div",
     {
-      ...S,
+      ...b,
       style: {
         transform: `translate(${d}px, ${g}px)`,
         width: m,
         height: s,
-        borderWidth: w,
-        borderStyle: N,
+        borderWidth: y,
+        borderStyle: k,
         transition: `transform ${l}ms cubic-bezier(0.4, 0, 0.2, 1)`
       }
     }
@@ -3011,8 +3011,8 @@ function ir({
       return { values: {}, spec: null, state: "idle", t: performance.now() };
     const o = s.current;
     let l = 0, u = 0, c = 0, m = 0;
-    for (const f of o) {
-      const d = f.x.get(), g = f.y.get();
+    for (const h of o) {
+      const d = h.x.get(), g = h.y.get();
       Math.abs(d) > Math.abs(c) && (c = d, l = d), Math.abs(g) > Math.abs(m) && (m = g, u = g);
     }
     return {
@@ -3066,14 +3066,14 @@ const ra = ({
     return () => cancelAnimationFrame(c);
   }, [e.value, t.value]);
   const s = e.label ?? "ACTUAL", o = t.label ?? "ELAPSED";
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
       className: "gloss-dual-pace-bars",
       role: "img",
       "aria-label": `${s}: ${e.value}%, ${o}: ${t.value}%`,
       children: [
-        /* @__PURE__ */ v("div", { className: "gloss-dual-pace-bars__row", children: [
+        /* @__PURE__ */ w("div", { className: "gloss-dual-pace-bars__row", children: [
           /* @__PURE__ */ r("span", { className: "gloss-dual-pace-bars__track-label", children: s }),
           /* @__PURE__ */ r("div", { className: "gloss-dual-pace-bars__track", children: /* @__PURE__ */ r(
             "div",
@@ -3088,12 +3088,12 @@ const ra = ({
               "aria-label": `${s}: ${e.value}%`
             }
           ) }),
-          /* @__PURE__ */ v("span", { className: "gloss-dual-pace-bars__track-value", children: [
+          /* @__PURE__ */ w("span", { className: "gloss-dual-pace-bars__track-value", children: [
             e.value,
             "%"
           ] })
         ] }),
-        /* @__PURE__ */ v("div", { className: "gloss-dual-pace-bars__row", children: [
+        /* @__PURE__ */ w("div", { className: "gloss-dual-pace-bars__row", children: [
           /* @__PURE__ */ r("span", { className: "gloss-dual-pace-bars__track-label", children: o }),
           /* @__PURE__ */ r("div", { className: "gloss-dual-pace-bars__track", children: /* @__PURE__ */ r(
             "div",
@@ -3108,7 +3108,7 @@ const ra = ({
               "aria-label": `${o}: ${t.value}%`
             }
           ) }),
-          /* @__PURE__ */ v("span", { className: "gloss-dual-pace-bars__track-value", children: [
+          /* @__PURE__ */ w("span", { className: "gloss-dual-pace-bars__track-value", children: [
             t.value,
             "%"
           ] })
@@ -3116,22 +3116,22 @@ const ra = ({
       ]
     }
   );
-}, sa = ({ label: e, value: t, severity: n }) => /* @__PURE__ */ v(
+}, sa = ({ label: e, value: t, severity: n }) => /* @__PURE__ */ w(
   "div",
   {
     className: `gloss-gap-readout gloss-gap-readout--${n}`,
     "aria-label": `${e}: ${t}`,
     children: [
       /* @__PURE__ */ r("hr", { className: "gloss-gap-readout__separator" }),
-      /* @__PURE__ */ v("div", { className: "gloss-gap-readout__strip", children: [
+      /* @__PURE__ */ w("div", { className: "gloss-gap-readout__strip", children: [
         /* @__PURE__ */ r("span", { className: "gloss-gap-readout__label", children: e }),
         /* @__PURE__ */ r("span", { className: "gloss-gap-readout__value", children: t })
       ] })
     ]
   }
-), ia = ({ label: e, onSetTarget: t }) => /* @__PURE__ */ v("div", { className: "gloss-pace-placeholder", children: [
+), ia = ({ label: e, onSetTarget: t }) => /* @__PURE__ */ w("div", { className: "gloss-pace-placeholder", children: [
   /* @__PURE__ */ r("p", { className: "gloss-pace-placeholder__heading", children: "Set a target" }),
-  /* @__PURE__ */ v("p", { className: "gloss-pace-placeholder__context", children: [
+  /* @__PURE__ */ w("p", { className: "gloss-pace-placeholder__context", children: [
     "for ",
     e
   ] }),
@@ -3169,10 +3169,10 @@ const ra = ({
       onFlipChange: n,
       quickConfigSlot: o,
       onRemove: e.onRemove,
-      children: /* @__PURE__ */ v("div", { className: `gloss-pace-card ${e.isStale ? "gloss-metric-data-stale" : ""}`, children: [
+      children: /* @__PURE__ */ w("div", { className: `gloss-pace-card ${e.isStale ? "gloss-metric-data-stale" : ""}`, children: [
         /* @__PURE__ */ r("div", { className: "gloss-pace-card__label", children: e.label }),
         e.subtitle && /* @__PURE__ */ r("div", { className: "gloss-pace-card__subtitle", children: e.subtitle }),
-        /* @__PURE__ */ r("div", { className: "gloss-pace-card__body", children: i ? /* @__PURE__ */ v($, { children: [
+        /* @__PURE__ */ r("div", { className: "gloss-pace-card__body", children: i ? /* @__PURE__ */ w($, { children: [
           /* @__PURE__ */ r(
             ra,
             {
@@ -3192,7 +3192,7 @@ const ra = ({
       ] })
     }
   );
-}, lr = () => /* @__PURE__ */ v("div", { className: "gloss-pace-tile-preview", "aria-hidden": "true", children: [
+}, lr = () => /* @__PURE__ */ w("div", { className: "gloss-pace-tile-preview", "aria-hidden": "true", children: [
   /* @__PURE__ */ r(
     "div",
     {
@@ -3223,7 +3223,7 @@ function oa({ id: e, label: t, selected: n, focused: a, disabled: i, badge: s, o
       onClick: () => {
         i || o(e);
       },
-      children: /* @__PURE__ */ v("span", { className: "gloss-lens-chip__inner", children: [
+      children: /* @__PURE__ */ w("span", { className: "gloss-lens-chip__inner", children: [
         /* @__PURE__ */ r("span", { className: "gloss-lens-chip__label", children: t }),
         s && /* @__PURE__ */ r("span", { className: "gloss-lens-chip__badge", children: s })
       ] })
@@ -3291,7 +3291,7 @@ function la({
 }
 la.displayName = "LensChipGroup";
 function ca({ heading: e, children: t }) {
-  return !t || Array.isArray(t) && t.length === 0 ? null : /* @__PURE__ */ v("section", { className: "gloss-starter-rail", "aria-label": e, children: [
+  return !t || Array.isArray(t) && t.length === 0 ? null : /* @__PURE__ */ w("section", { className: "gloss-starter-rail", "aria-label": e, children: [
     /* @__PURE__ */ r("header", { className: "gloss-starter-rail__heading", children: e }),
     /* @__PURE__ */ r("div", { className: "gloss-starter-rail__tiles", children: t })
   ] });
@@ -3299,9 +3299,9 @@ function ca({ heading: e, children: t }) {
 ca.displayName = "StarterRail";
 function da({ heading: e, children: t, emptyStateLabel: n }) {
   const a = !t || Array.isArray(t) && t.length === 0;
-  return /* @__PURE__ */ v("section", { className: "gloss-more-in-lens-rail", "aria-label": e, children: [
+  return /* @__PURE__ */ w("section", { className: "gloss-more-in-lens-rail", "aria-label": e, children: [
     /* @__PURE__ */ r("header", { className: "gloss-more-in-lens-rail__heading", children: e }),
-    /* @__PURE__ */ v("div", { className: "gloss-more-in-lens-rail__tiles", children: [
+    /* @__PURE__ */ w("div", { className: "gloss-more-in-lens-rail__tiles", children: [
       t,
       a && n && /* @__PURE__ */ r("p", { className: "gloss-more-in-lens-rail__empty", children: n })
     ] })
@@ -3324,7 +3324,7 @@ function K({
     `gloss-entity-row--${s}`,
     o ? "gloss-entity-row--clickable" : "",
     l ?? ""
-  ].filter(Boolean).join(" "), m = /* @__PURE__ */ v($, { children: [
+  ].filter(Boolean).join(" "), m = /* @__PURE__ */ w($, { children: [
     e !== void 0 && /* @__PURE__ */ r("span", { className: "gloss-entity-row__lead", children: e }),
     /* @__PURE__ */ r("span", { className: "gloss-entity-row__name", title: t, children: t }),
     n !== void 0 && /* @__PURE__ */ r("span", { className: "gloss-entity-row__secondary", children: n }),
@@ -3343,8 +3343,8 @@ function K({
         gap: 4,
         cursor: "pointer"
       },
-      onClick: (f) => {
-        f.stopPropagation(), o();
+      onClick: (h) => {
+        h.stopPropagation(), o();
       },
       children: m
     }
@@ -3391,7 +3391,7 @@ function He({
       }
     );
   const a = t === "up" ? "▲" : t === "down" ? "▼" : "—";
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "span",
     {
       role: "img",
@@ -3431,7 +3431,7 @@ function ma({
   isStale: i
 }) {
   const s = n ?? 3;
-  return /* @__PURE__ */ v($, { children: [
+  return /* @__PURE__ */ w($, { children: [
     /* @__PURE__ */ r(
       X,
       {
@@ -3473,14 +3473,14 @@ function ma({
         )) })
       }
     ),
-    /* @__PURE__ */ v("div", { className: "gloss-leaderboard__zone-c", children: [
+    /* @__PURE__ */ w("div", { className: "gloss-leaderboard__zone-c", children: [
       a ?? "WoW",
       " rank change"
     ] })
   ] });
 }
 ma.displayName = "LeaderboardCard";
-const ga = () => /* @__PURE__ */ v(
+const ga = () => /* @__PURE__ */ w(
   "div",
   {
     className: "leaderboard-tile-preview",
@@ -3522,7 +3522,7 @@ function fa({
   isStale: o
 }) {
   const l = t.filter((c) => ha(c, n)), u = l.slice(0, a ?? 3);
-  return l.length === 0 ? /* @__PURE__ */ v($, { children: [
+  return l.length === 0 ? /* @__PURE__ */ w($, { children: [
     /* @__PURE__ */ r(
       X,
       {
@@ -3533,7 +3533,7 @@ function fa({
     ),
     /* @__PURE__ */ r("div", { className: "gloss-exception-list__empty", role: "status", children: i ?? "No exceptions" }),
     s && /* @__PURE__ */ r("div", { className: "gloss-exception-list__zone-c", children: s })
-  ] }) : /* @__PURE__ */ v($, { children: [
+  ] }) : /* @__PURE__ */ w($, { children: [
     /* @__PURE__ */ r(
       X,
       {
@@ -3564,7 +3564,7 @@ function fa({
   ] });
 }
 fa.displayName = "ExceptionListCard";
-const ba = () => /* @__PURE__ */ v(
+const ba = () => /* @__PURE__ */ w(
   "div",
   {
     className: "exception-list-tile-preview",
@@ -3620,7 +3620,7 @@ const xe = ["MTD", "QTD", "YTD", "LYTD", "7D"], Te = ["$248K", "$612K", "$1.24M"
     {
       className: `gloss-stacked-group-tile-preview gloss-stacked-group-tile-preview--slots-${e}`,
       "aria-hidden": "true",
-      children: a.map((i, s) => /* @__PURE__ */ v("div", { className: "gloss-stacked-group-tile-preview__row", children: [
+      children: a.map((i, s) => /* @__PURE__ */ w("div", { className: "gloss-stacked-group-tile-preview__row", children: [
         /* @__PURE__ */ r("span", { className: "gloss-stacked-group-tile-preview__row-label", children: i.label }),
         /* @__PURE__ */ r("span", { className: "gloss-stacked-group-tile-preview__row-value", children: i.value }),
         /* @__PURE__ */ r(
@@ -3695,7 +3695,7 @@ function fr({
   const u = (e.section * ya + e.col) * (a + s), c = e.row * (i + s), m = t === "eligibility" ? j.eligibilityFill : t === "commit" ? j.commitFill : t === "rejection" ? j.rejectionFill : (
     /* ramp */
     n ?? j.eligibilityFill
-  ), f = t === "rejection", d = f ? j.rejectionStroke : "transparent", g = f ? "dashed" : "solid";
+  ), h = t === "rejection", d = h ? j.rejectionStroke : "transparent", g = h ? "dashed" : "solid";
   return /* @__PURE__ */ r(
     "div",
     {
@@ -3772,7 +3772,7 @@ function br({
         pointerEvents: "none"
       },
       children: _a.map((m) => {
-        const f = m.peakR * 2;
+        const h = m.peakR * 2;
         return /* @__PURE__ */ r(
           "div",
           {
@@ -3784,8 +3784,8 @@ function br({
               position: "absolute",
               left: l - m.peakR,
               top: u - m.peakR,
-              width: f,
-              height: f,
+              width: h,
+              height: h,
               borderRadius: "50%",
               borderStyle: "solid",
               borderWidth: m.strokeW,
@@ -3809,10 +3809,10 @@ function vr(e) {
   return /* @__PURE__ */ r(Ge, { gesture: "resize", ...e });
 }
 function Ca(e, t, n) {
-  const a = Math.max(0, Math.min(1, n)), i = (f) => [
-    parseInt(f.slice(1, 3), 16),
-    parseInt(f.slice(3, 5), 16),
-    parseInt(f.slice(5, 7), 16)
+  const a = Math.max(0, Math.min(1, n)), i = (h) => [
+    parseInt(h.slice(1, 3), 16),
+    parseInt(h.slice(3, 5), 16),
+    parseInt(h.slice(5, 7), 16)
   ], [s, o, l] = i(e), [u, c, m] = i(t);
   return `rgb(${Math.round(s + (u - s) * a)}, ${Math.round(o + (c - o) * a)}, ${Math.round(
     l + (m - l) * a
@@ -3825,8 +3825,8 @@ function Sa(e) {
   return e === "dragging";
 }
 function yr(e) {
-  const { edgeHover: t, sourceCell: n, cascadeResult: a } = e, s = Ke() === "reduced", o = B.useRef(t.currentColSpan), l = B.useRef({ armed: !0, fireKey: 0, lastResult: null }), u = B.useRef(t.currentColSpan), c = B.useRef("idle"), m = B.useRef(t.currentColSpan), f = Sa(t.state);
-  if (s ? (c.current = "settled", m.current = t.currentColSpan, u.current = t.currentColSpan) : f ? c.current = t.currentColSpan !== u.current ? "incoming" : "outgoing" : (t.currentColSpan !== u.current && (m.current = t.currentColSpan, u.current = t.currentColSpan), c.current !== "idle" && (c.current = "settled")), !f)
+  const { edgeHover: t, sourceCell: n, cascadeResult: a } = e, s = Ke() === "reduced", o = B.useRef(t.currentColSpan), l = B.useRef({ armed: !0, fireKey: 0, lastResult: null }), u = B.useRef(t.currentColSpan), c = B.useRef("idle"), m = B.useRef(t.currentColSpan), h = Sa(t.state);
+  if (s ? (c.current = "settled", m.current = t.currentColSpan, u.current = t.currentColSpan) : h ? c.current = t.currentColSpan !== u.current ? "incoming" : "outgoing" : (t.currentColSpan !== u.current && (m.current = t.currentColSpan, u.current = t.currentColSpan), c.current !== "idle" && (c.current = "settled")), !h)
     return l.current.armed = !0, l.current.lastResult = null, {
       trackingOutline: null,
       cellTints: [],
@@ -3835,17 +3835,17 @@ function yr(e) {
       phase: c.current,
       displayColSpan: m.current
     };
-  const d = t.hysteresisTargetColSpan, g = t.previewColSpan, w = a?.result === "rejected";
-  w || (o.current = d), w && l.current.armed && l.current.lastResult !== "rejected" && (l.current.fireKey += 1, l.current.armed = !1), l.current.lastResult = w ? "rejected" : "ok";
-  const N = w ? o.current : d, h = {
+  const d = t.hysteresisTargetColSpan, g = t.previewColSpan, y = a?.result === "rejected";
+  y || (o.current = d), y && l.current.armed && l.current.lastResult !== "rejected" && (l.current.fireKey += 1, l.current.armed = !1), l.current.lastResult = y ? "rejected" : "ok";
+  const k = y ? o.current : d, f = {
     cell: { section: 0, col: 0, row: 0 },
-    colSpan: N,
-    pattern: w ? "dashed-retreated" : "solid"
-  }, S = [];
-  if (w) {
-    const k = n.col + o.current, R = n.col + d - 1;
-    for (let p = k; p <= R && p <= 2; p++)
-      S.push({
+    colSpan: k,
+    pattern: y ? "dashed-retreated" : "solid"
+  }, b = [];
+  if (y) {
+    const S = n.col + o.current, R = n.col + d - 1;
+    for (let p = S; p <= R && p <= 2; p++)
+      b.push({
         cell: {
           section: 0,
           col: p - n.col,
@@ -3854,30 +3854,30 @@ function yr(e) {
         variant: "rejection"
       });
   } else {
-    const k = Math.abs(g - d), R = Math.max(0, Math.min(1, 1 - k));
+    const S = Math.abs(g - d), R = Math.max(0, Math.min(1, 1 - S));
     for (let p = n.col; p < n.col + d && p <= 2; p++) {
       if (p === n.col) continue;
-      const b = p === n.col + d - 1, y = {
+      const v = p === n.col + d - 1, _ = {
         section: 0,
         col: p - n.col,
         row: 0
       };
-      b && t.direction.startsWith("grow") && d > 1 && !s && k > 0 && k < 1 ? S.push({
-        cell: y,
+      v && t.direction.startsWith("grow") && d > 1 && !s && S > 0 && S < 1 ? b.push({
+        cell: _,
         variant: "ramp",
         rampColor: Ca(Me.eligibilityFill, Me.commitFill, R)
-      }) : b ? S.push({ cell: y, variant: "commit" }) : S.push({ cell: y, variant: "eligibility" });
+      }) : v ? b.push({ cell: _, variant: "commit" }) : b.push({ cell: _, variant: "eligibility" });
     }
   }
   const M = [];
   if (t.currentColSpan > d)
-    for (let k = n.col + d; k < n.col + t.currentColSpan && k <= 2; k++)
+    for (let S = n.col + d; S < n.col + t.currentColSpan && S <= 2; S++)
       M.push({
         section: 0,
-        col: k - n.col,
+        col: S - n.col,
         row: 0
       });
-  const C = l.current.fireKey > 0 ? {
+  const N = l.current.fireKey > 0 ? {
     cell: {
       section: 0,
       col: Na(
@@ -3888,9 +3888,9 @@ function yr(e) {
     fireKey: l.current.fireKey
   } : null;
   return {
-    trackingOutline: h,
-    cellTints: S,
-    refusePulse: C,
+    trackingOutline: f,
+    cellTints: b,
+    refusePulse: N,
     shrinkFreedCells: M,
     phase: c.current,
     displayColSpan: m.current
@@ -3930,7 +3930,7 @@ function ka({
     }
   }, [a, i]);
   const u = s ? { top: s.top, left: s.left } : {};
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
       className: W["gloss-inline-nudge"],
@@ -3940,7 +3940,7 @@ function ka({
       "data-reduced-motion": l ? "true" : void 0,
       children: [
         /* @__PURE__ */ r("span", { className: W["gloss-inline-nudge__message"], children: e }),
-        /* @__PURE__ */ v("div", { className: W["gloss-inline-nudge__actions"], children: [
+        /* @__PURE__ */ w("div", { className: W["gloss-inline-nudge__actions"], children: [
           /* @__PURE__ */ r(
             "button",
             {
@@ -3993,17 +3993,17 @@ function Ta({
 }) {
   const o = i === void 0 ? 0.01 : !Number.isFinite(i) || i <= 0 ? (process.env.NODE_ENV !== "production" && console.warn(
     `ThresholdRamp: step (${i}) must be a positive finite number; falling back to 0.01.`
-  ), 0.01) : i, l = _(
+  ), 0.01) : i, l = C(
     (p) => Math.round(p / o) * o,
     [o]
-  ), u = P(null), [c, m] = E(null), [f, d] = E(e), g = xa(e), w = P(g);
+  ), u = P(null), [c, m] = E(null), [h, d] = E(e), g = xa(e), y = P(g);
   A(() => {
-    w.current !== g && (w.current = g, !c && d(e));
+    y.current !== g && (y.current = g, !c && d(e));
   }, [g, e, c]);
-  const N = re(() => Da(f, n, a), [f, n, a]), h = _(
+  const k = re(() => Da(h, n, a), [h, n, a]), f = C(
     (p) => {
       if (!u.current) return n;
-      const b = u.current.getBoundingClientRect(), y = b.width || 1, D = Math.max(0, Math.min(1, (p - b.left) / y)), T = n + D * (a - n);
+      const v = u.current.getBoundingClientRect(), _ = v.width || 1, D = Math.max(0, Math.min(1, (p - v.left) / _)), T = n + D * (a - n);
       return l(T);
     },
     [n, a, l]
@@ -4013,47 +4013,47 @@ function Ta({
       `ThresholdRamp: max (${a}) must be greater than min (${n}); rendering degenerate strip.`
     );
   }, [n, a]);
-  const S = _(
-    (p, b) => {
-      const y = f.find((D) => D.id === b);
-      s || y?.disabled || (p.preventDefault(), m(b));
+  const b = C(
+    (p, v) => {
+      const _ = h.find((D) => D.id === v);
+      s || _?.disabled || (p.preventDefault(), m(v));
     },
-    [s, f]
-  ), M = P(f);
-  M.current = f;
-  const C = P(t);
-  C.current = t, A(() => {
+    [s, h]
+  ), M = P(h);
+  M.current = h;
+  const N = P(t);
+  N.current = t, A(() => {
     if (!c) return;
-    const p = (y) => {
-      const D = h(y.clientX);
+    const p = (_) => {
+      const D = f(_.clientX);
       d(
         (T) => T.map((x) => x.id === c ? { ...x, value: D } : x)
       );
-    }, b = (y) => {
-      const D = h(y.clientX), T = M.current.map(
+    }, v = (_) => {
+      const D = f(_.clientX), T = M.current.map(
         (x) => x.id === c ? { ...x, value: D } : x
       );
-      d(T), m(null), C.current(T);
+      d(T), m(null), N.current(T);
     };
-    return window.addEventListener("pointermove", p), window.addEventListener("pointerup", b), window.addEventListener("pointercancel", b), () => {
-      window.removeEventListener("pointermove", p), window.removeEventListener("pointerup", b), window.removeEventListener("pointercancel", b);
+    return window.addEventListener("pointermove", p), window.addEventListener("pointerup", v), window.addEventListener("pointercancel", v), () => {
+      window.removeEventListener("pointermove", p), window.removeEventListener("pointerup", v), window.removeEventListener("pointercancel", v);
     };
-  }, [c, h]);
-  const k = a - n > 0 ? a - n : 1, R = _(
-    (p, b) => {
-      if (s || b.disabled) return;
-      const y = a - n;
-      if (y <= 0) return;
-      const D = p.shiftKey ? y / 20 : y / 100;
-      let T = b.value;
+  }, [c, f]);
+  const S = a - n > 0 ? a - n : 1, R = C(
+    (p, v) => {
+      if (s || v.disabled) return;
+      const _ = a - n;
+      if (_ <= 0) return;
+      const D = p.shiftKey ? _ / 20 : _ / 100;
+      let T = v.value;
       switch (p.key) {
         case "ArrowRight":
         case "ArrowUp":
-          T = b.value + D;
+          T = v.value + D;
           break;
         case "ArrowLeft":
         case "ArrowDown":
-          T = b.value - D;
+          T = v.value - D;
           break;
         case "Home":
           T = n;
@@ -4066,34 +4066,34 @@ function Ta({
       }
       p.preventDefault();
       const x = Math.max(n, Math.min(a, T)), I = l(x);
-      if (I === b.value) return;
-      const L = f.map(
-        (Z) => Z.id === b.id ? { ...Z, value: I } : Z
+      if (I === v.value) return;
+      const L = h.map(
+        (Z) => Z.id === v.id ? { ...Z, value: I } : Z
       );
       d(L), t(L);
     },
-    [s, n, a, f, t, l]
+    [s, n, a, h, t, l]
   );
   return /* @__PURE__ */ r("div", { className: "gloss-threshold-ramp", "data-disabled": s || void 0, children: /* @__PURE__ */ r(
     "div",
     {
       ref: u,
       className: "gloss-threshold-ramp__track",
-      style: { background: N },
-      children: f.map((p) => {
-        const b = (p.value - n) / k * 100;
+      style: { background: k },
+      children: h.map((p) => {
+        const v = (p.value - n) / S * 100;
         return /* @__PURE__ */ r(
           "span",
           {
             className: "gloss-threshold-ramp__stop",
             style: {
-              left: `${b}%`,
+              left: `${v}%`,
               color: pe(p)
             },
             "data-disabled": p.disabled || void 0,
             "data-dragging": c === p.id || void 0,
-            onPointerDown: (y) => S(y, p.id),
-            onKeyDown: (y) => R(y, p),
+            onPointerDown: (_) => b(_, p.id),
+            onKeyDown: (_) => R(_, p),
             "aria-label": p.label ?? `Stop at ${p.value}`,
             role: "slider",
             "aria-valuenow": p.value,
@@ -4114,9 +4114,9 @@ function Ra() {
   return et(We);
 }
 function Ma({ option: e }) {
-  const t = Ra(), n = t?.isSelected(e.value) ?? !1, a = e.disabled || t?.groupDisabled, i = _(() => {
+  const t = Ra(), n = t?.isSelected(e.value) ?? !1, a = e.disabled || t?.groupDisabled, i = C(() => {
     a || t?.select(e.value);
-  }, [a, t, e.value]), s = _(
+  }, [a, t, e.value]), s = C(
     (c) => {
       a || t?.onKeyNav(c, e.value);
     },
@@ -4151,63 +4151,63 @@ function Pa({
   disabled: i = !1,
   name: s
 }) {
-  const o = t !== void 0, [l, u] = E(n), c = o ? t : l, m = _(
-    (C) => {
-      o || u(C), a?.(C);
+  const o = t !== void 0, [l, u] = E(n), c = o ? t : l, m = C(
+    (N) => {
+      o || u(N), a?.(N);
     },
     [o, a]
-  ), f = _(
-    (C) => c === C,
+  ), h = C(
+    (N) => c === N,
     [c]
-  ), d = P(/* @__PURE__ */ new Map()), g = _((C, k) => {
-    k ? d.current.set(C, k) : d.current.delete(C);
-  }, []), w = e.filter((C) => !C.disabled && !i), N = w.find((C) => C.value === c)?.value ?? w[0]?.value, h = _((C) => {
-    const k = d.current.get(C);
-    k && k.focus();
-  }, []), S = _(
-    (C, k) => {
+  ), d = P(/* @__PURE__ */ new Map()), g = C((N, S) => {
+    S ? d.current.set(N, S) : d.current.delete(N);
+  }, []), y = e.filter((N) => !N.disabled && !i), k = y.find((N) => N.value === c)?.value ?? y[0]?.value, f = C((N) => {
+    const S = d.current.get(N);
+    S && S.focus();
+  }, []), b = C(
+    (N, S) => {
       if (i) return;
       const R = e.filter((D) => !D.disabled);
       if (R.length === 0) return;
-      const p = R.findIndex((D) => D.value === k);
+      const p = R.findIndex((D) => D.value === S);
       if (p === -1) return;
-      let b = p;
-      switch (C.key) {
+      let v = p;
+      switch (N.key) {
         case "ArrowRight":
         case "ArrowDown":
-          b = (p + 1) % R.length;
+          v = (p + 1) % R.length;
           break;
         case "ArrowLeft":
         case "ArrowUp":
-          b = (p - 1 + R.length) % R.length;
+          v = (p - 1 + R.length) % R.length;
           break;
         case "Home":
-          b = 0;
+          v = 0;
           break;
         case "End":
-          b = R.length - 1;
+          v = R.length - 1;
           break;
         case " ":
         case "Enter":
-          C.preventDefault(), m(k);
+          N.preventDefault(), m(S);
           return;
         default:
           return;
       }
-      C.preventDefault();
-      const y = R[b].value;
-      h(y), m(y);
+      N.preventDefault();
+      const _ = R[v].value;
+      f(_), m(_);
     },
-    [i, e, m, h]
+    [i, e, m, f]
   ), M = {
     selectedValue: c,
     select: m,
-    isSelected: f,
+    isSelected: h,
     groupDisabled: i,
     name: s,
     registerRef: g,
-    firstFocusableValue: N,
-    onKeyNav: S
+    firstFocusableValue: k,
+    onKeyNav: b
   };
   return /* @__PURE__ */ r(We.Provider, { value: M, children: /* @__PURE__ */ r(
     "div",
@@ -4217,7 +4217,7 @@ function Pa({
       "aria-label": s,
       "aria-disabled": i,
       "data-disabled": i || void 0,
-      children: e.map((C) => /* @__PURE__ */ r(Ma, { option: C }, C.value))
+      children: e.map((N) => /* @__PURE__ */ r(Ma, { option: N }, N.value))
     }
   ) });
 }
@@ -4241,9 +4241,9 @@ function Ea(e) {
 }
 function Aa(e) {
   const [t, n] = E(
-    () => e.zones.map((h) => h.maxItems !== void 0 && h.items.length > h.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
-      `useSortableZones: zone "${h.zoneKey}" exceeds maxItems (${h.items.length} > ${h.maxItems}); trimming to cap.`
-    ), { ...h, items: h.items.slice(0, h.maxItems) }) : h)
+    () => e.zones.map((f) => f.maxItems !== void 0 && f.items.length > f.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
+      `useSortableZones: zone "${f.zoneKey}" exceeds maxItems (${f.items.length} > ${f.maxItems}); trimming to cap.`
+    ), { ...f, items: f.items.slice(0, f.maxItems) }) : f)
   ), [a, i] = E(null), [s, o] = E(null), l = P(null), u = P(e.onZoneChange);
   u.current = e.onZoneChange;
   const c = re(
@@ -4252,63 +4252,63 @@ function Aa(e) {
   ), m = P(c);
   A(() => {
     m.current !== c && (m.current = c, !a && n(
-      e.zones.map((h) => h.maxItems !== void 0 && h.items.length > h.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
-        `useSortableZones: zone "${h.zoneKey}" exceeds maxItems (${h.items.length} > ${h.maxItems}); trimming to cap.`
-      ), { ...h, items: h.items.slice(0, h.maxItems) }) : h)
+      e.zones.map((f) => f.maxItems !== void 0 && f.items.length > f.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
+        `useSortableZones: zone "${f.zoneKey}" exceeds maxItems (${f.items.length} > ${f.maxItems}); trimming to cap.`
+      ), { ...f, items: f.items.slice(0, f.maxItems) }) : f)
     ));
   }, [c, e.zones, a]);
-  const f = _(
-    (h) => {
-      const S = h.active.id;
-      let M = null, C = null;
-      for (const k of t) {
-        const R = k.items.find((p) => p.id === S);
+  const h = C(
+    (f) => {
+      const b = f.active.id;
+      let M = null, N = null;
+      for (const S of t) {
+        const R = S.items.find((p) => p.id === b);
         if (R) {
-          M = R, C = k.zoneKey;
+          M = R, N = S.zoneKey;
           break;
         }
       }
-      l.current = C, i(M), o(C);
+      l.current = N, i(M), o(N);
     },
     [t]
-  ), d = _(
-    (h) => {
-      if (!h.over) {
+  ), d = C(
+    (f) => {
+      if (!f.over) {
         o(l.current);
         return;
       }
-      const S = Pe(t, h.over.id);
-      o(S);
+      const b = Pe(t, f.over.id);
+      o(b);
     },
     [t]
-  ), g = _(
-    (h) => {
-      const { active: S, over: M } = h, C = () => {
+  ), g = C(
+    (f) => {
+      const { active: b, over: M } = f, N = () => {
         l.current = null, i(null), o(null);
       };
       if (!M) {
-        C();
+        N();
         return;
       }
-      const k = he(t, S.id), R = Pe(t, M.id);
-      if (!k || !R) {
-        C();
+      const S = he(t, b.id), R = Pe(t, M.id);
+      if (!S || !R) {
+        N();
         return;
       }
-      let p = t.map((b) => ({ ...b, items: [...b.items] }));
-      if (k === R) {
-        const b = p.findIndex((I) => I.zoneKey === k), y = p[b], D = y.items.findIndex((I) => I.id === S.id), T = y.items.findIndex((I) => I.id === M.id), x = T >= 0 ? T : Math.max(0, y.items.length - 1);
-        p[b] = {
-          ...y,
-          items: Ia(y.items, D, x)
+      let p = t.map((v) => ({ ...v, items: [...v.items] }));
+      if (S === R) {
+        const v = p.findIndex((I) => I.zoneKey === S), _ = p[v], D = _.items.findIndex((I) => I.id === b.id), T = _.items.findIndex((I) => I.id === M.id), x = T >= 0 ? T : Math.max(0, _.items.length - 1);
+        p[v] = {
+          ..._,
+          items: Ia(_.items, D, x)
         };
       } else {
-        const b = p.findIndex((O) => O.zoneKey === k), y = p.findIndex((O) => O.zoneKey === R), D = p[b], T = p[y], x = D.items.find((O) => O.id === S.id);
+        const v = p.findIndex((O) => O.zoneKey === S), _ = p.findIndex((O) => O.zoneKey === R), D = p[v], T = p[_], x = D.items.find((O) => O.id === b.id);
         if (!x) {
-          C();
+          N();
           return;
         }
-        const I = D.items.filter((O) => O.id !== S.id), L = T.items.findIndex((O) => O.id === M.id), Z = L >= 0 ? L : T.items.length;
+        const I = D.items.filter((O) => O.id !== b.id), L = T.items.findIndex((O) => O.id === M.id), Z = L >= 0 ? L : T.items.length;
         let be = I, H = [...T.items];
         if (T.maxItems !== void 0 && H.length >= T.maxItems) {
           const O = H[H.length - 1];
@@ -4319,24 +4319,24 @@ function Aa(e) {
           x,
           ...H.slice(ve)
         ];
-        p[b] = { ...D, items: be }, p[y] = { ...T, items: Ye };
+        p[v] = { ...D, items: be }, p[_] = { ...T, items: Ye };
       }
-      n(p), u.current?.(p), C();
+      n(p), u.current?.(p), N();
     },
     [t]
-  ), w = _(
-    (h) => ({
-      id: h,
-      "data-zone-key": h
+  ), y = C(
+    (f) => ({
+      id: f,
+      "data-zone-key": f
     }),
     []
-  ), N = _(
-    (h) => {
-      const S = he(t, h.id) ?? "";
+  ), k = C(
+    (f) => {
+      const b = he(t, f.id) ?? "";
       return {
-        id: h.id,
-        "data-item-id": h.id,
-        "data-zone-key": S
+        id: f.id,
+        "data-item-id": f.id,
+        "data-zone-key": b
       };
     },
     [t]
@@ -4345,9 +4345,9 @@ function Aa(e) {
     zones: t,
     activeZone: s,
     activeItem: a,
-    getZoneProps: w,
-    getItemProps: N,
-    handleDragStart: f,
+    getZoneProps: y,
+    getItemProps: k,
+    handleDragStart: h,
     handleDragOver: d,
     handleDragEnd: g
   };
@@ -4418,7 +4418,7 @@ function za(e) {
       renderDragOverlay: s
     }
   ) : /* @__PURE__ */ r("div", { "data-sortable-zones-passive": "true", children: o.zones.map((c) => {
-    const m = c.items.map((f) => /* @__PURE__ */ r(F.Fragment, { children: i(f) }, f.id));
+    const m = c.items.map((h) => /* @__PURE__ */ r(F.Fragment, { children: i(h) }, h.id));
     return /* @__PURE__ */ r("div", { ...o.getZoneProps(c.zoneKey), children: a(c.zoneKey, c.items, m) }, c.zoneKey);
   }) });
 }
@@ -4430,21 +4430,21 @@ function Ve({
   renderItem: a,
   renderDragOverlay: i
 }) {
-  const { core: s, sortable: o, utilities: l } = t, { DndContext: u, DragOverlay: c, useSensors: m, useSensor: f, useDroppable: d, PointerSensor: g, KeyboardSensor: w, closestCenter: N } = s, { SortableContext: h, verticalListSortingStrategy: S } = o, M = m(
-    f(g, { activationConstraint: { distance: 5 } }),
-    f(w)
-  ), C = u, k = c, R = h;
-  return /* @__PURE__ */ v(
-    C,
+  const { core: s, sortable: o, utilities: l } = t, { DndContext: u, DragOverlay: c, useSensors: m, useSensor: h, useDroppable: d, PointerSensor: g, KeyboardSensor: y, closestCenter: k } = s, { SortableContext: f, verticalListSortingStrategy: b } = o, M = m(
+    h(g, { activationConstraint: { distance: 5 } }),
+    h(y)
+  ), N = u, S = c, R = f;
+  return /* @__PURE__ */ w(
+    N,
     {
       sensors: M,
-      collisionDetection: N,
+      collisionDetection: k,
       onDragStart: e.handleDragStart,
       onDragOver: e.handleDragOver,
       onDragEnd: e.handleDragEnd,
       children: [
         e.zones.map((p) => {
-          const b = p.items.map((D) => D.id), y = p.items.map((D) => /* @__PURE__ */ r(
+          const v = p.items.map((D) => D.id), _ = p.items.map((D) => /* @__PURE__ */ r(
             je,
             {
               id: D.id,
@@ -4460,12 +4460,12 @@ function Ve({
               zoneKey: p.zoneKey,
               zoneProps: e.getZoneProps(p.zoneKey),
               useDroppable: d,
-              children: /* @__PURE__ */ r(R, { items: b, strategy: S, children: n(p.zoneKey, p.items, y) })
+              children: /* @__PURE__ */ r(R, { items: v, strategy: b, children: n(p.zoneKey, p.items, _) })
             },
             p.zoneKey
           );
         }),
-        /* @__PURE__ */ r(k, { children: e.activeItem ? i?.(e.activeItem) ?? a(e.activeItem) : null })
+        /* @__PURE__ */ r(S, { children: e.activeItem ? i?.(e.activeItem) ?? a(e.activeItem) : null })
       ]
     }
   );
@@ -4503,7 +4503,7 @@ function wr({
     "--gloss-bottom-toolbar-height": `${a}px`,
     ...s
   };
-  return /* @__PURE__ */ v(
+  return /* @__PURE__ */ w(
     "div",
     {
       role: "toolbar",
@@ -4549,27 +4549,29 @@ function _r({
   pulseIndex: s,
   pulseNonce: o,
   currentSection: l,
-  sectionsPerView: u = 1
+  sectionsPerView: u = 1,
   // D-09 default
+  isHiding: c
 }) {
-  const c = l ?? t ?? 0, m = Math.max(0, Math.min(e - 1, c)), f = Math.min(e - 1, m + Math.max(0, u - 1)), d = [m, f], g = B.useRef([]);
-  return g.current.length = e, e <= 1 || d[0] === 0 && d[1] === e - 1 ? null : /* @__PURE__ */ v(
+  const m = l ?? t ?? 0, h = Math.max(0, Math.min(e - 1, m)), d = Math.min(e - 1, h + Math.max(0, u - 1)), g = [h, d], y = B.useRef([]);
+  return y.current.length = e, !c && e <= 1 || !c && g[0] === 0 && g[1] === e - 1 ? null : /* @__PURE__ */ w(
     "div",
     {
       role: "tablist",
       "aria-label": a,
       "data-testid": "gloss-section-dots",
       className: "gloss-section-dots",
-      onKeyDown: (N) => {
+      "data-hiding": c ? "true" : void 0,
+      onKeyDown: (f) => {
         if (e !== 0) {
-          if (N.key === "ArrowRight") {
-            N.preventDefault();
-            const h = (c + 1) % e;
-            n(h), requestAnimationFrame(() => g.current[h]?.focus());
-          } else if (N.key === "ArrowLeft") {
-            N.preventDefault();
-            const h = (c - 1 + e) % e;
-            n(h), requestAnimationFrame(() => g.current[h]?.focus());
+          if (f.key === "ArrowRight") {
+            f.preventDefault();
+            const b = (m + 1) % e;
+            n(b), requestAnimationFrame(() => y.current[b]?.focus());
+          } else if (f.key === "ArrowLeft") {
+            f.preventDefault();
+            const b = (m - 1 + e) % e;
+            n(b), requestAnimationFrame(() => y.current[b]?.focus());
           }
         }
       },
@@ -4580,30 +4582,30 @@ function _r({
             className: "gloss-section-dots__blob",
             "aria-hidden": "true",
             style: {
-              "--blob-start": d[0],
-              "--blob-end": d[1]
+              "--blob-start": g[0],
+              "--blob-end": g[1]
             }
           }
         ),
-        Array.from({ length: e }, (N, h) => /* @__PURE__ */ r(
+        Array.from({ length: e }, (f, b) => /* @__PURE__ */ r(
           "button",
           {
-            ref: (S) => {
-              g.current[h] = S;
+            ref: (M) => {
+              y.current[b] = M;
             },
             type: "button",
             role: "tab",
-            "aria-selected": h === c,
-            "aria-label": h === i ? "Unconfirmed section" : `Section ${h + 1}`,
-            "data-state": h === i ? "provisional-hollow" : h === s ? "pulse" : h === c ? "current" : "hollow",
-            "data-section-index": h,
+            "aria-selected": b === m,
+            "aria-label": b === i ? "Unconfirmed section" : `Section ${b + 1}`,
+            "data-state": b === i ? "provisional-hollow" : b === s ? "pulse" : b === m ? "current" : "hollow",
+            "data-section-index": b,
             className: [
               "gloss-section-dots__dot",
-              h === c && "gloss-section-dots__dot--current"
+              b === m && "gloss-section-dots__dot--current"
             ].filter(Boolean).join(" "),
-            onClick: () => n(h)
+            onClick: () => n(b)
           },
-          h === s ? `${h}-${o ?? 0}` : h
+          b === s ? `${b}-${o ?? 0}` : b
         ))
       ]
     }
@@ -4616,7 +4618,7 @@ const Ba = F.forwardRef(({ density: e = "compact", children: t, ...n }, a) => {
 Ba.displayName = "ContainerToolbar";
 const Ka = F.forwardRef(({ legend: e, description: t, density: n = "default", children: a, ...i }, s) => {
   const o = { ...i };
-  return delete o.className, delete o.style, /* @__PURE__ */ v("fieldset", { ref: s, className: "gloss-container-form-section", ...o, children: [
+  return delete o.className, delete o.style, /* @__PURE__ */ w("fieldset", { ref: s, className: "gloss-container-form-section", ...o, children: [
     e && /* @__PURE__ */ r("legend", { className: "gloss-container-form-section__legend", children: e }),
     t && /* @__PURE__ */ r("p", { className: "gloss-container-form-section__description", children: t }),
     /* @__PURE__ */ r(fe, { region: "form-section", density: n, children: a })