@mt-gloss/ui 0.1.113 → 0.1.114
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-DG0Q_9DU.js → COMMITS-Bzrd0rgy.js} +49 -45
- package/composites-panels.js +512 -444
- package/index.js +2 -2
- package/lib/composites/panels/coordinator/settingsBufferSchemas.d.ts +7 -2
- package/lib/composites/panels/shells/SettingsShell.d.ts +4 -0
- package/lib/composites/panels/shells/settings/ColorControls.d.ts +5 -1
- package/lib/composites/panels/shells/settings/ThresholdControls.d.ts +5 -1
- package/package.json +1 -1
- package/ui.css +1 -1
package/composites-panels.js
CHANGED
|
@@ -1,29 +1,51 @@
|
|
|
1
|
-
import { u as L, f as J, S as
|
|
2
|
-
import { C as
|
|
3
|
-
import { jsx as
|
|
4
|
-
import B, { useState as
|
|
5
|
-
import { useSensors as
|
|
6
|
-
import { sortableKeyboardCoordinates as
|
|
7
|
-
import { CSS as
|
|
1
|
+
import { u as L, f as J, S as ve, a as _e, g as A, c as k } from "./COMMITS-Bzrd0rgy.js";
|
|
2
|
+
import { C as kt, b as Dt, P as Ot, e as Lt, i as It, r as Mt, d as $t } from "./COMMITS-Bzrd0rgy.js";
|
|
3
|
+
import { jsx as a, jsxs as h, Fragment as Z } from "react/jsx-runtime";
|
|
4
|
+
import B, { useState as S, useRef as I, createContext as ee, useContext as te, useMemo as W, useEffect as x, useCallback as P, useLayoutEffect as Ce } from "react";
|
|
5
|
+
import { useSensors as Te, useSensor as G, PointerSensor as Se, KeyboardSensor as Ne, DndContext as we, closestCenter as Ee } from "@dnd-kit/core";
|
|
6
|
+
import { sortableKeyboardCoordinates as Pe, SortableContext as xe, horizontalListSortingStrategy as Ae, arrayMove as ke, useSortable as De } from "@dnd-kit/sortable";
|
|
7
|
+
import { CSS as Oe } from "@dnd-kit/utilities";
|
|
8
8
|
import { M as Q } from "./MetricCard-Cyoxhb_S.js";
|
|
9
|
-
function
|
|
9
|
+
function vt() {
|
|
10
10
|
const e = L();
|
|
11
11
|
if (e?.state.activePanelId !== "settings") return null;
|
|
12
12
|
const t = e.state.activeTrigger;
|
|
13
13
|
return t?.kind === "card-overflow" ? t.cardId : null;
|
|
14
14
|
}
|
|
15
|
-
function
|
|
16
|
-
return /* @__PURE__ */
|
|
15
|
+
function Le({ children: e }) {
|
|
16
|
+
return /* @__PURE__ */ a("div", { className: "clone-stage", children: e });
|
|
17
17
|
}
|
|
18
|
-
function
|
|
19
|
-
const
|
|
20
|
-
return /* @__PURE__ */
|
|
18
|
+
function Ie({ span: e, rotating: t = !0, children: r }) {
|
|
19
|
+
const c = ["clone-card", `span-${e}`, t ? "rotating" : ""].filter(Boolean).join(" "), n = r != null ? "full" : "fallback";
|
|
20
|
+
return /* @__PURE__ */ a("div", { className: c, "data-clone-fidelity": n, children: r });
|
|
21
21
|
}
|
|
22
|
-
function
|
|
22
|
+
function Me({
|
|
23
|
+
value: e,
|
|
24
|
+
onChange: t,
|
|
25
|
+
enabled: r = !1,
|
|
26
|
+
onToggleEnabled: c
|
|
27
|
+
}) {
|
|
28
|
+
const n = "settings-threshold-enabled";
|
|
23
29
|
return /* @__PURE__ */ h("div", { className: "settings-shell__field settings-shell__field--threshold", children: [
|
|
24
|
-
/* @__PURE__ */
|
|
25
|
-
|
|
26
|
-
/* @__PURE__ */
|
|
30
|
+
/* @__PURE__ */ h("div", { className: "settings-shell__toggle-row", children: [
|
|
31
|
+
/* @__PURE__ */ a("label", { htmlFor: n, className: "settings-shell__toggle-label", children: "Show threshold indicator" }),
|
|
32
|
+
/* @__PURE__ */ a(
|
|
33
|
+
"input",
|
|
34
|
+
{
|
|
35
|
+
id: n,
|
|
36
|
+
type: "checkbox",
|
|
37
|
+
role: "switch",
|
|
38
|
+
"aria-label": "Enable threshold indicator",
|
|
39
|
+
"aria-checked": r,
|
|
40
|
+
checked: r,
|
|
41
|
+
onChange: (o) => c?.(o.target.checked),
|
|
42
|
+
className: "settings-shell__toggle"
|
|
43
|
+
}
|
|
44
|
+
)
|
|
45
|
+
] }),
|
|
46
|
+
/* @__PURE__ */ a("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Alert level (%)" }),
|
|
47
|
+
/* @__PURE__ */ h("div", { className: "settings-shell__slider-row", "aria-disabled": !r, children: [
|
|
48
|
+
/* @__PURE__ */ a(
|
|
27
49
|
"input",
|
|
28
50
|
{
|
|
29
51
|
id: "settings-threshold-input",
|
|
@@ -36,6 +58,7 @@ function De({ value: e, onChange: t }) {
|
|
|
36
58
|
"aria-valuenow": e,
|
|
37
59
|
"aria-valuemin": 0,
|
|
38
60
|
"aria-valuemax": 100,
|
|
61
|
+
disabled: !r,
|
|
39
62
|
className: "settings-shell__slider"
|
|
40
63
|
}
|
|
41
64
|
),
|
|
@@ -43,14 +66,15 @@ function De({ value: e, onChange: t }) {
|
|
|
43
66
|
e,
|
|
44
67
|
"%"
|
|
45
68
|
] })
|
|
46
|
-
] })
|
|
69
|
+
] }),
|
|
70
|
+
!r && /* @__PURE__ */ a("p", { className: "settings-shell__help", "aria-live": "polite", children: "Off — the card uses its default styling. Turn on to tint values below the threshold." })
|
|
47
71
|
] });
|
|
48
72
|
}
|
|
49
|
-
function
|
|
73
|
+
function $e({ value: e, onChange: t }) {
|
|
50
74
|
return /* @__PURE__ */ h("div", { className: "settings-shell__field settings-shell__field--timeframe", children: [
|
|
51
|
-
/* @__PURE__ */
|
|
75
|
+
/* @__PURE__ */ a("span", { className: "settings-shell__label", "aria-hidden": "true", children: "Rolling period (days)" }),
|
|
52
76
|
/* @__PURE__ */ h("div", { className: "settings-shell__slider-row", children: [
|
|
53
|
-
/* @__PURE__ */
|
|
77
|
+
/* @__PURE__ */ a(
|
|
54
78
|
"input",
|
|
55
79
|
{
|
|
56
80
|
id: "settings-timeframe-input",
|
|
@@ -73,32 +97,32 @@ function Oe({ value: e, onChange: t }) {
|
|
|
73
97
|
] })
|
|
74
98
|
] });
|
|
75
99
|
}
|
|
76
|
-
function
|
|
77
|
-
const { attributes:
|
|
78
|
-
transform:
|
|
100
|
+
function Re({ id: e, onRemove: t }) {
|
|
101
|
+
const { attributes: r, listeners: c, setNodeRef: n, transform: o, transition: u, isDragging: l } = De({ id: e }), s = {
|
|
102
|
+
transform: Oe.Transform.toString(o),
|
|
79
103
|
transition: u,
|
|
80
|
-
opacity:
|
|
104
|
+
opacity: l ? 0.6 : 1
|
|
81
105
|
};
|
|
82
106
|
return /* @__PURE__ */ h(
|
|
83
107
|
"li",
|
|
84
108
|
{
|
|
85
109
|
ref: n,
|
|
86
|
-
style:
|
|
87
|
-
className: `settings-shell__slot-pill${
|
|
110
|
+
style: s,
|
|
111
|
+
className: `settings-shell__slot-pill${l ? " settings-shell__slot-pill--dragging" : ""}`,
|
|
88
112
|
children: [
|
|
89
|
-
/* @__PURE__ */
|
|
113
|
+
/* @__PURE__ */ a(
|
|
90
114
|
"button",
|
|
91
115
|
{
|
|
92
116
|
type: "button",
|
|
93
117
|
className: "settings-shell__slot-pill__handle",
|
|
94
118
|
"aria-label": `Reorder ${e}`,
|
|
95
|
-
...
|
|
96
|
-
...
|
|
97
|
-
children: /* @__PURE__ */
|
|
119
|
+
...r,
|
|
120
|
+
...c,
|
|
121
|
+
children: /* @__PURE__ */ a("span", { "aria-hidden": "true", className: "settings-shell__slot-pill__grip", children: "⋮⋮" })
|
|
98
122
|
}
|
|
99
123
|
),
|
|
100
|
-
/* @__PURE__ */
|
|
101
|
-
/* @__PURE__ */
|
|
124
|
+
/* @__PURE__ */ a("span", { className: "settings-shell__slot-pill__label", children: e }),
|
|
125
|
+
/* @__PURE__ */ a(
|
|
102
126
|
"button",
|
|
103
127
|
{
|
|
104
128
|
type: "button",
|
|
@@ -112,81 +136,109 @@ function Le({ id: e, onRemove: t }) {
|
|
|
112
136
|
}
|
|
113
137
|
);
|
|
114
138
|
}
|
|
115
|
-
function
|
|
116
|
-
const
|
|
117
|
-
G(
|
|
118
|
-
G(
|
|
119
|
-
),
|
|
120
|
-
const { active: u, over:
|
|
121
|
-
if (!
|
|
122
|
-
const
|
|
123
|
-
|
|
124
|
-
}, n = (
|
|
125
|
-
t(e.filter((u) => u !==
|
|
139
|
+
function Fe({ value: e, onChange: t }) {
|
|
140
|
+
const r = Te(
|
|
141
|
+
G(Se, { activationConstraint: { distance: 4 } }),
|
|
142
|
+
G(Ne, { coordinateGetter: Pe })
|
|
143
|
+
), c = (o) => {
|
|
144
|
+
const { active: u, over: l } = o;
|
|
145
|
+
if (!l || u.id === l.id) return;
|
|
146
|
+
const s = e.findIndex((d) => d === u.id), i = e.findIndex((d) => d === l.id);
|
|
147
|
+
s === -1 || i === -1 || t(ke([...e], s, i));
|
|
148
|
+
}, n = (o) => {
|
|
149
|
+
t(e.filter((u) => u !== o));
|
|
126
150
|
};
|
|
127
151
|
return /* @__PURE__ */ h("div", { className: "settings-shell__field settings-shell__field--slots", "aria-label": "Stack slots", children: [
|
|
128
|
-
/* @__PURE__ */
|
|
129
|
-
/* @__PURE__ */
|
|
130
|
-
e.length === 0 && /* @__PURE__ */
|
|
131
|
-
/* @__PURE__ */
|
|
152
|
+
/* @__PURE__ */ a("span", { className: "settings-shell__label", children: "Stack slots" }),
|
|
153
|
+
/* @__PURE__ */ a(we, { sensors: r, collisionDetection: Ee, onDragEnd: c, children: /* @__PURE__ */ a(xe, { items: [...e], strategy: Ae, children: /* @__PURE__ */ a("ul", { className: "settings-shell__slots-list", role: "list", children: e.map((o) => /* @__PURE__ */ a(Re, { id: o, onRemove: () => n(o) }, o)) }) }) }),
|
|
154
|
+
e.length === 0 && /* @__PURE__ */ a("p", { className: "settings-shell__help", children: "All slots removed. Apply to commit, or Reset to restore." }),
|
|
155
|
+
/* @__PURE__ */ a("p", { className: "settings-shell__help settings-shell__help--small", children: "Drag to reorder · click × to remove" })
|
|
132
156
|
] });
|
|
133
157
|
}
|
|
134
|
-
const
|
|
135
|
-
function
|
|
158
|
+
const Ue = ["#1d6fd8", "#10b981", "#f59e0b", "#ef4444", "#8b5cf6"];
|
|
159
|
+
function Ve({
|
|
160
|
+
value: e,
|
|
161
|
+
onSelect: t,
|
|
162
|
+
enabled: r = !1,
|
|
163
|
+
onToggleEnabled: c
|
|
164
|
+
}) {
|
|
165
|
+
const n = "settings-accent-enabled";
|
|
136
166
|
return /* @__PURE__ */ h("div", { className: "settings-shell__field settings-shell__field--color", role: "group", "aria-label": "Accent color", children: [
|
|
137
|
-
/* @__PURE__ */
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
167
|
+
/* @__PURE__ */ h("div", { className: "settings-shell__toggle-row", children: [
|
|
168
|
+
/* @__PURE__ */ a("label", { htmlFor: n, className: "settings-shell__toggle-label", children: "Override default accent" }),
|
|
169
|
+
/* @__PURE__ */ a(
|
|
170
|
+
"input",
|
|
171
|
+
{
|
|
172
|
+
id: n,
|
|
173
|
+
type: "checkbox",
|
|
174
|
+
role: "switch",
|
|
175
|
+
"aria-label": "Enable accent override",
|
|
176
|
+
"aria-checked": r,
|
|
177
|
+
checked: r,
|
|
178
|
+
onChange: (o) => c?.(o.target.checked),
|
|
179
|
+
className: "settings-shell__toggle"
|
|
180
|
+
}
|
|
181
|
+
)
|
|
182
|
+
] }),
|
|
183
|
+
/* @__PURE__ */ a("span", { className: "settings-shell__label", children: "Accent color" }),
|
|
184
|
+
/* @__PURE__ */ a("div", { className: "settings-shell__swatch-row", "aria-disabled": !r, children: Ue.map((o) => {
|
|
185
|
+
const u = e === o;
|
|
186
|
+
return /* @__PURE__ */ a(
|
|
141
187
|
"button",
|
|
142
188
|
{
|
|
143
189
|
type: "button",
|
|
144
|
-
"aria-pressed":
|
|
145
|
-
"aria-label": `Accent ${
|
|
146
|
-
className: `settings-shell__swatch${
|
|
147
|
-
style: { backgroundColor:
|
|
148
|
-
|
|
190
|
+
"aria-pressed": u,
|
|
191
|
+
"aria-label": `Accent ${o}`,
|
|
192
|
+
className: `settings-shell__swatch${u ? " settings-shell__swatch--active" : ""}`,
|
|
193
|
+
style: { backgroundColor: o },
|
|
194
|
+
disabled: !r,
|
|
195
|
+
onClick: () => t(o)
|
|
149
196
|
},
|
|
150
|
-
|
|
197
|
+
o
|
|
151
198
|
);
|
|
152
|
-
}) })
|
|
199
|
+
}) }),
|
|
200
|
+
!r && /* @__PURE__ */ a("p", { className: "settings-shell__help", "aria-live": "polite", children: "Off — the card uses its default accent. Turn on to override." })
|
|
153
201
|
] });
|
|
154
202
|
}
|
|
155
|
-
const
|
|
156
|
-
function
|
|
203
|
+
const He = ["Orders", "Quota", "Unassigned"], ze = ["threshold", "timeframe", "color"];
|
|
204
|
+
function _t({
|
|
157
205
|
isOpen: e,
|
|
158
206
|
cardSpan: t,
|
|
159
|
-
cardLabel:
|
|
160
|
-
cardValue:
|
|
207
|
+
cardLabel: r = "Metric",
|
|
208
|
+
cardValue: c = "—",
|
|
161
209
|
previewSlot: n,
|
|
162
|
-
dimensions:
|
|
210
|
+
dimensions: o = ze,
|
|
163
211
|
initialTab: u,
|
|
164
|
-
initialValues:
|
|
212
|
+
initialValues: l
|
|
165
213
|
}) {
|
|
166
|
-
const
|
|
214
|
+
const s = L(), i = s?.state.activeTrigger, d = i?.kind === "card-overflow" ? i.cardId : null, p = J(), m = i?.span, f = t ?? m ?? 1, _ = o[0] ?? "threshold", [b, C] = B.useState(u ?? _);
|
|
167
215
|
B.useEffect(() => {
|
|
168
|
-
|
|
169
|
-
}, [
|
|
170
|
-
const
|
|
171
|
-
d == null ||
|
|
172
|
-
},
|
|
173
|
-
d == null ||
|
|
174
|
-
},
|
|
175
|
-
d == null ||
|
|
176
|
-
},
|
|
177
|
-
d == null ||
|
|
216
|
+
o.includes(b) || C(_);
|
|
217
|
+
}, [o, b, _]);
|
|
218
|
+
const y = d != null ? s?.state?.bufferByCard?.[d]?.changes ?? {} : {}, v = typeof y.threshold == "number" ? y.threshold : typeof l?.threshold == "number" ? l.threshold : 80, E = typeof y.timeframe == "number" ? y.timeframe : typeof l?.timeframe == "number" ? l.timeframe : 30, ce = typeof y.accent == "string" ? y.accent : typeof l?.accent == "string" ? l.accent : null, de = Array.isArray(y.slots) ? y.slots : Array.isArray(l?.slots) ? l.slots : He, ue = typeof y.thresholdEnabled == "boolean" ? y.thresholdEnabled : typeof l?.thresholdEnabled == "boolean" ? l.thresholdEnabled : !1, pe = typeof y.accentEnabled == "boolean" ? y.accentEnabled : typeof l?.accentEnabled == "boolean" ? l.accentEnabled : !1, me = (T) => {
|
|
219
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "threshold", value: Number(T.target.value) });
|
|
220
|
+
}, he = (T) => {
|
|
221
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "timeframe", value: Number(T.target.value) });
|
|
222
|
+
}, fe = (T) => {
|
|
223
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accent", value: T });
|
|
224
|
+
}, ge = (T) => {
|
|
225
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "slots", value: T });
|
|
226
|
+
}, be = (T) => {
|
|
227
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "thresholdEnabled", value: T });
|
|
228
|
+
}, ye = (T) => {
|
|
229
|
+
d == null || s == null || s.dispatch({ type: "SET_BUFFER_VALUE", cardId: d, key: "accentEnabled", value: T });
|
|
178
230
|
};
|
|
179
231
|
return /* @__PURE__ */ h("div", { className: "settings-shell", "data-shell": "settings", "aria-hidden": !e, children: [
|
|
180
|
-
/* @__PURE__ */
|
|
181
|
-
/* @__PURE__ */
|
|
182
|
-
/* @__PURE__ */
|
|
232
|
+
/* @__PURE__ */ a("div", { "aria-hidden": "true", children: /* @__PURE__ */ a(Le, { children: /* @__PURE__ */ a(Ie, { span: f, rotating: !p, children: n ?? /* @__PURE__ */ h(Z, { children: [
|
|
233
|
+
/* @__PURE__ */ a("div", { style: { fontSize: 9, textTransform: "uppercase", letterSpacing: "0.06em", color: "#9ca3af", marginBottom: 6 }, children: r }),
|
|
234
|
+
/* @__PURE__ */ a("div", { style: { fontSize: 22, fontWeight: 700, color: "#111827", lineHeight: 1 }, children: c })
|
|
183
235
|
] }) }) }) }),
|
|
184
|
-
/* @__PURE__ */
|
|
185
|
-
|
|
236
|
+
/* @__PURE__ */ a(
|
|
237
|
+
ve,
|
|
186
238
|
{
|
|
187
|
-
dimensions:
|
|
239
|
+
dimensions: o,
|
|
188
240
|
activeTab: b,
|
|
189
|
-
onSelect:
|
|
241
|
+
onSelect: C,
|
|
190
242
|
reduced: p
|
|
191
243
|
}
|
|
192
244
|
),
|
|
@@ -199,10 +251,26 @@ function gt({
|
|
|
199
251
|
tabIndex: 0,
|
|
200
252
|
className: "settings-shell__tabpanel",
|
|
201
253
|
children: [
|
|
202
|
-
b === "threshold" && /* @__PURE__ */
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
254
|
+
b === "threshold" && /* @__PURE__ */ a(
|
|
255
|
+
Me,
|
|
256
|
+
{
|
|
257
|
+
value: v,
|
|
258
|
+
onChange: me,
|
|
259
|
+
enabled: ue,
|
|
260
|
+
onToggleEnabled: be
|
|
261
|
+
}
|
|
262
|
+
),
|
|
263
|
+
b === "timeframe" && /* @__PURE__ */ a($e, { value: E, onChange: he }),
|
|
264
|
+
b === "slots" && /* @__PURE__ */ a(Fe, { value: de, onChange: ge }),
|
|
265
|
+
b === "color" && /* @__PURE__ */ a(
|
|
266
|
+
Ve,
|
|
267
|
+
{
|
|
268
|
+
value: ce,
|
|
269
|
+
onSelect: fe,
|
|
270
|
+
enabled: pe,
|
|
271
|
+
onToggleEnabled: ye
|
|
272
|
+
}
|
|
273
|
+
)
|
|
206
274
|
]
|
|
207
275
|
}
|
|
208
276
|
)
|
|
@@ -715,44 +783,44 @@ const se = {
|
|
|
715
783
|
function re({
|
|
716
784
|
lenses: e,
|
|
717
785
|
activeLens: t,
|
|
718
|
-
onLensChange:
|
|
719
|
-
variant:
|
|
786
|
+
onLensChange: r,
|
|
787
|
+
variant: c = "pills",
|
|
720
788
|
lensMeta: n = z
|
|
721
789
|
}) {
|
|
722
|
-
return
|
|
723
|
-
const u =
|
|
724
|
-
return u &&
|
|
790
|
+
return c === "pills" ? /* @__PURE__ */ a("div", { className: "cat-pills-wrap", children: /* @__PURE__ */ a("div", { className: "cat-pills", role: "tablist", "aria-label": "Metric lenses", children: e.map((o) => {
|
|
791
|
+
const u = o === t, l = n[o], s = ["cat-pill"];
|
|
792
|
+
return u && s.push("active"), /* @__PURE__ */ h(
|
|
725
793
|
"button",
|
|
726
794
|
{
|
|
727
795
|
type: "button",
|
|
728
796
|
role: "tab",
|
|
729
797
|
"aria-selected": u,
|
|
730
|
-
className:
|
|
731
|
-
"data-lens":
|
|
798
|
+
className: s.join(" "),
|
|
799
|
+
"data-lens": o,
|
|
732
800
|
onClick: () => {
|
|
733
|
-
u ||
|
|
801
|
+
u || r(o);
|
|
734
802
|
},
|
|
735
803
|
children: [
|
|
736
|
-
|
|
737
|
-
|
|
804
|
+
o,
|
|
805
|
+
l?.beta && /* @__PURE__ */ a("span", { className: "cat-pill-beta", "aria-label": "Beta", children: "BETA" })
|
|
738
806
|
]
|
|
739
807
|
},
|
|
740
|
-
|
|
808
|
+
o
|
|
741
809
|
);
|
|
742
|
-
}) }) }) : /* @__PURE__ */
|
|
810
|
+
}) }) }) : /* @__PURE__ */ a(Ye, { lenses: e, activeLens: t, onLensChange: r });
|
|
743
811
|
}
|
|
744
|
-
function
|
|
812
|
+
function Ye({
|
|
745
813
|
lenses: e,
|
|
746
814
|
activeLens: t,
|
|
747
|
-
onLensChange:
|
|
815
|
+
onLensChange: r
|
|
748
816
|
}) {
|
|
749
|
-
const [
|
|
750
|
-
|
|
751
|
-
},
|
|
752
|
-
u(),
|
|
753
|
-
},
|
|
754
|
-
return /* @__PURE__ */
|
|
755
|
-
/* @__PURE__ */
|
|
817
|
+
const [c, n] = S(!1), o = I(null), u = () => {
|
|
818
|
+
o.current != null && (window.clearTimeout(o.current), o.current = null);
|
|
819
|
+
}, l = () => {
|
|
820
|
+
u(), o.current = window.setTimeout(() => n(!1), 100);
|
|
821
|
+
}, s = e.filter((i) => i !== t);
|
|
822
|
+
return /* @__PURE__ */ a("div", { className: "cat-segmented-wrap", children: /* @__PURE__ */ h("div", { className: "cat-segmented", children: [
|
|
823
|
+
/* @__PURE__ */ a(
|
|
756
824
|
"button",
|
|
757
825
|
{
|
|
758
826
|
type: "button",
|
|
@@ -769,28 +837,28 @@ function Ue({
|
|
|
769
837
|
onMouseEnter: () => {
|
|
770
838
|
u(), n(!0);
|
|
771
839
|
},
|
|
772
|
-
onMouseLeave:
|
|
840
|
+
onMouseLeave: l,
|
|
773
841
|
children: [
|
|
774
|
-
/* @__PURE__ */
|
|
775
|
-
|
|
842
|
+
/* @__PURE__ */ a("button", { type: "button", className: "cat-seg cat-seg-more-btn", "aria-haspopup": "menu", "aria-expanded": c, children: "More ▾" }),
|
|
843
|
+
c && /* @__PURE__ */ a(
|
|
776
844
|
"div",
|
|
777
845
|
{
|
|
778
846
|
className: "cat-seg-overflow",
|
|
779
847
|
role: "menu",
|
|
780
848
|
onMouseEnter: u,
|
|
781
|
-
onMouseLeave:
|
|
782
|
-
children:
|
|
849
|
+
onMouseLeave: l,
|
|
850
|
+
children: s.map((i) => /* @__PURE__ */ a(
|
|
783
851
|
"button",
|
|
784
852
|
{
|
|
785
853
|
type: "button",
|
|
786
|
-
"data-lens":
|
|
854
|
+
"data-lens": i,
|
|
787
855
|
role: "menuitem",
|
|
788
856
|
onClick: () => {
|
|
789
|
-
|
|
857
|
+
r(i), n(!1);
|
|
790
858
|
},
|
|
791
|
-
children:
|
|
859
|
+
children: i
|
|
792
860
|
},
|
|
793
|
-
|
|
861
|
+
i
|
|
794
862
|
))
|
|
795
863
|
}
|
|
796
864
|
)
|
|
@@ -799,14 +867,14 @@ function Ue({
|
|
|
799
867
|
)
|
|
800
868
|
] }) });
|
|
801
869
|
}
|
|
802
|
-
function V({ tiles: e, selectedTileId: t, onSelectTile:
|
|
803
|
-
return /* @__PURE__ */
|
|
804
|
-
const
|
|
805
|
-
let
|
|
806
|
-
u ? n.subStats.length === 5 ?
|
|
807
|
-
const
|
|
808
|
-
|
|
809
|
-
const
|
|
870
|
+
function V({ tiles: e, selectedTileId: t, onSelectTile: r, renderTile: c }) {
|
|
871
|
+
return /* @__PURE__ */ a("div", { className: "cat-tiles", children: e.map((n) => {
|
|
872
|
+
const o = n.id === t, u = n.subStats != null && n.subStats.length > 0;
|
|
873
|
+
let l = null;
|
|
874
|
+
u ? n.subStats.length === 5 ? l = "span-5" : n.subStats.length === 3 ? l = "span-3" : l = "span-2" : n.stack === !0 && (l = "span-2");
|
|
875
|
+
const s = ["cat-tile"];
|
|
876
|
+
l && s.push(l), o && s.push("selected"), n.isNew && s.push("is-new"), n.startHere && s.push("start-here"), n.donut && s.push("has-donut");
|
|
877
|
+
const i = 1;
|
|
810
878
|
let d = 0.7;
|
|
811
879
|
if (n.donut) {
|
|
812
880
|
const p = /([\d.]+)\s*%/.exec(n.value);
|
|
@@ -819,25 +887,25 @@ function V({ tiles: e, selectedTileId: t, onSelectTile: l, renderTile: i }) {
|
|
|
819
887
|
"button",
|
|
820
888
|
{
|
|
821
889
|
type: "button",
|
|
822
|
-
className:
|
|
890
|
+
className: s.join(" "),
|
|
823
891
|
"data-metric": n.id,
|
|
824
892
|
"data-desc": n.desc,
|
|
825
|
-
"data-col-span": String(
|
|
893
|
+
"data-col-span": String(i),
|
|
826
894
|
"data-donut": n.donut ? "true" : void 0,
|
|
827
895
|
"data-accent": n.accent,
|
|
828
|
-
"aria-pressed":
|
|
829
|
-
onClick: () =>
|
|
896
|
+
"aria-pressed": o,
|
|
897
|
+
onClick: () => r(n.id, n.desc),
|
|
830
898
|
style: n.accent ? { "--cat-tile-accent": n.accent } : void 0,
|
|
831
899
|
children: [
|
|
832
|
-
n.startHere && /* @__PURE__ */
|
|
833
|
-
|
|
900
|
+
n.startHere && /* @__PURE__ */ a("span", { className: "cat-tile-start-here", "aria-hidden": "true", children: "START HERE" }),
|
|
901
|
+
c ? c(n) : /* @__PURE__ */ a(
|
|
834
902
|
"div",
|
|
835
903
|
{
|
|
836
904
|
className: "cat-tile-primitive-wrapper gloss-metric-card",
|
|
837
905
|
"data-col-span": "1",
|
|
838
906
|
style: { pointerEvents: "none", width: "100%", height: "100%" },
|
|
839
907
|
"aria-hidden": "true",
|
|
840
|
-
children: n.donut ? /* @__PURE__ */
|
|
908
|
+
children: n.donut ? /* @__PURE__ */ a(
|
|
841
909
|
Q,
|
|
842
910
|
{
|
|
843
911
|
variant: "donut",
|
|
@@ -846,21 +914,21 @@ function V({ tiles: e, selectedTileId: t, onSelectTile: l, renderTile: i }) {
|
|
|
846
914
|
donutValue: d,
|
|
847
915
|
donutMax: 1,
|
|
848
916
|
accentColor: n.accent,
|
|
849
|
-
colSpan:
|
|
917
|
+
colSpan: i
|
|
850
918
|
}
|
|
851
|
-
) : /* @__PURE__ */
|
|
919
|
+
) : /* @__PURE__ */ a(
|
|
852
920
|
Q,
|
|
853
921
|
{
|
|
854
922
|
variant: "standard",
|
|
855
923
|
label: n.label,
|
|
856
924
|
value: n.value,
|
|
857
|
-
colSpan:
|
|
925
|
+
colSpan: i
|
|
858
926
|
}
|
|
859
927
|
)
|
|
860
928
|
}
|
|
861
929
|
),
|
|
862
|
-
n.variants && n.variants.length > 0 && /* @__PURE__ */
|
|
863
|
-
n.isNew && /* @__PURE__ */
|
|
930
|
+
n.variants && n.variants.length > 0 && /* @__PURE__ */ a("span", { className: "cat-tile-variants", "aria-hidden": "true", children: n.variants.map((p) => /* @__PURE__ */ a("span", { children: p }, p)) }),
|
|
931
|
+
n.isNew && /* @__PURE__ */ a("span", { className: "cat-tile-new-dot", "aria-hidden": "true" })
|
|
864
932
|
]
|
|
865
933
|
},
|
|
866
934
|
n.id
|
|
@@ -868,18 +936,18 @@ function V({ tiles: e, selectedTileId: t, onSelectTile: l, renderTile: i }) {
|
|
|
868
936
|
}) });
|
|
869
937
|
}
|
|
870
938
|
const Y = ee(null);
|
|
871
|
-
function
|
|
939
|
+
function Ke() {
|
|
872
940
|
return te(Y);
|
|
873
941
|
}
|
|
874
|
-
function
|
|
875
|
-
const
|
|
876
|
-
if (
|
|
877
|
-
const
|
|
942
|
+
function Be({ mode: e, dispatch: t }) {
|
|
943
|
+
const r = Ke();
|
|
944
|
+
if (r == null && e == null) return null;
|
|
945
|
+
const c = r?.mode ?? e ?? "add", n = r?.selectedTileId ?? null, o = r?.description ?? null, u = n == null;
|
|
878
946
|
return /* @__PURE__ */ h("div", { className: "panel-footer catalog", children: [
|
|
879
|
-
/* @__PURE__ */
|
|
947
|
+
/* @__PURE__ */ a("div", { className: "cat-description", id: "cat-desc", children: o ?? /* @__PURE__ */ a("em", { children: "Tap a metric to see its description" }) }),
|
|
880
948
|
/* @__PURE__ */ h("div", { style: { display: "flex", padding: "10px 14px", gap: 8 }, children: [
|
|
881
|
-
/* @__PURE__ */
|
|
882
|
-
/* @__PURE__ */
|
|
949
|
+
/* @__PURE__ */ a("div", { className: "spacer", style: { flex: 1 } }),
|
|
950
|
+
/* @__PURE__ */ a(
|
|
883
951
|
"button",
|
|
884
952
|
{
|
|
885
953
|
id: "btn-cat-cancel",
|
|
@@ -889,7 +957,7 @@ function He({ mode: e, dispatch: t }) {
|
|
|
889
957
|
children: "Cancel"
|
|
890
958
|
}
|
|
891
959
|
),
|
|
892
|
-
|
|
960
|
+
c === "add" && /* @__PURE__ */ a(
|
|
893
961
|
"button",
|
|
894
962
|
{
|
|
895
963
|
id: "btn-cat-add",
|
|
@@ -900,7 +968,7 @@ function He({ mode: e, dispatch: t }) {
|
|
|
900
968
|
children: "Add metric"
|
|
901
969
|
}
|
|
902
970
|
),
|
|
903
|
-
|
|
971
|
+
c === "replace" && /* @__PURE__ */ a(
|
|
904
972
|
"button",
|
|
905
973
|
{
|
|
906
974
|
id: "btn-cat-replace",
|
|
@@ -916,37 +984,37 @@ function He({ mode: e, dispatch: t }) {
|
|
|
916
984
|
}
|
|
917
985
|
function q(e, t) {
|
|
918
986
|
if (t.length === 0) return !0;
|
|
919
|
-
const
|
|
920
|
-
if (e.label.toLowerCase().includes(
|
|
987
|
+
const r = t.toLowerCase();
|
|
988
|
+
if (e.label.toLowerCase().includes(r) || e.value.toLowerCase().includes(r)) return !0;
|
|
921
989
|
if (e.subStats) {
|
|
922
|
-
for (const
|
|
923
|
-
if (
|
|
990
|
+
for (const c of e.subStats)
|
|
991
|
+
if (c.label.toLowerCase().includes(r) || c.value.toLowerCase().includes(r)) return !0;
|
|
924
992
|
}
|
|
925
993
|
return !1;
|
|
926
994
|
}
|
|
927
|
-
function
|
|
995
|
+
function Ct({
|
|
928
996
|
isOpen: e,
|
|
929
997
|
lenses: t = ne,
|
|
930
|
-
defaultLens:
|
|
931
|
-
tilesByLens:
|
|
998
|
+
defaultLens: r = ae,
|
|
999
|
+
tilesByLens: c = se,
|
|
932
1000
|
lensMeta: n = z,
|
|
933
|
-
footerSlot:
|
|
1001
|
+
footerSlot: o,
|
|
934
1002
|
renderTile: u
|
|
935
1003
|
}) {
|
|
936
|
-
const [
|
|
937
|
-
() => b.primary.filter((
|
|
1004
|
+
const [l, s] = S(r), [i, d] = S(null), [p, m] = S(null), [f, _] = S(""), b = c[l] ?? { primary: [] }, C = n[l], N = W(
|
|
1005
|
+
() => b.primary.filter((v) => q(v, f)),
|
|
938
1006
|
[b.primary, f]
|
|
939
|
-
),
|
|
940
|
-
() => (b.secondary ?? []).filter((
|
|
1007
|
+
), y = W(
|
|
1008
|
+
() => (b.secondary ?? []).filter((v) => q(v, f)),
|
|
941
1009
|
[b.secondary, f]
|
|
942
1010
|
);
|
|
943
1011
|
return /* @__PURE__ */ h(
|
|
944
1012
|
Y.Provider,
|
|
945
1013
|
{
|
|
946
|
-
value: { mode: "add", selectedTileId:
|
|
1014
|
+
value: { mode: "add", selectedTileId: i, description: p },
|
|
947
1015
|
children: [
|
|
948
1016
|
/* @__PURE__ */ h("div", { "data-shell": "catalog-add", "aria-hidden": !e, children: [
|
|
949
|
-
/* @__PURE__ */
|
|
1017
|
+
/* @__PURE__ */ a("div", { className: "cat-search", children: /* @__PURE__ */ a(
|
|
950
1018
|
"input",
|
|
951
1019
|
{
|
|
952
1020
|
type: "search",
|
|
@@ -954,104 +1022,104 @@ function bt({
|
|
|
954
1022
|
placeholder: "Search metrics",
|
|
955
1023
|
"aria-label": "Search metrics",
|
|
956
1024
|
value: f,
|
|
957
|
-
onChange: (
|
|
1025
|
+
onChange: (v) => _(v.target.value)
|
|
958
1026
|
}
|
|
959
1027
|
) }),
|
|
960
|
-
/* @__PURE__ */
|
|
1028
|
+
/* @__PURE__ */ a(
|
|
961
1029
|
re,
|
|
962
1030
|
{
|
|
963
1031
|
lenses: t,
|
|
964
|
-
activeLens:
|
|
1032
|
+
activeLens: l,
|
|
965
1033
|
lensMeta: n,
|
|
966
1034
|
variant: "pills",
|
|
967
|
-
onLensChange: (
|
|
968
|
-
|
|
1035
|
+
onLensChange: (v) => {
|
|
1036
|
+
s(v), d(null), m(null), _("");
|
|
969
1037
|
}
|
|
970
1038
|
}
|
|
971
1039
|
),
|
|
972
|
-
|
|
973
|
-
/* @__PURE__ */
|
|
974
|
-
/* @__PURE__ */
|
|
1040
|
+
C && /* @__PURE__ */ h("div", { className: "cat-lens-meta", children: [
|
|
1041
|
+
/* @__PURE__ */ a("h3", { className: "cat-lens-headline", children: C.headline }),
|
|
1042
|
+
/* @__PURE__ */ a("p", { className: "cat-lens-helper", children: C.helper })
|
|
975
1043
|
] }),
|
|
976
|
-
/* @__PURE__ */
|
|
1044
|
+
/* @__PURE__ */ a(
|
|
977
1045
|
V,
|
|
978
1046
|
{
|
|
979
|
-
tiles:
|
|
980
|
-
selectedTileId:
|
|
981
|
-
onSelectTile: (
|
|
982
|
-
d(
|
|
1047
|
+
tiles: N,
|
|
1048
|
+
selectedTileId: i,
|
|
1049
|
+
onSelectTile: (v, E) => {
|
|
1050
|
+
d(v), m(E);
|
|
983
1051
|
},
|
|
984
1052
|
renderTile: u
|
|
985
1053
|
}
|
|
986
1054
|
),
|
|
987
|
-
|
|
988
|
-
/* @__PURE__ */
|
|
989
|
-
/* @__PURE__ */
|
|
1055
|
+
y.length > 0 && /* @__PURE__ */ h("div", { className: "cat-more-in-lens", children: [
|
|
1056
|
+
/* @__PURE__ */ a("div", { className: "cat-more-in-lens__heading", children: "MORE IN THIS LENS" }),
|
|
1057
|
+
/* @__PURE__ */ a(
|
|
990
1058
|
V,
|
|
991
1059
|
{
|
|
992
|
-
tiles:
|
|
993
|
-
selectedTileId:
|
|
994
|
-
onSelectTile: (
|
|
995
|
-
d(
|
|
1060
|
+
tiles: y,
|
|
1061
|
+
selectedTileId: i,
|
|
1062
|
+
onSelectTile: (v, E) => {
|
|
1063
|
+
d(v), m(E);
|
|
996
1064
|
},
|
|
997
1065
|
renderTile: u
|
|
998
1066
|
}
|
|
999
1067
|
)
|
|
1000
1068
|
] }),
|
|
1001
|
-
|
|
1069
|
+
N.length === 0 && y.length === 0 && f.length > 0 && /* @__PURE__ */ h("div", { className: "cat-empty", children: [
|
|
1002
1070
|
'No metrics match "',
|
|
1003
1071
|
f,
|
|
1004
1072
|
'".'
|
|
1005
1073
|
] })
|
|
1006
1074
|
] }),
|
|
1007
|
-
|
|
1075
|
+
o
|
|
1008
1076
|
]
|
|
1009
1077
|
}
|
|
1010
1078
|
);
|
|
1011
1079
|
}
|
|
1012
|
-
function
|
|
1080
|
+
function Tt({
|
|
1013
1081
|
isOpen: e,
|
|
1014
1082
|
replacingLabel: t,
|
|
1015
|
-
lenses:
|
|
1016
|
-
defaultLens:
|
|
1083
|
+
lenses: r = ne,
|
|
1084
|
+
defaultLens: c = ae,
|
|
1017
1085
|
tilesByLens: n = se,
|
|
1018
|
-
footerSlot:
|
|
1086
|
+
footerSlot: o,
|
|
1019
1087
|
renderTile: u
|
|
1020
1088
|
}) {
|
|
1021
|
-
const [
|
|
1089
|
+
const [l, s] = S(c), [i, d] = S(null), [p, m] = S(null), f = n[l] ?? { primary: [] }, _ = [...f.primary, ...f.secondary ?? []];
|
|
1022
1090
|
return /* @__PURE__ */ h(
|
|
1023
1091
|
Y.Provider,
|
|
1024
1092
|
{
|
|
1025
|
-
value: { mode: "replace", selectedTileId:
|
|
1093
|
+
value: { mode: "replace", selectedTileId: i, description: p },
|
|
1026
1094
|
children: [
|
|
1027
1095
|
/* @__PURE__ */ h("div", { "data-shell": "catalog-replace", "aria-hidden": !e, children: [
|
|
1028
1096
|
t && /* @__PURE__ */ h("p", { className: "cat-subtitle", children: [
|
|
1029
1097
|
"replacing ",
|
|
1030
1098
|
t
|
|
1031
1099
|
] }),
|
|
1032
|
-
/* @__PURE__ */
|
|
1100
|
+
/* @__PURE__ */ a(
|
|
1033
1101
|
re,
|
|
1034
1102
|
{
|
|
1035
|
-
lenses:
|
|
1036
|
-
activeLens:
|
|
1103
|
+
lenses: r,
|
|
1104
|
+
activeLens: l,
|
|
1037
1105
|
onLensChange: (b) => {
|
|
1038
|
-
|
|
1106
|
+
s(b), d(null), m(null);
|
|
1039
1107
|
}
|
|
1040
1108
|
}
|
|
1041
1109
|
),
|
|
1042
|
-
/* @__PURE__ */
|
|
1110
|
+
/* @__PURE__ */ a(
|
|
1043
1111
|
V,
|
|
1044
1112
|
{
|
|
1045
|
-
tiles:
|
|
1046
|
-
selectedTileId:
|
|
1047
|
-
onSelectTile: (b,
|
|
1048
|
-
d(b), m(
|
|
1113
|
+
tiles: _,
|
|
1114
|
+
selectedTileId: i,
|
|
1115
|
+
onSelectTile: (b, C) => {
|
|
1116
|
+
d(b), m(C);
|
|
1049
1117
|
},
|
|
1050
1118
|
renderTile: u
|
|
1051
1119
|
}
|
|
1052
1120
|
)
|
|
1053
1121
|
] }),
|
|
1054
|
-
|
|
1122
|
+
o
|
|
1055
1123
|
]
|
|
1056
1124
|
}
|
|
1057
1125
|
);
|
|
@@ -1060,24 +1128,24 @@ const le = ee(null);
|
|
|
1060
1128
|
function oe() {
|
|
1061
1129
|
return te(le);
|
|
1062
1130
|
}
|
|
1063
|
-
function
|
|
1064
|
-
const
|
|
1131
|
+
function We(e = {}) {
|
|
1132
|
+
const r = oe()?.setPages;
|
|
1065
1133
|
return /* @__PURE__ */ h(
|
|
1066
1134
|
"div",
|
|
1067
1135
|
{
|
|
1068
1136
|
className: "panel-footer pm",
|
|
1069
1137
|
style: { display: "flex", justifyContent: "flex-end", padding: "10px 14px" },
|
|
1070
1138
|
children: [
|
|
1071
|
-
/* @__PURE__ */
|
|
1072
|
-
/* @__PURE__ */
|
|
1139
|
+
/* @__PURE__ */ a("div", { className: "spacer", style: { flex: 1 } }),
|
|
1140
|
+
/* @__PURE__ */ a(
|
|
1073
1141
|
"button",
|
|
1074
1142
|
{
|
|
1075
1143
|
id: "btn-new-page",
|
|
1076
1144
|
type: "button",
|
|
1077
1145
|
className: "btn btn-primary",
|
|
1078
1146
|
onClick: () => {
|
|
1079
|
-
|
|
1080
|
-
...
|
|
1147
|
+
r && r((c) => [
|
|
1148
|
+
...c,
|
|
1081
1149
|
{ id: `new-${Date.now()}`, name: "Untitled", active: !1 }
|
|
1082
1150
|
]);
|
|
1083
1151
|
},
|
|
@@ -1088,55 +1156,55 @@ function ze(e = {}) {
|
|
|
1088
1156
|
}
|
|
1089
1157
|
);
|
|
1090
1158
|
}
|
|
1091
|
-
function
|
|
1092
|
-
const n = oe(), [
|
|
1093
|
-
|
|
1094
|
-
if (!
|
|
1159
|
+
function Ge({ page: e, onRename: t, onKebab: r, onDragStart: c }) {
|
|
1160
|
+
const n = oe(), [o, u] = S(!1), l = I(null);
|
|
1161
|
+
x(() => {
|
|
1162
|
+
if (!o) return;
|
|
1095
1163
|
const m = (f) => {
|
|
1096
|
-
|
|
1164
|
+
l.current && (l.current.contains(f.target) || u(!1));
|
|
1097
1165
|
};
|
|
1098
1166
|
return document.addEventListener("mousedown", m, !0), () => document.removeEventListener("mousedown", m, !0);
|
|
1099
|
-
}, [
|
|
1100
|
-
const
|
|
1167
|
+
}, [o]);
|
|
1168
|
+
const s = () => {
|
|
1101
1169
|
if (u(!1), t) return t(e.id);
|
|
1102
1170
|
if (!n?.renamePage) return;
|
|
1103
1171
|
const m = window.prompt("Rename page", e.name);
|
|
1104
1172
|
m != null && m.trim().length > 0 && n.renamePage(e.id, m.trim());
|
|
1105
|
-
},
|
|
1173
|
+
}, i = () => {
|
|
1106
1174
|
u(!1), n?.duplicatePage?.(e.id);
|
|
1107
1175
|
}, d = () => {
|
|
1108
1176
|
u(!1), !e.active && n?.deletePage?.(e.id);
|
|
1109
1177
|
}, p = ["pm-row"];
|
|
1110
|
-
return e.active && p.push("active"), /* @__PURE__ */ h("div", { ref:
|
|
1111
|
-
/* @__PURE__ */
|
|
1178
|
+
return e.active && p.push("active"), /* @__PURE__ */ h("div", { ref: l, className: p.join(" "), "data-page-id": e.id, role: "listitem", children: [
|
|
1179
|
+
/* @__PURE__ */ a(
|
|
1112
1180
|
"div",
|
|
1113
1181
|
{
|
|
1114
1182
|
className: "pm-handle",
|
|
1115
1183
|
"aria-hidden": "true",
|
|
1116
|
-
onMouseDown: () =>
|
|
1184
|
+
onMouseDown: () => c?.(e.id),
|
|
1117
1185
|
children: "⋮⋮"
|
|
1118
1186
|
}
|
|
1119
1187
|
),
|
|
1120
|
-
/* @__PURE__ */
|
|
1121
|
-
/* @__PURE__ */
|
|
1188
|
+
/* @__PURE__ */ a("div", { className: "pm-name", children: e.name }),
|
|
1189
|
+
/* @__PURE__ */ a(
|
|
1122
1190
|
"button",
|
|
1123
1191
|
{
|
|
1124
1192
|
type: "button",
|
|
1125
1193
|
className: "pm-kebab",
|
|
1126
1194
|
"aria-label": "Page options",
|
|
1127
1195
|
"aria-haspopup": "menu",
|
|
1128
|
-
"aria-expanded":
|
|
1196
|
+
"aria-expanded": o,
|
|
1129
1197
|
onClick: (m) => {
|
|
1130
|
-
if (m.stopPropagation(),
|
|
1198
|
+
if (m.stopPropagation(), r) return r(e.id);
|
|
1131
1199
|
u((f) => !f);
|
|
1132
1200
|
},
|
|
1133
1201
|
children: "⋯"
|
|
1134
1202
|
}
|
|
1135
1203
|
),
|
|
1136
|
-
|
|
1137
|
-
/* @__PURE__ */
|
|
1138
|
-
/* @__PURE__ */
|
|
1139
|
-
/* @__PURE__ */
|
|
1204
|
+
o && /* @__PURE__ */ h("div", { className: "pm-kebab-menu", role: "menu", "data-page-id": e.id, children: [
|
|
1205
|
+
/* @__PURE__ */ a("button", { type: "button", role: "menuitem", className: "pm-kebab-menu__item", onClick: s, children: "Rename" }),
|
|
1206
|
+
/* @__PURE__ */ a("button", { type: "button", role: "menuitem", className: "pm-kebab-menu__item", onClick: i, children: "Duplicate" }),
|
|
1207
|
+
/* @__PURE__ */ a(
|
|
1140
1208
|
"button",
|
|
1141
1209
|
{
|
|
1142
1210
|
type: "button",
|
|
@@ -1150,50 +1218,50 @@ function Ye({ page: e, onRename: t, onKebab: l, onDragStart: i }) {
|
|
|
1150
1218
|
] })
|
|
1151
1219
|
] });
|
|
1152
1220
|
}
|
|
1153
|
-
const
|
|
1221
|
+
const Qe = [
|
|
1154
1222
|
{ id: "p-pipeline", name: "My Pipeline", active: !0 },
|
|
1155
1223
|
{ id: "p-numbers", name: "My Numbers", active: !1 },
|
|
1156
1224
|
{ id: "p-morning", name: "My Morning", active: !1 },
|
|
1157
1225
|
{ id: "p-accounts", name: "My Accounts", active: !1 }
|
|
1158
1226
|
];
|
|
1159
|
-
function
|
|
1227
|
+
function St({
|
|
1160
1228
|
isOpen: e,
|
|
1161
|
-
pages: t =
|
|
1162
|
-
footerSlot:
|
|
1229
|
+
pages: t = Qe,
|
|
1230
|
+
footerSlot: r
|
|
1163
1231
|
}) {
|
|
1164
|
-
const [
|
|
1165
|
-
n((d) => d.map((p) => p.id ===
|
|
1166
|
-
}, []), u =
|
|
1167
|
-
n((
|
|
1168
|
-
const d =
|
|
1169
|
-
if (!d) return
|
|
1232
|
+
const [c, n] = S(() => [...t]), o = P((s, i) => {
|
|
1233
|
+
n((d) => d.map((p) => p.id === s ? { ...p, name: i } : p));
|
|
1234
|
+
}, []), u = P((s) => {
|
|
1235
|
+
n((i) => {
|
|
1236
|
+
const d = i.find((f) => f.id === s);
|
|
1237
|
+
if (!d) return i;
|
|
1170
1238
|
const p = {
|
|
1171
1239
|
id: `${d.id}-copy-${Date.now()}`,
|
|
1172
1240
|
name: `${d.name} copy`,
|
|
1173
1241
|
active: !1
|
|
1174
|
-
}, m =
|
|
1175
|
-
return [...
|
|
1242
|
+
}, m = i.findIndex((f) => f.id === s);
|
|
1243
|
+
return [...i.slice(0, m + 1), p, ...i.slice(m + 1)];
|
|
1176
1244
|
});
|
|
1177
|
-
}, []),
|
|
1178
|
-
n((
|
|
1245
|
+
}, []), l = P((s) => {
|
|
1246
|
+
n((i) => i.filter((d) => d.id !== s));
|
|
1179
1247
|
}, []);
|
|
1180
|
-
return /* @__PURE__ */
|
|
1181
|
-
/* @__PURE__ */
|
|
1182
|
-
|
|
1248
|
+
return /* @__PURE__ */ a(le.Provider, { value: { pages: c, setPages: n, renamePage: o, duplicatePage: u, deletePage: l }, children: /* @__PURE__ */ h("div", { "data-shell": "page-management", "aria-hidden": !e, children: [
|
|
1249
|
+
/* @__PURE__ */ a("div", { className: "pm-list", role: "list", children: c.map((s) => /* @__PURE__ */ a(Ge, { page: s }, s.id)) }),
|
|
1250
|
+
r != null && /* @__PURE__ */ a("div", { className: "pm-footer-pin", children: r })
|
|
1183
1251
|
] }) });
|
|
1184
1252
|
}
|
|
1185
|
-
const
|
|
1253
|
+
const Nt = {
|
|
1186
1254
|
SETTINGS: "settings",
|
|
1187
1255
|
CATALOG_ADD: "catalog-add",
|
|
1188
1256
|
CATALOG_REPLACE: "catalog-replace",
|
|
1189
1257
|
PAGE_MGMT: "page-management",
|
|
1190
1258
|
NOTIFICATION_CENTER: "notification-center"
|
|
1191
|
-
},
|
|
1259
|
+
}, qe = {
|
|
1192
1260
|
position: "fixed",
|
|
1193
1261
|
inset: 0,
|
|
1194
1262
|
pointerEvents: "none",
|
|
1195
1263
|
zIndex: 55
|
|
1196
|
-
},
|
|
1264
|
+
}, je = {
|
|
1197
1265
|
position: "absolute",
|
|
1198
1266
|
inset: 0,
|
|
1199
1267
|
zIndex: 1,
|
|
@@ -1202,94 +1270,94 @@ const Ct = {
|
|
|
1202
1270
|
pointerEvents: "none",
|
|
1203
1271
|
background: "rgba(0, 0, 0, 0.04)"
|
|
1204
1272
|
};
|
|
1205
|
-
function
|
|
1206
|
-
const { state: e, dispatch: t, getCloseLog:
|
|
1207
|
-
|
|
1273
|
+
function wt() {
|
|
1274
|
+
const { state: e, dispatch: t, getCloseLog: r } = _e();
|
|
1275
|
+
x(() => {
|
|
1208
1276
|
if (e.activePanelId == null) return;
|
|
1209
|
-
function
|
|
1277
|
+
function o(u) {
|
|
1210
1278
|
u.key === "Escape" && t({ type: "CLOSE_PANEL", reason: "escape-key" });
|
|
1211
1279
|
}
|
|
1212
|
-
return document.addEventListener("keydown",
|
|
1280
|
+
return document.addEventListener("keydown", o), () => document.removeEventListener("keydown", o);
|
|
1213
1281
|
}, [e.activePanelId, t]);
|
|
1214
|
-
const
|
|
1215
|
-
|
|
1216
|
-
|
|
1217
|
-
}),
|
|
1282
|
+
const c = I(e);
|
|
1283
|
+
Ce(() => {
|
|
1284
|
+
c.current = e;
|
|
1285
|
+
}), x(() => {
|
|
1218
1286
|
if (process.env.NODE_ENV === "production") return;
|
|
1219
|
-
const
|
|
1220
|
-
return
|
|
1287
|
+
const o = window;
|
|
1288
|
+
return o.__panelsHostHandle && console.warn("[panels] multiple PanelHost/PanelHostShell instances mounted; dev handle is unreliable"), o.__panelsHostHandle = {
|
|
1221
1289
|
dispatch: t,
|
|
1222
|
-
getState: () =>
|
|
1223
|
-
getCloseLog:
|
|
1290
|
+
getState: () => c.current,
|
|
1291
|
+
getCloseLog: r
|
|
1224
1292
|
}, () => {
|
|
1225
|
-
|
|
1293
|
+
o.__panelsHostHandle?.dispatch === t && delete window.__panelsHostHandle;
|
|
1226
1294
|
};
|
|
1227
|
-
}, [t,
|
|
1228
|
-
const n =
|
|
1295
|
+
}, [t, r]);
|
|
1296
|
+
const n = P(() => {
|
|
1229
1297
|
t({ type: "CLOSE_PANEL", reason: "nav-escape-hatch" });
|
|
1230
1298
|
}, [t]);
|
|
1231
|
-
return /* @__PURE__ */
|
|
1299
|
+
return /* @__PURE__ */ a("div", { "data-panel-host": "true", style: qe, children: e.activePanelId != null && /* @__PURE__ */ a(
|
|
1232
1300
|
"div",
|
|
1233
1301
|
{
|
|
1234
1302
|
"data-panel-scrim": "true",
|
|
1235
|
-
style:
|
|
1303
|
+
style: je,
|
|
1236
1304
|
onClick: n
|
|
1237
1305
|
}
|
|
1238
1306
|
) });
|
|
1239
1307
|
}
|
|
1240
|
-
const
|
|
1241
|
-
function
|
|
1242
|
-
const [t,
|
|
1243
|
-
return
|
|
1308
|
+
const Xe = 700;
|
|
1309
|
+
function Je(e) {
|
|
1310
|
+
const [t, r] = S(null), c = I(null);
|
|
1311
|
+
return x(() => {
|
|
1244
1312
|
if (e != null) {
|
|
1245
|
-
|
|
1313
|
+
c.current != null && (clearTimeout(c.current), c.current = null), r(null);
|
|
1246
1314
|
return;
|
|
1247
1315
|
}
|
|
1248
|
-
return
|
|
1249
|
-
|
|
1250
|
-
},
|
|
1251
|
-
|
|
1316
|
+
return r((n) => n), c.current = setTimeout(() => {
|
|
1317
|
+
r(null), c.current = null;
|
|
1318
|
+
}, Xe), () => {
|
|
1319
|
+
c.current != null && (clearTimeout(c.current), c.current = null);
|
|
1252
1320
|
};
|
|
1253
|
-
}, [e]),
|
|
1254
|
-
e != null &&
|
|
1321
|
+
}, [e]), x(() => {
|
|
1322
|
+
e != null && r(e);
|
|
1255
1323
|
}, [e]), e != null ? { panelId: e, isOpen: !0 } : t != null ? { panelId: t, isOpen: !1 } : { panelId: null, isOpen: !1 };
|
|
1256
1324
|
}
|
|
1257
|
-
function
|
|
1258
|
-
const
|
|
1259
|
-
if (
|
|
1260
|
-
const { state:
|
|
1261
|
-
if (
|
|
1262
|
-
const u =
|
|
1263
|
-
if (
|
|
1325
|
+
function Et({ panelComponents: e, children: t }) {
|
|
1326
|
+
const r = L();
|
|
1327
|
+
if (r == null) return null;
|
|
1328
|
+
const { state: c, dispatch: n } = r, o = Je(c.activePanelId);
|
|
1329
|
+
if (o.panelId == null) return null;
|
|
1330
|
+
const u = o.panelId, l = o.isOpen, s = e?.[u];
|
|
1331
|
+
if (s == null && t == null)
|
|
1264
1332
|
return process.env.NODE_ENV !== "production" && console.error(
|
|
1265
1333
|
"[panels] No panel component registered for activePanelId:",
|
|
1266
1334
|
u
|
|
1267
1335
|
), null;
|
|
1268
1336
|
if (u === "settings") {
|
|
1269
|
-
const
|
|
1270
|
-
return /* @__PURE__ */
|
|
1337
|
+
const i = c.isDirty, d = c.activeTrigger, p = d?.kind === "card-overflow" ? d.cardId : null;
|
|
1338
|
+
return /* @__PURE__ */ a(A, { isOpen: l, children: /* @__PURE__ */ a(
|
|
1271
1339
|
k,
|
|
1272
1340
|
{
|
|
1273
|
-
isOpen:
|
|
1341
|
+
isOpen: l,
|
|
1274
1342
|
title: "Configure metric",
|
|
1275
1343
|
variant: "merged-stage",
|
|
1276
1344
|
onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
1277
1345
|
footer: /* @__PURE__ */ h(Z, { children: [
|
|
1278
|
-
/* @__PURE__ */
|
|
1346
|
+
/* @__PURE__ */ a(
|
|
1279
1347
|
"button",
|
|
1280
1348
|
{
|
|
1281
1349
|
id: "btn-reset",
|
|
1282
1350
|
type: "button",
|
|
1283
1351
|
className: "gloss-panel-chrome__footer-btn",
|
|
1284
|
-
disabled: !
|
|
1352
|
+
disabled: !i,
|
|
1285
1353
|
onClick: () => {
|
|
1286
1354
|
p != null && n({ type: "CLEAR_BUFFER", cardId: p });
|
|
1287
1355
|
},
|
|
1288
1356
|
children: "Reset"
|
|
1289
1357
|
}
|
|
1290
1358
|
),
|
|
1291
|
-
/* @__PURE__ */
|
|
1292
|
-
/* @__PURE__ */
|
|
1359
|
+
/* @__PURE__ */ a("span", { style: { flex: 1 } }),
|
|
1360
|
+
/* @__PURE__ */ a(
|
|
1293
1361
|
"button",
|
|
1294
1362
|
{
|
|
1295
1363
|
id: "settings-cancel",
|
|
@@ -1299,161 +1367,161 @@ function Tt({ panelComponents: e, children: t }) {
|
|
|
1299
1367
|
children: "Cancel"
|
|
1300
1368
|
}
|
|
1301
1369
|
),
|
|
1302
|
-
/* @__PURE__ */
|
|
1370
|
+
/* @__PURE__ */ a(
|
|
1303
1371
|
"button",
|
|
1304
1372
|
{
|
|
1305
1373
|
id: "settings-apply",
|
|
1306
1374
|
type: "button",
|
|
1307
1375
|
className: "gloss-panel-chrome__footer-btn gloss-panel-chrome__footer-btn--primary",
|
|
1308
|
-
disabled: !
|
|
1376
|
+
disabled: !i,
|
|
1309
1377
|
onClick: () => n({ type: "CLOSE_PANEL", reason: "apply-button" }),
|
|
1310
1378
|
children: "Apply"
|
|
1311
1379
|
}
|
|
1312
1380
|
)
|
|
1313
1381
|
] }),
|
|
1314
|
-
children:
|
|
1382
|
+
children: s != null ? /* @__PURE__ */ a(s, { isOpen: l }) : t
|
|
1315
1383
|
}
|
|
1316
1384
|
) });
|
|
1317
1385
|
}
|
|
1318
1386
|
if (u === "catalog-add" || u === "catalog-replace") {
|
|
1319
|
-
if (
|
|
1320
|
-
const
|
|
1321
|
-
return /* @__PURE__ */
|
|
1387
|
+
if (s == null) return null;
|
|
1388
|
+
const i = u === "catalog-replace" ? "replace" : "add";
|
|
1389
|
+
return /* @__PURE__ */ a(A, { isOpen: l, children: /* @__PURE__ */ a(
|
|
1322
1390
|
k,
|
|
1323
1391
|
{
|
|
1324
|
-
isOpen:
|
|
1392
|
+
isOpen: l,
|
|
1325
1393
|
onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
1326
1394
|
footer: null,
|
|
1327
|
-
title:
|
|
1328
|
-
children: /* @__PURE__ */
|
|
1329
|
-
|
|
1395
|
+
title: i === "replace" ? "Replace metric" : "Add a metric",
|
|
1396
|
+
children: /* @__PURE__ */ a(
|
|
1397
|
+
s,
|
|
1330
1398
|
{
|
|
1331
|
-
isOpen:
|
|
1332
|
-
footerSlot: /* @__PURE__ */
|
|
1399
|
+
isOpen: l,
|
|
1400
|
+
footerSlot: /* @__PURE__ */ a(Be, { mode: i, dispatch: n })
|
|
1333
1401
|
}
|
|
1334
1402
|
)
|
|
1335
1403
|
}
|
|
1336
1404
|
) });
|
|
1337
1405
|
}
|
|
1338
|
-
return u === "page-management" ?
|
|
1406
|
+
return u === "page-management" ? s == null ? null : /* @__PURE__ */ a(A, { isOpen: l, children: /* @__PURE__ */ a(
|
|
1339
1407
|
k,
|
|
1340
1408
|
{
|
|
1341
|
-
isOpen:
|
|
1409
|
+
isOpen: l,
|
|
1342
1410
|
onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
1343
1411
|
footer: null,
|
|
1344
1412
|
title: "Manage pages",
|
|
1345
|
-
children: /* @__PURE__ */ s
|
|
1413
|
+
children: /* @__PURE__ */ a(s, { isOpen: l, footerSlot: /* @__PURE__ */ a(We, {}) })
|
|
1346
1414
|
}
|
|
1347
|
-
) }) : /* @__PURE__ */
|
|
1415
|
+
) }) : /* @__PURE__ */ a(A, { isOpen: l, children: /* @__PURE__ */ a(
|
|
1348
1416
|
k,
|
|
1349
1417
|
{
|
|
1350
1418
|
isOpen: !0,
|
|
1351
1419
|
onClose: () => n({ type: "CLOSE_PANEL", reason: "header-x" }),
|
|
1352
1420
|
footer: null,
|
|
1353
|
-
children:
|
|
1421
|
+
children: s != null ? /* @__PURE__ */ a(s, { isOpen: l }) : t
|
|
1354
1422
|
}
|
|
1355
1423
|
) });
|
|
1356
1424
|
}
|
|
1357
1425
|
function j(e) {
|
|
1358
1426
|
return e === null ? null : e.kind === "manage-pages-action" ? `global-${e.align ?? "left"}` : e.kind === "card-overflow" || e.kind === "empty-cell" ? `section-${e.sectionIndex}` : null;
|
|
1359
1427
|
}
|
|
1360
|
-
const
|
|
1428
|
+
const Ze = 685, X = 627, et = "cubic-bezier(0.22, 1, 0.36, 1)", tt = 200;
|
|
1361
1429
|
function ie(e, t) {
|
|
1362
1430
|
if (typeof window > "u") return t;
|
|
1363
|
-
const
|
|
1364
|
-
if (!
|
|
1365
|
-
const
|
|
1366
|
-
return Number.isNaN(
|
|
1431
|
+
const r = window.getComputedStyle(document.documentElement).getPropertyValue(e).trim();
|
|
1432
|
+
if (!r) return t;
|
|
1433
|
+
const c = parseFloat(r);
|
|
1434
|
+
return Number.isNaN(c) ? t : r.endsWith("s") && !r.endsWith("ms") ? c * 1e3 : c;
|
|
1367
1435
|
}
|
|
1368
|
-
function
|
|
1436
|
+
function nt(e, t) {
|
|
1369
1437
|
return typeof window > "u" ? t : window.getComputedStyle(document.documentElement).getPropertyValue(e).trim() || t;
|
|
1370
1438
|
}
|
|
1371
1439
|
function D(e) {
|
|
1372
1440
|
e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
|
|
1373
1441
|
}
|
|
1374
|
-
function
|
|
1375
|
-
const { mountEl: t, chromeEl:
|
|
1376
|
-
if (t == null ||
|
|
1442
|
+
function at(e) {
|
|
1443
|
+
const { mountEl: t, chromeEl: r, reducedMotion: c, onAssert: n } = e;
|
|
1444
|
+
if (t == null || r == null) {
|
|
1377
1445
|
D(e), n?.({ branch: "slide-fallback-no-dom", timestamp: Date.now() });
|
|
1378
1446
|
return;
|
|
1379
1447
|
}
|
|
1380
|
-
if (
|
|
1448
|
+
if (c) {
|
|
1381
1449
|
e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), n?.({ branch: "slide-reduced-motion", timestamp: Date.now() });
|
|
1382
1450
|
return;
|
|
1383
1451
|
}
|
|
1384
|
-
if (typeof
|
|
1452
|
+
if (typeof r.animate != "function") {
|
|
1385
1453
|
D(e), n?.({ branch: "slide-no-waapi", timestamp: Date.now() });
|
|
1386
1454
|
return;
|
|
1387
1455
|
}
|
|
1388
|
-
const
|
|
1389
|
-
|
|
1390
|
-
const u = ie("--panel-open-dur",
|
|
1456
|
+
const o = r.cloneNode(!0);
|
|
1457
|
+
o.id = "panel-chrome-frozen", o.style.cssText = "position:absolute;left:8px;right:8px;top:8px;z-index:1;pointer-events:none;", t.appendChild(o), r.style.zIndex = "2", e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger });
|
|
1458
|
+
const u = ie("--panel-open-dur", Ze), l = nt("--panel-easing", et), s = r.animate(
|
|
1391
1459
|
[{ transform: "translateY(100%)" }, { transform: "translateY(0)" }],
|
|
1392
|
-
{ duration: u, easing:
|
|
1460
|
+
{ duration: u, easing: l, fill: "forwards" }
|
|
1393
1461
|
);
|
|
1394
|
-
|
|
1462
|
+
s.addEventListener(
|
|
1395
1463
|
"finish",
|
|
1396
1464
|
() => {
|
|
1397
|
-
|
|
1465
|
+
o.remove(), r.style.zIndex = "", s.cancel(), n?.({ branch: "slide-complete", frozen: "cleaned", timestamp: Date.now() });
|
|
1398
1466
|
},
|
|
1399
1467
|
{ once: !0 }
|
|
1400
1468
|
);
|
|
1401
1469
|
}
|
|
1402
|
-
function
|
|
1403
|
-
const { mountEl: t, onAssert:
|
|
1470
|
+
function st(e) {
|
|
1471
|
+
const { mountEl: t, onAssert: r } = e;
|
|
1404
1472
|
if (t == null) {
|
|
1405
|
-
e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => D(e), X),
|
|
1473
|
+
e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), setTimeout(() => D(e), X), r?.({ branch: "handoff-fallback-no-mount", timestamp: Date.now() });
|
|
1406
1474
|
return;
|
|
1407
1475
|
}
|
|
1408
|
-
const
|
|
1409
|
-
let n = !1,
|
|
1410
|
-
const u = (
|
|
1411
|
-
|
|
1412
|
-
},
|
|
1413
|
-
n || (n = !0, t.removeEventListener("transitionend", u), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }),
|
|
1476
|
+
const c = ie("--panel-close-dur", X);
|
|
1477
|
+
let n = !1, o = null;
|
|
1478
|
+
const u = (s) => {
|
|
1479
|
+
s.target !== t || s.propertyName !== "max-height" || n || (n = !0, o != null && clearTimeout(o), t.removeEventListener("transitionend", u), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "handoff-complete", timestamp: Date.now() }));
|
|
1480
|
+
}, l = () => {
|
|
1481
|
+
n || (n = !0, t.removeEventListener("transitionend", u), e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "handoff-forced", timestamp: Date.now() }));
|
|
1414
1482
|
};
|
|
1415
|
-
t.addEventListener("transitionend", u), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }),
|
|
1483
|
+
t.addEventListener("transitionend", u), e.dispatch({ type: "CLOSE_PANEL", reason: "mutex-handoff" }), o = setTimeout(l, c + tt);
|
|
1416
1484
|
}
|
|
1417
|
-
function
|
|
1418
|
-
const { state: t, onAssert:
|
|
1485
|
+
function rt(e) {
|
|
1486
|
+
const { state: t, onAssert: r } = e;
|
|
1419
1487
|
if (t.activePanelId && t.isDirty) {
|
|
1420
|
-
e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }),
|
|
1488
|
+
e.dispatch({ type: "OPEN_PANEL", panelId: e.panelId, trigger: e.trigger }), r?.({ branch: "blocked-dirty", timestamp: Date.now() });
|
|
1421
1489
|
return;
|
|
1422
1490
|
}
|
|
1423
|
-
const
|
|
1424
|
-
if (!!t.activePanelId &&
|
|
1425
|
-
|
|
1491
|
+
const c = j(t.activeTrigger), n = j(e.trigger);
|
|
1492
|
+
if (!!t.activePanelId && c != null && c === n) {
|
|
1493
|
+
at(e);
|
|
1426
1494
|
return;
|
|
1427
1495
|
}
|
|
1428
1496
|
if (t.activePanelId) {
|
|
1429
|
-
|
|
1497
|
+
st(e);
|
|
1430
1498
|
return;
|
|
1431
1499
|
}
|
|
1432
|
-
D(e),
|
|
1500
|
+
D(e), r?.({ branch: "fresh-open", timestamp: Date.now() });
|
|
1433
1501
|
}
|
|
1434
|
-
function
|
|
1502
|
+
function lt() {
|
|
1435
1503
|
if (!(typeof window > "u"))
|
|
1436
1504
|
return window.__panelsAsserter;
|
|
1437
1505
|
}
|
|
1438
|
-
function
|
|
1506
|
+
function Pt() {
|
|
1439
1507
|
const e = L(), t = J();
|
|
1440
|
-
return
|
|
1441
|
-
(
|
|
1508
|
+
return P(
|
|
1509
|
+
(r, c) => {
|
|
1442
1510
|
if (!e)
|
|
1443
1511
|
return;
|
|
1444
|
-
const n = typeof document < "u" ? document.querySelector('[data-mount="panel"]') : null,
|
|
1445
|
-
panelId:
|
|
1446
|
-
trigger:
|
|
1512
|
+
const n = typeof document < "u" ? document.querySelector('[data-mount="panel"]') : null, o = typeof document < "u" ? document.querySelector('[data-chrome="panel"]') : null, u = {
|
|
1513
|
+
panelId: r,
|
|
1514
|
+
trigger: c,
|
|
1447
1515
|
state: e.state,
|
|
1448
1516
|
dispatch: e.dispatch,
|
|
1449
1517
|
mountEl: n,
|
|
1450
|
-
chromeEl:
|
|
1518
|
+
chromeEl: o,
|
|
1451
1519
|
reducedMotion: t,
|
|
1452
|
-
onAssert: (
|
|
1453
|
-
|
|
1520
|
+
onAssert: (l) => {
|
|
1521
|
+
lt()?.recordTransition?.(l);
|
|
1454
1522
|
}
|
|
1455
1523
|
};
|
|
1456
|
-
|
|
1524
|
+
rt(u);
|
|
1457
1525
|
},
|
|
1458
1526
|
[e, t]
|
|
1459
1527
|
);
|
|
@@ -1463,45 +1531,45 @@ function H() {
|
|
|
1463
1531
|
const e = [];
|
|
1464
1532
|
let t = "cleaned";
|
|
1465
1533
|
document.querySelectorAll("#panel-chrome-frozen").length > 0 && (e.push("#panel-chrome-frozen"), t = "lingering");
|
|
1466
|
-
const
|
|
1467
|
-
|
|
1468
|
-
const n =
|
|
1469
|
-
|
|
1470
|
-
const u =
|
|
1534
|
+
const c = document.querySelectorAll(".gloss-panel-mount");
|
|
1535
|
+
c.length > 1 && e.push(`mount-count=${c.length}`);
|
|
1536
|
+
const n = c[0] ?? null, o = n ? n.querySelectorAll(".gloss-panel-chrome") : [];
|
|
1537
|
+
o.length > 1 && e.push(`chrome-count=${o.length}`);
|
|
1538
|
+
const u = o[0] ?? null;
|
|
1471
1539
|
if (u) {
|
|
1472
1540
|
const d = u.style.zIndex;
|
|
1473
1541
|
d !== "" && d !== "2" && e.push(`chrome-zindex=${d}`);
|
|
1474
1542
|
}
|
|
1475
|
-
const
|
|
1543
|
+
const l = n ? "present" : "absent", s = u ? "present" : "absent";
|
|
1476
1544
|
return {
|
|
1477
1545
|
valid: e.length === 0,
|
|
1478
|
-
mount:
|
|
1479
|
-
chrome:
|
|
1546
|
+
mount: l,
|
|
1547
|
+
chrome: s,
|
|
1480
1548
|
frozen: t,
|
|
1481
1549
|
orphans: e,
|
|
1482
1550
|
timestamp: Date.now()
|
|
1483
1551
|
};
|
|
1484
1552
|
}
|
|
1485
1553
|
const $ = "8px 8px 0px", R = "64px", F = "inset(0px 0px 60px 0px)", U = "inset(0px -40px -40px -40px)";
|
|
1486
|
-
function g(e, t,
|
|
1487
|
-
return { id: e, constraint: t, expected:
|
|
1554
|
+
function g(e, t, r, c, n) {
|
|
1555
|
+
return { id: e, constraint: t, expected: r, actual: c, pass: n };
|
|
1488
1556
|
}
|
|
1489
|
-
function
|
|
1557
|
+
function w(e) {
|
|
1490
1558
|
const t = parseInt(e, 10);
|
|
1491
1559
|
return Number.isFinite(t) ? t : NaN;
|
|
1492
1560
|
}
|
|
1493
1561
|
function K() {
|
|
1494
|
-
const e = [], t = document.querySelector(".gloss-panel-mount"),
|
|
1562
|
+
const e = [], t = document.querySelector(".gloss-panel-mount"), r = t?.querySelector(".gloss-panel-chrome") ?? null, c = document.querySelector(".gloss-panel-coordinator") ?? document.querySelector("[data-panel-coordinator]"), n = document.querySelector(".bell-cutout"), o = document.querySelector(".bell-popover"), u = document.querySelector(".gloss-bottom-toolbar");
|
|
1495
1563
|
if (!t)
|
|
1496
1564
|
e.push(g("C1", "mount --reveal-y matches clip-path inset-bottom Npx", "mount present", "absent", !1));
|
|
1497
1565
|
else {
|
|
1498
|
-
const
|
|
1566
|
+
const l = getComputedStyle(t), s = l.getPropertyValue("--reveal-y").trim() || t.style.getPropertyValue("--reveal-y").trim(), i = l.clipPath || t.style.clipPath || "", d = i.match(/inset\(\s*0(?:px)?\s+0(?:px)?\s+(\d+)px\s+0(?:px)?\s*\)/), p = d ? parseInt(d[1], 10) : NaN, m = w(s), f = Number.isFinite(p) && Number.isFinite(m) && p === m;
|
|
1499
1567
|
e.push(
|
|
1500
1568
|
g(
|
|
1501
1569
|
"C1",
|
|
1502
1570
|
"mount --reveal-y matches clip-path inset-bottom Npx",
|
|
1503
1571
|
`inset(0 0 ${m}px 0) === --reveal-y(${m}px)`,
|
|
1504
|
-
`--reveal-y=${
|
|
1572
|
+
`--reveal-y=${s || "n/a"} clip-path=${i || "n/a"}`,
|
|
1505
1573
|
f
|
|
1506
1574
|
)
|
|
1507
1575
|
);
|
|
@@ -1509,102 +1577,102 @@ function K() {
|
|
|
1509
1577
|
if (!t)
|
|
1510
1578
|
e.push(g("C2", "mount padding constant", $, "absent", !1));
|
|
1511
1579
|
else {
|
|
1512
|
-
const
|
|
1513
|
-
e.push(g("C2", "mount padding constant", $,
|
|
1580
|
+
const l = t.style.padding, s = getComputedStyle(t), i = l || s.padding || "", d = i === $ || i === "8px 8px 0px 8px";
|
|
1581
|
+
e.push(g("C2", "mount padding constant", $, i || "n/a", d));
|
|
1514
1582
|
}
|
|
1515
1583
|
if (!t)
|
|
1516
1584
|
e.push(g("C3", "mount.bottom resolves to var(--tb-h)=64px", R, "absent", !1));
|
|
1517
1585
|
else {
|
|
1518
|
-
const
|
|
1519
|
-
e.push(g("C3", "mount.bottom resolves to var(--tb-h)=64px", R,
|
|
1586
|
+
const s = getComputedStyle(t).bottom || t.style.bottom || "", i = s === R;
|
|
1587
|
+
e.push(g("C3", "mount.bottom resolves to var(--tb-h)=64px", R, s || "n/a", i));
|
|
1520
1588
|
}
|
|
1521
|
-
if (!
|
|
1589
|
+
if (!r)
|
|
1522
1590
|
e.push(g("C4", "panel-chrome height formula = (row-h*3)+(row-gap*3)-8px", "formula match", "absent", !1));
|
|
1523
1591
|
else {
|
|
1524
|
-
const
|
|
1525
|
-
|
|
1526
|
-
),
|
|
1527
|
-
|
|
1528
|
-
), d =
|
|
1592
|
+
const l = getComputedStyle(r), s = w(
|
|
1593
|
+
l.getPropertyValue("--row-h").trim() || r.style.getPropertyValue("--row-h").trim() || "0"
|
|
1594
|
+
), i = w(
|
|
1595
|
+
l.getPropertyValue("--row-gap").trim() || r.style.getPropertyValue("--row-gap").trim() || "0"
|
|
1596
|
+
), d = s * 3 + i * 3 - 8, p = w(l.height || r.style.height || ""), m = Number.isFinite(s) && Number.isFinite(i) && Number.isFinite(p) && Number.isFinite(d) && p === d;
|
|
1529
1597
|
e.push(
|
|
1530
1598
|
g(
|
|
1531
1599
|
"C4",
|
|
1532
1600
|
"panel-chrome height formula = (row-h*3)+(row-gap*3)-8px",
|
|
1533
|
-
`${d}px (rh=${
|
|
1601
|
+
`${d}px (rh=${s} rg=${i})`,
|
|
1534
1602
|
`${p}px`,
|
|
1535
1603
|
m
|
|
1536
1604
|
)
|
|
1537
1605
|
);
|
|
1538
1606
|
}
|
|
1539
|
-
if (!
|
|
1607
|
+
if (!c || !r)
|
|
1540
1608
|
e.push(
|
|
1541
1609
|
g(
|
|
1542
1610
|
"C5",
|
|
1543
1611
|
'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
|
|
1544
1612
|
"present",
|
|
1545
|
-
`coordinator=${
|
|
1613
|
+
`coordinator=${c ? "present" : "absent"} chrome=${r ? "present" : "absent"}`,
|
|
1546
1614
|
!1
|
|
1547
1615
|
)
|
|
1548
1616
|
);
|
|
1549
1617
|
else {
|
|
1550
|
-
const
|
|
1618
|
+
const l = getComputedStyle(c), s = getComputedStyle(r), i = l.perspective || c.style.perspective || "", d = (l.perspectiveOrigin || c.style.perspectiveOrigin || "").trim(), p = s.perspectiveStyle || r.style.perspectiveStyle || "", b = i !== "" && i !== "none" && (d === "center bottom" || d === "50% 100%") && p === "flat";
|
|
1551
1619
|
e.push(
|
|
1552
1620
|
g(
|
|
1553
1621
|
"C5",
|
|
1554
1622
|
'coordinator perspective + origin "center bottom"; chrome perspective-style flat',
|
|
1555
1623
|
"perspective:not-none, origin:center bottom, chrome-style:flat",
|
|
1556
|
-
`perspective=${
|
|
1624
|
+
`perspective=${i} origin=${d} chrome-style=${p}`,
|
|
1557
1625
|
b
|
|
1558
1626
|
)
|
|
1559
1627
|
);
|
|
1560
1628
|
}
|
|
1561
1629
|
{
|
|
1562
|
-
let
|
|
1630
|
+
let l = !1, s = "absent";
|
|
1563
1631
|
try {
|
|
1564
|
-
for (const
|
|
1632
|
+
for (const i of Array.from(document.styleSheets)) {
|
|
1565
1633
|
let d = [];
|
|
1566
1634
|
try {
|
|
1567
|
-
d = Array.from(
|
|
1635
|
+
d = Array.from(i.cssRules ?? []);
|
|
1568
1636
|
} catch {
|
|
1569
1637
|
continue;
|
|
1570
1638
|
}
|
|
1571
1639
|
for (const p of d)
|
|
1572
1640
|
if (p.name === "stage-spin") {
|
|
1573
|
-
const f = Array.from(p.cssRules),
|
|
1574
|
-
|
|
1641
|
+
const f = Array.from(p.cssRules), _ = f.find((v) => v.keyText === "0%" || v.keyText === "from"), b = f.find((v) => v.keyText === "100%" || v.keyText === "to"), C = _?.style.transform ?? "", N = b?.style.transform ?? "", y = /rotateY\(\s*0(?:deg)?\s*\)/;
|
|
1642
|
+
l = y.test(C) && y.test(N), s = `0%=${C || "n/a"} 100%=${N || "n/a"}`;
|
|
1575
1643
|
break;
|
|
1576
1644
|
}
|
|
1577
|
-
if (
|
|
1645
|
+
if (s !== "absent") break;
|
|
1578
1646
|
}
|
|
1579
1647
|
} catch {
|
|
1580
|
-
|
|
1648
|
+
s = "inspection-error";
|
|
1581
1649
|
}
|
|
1582
1650
|
e.push(
|
|
1583
1651
|
g(
|
|
1584
1652
|
"C6",
|
|
1585
1653
|
"@keyframes stage-spin 0% AND 100% anchor at rotateY(0)",
|
|
1586
1654
|
"both frames rotateY(0)",
|
|
1587
|
-
|
|
1588
|
-
|
|
1655
|
+
s,
|
|
1656
|
+
l
|
|
1589
1657
|
)
|
|
1590
1658
|
);
|
|
1591
1659
|
}
|
|
1592
1660
|
{
|
|
1593
|
-
const
|
|
1661
|
+
const l = document.documentElement, s = getComputedStyle(l), i = s.getPropertyValue("--panel-open-dur").trim() || l.style.getPropertyValue("--panel-open-dur").trim(), d = s.getPropertyValue("--panel-close-dur").trim() || l.style.getPropertyValue("--panel-close-dur").trim(), p = w(i) || parseFloat(i) * (i.endsWith("s") && !i.endsWith("ms") ? 1e3 : 1), m = w(d) || parseFloat(d) * (d.endsWith("s") && !d.endsWith("ms") ? 1e3 : 1), f = Number.isFinite(p) && Number.isFinite(m) && p > m;
|
|
1594
1662
|
e.push(
|
|
1595
|
-
g("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${
|
|
1663
|
+
g("C7", "--panel-open-dur > --panel-close-dur", "open > close", `open=${i || "n/a"} close=${d || "n/a"}`, f)
|
|
1596
1664
|
);
|
|
1597
1665
|
}
|
|
1598
1666
|
if (!n)
|
|
1599
1667
|
e.push(g("C8", "BellCutout zero computed animation/transition", "no inline timing", "absent", !1));
|
|
1600
1668
|
else {
|
|
1601
|
-
const
|
|
1669
|
+
const l = getComputedStyle(n), s = l.animationName || "", i = l.transitionProperty || "", d = (s === "" || s === "none") && (i === "" || i === "none" || i === "all");
|
|
1602
1670
|
e.push(
|
|
1603
1671
|
g(
|
|
1604
1672
|
"C8",
|
|
1605
1673
|
"BellCutout zero computed animation/transition",
|
|
1606
1674
|
"animation:none AND transition:none",
|
|
1607
|
-
`animation=${
|
|
1675
|
+
`animation=${s || "n/a"} transition=${i || "n/a"}`,
|
|
1608
1676
|
d
|
|
1609
1677
|
)
|
|
1610
1678
|
);
|
|
@@ -1612,34 +1680,34 @@ function K() {
|
|
|
1612
1680
|
if (!t)
|
|
1613
1681
|
e.push(g("C9", "mount closed-state clipPath", F, "absent", !1));
|
|
1614
1682
|
else {
|
|
1615
|
-
const
|
|
1616
|
-
e.push(g("C9", "mount closed-state clipPath", F,
|
|
1683
|
+
const l = t.style.clipPath, s = getComputedStyle(t), i = l || s.clipPath || "", d = i === F;
|
|
1684
|
+
e.push(g("C9", "mount closed-state clipPath", F, i || "n/a", d));
|
|
1617
1685
|
}
|
|
1618
|
-
if (!
|
|
1686
|
+
if (!o)
|
|
1619
1687
|
e.push(g("C10", "bell-popover parentElement === document.body (open)", "body", "absent", !1));
|
|
1620
1688
|
else {
|
|
1621
|
-
const
|
|
1689
|
+
const l = o.parentElement, s = l === document.body;
|
|
1622
1690
|
e.push(
|
|
1623
1691
|
g(
|
|
1624
1692
|
"C10",
|
|
1625
1693
|
"bell-popover parentElement === document.body (open)",
|
|
1626
1694
|
"body",
|
|
1627
|
-
|
|
1628
|
-
|
|
1695
|
+
l === document.body ? "body" : l?.tagName ?? "n/a",
|
|
1696
|
+
s
|
|
1629
1697
|
)
|
|
1630
1698
|
);
|
|
1631
1699
|
}
|
|
1632
|
-
if (!
|
|
1700
|
+
if (!c)
|
|
1633
1701
|
e.push(g("C11", "coordinator overflow === visible", "visible", "absent", !1));
|
|
1634
1702
|
else {
|
|
1635
|
-
const
|
|
1636
|
-
e.push(g("C11", "coordinator overflow === visible", "visible",
|
|
1703
|
+
const s = getComputedStyle(c).overflow || c.style.overflow || "", i = s === "visible";
|
|
1704
|
+
e.push(g("C11", "coordinator overflow === visible", "visible", s || "n/a", i));
|
|
1637
1705
|
}
|
|
1638
1706
|
if (!u)
|
|
1639
1707
|
e.push(g("C12", "toolbar clipPath = inset(0 -40 -40 -40)", U, "absent", !1));
|
|
1640
1708
|
else {
|
|
1641
|
-
const
|
|
1642
|
-
e.push(g("C12", "toolbar clipPath = inset(0 -40 -40 -40)", U,
|
|
1709
|
+
const l = u.style.clipPath, s = getComputedStyle(u), i = l || s.clipPath || "", d = i === U;
|
|
1710
|
+
e.push(g("C12", "toolbar clipPath = inset(0 -40 -40 -40)", U, i || "n/a", d));
|
|
1643
1711
|
}
|
|
1644
1712
|
return e.push(
|
|
1645
1713
|
g(
|
|
@@ -1659,10 +1727,10 @@ function K() {
|
|
|
1659
1727
|
)
|
|
1660
1728
|
), e;
|
|
1661
1729
|
}
|
|
1662
|
-
function
|
|
1730
|
+
function ot(e) {
|
|
1663
1731
|
return K().find((t) => t.id === e);
|
|
1664
1732
|
}
|
|
1665
|
-
function
|
|
1733
|
+
function it() {
|
|
1666
1734
|
const e = H();
|
|
1667
1735
|
return { q12: [
|
|
1668
1736
|
{
|
|
@@ -1674,10 +1742,10 @@ function st() {
|
|
|
1674
1742
|
}
|
|
1675
1743
|
], cc: K() };
|
|
1676
1744
|
}
|
|
1677
|
-
function
|
|
1745
|
+
function ct() {
|
|
1678
1746
|
return {
|
|
1679
|
-
enable:
|
|
1680
|
-
disable:
|
|
1747
|
+
enable: dt,
|
|
1748
|
+
disable: ut,
|
|
1681
1749
|
isEnabled: () => O,
|
|
1682
1750
|
getLastReport: () => M,
|
|
1683
1751
|
recordTransition: (e) => {
|
|
@@ -1688,60 +1756,60 @@ function rt() {
|
|
|
1688
1756
|
return M = e, e;
|
|
1689
1757
|
},
|
|
1690
1758
|
assertCcOnly: K,
|
|
1691
|
-
getCcRowById:
|
|
1692
|
-
assertPanelTruths:
|
|
1759
|
+
getCcRowById: ot,
|
|
1760
|
+
assertPanelTruths: it
|
|
1693
1761
|
};
|
|
1694
1762
|
}
|
|
1695
|
-
function
|
|
1763
|
+
function dt() {
|
|
1696
1764
|
if (O = !0, typeof window > "u") return;
|
|
1697
|
-
window.__panelsAsserter || (window.__panelsAsserter =
|
|
1765
|
+
window.__panelsAsserter || (window.__panelsAsserter = ct(), console.info(
|
|
1698
1766
|
"[panels] asserter enabled (P3b Q12-12 + P6 W5 cc:C1..C14). Inspect via window.__panelsAsserter."
|
|
1699
1767
|
));
|
|
1700
1768
|
}
|
|
1701
|
-
function
|
|
1769
|
+
function ut() {
|
|
1702
1770
|
O = !1;
|
|
1703
1771
|
}
|
|
1704
1772
|
export {
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1773
|
+
kt as COMMITS,
|
|
1774
|
+
Ct as CatalogAddShell,
|
|
1775
|
+
Be as CatalogFooter,
|
|
1776
|
+
Tt as CatalogReplaceShell,
|
|
1709
1777
|
Y as CatalogStateContext,
|
|
1710
|
-
|
|
1711
|
-
|
|
1778
|
+
Ie as CloneCard,
|
|
1779
|
+
Le as CloneStage,
|
|
1712
1780
|
ae as MOCK_DEFAULT_LENS,
|
|
1713
1781
|
ne as MOCK_LENSES,
|
|
1714
1782
|
z as MOCK_LENS_META,
|
|
1715
|
-
|
|
1783
|
+
Qe as MOCK_PAGES,
|
|
1716
1784
|
se as MOCK_TILES_BY_LENS,
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
|
|
1785
|
+
Nt as PANEL_IDS,
|
|
1786
|
+
We as PageMgmtFooter,
|
|
1787
|
+
St as PageMgmtShell,
|
|
1720
1788
|
le as PageMgmtStateContext,
|
|
1721
1789
|
k as PanelChrome,
|
|
1722
|
-
|
|
1723
|
-
|
|
1724
|
-
|
|
1725
|
-
|
|
1726
|
-
|
|
1727
|
-
|
|
1790
|
+
Dt as PanelHost,
|
|
1791
|
+
wt as PanelHostShell,
|
|
1792
|
+
A as PanelMount,
|
|
1793
|
+
Ot as PanelProvider,
|
|
1794
|
+
Et as PanelSlot,
|
|
1795
|
+
_t as SettingsShell,
|
|
1728
1796
|
K as assertCcOnly,
|
|
1729
1797
|
H as assertPanelDomShape,
|
|
1730
|
-
|
|
1731
|
-
|
|
1732
|
-
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
|
|
1798
|
+
it as assertPanelTruths,
|
|
1799
|
+
Lt as deriveSurfaceState,
|
|
1800
|
+
ut as disablePanelAsserter,
|
|
1801
|
+
dt as enablePanelAsserter,
|
|
1802
|
+
ot as getCcRowById,
|
|
1803
|
+
It as initialState,
|
|
1736
1804
|
j as positionKey,
|
|
1737
|
-
|
|
1738
|
-
|
|
1739
|
-
|
|
1740
|
-
|
|
1805
|
+
Mt as reducer,
|
|
1806
|
+
rt as transitionToPanel,
|
|
1807
|
+
Ke as useCatalogState,
|
|
1808
|
+
vt as useEditingCardId,
|
|
1741
1809
|
oe as usePageMgmtState,
|
|
1742
|
-
|
|
1810
|
+
_e as usePanelContext,
|
|
1743
1811
|
L as usePanelContextOptional,
|
|
1744
|
-
|
|
1812
|
+
$t as usePanelCoordinator,
|
|
1745
1813
|
J as useReducedMotionPanel,
|
|
1746
|
-
|
|
1814
|
+
Pt as useTransitionToPanel
|
|
1747
1815
|
};
|