@mt-gloss/ui 0.1.157 → 0.1.158

package/{Expandable-DhUz3Ksz.js → Expandable-BnGSJjQg.js}

@@ -5,7 +5,7 @@ import { S as Z, E as qe, C as P, e as Jn, R as Ce, h as Qn, i as es, j as ts, a
 import { easings as nt, durations as st } from "@mt-gloss/tokens";
 import { formatValue as Ys, isInRange as Us, isSameDay as er, formatMarketDates as Xs, DEFAULT_MARKET_PRESETS as tr, isMarketActive as kt, getDateRangeForPreset as Ze, detectPreset as rr, ROLLING_OPTIONS as Sr, PERIOD_OPTIONS as Cr, getDateRangeDisplayInfo as Ot, formatDateRangeSmart as yt, toUppercasePresetId as ar, generateMarketId as Zs } from "@mt-gloss/utils";
 import { B as be, b as qs, a as Js } from "./BaseText-Dxbk1JJa.js";
-import { u as Qs, a as eo, b as to, M as dt } from "./TimeframeQuickBar-CHl409rH.js";
+import { u as Qs, a as eo, b as to, M as dt } from "./TimeframeQuickBar-DFK4fnAA.js";
 import { useGridApiRef as ro, DataGridPro as ao } from "@mui/x-data-grid-pro";
 import { Chip as Wr, Tooltip as xt, MenuItem as dr, Menu as no, Box as ue, IconButton as et, Select as ha, Typography as De, Button as at, Collapse as so, Popover as oo, Dialog as io, DialogTitle as lo, DialogContent as co, TextField as nr, DialogActions as uo, Tabs as mo, Tab as po } from "@mui/material";
 import go from "@mui/icons-material/Person";
@@ -4335,20 +4335,7 @@ const Xc = function(t) {
             definition: { display: "flex", direction: "column" },
             style: { position: "relative", width: "100%", height: "100%", overflow: "hidden" },
             children: [
-              /* @__PURE__ */ e("div", { style: {
-                fontSize: 10.5,
-                fontWeight: 600,
-                textTransform: "uppercase",
-                letterSpacing: "0.04em",
-                color: "#6B7280",
-                lineHeight: "14px",
-                marginBottom: 4,
-                whiteSpace: "nowrap",
-                overflow: "hidden",
-                textOverflow: "ellipsis",
-                position: "relative",
-                zIndex: 2
-              }, children: a }),
+              /* @__PURE__ */ e("div", { className: "gloss-metric-card__zone-a", children: /* @__PURE__ */ e("div", { className: "gloss-metric-card__label", children: a }) }),
               /* @__PURE__ */ e(
                 Tt,
                 {

package/{TimeframeQuickBar-CHl409rH.js → TimeframeQuickBar-DFK4fnAA.js}

@@ -1,8 +1,8 @@
 import { jsxs as u, jsx as e, Fragment as J } from "react/jsx-runtime";
 import { useId as me, useMemo as O, useState as ge, useRef as B, useCallback as C, useEffect as pe } from "react";
-import { formatTrend as ye, pickMetricTier as xe, getValueFontSize as Y, hexToRgba as q, formatValue as Q, getDateRangeForPreset as be, formatDateRangeSmart as ve, ROLLING_OPTIONS as ke, PERIOD_OPTIONS as Se } from "@mt-gloss/utils";
-import { B as N, a as R, b as we } from "./BaseText-Dxbk1JJa.js";
-import { Box as D, Chip as K, Popper as Ce, Paper as Ie, MenuList as ze, MenuItem as Me, ListItemText as _e, IconButton as Te, Tooltip as Le, Divider as Ne } from "@mui/material";
+import { formatTrend as ye, pickMetricTier as xe, getValueFontSize as Y, hexToRgba as q, formatValue as Q, getDateRangeForPreset as be, formatDateRangeSmart as ve, ROLLING_OPTIONS as ke, PERIOD_OPTIONS as we } from "@mt-gloss/utils";
+import { B as M, a as R, b as Se } from "./BaseText-Dxbk1JJa.js";
+import { Box as D, Chip as K, Popper as Ce, Paper as Ie, MenuList as ze, MenuItem as _e, ListItemText as Me, IconButton as Te, Tooltip as Le, Divider as Ne } from "@mui/material";
 import Re from "@mui/icons-material/ExpandMore";
 import De from "@mui/icons-material/Star";
 import Be from "@mui/icons-material/StarBorder";
@@ -17,7 +17,7 @@ const Z = {
   flat: "▶"
 }, j = function({ value: o, direction: t }) {
   if (o == null) return null;
-  const { text: d, direction: f } = ye(o), l = t || f, { color: r, bg: s } = Z[l] || Z.flat, n = X[l] || X.flat;
+  const { text: d, direction: f } = ye(o), s = t || f, { color: r, bg: l } = Z[s] || Z.flat, n = X[s] || X.flat;
   return /* @__PURE__ */ u(
     "span",
     {
@@ -31,7 +31,7 @@ const Z = {
         fontWeight: 600,
         lineHeight: 1,
         color: r,
-        backgroundColor: s,
+        backgroundColor: l,
         whiteSpace: "nowrap"
       },
       children: [
@@ -43,13 +43,13 @@ const Z = {
 };
 j.displayName = "TrendIndicator";
 const F = ({ data: i, color: o, isStale: t }) => {
-  const f = "sparkbg-" + me().replace(/:/g, ""), l = o || "#4f46e5", r = O(() => {
+  const f = "sparkbg-" + me().replace(/:/g, ""), s = o || "#4f46e5", r = O(() => {
     if (!i || i.length < 2) return null;
-    const s = 300, n = 55, a = 2, c = Math.min(...i), m = Math.max(...i) - c || 1, p = i.map((x, w) => ({
-      x: w / (i.length - 1) * s,
+    const l = 300, n = 55, a = 2, c = Math.min(...i), m = Math.max(...i) - c || 1, p = i.map((x, S) => ({
+      x: S / (i.length - 1) * l,
       y: a + (1 - (x - c) / m) * (n - a * 2)
-    })).map((x, w) => `${w === 0 ? "M" : "L"}${x.x},${x.y}`).join(" "), S = `${p} L${s},${n} L0,${n}Z`;
-    return { line: p, area: S, w: s, h: n };
+    })).map((x, S) => `${S === 0 ? "M" : "L"}${x.x},${x.y}`).join(" "), w = `${p} L${l},${n} L0,${n}Z`;
+    return { line: p, area: w, w: l, h: n };
   }, [i]);
   return r ? /* @__PURE__ */ u(
     "svg",
@@ -82,8 +82,8 @@ const F = ({ data: i, color: o, isStale: t }) => {
       },
       children: [
         /* @__PURE__ */ e("defs", { children: /* @__PURE__ */ u("linearGradient", { id: f, x1: "0", y1: "0", x2: "0", y2: "1", children: [
-          /* @__PURE__ */ e("stop", { offset: "0%", stopColor: l, stopOpacity: "0.09" }),
-          /* @__PURE__ */ e("stop", { offset: "100%", stopColor: l, stopOpacity: "0.01" })
+          /* @__PURE__ */ e("stop", { offset: "0%", stopColor: s, stopOpacity: "0.09" }),
+          /* @__PURE__ */ e("stop", { offset: "100%", stopColor: s, stopOpacity: "0.01" })
         ] }) }),
         /* @__PURE__ */ e("path", { d: r.area, fill: `url(#${f})` }),
         /* @__PURE__ */ e(
@@ -91,7 +91,7 @@ const F = ({ data: i, color: o, isStale: t }) => {
           {
             d: r.line,
             fill: "none",
-            stroke: l,
+            stroke: s,
             strokeOpacity: "0.22",
             strokeWidth: "1.5",
             strokeLinecap: "round",
@@ -106,9 +106,9 @@ F.displayName = "SparklineBg";
 const ee = ({ data: i, color: o, isStale: t }) => {
   const d = o || "#4f46e5", f = O(() => {
     if (!i || i.length < 1) return null;
-    const l = 300, r = 50, s = r * 0.82, n = i.length, a = l / (n * 4), c = a * 3, m = Math.max(...i) || 1;
+    const s = 300, r = 50, l = r * 0.82, n = i.length, a = s / (n * 4), c = a * 3, m = Math.max(...i) || 1;
     return i.map((y, p) => {
-      const S = y / m, x = Math.max(S * s, 2);
+      const w = y / m, x = Math.max(w * l, 2);
       return {
         x: p * (c + a),
         y: r - x,
@@ -137,15 +137,15 @@ const ee = ({ data: i, color: o, isStale: t }) => {
         transformOrigin: "bottom",
         transition: t ? "transform 400ms ease-out" : "transform 500ms ease-in-out"
       },
-      children: f.map((l, r) => /* @__PURE__ */ e(
+      children: f.map((s, r) => /* @__PURE__ */ e(
         "rect",
         {
-          x: l.x,
-          y: l.y,
-          width: l.width,
-          height: l.height,
+          x: s.x,
+          y: s.y,
+          width: s.width,
+          height: s.height,
           fill: d,
-          fillOpacity: l.isLast ? 0.14 : 0.06,
+          fillOpacity: s.isLast ? 0.14 : 0.06,
           rx: "2.5"
         },
         r
@@ -155,21 +155,21 @@ const ee = ({ data: i, color: o, isStale: t }) => {
 };
 ee.displayName = "BarsBg";
 const te = ({ value: i = 0, max: o = 100, color: t = "#4f46e5", colSpan: d = 1, isStale: f }) => {
-  const l = d >= 2 ? 40 : 34, r = 3.5, s = (l - r) / 2, n = 2 * Math.PI * s, a = f ? 0 : Math.min(Math.max(i / (o || 1), 0), 1), c = n * (1 - a);
+  const s = d >= 2 ? 40 : 34, r = 3.5, l = (s - r) / 2, n = 2 * Math.PI * l, a = f ? 0 : Math.min(Math.max(i / (o || 1), 0), 1), c = n * (1 - a);
   return /* @__PURE__ */ u(
     "svg",
     {
-      width: l,
-      height: l,
-      viewBox: `0 0 ${l} ${l}`,
+      width: s,
+      height: s,
+      viewBox: `0 0 ${s} ${s}`,
       style: { flexShrink: 0, marginRight: 8, display: "block" },
       children: [
         /* @__PURE__ */ e(
           "circle",
           {
-            cx: l / 2,
-            cy: l / 2,
-            r: s,
+            cx: s / 2,
+            cy: s / 2,
+            r: l,
             fill: "none",
             stroke: t,
             strokeOpacity: "0.06",
@@ -179,16 +179,16 @@ const te = ({ value: i = 0, max: o = 100, color: t = "#4f46e5", colSpan: d = 1,
         /* @__PURE__ */ e(
           "circle",
           {
-            cx: l / 2,
-            cy: l / 2,
-            r: s,
+            cx: s / 2,
+            cy: s / 2,
+            r: l,
             fill: "none",
             stroke: t,
             strokeWidth: r,
             strokeDasharray: n,
             strokeDashoffset: c,
             strokeLinecap: "round",
-            transform: `rotate(-90 ${l / 2} ${l / 2})`,
+            transform: `rotate(-90 ${s / 2} ${s / 2})`,
             style: { transition: "stroke-dashoffset 0.4s ease" }
           }
         )
@@ -197,8 +197,8 @@ const te = ({ value: i = 0, max: o = 100, color: t = "#4f46e5", colSpan: d = 1,
   );
 };
 te.displayName = "DonutChart";
-const re = ({ value: i = 0, max: o = 100, trendValue: t = 0, color: d = "#6b7280", colSpan: f = 1, isStale: l }) => {
-  const r = f >= 2 ? 44 : 36, s = 3.5, n = (r - s) / 2, a = 2 * Math.PI * n, c = l ? 0 : Math.min(Math.max(i / (o || 1), 0), 1), h = a * (1 - c), m = f >= 2 ? 11 : 9, y = `${Math.round(Math.abs(t))}%`;
+const re = ({ value: i = 0, max: o = 100, trendValue: t = 0, color: d = "#6b7280", colSpan: f = 1, isStale: s }) => {
+  const r = f >= 2 ? 44 : 36, l = 3.5, n = (r - l) / 2, a = 2 * Math.PI * n, c = s ? 0 : Math.min(Math.max(i / (o || 1), 0), 1), h = a * (1 - c), m = f >= 2 ? 11 : 9, y = `${Math.round(Math.abs(t))}%`;
   return /* @__PURE__ */ u(
     "div",
     {
@@ -230,7 +230,7 @@ const re = ({ value: i = 0, max: o = 100, trendValue: t = 0, color: d = "#6b7280
                   fill: "none",
                   stroke: d,
                   strokeOpacity: "0.06",
-                  strokeWidth: s
+                  strokeWidth: l
                 }
               ),
               /* @__PURE__ */ e(
@@ -241,7 +241,7 @@ const re = ({ value: i = 0, max: o = 100, trendValue: t = 0, color: d = "#6b7280
                   r: n,
                   fill: "none",
                   stroke: d,
-                  strokeWidth: s,
+                  strokeWidth: l,
                   strokeDasharray: a,
                   strokeDashoffset: h,
                   strokeLinecap: "round",
@@ -277,21 +277,21 @@ const re = ({ value: i = 0, max: o = 100, trendValue: t = 0, color: d = "#6b7280
 re.displayName = "ObjectArrow";
 const We = { slot3: 200, slot5: 380 };
 function $e(i, o) {
-  const t = We, d = 150, [f, l] = ge(1), r = B(null), s = B(null), n = C(() => {
+  const t = We, d = 150, [f, s] = ge(1), r = B(null), l = B(null), n = C(() => {
     const c = r.current;
     if (c == null) return;
     const h = c < t.slot3 ? 1 : c < t.slot5 ? 3 : 5;
-    l((m) => m === h ? m : h), r.current = null, s.current && (clearTimeout(s.current), s.current = null);
+    s((m) => m === h ? m : h), r.current = null, l.current && (clearTimeout(l.current), l.current = null);
   }, [t.slot3, t.slot5]);
   pe(() => {
     const c = i.current;
     if (!c || typeof ResizeObserver > "u") return;
     const h = new ResizeObserver((m) => {
       const y = m[0]?.contentRect.width ?? 0;
-      r.current = y, s.current && clearTimeout(s.current), s.current = setTimeout(n, d);
+      r.current = y, l.current && clearTimeout(l.current), l.current = setTimeout(n, d);
     });
     return h.observe(c), () => {
-      h.disconnect(), s.current && clearTimeout(s.current);
+      h.disconnect(), l.current && clearTimeout(l.current);
     };
   }, [i, n, d]);
   const a = C(() => {
@@ -303,16 +303,16 @@ function Ee() {
   return typeof globalThis < "u" && globalThis.__GLOSS_FLAGS__?.v1_1_status_mode === !0 ? !0 : typeof process < "u" && process.env ? process.env.NEXT_PUBLIC_V1_1_STATUS_MODE === "true" : !1;
 }
 function ie(i) {
-  const { onStatusSlotClick: o } = i, t = B(null), d = Ee(), { capacity: f, onPointerUp: l } = $e(t), r = i.maxSlots ?? f, s = i.statuses.slice(0, r);
+  const { onStatusSlotClick: o } = i, t = B(null), d = Ee(), { capacity: f, onPointerUp: s } = $e(t), r = i.maxSlots ?? f, l = i.statuses.slice(0, r);
   if (!d) {
     const n = i.statuses[0];
     return /* @__PURE__ */ u(
-      N,
+      M,
       {
         definition: { display: "flex", direction: "column" },
         className: "gloss-status-card gloss-status-card--flag-off",
         children: [
-          /* @__PURE__ */ e(R, { className: "gloss-metric-card__label", children: i.label }),
+          /* @__PURE__ */ e(M, { className: "gloss-metric-card__zone-a", children: /* @__PURE__ */ e(R, { className: "gloss-metric-card__label", children: i.label }) }),
           n != null ? /* @__PURE__ */ e(R, { children: String(n.value) }) : null
         ]
       }
@@ -325,10 +325,10 @@ function ie(i) {
       className: "gloss-status-card",
       "data-status-mode": "on",
       "data-status-capacity": r,
-      onPointerUp: l,
+      onPointerUp: s,
       children: [
-        /* @__PURE__ */ e(R, { className: "gloss-metric-card__label", children: i.label }),
-        /* @__PURE__ */ e("div", { className: "gloss-status-slots", "data-status-slot-count": s.length, children: s.map((n, a) => {
+        /* @__PURE__ */ e(M, { className: "gloss-metric-card__zone-a", children: /* @__PURE__ */ e(R, { className: "gloss-metric-card__label", children: i.label }) }),
+        /* @__PURE__ */ e("div", { className: "gloss-status-slots", "data-status-slot-count": l.length, children: l.map((n, a) => {
           const c = i.sparklinePerStatus?.[n.id], h = n.id === i.activeStatusId;
           return /* @__PURE__ */ u(
             "div",
@@ -355,8 +355,8 @@ ie.displayName = "StatusModeCard";
 function je(i, o) {
   if (!o) return;
   if (i == null) return o.fallback;
-  const { operator: t, threshold: d, result: f, fallback: l } = o;
-  return (t === "lt" ? i < d : t === "gt" ? i > d : t === "eq" ? Math.abs(i - d) < 1e-9 : t === "gte" ? i >= d : t === "lte" ? i <= d : !1) ? f : l;
+  const { operator: t, threshold: d, result: f, fallback: s } = o;
+  return (t === "lt" ? i < d : t === "gt" ? i > d : t === "eq" ? Math.abs(i - d) < 1e-9 : t === "gte" ? i >= d : t === "lte" ? i <= d : !1) ? f : s;
 }
 const E = {
   up: "var(--color-positive)",
@@ -418,31 +418,31 @@ const E = {
     variant: t = "standard",
     label: d,
     labelAdornment: f,
-    value: l,
+    value: s,
     valueFormat: r,
-    trend: s,
+    trend: l,
     subtitle: n,
     colSpan: a = 1,
     isStale: c,
     thresholdBreach: h = "none"
-  } = o, m = t === "sparkline" || t === "bars" || t === "donut" ? o.accentColor ?? "#4f46e5" : "#4f46e5", y = t === "highlight" ? o.highlightColor : void 0, p = t === "sparkline" ? o.sparklineData : void 0, S = t === "bars" ? o.barData : void 0, x = t === "donut" ? o.donutValue : 0, w = t === "donut" ? o.donutMax ?? 100 : 100, T = t === "object-arrow" ? o.objectArrowValue : 0, W = t === "object-arrow" ? o.objectArrowMax : 100, $ = t === "arrow" ? o.arrowDirection : void 0, I = t === "versus" ? o.versusData : void 0, z = t === "segmented" ? o.segments : void 0, b = (t === "highlight" && o.tintCondition ? je(
+  } = o, m = t === "sparkline" || t === "bars" || t === "donut" ? o.accentColor ?? "#4f46e5" : "#4f46e5", y = t === "highlight" ? o.highlightColor : void 0, p = t === "sparkline" ? o.sparklineData : void 0, w = t === "bars" ? o.barData : void 0, x = t === "donut" ? o.donutValue : 0, S = t === "donut" ? o.donutMax ?? 100 : 100, L = t === "object-arrow" ? o.objectArrowValue : 0, W = t === "object-arrow" ? o.objectArrowMax : 100, $ = t === "arrow" ? o.arrowDirection : void 0, I = t === "versus" ? o.versusData : void 0, z = t === "segmented" ? o.segments : void 0, b = (t === "highlight" && o.tintCondition ? je(
     typeof o.value == "number" ? o.value : null,
     o.tintCondition
-  ) : void 0) ?? y, k = (b ? Ae[b] : void 0) || b, { formatted: L, tier: ne, length: oe } = O(
-    () => t === "status-mode" ? { formatted: "", tier: 0, length: 0 } : xe(l, {
+  ) : void 0) ?? y, k = (b ? Ae[b] : void 0) || b, { formatted: N, tier: ne, length: oe } = O(
+    () => t === "status-mode" ? { formatted: "", tier: 0, length: 0 } : xe(s, {
       prefix: r?.prefix || "",
       suffix: r?.suffix || "",
       abbreviated: r?.abbreviated
     }, a),
-    [t, l, r?.prefix, r?.suffix, r?.abbreviated, a]
+    [t, s, r?.prefix, r?.suffix, r?.abbreviated, a]
   );
   if (o.variant === "status-mode")
     return /* @__PURE__ */ e(ie, { ...o });
-  const _ = { display: L, full: L, length: oe }, le = Y(_.length, a), se = s?.direction && E[s.direction] || E.flat, H = c ? "gloss-metric-data-stale" : "gloss-metric-data-fresh", P = {
+  const T = { display: N, full: N, length: oe }, se = Y(T.length, a), le = l?.direction && E[l.direction] || E.flat, H = c ? "gloss-metric-data-stale" : "gloss-metric-data-fresh", P = {
     fontWeight: 700,
     letterSpacing: "-0.03em",
     color: t === "highlight" ? k : "rgba(0,0,0,0.87)",
-    fontSize: le,
+    fontSize: se,
     lineHeight: 1.1,
     whiteSpace: "nowrap",
     overflow: "hidden"
@@ -490,7 +490,7 @@ const E = {
       prefix: r?.prefix || "",
       suffix: r?.suffix || "",
       abbreviated: r?.abbreviated
-    }), M = Q(I.prior, {
+    }), _ = Q(I.prior, {
       prefix: r?.prefix || "",
       suffix: r?.suffix || "",
       abbreviated: r?.abbreviated
@@ -514,7 +514,7 @@ const E = {
         /* @__PURE__ */ e("span", { style: { fontSize: 10, color: "rgba(0,0,0,0.35)", marginTop: 2 }, children: I.currentLabel })
       ] }),
       /* @__PURE__ */ e(
-        we,
+        Se,
         {
           definition: { orientation: "vertical", color: "rgba(0,0,0,0.08)" },
           style: { flexShrink: 0 }
@@ -531,8 +531,8 @@ const E = {
               color: "rgba(0,0,0,0.5)",
               lineHeight: 1.1
             },
-            title: M.full,
-            children: M.display
+            title: _.full,
+            children: _.display
           }
         ),
         /* @__PURE__ */ e("span", { style: { fontSize: 10, color: "rgba(0,0,0,0.35)", marginTop: 2 }, children: I.priorLabel })
@@ -549,7 +549,7 @@ const E = {
           gap: 1,
           overflow: "hidden"
         },
-        children: z.map((v, M) => /* @__PURE__ */ e(
+        children: z.map((v, _) => /* @__PURE__ */ e(
           "div",
           {
             style: {
@@ -558,7 +558,7 @@ const E = {
               minWidth: 2
             }
           },
-          M
+          _
         ))
       }
     ),
@@ -571,7 +571,7 @@ const E = {
           flexWrap: "wrap",
           marginTop: 4
         },
-        children: z.map((v, M) => /* @__PURE__ */ u(
+        children: z.map((v, _) => /* @__PURE__ */ u(
           "div",
           {
             style: {
@@ -595,7 +595,7 @@ const E = {
               /* @__PURE__ */ e("span", { style: { fontSize: 10, color: "rgba(0,0,0,0.5)" }, children: v.label })
             ]
           },
-          M
+          _
         ))
       }
     )
@@ -624,13 +624,12 @@ const E = {
       }
     ),
     t === "sparkline" && /* @__PURE__ */ e(F, { data: p, color: m, isStale: c }),
-    t === "bars" && /* @__PURE__ */ e(ee, { data: S, color: m, isStale: c }),
+    t === "bars" && /* @__PURE__ */ e(ee, { data: w, color: m, isStale: c }),
     /* @__PURE__ */ u(
-      N,
+      M,
       {
         className: "gloss-metric-card__zone-a",
         "data-tier": ne,
-        style: { height: 28, flexShrink: 0, zIndex: 2, position: "relative", display: "flex", alignItems: "center" },
         children: [
           /* @__PURE__ */ e(R, { className: "gloss-metric-card__label", children: d }),
           f
@@ -638,47 +637,47 @@ const E = {
       }
     ),
     /* @__PURE__ */ u(
-      N,
+      M,
       {
         definition: { display: "flex", align: "center" },
         className: `gloss-metric-card__zone-b ${H}`,
         style: { flex: 1, zIndex: 2, position: "relative", minHeight: 0 },
         children: [
-          t === "donut" && /* @__PURE__ */ e(te, { value: x, max: w, color: m, colSpan: a, isStale: c }),
+          t === "donut" && /* @__PURE__ */ e(te, { value: x, max: S, color: m, colSpan: a, isStale: c }),
           t === "object-arrow" && /* @__PURE__ */ e(
             re,
             {
-              value: T,
+              value: L,
               max: W,
-              trendValue: s?.value,
-              color: se,
+              trendValue: l?.value,
+              color: le,
               colSpan: a,
               isStale: c
             }
           ),
           t === "arrow" && ce(),
-          t !== "versus" && t !== "segmented" && /* @__PURE__ */ e("span", { style: P, title: _.full, children: _.display }),
+          t !== "versus" && t !== "segmented" && /* @__PURE__ */ e("span", { style: P, title: T.full, children: T.display }),
           t === "versus" && de(),
-          t === "segmented" && /* @__PURE__ */ e("span", { style: P, title: _.full, children: _.display })
+          t === "segmented" && /* @__PURE__ */ e("span", { style: P, title: T.full, children: T.display })
         ]
       }
     ),
     /* @__PURE__ */ u(
-      N,
+      M,
       {
         definition: { display: "flex", justify: "between", align: "center" },
         className: `gloss-metric-card__zone-c ${H}`,
         style: { minHeight: 18, flexShrink: 0, zIndex: 2, position: "relative" },
         children: [
           /* @__PURE__ */ e("span", { style: ae, children: n }),
-          G && s?.value != null ? /* @__PURE__ */ e("span", { style: {
+          G && l?.value != null ? /* @__PURE__ */ e("span", { style: {
             backgroundColor: "rgba(255,255,255,0.78)",
             backdropFilter: "blur(4px)",
             WebkitBackdropFilter: "blur(4px)",
             borderRadius: 4,
             display: "inline-flex",
             flexShrink: 0
-          }, children: /* @__PURE__ */ e(j, { value: s?.value, direction: s?.direction }) }) : /* @__PURE__ */ e(j, { value: s?.value, direction: s?.direction })
+          }, children: /* @__PURE__ */ e(j, { value: l?.value, direction: l?.direction }) }) : /* @__PURE__ */ e(j, { value: l?.value, direction: l?.direction })
         ]
       }
     ),
@@ -692,35 +691,35 @@ const A = ({
   selectedId: t,
   defaultId: d,
   onSelect: f,
-  pinnedId: l,
+  pinnedId: s,
   onPin: r,
-  isOpen: s = !1,
+  isOpen: l = !1,
   onOpenChange: n,
   disableHover: a = !1
 }) => {
-  const c = B(null), h = s, m = o.find((g) => g.id === t), y = !!m, p = m || o.find((g) => g.id === l) || o.find((g) => g.id === d) || o[0], S = O(() => {
+  const c = B(null), h = l, m = o.find((g) => g.id === t), y = !!m, p = m || o.find((g) => g.id === s) || o.find((g) => g.id === d) || o[0], w = O(() => {
     if (!p || !["7d", "30d", "60d", "90d", "mtd", "qtd", "ytd", "lytd"].includes(p.id))
       return "";
     const { start: b, end: k } = be(p.id);
     return ve(b, k, /* @__PURE__ */ new Date());
   }, [p]), x = C(() => {
     a || n && n(i, !0);
-  }, [i, n, a]), w = C(() => {
+  }, [i, n, a]), S = C(() => {
     a || n && n(i, !1);
-  }, [i, n, a]), T = C(() => {
+  }, [i, n, a]), L = C(() => {
     n && n(i, !1);
   }, [i, n]), W = C(() => {
     n && n(i, !h);
   }, [i, h, n]), $ = C((g) => {
-    f(g), T();
-  }, [f, T]), I = C((g, b) => {
+    f(g), L();
+  }, [f, L]), I = C((g, b) => {
     g.stopPropagation(), r && r(b);
   }, [r]), z = /* @__PURE__ */ u(
     D,
     {
       ref: c,
       onMouseEnter: x,
-      onMouseLeave: w,
+      onMouseLeave: S,
       sx: { position: "relative", display: "inline-flex" },
       children: [
         /* @__PURE__ */ e(
@@ -765,16 +764,16 @@ const A = ({
               {
                 elevation: 8,
                 onMouseEnter: x,
-                onMouseLeave: w,
+                onMouseLeave: S,
                 sx: {
                   minWidth: 120,
                   mt: 0.5,
                   py: 0.5
                 },
                 children: /* @__PURE__ */ e(ze, { dense: !0, children: o.map((g) => {
-                  const b = t === g.id, k = l === g.id;
+                  const b = t === g.id, k = s === g.id;
                   return /* @__PURE__ */ u(
-                    Me,
+                    _e,
                     {
                       onClick: () => $(g.id),
                       selected: b,
@@ -790,7 +789,7 @@ const A = ({
                         /* @__PURE__ */ u(D, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
                           b && /* @__PURE__ */ e(Oe, { fontSize: "small", color: "primary", sx: { fontSize: 14 } }),
                           /* @__PURE__ */ e(
-                            _e,
+                            Me,
                             {
                               primary: g.label,
                               primaryTypographyProps: {
@@ -805,7 +804,7 @@ const A = ({
                           Te,
                           {
                             size: "small",
-                            onClick: (L) => I(L, g.id),
+                            onClick: (N) => I(N, g.id),
                             sx: {
                               p: 0.25,
                               opacity: k ? 1 : 0,
@@ -830,10 +829,10 @@ const A = ({
       ]
     }
   );
-  return S ? /* @__PURE__ */ e(
+  return w ? /* @__PURE__ */ e(
     Le,
     {
-      title: S,
+      title: w,
       placement: "top-start",
       slotProps: {
         popper: {
@@ -851,9 +850,9 @@ function Ve({
   pinnedPreset: t = "30d",
   onPin: d,
   openGroup: f,
-  onOpenChange: l,
+  onOpenChange: s,
   disableHover: r = !1,
-  showCalendarEntry: s = !0,
+  showCalendarEntry: l = !0,
   calendarEntry: n
 }) {
   const a = i === "today";
@@ -883,7 +882,7 @@ function Ve({
         pinnedId: t,
         onPin: d,
         isOpen: f === "rolling",
-        onOpenChange: l,
+        onOpenChange: s,
         disableHover: r
       }
     ),
@@ -891,18 +890,18 @@ function Ve({
       A,
       {
         groupId: "period",
-        options: Se,
+        options: we,
         selectedId: i,
         defaultId: t,
         onSelect: o,
         pinnedId: t,
         onPin: d,
         isOpen: f === "period",
-        onOpenChange: l,
+        onOpenChange: s,
         disableHover: r
       }
     ),
-    s && /* @__PURE__ */ u(J, { children: [
+    l && /* @__PURE__ */ u(J, { children: [
       /* @__PURE__ */ e(Ne, { orientation: "vertical", flexItem: !0, sx: { mx: 0.5 } }),
       n
     ] })

package/catalog.js

@@ -1,10 +1,10 @@
-import { A as I, Q as N, E as B, J as x, L as D, D as F, F as A, H as M, K as v, T as R, U as _, V as H, aX as W, W as k, aY as z, aZ as L, a_ as E, X as G, Y as $, Z as O } from "./Expandable-DhUz3Ksz.js";
-import { a5 as Be, b2 as xe, aA as De, aj as Fe, $ as Ae, ap as Me, bG as ve, N as Re, aa as _e, P as He, B as We, bc as ke, C as ze, bk as Le, b as Ee, c as Ge, O as $e, q as Oe, af as we, aO as Ve, aD as Xe, as as je, m as Ze, o as Ue, aG as qe, ad as Ke, b4 as Qe, ab as Ye, _ as Je, ar as ea, aR as aa, b6 as sa, p as ta, ao as ra, a2 as oa, at as ia, a4 as na, ac as la, bw as da, aU as ca, t as ma, I as ga, i as pa, ax as ua, M as ba, y as fa, au as ha, bB as Ta, aq as ya, w as Sa, aT as Pa, a$ as Ca, al as Ia, aL as Na, ai as Ba, an as xa, av as Da, bI as Fa, aS as Aa, bH as Ma, ae as va, e as Ra, R as _a, l as Ha, r as Wa, aI as ka, ak as za, ag as La, j as Ea, z as Ga, b3 as $a, ah as Oa, b8 as wa, bb as Va, b9 as Xa, ba as ja, k as Za, b5 as Ua, S as qa, bd as Ka, aw as Qa, b7 as Ya, bC as Ja, am as es, bF as as, v as ss, bx as ts, n as rs, h as os, s as is, a0 as ns, a9 as ls, bj as ds, bq as cs, aC as ms, a8 as gs, aQ as ps, aF as us, az as bs, aN as fs, aK as hs, a3 as Ts } from "./Expandable-DhUz3Ksz.js";
+import { A as I, Q as N, E as B, J as x, L as D, D as F, F as A, H as M, K as v, T as R, U as _, V as H, aX as W, W as k, aY as z, aZ as L, a_ as E, X as G, Y as $, Z as O } from "./Expandable-BnGSJjQg.js";
+import { a5 as Be, b2 as xe, aA as De, aj as Fe, $ as Ae, ap as Me, bG as ve, N as Re, aa as _e, P as He, B as We, bc as ke, C as ze, bk as Le, b as Ee, c as Ge, O as $e, q as Oe, af as we, aO as Ve, aD as Xe, as as je, m as Ze, o as Ue, aG as qe, ad as Ke, b4 as Qe, ab as Ye, _ as Je, ar as ea, aR as aa, b6 as sa, p as ta, ao as ra, a2 as oa, at as ia, a4 as na, ac as la, bw as da, aU as ca, t as ma, I as ga, i as pa, ax as ua, M as ba, y as fa, au as ha, bB as Ta, aq as ya, w as Sa, aT as Pa, a$ as Ca, al as Ia, aL as Na, ai as Ba, an as xa, av as Da, bI as Fa, aS as Aa, bH as Ma, ae as va, e as Ra, R as _a, l as Ha, r as Wa, aI as ka, ak as za, ag as La, j as Ea, z as Ga, b3 as $a, ah as Oa, b8 as wa, bb as Va, b9 as Xa, ba as ja, k as Za, b5 as Ua, S as qa, bd as Ka, aw as Qa, b7 as Ya, bC as Ja, am as es, bF as as, v as ss, bx as ts, n as rs, h as os, s as is, a0 as ns, a9 as ls, bj as ds, bq as cs, aC as ms, a8 as gs, aQ as ps, aF as us, az as bs, aN as fs, aK as hs, a3 as Ts } from "./Expandable-BnGSJjQg.js";
 import { jsx as c, jsxs as S } from "react/jsx-runtime";
 import { C as e, T as a, aa as w, S as s, E as u, R as g, Z as V } from "./UIContext-CGQI_KJk.js";
 import { B as X, a as j, e as Z, c as U, d as q, b as K } from "./BaseAsyncButton-CJlY7Uik.js";
 import { b as Q } from "./BaseText-Dxbk1JJa.js";
-import { B as Ss, D as Ps, M as Cs, O as Is, a as Ns, T as Bs } from "./TimeframeQuickBar-CHl409rH.js";
+import { B as Ss, D as Ps, M as Cs, O as Is, a as Ns, T as Bs } from "./TimeframeQuickBar-DFK4fnAA.js";
 import { formatDateRange as Ds, resolveEvent as Fs, resolvePreset as As, smartDateFormat as Ms } from "@mt-gloss/utils/dateInterpretation";
 const Y = {
   page: {

package/composites-panels.js

@@ -5,7 +5,7 @@ import * as B from "react";
 import k, { useState as x, useRef as q, createContext as be, useContext as ve, useMemo as ce, useEffect as z, useCallback as R, useLayoutEffect as Re } from "react";
 import { SPIN_COMMIT_REDUCED as $e, SPIN_COMMIT_FULL as Fe } from "@mt-gloss/motion";
 import { useMotionValue as de, animate as V, motion as ze } from "framer-motion";
-import { b as He, M as ue } from "./TimeframeQuickBar-CHl409rH.js";
+import { b as He, M as ue } from "./TimeframeQuickBar-DFK4fnAA.js";
 import { useSensors as Ue, useSensor as pe, PointerSensor as Be, KeyboardSensor as Ve, DndContext as Ye, closestCenter as Ke } from "@dnd-kit/core";
 import { sortableKeyboardCoordinates as qe, SortableContext as Ge, horizontalListSortingStrategy as Qe, arrayMove as We, useSortable as je } from "@dnd-kit/sortable";
 import { CSS as Ze } from "@dnd-kit/utilities";