@mt-gloss/ui 0.1.88 → 0.1.90

package/{COMMITS-CoGFzpf4.js → COMMITS-qn5rIipN.js}

@@ -1,7 +1,7 @@
-import { jsx as i, jsxs as f, Fragment as v } from "react/jsx-runtime";
-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() {
+import { jsx as i, jsxs as f, Fragment as I } from "react/jsx-runtime";
+import { createContext as h, useContext as p, useReducer as m, useRef as u, useEffect as a, useMemo as E, useCallback as g, useSyncExternalStore as S, useLayoutEffect as _ } from "react";
+const d = h(null);
+function P() {
   const e = p(d);
   if (!e)
     throw new Error(
@@ -9,10 +9,10 @@ function S() {
     );
   return e;
 }
-function F() {
+function V() {
   return p(d);
 }
-const m = {
+const y = {
   activePanelId: null,
   activeTrigger: null,
   bellCutoutOpen: !1,
@@ -20,8 +20,8 @@ const m = {
   lockHint: null,
   lastClose: null,
   pendingSideEffects: []
-}, y = /* @__PURE__ */ new Set(["settings"]);
-function O(e, n) {
+}, O = /* @__PURE__ */ new Set(["settings"]);
+function L(e, n) {
   if (e == null || e.kind !== n.kind) return !1;
   switch (e.kind) {
     case "bell":
@@ -34,7 +34,7 @@ function O(e, n) {
       return e.global === n.global && e.align === n.align;
   }
 }
-function L(e, n) {
+function T(e, n) {
   switch (n.type) {
     case "OPEN_PANEL": {
       if (e.activePanelId && e.isDirty)
@@ -52,7 +52,7 @@ function L(e, n) {
             }
           ]
         };
-      if (e.activePanelId === n.panelId && O(e.activeTrigger, n.trigger))
+      if (e.activePanelId === n.panelId && L(e.activeTrigger, n.trigger))
         return e;
       const t = e.activePanelId != null ? [
         {
@@ -101,7 +101,7 @@ function L(e, n) {
     case "CLOSE_BELL_CUTOUT":
       return e.bellCutoutOpen ? { ...e, bellCutoutOpen: !1 } : e;
     case "BUFFER_BECOMES_DIRTY":
-      return e.activePanelId == null || !y.has(e.activePanelId) ? {
+      return e.activePanelId == null || !O.has(e.activePanelId) ? {
         ...e,
         pendingSideEffects: [
           ...e.pendingSideEffects,
@@ -134,14 +134,14 @@ function L(e, n) {
       return e;
   }
 }
-function T(e) {
+function D(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 D() {
-  const [e, n] = h(L, m), t = u([]), l = u(null);
-  s(() => () => {
+function N() {
+  const [e, n] = m(T, y), t = u([]), l = u(null);
+  a(() => () => {
     l.current != null && (window.clearTimeout(l.current), l.current = null);
-  }, []), s(() => {
+  }, []), a(() => {
     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(() => {
@@ -157,7 +157,7 @@ function D() {
         ] : r.type === "INVALID_DISPATCH" && process.env.NODE_ENV !== "production" && console.warn("[panels] INVALID_DISPATCH:", r.reason);
       n({ type: "DRAIN_SIDE_EFFECTS" });
     }
-  }, [e.pendingSideEffects, n]), s(() => {
+  }, [e.pendingSideEffects, n]), a(() => {
     if (!e.lastClose) return;
     const r = {
       panelId: e.lastClose.panelId,
@@ -170,15 +170,14 @@ function D() {
       r
     ];
   }, [e.lastClose]);
-  const o = E(
-    () => T(e),
-    // eslint-disable-next-line react-hooks/exhaustive-deps
+  const c = E(
+    () => D(e),
     [e.activePanelId, e.bellCutoutOpen, e.isDirty]
-  ), a = g(() => t.current.slice(), []);
-  return { state: e, surfaceState: o, dispatch: n, getCloseLog: a };
+  ), s = g(() => t.current.slice(), []);
+  return { state: e, surfaceState: c, dispatch: n, getCloseLog: s };
 }
-function k({ children: e }) {
-  const n = D(), t = E(
+function j({ children: e }) {
+  const n = N(), t = E(
     () => n,
     // Re-publish only when one of the four coordinator fields changes identity.
     // dispatch + getCloseLog are stable. state + surfaceState change on dispatch.
@@ -186,24 +185,19 @@ function k({ children: e }) {
   );
   return /* @__PURE__ */ i(d.Provider, { value: t, children: e });
 }
-const N = {
+const w = {
   position: "relative",
   pointerEvents: "auto"
 };
-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(
+function x({ children: e, onClose: n, footer: t }) {
+  return /* @__PURE__ */ f(
     "div",
     {
       "data-chrome": "panel",
-      "data-open": o ? "true" : "false",
       role: "dialog",
       "aria-modal": "true",
       className: "gloss-panel-chrome",
-      style: N,
+      style: w,
       children: [
         /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__header", children: /* @__PURE__ */ i(
           "button",
@@ -217,23 +211,60 @@ function x({ children: e, onClose: n, isOpen: t = !0, footer: l }) {
           }
         ) }),
         /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__body", children: e }),
-        l != null && /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__footer", children: l })
+        t != null && /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__footer", children: t })
       ]
     }
   );
 }
-const H = {
+const H = "(prefers-reduced-motion: reduce)";
+function v() {
+  return typeof window > "u" || typeof window.matchMedia != "function" ? null : window.matchMedia(H);
+}
+function b(e) {
+  const n = v();
+  return n ? (n.addEventListener("change", e), () => {
+    n.removeEventListener("change", e);
+  }) : () => {
+  };
+}
+function A() {
+  const e = v();
+  return e ? e.matches : !1;
+}
+function F() {
+  return !1;
+}
+function R() {
+  return S(b, A, F);
+}
+function k({ isOpen: e, children: n }) {
+  const t = R(), l = [
+    "gloss-panel-mount",
+    e ? "has-panel" : "",
+    t ? "reduced-motion" : ""
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ i(
+    "div",
+    {
+      className: l,
+      "data-mount": "panel",
+      "data-open": e ? "true" : "false",
+      children: n
+    }
+  );
+}
+const M = {
   position: "fixed",
   top: 0,
   left: 0,
   right: 0,
   height: "var(--tb-h, 60px)",
-  perspective: "1200px",
+  perspective: "var(--panel-perspective, 1500px)",
   perspectiveOrigin: "center bottom",
   overflow: "visible",
   pointerEvents: "none",
   zIndex: 55
-}, b = {
+}, U = {
   position: "fixed",
   top: "var(--tb-h, 60px)",
   left: 0,
@@ -249,57 +280,57 @@ const H = {
   pointerEvents: "none",
   background: "rgba(0, 0, 0, 0.04)"
 };
-function R({ panelComponents: e }) {
-  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(
+function q({ panelComponents: e }) {
+  const { state: n, dispatch: t, getCloseLog: l } = P(), c = n.activePanelId ? e[n.activePanelId] : null;
+  n.activePanelId && !c && process.env.NODE_ENV !== "production" && console.error(
     "[panels] No panel component registered for activePanelId:",
     n.activePanelId
-  ), s(() => {
+  ), a(() => {
     if (n.activePanelId == null) return;
-    function c(I) {
-      I.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
+    function o(C) {
+      C.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
     }
-    return document.addEventListener("keydown", c), () => {
-      document.removeEventListener("keydown", c);
+    return document.addEventListener("keydown", o), () => {
+      document.removeEventListener("keydown", o);
     };
   }, [n.activePanelId, t]);
-  const a = u(n);
-  C(() => {
-    a.current = n;
-  }), s(() => {
+  const s = u(n);
+  _(() => {
+    s.current = n;
+  }), a(() => {
     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 = {
+    const o = window;
+    return o.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), o.__panelsHostHandle = {
       dispatch: t,
-      getState: () => a.current,
+      getState: () => s.current,
       getCloseLog: l
     }, () => {
-      c.__panelsHostHandle?.dispatch === t && delete c.__panelsHostHandle;
+      o.__panelsHostHandle?.dispatch === t && delete o.__panelsHostHandle;
     };
   }, [t, l]);
   const r = g(() => {
     t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
   }, [t]);
-  return /* @__PURE__ */ i("div", { "data-panel-host": "true", style: H, children: n.activePanelId != null && o != null && /* @__PURE__ */ f(v, { children: [
+  return /* @__PURE__ */ i("div", { "data-panel-host": "true", style: M, children: n.activePanelId != null && c != null && /* @__PURE__ */ f(I, { children: [
     /* @__PURE__ */ i(
       "div",
       {
         "data-panel-scrim": "true",
-        style: b,
+        style: U,
         onClick: r
       }
     ),
-    /* @__PURE__ */ i(
+    /* @__PURE__ */ i(k, { isOpen: !0, children: /* @__PURE__ */ i(
       x,
       {
         isOpen: !0,
         onClose: () => t({ type: "CLOSE_PANEL", reason: "header-x" }),
-        children: /* @__PURE__ */ i(o, { isOpen: !0 })
+        children: /* @__PURE__ */ i(c, { isOpen: !0 })
       }
-    )
+    ) })
   ] }) });
 }
-const U = {
+const z = {
   "apply-button": !0,
   // the ONLY commit reason
   "cancel-button": !1,
@@ -313,14 +344,16 @@ const U = {
   "nav-escape-hatch": !1
 };
 export {
-  U as C,
-  k as P,
-  F as a,
-  R as b,
+  z as C,
+  j as P,
+  V as a,
+  q as b,
   x as c,
-  D as d,
-  T as e,
-  m as i,
-  L as r,
-  S as u
+  N as d,
+  D as e,
+  k as f,
+  R as g,
+  y as i,
+  T as r,
+  P as u
 };