@mt-gloss/ui 0.1.87 → 0.1.89

package/{COMMITS-6U31xb_s.js → COMMITS-CoGFzpf4.js}

@@ -1,18 +1,18 @@
 import { jsx as i, jsxs as f, Fragment as v } from "react/jsx-runtime";
-import { createContext as I, useContext as p, useReducer as S, useRef as s, useEffect as c, useMemo as E, useCallback as C, useLayoutEffect as _ } from "react";
-const u = I(null);
-function h() {
-  const e = p(u);
+import { createContext as _, useContext as p, useReducer as h, useRef as u, useEffect as s, useMemo as E, useCallback as g, useState as P, useLayoutEffect as C } from "react";
+const d = _(null);
+function S() {
+  const e = p(d);
   if (!e)
     throw new Error(
       "[panels] usePanelContext must be used inside <PanelProvider>. See @mt-gloss/ui/composites/panels."
     );
   return e;
 }
-function w() {
-  return p(u);
+function F() {
+  return p(d);
 }
-const y = {
+const m = {
   activePanelId: null,
   activeTrigger: null,
   bellCutoutOpen: !1,
@@ -20,11 +20,21 @@ const y = {
   lockHint: null,
   lastClose: null,
   pendingSideEffects: []
-}, P = /* @__PURE__ */ new Set(["settings"]);
+}, y = /* @__PURE__ */ new Set(["settings"]);
 function O(e, n) {
-  return e == null ? !1 : JSON.stringify(e) === JSON.stringify(n);
+  if (e == null || e.kind !== n.kind) return !1;
+  switch (e.kind) {
+    case "bell":
+      return !0;
+    case "card-overflow":
+      return e.cardId === n.cardId && e.sectionIndex === n.sectionIndex && e.action === n.action;
+    case "empty-cell":
+      return e.sectionIndex === n.sectionIndex && e.cellPosition.row === n.cellPosition.row && e.cellPosition.col === n.cellPosition.col;
+    case "manage-pages-action":
+      return e.global === n.global && e.align === n.align;
+  }
 }
-function m(e, n) {
+function L(e, n) {
   switch (n.type) {
     case "OPEN_PANEL": {
       if (e.activePanelId && e.isDirty)
@@ -91,7 +101,7 @@ function m(e, n) {
     case "CLOSE_BELL_CUTOUT":
       return e.bellCutoutOpen ? { ...e, bellCutoutOpen: !1 } : e;
     case "BUFFER_BECOMES_DIRTY":
-      return e.activePanelId == null || !P.has(e.activePanelId) ? {
+      return e.activePanelId == null || !y.has(e.activePanelId) ? {
         ...e,
         pendingSideEffects: [
           ...e.pendingSideEffects,
@@ -124,12 +134,14 @@ function m(e, n) {
       return e;
   }
 }
-function L(e) {
+function T(e) {
   return e.activePanelId === "notification-center" ? "notif-center" : e.activePanelId != null && e.bellCutoutOpen ? e.isDirty ? "panel-dirty+cutout" : "panel-clean+cutout" : e.activePanelId != null ? e.isDirty ? "panel-dirty" : "panel-clean" : e.bellCutoutOpen ? "bell-cutout-only" : "idle";
 }
-function N() {
-  const [e, n] = S(m, y), t = s([]), l = s(null);
-  c(() => {
+function D() {
+  const [e, n] = h(L, m), t = u([]), l = u(null);
+  s(() => () => {
+    l.current != null && (window.clearTimeout(l.current), l.current = null);
+  }, []), s(() => {
     if (e.pendingSideEffects.length !== 0) {
       for (const r of e.pendingSideEffects)
         r.type === "SCHEDULE_TIMER" ? (l.current != null && window.clearTimeout(l.current), l.current = window.setTimeout(() => {
@@ -145,7 +157,7 @@ function N() {
         ] : r.type === "INVALID_DISPATCH" && process.env.NODE_ENV !== "production" && console.warn("[panels] INVALID_DISPATCH:", r.reason);
       n({ type: "DRAIN_SIDE_EFFECTS" });
     }
-  }, [e.pendingSideEffects]), c(() => {
+  }, [e.pendingSideEffects, n]), s(() => {
     if (!e.lastClose) return;
     const r = {
       panelId: e.lastClose.panelId,
@@ -159,35 +171,39 @@ function N() {
     ];
   }, [e.lastClose]);
   const o = E(
-    () => L(e),
+    () => T(e),
     // eslint-disable-next-line react-hooks/exhaustive-deps
     [e.activePanelId, e.bellCutoutOpen, e.isDirty]
-  ), a = C(() => t.current.slice(), []);
+  ), a = g(() => t.current.slice(), []);
   return { state: e, surfaceState: o, dispatch: n, getCloseLog: a };
 }
-function F({ children: e }) {
-  const n = N(), t = E(
+function k({ children: e }) {
+  const n = D(), t = E(
     () => n,
     // Re-publish only when one of the four coordinator fields changes identity.
     // dispatch + getCloseLog are stable. state + surfaceState change on dispatch.
     [n.state, n.surfaceState, n.dispatch, n.getCloseLog]
   );
-  return /* @__PURE__ */ i(u.Provider, { value: t, children: e });
+  return /* @__PURE__ */ i(d.Provider, { value: t, children: e });
 }
-const T = {
+const N = {
   position: "relative",
   pointerEvents: "auto"
 };
-function D({ children: e, onClose: n, isOpen: t = !0, footer: l }) {
-  return /* @__PURE__ */ f(
+function x({ children: e, onClose: n, isOpen: t = !0, footer: l }) {
+  const [o, a] = P(!1);
+  return C(() => {
+    const r = requestAnimationFrame(() => a(t));
+    return () => cancelAnimationFrame(r);
+  }, [t]), /* @__PURE__ */ f(
     "div",
     {
       "data-chrome": "panel",
-      "data-open": t ? "true" : "false",
+      "data-open": o ? "true" : "false",
       role: "dialog",
       "aria-modal": "true",
       className: "gloss-panel-chrome",
-      style: T,
+      style: N,
       children: [
         /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__header", children: /* @__PURE__ */ i(
           "button",
@@ -206,7 +222,7 @@ function D({ children: e, onClose: n, isOpen: t = !0, footer: l }) {
     }
   );
 }
-const b = {
+const H = {
   position: "fixed",
   top: 0,
   left: 0,
@@ -217,57 +233,64 @@ const b = {
   overflow: "visible",
   pointerEvents: "none",
   zIndex: 55
-}, x = {
+}, b = {
   position: "fixed",
   top: "var(--tb-h, 60px)",
   left: 0,
   right: 0,
   bottom: 0,
   zIndex: 1,
-  pointerEvents: "auto",
+  // CR-03 fix: pass-through tint — scrim is visual-only and must not intercept
+  // grid card clicks. Click-outside / scrim-dismiss is handled via the onClick
+  // on the div below, which still fires because pointer events on the element
+  // itself are honoured when explicitly set; using 'none' prevents the invisible
+  // overlay from swallowing clicks on underlying controls (same class as the
+  // panel-wrapper-covers-grid-cards bug fixed at V2FeedbackSurface).
+  pointerEvents: "none",
   background: "rgba(0, 0, 0, 0.04)"
 };
 function R({ panelComponents: e }) {
-  const { state: n, dispatch: t, getCloseLog: l } = h(), o = n.activePanelId ? e[n.activePanelId] : null;
+  const { state: n, dispatch: t, getCloseLog: l } = S(), o = n.activePanelId ? e[n.activePanelId] : null;
   n.activePanelId && !o && process.env.NODE_ENV !== "production" && console.error(
     "[panels] No panel component registered for activePanelId:",
     n.activePanelId
-  ), c(() => {
+  ), s(() => {
     if (n.activePanelId == null) return;
-    function d(g) {
-      g.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
+    function c(I) {
+      I.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
     }
-    return document.addEventListener("keydown", d), () => {
-      document.removeEventListener("keydown", d);
+    return document.addEventListener("keydown", c), () => {
+      document.removeEventListener("keydown", c);
     };
   }, [n.activePanelId, t]);
-  const a = s(n);
-  _(() => {
+  const a = u(n);
+  C(() => {
     a.current = n;
-  }), c(() => {
-    if (process.env.NODE_ENV !== "production")
-      return window.__panelsHostHandle = {
-        dispatch: t,
-        getState: () => a.current,
-        getCloseLog: l
-      }, () => {
-        delete window.__panelsHostHandle;
-      };
+  }), s(() => {
+    if (process.env.NODE_ENV === "production") return;
+    const c = window;
+    return c.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), c.__panelsHostHandle = {
+      dispatch: t,
+      getState: () => a.current,
+      getCloseLog: l
+    }, () => {
+      c.__panelsHostHandle?.dispatch === t && delete c.__panelsHostHandle;
+    };
   }, [t, l]);
-  const r = C(() => {
+  const r = g(() => {
     t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
   }, [t]);
-  return /* @__PURE__ */ i("div", { "data-panel-host": "true", style: b, children: n.activePanelId != null && o != null && /* @__PURE__ */ f(v, { children: [
+  return /* @__PURE__ */ i("div", { "data-panel-host": "true", style: H, children: n.activePanelId != null && o != null && /* @__PURE__ */ f(v, { children: [
     /* @__PURE__ */ i(
       "div",
       {
         "data-panel-scrim": "true",
-        style: x,
+        style: b,
         onClick: r
       }
     ),
     /* @__PURE__ */ i(
-      D,
+      x,
       {
         isOpen: !0,
         onClose: () => t({ type: "CLOSE_PANEL", reason: "header-x" }),
@@ -276,7 +299,7 @@ function R({ panelComponents: e }) {
     )
   ] }) });
 }
-const k = {
+const U = {
   "apply-button": !0,
   // the ONLY commit reason
   "cancel-button": !1,
@@ -290,14 +313,14 @@ const k = {
   "nav-escape-hatch": !1
 };
 export {
-  k as C,
-  F as P,
-  w as a,
+  U as C,
+  k as P,
+  F as a,
   R as b,
-  D as c,
-  N as d,
-  L as e,
-  y as i,
-  m as r,
-  h as u
+  x as c,
+  D as d,
+  T as e,
+  m as i,
+  L as r,
+  S as u
 };

package/{Expandable-D00kXkfM.js → Expandable-BcmIxWR8.js}

@@ -1,7 +1,7 @@
 import { jsxs as d, jsx as e, Fragment as We } from "react/jsx-runtime";
 import * as mr from "react";
 import Z, { useId as Le, useState as H, useCallback as N, createContext as Xt, useContext as qt, useRef as ce, useEffect as se, useMemo as ee, useSyncExternalStore as is, useReducer as ls, forwardRef as cs, useImperativeHandle as ds } from "react";
-import { S as J, E as Ze, C as B, i as us, R as Se, l as ms, m as ps, n as fs, aj as gs, Q as hs, t as bs, ad as ys, ak as ve, V as vs, W as Ja, X as Qa, Y as _s, _ as xs, $ as Ns, a0 as Ss, a1 as Cs, a2 as ws, a5 as ks, a6 as Ds, a7 as Is, ac as Ts, a8 as Es, a9 as Ms, P as Ps, O as Rs, j as Bs, k as As, a3 as zs, a4 as $s, o as Fs, v as Os, z as Ls, w as Hs, U as _t, A as Ws, D as Gs, x as Vs, F as js, y as Ks, ah as Ys, ai as Us, G as Xs, H as qs, I as Zs, J as Js, K as Qs, L as eo, M as to, N as ro, a as ge, b as Gt, f as en, e as Dt, h as Je, Z as tn, B as ao, af as no, d as rn, T as Ae, ae as so, ag as Na } from "./UIContext-DP6JGCto.js";
+import { S as J, E as Ze, C as B, i as us, R as Se, l as ms, m as ps, n as fs, aj as gs, Q as hs, t as bs, ad as ys, ak as ve, V as vs, W as Ja, X as Qa, Y as _s, _ as xs, $ as Ns, a0 as Ss, a1 as Cs, a2 as ws, a5 as ks, a6 as Ds, a7 as Is, ac as Ts, a8 as Es, a9 as Ms, P as Ps, O as Rs, j as Bs, k as As, a3 as zs, a4 as $s, o as Fs, v as Os, z as Ls, w as Hs, U as _t, A as Ws, D as Gs, x as Vs, F as js, y as Ks, ah as Ys, ai as Us, G as Xs, H as qs, I as Zs, J as Js, K as Qs, L as eo, M as to, N as ro, a as fe, b as Gt, f as en, e as Dt, h as Je, Z as tn, B as ao, af as no, d as rn, T as Ae, ae as so, ag as Na } from "./UIContext-DP6JGCto.js";
 import { formatTrend as oo, isStatusModeEnabled as io, pickMetricTier as lo, getValueFontSize as Sa, formatValue as $r, getDateRangeForPreset as Ye, formatDateRangeSmart as ft, isInRange as co, isSameDay as rr, formatMarketDates as uo, DEFAULT_MARKET_PRESETS as ar, isMarketActive as St, detectPreset as nr, getDateRangeDisplayInfo as Ot, toUppercasePresetId as sr, generateMarketId as mo, ROLLING_OPTIONS as kr, PERIOD_OPTIONS as Dr } from "@mt-gloss/utils";
 import { useGridApiRef as po, DataGridPro as fo } from "@mui/x-data-grid-pro";
 import { Chip as Vt, Tooltip as ht, MenuItem as jt, Menu as go, Box as ne, Popper as ho, Paper as bo, MenuList as yo, ListItemText as vo, IconButton as qe, Select as Ca, Typography as Te, Divider as _o, Button as nt, Collapse as xo, Popover as No, Dialog as So, DialogTitle as Co, DialogContent as wo, TextField as or, DialogActions as ko, Tabs as Do, Tab as Io } from "@mui/material";
@@ -1186,7 +1186,7 @@ const hl = ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], bl = ["January", "
         de === "right" && /* @__PURE__ */ e("button", { type: "button", className: "gloss-preset-daterangepicker__nav-btn", onClick: () => U(1), "aria-label": "Next month", children: /* @__PURE__ */ e(ve, { name: "chevron-right", size: "sm" }) })
       ] }),
       /* @__PURE__ */ e("div", { className: "gloss-preset-daterangepicker__day-headers", children: G.map((ie) => /* @__PURE__ */ e("span", { className: "gloss-preset-daterangepicker__day-header", children: ie }, ie)) }),
-      /* @__PURE__ */ e(Qa, { children: be.map((ie, fe) => /* @__PURE__ */ e(ws, { selected: ie.isSelected, today: ie.isToday, outsideMonth: !ie.isCurrentMonth, disabled: ie.isDisabled, rangeStart: ie.isRangeStart, rangeEnd: ie.isRangeEnd, inRange: ie.inRange, onClick: () => !ie.isDisabled && F(ie.date), children: ie.date.getDate() }, fe)) })
+      /* @__PURE__ */ e(Qa, { children: be.map((ie, ge) => /* @__PURE__ */ e(ws, { selected: ie.isSelected, today: ie.isToday, outsideMonth: !ie.isCurrentMonth, disabled: ie.isDisabled, rangeStart: ie.isRangeStart, rangeEnd: ie.isRangeEnd, inRange: ie.inRange, onClick: () => !ie.isDisabled && F(ie.date), children: ie.date.getDate() }, ge)) })
     ] });
     return /* @__PURE__ */ d("div", { className: te, ref: g, children: [
       _ && /* @__PURE__ */ e("label", { className: "gloss-preset-daterangepicker__label", htmlFor: I, children: _ }),
@@ -2894,7 +2894,7 @@ const Pc = (r) => {
         gap: n = 8
       } = r, s = Math.max(1, t);
       return /* @__PURE__ */ e(
-        ge,
+        fe,
         {
           className: "gloss-skeleton",
           "aria-hidden": "true",
@@ -2942,7 +2942,7 @@ const Aa = [60, 80, 45, 90, 65, 75, 55, 85, 70, 50], Rc = ({
 }) => {
   const a = Math.max(1, Math.min(r, Aa.length)), n = Aa.slice(0, a);
   return /* @__PURE__ */ e(
-    ge,
+    fe,
     {
       className: "gloss-skeleton-chart",
       "aria-hidden": "true",
@@ -2976,7 +2976,7 @@ const Bc = ({
   rowHeight: n = 44
 }) => {
   const s = Math.max(1, r), i = Math.max(1, t);
-  return /* @__PURE__ */ d(ge, { className: "gloss-skeleton-table", "aria-hidden": "true", style: { width: "100%" }, children: [
+  return /* @__PURE__ */ d(fe, { className: "gloss-skeleton-table", "aria-hidden": "true", style: { width: "100%" }, children: [
     /* @__PURE__ */ e(
       "div",
       {
@@ -3035,7 +3035,7 @@ const Ac = ({
 }) => {
   const a = t >= 2 ? "40%" : "55%";
   return /* @__PURE__ */ d(
-    ge,
+    fe,
     {
       className: "gloss-skeleton-card",
       "aria-hidden": "true",
@@ -3427,7 +3427,7 @@ function Tn(r) {
   if (!n) {
     const l = r.statuses[0];
     return /* @__PURE__ */ d(
-      ge,
+      fe,
       {
         definition: { display: "flex", direction: "column" },
         className: "gloss-status-card gloss-status-card--flag-off",
@@ -3752,7 +3752,7 @@ const Pr = {
     a === "sparkline" && /* @__PURE__ */ e(yr, { data: b, color: f, isStale: p }),
     a === "bars" && /* @__PURE__ */ e(wn, { data: _, color: f, isStale: p }),
     /* @__PURE__ */ d(
-      ge,
+      fe,
       {
         className: "gloss-metric-card__zone-a",
         "data-tier": C,
@@ -3764,7 +3764,7 @@ const Pr = {
       }
     ),
     /* @__PURE__ */ d(
-      ge,
+      fe,
       {
         definition: { display: "flex", align: "center" },
         className: `gloss-metric-card__zone-b ${O}`,
@@ -3790,7 +3790,7 @@ const Pr = {
       }
     ),
     /* @__PURE__ */ d(
-      ge,
+      fe,
       {
         definition: { display: "flex", justify: "between", align: "center" },
         className: `gloss-metric-card__zone-c ${O}`,
@@ -4088,7 +4088,7 @@ const En = (r) => {
   se(() => () => {
     ie.current !== null && (clearTimeout(ie.current), ie.current = null);
   }, []);
-  const fe = N(
+  const ge = N(
     (ae) => {
       if (!O) return;
       const xe = ae.nativeEvent?.relatedTarget, je = ae.relatedTarget, $e = xe ?? je;
@@ -4150,9 +4150,9 @@ const En = (r) => {
       "data-visible": n ? "true" : "false",
       "data-has-shown": h ? "true" : "false",
       style: de,
-      onPointerLeave: fe,
+      onPointerLeave: ge,
       onPointerEnter: Ce,
-      onMouseLeave: fe,
+      onMouseLeave: ge,
       onMouseEnter: Ce,
       ...K(),
       children: /* @__PURE__ */ d(
@@ -4427,7 +4427,7 @@ const id = [
     });
   }, _ = s === "stacked";
   return s === "dimension-chooser" ? /* @__PURE__ */ d(
-    ge,
+    fe,
     {
       definition: { display: "flex", direction: "column", padding: "10px 12px 8px", gap: "6px" },
       style: { width: "100%", height: "100%" },
@@ -4479,13 +4479,13 @@ const id = [
       ]
     }
   ) : /* @__PURE__ */ d(
-    ge,
+    fe,
     {
       definition: { display: "flex", direction: "column", padding: "10px 12px 8px", gap: "6px" },
       style: { width: "100%", height: "100%" },
       children: [
         /* @__PURE__ */ d(
-          ge,
+          fe,
           {
             definition: { display: "flex", align: "center", justify: "between" },
             className: "gloss-metric-card__back-title",
@@ -4512,7 +4512,7 @@ const id = [
           }
         ),
         /* @__PURE__ */ e(
-          ge,
+          fe,
           {
             definition: { display: "grid", gap: "6px" },
             style: { gridTemplateColumns: "repeat(3, 1fr)", flex: 1, alignContent: "center" },
@@ -4618,7 +4618,7 @@ const ot = function({
   onFlipChange: K,
   clickShadowSlot: q
 }) {
-  const [te, he] = H(!1), [oe, be] = H(!1), [de, ie] = H(!1), fe = U ?? de, Ce = ce(!1), ke = ce(null), Ne = V !== void 0 ? V : te, Xe = W ?? ke, we = ce(null), me = ce(null), _e = t ?? a, Ge = N(() => {
+  const [te, he] = H(!1), [oe, be] = H(!1), [de, ie] = H(!1), ge = U ?? de, Ce = ce(!1), ke = ce(null), Ne = V !== void 0 ? V : te, Xe = W ?? ke, we = ce(null), me = ce(null), _e = t ?? a, Ge = N(() => {
     we.current = null, me.current = null, U !== void 0 ? K?.(!0) : ie(!0);
   }, [U, K]), Ve = N(() => {
     if (C) {
@@ -4675,7 +4675,18 @@ const ot = function({
         boxShadow: u ? "var(--shadow-card), 0 0 0 2px var(--color-accent, #4f46e5)" : Ne && !c ? "var(--shadow-card-hover)" : "var(--shadow-card)",
         transition: "border-color 180ms, box-shadow 180ms",
         perspective: 600,
-        transformStyle: "preserve-3d",
+        // transformStyle 'preserve-3d' MOVED to the inner flipper div below
+        // (Path 1 — Quick 260511-6xk T3 second follow-up). When preserve-3d
+        // lived on the root, every sibling (FRONT/BACK BaseBox, click-shadow,
+        // hover bridge, ActionStrip) participated in a single 3D context
+        // where Chromium hit-testing uses composited-layer DOM order with
+        // z-index as a weak tiebreaker — FRONT BaseBox's backface-hidden
+        // composited layer intercepted clicks on the ActionStrip pill's
+        // inside-card 14px overlap. Path 2 (pointer-events:none on FRONT)
+        // alone didn't restore clicks because the click then fell through to
+        // the root which has no handler. Scoping preserve-3d to the flipper
+        // subtree means the strip, click-shadow, and hover bridge live in
+        // normal 2D stacking where z-index is authoritative.
         zIndex: (Ne || oe) && !c ? 10 : "auto",
         ...l
       },
@@ -4700,51 +4711,65 @@ const ot = function({
           }
         ),
         /* @__PURE__ */ d(
-          ge,
+          "div",
           {
-            definition: { display: "flex", direction: "column", padding: "10px 12px 8px", bg: "var(--color-surface-primary)", radius: "var(--gloss-metric-card-radius, 12px)" },
             style: {
               position: "absolute",
               inset: 0,
               zIndex: 2,
-              backfaceVisibility: "hidden",
-              WebkitBackfaceVisibility: "hidden",
-              transform: fe ? "rotateY(180deg)" : "rotateY(0deg)",
-              transition: "transform 500ms cubic-bezier(0.22, 1, 0.36, 1)"
+              transformStyle: "preserve-3d",
+              WebkitTransformStyle: "preserve-3d",
+              transform: ge ? "rotateY(180deg)" : "rotateY(0deg)",
+              transition: "transform 500ms cubic-bezier(0.22, 1, 0.36, 1)",
+              pointerEvents: "none"
             },
-            "data-resize-phase": F,
             children: [
-              _e,
-              /* @__PURE__ */ e("div", { className: "gloss-card-shell__resize-outgoing", "aria-hidden": "true", children: X })
-            ]
-          }
-        ),
-        /* @__PURE__ */ e(
-          ge,
-          {
-            definition: { bg: "var(--color-surface-primary)", radius: "var(--gloss-metric-card-radius, 12px)" },
-            style: {
-              position: "absolute",
-              inset: 0,
-              zIndex: 2,
-              backfaceVisibility: "hidden",
-              WebkitBackfaceVisibility: "hidden",
-              transform: fe ? "rotateY(0deg)" : "rotateY(-180deg)",
-              transition: "transform 500ms cubic-bezier(0.22, 1, 0.36, 1)"
-            },
-            children: D ?? /* @__PURE__ */ e(
-              Mn,
-              {
-                mode: C ? "stacked" : "single",
-                currentTimeframe: P,
-                onSelectTimeframe: ae,
-                title: x,
-                currentStackedTimeframes: T,
-                onSelectStackedTimeframes: (Pe) => {
-                  me.current = Pe;
+              /* @__PURE__ */ d(
+                fe,
+                {
+                  definition: { display: "flex", direction: "column", padding: "10px 12px 8px", bg: "var(--color-surface-primary)", radius: "var(--gloss-metric-card-radius, 12px)" },
+                  style: {
+                    position: "absolute",
+                    inset: 0,
+                    backfaceVisibility: "hidden",
+                    WebkitBackfaceVisibility: "hidden",
+                    pointerEvents: "none"
+                  },
+                  "data-resize-phase": F,
+                  children: [
+                    /* @__PURE__ */ e("div", { style: { pointerEvents: "auto", display: "flex", flexDirection: "column", flex: "1 1 auto", minHeight: 0 }, children: _e }),
+                    /* @__PURE__ */ e("div", { className: "gloss-card-shell__resize-outgoing", "aria-hidden": "true", children: X })
+                  ]
                 }
-              }
-            )
+              ),
+              /* @__PURE__ */ e(
+                fe,
+                {
+                  definition: { bg: "var(--color-surface-primary)", radius: "var(--gloss-metric-card-radius, 12px)" },
+                  style: {
+                    position: "absolute",
+                    inset: 0,
+                    backfaceVisibility: "hidden",
+                    WebkitBackfaceVisibility: "hidden",
+                    transform: "rotateY(180deg)",
+                    pointerEvents: "auto"
+                  },
+                  children: D ?? /* @__PURE__ */ e(
+                    Mn,
+                    {
+                      mode: C ? "stacked" : "single",
+                      currentTimeframe: P,
+                      onSelectTimeframe: ae,
+                      title: x,
+                      currentStackedTimeframes: T,
+                      onSelectStackedTimeframes: (Pe) => {
+                        me.current = Pe;
+                      }
+                    }
+                  )
+                }
+              )
+            ]
           }
         ),
         q,
@@ -4817,7 +4842,7 @@ const ot = function({
               visible: De,
               expanded: oe,
               onExpandedChange: be,
-              isFlipped: fe,
+              isFlipped: ge,
               onFlipBack: Ve,
               anchorX: j,
               context: {
@@ -4919,7 +4944,7 @@ const pd = function(t) {
         "data-stacked-capacity": M,
         style: { position: "relative", width: "100%", height: "100%" },
         children: /* @__PURE__ */ d(
-          ge,
+          fe,
           {
             definition: { display: "flex", direction: "column" },
             style: { position: "relative", width: "100%", height: "100%", overflow: "hidden" },
@@ -4947,7 +4972,7 @@ const pd = function(t) {
                   children: Y.map((R, W) => {
                     const V = R.timeframe === k;
                     return /* @__PURE__ */ d(
-                      ge,
+                      fe,
                       {
                         definition: { display: "flex", direction: "column", align: "center", justify: "center" },
                         "data-slot-idx": W,
@@ -5450,7 +5475,7 @@ function Dd(r) {
     paginationMode: "server"
   } : { autoPageSize: !0 }, [l]), x = ee(() => Nd, []);
   return s ? /* @__PURE__ */ e(
-    ge,
+    fe,
     {
       className: "gloss-unified-breakdown-table gloss-unified-breakdown-table--error",
       style: {
@@ -5465,7 +5490,7 @@ function Dd(r) {
       children: "Failed to load data. Please try again."
     }
   ) : i && !n ? /* @__PURE__ */ e(
-    ge,
+    fe,
     {
       className: "gloss-unified-breakdown-table gloss-unified-breakdown-table--empty",
       style: {
@@ -5479,8 +5504,8 @@ function Dd(r) {
       },
       children: "No data available."
     }
-  ) : /* @__PURE__ */ d(ge, { className: "gloss-unified-breakdown-table", style: { width: "100%", height: "100%", display: "flex", flexDirection: "column" }, children: [
-    u && u.length > 0 && /* @__PURE__ */ e(ge, { style: { padding: "0 8px 8px", display: "flex", gap: "4px", flexWrap: "wrap" }, children: u.map((D) => /* @__PURE__ */ e(
+  ) : /* @__PURE__ */ d(fe, { className: "gloss-unified-breakdown-table", style: { width: "100%", height: "100%", display: "flex", flexDirection: "column" }, children: [
+    u && u.length > 0 && /* @__PURE__ */ e(fe, { style: { padding: "0 8px 8px", display: "flex", gap: "4px", flexWrap: "wrap" }, children: u.map((D) => /* @__PURE__ */ e(
       Cn,
       {
         id: D.id,
@@ -5492,7 +5517,7 @@ function Dd(r) {
       },
       D.id
     )) }),
-    /* @__PURE__ */ e(ge, { style: { flex: 1, minHeight: 0, width: "100%", overflow: "hidden" }, children: /* @__PURE__ */ e(
+    /* @__PURE__ */ e(fe, { style: { flex: 1, minHeight: 0, width: "100%", overflow: "hidden" }, children: /* @__PURE__ */ e(
       fo,
       {
         rows: w,
@@ -5535,7 +5560,7 @@ const Rn = Z.memo(({
   showDimensionGroup: b = !0,
   datePickerSlot: _
 }) => /* @__PURE__ */ d(Dt, { definition: { direction: "horizontal", align: "center" }, className: "gloss-chart-control-bar__row-1", children: [
-  /* @__PURE__ */ e(ge, { style: { marginRight: 10 }, children: /* @__PURE__ */ e(
+  /* @__PURE__ */ e(fe, { style: { marginRight: 10 }, children: /* @__PURE__ */ e(
     ur,
     {
       group: t,
@@ -5544,7 +5569,7 @@ const Rn = Z.memo(({
       groupRef: c
     }
   ) }),
-  /* @__PURE__ */ e(ge, { style: { marginRight: 6 }, children: /* @__PURE__ */ e(
+  /* @__PURE__ */ e(fe, { style: { marginRight: 6 }, children: /* @__PURE__ */ e(
     ur,
     {
       group: a,
@@ -5556,7 +5581,7 @@ const Rn = Z.memo(({
       connectorActive: f
     }
   ) }),
-  b && /* @__PURE__ */ e(ge, { children: /* @__PURE__ */ e(
+  b && /* @__PURE__ */ e(fe, { children: /* @__PURE__ */ e(
     ur,
     {
       group: n,
@@ -5568,7 +5593,7 @@ const Rn = Z.memo(({
       connectorActive: y
     }
   ) }),
-  _ && /* @__PURE__ */ e(ge, { className: "gloss-chart-control-bar__datepicker", children: _ })
+  _ && /* @__PURE__ */ e(fe, { className: "gloss-chart-control-bar__datepicker", children: _ })
 ] }));
 Rn.displayName = "Row1Controls";
 const La = () => /* @__PURE__ */ d(
@@ -6054,7 +6079,7 @@ const $d = Z.memo(({
     _.entity === "items" && w((me) => !me);
   }, [_.entity]), ie = N(() => {
     I((me) => !me);
-  }, []), fe = N((me) => {
+  }, []), ge = N((me) => {
     P(me), z(""), i(me, me);
   }, [i]), Ce = N(() => {
     P(null), i(null, null);
@@ -6108,7 +6133,7 @@ const $d = Z.memo(({
         }
       )
     ] }),
-    /* @__PURE__ */ e(ge, { className: "gloss-chart-control-bar__interactive", children: /* @__PURE__ */ e(
+    /* @__PURE__ */ e(fe, { className: "gloss-chart-control-bar__interactive", children: /* @__PURE__ */ e(
       Rn,
       {
         selections: _,
@@ -6139,7 +6164,7 @@ const $d = Z.memo(({
         entityFilterLayout: { left: K.entityFilter.left, width: K.entityFilter.width },
         itemSearch: C,
         setItemSearch: z,
-        onItemSubmit: fe,
+        onItemSubmit: ge,
         onItemSelect: Xe,
         onItemClear: Ce,
         itemFilterValue: g,
@@ -7047,15 +7072,15 @@ const Vd = ["S", "M", "T", "W", "T", "F", "S"], Ga = {
       );
     const X = /* @__PURE__ */ new Date();
     for (let U = 1; U <= S; U++) {
-      const K = new Date(E, w, U), q = A(K), te = M(K), he = O(K), oe = Y(K), be = j(K), de = z(K), ie = rr(K, X), fe = ["mini-calendar__day"];
-      be ? (fe.push("mini-calendar__day--disabled"), he ? fe.push("mini-calendar__day--disabled-end") : q && fe.push("mini-calendar__day--disabled-in-range"), de && fe.push("mini-calendar__day--market")) : (oe ? fe.push("mini-calendar__day--single") : te ? fe.push("mini-calendar__day--start") : he ? fe.push("mini-calendar__day--end") : q && fe.push("mini-calendar__day--in-range"), (oe || te || he || q) && (u === "secondary" ? fe.push("mini-calendar__day--secondary") : u === "tertiary" && fe.push("mini-calendar__day--tertiary")), ie && !te && !he && !oe && fe.push("mini-calendar__day--today"), de && fe.push("mini-calendar__day--market"));
+      const K = new Date(E, w, U), q = A(K), te = M(K), he = O(K), oe = Y(K), be = j(K), de = z(K), ie = rr(K, X), ge = ["mini-calendar__day"];
+      be ? (ge.push("mini-calendar__day--disabled"), he ? ge.push("mini-calendar__day--disabled-end") : q && ge.push("mini-calendar__day--disabled-in-range"), de && ge.push("mini-calendar__day--market")) : (oe ? ge.push("mini-calendar__day--single") : te ? ge.push("mini-calendar__day--start") : he ? ge.push("mini-calendar__day--end") : q && ge.push("mini-calendar__day--in-range"), (oe || te || he || q) && (u === "secondary" ? ge.push("mini-calendar__day--secondary") : u === "tertiary" && ge.push("mini-calendar__day--tertiary")), ie && !te && !he && !oe && ge.push("mini-calendar__day--today"), de && ge.push("mini-calendar__day--market"));
       const Ce = /* @__PURE__ */ e(
         ne,
         {
           component: "button",
           onClick: be ? void 0 : () => R(U),
           onMouseEnter: be ? void 0 : () => W(U),
-          className: fe.join(" "),
+          className: ge.join(" "),
           sx: {
             border: "none",
             fontFamily: "inherit"
@@ -7329,7 +7354,7 @@ const Yd = {
     ...u
   }), [u]), k = ce(null), [E, w] = H(null), [S, I] = H("calendar"), [g, P] = H(null), [x, D] = H(null), C = ce(null), [z, T] = H(() => h.lastPreset || "mtd"), [A, M] = H(null), [O, Y] = H(null), [j, R] = H(null), [W, V] = H(null), [G, F] = H(null), [X, U] = H(() => a ? _ ?? h.compareEnabled ?? !1 : !1), K = _ ?? X, q = N(($) => {
     U($), v?.($);
-  }, [v]), [te, he] = H("A"), [oe, be] = H(() => h.lastPresetB ?? null), [de, ie] = H(null), [fe, Ce] = H(null), [ke, Ne] = H(null), [Xe, we] = H(null), [me, _e] = H(null), [Ge, Ve] = H(null), [ae, xe] = H(null), [je, $e] = H(null), [De, Re] = H(null), [Pe, Ke] = H(null), [xt, Fe] = H(null), [Ee, it] = H(1), [Jt, tt] = H(!1), [lt, Et] = H(void 0), Be = j !== null ? j : z, Mt = j !== null ? W : A, mt = j !== null ? G : O, ct = ke !== null ? ke : oe, Pt = ke !== null ? Xe : de, Rt = ke !== null ? me : fe, dt = De !== null ? De : Ge, Bt = De !== null ? Pe : ae, At = De !== null ? xt : je, oa = j !== null && (j !== z || W !== A || G !== O), [pe, _r] = H(() => {
+  }, [v]), [te, he] = H("A"), [oe, be] = H(() => h.lastPresetB ?? null), [de, ie] = H(null), [ge, Ce] = H(null), [ke, Ne] = H(null), [Xe, we] = H(null), [me, _e] = H(null), [Ge, Ve] = H(null), [ae, xe] = H(null), [je, $e] = H(null), [De, Re] = H(null), [Pe, Ke] = H(null), [xt, Fe] = H(null), [Ee, it] = H(1), [Jt, tt] = H(!1), [lt, Et] = H(void 0), Be = j !== null ? j : z, Mt = j !== null ? W : A, mt = j !== null ? G : O, ct = ke !== null ? ke : oe, Pt = ke !== null ? Xe : de, Rt = ke !== null ? me : ge, dt = De !== null ? De : Ge, Bt = De !== null ? Pe : ae, At = De !== null ? xt : je, oa = j !== null && (j !== z || W !== A || G !== O), [pe, _r] = H(() => {
     const $ = m || ar, L = f || [], Q = new Set(L.map((ue) => ue.id)), re = $.filter((ue) => !Q.has(ue.id)).map((ue) => ({ ...ue, active: St(ue) })), le = L.map((ue) => ({
       ...ue,
       active: St(ue)
@@ -7417,8 +7442,8 @@ const Yd = {
   }, [z, A, O, pe]), Xn = ee(() => {
     if (!K || !oe) return null;
     let $, L;
-    if (oe === "custom" && de && fe)
-      $ = de, L = fe;
+    if (oe === "custom" && de && ge)
+      $ = de, L = ge;
     else {
       const re = pe.find((le) => le.id === oe);
       if (re)
@@ -7429,7 +7454,7 @@ const Yd = {
       }
     }
     return Ot($, L, /* @__PURE__ */ new Date(), pe).display;
-  }, [K, oe, de, fe, pe]), da = ee(() => {
+  }, [K, oe, de, ge, pe]), da = ee(() => {
     const $ = ["7d", "30d", "60d", "90d", "mtd", "qtd", "ytd", "lytd"], L = pe.find((Q) => Q.id === z);
     if (L)
       return ft(L.startDate, L.endDate, /* @__PURE__ */ new Date());
@@ -7488,8 +7513,8 @@ const Yd = {
     return Q.preset ? `${Q.preset.label} (${re})` : re;
   }, [K, Ee, dt, Bt, At, pe]);
   const qn = N(($) => {
-    R(z), V(A), F(O), K && (Ne(oe), we(de), _e(fe), Ee >= 3 && (Re(Ge), Ke(ae), Fe(je))), w($.currentTarget);
-  }, [z, A, O, K, Ee, oe, de, fe, Ge, ae, je]), ma = N(($, L, Q) => {
+    R(z), V(A), F(O), K && (Ne(oe), we(de), _e(ge), Ee >= 3 && (Re(Ge), Ke(ae), Fe(je))), w($.currentTarget);
+  }, [z, A, O, K, Ee, oe, de, ge, Ge, ae, je]), ma = N(($, L, Q) => {
     const re = [$, L];
     Q && (re.shortcutId = sr(Q)), t(re);
   }, [t]), er = N(($, L, Q) => {
@@ -8577,10 +8602,10 @@ const Ar = [
   onPinChange: u
 }) => {
   const [p, m] = H(null);
-  return /* @__PURE__ */ d(ge, { definition: { display: "flex", direction: "column", gap: "8px" }, children: [
+  return /* @__PURE__ */ d(fe, { definition: { display: "flex", direction: "column", gap: "8px" }, children: [
     r.map(({ label: f, getValue: y, id: b, disabled: _ }) => {
       const v = y(), h = !_ && (n ? n === b : a?.[0] && v?.[0] && Da(a[0], v[0]) && a?.[1] && v?.[1] && Da(a[1], v[1])), k = l === b, S = /* @__PURE__ */ d(
-        ge,
+        fe,
         {
           definition: { display: "flex", align: "center", gap: "4px" },
           style: { width: "100%" },
@@ -8588,7 +8613,7 @@ const Ar = [
           onMouseLeave: () => m(null),
           children: [
             /* @__PURE__ */ e(
-              ge,
+              fe,
               {
                 as: "button",
                 className: `gloss-timeframe__chip${h ? " gloss-timeframe__chip--active" : ""}${_ ? " gloss-timeframe__chip--disabled" : ""}`,
@@ -8618,7 +8643,7 @@ const Ar = [
       return _ ? /* @__PURE__ */ e(ht, { title: "Market configuration coming soon", arrow: !0, placement: "right", children: /* @__PURE__ */ e("div", { children: S }) }, f) : /* @__PURE__ */ e("div", { children: S }, f);
     }),
     i && /* @__PURE__ */ e(
-      ge,
+      fe,
       {
         as: "button",
         className: `gloss-timeframe__chip${o ? " gloss-timeframe__chip--active" : ""}`,
@@ -8632,7 +8657,7 @@ const Ar = [
   const { content: t, shortcuts: a, actionBar: n } = Zo(r), { slotProps: s, ...i } = r;
   return /* @__PURE__ */ e(Jo, { ...i, children: /* @__PURE__ */ d(Dt, { definition: { direction: "horizontal" }, children: [
     /* @__PURE__ */ e(
-      ge,
+      fe,
       {
         definition: { display: "flex", direction: "column" },
         style: {
@@ -8645,7 +8670,7 @@ const Ar = [
         children: a
       }
     ),
-    /* @__PURE__ */ d(ge, { definition: { display: "flex", direction: "column" }, children: [
+    /* @__PURE__ */ d(fe, { definition: { display: "flex", direction: "column" }, children: [
       /* @__PURE__ */ e(Qo, { className: ei.contentWrapper, ownerState: r, children: t }),
       n
     ] })
@@ -9065,7 +9090,7 @@ const eu = 30, tu = { distance: 5 }, ru = {
     gridAutoRows: `${n.rowHeight}px`,
     gap: `${n.gap}px`
   }), [n.columns, n.rowHeight, n.gap]), z = !!(_ && D && l.length > 0);
-  return /* @__PURE__ */ d(ge, { className: `gloss-grid${m ? " gloss-grid--armed" : ""}`, children: [
+  return /* @__PURE__ */ d(fe, { className: `gloss-grid${m ? " gloss-grid--armed" : ""}`, children: [
     /* @__PURE__ */ d(
       ni,
       {
@@ -9191,7 +9216,7 @@ const cu = Z.memo(function({
   );
   return /* @__PURE__ */ d(Dt, { definition: { direction: "vertical" }, className: "gloss-tabbed-data-view", style: { width: "100%", height: "100%" }, children: [
     /* @__PURE__ */ d(
-      ge,
+      fe,
       {
         className: "gloss-tabbed-data-view__header",
         style: {
@@ -9284,12 +9309,12 @@ const cu = Z.memo(function({
               }
             )
           ] }),
-          c && /* @__PURE__ */ e(ge, { style: { display: "flex", alignItems: "center", gap: "8px", flexShrink: 0 }, children: c })
+          c && /* @__PURE__ */ e(fe, { style: { display: "flex", alignItems: "center", gap: "8px", flexShrink: 0 }, children: c })
         ]
       }
     ),
     /* @__PURE__ */ e(
-      ge,
+      fe,
       {
         className: "gloss-tabbed-data-view__content",
         style: { flexGrow: 1, minHeight: 0, overflow: "hidden", position: "relative", width: "100%" },
@@ -10036,9 +10061,9 @@ const Cu = Z.forwardRef(
             return;
           }
           if (c) {
-            const fe = c(ie);
-            if (fe !== !0) {
-              C(typeof fe == "string" ? fe : "Invalid tag");
+            const ge = c(ie);
+            if (ge !== !0) {
+              C(typeof ge == "string" ? ge : "Invalid tag");
               return;
             }
           }
@@ -10048,14 +10073,14 @@ const Cu = Z.forwardRef(
       [Y, W, s, o, i, c, V]
     ), F = N(
       (de) => {
-        const ie = Y.filter((fe, Ce) => Ce !== de);
+        const ie = Y.filter((ge, Ce) => Ce !== de);
         V(ie), C(null);
       },
       [Y, V]
     ), X = N(
       (de) => {
-        const ie = de.target.value, fe = n.filter((Ce) => Ce !== "Enter");
-        for (const Ce of fe)
+        const ie = de.target.value, ge = n.filter((Ce) => Ce !== "Enter");
+        for (const Ce of ge)
           if (ie.includes(Ce)) {
             ie.split(Ce).forEach((Ne) => {
               Ne.trim() && G(Ne);
@@ -10118,8 +10143,8 @@ const Cu = Z.forwardRef(
               {
                 type: "button",
                 className: "gloss-tag-input__tag-remove",
-                onClick: (fe) => {
-                  fe.stopPropagation(), F(ie);
+                onClick: (ge) => {
+                  ge.stopPropagation(), F(ie);
                 },
                 "aria-label": `Remove ${de}`,
                 tabIndex: -1,
@@ -11307,7 +11332,7 @@ function ju({
         portal: !0
       },
       children: /* @__PURE__ */ e("div", { className: "gloss-merge-prompt", style: { pointerEvents: "none" }, children: /* @__PURE__ */ d(
-        ge,
+        fe,
         {
           className: "gloss-merge-prompt__content",
           style: { pointerEvents: "auto" },
@@ -11323,7 +11348,7 @@ function ju({
               "?"
             ] }),
             /* @__PURE__ */ d(
-              ge,
+              fe,
               {
                 className: "gloss-merge-prompt__summary-row",
                 definition: {
@@ -11339,7 +11364,7 @@ function ju({
               }
             ),
             /* @__PURE__ */ d(
-              ge,
+              fe,
               {
                 className: "gloss-merge-prompt__summary-row",
                 definition: {
@@ -11355,7 +11380,7 @@ function ju({
               }
             ),
             /* @__PURE__ */ d(
-              ge,
+              fe,
               {
                 className: "gloss-merge-prompt__actions",
                 definition: {

package/catalog.js

@@ -1,5 +1,5 @@
-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 W, V as H, b1 as _, W as k, b2 as L, b3 as z, b4 as E, X as G, Y as $, Z as O } from "./Expandable-D00kXkfM.js";
-import { a5 as Ne, b8 as Be, aB as xe, aj as De, $ as Fe, ap as Ae, bV as Me, N as ve, aa as Re, bo as We, P as He, B as _e, bj as ke, C as Le, by as ze, b as Ee, c as Ge, O as $e, q as Oe, af as Ve, aP as we, aE as Xe, as as je, m as Ue, o as Ze, aH as qe, ad as Je, ba as Ke, ab as Qe, bp as Ye, _ as ea, ar as aa, aS as sa, bc as ta, p as ra, ao as oa, a2 as ia, at as na, a4 as la, ac as da, bK as ca, aV as ga, t as ma, I as pa, i as ua, ay as ba, M as fa, y as ha, au as ya, bi as Ta, bQ as Sa, aq as Pa, w as Ca, bq as Ia, aU as Na, b5 as Ba, al as xa, aM as Da, ai as Fa, an as Aa, aw as Ma, bX as va, aT as Ra, bW as Wa, ae as Ha, e as _a, R as ka, l as La, r as za, aJ as Ea, ak as Ga, ag as $a, j as Oa, z as Va, b9 as wa, ah as Xa, be as ja, bh as Ua, bf as Za, bg as qa, k as Ja, bb as Ka, bn as Qa, S as Ya, bl as es, ax as as, bd as ss, bR as ts, am as rs, bU as os, v as is, bL as ns, n as ls, h as ds, s as cs, a0 as gs, a9 as ms, bk as ps, bx as us, bE as bs, aD as fs, a8 as hs, aR as ys, aG as Ts, aA as Ss, aO as Ps, aL as Cs, a3 as Is } from "./Expandable-D00kXkfM.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 W, V as H, b1 as _, W as k, b2 as L, b3 as z, b4 as E, X as G, Y as $, Z as O } from "./Expandable-BcmIxWR8.js";
+import { a5 as Ne, b8 as Be, aB as xe, aj as De, $ as Fe, ap as Ae, bV as Me, N as ve, aa as Re, bo as We, P as He, B as _e, bj as ke, C as Le, by as ze, b as Ee, c as Ge, O as $e, q as Oe, af as Ve, aP as we, aE as Xe, as as je, m as Ue, o as Ze, aH as qe, ad as Je, ba as Ke, ab as Qe, bp as Ye, _ as ea, ar as aa, aS as sa, bc as ta, p as ra, ao as oa, a2 as ia, at as na, a4 as la, ac as da, bK as ca, aV as ga, t as ma, I as pa, i as ua, ay as ba, M as fa, y as ha, au as ya, bi as Ta, bQ as Sa, aq as Pa, w as Ca, bq as Ia, aU as Na, b5 as Ba, al as xa, aM as Da, ai as Fa, an as Aa, aw as Ma, bX as va, aT as Ra, bW as Wa, ae as Ha, e as _a, R as ka, l as La, r as za, aJ as Ea, ak as Ga, ag as $a, j as Oa, z as Va, b9 as wa, ah as Xa, be as ja, bh as Ua, bf as Za, bg as qa, k as Ja, bb as Ka, bn as Qa, S as Ya, bl as es, ax as as, bd as ss, bR as ts, am as rs, bU as os, v as is, bL as ns, n as ls, h as ds, s as cs, a0 as gs, a9 as ms, bk as ps, bx as us, bE as bs, aD as fs, a8 as hs, aR as ys, aG as Ts, aA as Ss, aO as Ps, aL as Cs, a3 as Is } from "./Expandable-BcmIxWR8.js";
 import { jsx as c, jsxs as S } from "react/jsx-runtime";
 import { C as e, T as a, ae as V, S as s, E as u, R as m, f as w, Z as X } from "./UIContext-DP6JGCto.js";
 import { B as j, a as U, e as Z, c as q, d as J, b as K } from "./BaseAsyncButton-Cq_l7clO.js";

package/composites-panels.js

@@ -1,73 +1,76 @@
-import { a as i, u, c as p } from "./COMMITS-6U31xb_s.js";
-import { C as I, b as N, P as k, e as O, i as w, r as A, d as H } from "./COMMITS-6U31xb_s.js";
-import { jsxs as c, jsx as r, Fragment as f } from "react/jsx-runtime";
-import { useEffect as l, useRef as m, useLayoutEffect as g, useCallback as P } from "react";
-function S({ isOpen: n }) {
-  const t = i()?.state.activeTrigger, o = t?.kind === "card-overflow" ? t.cardId : null;
-  return n ? /* @__PURE__ */ c("div", { "data-shell": "settings", children: [
-    /* @__PURE__ */ r("p", { style: { margin: 0, fontSize: 14, color: "#495057" }, children: o ? `Settings for card: ${o}` : "Settings" }),
-    /* @__PURE__ */ r("p", { style: { margin: "8px 0 0", fontSize: 12, color: "#adb5bd" }, children: "Configuration options coming soon." })
-  ] }) : null;
+import { a as i, u, c as p } from "./COMMITS-CoGFzpf4.js";
+import { C as I, b as H, P as N, e as k, i as O, r as w, d as A } from "./COMMITS-CoGFzpf4.js";
+import { jsxs as c, jsx as s, Fragment as f } from "react/jsx-runtime";
+import { useEffect as r, useRef as m, useLayoutEffect as h, useCallback as P } from "react";
+function E({ isOpen: t }) {
+  const n = i()?.state.activeTrigger, o = n?.kind === "card-overflow" ? n.cardId : null;
+  return /* @__PURE__ */ c("div", { "data-shell": "settings", "aria-hidden": !t, children: [
+    /* @__PURE__ */ s("p", { style: { margin: 0, fontSize: 14, color: "#495057" }, children: o ? `Settings for card: ${o}` : "Settings" }),
+    /* @__PURE__ */ s("p", { style: { margin: "8px 0 0", fontSize: 12, color: "#adb5bd" }, children: "Configuration options coming soon." })
+  ] });
 }
-const v = {
+const g = {
   position: "fixed",
   inset: 0,
   pointerEvents: "none",
   zIndex: 55
-}, y = {
+}, v = {
   position: "absolute",
   inset: 0,
   zIndex: 1,
-  pointerEvents: "auto",
+  // CR-03 fix: pass-through tint — scrim is visual-only and must not intercept
+  // grid card clicks. See PanelHost.tsx CR-03 comment for full rationale.
+  pointerEvents: "none",
   background: "rgba(0, 0, 0, 0.04)"
 };
 function _() {
-  const { state: n, dispatch: e, getCloseLog: t } = u();
-  l(() => {
-    if (n.activePanelId == null) return;
-    function s(d) {
+  const { state: t, dispatch: e, getCloseLog: n } = u();
+  r(() => {
+    if (t.activePanelId == null) return;
+    function a(d) {
       d.key === "Escape" && e({ type: "CLOSE_PANEL", reason: "escape-key" });
     }
-    return document.addEventListener("keydown", s), () => document.removeEventListener("keydown", s);
-  }, [n.activePanelId, e]);
-  const o = m(n);
-  g(() => {
-    o.current = n;
-  }), l(() => {
-    if (process.env.NODE_ENV !== "production")
-      return window.__panelsHostHandle = {
-        dispatch: e,
-        getState: () => o.current,
-        getCloseLog: t
-      }, () => {
-        delete window.__panelsHostHandle;
-      };
-  }, [e, t]);
-  const a = P(() => {
+    return document.addEventListener("keydown", a), () => document.removeEventListener("keydown", a);
+  }, [t.activePanelId, e]);
+  const o = m(t);
+  h(() => {
+    o.current = t;
+  }), r(() => {
+    if (process.env.NODE_ENV === "production") return;
+    const a = window;
+    return a.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), a.__panelsHostHandle = {
+      dispatch: e,
+      getState: () => o.current,
+      getCloseLog: n
+    }, () => {
+      a.__panelsHostHandle?.dispatch === e && delete window.__panelsHostHandle;
+    };
+  }, [e, n]);
+  const l = P(() => {
     e({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
   }, [e]);
-  return /* @__PURE__ */ r("div", { "data-panel-host": "true", style: v, children: n.activePanelId != null && /* @__PURE__ */ r(
+  return /* @__PURE__ */ s("div", { "data-panel-host": "true", style: g, children: t.activePanelId != null && /* @__PURE__ */ s(
     "div",
     {
       "data-panel-scrim": "true",
-      style: y,
-      onClick: a
+      style: v,
+      onClick: l
     }
   ) });
 }
-function b({ panelComponents: n }) {
+function b({ panelComponents: t }) {
   const e = i();
   if (e == null) return null;
-  const { state: t, dispatch: o } = e;
-  if (t.activePanelId == null) return null;
-  const a = n[t.activePanelId];
-  if (a == null)
+  const { state: n, dispatch: o } = e;
+  if (n.activePanelId == null) return null;
+  const l = t[n.activePanelId];
+  if (l == null)
     return process.env.NODE_ENV !== "production" && console.error(
       "[panels] No panel component registered for activePanelId:",
-      t.activePanelId
+      n.activePanelId
     ), null;
-  const s = t.activePanelId === "settings" ? /* @__PURE__ */ c(f, { children: [
-    /* @__PURE__ */ r(
+  const a = n.activePanelId === "settings" ? /* @__PURE__ */ c(f, { children: [
+    /* @__PURE__ */ s(
       "button",
       {
         id: "settings-cancel",
@@ -77,7 +80,7 @@ function b({ panelComponents: n }) {
         children: "Cancel"
       }
     ),
-    /* @__PURE__ */ r(
+    /* @__PURE__ */ s(
       "button",
       {
         id: "settings-apply",
@@ -88,28 +91,28 @@ function b({ panelComponents: n }) {
       }
     )
   ] }) : null;
-  return /* @__PURE__ */ r(
+  return /* @__PURE__ */ s(
     p,
     {
       isOpen: !0,
       onClose: () => o({ type: "CLOSE_PANEL", reason: "header-x" }),
-      footer: s,
-      children: /* @__PURE__ */ r(a, { isOpen: !0 })
+      footer: a,
+      children: /* @__PURE__ */ s(l, { isOpen: !0 })
     }
   );
 }
 export {
   I as COMMITS,
   p as PanelChrome,
-  N as PanelHost,
+  H as PanelHost,
   _ as PanelHostShell,
-  k as PanelProvider,
+  N as PanelProvider,
   b as PanelSlot,
-  S as SettingsShell,
-  O as deriveSurfaceState,
-  w as initialState,
-  A as reducer,
+  E as SettingsShell,
+  k as deriveSurfaceState,
+  O as initialState,
+  w as reducer,
   u as usePanelContext,
   i as usePanelContextOptional,
-  H as usePanelCoordinator
+  A as usePanelCoordinator
 };

package/index.js

@@ -1,12 +1,12 @@
-import { u as Ze, C as qe } from "./Expandable-D00kXkfM.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-D00kXkfM.js";
+import { u as Ze, C as qe } from "./Expandable-BcmIxWR8.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-BcmIxWR8.js";
 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 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";
-import { C as Uo, c as Yo, b as Zo, P as qo, e as Qo, i as Xo, r as Jo, u as el, a as tl, d as al } from "./COMMITS-6U31xb_s.js";
+import { C as Uo, c as Yo, b as Zo, P as qo, e as Qo, i as Xo, r as Jo, u as el, a as tl, d as al } from "./COMMITS-CoGFzpf4.js";
 import { createPortal as st } from "react-dom";
 import { DEFAULT_MARKET_PRESETS as rl, DEFAULT_PINNED as sl, PERIOD_OPTIONS as il, ROLLING_OPTIONS as ol, TODAY_PRESET as ll, findPreset as cl, formatDateRange as dl, formatMarketDates as ul, formatTrend as ml, formatValue as gl, generateMarketId as pl, getAllPresets as hl, getDateRangeForPreset as fl, getPresetLabel as bl, isInRange as vl, isMarketActive as yl, isSameDay as wl, normalizePresetId as _l, toUppercasePresetId as Cl } from "@mt-gloss/utils";
 import it from "@mui/icons-material/AccessTime";

package/lib/composites/panels/shells/SettingsShell.d.ts

@@ -1,2 +1,2 @@
 import { PanelShellProps } from '../PanelHost';
-export declare function SettingsShell({ isOpen }: PanelShellProps): import("react/jsx-runtime").JSX.Element | null;
+export declare function SettingsShell({ isOpen }: PanelShellProps): import("react/jsx-runtime").JSX.Element;

package/package.json

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