@mt-gloss/ui 0.1.119 → 0.1.121
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.
- package/{COMMITS-BkM1Urzh.js → COMMITS-8eHelQHO.js} +114 -101
- package/composites-panels.js +294 -332
- package/index.js +3 -3
- package/package.json +1 -1
- package/ui.css +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import { jsx as
|
|
1
|
+
import { jsx as i, jsxs as N } from "react/jsx-runtime";
|
|
2
2
|
import { motion as se } from "framer-motion";
|
|
3
|
-
import M, { useSyncExternalStore as ie, useState as H, useRef as
|
|
3
|
+
import M, { useSyncExternalStore as ie, useState as H, useRef as w, useMemo as V, useEffect as L, useCallback as O, createContext as le, useContext as W, useReducer as ae, useLayoutEffect as X } from "react";
|
|
4
4
|
import { z as T } from "zod";
|
|
5
5
|
const ce = "(prefers-reduced-motion: reduce)";
|
|
6
6
|
function G() {
|
|
@@ -37,12 +37,12 @@ function me({
|
|
|
37
37
|
labels: o,
|
|
38
38
|
ariaLabel: a = "Settings dimensions"
|
|
39
39
|
}) {
|
|
40
|
-
const c = J(),
|
|
40
|
+
const c = J(), s = r ?? c;
|
|
41
41
|
if (e.length < 2) return null;
|
|
42
42
|
const p = (d) => o?.[d] ?? pe[d], u = (d, m) => {
|
|
43
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__ */
|
|
45
|
+
return /* @__PURE__ */ i(
|
|
46
46
|
"div",
|
|
47
47
|
{
|
|
48
48
|
role: "tablist",
|
|
@@ -63,8 +63,8 @@ function me({
|
|
|
63
63
|
onClick: () => t(d),
|
|
64
64
|
onKeyDown: (R) => u(R, m),
|
|
65
65
|
children: [
|
|
66
|
-
/* @__PURE__ */
|
|
67
|
-
_ && !
|
|
66
|
+
/* @__PURE__ */ i("span", { className: "settings-tab-strip__label", children: p(d) }),
|
|
67
|
+
_ && !s && /* @__PURE__ */ i(
|
|
68
68
|
se.span,
|
|
69
69
|
{
|
|
70
70
|
layoutId: "settings-active-tab-indicator",
|
|
@@ -102,25 +102,25 @@ function he(e) {
|
|
|
102
102
|
}
|
|
103
103
|
function ve(e) {
|
|
104
104
|
const [n, t] = H(
|
|
105
|
-
() => e.zones.map((
|
|
106
|
-
`useSortableZones: zone "${
|
|
107
|
-
), { ...
|
|
108
|
-
), [r, o] = H(null), [a, c] = H(null),
|
|
105
|
+
() => e.zones.map((l) => l.maxItems !== void 0 && l.items.length > l.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
|
|
106
|
+
`useSortableZones: zone "${l.zoneKey}" exceeds maxItems (${l.items.length} > ${l.maxItems}); trimming to cap.`
|
|
107
|
+
), { ...l, items: l.items.slice(0, l.maxItems) }) : l)
|
|
108
|
+
), [r, o] = H(null), [a, c] = H(null), s = w(null), p = w(e.onZoneChange);
|
|
109
109
|
p.current = e.onZoneChange;
|
|
110
110
|
const u = V(
|
|
111
111
|
() => he(e.zones),
|
|
112
112
|
[e.zones]
|
|
113
|
-
), d =
|
|
114
|
-
|
|
113
|
+
), d = w(u);
|
|
114
|
+
L(() => {
|
|
115
115
|
d.current !== u && (d.current = u, !r && t(
|
|
116
|
-
e.zones.map((
|
|
117
|
-
`useSortableZones: zone "${
|
|
118
|
-
), { ...
|
|
116
|
+
e.zones.map((l) => l.maxItems !== void 0 && l.items.length > l.maxItems ? (process.env.NODE_ENV !== "production" && console.warn(
|
|
117
|
+
`useSortableZones: zone "${l.zoneKey}" exceeds maxItems (${l.items.length} > ${l.maxItems}); trimming to cap.`
|
|
118
|
+
), { ...l, items: l.items.slice(0, l.maxItems) }) : l)
|
|
119
119
|
));
|
|
120
120
|
}, [u, e.zones, r]);
|
|
121
121
|
const m = O(
|
|
122
|
-
(
|
|
123
|
-
const g =
|
|
122
|
+
(l) => {
|
|
123
|
+
const g = l.active.id;
|
|
124
124
|
let S = null, y = null;
|
|
125
125
|
for (const b of n) {
|
|
126
126
|
const P = b.items.find((f) => f.id === g);
|
|
@@ -129,23 +129,23 @@ function ve(e) {
|
|
|
129
129
|
break;
|
|
130
130
|
}
|
|
131
131
|
}
|
|
132
|
-
|
|
132
|
+
s.current = y, o(S), c(y);
|
|
133
133
|
},
|
|
134
134
|
[n]
|
|
135
135
|
), _ = O(
|
|
136
|
-
(
|
|
137
|
-
if (!
|
|
138
|
-
c(
|
|
136
|
+
(l) => {
|
|
137
|
+
if (!l.over) {
|
|
138
|
+
c(s.current);
|
|
139
139
|
return;
|
|
140
140
|
}
|
|
141
|
-
const g = Q(n,
|
|
141
|
+
const g = Q(n, l.over.id);
|
|
142
142
|
c(g);
|
|
143
143
|
},
|
|
144
144
|
[n]
|
|
145
145
|
), R = O(
|
|
146
|
-
(
|
|
147
|
-
const { active: g, over: S } =
|
|
148
|
-
|
|
146
|
+
(l) => {
|
|
147
|
+
const { active: g, over: S } = l, y = () => {
|
|
148
|
+
s.current = null, o(null), c(null);
|
|
149
149
|
};
|
|
150
150
|
if (!S) {
|
|
151
151
|
y();
|
|
@@ -186,17 +186,17 @@ function ve(e) {
|
|
|
186
186
|
},
|
|
187
187
|
[n]
|
|
188
188
|
), B = O(
|
|
189
|
-
(
|
|
190
|
-
id:
|
|
191
|
-
"data-zone-key":
|
|
189
|
+
(l) => ({
|
|
190
|
+
id: l,
|
|
191
|
+
"data-zone-key": l
|
|
192
192
|
}),
|
|
193
193
|
[]
|
|
194
194
|
), Z = O(
|
|
195
|
-
(
|
|
196
|
-
const g = U(n,
|
|
195
|
+
(l) => {
|
|
196
|
+
const g = U(n, l.id) ?? "";
|
|
197
197
|
return {
|
|
198
|
-
id:
|
|
199
|
-
"data-item-id":
|
|
198
|
+
id: l.id,
|
|
199
|
+
"data-item-id": l.id,
|
|
200
200
|
"data-zone-key": g
|
|
201
201
|
};
|
|
202
202
|
},
|
|
@@ -260,27 +260,27 @@ function Ce() {
|
|
|
260
260
|
})(), F);
|
|
261
261
|
}
|
|
262
262
|
function Se(e) {
|
|
263
|
-
const { zones: n, onZoneChange: t, renderZone: r, renderItem: o, renderDragOverlay: a } = e, c = ve({ zones: n, onZoneChange: t }), [
|
|
263
|
+
const { zones: n, onZoneChange: t, renderZone: r, renderItem: o, renderDragOverlay: a } = e, c = ve({ zones: n, onZoneChange: t }), [s, p] = M.useState(k);
|
|
264
264
|
return M.useEffect(() => {
|
|
265
|
-
if (
|
|
265
|
+
if (s) return;
|
|
266
266
|
let u = !0;
|
|
267
267
|
return Ce().then((d) => {
|
|
268
268
|
u && p(d);
|
|
269
269
|
}), () => {
|
|
270
270
|
u = !1;
|
|
271
271
|
};
|
|
272
|
-
}, [
|
|
272
|
+
}, [s]), s ? /* @__PURE__ */ i(
|
|
273
273
|
ee,
|
|
274
274
|
{
|
|
275
275
|
state: c,
|
|
276
|
-
modules:
|
|
276
|
+
modules: s,
|
|
277
277
|
renderZone: r,
|
|
278
278
|
renderItem: o,
|
|
279
279
|
renderDragOverlay: a
|
|
280
280
|
}
|
|
281
|
-
) : /* @__PURE__ */
|
|
282
|
-
const d = u.items.map((m) => /* @__PURE__ */
|
|
283
|
-
return /* @__PURE__ */
|
|
281
|
+
) : /* @__PURE__ */ i("div", { "data-sortable-zones-passive": "true", children: c.zones.map((u) => {
|
|
282
|
+
const d = u.items.map((m) => /* @__PURE__ */ i(M.Fragment, { children: o(m) }, m.id));
|
|
283
|
+
return /* @__PURE__ */ i("div", { ...c.getZoneProps(u.zoneKey), children: r(u.zoneKey, u.items, d) }, u.zoneKey);
|
|
284
284
|
}) });
|
|
285
285
|
}
|
|
286
286
|
Se.displayName = "SortableZones";
|
|
@@ -291,10 +291,10 @@ function ee({
|
|
|
291
291
|
renderItem: r,
|
|
292
292
|
renderDragOverlay: o
|
|
293
293
|
}) {
|
|
294
|
-
const { core: a, sortable: c, utilities:
|
|
294
|
+
const { core: a, sortable: c, utilities: s } = n, { DndContext: p, DragOverlay: u, useSensors: d, useSensor: m, useDroppable: _, PointerSensor: R, KeyboardSensor: B, closestCenter: Z } = a, { SortableContext: l, verticalListSortingStrategy: g } = c, S = d(
|
|
295
295
|
m(R, { activationConstraint: { distance: 5 } }),
|
|
296
296
|
m(B)
|
|
297
|
-
), y = p, b = u, P =
|
|
297
|
+
), y = p, b = u, P = l;
|
|
298
298
|
return /* @__PURE__ */ N(
|
|
299
299
|
y,
|
|
300
300
|
{
|
|
@@ -305,40 +305,40 @@ function ee({
|
|
|
305
305
|
onDragEnd: e.handleDragEnd,
|
|
306
306
|
children: [
|
|
307
307
|
e.zones.map((f) => {
|
|
308
|
-
const E = f.items.map((h) => h.id), I = f.items.map((h) => /* @__PURE__ */
|
|
308
|
+
const E = f.items.map((h) => h.id), I = f.items.map((h) => /* @__PURE__ */ i(
|
|
309
309
|
ne,
|
|
310
310
|
{
|
|
311
311
|
id: h.id,
|
|
312
312
|
useSortable: c.useSortable,
|
|
313
|
-
cssHelper:
|
|
313
|
+
cssHelper: s.CSS,
|
|
314
314
|
children: r(h)
|
|
315
315
|
},
|
|
316
316
|
h.id
|
|
317
317
|
));
|
|
318
|
-
return /* @__PURE__ */
|
|
318
|
+
return /* @__PURE__ */ i(
|
|
319
319
|
te,
|
|
320
320
|
{
|
|
321
321
|
zoneKey: f.zoneKey,
|
|
322
322
|
zoneProps: e.getZoneProps(f.zoneKey),
|
|
323
323
|
useDroppable: _,
|
|
324
|
-
children: /* @__PURE__ */
|
|
324
|
+
children: /* @__PURE__ */ i(P, { items: E, strategy: g, children: t(f.zoneKey, f.items, I) })
|
|
325
325
|
},
|
|
326
326
|
f.zoneKey
|
|
327
327
|
);
|
|
328
328
|
}),
|
|
329
|
-
/* @__PURE__ */
|
|
329
|
+
/* @__PURE__ */ i(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: a, setNodeRef: c, transform:
|
|
337
|
-
transform: t?.Transform?.toString(
|
|
336
|
+
const { attributes: o, listeners: a, setNodeRef: c, transform: s, transition: p, isDragging: u } = n({ id: e }), d = {
|
|
337
|
+
transform: t?.Transform?.toString(s) ?? void 0,
|
|
338
338
|
transition: p,
|
|
339
339
|
opacity: u ? 0.5 : 1
|
|
340
340
|
};
|
|
341
|
-
return /* @__PURE__ */
|
|
341
|
+
return /* @__PURE__ */ i("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({
|
|
@@ -348,7 +348,7 @@ function te({
|
|
|
348
348
|
children: r
|
|
349
349
|
}) {
|
|
350
350
|
const { setNodeRef: o, isOver: a } = t({ id: e });
|
|
351
|
-
return /* @__PURE__ */
|
|
351
|
+
return /* @__PURE__ */ i("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);
|
|
@@ -364,7 +364,7 @@ function _e() {
|
|
|
364
364
|
return W($);
|
|
365
365
|
}
|
|
366
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
|
|
367
|
+
function we(e, n) {
|
|
368
368
|
if (e === "threshold") {
|
|
369
369
|
const t = Pe.safeParse(n);
|
|
370
370
|
return t.success ? t.data : 80;
|
|
@@ -387,7 +387,7 @@ function Le(e, n) {
|
|
|
387
387
|
}
|
|
388
388
|
return n;
|
|
389
389
|
}
|
|
390
|
-
const
|
|
390
|
+
const Le = {
|
|
391
391
|
activePanelId: null,
|
|
392
392
|
activeTrigger: null,
|
|
393
393
|
bellCutoutOpen: !1,
|
|
@@ -462,8 +462,8 @@ function Re(e, n) {
|
|
|
462
462
|
payload: { cardId: r, delta: o }
|
|
463
463
|
}
|
|
464
464
|
] : [{ type: "COMMIT_BUFFER" }] : [{ type: "DISCARD_BUFFER" }] : [], c = r != null && o != null ? (() => {
|
|
465
|
-
const
|
|
466
|
-
return delete
|
|
465
|
+
const s = { ...e.bufferByCard };
|
|
466
|
+
return delete s[r], s;
|
|
467
467
|
})() : e.bufferByCard;
|
|
468
468
|
return {
|
|
469
469
|
...e,
|
|
@@ -501,13 +501,13 @@ function Re(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 =
|
|
504
|
+
const t = e.bufferByCard[n.cardId], r = t == null, o = we(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
|
-
} },
|
|
510
|
+
} }, s = { ...e.bufferByCard, [n.cardId]: c }, p = r ? [
|
|
511
511
|
{
|
|
512
512
|
type: "SCHEDULE_TIMER",
|
|
513
513
|
ms: 0,
|
|
@@ -516,7 +516,7 @@ function Re(e, n) {
|
|
|
516
516
|
] : [];
|
|
517
517
|
return {
|
|
518
518
|
...e,
|
|
519
|
-
bufferByCard:
|
|
519
|
+
bufferByCard: s,
|
|
520
520
|
pendingSideEffects: [...e.pendingSideEffects, ...p]
|
|
521
521
|
};
|
|
522
522
|
}
|
|
@@ -579,27 +579,27 @@ 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
581
|
function Ae() {
|
|
582
|
-
const [e, n] = ae(Re,
|
|
583
|
-
|
|
582
|
+
const [e, n] = ae(Re, Le), t = w([]), r = w(null);
|
|
583
|
+
L(() => () => {
|
|
584
584
|
r.current != null && (window.clearTimeout(r.current), r.current = null);
|
|
585
|
-
}, []),
|
|
585
|
+
}, []), L(() => {
|
|
586
586
|
const c = e.pendingSideEffects.length;
|
|
587
587
|
if (c !== 0) {
|
|
588
|
-
for (const
|
|
589
|
-
|
|
590
|
-
r.current = null, n(
|
|
591
|
-
}, Math.max(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 = [
|
|
592
592
|
...t.current.slice(-99),
|
|
593
593
|
{
|
|
594
|
-
panelId:
|
|
594
|
+
panelId: s.previousPanelId,
|
|
595
595
|
reason: "mutex-handoff",
|
|
596
596
|
at: Date.now(),
|
|
597
597
|
note: "F22: mutex-handoff synthetic close-log entry"
|
|
598
598
|
}
|
|
599
|
-
] :
|
|
599
|
+
] : s.type === "INVALID_DISPATCH" && process.env.NODE_ENV !== "production" && console.warn("[panels] INVALID_DISPATCH:", s.reason);
|
|
600
600
|
n({ type: "DRAIN_SIDE_EFFECTS", count: c });
|
|
601
601
|
}
|
|
602
|
-
}, [e.pendingSideEffects, n]),
|
|
602
|
+
}, [e.pendingSideEffects, n]), L(() => {
|
|
603
603
|
if (!e.lastClose) return;
|
|
604
604
|
const c = {
|
|
605
605
|
panelId: e.lastClose.panelId,
|
|
@@ -625,12 +625,12 @@ function Ge({ children: e }) {
|
|
|
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__ */
|
|
628
|
+
return /* @__PURE__ */ i($.Provider, { value: t, children: e });
|
|
629
629
|
}
|
|
630
630
|
function Fe({ title: e, onClose: n }) {
|
|
631
631
|
return /* @__PURE__ */ N("div", { className: "gloss-panel-chrome-v2__header", children: [
|
|
632
|
-
e != null && /* @__PURE__ */
|
|
633
|
-
/* @__PURE__ */
|
|
632
|
+
e != null && /* @__PURE__ */ i("span", { className: "gloss-panel-chrome-v2__title", children: e }),
|
|
633
|
+
/* @__PURE__ */ i(
|
|
634
634
|
"button",
|
|
635
635
|
{
|
|
636
636
|
id: "panel-close",
|
|
@@ -644,7 +644,7 @@ function Fe({ title: e, onClose: n }) {
|
|
|
644
644
|
] });
|
|
645
645
|
}
|
|
646
646
|
function He({ children: e }) {
|
|
647
|
-
return /* @__PURE__ */
|
|
647
|
+
return /* @__PURE__ */ i(
|
|
648
648
|
"div",
|
|
649
649
|
{
|
|
650
650
|
"data-panel-stage": !0,
|
|
@@ -655,15 +655,15 @@ function He({ children: e }) {
|
|
|
655
655
|
);
|
|
656
656
|
}
|
|
657
657
|
function Be({ children: e }) {
|
|
658
|
-
return /* @__PURE__ */
|
|
658
|
+
return /* @__PURE__ */ i("div", { className: "gloss-panel-chrome-v2__navigation", children: e });
|
|
659
659
|
}
|
|
660
660
|
function Ze({ children: e }) {
|
|
661
|
-
return /* @__PURE__ */
|
|
661
|
+
return /* @__PURE__ */ i("div", { className: "gloss-panel-chrome-v2__body", children: e });
|
|
662
662
|
}
|
|
663
663
|
function Me({ left: e, right: n }) {
|
|
664
664
|
return /* @__PURE__ */ N("div", { className: "gloss-panel-chrome-v2__footer", children: [
|
|
665
|
-
/* @__PURE__ */
|
|
666
|
-
/* @__PURE__ */
|
|
665
|
+
/* @__PURE__ */ i("div", { className: "gloss-panel-chrome-v2__footer-left", children: e }),
|
|
666
|
+
/* @__PURE__ */ i("div", { className: "gloss-panel-chrome-v2__footer-right", children: n })
|
|
667
667
|
] });
|
|
668
668
|
}
|
|
669
669
|
function Ke({
|
|
@@ -675,39 +675,52 @@ function Ke({
|
|
|
675
675
|
navigation: a,
|
|
676
676
|
footer: c
|
|
677
677
|
}) {
|
|
678
|
+
const s = t == null && r === "with-stage";
|
|
678
679
|
return /* @__PURE__ */ N(
|
|
679
680
|
"div",
|
|
680
681
|
{
|
|
681
682
|
"data-chrome": "panel-v2",
|
|
682
683
|
"data-chrome-variant": r,
|
|
684
|
+
"data-headerless": s || void 0,
|
|
683
685
|
role: "dialog",
|
|
684
686
|
"aria-modal": "true",
|
|
685
|
-
className: `gloss-panel-chrome-v2 gloss-panel-chrome-v2--${r}`,
|
|
687
|
+
className: `gloss-panel-chrome-v2 gloss-panel-chrome-v2--${r}${s ? " gloss-panel-chrome-v2--headerless" : ""}`,
|
|
686
688
|
children: [
|
|
687
|
-
/* @__PURE__ */
|
|
688
|
-
r === "with-stage" && /* @__PURE__ */
|
|
689
|
-
a != null && /* @__PURE__ */
|
|
690
|
-
/* @__PURE__ */
|
|
691
|
-
c != null && /* @__PURE__ */
|
|
689
|
+
!s && /* @__PURE__ */ i(Fe, { title: t, onClose: n }),
|
|
690
|
+
r === "with-stage" && /* @__PURE__ */ i(He, { children: o }),
|
|
691
|
+
a != null && /* @__PURE__ */ i(Be, { children: a }),
|
|
692
|
+
/* @__PURE__ */ i(Ze, { children: e }),
|
|
693
|
+
c != null && /* @__PURE__ */ i(Me, { left: c.left, right: c.right }),
|
|
694
|
+
s && /* @__PURE__ */ i(
|
|
695
|
+
"button",
|
|
696
|
+
{
|
|
697
|
+
id: "panel-close",
|
|
698
|
+
type: "button",
|
|
699
|
+
"aria-label": "Close panel",
|
|
700
|
+
className: "gloss-panel-chrome-v2__close gloss-panel-chrome-v2__close--floating",
|
|
701
|
+
onClick: n,
|
|
702
|
+
children: "×"
|
|
703
|
+
}
|
|
704
|
+
)
|
|
692
705
|
]
|
|
693
706
|
}
|
|
694
707
|
);
|
|
695
708
|
}
|
|
696
709
|
function Je({ isOpen: e }) {
|
|
697
710
|
const n = _e();
|
|
698
|
-
return /* @__PURE__ */
|
|
711
|
+
return /* @__PURE__ */ i(
|
|
699
712
|
Ke,
|
|
700
713
|
{
|
|
701
714
|
variant: "no-stage",
|
|
702
715
|
title: "Notifications",
|
|
703
716
|
onClose: () => n?.dispatch({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
704
|
-
children: /* @__PURE__ */
|
|
717
|
+
children: /* @__PURE__ */ i(
|
|
705
718
|
"div",
|
|
706
719
|
{
|
|
707
720
|
"data-shell": "notification-center",
|
|
708
721
|
"data-panel": "notification-center",
|
|
709
722
|
"aria-hidden": !e,
|
|
710
|
-
children: /* @__PURE__ */
|
|
723
|
+
children: /* @__PURE__ */ i("p", { children: "No notifications" })
|
|
711
724
|
}
|
|
712
725
|
)
|
|
713
726
|
}
|
|
@@ -729,8 +742,8 @@ function Ve({ children: e, onClose: n, footer: t, title: r, variant: o = "defaul
|
|
|
729
742
|
style: Ue,
|
|
730
743
|
children: [
|
|
731
744
|
/* @__PURE__ */ N("div", { className: "gloss-panel-chrome__header", children: [
|
|
732
|
-
r != null && /* @__PURE__ */
|
|
733
|
-
/* @__PURE__ */
|
|
745
|
+
r != null && /* @__PURE__ */ i("span", { className: "gloss-panel-chrome__title", children: r }),
|
|
746
|
+
/* @__PURE__ */ i(
|
|
734
747
|
"button",
|
|
735
748
|
{
|
|
736
749
|
id: "panel-close",
|
|
@@ -742,8 +755,8 @@ function Ve({ children: e, onClose: n, footer: t, title: r, variant: o = "defaul
|
|
|
742
755
|
}
|
|
743
756
|
)
|
|
744
757
|
] }),
|
|
745
|
-
/* @__PURE__ */
|
|
746
|
-
t != null && /* @__PURE__ */
|
|
758
|
+
/* @__PURE__ */ i("div", { className: "gloss-panel-chrome__body", children: e }),
|
|
759
|
+
t != null && /* @__PURE__ */ i("div", { className: "gloss-panel-chrome__footer", children: t })
|
|
747
760
|
]
|
|
748
761
|
}
|
|
749
762
|
);
|
|
@@ -760,25 +773,25 @@ function $e(e) {
|
|
|
760
773
|
);
|
|
761
774
|
}
|
|
762
775
|
function ze({ isOpen: e, children: n }) {
|
|
763
|
-
const t = J(), r =
|
|
776
|
+
const t = J(), r = w(null);
|
|
764
777
|
X(() => {
|
|
765
778
|
$e(r.current);
|
|
766
779
|
}, []);
|
|
767
780
|
const [o, a] = H(!1);
|
|
768
|
-
|
|
781
|
+
L(() => {
|
|
769
782
|
if (!e) {
|
|
770
783
|
a(!1);
|
|
771
784
|
return;
|
|
772
785
|
}
|
|
773
|
-
const
|
|
774
|
-
return () => cancelAnimationFrame(
|
|
786
|
+
const s = requestAnimationFrame(() => a(!0));
|
|
787
|
+
return () => cancelAnimationFrame(s);
|
|
775
788
|
}, [e]);
|
|
776
789
|
const c = [
|
|
777
790
|
"gloss-panel-mount",
|
|
778
791
|
o ? "has-panel" : "",
|
|
779
792
|
t ? "reduced-motion" : ""
|
|
780
793
|
].filter(Boolean).join(" ");
|
|
781
|
-
return /* @__PURE__ */
|
|
794
|
+
return /* @__PURE__ */ i(
|
|
782
795
|
"div",
|
|
783
796
|
{
|
|
784
797
|
ref: r,
|
|
@@ -821,7 +834,7 @@ function en({ panelComponents: e }) {
|
|
|
821
834
|
n.activePanelId && !o && process.env.NODE_ENV !== "production" && console.error(
|
|
822
835
|
"[panels] No panel component registered for activePanelId:",
|
|
823
836
|
n.activePanelId
|
|
824
|
-
),
|
|
837
|
+
), L(() => {
|
|
825
838
|
if (n.activePanelId == null) return;
|
|
826
839
|
function p(u) {
|
|
827
840
|
u.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
|
|
@@ -830,10 +843,10 @@ function en({ panelComponents: e }) {
|
|
|
830
843
|
document.removeEventListener("keydown", p);
|
|
831
844
|
};
|
|
832
845
|
}, [n.activePanelId, t]);
|
|
833
|
-
const a =
|
|
846
|
+
const a = w(n);
|
|
834
847
|
X(() => {
|
|
835
848
|
a.current = n;
|
|
836
|
-
}),
|
|
849
|
+
}), L(() => {
|
|
837
850
|
if (process.env.NODE_ENV === "production") return;
|
|
838
851
|
const p = window;
|
|
839
852
|
return p.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), p.__panelsHostHandle = {
|
|
@@ -846,9 +859,9 @@ function en({ panelComponents: e }) {
|
|
|
846
859
|
}, [t, r]);
|
|
847
860
|
const c = O(() => {
|
|
848
861
|
t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
|
|
849
|
-
}, [t]),
|
|
862
|
+
}, [t]), s = n.activePanelId != null && o != null;
|
|
850
863
|
return /* @__PURE__ */ N("div", { "data-panel-host": "true", style: je, children: [
|
|
851
|
-
|
|
864
|
+
s && /* @__PURE__ */ i(
|
|
852
865
|
"div",
|
|
853
866
|
{
|
|
854
867
|
"data-panel-scrim": "true",
|
|
@@ -856,12 +869,12 @@ function en({ panelComponents: e }) {
|
|
|
856
869
|
onClick: c
|
|
857
870
|
}
|
|
858
871
|
),
|
|
859
|
-
/* @__PURE__ */
|
|
872
|
+
/* @__PURE__ */ i(ze, { isOpen: s, children: s && /* @__PURE__ */ i(
|
|
860
873
|
Ve,
|
|
861
874
|
{
|
|
862
875
|
isOpen: !0,
|
|
863
876
|
onClose: () => t({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
864
|
-
children: /* @__PURE__ */
|
|
877
|
+
children: /* @__PURE__ */ i(o, { isOpen: !0 })
|
|
865
878
|
}
|
|
866
879
|
) })
|
|
867
880
|
] });
|
|
@@ -894,7 +907,7 @@ export {
|
|
|
894
907
|
ke as f,
|
|
895
908
|
me as g,
|
|
896
909
|
J as h,
|
|
897
|
-
|
|
910
|
+
Le as i,
|
|
898
911
|
Ke as j,
|
|
899
912
|
ze as k,
|
|
900
913
|
Fe as l,
|