@mt-gloss/ui 0.1.118 → 0.1.119

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
- import { jsx as d, jsxs as k } from "react/jsx-runtime";
2
- import { motion as ie } from "framer-motion";
3
- import M, { useSyncExternalStore as se, useState as H, useRef as N, useMemo as V, useEffect as T, useCallback as O, createContext as le, useContext as W, useReducer as ae, useLayoutEffect as X } from "react";
4
- import { z as w } from "zod";
1
+ import { jsx as s, jsxs as N } from "react/jsx-runtime";
2
+ import { motion as se } from "framer-motion";
3
+ import M, { useSyncExternalStore as ie, useState as H, useRef as L, useMemo as V, useEffect as w, useCallback as O, createContext as le, useContext as W, useReducer as ae, useLayoutEffect as X } from "react";
4
+ import { z as T } from "zod";
5
5
  const ce = "(prefers-reduced-motion: reduce)";
6
6
  function G() {
7
7
  return typeof window > "u" || typeof window.matchMedia != "function" ? null : window.matchMedia(ce);
@@ -21,7 +21,7 @@ function fe() {
21
21
  return !1;
22
22
  }
23
23
  function J() {
24
- return se(de, ue, fe);
24
+ return ie(de, ue, fe);
25
25
  }
26
26
  const pe = {
27
27
  threshold: "Threshold",
@@ -35,37 +35,37 @@ function me({
35
35
  onSelect: t,
36
36
  reduced: r,
37
37
  labels: o,
38
- ariaLabel: l = "Settings dimensions"
38
+ ariaLabel: a = "Settings dimensions"
39
39
  }) {
40
- const c = J(), s = r ?? c;
40
+ const c = J(), l = r ?? c;
41
41
  if (e.length < 2) return null;
42
- const p = (a) => o?.[a] ?? pe[a], u = (a, m) => {
43
- a.key === "ArrowRight" ? (a.preventDefault(), t(e[(m + 1) % e.length])) : a.key === "ArrowLeft" ? (a.preventDefault(), t(e[(m - 1 + e.length) % e.length])) : a.key === "Home" ? (a.preventDefault(), t(e[0])) : a.key === "End" && (a.preventDefault(), t(e[e.length - 1]));
42
+ const p = (d) => o?.[d] ?? pe[d], u = (d, m) => {
43
+ d.key === "ArrowRight" ? (d.preventDefault(), t(e[(m + 1) % e.length])) : d.key === "ArrowLeft" ? (d.preventDefault(), t(e[(m - 1 + e.length) % e.length])) : d.key === "Home" ? (d.preventDefault(), t(e[0])) : d.key === "End" && (d.preventDefault(), t(e[e.length - 1]));
44
44
  };
45
- return /* @__PURE__ */ d(
45
+ return /* @__PURE__ */ s(
46
46
  "div",
47
47
  {
48
48
  role: "tablist",
49
- "aria-label": l,
49
+ "aria-label": a,
50
50
  className: "settings-tab-strip",
51
- children: e.map((a, m) => {
52
- const _ = n === a;
53
- return /* @__PURE__ */ k(
51
+ children: e.map((d, m) => {
52
+ const _ = n === d;
53
+ return /* @__PURE__ */ N(
54
54
  "button",
55
55
  {
56
56
  role: "tab",
57
57
  type: "button",
58
- id: `settings-tab-${a}`,
58
+ id: `settings-tab-${d}`,
59
59
  "aria-selected": _,
60
- "aria-controls": `settings-tabpanel-${a}`,
60
+ "aria-controls": `settings-tabpanel-${d}`,
61
61
  tabIndex: _ ? 0 : -1,
62
62
  className: `settings-tab-strip__tab${_ ? " settings-tab-strip__tab--active" : ""}`,
63
- onClick: () => t(a),
64
- onKeyDown: (L) => u(L, m),
63
+ onClick: () => t(d),
64
+ onKeyDown: (R) => u(R, m),
65
65
  children: [
66
- /* @__PURE__ */ d("span", { className: "settings-tab-strip__label", children: p(a) }),
67
- _ && !s && /* @__PURE__ */ d(
68
- ie.span,
66
+ /* @__PURE__ */ s("span", { className: "settings-tab-strip__label", children: p(d) }),
67
+ _ && !l && /* @__PURE__ */ s(
68
+ se.span,
69
69
  {
70
70
  layoutId: "settings-active-tab-indicator",
71
71
  "data-layout-id": "settings-active-tab-indicator",
@@ -76,7 +76,7 @@ function me({
76
76
  )
77
77
  ]
78
78
  },
79
- a
79
+ d
80
80
  );
81
81
  })
82
82
  }
@@ -105,14 +105,14 @@ function ve(e) {
105
105
  () => e.zones.map((i) => i.maxItems !== void 0 && i.items.length > i.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
106
106
  `useSortableZones: zone "${i.zoneKey}" exceeds maxItems (${i.items.length} > ${i.maxItems}); trimming to cap.`
107
107
  ), { ...i, items: i.items.slice(0, i.maxItems) }) : i)
108
- ), [r, o] = H(null), [l, c] = H(null), s = N(null), p = N(e.onZoneChange);
108
+ ), [r, o] = H(null), [a, c] = H(null), l = L(null), p = L(e.onZoneChange);
109
109
  p.current = e.onZoneChange;
110
110
  const u = V(
111
111
  () => he(e.zones),
112
112
  [e.zones]
113
- ), a = N(u);
114
- T(() => {
115
- a.current !== u && (a.current = u, !r && t(
113
+ ), d = L(u);
114
+ w(() => {
115
+ d.current !== u && (d.current = u, !r && t(
116
116
  e.zones.map((i) => i.maxItems !== void 0 && i.items.length > i.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
117
117
  `useSortableZones: zone "${i.zoneKey}" exceeds maxItems (${i.items.length} > ${i.maxItems}); trimming to cap.`
118
118
  ), { ...i, items: i.items.slice(0, i.maxItems) }) : i)
@@ -121,68 +121,68 @@ function ve(e) {
121
121
  const m = O(
122
122
  (i) => {
123
123
  const g = i.active.id;
124
- let C = null, E = null;
124
+ let S = null, y = null;
125
125
  for (const b of n) {
126
126
  const P = b.items.find((f) => f.id === g);
127
127
  if (P) {
128
- C = P, E = b.zoneKey;
128
+ S = P, y = b.zoneKey;
129
129
  break;
130
130
  }
131
131
  }
132
- s.current = E, o(C), c(E);
132
+ l.current = y, o(S), c(y);
133
133
  },
134
134
  [n]
135
135
  ), _ = O(
136
136
  (i) => {
137
137
  if (!i.over) {
138
- c(s.current);
138
+ c(l.current);
139
139
  return;
140
140
  }
141
141
  const g = Q(n, i.over.id);
142
142
  c(g);
143
143
  },
144
144
  [n]
145
- ), L = O(
145
+ ), R = O(
146
146
  (i) => {
147
- const { active: g, over: C } = i, E = () => {
148
- s.current = null, o(null), c(null);
147
+ const { active: g, over: S } = i, y = () => {
148
+ l.current = null, o(null), c(null);
149
149
  };
150
- if (!C) {
151
- E();
150
+ if (!S) {
151
+ y();
152
152
  return;
153
153
  }
154
- const b = U(n, g.id), P = Q(n, C.id);
154
+ const b = U(n, g.id), P = Q(n, S.id);
155
155
  if (!b || !P) {
156
- E();
156
+ y();
157
157
  return;
158
158
  }
159
- let f = n.map((I) => ({ ...I, items: [...I.items] }));
159
+ let f = n.map((E) => ({ ...E, items: [...E.items] }));
160
160
  if (b === P) {
161
- const I = f.findIndex((D) => D.zoneKey === b), y = f[I], h = y.items.findIndex((D) => D.id === g.id), S = y.items.findIndex((D) => D.id === C.id), A = S >= 0 ? S : Math.max(0, y.items.length - 1);
162
- f[I] = {
163
- ...y,
164
- items: ge(y.items, h, A)
161
+ const E = f.findIndex((D) => D.zoneKey === b), I = f[E], h = I.items.findIndex((D) => D.id === g.id), C = I.items.findIndex((D) => D.id === S.id), A = C >= 0 ? C : Math.max(0, I.items.length - 1);
162
+ f[E] = {
163
+ ...I,
164
+ items: ge(I.items, h, A)
165
165
  };
166
166
  } else {
167
- const I = f.findIndex((v) => v.zoneKey === b), y = f.findIndex((v) => v.zoneKey === P), h = f[I], S = f[y], A = h.items.find((v) => v.id === g.id);
167
+ const E = f.findIndex((v) => v.zoneKey === b), I = f.findIndex((v) => v.zoneKey === P), h = f[E], C = f[I], A = h.items.find((v) => v.id === g.id);
168
168
  if (!A) {
169
- E();
169
+ y();
170
170
  return;
171
171
  }
172
- const D = h.items.filter((v) => v.id !== g.id), z = S.items.findIndex((v) => v.id === C.id), re = z >= 0 ? z : S.items.length;
173
- let j = D, x = [...S.items];
174
- if (S.maxItems !== void 0 && x.length >= S.maxItems) {
172
+ const D = h.items.filter((v) => v.id !== g.id), z = C.items.findIndex((v) => v.id === S.id), re = z >= 0 ? z : C.items.length;
173
+ let j = D, x = [...C.items];
174
+ if (C.maxItems !== void 0 && x.length >= C.maxItems) {
175
175
  const v = x[x.length - 1];
176
- x = x.slice(0, S.maxItems - 1), j = [...D, v];
176
+ x = x.slice(0, C.maxItems - 1), j = [...D, v];
177
177
  }
178
178
  const q = Math.min(re, x.length), oe = [
179
179
  ...x.slice(0, q),
180
180
  A,
181
181
  ...x.slice(q)
182
182
  ];
183
- f[I] = { ...h, items: j }, f[y] = { ...S, items: oe };
183
+ f[E] = { ...h, items: j }, f[I] = { ...C, items: oe };
184
184
  }
185
- t(f), p.current?.(f), E();
185
+ t(f), p.current?.(f), y();
186
186
  },
187
187
  [n]
188
188
  ), B = O(
@@ -204,17 +204,17 @@ function ve(e) {
204
204
  );
205
205
  return {
206
206
  zones: n,
207
- activeZone: l,
207
+ activeZone: a,
208
208
  activeItem: r,
209
209
  getZoneProps: B,
210
210
  getItemProps: Z,
211
211
  handleDragStart: m,
212
212
  handleDragOver: _,
213
- handleDragEnd: L
213
+ handleDragEnd: R
214
214
  };
215
215
  }
216
- let R = null, F = null, K = !1;
217
- const Ee = [
216
+ let k = null, F = null, K = !1;
217
+ const ye = [
218
218
  "DndContext",
219
219
  "DragOverlay",
220
220
  "useSensors",
@@ -223,22 +223,22 @@ const Ee = [
223
223
  "PointerSensor",
224
224
  "KeyboardSensor",
225
225
  "closestCenter"
226
- ], Ie = [
226
+ ], Ee = [
227
227
  "SortableContext",
228
228
  "useSortable",
229
229
  "verticalListSortingStrategy"
230
230
  ];
231
- function ye(e, n) {
231
+ function Ie(e, n) {
232
232
  const t = [], r = e ?? {};
233
- for (const l of Ee)
234
- r[l] === void 0 && t.push(`@dnd-kit/core:${l}`);
233
+ for (const a of ye)
234
+ r[a] === void 0 && t.push(`@dnd-kit/core:${a}`);
235
235
  const o = n ?? {};
236
- for (const l of Ie)
237
- o[l] === void 0 && t.push(`@dnd-kit/sortable:${l}`);
236
+ for (const a of Ee)
237
+ o[a] === void 0 && t.push(`@dnd-kit/sortable:${a}`);
238
238
  return t.length === 0 ? { ok: !0 } : { ok: !1, missing: t };
239
239
  }
240
- function Se() {
241
- return R ? Promise.resolve(R) : K ? Promise.resolve(null) : F || (F = (async () => {
240
+ function Ce() {
241
+ return k ? Promise.resolve(k) : K ? Promise.resolve(null) : F || (F = (async () => {
242
242
  try {
243
243
  const [e, n, t] = await Promise.all([
244
244
  import("@dnd-kit/core"),
@@ -246,12 +246,12 @@ function Se() {
246
246
  import("@dnd-kit/utilities").catch(() => (process.env.NODE_ENV !== "production" && console.warn(
247
247
  "SortableZones: @dnd-kit/utilities failed to load; drag-overlay positioning will fall back (items may teleport instead of slide)."
248
248
  ), {}))
249
- ]), r = ye(e, n);
250
- return r.ok ? (R = {
249
+ ]), r = Ie(e, n);
250
+ return r.ok ? (k = {
251
251
  core: e,
252
252
  sortable: n,
253
253
  utilities: t
254
- }, R) : (K = !0, process.env.NODE_ENV !== "production" && console.error(
254
+ }, k) : (K = !0, process.env.NODE_ENV !== "production" && console.error(
255
255
  `SortableZones: @dnd-kit shape mismatch — missing exports: ${r.missing.join(", ")}. Check installed versions against optionalDependencies in @mt-gloss/ui.`
256
256
  ), null);
257
257
  } catch {
@@ -259,31 +259,31 @@ function Se() {
259
259
  }
260
260
  })(), F);
261
261
  }
262
- function Ce(e) {
263
- const { zones: n, onZoneChange: t, renderZone: r, renderItem: o, renderDragOverlay: l } = e, c = ve({ zones: n, onZoneChange: t }), [s, p] = M.useState(R);
262
+ function Se(e) {
263
+ const { zones: n, onZoneChange: t, renderZone: r, renderItem: o, renderDragOverlay: a } = e, c = ve({ zones: n, onZoneChange: t }), [l, p] = M.useState(k);
264
264
  return M.useEffect(() => {
265
- if (s) return;
265
+ if (l) return;
266
266
  let u = !0;
267
- return Se().then((a) => {
268
- u && p(a);
267
+ return Ce().then((d) => {
268
+ u && p(d);
269
269
  }), () => {
270
270
  u = !1;
271
271
  };
272
- }, [s]), s ? /* @__PURE__ */ d(
272
+ }, [l]), l ? /* @__PURE__ */ s(
273
273
  ee,
274
274
  {
275
275
  state: c,
276
- modules: s,
276
+ modules: l,
277
277
  renderZone: r,
278
278
  renderItem: o,
279
- renderDragOverlay: l
279
+ renderDragOverlay: a
280
280
  }
281
- ) : /* @__PURE__ */ d("div", { "data-sortable-zones-passive": "true", children: c.zones.map((u) => {
282
- const a = u.items.map((m) => /* @__PURE__ */ d(M.Fragment, { children: o(m) }, m.id));
283
- return /* @__PURE__ */ d("div", { ...c.getZoneProps(u.zoneKey), children: r(u.zoneKey, u.items, a) }, u.zoneKey);
281
+ ) : /* @__PURE__ */ s("div", { "data-sortable-zones-passive": "true", children: c.zones.map((u) => {
282
+ const d = u.items.map((m) => /* @__PURE__ */ s(M.Fragment, { children: o(m) }, m.id));
283
+ return /* @__PURE__ */ s("div", { ...c.getZoneProps(u.zoneKey), children: r(u.zoneKey, u.items, d) }, u.zoneKey);
284
284
  }) });
285
285
  }
286
- Ce.displayName = "SortableZones";
286
+ Se.displayName = "SortableZones";
287
287
  function ee({
288
288
  state: e,
289
289
  modules: n,
@@ -291,54 +291,54 @@ function ee({
291
291
  renderItem: r,
292
292
  renderDragOverlay: o
293
293
  }) {
294
- const { core: l, sortable: c, utilities: s } = n, { DndContext: p, DragOverlay: u, useSensors: a, useSensor: m, useDroppable: _, PointerSensor: L, KeyboardSensor: B, closestCenter: Z } = l, { SortableContext: i, verticalListSortingStrategy: g } = c, C = a(
295
- m(L, { activationConstraint: { distance: 5 } }),
294
+ const { core: a, sortable: c, utilities: l } = n, { DndContext: p, DragOverlay: u, useSensors: d, useSensor: m, useDroppable: _, PointerSensor: R, KeyboardSensor: B, closestCenter: Z } = a, { SortableContext: i, verticalListSortingStrategy: g } = c, S = d(
295
+ m(R, { activationConstraint: { distance: 5 } }),
296
296
  m(B)
297
- ), E = p, b = u, P = i;
298
- return /* @__PURE__ */ k(
299
- E,
297
+ ), y = p, b = u, P = i;
298
+ return /* @__PURE__ */ N(
299
+ y,
300
300
  {
301
- sensors: C,
301
+ sensors: S,
302
302
  collisionDetection: Z,
303
303
  onDragStart: e.handleDragStart,
304
304
  onDragOver: e.handleDragOver,
305
305
  onDragEnd: e.handleDragEnd,
306
306
  children: [
307
307
  e.zones.map((f) => {
308
- const I = f.items.map((h) => h.id), y = f.items.map((h) => /* @__PURE__ */ d(
308
+ const E = f.items.map((h) => h.id), I = f.items.map((h) => /* @__PURE__ */ s(
309
309
  ne,
310
310
  {
311
311
  id: h.id,
312
312
  useSortable: c.useSortable,
313
- cssHelper: s.CSS,
313
+ cssHelper: l.CSS,
314
314
  children: r(h)
315
315
  },
316
316
  h.id
317
317
  ));
318
- return /* @__PURE__ */ d(
318
+ return /* @__PURE__ */ s(
319
319
  te,
320
320
  {
321
321
  zoneKey: f.zoneKey,
322
322
  zoneProps: e.getZoneProps(f.zoneKey),
323
323
  useDroppable: _,
324
- children: /* @__PURE__ */ d(P, { items: I, strategy: g, children: t(f.zoneKey, f.items, y) })
324
+ children: /* @__PURE__ */ s(P, { items: E, strategy: g, children: t(f.zoneKey, f.items, I) })
325
325
  },
326
326
  f.zoneKey
327
327
  );
328
328
  }),
329
- /* @__PURE__ */ d(b, { children: e.activeItem ? o?.(e.activeItem) ?? r(e.activeItem) : null })
329
+ /* @__PURE__ */ s(b, { children: e.activeItem ? o?.(e.activeItem) ?? r(e.activeItem) : null })
330
330
  ]
331
331
  }
332
332
  );
333
333
  }
334
334
  ee.displayName = "SortableZonesInner";
335
335
  function ne({ id: e, useSortable: n, cssHelper: t, children: r }) {
336
- const { attributes: o, listeners: l, setNodeRef: c, transform: s, transition: p, isDragging: u } = n({ id: e }), a = {
337
- transform: t?.Transform?.toString(s) ?? void 0,
336
+ const { attributes: o, listeners: a, setNodeRef: c, transform: l, transition: p, isDragging: u } = n({ id: e }), d = {
337
+ transform: t?.Transform?.toString(l) ?? void 0,
338
338
  transition: p,
339
339
  opacity: u ? 0.5 : 1
340
340
  };
341
- return /* @__PURE__ */ d("div", { ref: c, style: a, "data-sortable-item-id": e, ...o, ...l, children: r });
341
+ return /* @__PURE__ */ s("div", { ref: c, style: d, "data-sortable-item-id": e, ...o, ...a, children: r });
342
342
  }
343
343
  ne.displayName = "SortableItem";
344
344
  function te({
@@ -347,8 +347,8 @@ function te({
347
347
  useDroppable: t,
348
348
  children: r
349
349
  }) {
350
- const { setNodeRef: o, isOver: l } = t({ id: e });
351
- return /* @__PURE__ */ d("div", { ref: o, "data-zone-is-over": l || void 0, ...n, children: r });
350
+ const { setNodeRef: o, isOver: a } = t({ id: e });
351
+ return /* @__PURE__ */ s("div", { ref: o, "data-zone-is-over": a || void 0, ...n, children: r });
352
352
  }
353
353
  te.displayName = "ZoneDroppable";
354
354
  const $ = le(null);
@@ -360,25 +360,25 @@ function be() {
360
360
  );
361
361
  return e;
362
362
  }
363
- function ze() {
363
+ function _e() {
364
364
  return W($);
365
365
  }
366
- const _e = w.number().min(0).max(100), Pe = w.number().min(7).max(90), De = w.enum(["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"]), xe = w.array(w.string().min(1)).max(3), Oe = w.boolean();
367
- function Ne(e, n) {
366
+ const Pe = T.number().min(0).max(100), De = T.number().min(7).max(90), xe = T.enum(["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"]), Ne = T.array(T.string().min(1)).max(3), Oe = T.boolean();
367
+ function Le(e, n) {
368
368
  if (e === "threshold") {
369
- const t = _e.safeParse(n);
369
+ const t = Pe.safeParse(n);
370
370
  return t.success ? t.data : 80;
371
371
  }
372
372
  if (e === "timeframe") {
373
- const t = Pe.safeParse(n);
373
+ const t = De.safeParse(n);
374
374
  return t.success ? t.data : 30;
375
375
  }
376
376
  if (e === "accent") {
377
- const t = De.safeParse(n);
377
+ const t = xe.safeParse(n);
378
378
  return t.success ? t.data : null;
379
379
  }
380
380
  if (e === "slots") {
381
- const t = xe.safeParse(n);
381
+ const t = Ne.safeParse(n);
382
382
  return t.success ? t.data : [];
383
383
  }
384
384
  if (e === "thresholdEnabled" || e === "accentEnabled") {
@@ -387,7 +387,7 @@ function Ne(e, n) {
387
387
  }
388
388
  return n;
389
389
  }
390
- const Te = {
390
+ const we = {
391
391
  activePanelId: null,
392
392
  activeTrigger: null,
393
393
  bellCutoutOpen: !1,
@@ -398,7 +398,7 @@ const Te = {
398
398
  lastClose: null,
399
399
  pendingSideEffects: []
400
400
  }, Y = /* @__PURE__ */ new Set(["settings"]);
401
- function we(e, n) {
401
+ function Te(e, n) {
402
402
  if (e == null || e.kind !== n.kind) return !1;
403
403
  switch (e.kind) {
404
404
  case "bell":
@@ -413,7 +413,7 @@ function we(e, n) {
413
413
  return e.action === n.action && e.blockedCardId === n.blockedCardId && e.activeCardId === n.activeCardId;
414
414
  }
415
415
  }
416
- function Le(e, n) {
416
+ function Re(e, n) {
417
417
  switch (n.type) {
418
418
  case "OPEN_PANEL": {
419
419
  if (e.activePanelId && e.isDirty)
@@ -431,7 +431,7 @@ function Le(e, n) {
431
431
  }
432
432
  ]
433
433
  };
434
- if (e.activePanelId === n.panelId && we(e.activeTrigger, n.trigger))
434
+ if (e.activePanelId === n.panelId && Te(e.activeTrigger, n.trigger))
435
435
  return e;
436
436
  const t = e.activePanelId != null ? [
437
437
  {
@@ -456,14 +456,14 @@ function Le(e, n) {
456
456
  case "CLOSE_PANEL": {
457
457
  if (e.activePanelId == null)
458
458
  return e;
459
- const t = e.activePanelId, r = e.activeTrigger?.cardId ?? null, o = r != null ? e.bufferByCard[r] : void 0, l = e.isDirty ? n.reason === "apply-button" ? r != null && o != null ? [
459
+ const t = e.activePanelId, r = e.activeTrigger?.cardId ?? null, o = r != null ? e.bufferByCard[r] : void 0, a = e.isDirty ? n.reason === "apply-button" ? r != null && o != null ? [
460
460
  {
461
461
  type: "COMMIT_BUFFER",
462
462
  payload: { cardId: r, delta: o }
463
463
  }
464
464
  ] : [{ type: "COMMIT_BUFFER" }] : [{ type: "DISCARD_BUFFER" }] : [], c = r != null && o != null ? (() => {
465
- const s = { ...e.bufferByCard };
466
- return delete s[r], s;
465
+ const l = { ...e.bufferByCard };
466
+ return delete l[r], l;
467
467
  })() : e.bufferByCard;
468
468
  return {
469
469
  ...e,
@@ -476,7 +476,7 @@ function Le(e, n) {
476
476
  // closing clears any active lockHint (dirty-buffer condition gone)
477
477
  bufferByCard: c,
478
478
  lastClose: { panelId: t, reason: n.reason },
479
- pendingSideEffects: [...e.pendingSideEffects, ...l]
479
+ pendingSideEffects: [...e.pendingSideEffects, ...a]
480
480
  };
481
481
  }
482
482
  case "OPEN_BELL_CUTOUT":
@@ -501,13 +501,13 @@ function Le(e, n) {
501
501
  { type: "INVALID_DISPATCH", reason: "no-buffer-panel" }
502
502
  ]
503
503
  };
504
- const t = e.bufferByCard[n.cardId], r = t == null, o = Ne(n.key, n.value);
504
+ const t = e.bufferByCard[n.cardId], r = t == null, o = Le(n.key, n.value);
505
505
  if (!r && t.changes[n.key] === o)
506
506
  return e;
507
507
  const c = { kind: "settings", changes: {
508
508
  ...t?.kind === "settings" ? t.changes : {},
509
509
  [n.key]: o
510
- } }, s = { ...e.bufferByCard, [n.cardId]: c }, p = r ? [
510
+ } }, l = { ...e.bufferByCard, [n.cardId]: c }, p = r ? [
511
511
  {
512
512
  type: "SCHEDULE_TIMER",
513
513
  ms: 0,
@@ -516,7 +516,7 @@ function Le(e, n) {
516
516
  ] : [];
517
517
  return {
518
518
  ...e,
519
- bufferByCard: s,
519
+ bufferByCard: l,
520
520
  pendingSideEffects: [...e.pendingSideEffects, ...p]
521
521
  };
522
522
  }
@@ -525,7 +525,7 @@ function Le(e, n) {
525
525
  return e;
526
526
  const r = Object.keys(e.bufferByCard).length === 1, o = { ...e.bufferByCard };
527
527
  delete o[n.cardId];
528
- const l = r && e.isDirty ? [
528
+ const a = r && e.isDirty ? [
529
529
  {
530
530
  type: "SCHEDULE_TIMER",
531
531
  ms: 0,
@@ -535,7 +535,7 @@ function Le(e, n) {
535
535
  return {
536
536
  ...e,
537
537
  bufferByCard: o,
538
- pendingSideEffects: [...e.pendingSideEffects, ...l]
538
+ pendingSideEffects: [...e.pendingSideEffects, ...a]
539
539
  };
540
540
  }
541
541
  case "BUFFER_BECOMES_DIRTY":
@@ -575,31 +575,31 @@ function Le(e, n) {
575
575
  return e;
576
576
  }
577
577
  }
578
- function Re(e) {
578
+ function ke(e) {
579
579
  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";
580
580
  }
581
- function ke() {
582
- const [e, n] = ae(Le, Te), t = N([]), r = N(null);
583
- T(() => () => {
581
+ function Ae() {
582
+ const [e, n] = ae(Re, we), t = L([]), r = L(null);
583
+ w(() => () => {
584
584
  r.current != null && (window.clearTimeout(r.current), r.current = null);
585
- }, []), T(() => {
585
+ }, []), w(() => {
586
586
  const c = e.pendingSideEffects.length;
587
587
  if (c !== 0) {
588
- for (const s of e.pendingSideEffects)
589
- s.type === "SCHEDULE_TIMER" ? (r.current != null && window.clearTimeout(r.current), r.current = window.setTimeout(() => {
590
- r.current = null, n(s.action);
591
- }, Math.max(0, s.ms))) : s.type === "SET_LOCK_HINT" ? n({ type: "SET_LOCK_HINT", hint: s.hint }) : s.type === "HANDOFF_CLOSE" ? t.current = [
588
+ for (const l of e.pendingSideEffects)
589
+ l.type === "SCHEDULE_TIMER" ? (r.current != null && window.clearTimeout(r.current), r.current = window.setTimeout(() => {
590
+ r.current = null, n(l.action);
591
+ }, Math.max(0, l.ms))) : l.type === "SET_LOCK_HINT" ? n({ type: "SET_LOCK_HINT", hint: l.hint }) : l.type === "HANDOFF_CLOSE" ? t.current = [
592
592
  ...t.current.slice(-99),
593
593
  {
594
- panelId: s.previousPanelId,
594
+ panelId: l.previousPanelId,
595
595
  reason: "mutex-handoff",
596
596
  at: Date.now(),
597
597
  note: "F22: mutex-handoff synthetic close-log entry"
598
598
  }
599
- ] : s.type === "INVALID_DISPATCH" && process.env.NODE_ENV !== "production" && console.warn("[panels] INVALID_DISPATCH:", s.reason);
599
+ ] : l.type === "INVALID_DISPATCH" && process.env.NODE_ENV !== "production" && console.warn("[panels] INVALID_DISPATCH:", l.reason);
600
600
  n({ type: "DRAIN_SIDE_EFFECTS", count: c });
601
601
  }
602
- }, [e.pendingSideEffects, n]), T(() => {
602
+ }, [e.pendingSideEffects, n]), w(() => {
603
603
  if (!e.lastClose) return;
604
604
  const c = {
605
605
  panelId: e.lastClose.panelId,
@@ -613,26 +613,112 @@ function ke() {
613
613
  ];
614
614
  }, [e.lastClose]);
615
615
  const o = V(
616
- () => Re(e),
616
+ () => ke(e),
617
617
  [e.activePanelId, e.bellCutoutOpen, e.isDirty]
618
- ), l = O(() => t.current.slice(), []);
619
- return { state: e, surfaceState: o, dispatch: n, getCloseLog: l };
618
+ ), a = O(() => t.current.slice(), []);
619
+ return { state: e, surfaceState: o, dispatch: n, getCloseLog: a };
620
620
  }
621
- function je({ children: e }) {
622
- const n = ke(), t = V(
621
+ function Ge({ children: e }) {
622
+ const n = Ae(), t = V(
623
623
  () => n,
624
624
  // Re-publish only when one of the four coordinator fields changes identity.
625
625
  // dispatch + getCloseLog are stable. state + surfaceState change on dispatch.
626
626
  [n.state, n.surfaceState, n.dispatch, n.getCloseLog]
627
627
  );
628
- return /* @__PURE__ */ d($.Provider, { value: t, children: e });
628
+ return /* @__PURE__ */ s($.Provider, { value: t, children: e });
629
+ }
630
+ function Fe({ title: e, onClose: n }) {
631
+ return /* @__PURE__ */ N("div", { className: "gloss-panel-chrome-v2__header", children: [
632
+ e != null && /* @__PURE__ */ s("span", { className: "gloss-panel-chrome-v2__title", children: e }),
633
+ /* @__PURE__ */ s(
634
+ "button",
635
+ {
636
+ id: "panel-close",
637
+ type: "button",
638
+ "aria-label": "Close panel",
639
+ className: "gloss-panel-chrome-v2__close",
640
+ onClick: n,
641
+ children: "×"
642
+ }
643
+ )
644
+ ] });
645
+ }
646
+ function He({ children: e }) {
647
+ return /* @__PURE__ */ s(
648
+ "div",
649
+ {
650
+ "data-panel-stage": !0,
651
+ "aria-hidden": "true",
652
+ className: "gloss-panel-chrome-v2__stage",
653
+ children: e
654
+ }
655
+ );
656
+ }
657
+ function Be({ children: e }) {
658
+ return /* @__PURE__ */ s("div", { className: "gloss-panel-chrome-v2__navigation", children: e });
659
+ }
660
+ function Ze({ children: e }) {
661
+ return /* @__PURE__ */ s("div", { className: "gloss-panel-chrome-v2__body", children: e });
662
+ }
663
+ function Me({ left: e, right: n }) {
664
+ return /* @__PURE__ */ N("div", { className: "gloss-panel-chrome-v2__footer", children: [
665
+ /* @__PURE__ */ s("div", { className: "gloss-panel-chrome-v2__footer-left", children: e }),
666
+ /* @__PURE__ */ s("div", { className: "gloss-panel-chrome-v2__footer-right", children: n })
667
+ ] });
668
+ }
669
+ function Ke({
670
+ children: e,
671
+ onClose: n,
672
+ title: t,
673
+ variant: r = "no-stage",
674
+ stage: o,
675
+ navigation: a,
676
+ footer: c
677
+ }) {
678
+ return /* @__PURE__ */ N(
679
+ "div",
680
+ {
681
+ "data-chrome": "panel-v2",
682
+ "data-chrome-variant": r,
683
+ role: "dialog",
684
+ "aria-modal": "true",
685
+ className: `gloss-panel-chrome-v2 gloss-panel-chrome-v2--${r}`,
686
+ children: [
687
+ /* @__PURE__ */ s(Fe, { title: t, onClose: n }),
688
+ r === "with-stage" && /* @__PURE__ */ s(He, { children: o }),
689
+ a != null && /* @__PURE__ */ s(Be, { children: a }),
690
+ /* @__PURE__ */ s(Ze, { children: e }),
691
+ c != null && /* @__PURE__ */ s(Me, { left: c.left, right: c.right })
692
+ ]
693
+ }
694
+ );
695
+ }
696
+ function Je({ isOpen: e }) {
697
+ const n = _e();
698
+ return /* @__PURE__ */ s(
699
+ Ke,
700
+ {
701
+ variant: "no-stage",
702
+ title: "Notifications",
703
+ onClose: () => n?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }),
704
+ children: /* @__PURE__ */ s(
705
+ "div",
706
+ {
707
+ "data-shell": "notification-center",
708
+ "data-panel": "notification-center",
709
+ "aria-hidden": !e,
710
+ children: /* @__PURE__ */ s("p", { children: "No notifications" })
711
+ }
712
+ )
713
+ }
714
+ );
629
715
  }
630
- const Ae = {
716
+ const Ue = {
631
717
  position: "relative",
632
718
  pointerEvents: "auto"
633
719
  };
634
- function Fe({ children: e, onClose: n, footer: t, title: r, variant: o = "default" }) {
635
- return /* @__PURE__ */ k(
720
+ function Ve({ children: e, onClose: n, footer: t, title: r, variant: o = "default" }) {
721
+ return /* @__PURE__ */ N(
636
722
  "div",
637
723
  {
638
724
  "data-chrome": "panel",
@@ -640,11 +726,11 @@ function Fe({ children: e, onClose: n, footer: t, title: r, variant: o = "defaul
640
726
  role: "dialog",
641
727
  "aria-modal": "true",
642
728
  className: o === "merged-stage" ? "gloss-panel-chrome gloss-panel-chrome--merged-stage" : "gloss-panel-chrome",
643
- style: Ae,
729
+ style: Ue,
644
730
  children: [
645
- /* @__PURE__ */ k("div", { className: "gloss-panel-chrome__header", children: [
646
- r != null && /* @__PURE__ */ d("span", { className: "gloss-panel-chrome__title", children: r }),
647
- /* @__PURE__ */ d(
731
+ /* @__PURE__ */ N("div", { className: "gloss-panel-chrome__header", children: [
732
+ r != null && /* @__PURE__ */ s("span", { className: "gloss-panel-chrome__title", children: r }),
733
+ /* @__PURE__ */ s(
648
734
  "button",
649
735
  {
650
736
  id: "panel-close",
@@ -656,13 +742,13 @@ function Fe({ children: e, onClose: n, footer: t, title: r, variant: o = "defaul
656
742
  }
657
743
  )
658
744
  ] }),
659
- /* @__PURE__ */ d("div", { className: "gloss-panel-chrome__body", children: e }),
660
- t != null && /* @__PURE__ */ d("div", { className: "gloss-panel-chrome__footer", children: t })
745
+ /* @__PURE__ */ s("div", { className: "gloss-panel-chrome__body", children: e }),
746
+ t != null && /* @__PURE__ */ s("div", { className: "gloss-panel-chrome__footer", children: t })
661
747
  ]
662
748
  }
663
749
  );
664
750
  }
665
- function He(e) {
751
+ function $e(e) {
666
752
  if (process.env.NODE_ENV === "production" || !e || !e.parentElement) return;
667
753
  const n = e.parentElement, t = window.getComputedStyle(n);
668
754
  t.perspective === "none" && console.warn(
@@ -673,26 +759,26 @@ function He(e) {
673
759
  n
674
760
  );
675
761
  }
676
- function Be({ isOpen: e, children: n }) {
677
- const t = J(), r = N(null);
762
+ function ze({ isOpen: e, children: n }) {
763
+ const t = J(), r = L(null);
678
764
  X(() => {
679
- He(r.current);
765
+ $e(r.current);
680
766
  }, []);
681
- const [o, l] = H(!1);
682
- T(() => {
767
+ const [o, a] = H(!1);
768
+ w(() => {
683
769
  if (!e) {
684
- l(!1);
770
+ a(!1);
685
771
  return;
686
772
  }
687
- const s = requestAnimationFrame(() => l(!0));
688
- return () => cancelAnimationFrame(s);
773
+ const l = requestAnimationFrame(() => a(!0));
774
+ return () => cancelAnimationFrame(l);
689
775
  }, [e]);
690
776
  const c = [
691
777
  "gloss-panel-mount",
692
778
  o ? "has-panel" : "",
693
779
  t ? "reduced-motion" : ""
694
780
  ].filter(Boolean).join(" ");
695
- return /* @__PURE__ */ d(
781
+ return /* @__PURE__ */ s(
696
782
  "div",
697
783
  {
698
784
  ref: r,
@@ -703,7 +789,7 @@ function Be({ isOpen: e, children: n }) {
703
789
  }
704
790
  );
705
791
  }
706
- const Ze = {
792
+ const je = {
707
793
  position: "fixed",
708
794
  top: 0,
709
795
  left: 0,
@@ -714,7 +800,7 @@ const Ze = {
714
800
  overflow: "visible",
715
801
  pointerEvents: "none",
716
802
  zIndex: 55
717
- }, Me = {
803
+ }, qe = {
718
804
  position: "fixed",
719
805
  top: "var(--tb-h, 60px)",
720
806
  left: 0,
@@ -730,12 +816,12 @@ const Ze = {
730
816
  pointerEvents: "none",
731
817
  background: "rgba(0, 0, 0, 0.04)"
732
818
  };
733
- function qe({ panelComponents: e }) {
819
+ function en({ panelComponents: e }) {
734
820
  const { state: n, dispatch: t, getCloseLog: r } = be(), o = n.activePanelId ? e[n.activePanelId] : null;
735
821
  n.activePanelId && !o && process.env.NODE_ENV !== "production" && console.error(
736
822
  "[panels] No panel component registered for activePanelId:",
737
823
  n.activePanelId
738
- ), T(() => {
824
+ ), w(() => {
739
825
  if (n.activePanelId == null) return;
740
826
  function p(u) {
741
827
  u.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
@@ -744,15 +830,15 @@ function qe({ panelComponents: e }) {
744
830
  document.removeEventListener("keydown", p);
745
831
  };
746
832
  }, [n.activePanelId, t]);
747
- const l = N(n);
833
+ const a = L(n);
748
834
  X(() => {
749
- l.current = n;
750
- }), T(() => {
835
+ a.current = n;
836
+ }), w(() => {
751
837
  if (process.env.NODE_ENV === "production") return;
752
838
  const p = window;
753
839
  return p.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), p.__panelsHostHandle = {
754
840
  dispatch: t,
755
- getState: () => l.current,
841
+ getState: () => a.current,
756
842
  getCloseLog: r
757
843
  }, () => {
758
844
  p.__panelsHostHandle?.dispatch === t && delete p.__panelsHostHandle;
@@ -760,27 +846,27 @@ function qe({ panelComponents: e }) {
760
846
  }, [t, r]);
761
847
  const c = O(() => {
762
848
  t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
763
- }, [t]), s = n.activePanelId != null && o != null;
764
- return /* @__PURE__ */ k("div", { "data-panel-host": "true", style: Ze, children: [
765
- s && /* @__PURE__ */ d(
849
+ }, [t]), l = n.activePanelId != null && o != null;
850
+ return /* @__PURE__ */ N("div", { "data-panel-host": "true", style: je, children: [
851
+ l && /* @__PURE__ */ s(
766
852
  "div",
767
853
  {
768
854
  "data-panel-scrim": "true",
769
- style: Me,
855
+ style: qe,
770
856
  onClick: c
771
857
  }
772
858
  ),
773
- /* @__PURE__ */ d(Be, { isOpen: s, children: s && /* @__PURE__ */ d(
774
- Fe,
859
+ /* @__PURE__ */ s(ze, { isOpen: l, children: l && /* @__PURE__ */ s(
860
+ Ve,
775
861
  {
776
862
  isOpen: !0,
777
863
  onClose: () => t({ type: "CLOSE_PANEL", reason: "header-x" }),
778
- children: /* @__PURE__ */ d(o, { isOpen: !0 })
864
+ children: /* @__PURE__ */ s(o, { isOpen: !0 })
779
865
  }
780
866
  ) })
781
867
  ] });
782
868
  }
783
- const Qe = {
869
+ const nn = {
784
870
  "apply-button": !0,
785
871
  // the ONLY commit reason
786
872
  "cancel-button": !1,
@@ -796,19 +882,26 @@ const Qe = {
796
882
  // Phase 11.6 D-19 — R9 drag-start auto-close discards buffer
797
883
  };
798
884
  export {
799
- Qe as C,
800
- je as P,
801
- Ce as S,
885
+ nn as C,
886
+ Je as N,
887
+ Ge as P,
888
+ Se as S,
802
889
  ve as a,
803
890
  be as b,
804
- qe as c,
805
- Fe as d,
806
- ke as e,
807
- Re as f,
891
+ en as c,
892
+ Ve as d,
893
+ Ae as e,
894
+ ke as f,
808
895
  me as g,
809
896
  J as h,
810
- Te as i,
811
- Be as j,
812
- Le as r,
813
- ze as u
897
+ we as i,
898
+ Ke as j,
899
+ ze as k,
900
+ Fe as l,
901
+ He as m,
902
+ Be as n,
903
+ Ze as o,
904
+ Me as p,
905
+ Re as r,
906
+ _e as u
814
907
  };