@mt-gloss/ui 0.1.86 → 0.1.88

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
 };