@apliteni/apliteni-ui 0.62.0 → 0.64.0
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/README.md +3 -0
- package/package.json +1 -1
- package/react/README.md +39 -1
- package/react/dist/index.css +254 -235
- package/react/dist/index.d.ts +37 -17
- package/react/dist/index.js +400 -352
- package/src/components/index.js +2 -2
- package/src/styles/input.css +23 -1
package/react/dist/index.js
CHANGED
|
@@ -14,9 +14,37 @@ function Icon({ name }) {
|
|
|
14
14
|
);
|
|
15
15
|
}
|
|
16
16
|
|
|
17
|
-
// src/
|
|
18
|
-
import { forwardRef
|
|
17
|
+
// src/Checkbox.tsx
|
|
18
|
+
import { forwardRef } from "react";
|
|
19
19
|
import { jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
20
|
+
var Checkbox = forwardRef(function Checkbox2({
|
|
21
|
+
label,
|
|
22
|
+
type = "checkbox",
|
|
23
|
+
...props
|
|
24
|
+
}, ref) {
|
|
25
|
+
return /* @__PURE__ */ jsxs("label", { className: "ui-check", children: [
|
|
26
|
+
/* @__PURE__ */ jsx2("input", { ...props, ref, type }),
|
|
27
|
+
/* @__PURE__ */ jsx2("span", { children: label })
|
|
28
|
+
] });
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
// src/Switch.tsx
|
|
32
|
+
import { forwardRef as forwardRef2 } from "react";
|
|
33
|
+
import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
34
|
+
var Switch = forwardRef2(function Switch2({
|
|
35
|
+
label,
|
|
36
|
+
className,
|
|
37
|
+
...props
|
|
38
|
+
}, ref) {
|
|
39
|
+
return /* @__PURE__ */ jsxs2("label", { className: ["ui-switch", className].filter(Boolean).join(" "), children: [
|
|
40
|
+
/* @__PURE__ */ jsx3("input", { "aria-label": label || "Toggle", ...props, ref, type: "checkbox" }),
|
|
41
|
+
/* @__PURE__ */ jsx3("span", { className: "ui-switch__track" })
|
|
42
|
+
] });
|
|
43
|
+
});
|
|
44
|
+
|
|
45
|
+
// src/primitives/Button.tsx
|
|
46
|
+
import { forwardRef as forwardRef3, useImperativeHandle, useLayoutEffect, useRef } from "react";
|
|
47
|
+
import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
20
48
|
var announcers = /* @__PURE__ */ new WeakMap();
|
|
21
49
|
function acquireAnnouncer(doc) {
|
|
22
50
|
let entry = announcers.get(doc);
|
|
@@ -48,10 +76,11 @@ function acquireAnnouncer(doc) {
|
|
|
48
76
|
};
|
|
49
77
|
}
|
|
50
78
|
var cx = (...a) => a.filter(Boolean).join(" ");
|
|
51
|
-
var Button =
|
|
79
|
+
var Button = forwardRef3(function Button2({
|
|
52
80
|
variant = "secondary",
|
|
53
81
|
size = "md",
|
|
54
82
|
icon: icon6,
|
|
83
|
+
leading,
|
|
55
84
|
iconRight,
|
|
56
85
|
iconOnly,
|
|
57
86
|
block,
|
|
@@ -59,7 +88,12 @@ var Button = forwardRef(function Button2({
|
|
|
59
88
|
completionMessage,
|
|
60
89
|
children,
|
|
61
90
|
type = "button",
|
|
91
|
+
href,
|
|
62
92
|
disabled,
|
|
93
|
+
className,
|
|
94
|
+
tabIndex,
|
|
95
|
+
onAuxClick,
|
|
96
|
+
onAuxClickCapture,
|
|
63
97
|
onClick,
|
|
64
98
|
onClickCapture,
|
|
65
99
|
onKeyDown,
|
|
@@ -69,7 +103,7 @@ var Button = forwardRef(function Button2({
|
|
|
69
103
|
...rest
|
|
70
104
|
}, forwardedRef) {
|
|
71
105
|
const buttonRef = useRef(null);
|
|
72
|
-
useImperativeHandle(forwardedRef, () => buttonRef.current, []);
|
|
106
|
+
useImperativeHandle(forwardedRef, () => buttonRef.current, [href !== void 0]);
|
|
73
107
|
const labelRef = useRef(null);
|
|
74
108
|
const announcer = useRef(null);
|
|
75
109
|
const hasBeenBusy = useRef(false);
|
|
@@ -94,35 +128,47 @@ var Button = forwardRef(function Button2({
|
|
|
94
128
|
previous.current = null;
|
|
95
129
|
}, []);
|
|
96
130
|
const blockActivation = (event) => {
|
|
97
|
-
if (!busy) return false;
|
|
131
|
+
if (!busy && !disabled) return false;
|
|
98
132
|
event.preventDefault();
|
|
99
133
|
event.stopPropagation();
|
|
100
134
|
return true;
|
|
101
135
|
};
|
|
102
|
-
const blockKey = (event) => (event.key === "Enter" || event.key === " ") && blockActivation(event);
|
|
136
|
+
const blockKey = (event) => (event.key === "Enter" || event.key === " " && href === void 0) && blockActivation(event);
|
|
103
137
|
const cls = cx(
|
|
104
138
|
"ui-btn",
|
|
105
139
|
variant && `ui-btn--${variant}`,
|
|
106
140
|
size !== "md" && `ui-btn--${size}`,
|
|
107
141
|
block && "ui-btn--block",
|
|
108
|
-
iconOnly && "ui-btn--icon"
|
|
142
|
+
iconOnly && "ui-btn--icon",
|
|
143
|
+
className
|
|
109
144
|
);
|
|
110
145
|
const labelled = rest["aria-label"] != null || rest["aria-labelledby"] != null;
|
|
111
146
|
const fallback = typeof children === "string" && children.trim() ? children.trim() : icon6;
|
|
112
147
|
const named = iconOnly && !labelled && fallback ? { "aria-label": fallback, title: rest.title ?? fallback } : {};
|
|
113
|
-
|
|
114
|
-
|
|
148
|
+
const Root = href === void 0 ? "button" : "a";
|
|
149
|
+
return /* @__PURE__ */ jsxs3(
|
|
150
|
+
Root,
|
|
115
151
|
{
|
|
152
|
+
...rest,
|
|
116
153
|
ref: buttonRef,
|
|
117
154
|
"data-btn-wired": "",
|
|
118
155
|
"data-btn-ready": !busy && hasBeenBusy.current ? "" : void 0,
|
|
119
|
-
type,
|
|
156
|
+
type: href === void 0 ? type : void 0,
|
|
157
|
+
href: disabled || busy ? void 0 : href,
|
|
158
|
+
role: href !== void 0 ? "link" : rest.role,
|
|
159
|
+
tabIndex: href !== void 0 && disabled ? -1 : href !== void 0 ? tabIndex ?? 0 : tabIndex,
|
|
160
|
+
"data-btn-disabled": disabled ? "" : void 0,
|
|
120
161
|
className: cls,
|
|
121
|
-
disabled,
|
|
162
|
+
disabled: href === void 0 ? disabled : void 0,
|
|
122
163
|
"aria-disabled": disabled || busy ? true : void 0,
|
|
123
164
|
"aria-busy": busy ? true : void 0,
|
|
124
|
-
...rest,
|
|
125
165
|
...named,
|
|
166
|
+
onAuxClickCapture: (event) => {
|
|
167
|
+
if (!blockActivation(event)) onAuxClickCapture?.(event);
|
|
168
|
+
},
|
|
169
|
+
onAuxClick: (event) => {
|
|
170
|
+
if (!blockActivation(event)) onAuxClick?.(event);
|
|
171
|
+
},
|
|
126
172
|
onClickCapture: (event) => {
|
|
127
173
|
if (!blockActivation(event)) onClickCapture?.(event);
|
|
128
174
|
},
|
|
@@ -142,13 +188,13 @@ var Button = forwardRef(function Button2({
|
|
|
142
188
|
if (!blockKey(event)) onKeyUp?.(event);
|
|
143
189
|
},
|
|
144
190
|
children: [
|
|
145
|
-
icon6 && /* @__PURE__ */
|
|
146
|
-
!iconOnly && renderedChildren != null && /* @__PURE__ */
|
|
147
|
-
iconRight && /* @__PURE__ */
|
|
148
|
-
busy && /* @__PURE__ */
|
|
149
|
-
/* @__PURE__ */
|
|
150
|
-
/* @__PURE__ */
|
|
151
|
-
/* @__PURE__ */
|
|
191
|
+
leading != null ? /* @__PURE__ */ jsx4("span", { "aria-hidden": "true", style: { display: "inline-flex" }, children: leading }) : icon6 && /* @__PURE__ */ jsx4(Icon, { name: icon6 }),
|
|
192
|
+
!iconOnly && renderedChildren != null && /* @__PURE__ */ jsx4("span", { className: "ui-btn__label-slot", children: /* @__PURE__ */ jsx4("span", { className: "ui-btn__label", ref: labelRef, children: renderedChildren }) }),
|
|
193
|
+
iconRight && /* @__PURE__ */ jsx4(Icon, { name: iconRight }),
|
|
194
|
+
busy && /* @__PURE__ */ jsxs3("span", { className: "ui-btn__dots", "aria-hidden": "true", children: [
|
|
195
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
196
|
+
/* @__PURE__ */ jsx4("i", {}),
|
|
197
|
+
/* @__PURE__ */ jsx4("i", {})
|
|
152
198
|
] })
|
|
153
199
|
]
|
|
154
200
|
}
|
|
@@ -156,35 +202,35 @@ var Button = forwardRef(function Button2({
|
|
|
156
202
|
});
|
|
157
203
|
|
|
158
204
|
// src/primitives/Badge.tsx
|
|
159
|
-
import { jsx as
|
|
205
|
+
import { jsx as jsx5 } from "react/jsx-runtime";
|
|
160
206
|
function Badge({ variant = "neutral", children }) {
|
|
161
207
|
const cls = ["ui-badge", variant !== "neutral" && `ui-badge--${variant}`].filter(Boolean).join(" ");
|
|
162
|
-
return /* @__PURE__ */
|
|
208
|
+
return /* @__PURE__ */ jsx5("span", { className: cls, children });
|
|
163
209
|
}
|
|
164
210
|
|
|
165
211
|
// src/primitives/Pill.tsx
|
|
166
|
-
import { forwardRef as
|
|
167
|
-
import { jsx as
|
|
168
|
-
var Pill =
|
|
212
|
+
import { forwardRef as forwardRef4 } from "react";
|
|
213
|
+
import { jsx as jsx6 } from "react/jsx-runtime";
|
|
214
|
+
var Pill = forwardRef4(function Pill2({
|
|
169
215
|
variant,
|
|
170
216
|
className,
|
|
171
217
|
...rest
|
|
172
218
|
}, ref) {
|
|
173
219
|
const classes = ["ui-pill", variant && `ui-pill--${variant}`, className].filter(Boolean).join(" ");
|
|
174
|
-
return /* @__PURE__ */
|
|
220
|
+
return /* @__PURE__ */ jsx6("span", { ...rest, ref, className: classes });
|
|
175
221
|
});
|
|
176
222
|
|
|
177
223
|
// src/primitives/StatusDot.tsx
|
|
178
|
-
import { forwardRef as
|
|
179
|
-
import { jsx as
|
|
180
|
-
var StatusDot =
|
|
224
|
+
import { forwardRef as forwardRef5 } from "react";
|
|
225
|
+
import { jsx as jsx7 } from "react/jsx-runtime";
|
|
226
|
+
var StatusDot = forwardRef5(function StatusDot2({
|
|
181
227
|
live = false,
|
|
182
228
|
className,
|
|
183
229
|
...rest
|
|
184
230
|
}, ref) {
|
|
185
231
|
const labelled = Boolean(rest["aria-label"]?.trim() || rest["aria-labelledby"]?.trim());
|
|
186
232
|
const classes = ["ui-dot", live && "is-live", className].filter(Boolean).join(" ");
|
|
187
|
-
return /* @__PURE__ */
|
|
233
|
+
return /* @__PURE__ */ jsx7(
|
|
188
234
|
"span",
|
|
189
235
|
{
|
|
190
236
|
role: labelled ? "img" : void 0,
|
|
@@ -197,27 +243,27 @@ var StatusDot = forwardRef3(function StatusDot2({
|
|
|
197
243
|
});
|
|
198
244
|
|
|
199
245
|
// src/primitives/Card.tsx
|
|
200
|
-
import { jsx as
|
|
246
|
+
import { jsx as jsx8, jsxs as jsxs4 } from "react/jsx-runtime";
|
|
201
247
|
function Card({ title, sub, level = 2, children }) {
|
|
202
248
|
const n = Number(level);
|
|
203
249
|
const Heading = `h${[2, 3, 4, 5, 6].includes(n) ? n : 2}`;
|
|
204
250
|
const titled = title != null && title !== false && title !== "";
|
|
205
|
-
return /* @__PURE__ */
|
|
206
|
-
titled && /* @__PURE__ */
|
|
207
|
-
sub != null && /* @__PURE__ */
|
|
251
|
+
return /* @__PURE__ */ jsxs4("div", { className: "ui-card", children: [
|
|
252
|
+
titled && /* @__PURE__ */ jsx8(Heading, { className: "ui-card__title", children: title }),
|
|
253
|
+
sub != null && /* @__PURE__ */ jsx8("div", { className: "ui-card__sub", children: sub }),
|
|
208
254
|
children
|
|
209
255
|
] });
|
|
210
256
|
}
|
|
211
257
|
|
|
212
258
|
// src/primitives/Callout.tsx
|
|
213
259
|
import { calloutIcons, icon as kitIcon } from "@apliteni/apliteni-ui";
|
|
214
|
-
import { jsx as
|
|
260
|
+
import { jsx as jsx9, jsxs as jsxs5 } from "react/jsx-runtime";
|
|
215
261
|
function Callout({ variant, icon: icon6 = calloutIcons[variant ?? "neutral"], children, actions }) {
|
|
216
|
-
return /* @__PURE__ */
|
|
217
|
-
/* @__PURE__ */
|
|
218
|
-
/* @__PURE__ */
|
|
262
|
+
return /* @__PURE__ */ jsxs5("div", { className: `ui-callout${variant && variant !== "neutral" ? ` ui-callout--${variant}` : ""}`, role: variant === "danger" ? "alert" : void 0, children: [
|
|
263
|
+
/* @__PURE__ */ jsx9("span", { className: "ui-callout__icon", dangerouslySetInnerHTML: { __html: kitIcon(icon6) } }),
|
|
264
|
+
/* @__PURE__ */ jsxs5("div", { className: "ui-callout__body", children: [
|
|
219
265
|
children,
|
|
220
|
-
actions != null && /* @__PURE__ */
|
|
266
|
+
actions != null && /* @__PURE__ */ jsx9("div", { className: "ui-toolbar ui-callout__actions", children: actions })
|
|
221
267
|
] })
|
|
222
268
|
] });
|
|
223
269
|
}
|
|
@@ -227,7 +273,7 @@ import { useId as useId2 } from "react";
|
|
|
227
273
|
|
|
228
274
|
// src/Tooltip.tsx
|
|
229
275
|
import { useEffect, useId, useLayoutEffect as useLayoutEffect2, useRef as useRef2, useState } from "react";
|
|
230
|
-
import { jsx as
|
|
276
|
+
import { jsx as jsx10, jsxs as jsxs6 } from "react/jsx-runtime";
|
|
231
277
|
function Tooltip({ text: text2, children }) {
|
|
232
278
|
const id = useId();
|
|
233
279
|
const host = useRef2(null);
|
|
@@ -283,8 +329,8 @@ function Tooltip({ text: text2, children }) {
|
|
|
283
329
|
view.removeEventListener("resize", place);
|
|
284
330
|
};
|
|
285
331
|
}, [open]);
|
|
286
|
-
return /* @__PURE__ */
|
|
287
|
-
/* @__PURE__ */
|
|
332
|
+
return /* @__PURE__ */ jsxs6("span", { ref: host, className: "ui-tip-host", style: { display: "inline-block" }, children: [
|
|
333
|
+
/* @__PURE__ */ jsx10(
|
|
288
334
|
"span",
|
|
289
335
|
{
|
|
290
336
|
ref: trigger,
|
|
@@ -321,12 +367,12 @@ function Tooltip({ text: text2, children }) {
|
|
|
321
367
|
children
|
|
322
368
|
}
|
|
323
369
|
),
|
|
324
|
-
/* @__PURE__ */
|
|
370
|
+
/* @__PURE__ */ jsx10("span", { ref: tip, id, role: "tooltip", className: `ui-tip${open ? " is-open" : ""}`, children: /* @__PURE__ */ jsx10("span", { className: "ui-tip__label", children: text2 }) })
|
|
325
371
|
] });
|
|
326
372
|
}
|
|
327
373
|
|
|
328
374
|
// src/primitives/StatBand.tsx
|
|
329
|
-
import { Fragment, jsx as
|
|
375
|
+
import { Fragment, jsx as jsx11, jsxs as jsxs7 } from "react/jsx-runtime";
|
|
330
376
|
var GLYPH = { up: "arrowUp", down: "arrowDown", flat: "minus" };
|
|
331
377
|
var directionOf = (text2) => {
|
|
332
378
|
const t = text2.trim();
|
|
@@ -335,15 +381,15 @@ var directionOf = (text2) => {
|
|
|
335
381
|
var hasChange = (d) => !!d && d.value != null && d.value !== "";
|
|
336
382
|
function Delta({ delta, basisId }) {
|
|
337
383
|
if (!hasChange(delta)) {
|
|
338
|
-
return /* @__PURE__ */
|
|
384
|
+
return /* @__PURE__ */ jsx11("dd", { className: "ui-stat__delta ui-stat__delta--none", children: delta.none || "No earlier figure" });
|
|
339
385
|
}
|
|
340
386
|
const dir = delta.direction && GLYPH[delta.direction] ? delta.direction : directionOf(delta.value);
|
|
341
|
-
return /* @__PURE__ */
|
|
342
|
-
/* @__PURE__ */
|
|
343
|
-
delta.tooltip ? /* @__PURE__ */
|
|
344
|
-
delta.basis ? /* @__PURE__ */
|
|
387
|
+
return /* @__PURE__ */ jsxs7("dd", { className: "ui-stat__delta", "aria-describedby": !delta.basis && basisId ? basisId : void 0, children: [
|
|
388
|
+
/* @__PURE__ */ jsx11(Icon, { name: GLYPH[dir] }),
|
|
389
|
+
delta.tooltip ? /* @__PURE__ */ jsx11(Tooltip, { text: delta.tooltip, children: /* @__PURE__ */ jsx11("span", { className: "ui-stat__change", children: delta.value }) }) : /* @__PURE__ */ jsx11("span", { className: "ui-stat__change", children: delta.value }),
|
|
390
|
+
delta.basis ? /* @__PURE__ */ jsxs7(Fragment, { children: [
|
|
345
391
|
" ",
|
|
346
|
-
/* @__PURE__ */
|
|
392
|
+
/* @__PURE__ */ jsx11("span", { className: "ui-stat__basis", children: delta.basis })
|
|
347
393
|
] }) : null
|
|
348
394
|
] });
|
|
349
395
|
}
|
|
@@ -352,16 +398,16 @@ function StatBand({ stats, variant = "tiles", basis, basisId: sharedBasisId, lab
|
|
|
352
398
|
const v = ["band", "tiles", "open"].includes(variant) ? variant : "tiles";
|
|
353
399
|
const basisId = basis ? `${id || auto}-basis` : sharedBasisId;
|
|
354
400
|
const root = ["ui-stats", `ui-stats--${v}`, v === "band" && "ui-card"].filter(Boolean).join(" ");
|
|
355
|
-
return /* @__PURE__ */
|
|
356
|
-
basis ? /* @__PURE__ */
|
|
357
|
-
/* @__PURE__ */
|
|
401
|
+
return /* @__PURE__ */ jsxs7("div", { className: root, role: label ? "group" : void 0, "aria-label": label || void 0, children: [
|
|
402
|
+
basis ? /* @__PURE__ */ jsx11("p", { className: "ui-stats__basis", id: basisId, children: basis }) : null,
|
|
403
|
+
/* @__PURE__ */ jsx11("dl", { className: "ui-stats__list", children: stats.map((s, i) => {
|
|
358
404
|
const tone = hasChange(s.delta) && (s.delta.tone === "good" || s.delta.tone === "bad") ? s.delta.tone : "";
|
|
359
405
|
const cls = ["ui-stat", tone && `ui-stat--${tone}`, v === "tiles" && "ui-card ui-card--pad-sm"].filter(Boolean).join(" ");
|
|
360
|
-
return /* @__PURE__ */
|
|
361
|
-
/* @__PURE__ */
|
|
362
|
-
/* @__PURE__ */
|
|
363
|
-
s.delta ? /* @__PURE__ */
|
|
364
|
-
s.trend ? /* @__PURE__ */
|
|
406
|
+
return /* @__PURE__ */ jsxs7("div", { className: cls, children: [
|
|
407
|
+
/* @__PURE__ */ jsx11("dt", { className: "ui-stat__label", children: s.label }),
|
|
408
|
+
/* @__PURE__ */ jsx11("dd", { className: "ui-stat__value", children: s.value }),
|
|
409
|
+
s.delta ? /* @__PURE__ */ jsx11(Delta, { delta: s.delta, basisId }) : null,
|
|
410
|
+
s.trend ? /* @__PURE__ */ jsx11("dd", { className: "ui-stat__trend", children: s.trend }) : null
|
|
365
411
|
] }, `${s.label}-${i}`);
|
|
366
412
|
}) })
|
|
367
413
|
] });
|
|
@@ -585,7 +631,7 @@ function useDialog(active, { root, panel, body, initialFocus }, onClose) {
|
|
|
585
631
|
}
|
|
586
632
|
|
|
587
633
|
// src/Modal.tsx
|
|
588
|
-
import { jsx as
|
|
634
|
+
import { jsx as jsx12, jsxs as jsxs8 } from "react/jsx-runtime";
|
|
589
635
|
function Modal({ open, title, onClose, footer, children, initialFocusRef, role = "dialog" }) {
|
|
590
636
|
const id = useId3();
|
|
591
637
|
const titleId = `${id}-title`;
|
|
@@ -597,7 +643,7 @@ function Modal({ open, title, onClose, footer, children, initialFocusRef, role =
|
|
|
597
643
|
const scope = useDialog(shown, { root, panel, body, initialFocus: initialFocusRef }, onClose);
|
|
598
644
|
if (!mounted) return null;
|
|
599
645
|
return createPortal(
|
|
600
|
-
/* @__PURE__ */
|
|
646
|
+
/* @__PURE__ */ jsx12(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsx12("div", { className: shown ? "rx-scrim is-open" : "rx-scrim", ref: root, onMouseDown: dismissOnScrim(onClose), children: /* @__PURE__ */ jsxs8(
|
|
601
647
|
"div",
|
|
602
648
|
{
|
|
603
649
|
className: "rx-modal",
|
|
@@ -608,12 +654,12 @@ function Modal({ open, title, onClose, footer, children, initialFocusRef, role =
|
|
|
608
654
|
tabIndex: -1,
|
|
609
655
|
ref: panel,
|
|
610
656
|
children: [
|
|
611
|
-
/* @__PURE__ */
|
|
612
|
-
/* @__PURE__ */
|
|
613
|
-
/* @__PURE__ */
|
|
657
|
+
/* @__PURE__ */ jsxs8("div", { className: "rx-modal__head", children: [
|
|
658
|
+
/* @__PURE__ */ jsx12("h2", { className: "rx-modal__title", id: titleId, children: title }),
|
|
659
|
+
/* @__PURE__ */ jsx12(Button, { variant: "ghost", size: "sm", iconOnly: true, icon: "x", "aria-label": "Close", onClick: onClose })
|
|
614
660
|
] }),
|
|
615
|
-
/* @__PURE__ */
|
|
616
|
-
footer && /* @__PURE__ */
|
|
661
|
+
/* @__PURE__ */ jsx12("div", { className: "rx-modal__body", id: bodyId, ref: body, children }),
|
|
662
|
+
footer && /* @__PURE__ */ jsx12("div", { className: "rx-modal__foot", children: footer })
|
|
617
663
|
]
|
|
618
664
|
}
|
|
619
665
|
) }) }),
|
|
@@ -622,7 +668,7 @@ function Modal({ open, title, onClose, footer, children, initialFocusRef, role =
|
|
|
622
668
|
}
|
|
623
669
|
|
|
624
670
|
// src/Confirm.tsx
|
|
625
|
-
import { Fragment as Fragment2, jsx as
|
|
671
|
+
import { Fragment as Fragment2, jsx as jsx13, jsxs as jsxs9 } from "react/jsx-runtime";
|
|
626
672
|
function Confirm({
|
|
627
673
|
open,
|
|
628
674
|
title,
|
|
@@ -635,7 +681,7 @@ function Confirm({
|
|
|
635
681
|
onCancel
|
|
636
682
|
}) {
|
|
637
683
|
const safeAction = useRef5(null);
|
|
638
|
-
return /* @__PURE__ */
|
|
684
|
+
return /* @__PURE__ */ jsx13(
|
|
639
685
|
Modal,
|
|
640
686
|
{
|
|
641
687
|
open,
|
|
@@ -643,9 +689,9 @@ function Confirm({
|
|
|
643
689
|
onClose: onCancel,
|
|
644
690
|
role: "alertdialog",
|
|
645
691
|
initialFocusRef: safeAction,
|
|
646
|
-
footer: /* @__PURE__ */
|
|
647
|
-
/* @__PURE__ */
|
|
648
|
-
/* @__PURE__ */
|
|
692
|
+
footer: /* @__PURE__ */ jsxs9(Fragment2, { children: [
|
|
693
|
+
/* @__PURE__ */ jsx13(Button, { ref: safeAction, variant: "ghost", onClick: onCancel, children: cancelLabel }),
|
|
694
|
+
/* @__PURE__ */ jsx13(Button, { variant: danger ? "danger" : "primary", busy, onClick: onConfirm, children: confirmLabel })
|
|
649
695
|
] }),
|
|
650
696
|
children: body
|
|
651
697
|
}
|
|
@@ -655,7 +701,7 @@ function Confirm({
|
|
|
655
701
|
// src/Drawer.tsx
|
|
656
702
|
import { useId as useId4, useRef as useRef6 } from "react";
|
|
657
703
|
import { createPortal as createPortal2 } from "react-dom";
|
|
658
|
-
import { jsx as
|
|
704
|
+
import { jsx as jsx14, jsxs as jsxs10 } from "react/jsx-runtime";
|
|
659
705
|
function Drawer({
|
|
660
706
|
open,
|
|
661
707
|
title,
|
|
@@ -675,9 +721,9 @@ function Drawer({
|
|
|
675
721
|
if (!mounted) return null;
|
|
676
722
|
const cls = ["ui-drawer", `ui-drawer--${side}`, `ui-drawer--${size}`, shown && "is-open"].filter(Boolean).join(" ");
|
|
677
723
|
return createPortal2(
|
|
678
|
-
/* @__PURE__ */
|
|
679
|
-
/* @__PURE__ */
|
|
680
|
-
/* @__PURE__ */
|
|
724
|
+
/* @__PURE__ */ jsx14(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs10("div", { className: cls, ref: root, children: [
|
|
725
|
+
/* @__PURE__ */ jsx14("div", { className: "ui-drawer__scrim", onMouseDown: dismissOnScrim(onClose) }),
|
|
726
|
+
/* @__PURE__ */ jsxs10(
|
|
681
727
|
"aside",
|
|
682
728
|
{
|
|
683
729
|
className: "ui-drawer__panel",
|
|
@@ -687,12 +733,12 @@ function Drawer({
|
|
|
687
733
|
tabIndex: -1,
|
|
688
734
|
ref: panel,
|
|
689
735
|
children: [
|
|
690
|
-
/* @__PURE__ */
|
|
691
|
-
/* @__PURE__ */
|
|
692
|
-
/* @__PURE__ */
|
|
736
|
+
/* @__PURE__ */ jsxs10("header", { className: "ui-drawer__header", children: [
|
|
737
|
+
/* @__PURE__ */ jsx14("h2", { className: "ui-drawer__title", id: titleId, children: title }),
|
|
738
|
+
/* @__PURE__ */ jsx14("button", { type: "button", className: "ui-drawer__close", "aria-label": closeLabel, onClick: onClose, children: /* @__PURE__ */ jsx14(Icon, { name: "x" }) })
|
|
693
739
|
] }),
|
|
694
|
-
/* @__PURE__ */
|
|
695
|
-
footer && /* @__PURE__ */
|
|
740
|
+
/* @__PURE__ */ jsx14("div", { className: "ui-drawer__body", ref: body, children }),
|
|
741
|
+
footer && /* @__PURE__ */ jsx14("footer", { className: "ui-drawer__footer", children: footer })
|
|
696
742
|
]
|
|
697
743
|
}
|
|
698
744
|
)
|
|
@@ -705,9 +751,9 @@ function Drawer({
|
|
|
705
751
|
import { useCallback, useEffect as useEffect3, useId as useId5, useMemo, useRef as useRef7, useState as useState3 } from "react";
|
|
706
752
|
import { createPortal as createPortal3 } from "react-dom";
|
|
707
753
|
import { rankGroups, icon as icon2 } from "@apliteni/apliteni-ui";
|
|
708
|
-
import { jsx as
|
|
754
|
+
import { jsx as jsx15, jsxs as jsxs11 } from "react/jsx-runtime";
|
|
709
755
|
var cx2 = (...a) => a.filter(Boolean).join(" ");
|
|
710
|
-
var Glyph = ({ name, className }) => /* @__PURE__ */
|
|
756
|
+
var Glyph = ({ name, className }) => /* @__PURE__ */ jsx15("span", { className, "aria-hidden": "true", dangerouslySetInnerHTML: { __html: icon2(name) } });
|
|
711
757
|
var keysOf = (shortcut) => shortcut == null ? [] : Array.isArray(shortcut) ? shortcut : [shortcut];
|
|
712
758
|
function CommandPalette({
|
|
713
759
|
open,
|
|
@@ -772,9 +818,9 @@ function CommandPalette({
|
|
|
772
818
|
const listId = `${uid}-list`;
|
|
773
819
|
let n = 0;
|
|
774
820
|
return createPortal3(
|
|
775
|
-
/* @__PURE__ */
|
|
776
|
-
/* @__PURE__ */
|
|
777
|
-
/* @__PURE__ */
|
|
821
|
+
/* @__PURE__ */ jsx15(DialogScope.Provider, { value: scope, children: /* @__PURE__ */ jsxs11("div", { className: cx2("ui-cmdk", density === "roomy" && "ui-cmdk--roomy", "is-open"), ref: root, children: [
|
|
822
|
+
/* @__PURE__ */ jsx15("div", { className: "ui-cmdk__scrim", onMouseDown: dismissOnScrim(onClose) }),
|
|
823
|
+
/* @__PURE__ */ jsxs11(
|
|
778
824
|
"div",
|
|
779
825
|
{
|
|
780
826
|
className: "ui-cmdk__panel",
|
|
@@ -785,9 +831,9 @@ function CommandPalette({
|
|
|
785
831
|
ref: panel,
|
|
786
832
|
onKeyDown,
|
|
787
833
|
children: [
|
|
788
|
-
/* @__PURE__ */
|
|
789
|
-
/* @__PURE__ */
|
|
790
|
-
/* @__PURE__ */
|
|
834
|
+
/* @__PURE__ */ jsxs11("div", { className: "ui-cmdk__search", ref: search, children: [
|
|
835
|
+
/* @__PURE__ */ jsx15(Glyph, { name: "search", className: "ui-cmdk__search-ic" }),
|
|
836
|
+
/* @__PURE__ */ jsx15(
|
|
791
837
|
"input",
|
|
792
838
|
{
|
|
793
839
|
className: "ui-cmdk__input",
|
|
@@ -809,19 +855,19 @@ function CommandPalette({
|
|
|
809
855
|
}
|
|
810
856
|
)
|
|
811
857
|
] }),
|
|
812
|
-
/* @__PURE__ */
|
|
858
|
+
/* @__PURE__ */ jsx15("div", { className: "ui-cmdk__list", id: listId, role: "listbox", "aria-label": `${label} results`, children: shown.map((group, gi) => /* @__PURE__ */ jsxs11(
|
|
813
859
|
"div",
|
|
814
860
|
{
|
|
815
861
|
className: "ui-cmdk__group",
|
|
816
862
|
role: "group",
|
|
817
863
|
"aria-labelledby": group.label ? `${uid}-g${gi}` : void 0,
|
|
818
864
|
children: [
|
|
819
|
-
group.label && /* @__PURE__ */
|
|
865
|
+
group.label && /* @__PURE__ */ jsx15("div", { className: "ui-cmdk__group-head", id: `${uid}-g${gi}`, children: group.label }),
|
|
820
866
|
group.items.map((item) => {
|
|
821
867
|
const disabled = isDisabled(item);
|
|
822
868
|
const id = `${uid}-o${n++}`;
|
|
823
869
|
const on = item === active;
|
|
824
|
-
return /* @__PURE__ */
|
|
870
|
+
return /* @__PURE__ */ jsxs11(
|
|
825
871
|
"div",
|
|
826
872
|
{
|
|
827
873
|
id,
|
|
@@ -841,13 +887,13 @@ function CommandPalette({
|
|
|
841
887
|
},
|
|
842
888
|
onClick: (e) => run(item, e.metaKey || e.ctrlKey),
|
|
843
889
|
children: [
|
|
844
|
-
item.icon && /* @__PURE__ */
|
|
845
|
-
/* @__PURE__ */
|
|
846
|
-
/* @__PURE__ */
|
|
847
|
-
item.description && /* @__PURE__ */
|
|
890
|
+
item.icon && /* @__PURE__ */ jsx15(Glyph, { name: item.icon, className: "ui-cmdk__ic" }),
|
|
891
|
+
/* @__PURE__ */ jsxs11("span", { className: "ui-cmdk__main", children: [
|
|
892
|
+
/* @__PURE__ */ jsx15("span", { className: "ui-cmdk__label", children: item.label }),
|
|
893
|
+
item.description && /* @__PURE__ */ jsx15("span", { className: "ui-cmdk__desc", children: item.description })
|
|
848
894
|
] }),
|
|
849
|
-
item.badge && /* @__PURE__ */
|
|
850
|
-
keysOf(item.shortcut).length > 0 && /* @__PURE__ */
|
|
895
|
+
item.badge && /* @__PURE__ */ jsx15("span", { className: "ui-cmdk__badge", children: item.badge }),
|
|
896
|
+
keysOf(item.shortcut).length > 0 && /* @__PURE__ */ jsx15("span", { className: "ui-cmdk__keys", "aria-hidden": "true", children: keysOf(item.shortcut).map((k) => /* @__PURE__ */ jsx15("kbd", { className: "ui-cmdk__key", children: k }, k)) })
|
|
851
897
|
]
|
|
852
898
|
},
|
|
853
899
|
item.id
|
|
@@ -857,20 +903,20 @@ function CommandPalette({
|
|
|
857
903
|
},
|
|
858
904
|
group.label ?? `g${gi}`
|
|
859
905
|
)) }),
|
|
860
|
-
/* @__PURE__ */
|
|
861
|
-
/* @__PURE__ */
|
|
862
|
-
hint && /* @__PURE__ */
|
|
863
|
-
/* @__PURE__ */
|
|
864
|
-
/* @__PURE__ */
|
|
865
|
-
/* @__PURE__ */
|
|
906
|
+
/* @__PURE__ */ jsx15("p", { className: "ui-cmdk__empty", hidden: countOf(shown) > 0, children: empty }),
|
|
907
|
+
/* @__PURE__ */ jsx15("p", { className: "ui-sr", role: "status", "aria-live": "polite", children: countOf(shown) === 0 ? "No results" : `${countOf(shown)} result${countOf(shown) === 1 ? "" : "s"}` }),
|
|
908
|
+
hint && /* @__PURE__ */ jsxs11("div", { className: "ui-cmdk__foot", "aria-hidden": "true", children: [
|
|
909
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
910
|
+
/* @__PURE__ */ jsx15("kbd", { className: "ui-cmdk__key", children: "\u2191" }),
|
|
911
|
+
/* @__PURE__ */ jsx15("kbd", { className: "ui-cmdk__key", children: "\u2193" }),
|
|
866
912
|
" move"
|
|
867
913
|
] }),
|
|
868
|
-
/* @__PURE__ */
|
|
869
|
-
/* @__PURE__ */
|
|
914
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
915
|
+
/* @__PURE__ */ jsx15("kbd", { className: "ui-cmdk__key", children: "\u21B5" }),
|
|
870
916
|
" run"
|
|
871
917
|
] }),
|
|
872
|
-
/* @__PURE__ */
|
|
873
|
-
/* @__PURE__ */
|
|
918
|
+
/* @__PURE__ */ jsxs11("span", { children: [
|
|
919
|
+
/* @__PURE__ */ jsx15("kbd", { className: "ui-cmdk__key", children: "esc" }),
|
|
874
920
|
" close"
|
|
875
921
|
] })
|
|
876
922
|
] })
|
|
@@ -901,7 +947,7 @@ import { DEFAULT_PAGE_SIZE as DEFAULT_PAGE_SIZE2 } from "@apliteni/apliteni-ui";
|
|
|
901
947
|
// src/Pagination.tsx
|
|
902
948
|
import { useEffect as useEffect4, useId as useId6, useRef as useRef8, useState as useState4 } from "react";
|
|
903
949
|
import { DEFAULT_PAGE_SIZE } from "@apliteni/apliteni-ui";
|
|
904
|
-
import { jsx as
|
|
950
|
+
import { jsx as jsx16, jsxs as jsxs12 } from "react/jsx-runtime";
|
|
905
951
|
var GHOST_SM = "ui-btn ui-btn--ghost ui-btn--sm";
|
|
906
952
|
var VARIANTS = ["steps", "numbered", "jump"];
|
|
907
953
|
var cx3 = (...a) => a.filter(Boolean).join(" ");
|
|
@@ -993,7 +1039,7 @@ function Pagination({
|
|
|
993
1039
|
const step = (label_, target, disabled) => (
|
|
994
1040
|
// A control at an end is disabled and stays where it is: removing it slides
|
|
995
1041
|
// the next control under a pointer already travelling toward it.
|
|
996
|
-
/* @__PURE__ */
|
|
1042
|
+
/* @__PURE__ */ jsx16(
|
|
997
1043
|
"button",
|
|
998
1044
|
{
|
|
999
1045
|
type: "button",
|
|
@@ -1032,14 +1078,14 @@ function Pagination({
|
|
|
1032
1078
|
if (single) {
|
|
1033
1079
|
steps = null;
|
|
1034
1080
|
} else if (!counted) {
|
|
1035
|
-
steps = /* @__PURE__ */
|
|
1081
|
+
steps = /* @__PURE__ */ jsxs12("div", { className: "ui-pager__steps", children: [
|
|
1036
1082
|
step("Prev", Math.max(1, at - 1), atStart),
|
|
1037
1083
|
step("Next", at + 1, !hasMore)
|
|
1038
1084
|
] });
|
|
1039
1085
|
} else {
|
|
1040
1086
|
let middle = null;
|
|
1041
1087
|
if (kind === "numbered") {
|
|
1042
|
-
middle = slotsFor(at, last).map((n, i) => n == null ? /* @__PURE__ */
|
|
1088
|
+
middle = slotsFor(at, last).map((n, i) => n == null ? /* @__PURE__ */ jsx16("span", { className: "ui-pager__gap", "aria-hidden": "true", children: "\u2026" }, `gap${i}`) : /* @__PURE__ */ jsx16(
|
|
1043
1089
|
"button",
|
|
1044
1090
|
{
|
|
1045
1091
|
type: "button",
|
|
@@ -1054,9 +1100,9 @@ function Pagination({
|
|
|
1054
1100
|
n
|
|
1055
1101
|
));
|
|
1056
1102
|
} else if (kind === "jump") {
|
|
1057
|
-
middle = /* @__PURE__ */
|
|
1058
|
-
/* @__PURE__ */
|
|
1059
|
-
/* @__PURE__ */
|
|
1103
|
+
middle = /* @__PURE__ */ jsxs12("span", { className: "ui-pager__jump", children: [
|
|
1104
|
+
/* @__PURE__ */ jsx16("label", { htmlFor: `${uid}-jump`, children: "Page" }),
|
|
1105
|
+
/* @__PURE__ */ jsx16(
|
|
1060
1106
|
"input",
|
|
1061
1107
|
{
|
|
1062
1108
|
className: "ui-input ui-pager__jump-input",
|
|
@@ -1079,13 +1125,13 @@ function Pagination({
|
|
|
1079
1125
|
}
|
|
1080
1126
|
}
|
|
1081
1127
|
),
|
|
1082
|
-
/* @__PURE__ */
|
|
1128
|
+
/* @__PURE__ */ jsxs12("span", { className: "ui-pager__jump-of", children: [
|
|
1083
1129
|
"of ",
|
|
1084
1130
|
fmt(last)
|
|
1085
1131
|
] })
|
|
1086
1132
|
] });
|
|
1087
1133
|
}
|
|
1088
|
-
steps = /* @__PURE__ */
|
|
1134
|
+
steps = /* @__PURE__ */ jsxs12("div", { className: "ui-pager__steps", children: [
|
|
1089
1135
|
ends ? step("First", 1, atStart) : null,
|
|
1090
1136
|
step("Prev", Math.max(1, at - 1), atStart),
|
|
1091
1137
|
middle,
|
|
@@ -1093,7 +1139,7 @@ function Pagination({
|
|
|
1093
1139
|
ends ? step("Last", last, atEnd) : null
|
|
1094
1140
|
] });
|
|
1095
1141
|
}
|
|
1096
|
-
return /* @__PURE__ */
|
|
1142
|
+
return /* @__PURE__ */ jsxs12(
|
|
1097
1143
|
"nav",
|
|
1098
1144
|
{
|
|
1099
1145
|
ref: nav,
|
|
@@ -1101,10 +1147,10 @@ function Pagination({
|
|
|
1101
1147
|
"aria-label": label,
|
|
1102
1148
|
"aria-busy": loading ? true : void 0,
|
|
1103
1149
|
children: [
|
|
1104
|
-
/* @__PURE__ */
|
|
1105
|
-
sizes.length ? /* @__PURE__ */
|
|
1106
|
-
/* @__PURE__ */
|
|
1107
|
-
/* @__PURE__ */
|
|
1150
|
+
/* @__PURE__ */ jsx16("p", { className: "ui-pager__status", "aria-live": "polite", "aria-atomic": "true", children: status }),
|
|
1151
|
+
sizes.length ? /* @__PURE__ */ jsxs12("div", { className: "ui-pager__size", children: [
|
|
1152
|
+
/* @__PURE__ */ jsx16("label", { className: "ui-pager__size-label", htmlFor: `${uid}-size`, children: "Rows" }),
|
|
1153
|
+
/* @__PURE__ */ jsx16(
|
|
1108
1154
|
"select",
|
|
1109
1155
|
{
|
|
1110
1156
|
className: "ui-select ui-pager__size-select",
|
|
@@ -1112,7 +1158,7 @@ function Pagination({
|
|
|
1112
1158
|
disabled: loading,
|
|
1113
1159
|
value: size,
|
|
1114
1160
|
onChange: (e) => onPageSizeChange?.(Number(e.target.value)),
|
|
1115
|
-
children: sizes.map((s) => /* @__PURE__ */
|
|
1161
|
+
children: sizes.map((s) => /* @__PURE__ */ jsx16("option", { value: s, children: fmt(s) }, s))
|
|
1116
1162
|
}
|
|
1117
1163
|
)
|
|
1118
1164
|
] }) : null,
|
|
@@ -1123,7 +1169,7 @@ function Pagination({
|
|
|
1123
1169
|
}
|
|
1124
1170
|
|
|
1125
1171
|
// src/DataTable.tsx
|
|
1126
|
-
import { Fragment as Fragment3, jsx as
|
|
1172
|
+
import { Fragment as Fragment3, jsx as jsx17, jsxs as jsxs13 } from "react/jsx-runtime";
|
|
1127
1173
|
var NO_SORT = { key: void 0, dir: -1 };
|
|
1128
1174
|
function sortTableRows(rows, sort) {
|
|
1129
1175
|
if (sort.key === void 0) return [...rows];
|
|
@@ -1216,7 +1262,7 @@ function DataTable({
|
|
|
1216
1262
|
onSortChange?.(next);
|
|
1217
1263
|
toFirstPage();
|
|
1218
1264
|
};
|
|
1219
|
-
const caret = (k) => /* @__PURE__ */
|
|
1265
|
+
const caret = (k) => /* @__PURE__ */ jsx17(
|
|
1220
1266
|
"svg",
|
|
1221
1267
|
{
|
|
1222
1268
|
className: "rx-caret",
|
|
@@ -1228,19 +1274,19 @@ function DataTable({
|
|
|
1228
1274
|
strokeLinejoin: "round",
|
|
1229
1275
|
"aria-hidden": "true",
|
|
1230
1276
|
focusable: "false",
|
|
1231
|
-
children: sort.key === k ? /* @__PURE__ */
|
|
1232
|
-
/* @__PURE__ */
|
|
1233
|
-
/* @__PURE__ */
|
|
1277
|
+
children: sort.key === k ? /* @__PURE__ */ jsx17("path", { d: "m8 10 4 4 4-4" }) : /* @__PURE__ */ jsxs13(Fragment3, { children: [
|
|
1278
|
+
/* @__PURE__ */ jsx17("path", { d: "m8 9 4-4 4 4" }),
|
|
1279
|
+
/* @__PURE__ */ jsx17("path", { d: "m8 15 4 4 4-4" })
|
|
1234
1280
|
] })
|
|
1235
1281
|
}
|
|
1236
1282
|
);
|
|
1237
1283
|
const pageAllOn = selectable && slice.length > 0 && slice.every((r) => selected.has(r.name));
|
|
1238
|
-
return /* @__PURE__ */
|
|
1239
|
-
scrollable && columnScroll.overflow && /* @__PURE__ */
|
|
1240
|
-
/* @__PURE__ */
|
|
1241
|
-
/* @__PURE__ */
|
|
1284
|
+
return /* @__PURE__ */ jsxs13(Fragment3, { children: [
|
|
1285
|
+
scrollable && columnScroll.overflow && /* @__PURE__ */ jsxs13("div", { className: "ui-card__row", role: "group", "aria-label": `${scrollLabel} columns`, children: [
|
|
1286
|
+
/* @__PURE__ */ jsx17(Button, { size: "sm", icon: "arrowLeft", "aria-controls": scrollId, disabled: columnScroll.start, onClick: () => scrollColumns(-1), children: "Previous columns" }),
|
|
1287
|
+
/* @__PURE__ */ jsx17(Button, { size: "sm", iconRight: "arrowRight", "aria-controls": scrollId, disabled: columnScroll.end, onClick: () => scrollColumns(1), children: "More columns" })
|
|
1242
1288
|
] }),
|
|
1243
|
-
/* @__PURE__ */
|
|
1289
|
+
/* @__PURE__ */ jsx17(
|
|
1244
1290
|
"div",
|
|
1245
1291
|
{
|
|
1246
1292
|
id: scrollId,
|
|
@@ -1250,14 +1296,14 @@ function DataTable({
|
|
|
1250
1296
|
role: stickyHeader || pinnedIdentity ? "region" : void 0,
|
|
1251
1297
|
"aria-label": stickyHeader || pinnedIdentity ? scrollLabel : void 0,
|
|
1252
1298
|
tabIndex: stickyHeader || pinnedIdentity ? 0 : void 0,
|
|
1253
|
-
children: /* @__PURE__ */
|
|
1299
|
+
children: /* @__PURE__ */ jsxs13(
|
|
1254
1300
|
"table",
|
|
1255
1301
|
{
|
|
1256
1302
|
className: ["ui-table ui-table--hover", (density === "dense" || !density && dense) && "ui-table--dense", density === "compact" && "ui-table--compact", stickyHeader && "ui-table--sticky", pinnedIdentity && "ui-table--pinned"].filter(Boolean).join(" "),
|
|
1257
1303
|
"aria-busy": loading || void 0,
|
|
1258
1304
|
children: [
|
|
1259
|
-
/* @__PURE__ */
|
|
1260
|
-
selectable ? /* @__PURE__ */
|
|
1305
|
+
/* @__PURE__ */ jsx17("thead", { children: /* @__PURE__ */ jsxs13("tr", { children: [
|
|
1306
|
+
selectable ? /* @__PURE__ */ jsx17("th", { scope: "col", className: "ui-table__selection", children: /* @__PURE__ */ jsx17(
|
|
1261
1307
|
"input",
|
|
1262
1308
|
{
|
|
1263
1309
|
type: "checkbox",
|
|
@@ -1270,13 +1316,13 @@ function DataTable({
|
|
|
1270
1316
|
// The sort control is a real <button> inside the header cell. It used to be
|
|
1271
1317
|
// role="button" ON the <th>, which threw away the columnheader role and put
|
|
1272
1318
|
// aria-sort on a role that forbids it.
|
|
1273
|
-
/* @__PURE__ */
|
|
1319
|
+
/* @__PURE__ */ jsx17(
|
|
1274
1320
|
"th",
|
|
1275
1321
|
{
|
|
1276
1322
|
scope: "col",
|
|
1277
1323
|
className: [pinnedIdentity && columnIndex === 0 && "ui-table__identity", c.num && "ui-table__num", c.sortable && "rx-sortable"].filter(Boolean).join(" "),
|
|
1278
1324
|
"aria-sort": sort.key === c.key ? sort.dir === 1 ? "ascending" : "descending" : c.sortable && sortIsKnown ? "none" : void 0,
|
|
1279
|
-
children: c.sortable ? /* @__PURE__ */
|
|
1325
|
+
children: c.sortable ? /* @__PURE__ */ jsxs13("button", { type: "button", className: "rx-sort", onClick: () => onSort(c.key), children: [
|
|
1280
1326
|
c.label,
|
|
1281
1327
|
caret(c.key)
|
|
1282
1328
|
] }) : c.label
|
|
@@ -1285,10 +1331,10 @@ function DataTable({
|
|
|
1285
1331
|
)
|
|
1286
1332
|
))
|
|
1287
1333
|
] }) }),
|
|
1288
|
-
/* @__PURE__ */
|
|
1289
|
-
!slice.length && /* @__PURE__ */
|
|
1290
|
-
slice.map((r) => /* @__PURE__ */
|
|
1291
|
-
selectable ? /* @__PURE__ */
|
|
1334
|
+
/* @__PURE__ */ jsxs13("tbody", { children: [
|
|
1335
|
+
!slice.length && /* @__PURE__ */ jsx17("tr", { children: /* @__PURE__ */ jsx17("td", { colSpan: columns.length + (selectable ? 1 : 0), children: loading ? "Loading rows\u2026" : empty }) }),
|
|
1336
|
+
slice.map((r) => /* @__PURE__ */ jsxs13("tr", { children: [
|
|
1337
|
+
selectable ? /* @__PURE__ */ jsx17("td", { className: "ui-table__selection", children: /* @__PURE__ */ jsx17(
|
|
1292
1338
|
"input",
|
|
1293
1339
|
{
|
|
1294
1340
|
type: "checkbox",
|
|
@@ -1297,7 +1343,7 @@ function DataTable({
|
|
|
1297
1343
|
onChange: () => onToggle(r.name)
|
|
1298
1344
|
}
|
|
1299
1345
|
) }) : null,
|
|
1300
|
-
columns.map((c, columnIndex) => /* @__PURE__ */
|
|
1346
|
+
columns.map((c, columnIndex) => /* @__PURE__ */ jsx17("td", { className: [c.num && "ui-table__num", pinnedIdentity && columnIndex === 0 && "ui-table__identity"].filter(Boolean).join(" "), children: c.render ? c.render(r) : String(r[c.key]) }, c.key))
|
|
1301
1347
|
] }, r.name))
|
|
1302
1348
|
] })
|
|
1303
1349
|
]
|
|
@@ -1305,7 +1351,7 @@ function DataTable({
|
|
|
1305
1351
|
)
|
|
1306
1352
|
}
|
|
1307
1353
|
),
|
|
1308
|
-
pager ? /* @__PURE__ */
|
|
1354
|
+
pager ? /* @__PURE__ */ jsx17(
|
|
1309
1355
|
Pagination,
|
|
1310
1356
|
{
|
|
1311
1357
|
page,
|
|
@@ -1330,7 +1376,7 @@ function DataTable({
|
|
|
1330
1376
|
import { PAGE_SIZES as KIT_PAGE_SIZES, DEFAULT_PAGE_SIZE as KIT_DEFAULT_PAGE_SIZE } from "@apliteni/apliteni-ui";
|
|
1331
1377
|
|
|
1332
1378
|
// src/Loading.tsx
|
|
1333
|
-
import { jsx as
|
|
1379
|
+
import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
|
|
1334
1380
|
var cx4 = (...a) => a.filter(Boolean).join(" ");
|
|
1335
1381
|
function Skeleton({ lines = 3, width, height, radius, className }) {
|
|
1336
1382
|
const widths = Array.isArray(lines) ? lines : null;
|
|
@@ -1340,19 +1386,19 @@ function Skeleton({ lines = 3, width, height, radius, className }) {
|
|
|
1340
1386
|
if (!w && !height && !radius) return void 0;
|
|
1341
1387
|
return { ...w && { width: w }, ...height && { height }, ...radius && { borderRadius: radius } };
|
|
1342
1388
|
};
|
|
1343
|
-
return /* @__PURE__ */
|
|
1389
|
+
return /* @__PURE__ */ jsx18("div", { className: cx4("ui-skel", className), "aria-hidden": "true", children: Array.from({ length: n }, (_, i) => /* @__PURE__ */ jsx18("span", { className: "ui-skel__bar m-skeleton", style: styleFor(i) }, i)) });
|
|
1344
1390
|
}
|
|
1345
1391
|
function SkeletonTable({ rows = 5, cols = 4, head = true }) {
|
|
1346
|
-
const cells = Array.from({ length: Math.max(1, cols) }, (_, i) => /* @__PURE__ */
|
|
1347
|
-
return /* @__PURE__ */
|
|
1392
|
+
const cells = Array.from({ length: Math.max(1, cols) }, (_, i) => /* @__PURE__ */ jsx18("span", { className: "ui-skel__bar m-skeleton" }, i));
|
|
1393
|
+
return /* @__PURE__ */ jsxs14(
|
|
1348
1394
|
"div",
|
|
1349
1395
|
{
|
|
1350
1396
|
className: "ui-skel ui-skel--table",
|
|
1351
1397
|
style: { "--skel-cols": Math.max(1, cols) },
|
|
1352
1398
|
"aria-hidden": "true",
|
|
1353
1399
|
children: [
|
|
1354
|
-
head && /* @__PURE__ */
|
|
1355
|
-
Array.from({ length: Math.max(1, rows) }, (_, i) => /* @__PURE__ */
|
|
1400
|
+
head && /* @__PURE__ */ jsx18("div", { className: "ui-skel__row ui-skel__row--head", children: cells }),
|
|
1401
|
+
Array.from({ length: Math.max(1, rows) }, (_, i) => /* @__PURE__ */ jsx18("div", { className: "ui-skel__row", children: cells }, i))
|
|
1356
1402
|
]
|
|
1357
1403
|
}
|
|
1358
1404
|
);
|
|
@@ -1365,7 +1411,7 @@ function BusyRegion({
|
|
|
1365
1411
|
className,
|
|
1366
1412
|
children
|
|
1367
1413
|
}) {
|
|
1368
|
-
return /* @__PURE__ */
|
|
1414
|
+
return /* @__PURE__ */ jsxs14(
|
|
1369
1415
|
"div",
|
|
1370
1416
|
{
|
|
1371
1417
|
className: cx4("ui-busy", className),
|
|
@@ -1373,8 +1419,8 @@ function BusyRegion({
|
|
|
1373
1419
|
"aria-live": "polite",
|
|
1374
1420
|
"aria-busy": busy,
|
|
1375
1421
|
children: [
|
|
1376
|
-
/* @__PURE__ */
|
|
1377
|
-
/* @__PURE__ */
|
|
1422
|
+
/* @__PURE__ */ jsx18("span", { className: "ui-sr", children: busy ? label : message }),
|
|
1423
|
+
/* @__PURE__ */ jsx18("div", { className: "ui-busy__body", children: busy ? placeholder ?? /* @__PURE__ */ jsx18(Skeleton, { lines: 3 }) : children })
|
|
1378
1424
|
]
|
|
1379
1425
|
}
|
|
1380
1426
|
);
|
|
@@ -1387,15 +1433,15 @@ function Denied({
|
|
|
1387
1433
|
className,
|
|
1388
1434
|
children
|
|
1389
1435
|
}) {
|
|
1390
|
-
return /* @__PURE__ */
|
|
1391
|
-
/* @__PURE__ */
|
|
1392
|
-
/* @__PURE__ */
|
|
1393
|
-
sub && /* @__PURE__ */
|
|
1394
|
-
need && /* @__PURE__ */
|
|
1436
|
+
return /* @__PURE__ */ jsxs14("div", { className: cx4("ui-denied", className), children: [
|
|
1437
|
+
/* @__PURE__ */ jsx18("div", { className: "ui-denied__seal", children: /* @__PURE__ */ jsx18(Icon, { name: icon6 }) }),
|
|
1438
|
+
/* @__PURE__ */ jsx18("div", { className: "ui-denied__title", children: title }),
|
|
1439
|
+
sub && /* @__PURE__ */ jsx18("div", { className: "ui-denied__sub", children: sub }),
|
|
1440
|
+
need && /* @__PURE__ */ jsxs14("div", { className: "ui-denied__need", children: [
|
|
1395
1441
|
"Needs ",
|
|
1396
|
-
/* @__PURE__ */
|
|
1442
|
+
/* @__PURE__ */ jsx18("code", { className: "ui-code", children: need })
|
|
1397
1443
|
] }),
|
|
1398
|
-
children && /* @__PURE__ */
|
|
1444
|
+
children && /* @__PURE__ */ jsx18("div", { className: "ui-denied__actions", children })
|
|
1399
1445
|
] });
|
|
1400
1446
|
}
|
|
1401
1447
|
|
|
@@ -1409,10 +1455,10 @@ import {
|
|
|
1409
1455
|
useState as useState6
|
|
1410
1456
|
} from "react";
|
|
1411
1457
|
import { icon as icon3, dropdownMatch, dropdownFiltering } from "@apliteni/apliteni-ui";
|
|
1412
|
-
import { Fragment as Fragment5, jsx as
|
|
1458
|
+
import { Fragment as Fragment5, jsx as jsx19, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
1413
1459
|
var cx5 = (...a) => a.filter(Boolean).join(" ");
|
|
1414
1460
|
var isRow = (it) => Boolean(it) && it !== "---" && !it.separator;
|
|
1415
|
-
var Glyph2 = ({ name, className, hidden }) => /* @__PURE__ */
|
|
1461
|
+
var Glyph2 = ({ name, className, hidden }) => /* @__PURE__ */ jsx19(
|
|
1416
1462
|
"span",
|
|
1417
1463
|
{
|
|
1418
1464
|
className,
|
|
@@ -1425,7 +1471,7 @@ function RowBadge({ badge }) {
|
|
|
1425
1471
|
const given = typeof badge === "string" ? "" : badge.tone || "";
|
|
1426
1472
|
let tone = given || (/^live$/i.test(String(text2)) ? "live" : "neutral");
|
|
1427
1473
|
if (!given && tone === "neutral" && /^(?:off|unset|disabled|archive|archived)$/i.test(text2)) tone = "state";
|
|
1428
|
-
return /* @__PURE__ */
|
|
1474
|
+
return /* @__PURE__ */ jsx19("span", { className: `ui-dropdown__badge is-${tone}`, children: text2 });
|
|
1429
1475
|
}
|
|
1430
1476
|
var keyOf = (it) => it.value != null ? `v:${it.value}` : `l:${it.label}`;
|
|
1431
1477
|
var itemsIn = (panel) => Array.from(panel?.querySelectorAll("[data-dd-item]") ?? []).filter((el) => el.getAttribute("aria-disabled") !== "true" && !el.hidden);
|
|
@@ -1640,7 +1686,7 @@ function Dropdown({
|
|
|
1640
1686
|
};
|
|
1641
1687
|
function renderRow(entry, key) {
|
|
1642
1688
|
if (!isRow(entry)) {
|
|
1643
|
-
return /* @__PURE__ */
|
|
1689
|
+
return /* @__PURE__ */ jsx19("div", { className: "ui-dropdown__sep", role: "separator", hidden: filtering || void 0 }, key);
|
|
1644
1690
|
}
|
|
1645
1691
|
const disabled = !!entry.disabled;
|
|
1646
1692
|
const selected = selectedOf(entry);
|
|
@@ -1662,23 +1708,23 @@ function Dropdown({
|
|
|
1662
1708
|
...asLink ? { href: entry.href, ...entry.target ? { target: entry.target } : null } : null,
|
|
1663
1709
|
...sx ? { id: rowIds.get(entry), hidden: hiddenBy(entry) || void 0 } : null,
|
|
1664
1710
|
onClick: (e) => choose(entry, e),
|
|
1665
|
-
children: /* @__PURE__ */
|
|
1666
|
-
entry.icon && /* @__PURE__ */
|
|
1667
|
-
/* @__PURE__ */
|
|
1668
|
-
/* @__PURE__ */
|
|
1669
|
-
entry.description && /* @__PURE__ */
|
|
1711
|
+
children: /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
1712
|
+
entry.icon && /* @__PURE__ */ jsx19(Glyph2, { name: entry.icon, className: "ui-dropdown__ic" }),
|
|
1713
|
+
/* @__PURE__ */ jsxs15("span", { className: "ui-dropdown__main", children: [
|
|
1714
|
+
/* @__PURE__ */ jsx19("span", { className: "ui-dropdown__label", children: entry.label }),
|
|
1715
|
+
entry.description && /* @__PURE__ */ jsx19("span", { className: "ui-dropdown__desc", children: entry.description })
|
|
1670
1716
|
] }),
|
|
1671
|
-
entry.badge ? /* @__PURE__ */
|
|
1672
|
-
asOption && /* @__PURE__ */
|
|
1717
|
+
entry.badge ? /* @__PURE__ */ jsx19(RowBadge, { badge: entry.badge }) : null,
|
|
1718
|
+
asOption && /* @__PURE__ */ jsx19(Glyph2, { name: "check", className: "ui-dropdown__tick", hidden: true })
|
|
1673
1719
|
] })
|
|
1674
1720
|
};
|
|
1675
|
-
if (row) return /* @__PURE__ */
|
|
1721
|
+
if (row) return /* @__PURE__ */ jsx19(Fragment4, { children: row(entry, props) }, key);
|
|
1676
1722
|
const Tag = asLink ? "a" : "div";
|
|
1677
|
-
return /* @__PURE__ */
|
|
1723
|
+
return /* @__PURE__ */ jsx19(Tag, { ...props }, key);
|
|
1678
1724
|
}
|
|
1679
1725
|
const body = sections?.length ? sections.map((section, si) => {
|
|
1680
1726
|
const gone = filtering && !(section.items || []).some((it) => isRow(it) && !hiddenBy(it));
|
|
1681
|
-
return /* @__PURE__ */
|
|
1727
|
+
return /* @__PURE__ */ jsxs15(
|
|
1682
1728
|
"div",
|
|
1683
1729
|
{
|
|
1684
1730
|
className: "ui-dropdown__section",
|
|
@@ -1686,7 +1732,7 @@ function Dropdown({
|
|
|
1686
1732
|
"aria-label": section.label || void 0,
|
|
1687
1733
|
hidden: gone || void 0,
|
|
1688
1734
|
children: [
|
|
1689
|
-
section.label && /* @__PURE__ */
|
|
1735
|
+
section.label && /* @__PURE__ */ jsx19("div", { className: "ui-dropdown__group", role: "presentation", children: section.label }),
|
|
1690
1736
|
(section.items || []).map((entry, i) => renderRow(entry, `s${si}-${i}`))
|
|
1691
1737
|
]
|
|
1692
1738
|
},
|
|
@@ -1694,12 +1740,12 @@ function Dropdown({
|
|
|
1694
1740
|
);
|
|
1695
1741
|
}) : (items || []).map((entry, i) => renderRow(entry, `i${i}`));
|
|
1696
1742
|
const cap = scroll && scroll !== true ? { maxHeight: typeof scroll === "number" ? `${scroll}px` : scroll } : void 0;
|
|
1697
|
-
const none = sx && filtering && !visible.length ? /* @__PURE__ */
|
|
1698
|
-
/* @__PURE__ */
|
|
1699
|
-
/* @__PURE__ */
|
|
1743
|
+
const none = sx && filtering && !visible.length ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
1744
|
+
/* @__PURE__ */ jsx19("span", { className: "ui-dropdown__none-title", children: sx.empty.replace("{q}", () => query.trim()) }),
|
|
1745
|
+
/* @__PURE__ */ jsx19("span", { className: "ui-dropdown__none-hint", children: sx.hint })
|
|
1700
1746
|
] }) : null;
|
|
1701
|
-
return /* @__PURE__ */
|
|
1702
|
-
/* @__PURE__ */
|
|
1747
|
+
return /* @__PURE__ */ jsxs15("div", { className: cx5("ui-dropdown", open && "open"), id, ref: root, onKeyDown, children: [
|
|
1748
|
+
/* @__PURE__ */ jsxs15(
|
|
1703
1749
|
"button",
|
|
1704
1750
|
{
|
|
1705
1751
|
type: "button",
|
|
@@ -1714,15 +1760,15 @@ function Dropdown({
|
|
|
1714
1760
|
setOpen(!open);
|
|
1715
1761
|
},
|
|
1716
1762
|
children: [
|
|
1717
|
-
triggerContent != null ? triggerContent : /* @__PURE__ */
|
|
1718
|
-
label && /* @__PURE__ */
|
|
1719
|
-
/* @__PURE__ */
|
|
1763
|
+
triggerContent != null ? triggerContent : /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
1764
|
+
label && /* @__PURE__ */ jsx19("span", { className: "ui-dropdown__pre", children: label }),
|
|
1765
|
+
/* @__PURE__ */ jsx19("span", { className: "ui-dropdown__value", children: shown != null ? shown : placeholder })
|
|
1720
1766
|
] }),
|
|
1721
|
-
chevron && /* @__PURE__ */
|
|
1767
|
+
chevron && /* @__PURE__ */ jsx19("span", { className: "ui-dropdown__chevron", "aria-hidden": "true" })
|
|
1722
1768
|
]
|
|
1723
1769
|
}
|
|
1724
1770
|
),
|
|
1725
|
-
/* @__PURE__ */
|
|
1771
|
+
/* @__PURE__ */ jsxs15(
|
|
1726
1772
|
"div",
|
|
1727
1773
|
{
|
|
1728
1774
|
className: cx5(
|
|
@@ -1742,10 +1788,10 @@ function Dropdown({
|
|
|
1742
1788
|
onMouseMove,
|
|
1743
1789
|
children: [
|
|
1744
1790
|
header,
|
|
1745
|
-
sx ? /* @__PURE__ */
|
|
1746
|
-
/* @__PURE__ */
|
|
1747
|
-
/* @__PURE__ */
|
|
1748
|
-
/* @__PURE__ */
|
|
1791
|
+
sx ? /* @__PURE__ */ jsxs15(Fragment5, { children: [
|
|
1792
|
+
/* @__PURE__ */ jsxs15("div", { className: "ui-dropdown__search", children: [
|
|
1793
|
+
/* @__PURE__ */ jsx19(Glyph2, { name: "search", className: "ui-dropdown__search-ic", hidden: true }),
|
|
1794
|
+
/* @__PURE__ */ jsx19(
|
|
1749
1795
|
"input",
|
|
1750
1796
|
{
|
|
1751
1797
|
className: "ui-dropdown__search-input",
|
|
@@ -1769,8 +1815,8 @@ function Dropdown({
|
|
|
1769
1815
|
}
|
|
1770
1816
|
)
|
|
1771
1817
|
] }),
|
|
1772
|
-
/* @__PURE__ */
|
|
1773
|
-
/* @__PURE__ */
|
|
1818
|
+
/* @__PURE__ */ jsx19("div", { className: "ui-dropdown__list", role: "listbox", id: listId, "aria-label": name, style: cap, children: body }),
|
|
1819
|
+
/* @__PURE__ */ jsx19(
|
|
1774
1820
|
"div",
|
|
1775
1821
|
{
|
|
1776
1822
|
className: "ui-dropdown__none",
|
|
@@ -1795,7 +1841,7 @@ function strip(o) {
|
|
|
1795
1841
|
}
|
|
1796
1842
|
|
|
1797
1843
|
// src/BackLink.tsx
|
|
1798
|
-
import { jsx as
|
|
1844
|
+
import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1799
1845
|
var BARE = "Back";
|
|
1800
1846
|
var SCRIPTED = /^javascript:/i;
|
|
1801
1847
|
var LEADING = /^[\u0000-\u0020]+/;
|
|
@@ -1814,7 +1860,7 @@ function BackLink({
|
|
|
1814
1860
|
const name = text(label).replace(SAID, "");
|
|
1815
1861
|
const bare = !name || name.toLowerCase() === BARE.toLowerCase();
|
|
1816
1862
|
const Tag = as ?? "a";
|
|
1817
|
-
return /* @__PURE__ */
|
|
1863
|
+
return /* @__PURE__ */ jsxs16(
|
|
1818
1864
|
Tag,
|
|
1819
1865
|
{
|
|
1820
1866
|
className: ["ui-back", className].filter(Boolean).join(" "),
|
|
@@ -1822,8 +1868,8 @@ function BackLink({
|
|
|
1822
1868
|
"aria-label": bare ? void 0 : `${BARE} to ${name}`,
|
|
1823
1869
|
...rest,
|
|
1824
1870
|
children: [
|
|
1825
|
-
/* @__PURE__ */
|
|
1826
|
-
/* @__PURE__ */
|
|
1871
|
+
/* @__PURE__ */ jsx20(Icon, { name: "chevronLeft" }),
|
|
1872
|
+
/* @__PURE__ */ jsx20("span", { className: "ui-back__label", children: bare ? BARE : name })
|
|
1827
1873
|
]
|
|
1828
1874
|
}
|
|
1829
1875
|
);
|
|
@@ -1831,41 +1877,41 @@ function BackLink({
|
|
|
1831
1877
|
|
|
1832
1878
|
// src/TableValues.tsx
|
|
1833
1879
|
import { formatNumericValue, formatDeltaValue } from "@apliteni/apliteni-ui";
|
|
1834
|
-
import { jsx as
|
|
1880
|
+
import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1835
1881
|
function NumericValue(props) {
|
|
1836
1882
|
const value = formatNumericValue(props);
|
|
1837
|
-
return /* @__PURE__ */
|
|
1883
|
+
return /* @__PURE__ */ jsx21("span", { children: /* @__PURE__ */ jsxs17("span", { className: "ui-value", "aria-label": value.missing, children: [
|
|
1838
1884
|
value.text,
|
|
1839
|
-
value.unit && /* @__PURE__ */
|
|
1885
|
+
value.unit && /* @__PURE__ */ jsx21("span", { className: "ui-value__unit", children: value.unit })
|
|
1840
1886
|
] }) });
|
|
1841
1887
|
}
|
|
1842
1888
|
function DeltaValue(props) {
|
|
1843
1889
|
const value = formatDeltaValue(props);
|
|
1844
|
-
return /* @__PURE__ */
|
|
1890
|
+
return /* @__PURE__ */ jsx21("span", { children: /* @__PURE__ */ jsx21("span", { className: value.className, "aria-describedby": value.basisId || void 0, children: value.text }) });
|
|
1845
1891
|
}
|
|
1846
1892
|
function RowIdentity({ symbol, name, logo, href }) {
|
|
1847
1893
|
const Tag = href ? "a" : "span";
|
|
1848
|
-
return /* @__PURE__ */
|
|
1849
|
-
/* @__PURE__ */
|
|
1850
|
-
/* @__PURE__ */
|
|
1851
|
-
logo && /* @__PURE__ */
|
|
1894
|
+
return /* @__PURE__ */ jsxs17(Tag, { className: "ui-identity", href, children: [
|
|
1895
|
+
/* @__PURE__ */ jsxs17("span", { className: "ui-identity__logo", "aria-hidden": "true", children: [
|
|
1896
|
+
/* @__PURE__ */ jsx21("span", { children: symbol.slice(0, 1) }),
|
|
1897
|
+
logo && /* @__PURE__ */ jsx21("img", { src: logo, alt: "", onLoad: (e) => {
|
|
1852
1898
|
e.currentTarget.hidden = false;
|
|
1853
1899
|
}, onError: (e) => {
|
|
1854
1900
|
e.currentTarget.hidden = true;
|
|
1855
1901
|
} })
|
|
1856
1902
|
] }),
|
|
1857
|
-
/* @__PURE__ */
|
|
1858
|
-
/* @__PURE__ */
|
|
1903
|
+
/* @__PURE__ */ jsx21("span", { className: "ui-identity__symbol", children: symbol }),
|
|
1904
|
+
/* @__PURE__ */ jsx21("span", { className: "ui-identity__name", children: name })
|
|
1859
1905
|
] });
|
|
1860
1906
|
}
|
|
1861
1907
|
|
|
1862
1908
|
// src/Segmented.tsx
|
|
1863
1909
|
import { segmentedNextIndex } from "@apliteni/apliteni-ui";
|
|
1864
|
-
import { jsx as
|
|
1910
|
+
import { jsx as jsx22 } from "react/jsx-runtime";
|
|
1865
1911
|
function Segmented({ options, value, onChange, label, appearance = "pill", disabled = false }) {
|
|
1866
1912
|
const enabled = options.filter((o) => !o.disabled);
|
|
1867
1913
|
const tabValue = enabled.some((o) => o.value === value) ? value : enabled[0]?.value;
|
|
1868
|
-
return /* @__PURE__ */
|
|
1914
|
+
return /* @__PURE__ */ jsx22("div", { className: `ui-seg${appearance === "underline" ? " ui-seg--underline" : ""}`, role: "toolbar", "aria-label": label, children: options.map((option) => /* @__PURE__ */ jsx22(
|
|
1869
1915
|
"button",
|
|
1870
1916
|
{
|
|
1871
1917
|
type: "button",
|
|
@@ -1892,7 +1938,7 @@ function Segmented({ options, value, onChange, label, appearance = "pill", disab
|
|
|
1892
1938
|
|
|
1893
1939
|
// src/FilterBar.tsx
|
|
1894
1940
|
import { useRef as useRef11, useState as useState7 } from "react";
|
|
1895
|
-
import { jsx as
|
|
1941
|
+
import { jsx as jsx23, jsxs as jsxs18 } from "react/jsx-runtime";
|
|
1896
1942
|
function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters", disabled = false, busy = false, onRemove, onClear, onChange }) {
|
|
1897
1943
|
const bar = useRef11(null);
|
|
1898
1944
|
const focused = useRef11(null);
|
|
@@ -1909,7 +1955,7 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1909
1955
|
focused.current = null;
|
|
1910
1956
|
(target || bar.current)?.focus();
|
|
1911
1957
|
});
|
|
1912
|
-
return /* @__PURE__ */
|
|
1958
|
+
return /* @__PURE__ */ jsx23("div", { children: /* @__PURE__ */ jsxs18(
|
|
1913
1959
|
"fieldset",
|
|
1914
1960
|
{
|
|
1915
1961
|
ref: bar,
|
|
@@ -1922,8 +1968,8 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1922
1968
|
if (event.relatedTarget && !event.currentTarget.contains(event.relatedTarget)) focused.current = null;
|
|
1923
1969
|
},
|
|
1924
1970
|
children: [
|
|
1925
|
-
/* @__PURE__ */
|
|
1926
|
-
filters.map((filter, index) => /* @__PURE__ */
|
|
1971
|
+
/* @__PURE__ */ jsx23("legend", { className: "ui-filter-bar__legend", children: label }),
|
|
1972
|
+
filters.map((filter, index) => /* @__PURE__ */ jsxs18(
|
|
1927
1973
|
"fieldset",
|
|
1928
1974
|
{
|
|
1929
1975
|
className: "ui-filter-bar__chip",
|
|
@@ -1933,8 +1979,8 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1933
1979
|
focused.current = { id: filter.id, index };
|
|
1934
1980
|
},
|
|
1935
1981
|
children: [
|
|
1936
|
-
/* @__PURE__ */
|
|
1937
|
-
/* @__PURE__ */
|
|
1982
|
+
/* @__PURE__ */ jsx23("legend", { className: "ui-filter-bar__legend", children: filter.label }),
|
|
1983
|
+
/* @__PURE__ */ jsx23(
|
|
1938
1984
|
Dropdown,
|
|
1939
1985
|
{
|
|
1940
1986
|
label: filter.label,
|
|
@@ -1949,7 +1995,7 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1949
1995
|
}
|
|
1950
1996
|
}
|
|
1951
1997
|
),
|
|
1952
|
-
/* @__PURE__ */
|
|
1998
|
+
/* @__PURE__ */ jsx23(
|
|
1953
1999
|
"button",
|
|
1954
2000
|
{
|
|
1955
2001
|
type: "button",
|
|
@@ -1966,9 +2012,9 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1966
2012
|
},
|
|
1967
2013
|
filter.id
|
|
1968
2014
|
)),
|
|
1969
|
-
/* @__PURE__ */
|
|
2015
|
+
/* @__PURE__ */ jsx23("span", { "data-filter-clear": "", onFocus: () => {
|
|
1970
2016
|
focused.current = { id: null, index: 0 };
|
|
1971
|
-
}, children: /* @__PURE__ */
|
|
2017
|
+
}, children: /* @__PURE__ */ jsx23(Button, { size: "sm", variant: "ghost", disabled: !filters.length, onClick: () => {
|
|
1972
2018
|
if (!blocked) onClear();
|
|
1973
2019
|
}, children: clearLabel }) })
|
|
1974
2020
|
]
|
|
@@ -1977,32 +2023,32 @@ function FilterBar({ filters, label = "Filters", clearLabel = "Clear all filters
|
|
|
1977
2023
|
}
|
|
1978
2024
|
|
|
1979
2025
|
// src/KeyValueList.tsx
|
|
1980
|
-
import { jsx as
|
|
2026
|
+
import { jsx as jsx24, jsxs as jsxs19 } from "react/jsx-runtime";
|
|
1981
2027
|
function detail({ value, redacted }) {
|
|
1982
|
-
if (redacted) return /* @__PURE__ */
|
|
1983
|
-
/* @__PURE__ */
|
|
2028
|
+
if (redacted) return /* @__PURE__ */ jsxs19("span", { className: "ui-kv__hidden", children: [
|
|
2029
|
+
/* @__PURE__ */ jsx24(Icon, { name: "eyeOff" }),
|
|
1984
2030
|
"Hidden"
|
|
1985
2031
|
] });
|
|
1986
2032
|
if (value == null) return "\u2014";
|
|
1987
2033
|
return typeof value === "boolean" ? String(value) : value;
|
|
1988
2034
|
}
|
|
1989
2035
|
function KeyValueList({ rows, columns = 1, className, ...rest }) {
|
|
1990
|
-
return /* @__PURE__ */
|
|
1991
|
-
/* @__PURE__ */
|
|
1992
|
-
/* @__PURE__ */
|
|
2036
|
+
return /* @__PURE__ */ jsx24("dl", { ...rest, className: ["ui-kv", columns === 2 && "ui-kv--two-columns", className].filter(Boolean).join(" "), children: rows.map((row, index) => /* @__PURE__ */ jsxs19("div", { className: "ui-drawer__row", children: [
|
|
2037
|
+
/* @__PURE__ */ jsx24("dt", { children: row.label }),
|
|
2038
|
+
/* @__PURE__ */ jsx24("dd", { children: detail(row) })
|
|
1993
2039
|
] }, index)) });
|
|
1994
2040
|
}
|
|
1995
2041
|
function DrawerSection({ title, headingLevel = 3, className, children, ...rest }) {
|
|
1996
2042
|
const Heading = `h${headingLevel}`;
|
|
1997
|
-
return /* @__PURE__ */
|
|
1998
|
-
title != null && /* @__PURE__ */
|
|
2043
|
+
return /* @__PURE__ */ jsxs19("section", { ...rest, className: ["ui-drawer__section", className].filter(Boolean).join(" "), children: [
|
|
2044
|
+
title != null && /* @__PURE__ */ jsx24(Heading, { className: "ui-drawer__section-title", children: title }),
|
|
1999
2045
|
children
|
|
2000
2046
|
] });
|
|
2001
2047
|
}
|
|
2002
2048
|
|
|
2003
2049
|
// src/Snippet.tsx
|
|
2004
2050
|
import { useEffect as useEffect7, useRef as useRef12, useState as useState8 } from "react";
|
|
2005
|
-
import { jsx as
|
|
2051
|
+
import { jsx as jsx25, jsxs as jsxs20 } from "react/jsx-runtime";
|
|
2006
2052
|
function Snippet({ label = "shell", code = "", reveal = false, copyLabel = "Copy" }) {
|
|
2007
2053
|
const [status, setStatus] = useState8("idle");
|
|
2008
2054
|
const request = useRef12(0);
|
|
@@ -2027,22 +2073,22 @@ function Snippet({ label = "shell", code = "", reveal = false, copyLabel = "Copy
|
|
|
2027
2073
|
if (current === request.current) setStatus("failed");
|
|
2028
2074
|
}
|
|
2029
2075
|
}
|
|
2030
|
-
return /* @__PURE__ */
|
|
2031
|
-
/* @__PURE__ */
|
|
2032
|
-
/* @__PURE__ */
|
|
2033
|
-
/* @__PURE__ */
|
|
2034
|
-
/* @__PURE__ */
|
|
2076
|
+
return /* @__PURE__ */ jsxs20("div", { className: reveal ? "ui-snippet ui-snippet--reveal" : "ui-snippet", children: [
|
|
2077
|
+
/* @__PURE__ */ jsxs20("div", { className: "ui-snippet__bar", children: [
|
|
2078
|
+
/* @__PURE__ */ jsx25("span", { children: label }),
|
|
2079
|
+
/* @__PURE__ */ jsxs20("button", { type: "button", className: "ui-snippet__copy", "aria-live": "polite", "aria-atomic": "true", onClick: copy, children: [
|
|
2080
|
+
/* @__PURE__ */ jsx25(Icon, { name: status === "copied" ? "check" : "copy" }),
|
|
2035
2081
|
status === "copied" ? "Copied" : status === "failed" ? "Copy failed" : copyLabel
|
|
2036
2082
|
] })
|
|
2037
2083
|
] }),
|
|
2038
|
-
/* @__PURE__ */
|
|
2084
|
+
/* @__PURE__ */ jsx25("pre", { children: code })
|
|
2039
2085
|
] });
|
|
2040
2086
|
}
|
|
2041
2087
|
|
|
2042
2088
|
// src/Tabs.tsx
|
|
2043
2089
|
import { useEffect as useEffect8, useId as useId9, useRef as useRef13 } from "react";
|
|
2044
2090
|
import { playEntrance } from "@apliteni/apliteni-ui/motion";
|
|
2045
|
-
import { Fragment as Fragment6, jsx as
|
|
2091
|
+
import { Fragment as Fragment6, jsx as jsx26, jsxs as jsxs21 } from "react/jsx-runtime";
|
|
2046
2092
|
function Tabs({ items, value, onChange, label }) {
|
|
2047
2093
|
const id = useId9();
|
|
2048
2094
|
const previous = useRef13(value);
|
|
@@ -2052,8 +2098,8 @@ function Tabs({ items, value, onChange, label }) {
|
|
|
2052
2098
|
if (previous.current !== value) playEntrance(activePanel.current);
|
|
2053
2099
|
previous.current = value;
|
|
2054
2100
|
}, [value]);
|
|
2055
|
-
return /* @__PURE__ */
|
|
2056
|
-
/* @__PURE__ */
|
|
2101
|
+
return /* @__PURE__ */ jsxs21("div", { className: "ui-tabs", children: [
|
|
2102
|
+
/* @__PURE__ */ jsx26("div", { className: "ui-tabs__list", role: "tablist", "aria-label": label, children: items.map((item, i) => /* @__PURE__ */ jsxs21(
|
|
2057
2103
|
"button",
|
|
2058
2104
|
{
|
|
2059
2105
|
type: "button",
|
|
@@ -2091,7 +2137,7 @@ function Tabs({ items, value, onChange, label }) {
|
|
|
2091
2137
|
},
|
|
2092
2138
|
children: [
|
|
2093
2139
|
item.label,
|
|
2094
|
-
item.count != null && /* @__PURE__ */
|
|
2140
|
+
item.count != null && /* @__PURE__ */ jsxs21(Fragment6, { children: [
|
|
2095
2141
|
" ",
|
|
2096
2142
|
item.count
|
|
2097
2143
|
] })
|
|
@@ -2099,7 +2145,7 @@ function Tabs({ items, value, onChange, label }) {
|
|
|
2099
2145
|
},
|
|
2100
2146
|
item.value
|
|
2101
2147
|
)) }),
|
|
2102
|
-
/* @__PURE__ */
|
|
2148
|
+
/* @__PURE__ */ jsx26("div", { className: "ui-tabs__panels", children: items.map((item, i) => /* @__PURE__ */ jsx26(
|
|
2103
2149
|
"div",
|
|
2104
2150
|
{
|
|
2105
2151
|
className: "ui-tabs__panel",
|
|
@@ -2119,7 +2165,7 @@ function Tabs({ items, value, onChange, label }) {
|
|
|
2119
2165
|
// src/Timeline.tsx
|
|
2120
2166
|
import { useEffect as useEffect9, useRef as useRef14 } from "react";
|
|
2121
2167
|
import { playEntrance as playEntrance2, prefersReducedMotion } from "@apliteni/apliteni-ui/motion";
|
|
2122
|
-
import { jsx as
|
|
2168
|
+
import { jsx as jsx27, jsxs as jsxs22 } from "react/jsx-runtime";
|
|
2123
2169
|
var kindIcons = { person: "user", rule: "bolt", reversal: "refresh" };
|
|
2124
2170
|
function Timeline({ events, className, ...rest }) {
|
|
2125
2171
|
const previousIds = useRef14(new Set(events.map((event) => event.id)));
|
|
@@ -2136,7 +2182,7 @@ function Timeline({ events, className, ...rest }) {
|
|
|
2136
2182
|
}
|
|
2137
2183
|
previousIds.current = new Set(events.map((event) => event.id));
|
|
2138
2184
|
}, [events]);
|
|
2139
|
-
return /* @__PURE__ */
|
|
2185
|
+
return /* @__PURE__ */ jsx27("ol", { ...rest, role: "list", className: ["ui-timeline", events.some((event) => event.kind) && "ui-timeline--kinds", className].filter(Boolean).join(" "), children: events.map((event, index) => /* @__PURE__ */ jsxs22(
|
|
2140
2186
|
"li",
|
|
2141
2187
|
{
|
|
2142
2188
|
className: "ui-timeline__event",
|
|
@@ -2145,20 +2191,20 @@ function Timeline({ events, className, ...rest }) {
|
|
|
2145
2191
|
else rows.current.delete(event.id);
|
|
2146
2192
|
},
|
|
2147
2193
|
children: [
|
|
2148
|
-
/* @__PURE__ */
|
|
2194
|
+
/* @__PURE__ */ jsx27("span", { "aria-hidden": "true", className: [
|
|
2149
2195
|
"ui-timeline__marker",
|
|
2150
2196
|
event.kind && "ui-timeline__marker--kind",
|
|
2151
2197
|
event.kind === "reversal" && "ui-timeline__marker--reversal"
|
|
2152
|
-
].filter(Boolean).join(" "), children: event.kind && /* @__PURE__ */
|
|
2153
|
-
/* @__PURE__ */
|
|
2154
|
-
/* @__PURE__ */
|
|
2155
|
-
/* @__PURE__ */
|
|
2156
|
-
index === events.length - 1 && event.relativeTimestamp && /* @__PURE__ */
|
|
2198
|
+
].filter(Boolean).join(" "), children: event.kind && /* @__PURE__ */ jsx27(Icon, { name: kindIcons[event.kind] }) }),
|
|
2199
|
+
/* @__PURE__ */ jsxs22("div", { className: "ui-timeline__head", children: [
|
|
2200
|
+
/* @__PURE__ */ jsx27("span", { className: "ui-timeline__actor", children: event.actor }),
|
|
2201
|
+
/* @__PURE__ */ jsx27("time", { dateTime: event.dateTime, children: event.timestamp }),
|
|
2202
|
+
index === events.length - 1 && event.relativeTimestamp && /* @__PURE__ */ jsx27("span", { className: "ui-timeline__relative", children: event.relativeTimestamp })
|
|
2157
2203
|
] }),
|
|
2158
|
-
/* @__PURE__ */
|
|
2159
|
-
(event.meta != null || event.undo) && /* @__PURE__ */
|
|
2160
|
-
event.meta != null && /* @__PURE__ */
|
|
2161
|
-
event.undo && /* @__PURE__ */
|
|
2204
|
+
/* @__PURE__ */ jsx27("p", { className: "ui-timeline__description", children: event.description }),
|
|
2205
|
+
(event.meta != null || event.undo) && /* @__PURE__ */ jsxs22("div", { className: "ui-timeline__meta", children: [
|
|
2206
|
+
event.meta != null && /* @__PURE__ */ jsx27("span", { children: event.meta }),
|
|
2207
|
+
event.undo && /* @__PURE__ */ jsx27(Button, { variant: "ghost", size: "xs", className: "ui-btn ui-btn--ghost ui-btn--xs ui-timeline__undo", "aria-label": event.undo.label, onClick: event.undo.onUndo, children: "Undo" })
|
|
2162
2208
|
] })
|
|
2163
2209
|
]
|
|
2164
2210
|
},
|
|
@@ -2167,20 +2213,20 @@ function Timeline({ events, className, ...rest }) {
|
|
|
2167
2213
|
}
|
|
2168
2214
|
|
|
2169
2215
|
// src/Field.tsx
|
|
2170
|
-
import { forwardRef as
|
|
2216
|
+
import { forwardRef as forwardRef6, useEffect as useEffect10, useId as useId10, useRef as useRef15, useState as useState9 } from "react";
|
|
2171
2217
|
import { esc, icon as icon4 } from "@apliteni/apliteni-ui";
|
|
2172
|
-
import { jsx as
|
|
2218
|
+
import { jsx as jsx28, jsxs as jsxs23 } from "react/jsx-runtime";
|
|
2173
2219
|
function messages(id, hint, error) {
|
|
2174
2220
|
return [error && `${id}-error`, hint && `${id}-hint`].filter(Boolean).join(" ") || void 0;
|
|
2175
2221
|
}
|
|
2176
2222
|
function Frame({ id, label, hint, error, required, children }) {
|
|
2177
|
-
return /* @__PURE__ */
|
|
2178
|
-
/* @__PURE__ */
|
|
2223
|
+
return /* @__PURE__ */ jsxs23("div", { className: "ui-field", children: [
|
|
2224
|
+
/* @__PURE__ */ jsxs23("label", { className: "ui-field__label", htmlFor: id, children: [
|
|
2179
2225
|
label,
|
|
2180
|
-
required && /* @__PURE__ */
|
|
2226
|
+
required && /* @__PURE__ */ jsx28("span", { className: "ui-field__req", "aria-hidden": "true", children: "*" })
|
|
2181
2227
|
] }),
|
|
2182
2228
|
children,
|
|
2183
|
-
error && /* @__PURE__ */
|
|
2229
|
+
error && /* @__PURE__ */ jsx28(
|
|
2184
2230
|
"div",
|
|
2185
2231
|
{
|
|
2186
2232
|
id: `${id}-error`,
|
|
@@ -2189,7 +2235,7 @@ function Frame({ id, label, hint, error, required, children }) {
|
|
|
2189
2235
|
dangerouslySetInnerHTML: { __html: icon4("alert") + esc(error) }
|
|
2190
2236
|
}
|
|
2191
2237
|
),
|
|
2192
|
-
hint && /* @__PURE__ */
|
|
2238
|
+
hint && /* @__PURE__ */ jsx28("div", { id: `${id}-hint`, className: "ui-field__hint", children: hint })
|
|
2193
2239
|
] });
|
|
2194
2240
|
}
|
|
2195
2241
|
function wiring(id, hint, error) {
|
|
@@ -2198,13 +2244,13 @@ function wiring(id, hint, error) {
|
|
|
2198
2244
|
function Field({ id: suppliedId, label, hint, error, required, children }) {
|
|
2199
2245
|
const generatedId = useId10();
|
|
2200
2246
|
const id = suppliedId ?? generatedId;
|
|
2201
|
-
return /* @__PURE__ */
|
|
2247
|
+
return /* @__PURE__ */ jsx28(Frame, { ...{ id, label, hint, error, required }, children: children({ ...wiring(id, hint, error), required }) });
|
|
2202
2248
|
}
|
|
2203
|
-
var TextField =
|
|
2249
|
+
var TextField = forwardRef6(function TextField2({ label, hint, error, required, type = "text", unit, icon: glyph, className = "", ...props }, ref) {
|
|
2204
2250
|
const id = useId10();
|
|
2205
2251
|
const hasUnit = type === "number" && !!unit;
|
|
2206
2252
|
const describedBy = [messages(id, hint, error), hasUnit ? `${id}-unit` : ""].filter(Boolean).join(" ") || void 0;
|
|
2207
|
-
const control = /* @__PURE__ */
|
|
2253
|
+
const control = /* @__PURE__ */ jsx28(
|
|
2208
2254
|
"input",
|
|
2209
2255
|
{
|
|
2210
2256
|
ref,
|
|
@@ -2217,19 +2263,19 @@ var TextField = forwardRef4(function TextField2({ label, hint, error, required,
|
|
|
2217
2263
|
className: `ui-input${error ? " is-invalid" : ""} ${className}`
|
|
2218
2264
|
}
|
|
2219
2265
|
);
|
|
2220
|
-
const unitSpan = hasUnit ? /* @__PURE__ */
|
|
2221
|
-
return /* @__PURE__ */
|
|
2222
|
-
/* @__PURE__ */
|
|
2266
|
+
const unitSpan = hasUnit ? /* @__PURE__ */ jsx28("span", { id: `${id}-unit`, className: "ui-field-number__unit", children: unit }) : null;
|
|
2267
|
+
return /* @__PURE__ */ jsx28(Frame, { ...{ id, label, hint, error, required }, children: glyph ? /* @__PURE__ */ jsxs23("div", { className: `ui-input-group${hasUnit ? " ui-field-number" : ""}`, children: [
|
|
2268
|
+
/* @__PURE__ */ jsx28("span", { className: "ui-input-group__icon", dangerouslySetInnerHTML: { __html: icon4(glyph) } }),
|
|
2223
2269
|
control,
|
|
2224
2270
|
unitSpan
|
|
2225
|
-
] }) : hasUnit ? /* @__PURE__ */
|
|
2271
|
+
] }) : hasUnit ? /* @__PURE__ */ jsxs23("div", { className: "ui-field-number", children: [
|
|
2226
2272
|
control,
|
|
2227
2273
|
unitSpan
|
|
2228
2274
|
] }) : control });
|
|
2229
2275
|
});
|
|
2230
2276
|
function TextArea({ label, hint, error, required, className = "", ...props }) {
|
|
2231
2277
|
const id = useId10();
|
|
2232
|
-
return /* @__PURE__ */
|
|
2278
|
+
return /* @__PURE__ */ jsx28(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx28(
|
|
2233
2279
|
"textarea",
|
|
2234
2280
|
{
|
|
2235
2281
|
rows: 4,
|
|
@@ -2242,7 +2288,7 @@ function TextArea({ label, hint, error, required, className = "", ...props }) {
|
|
|
2242
2288
|
}
|
|
2243
2289
|
function SelectField({ label, hint, error, required, className = "", children, ...props }) {
|
|
2244
2290
|
const id = useId10();
|
|
2245
|
-
return /* @__PURE__ */
|
|
2291
|
+
return /* @__PURE__ */ jsx28(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsx28(
|
|
2246
2292
|
"select",
|
|
2247
2293
|
{
|
|
2248
2294
|
...props,
|
|
@@ -2271,7 +2317,7 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
|
|
|
2271
2317
|
setFile(next);
|
|
2272
2318
|
onFileChange?.(next);
|
|
2273
2319
|
};
|
|
2274
|
-
return /* @__PURE__ */
|
|
2320
|
+
return /* @__PURE__ */ jsx28(Frame, { ...{ id, label, hint, error, required }, children: /* @__PURE__ */ jsxs23(
|
|
2275
2321
|
"div",
|
|
2276
2322
|
{
|
|
2277
2323
|
className: `ui-file${dragging && !disabled ? " is-dragging" : ""}${file ? " has-file" : ""}${error ? " is-invalid" : ""}${disabled ? " is-disabled" : ""}`,
|
|
@@ -2292,12 +2338,12 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
|
|
|
2292
2338
|
update(transfer.files[0]);
|
|
2293
2339
|
},
|
|
2294
2340
|
children: [
|
|
2295
|
-
/* @__PURE__ */
|
|
2296
|
-
/* @__PURE__ */
|
|
2297
|
-
/* @__PURE__ */
|
|
2298
|
-
/* @__PURE__ */
|
|
2299
|
-
/* @__PURE__ */
|
|
2300
|
-
/* @__PURE__ */
|
|
2341
|
+
/* @__PURE__ */ jsx28("span", { className: "ui-file__glyph", children: /* @__PURE__ */ jsx28(Icon, { name: "upload" }) }),
|
|
2342
|
+
/* @__PURE__ */ jsx28("div", { "aria-live": "polite", children: file ? file.name : "Drop a file here" }),
|
|
2343
|
+
/* @__PURE__ */ jsx28("div", { children: "or choose one from your device" }),
|
|
2344
|
+
/* @__PURE__ */ jsxs23("span", { className: "ui-file__choose", children: [
|
|
2345
|
+
/* @__PURE__ */ jsx28("span", { className: "ui-btn ui-btn--secondary ui-btn--sm", "aria-hidden": "true", "aria-disabled": disabled || void 0, children: file ? "Replace file" : "Choose file" }),
|
|
2346
|
+
/* @__PURE__ */ jsx28(
|
|
2301
2347
|
"input",
|
|
2302
2348
|
{
|
|
2303
2349
|
...props,
|
|
@@ -2319,7 +2365,7 @@ function FileField({ label, hint, error, required, disabled, onFileChange, class
|
|
|
2319
2365
|
// src/Toast.tsx
|
|
2320
2366
|
import { createContext as createContext2, useCallback as useCallback3, useContext as useContext2, useEffect as useEffect11, useLayoutEffect as useLayoutEffect4, useRef as useRef16, useState as useState10 } from "react";
|
|
2321
2367
|
import { createPortal as createPortal4 } from "react-dom";
|
|
2322
|
-
import { jsx as
|
|
2368
|
+
import { jsx as jsx29, jsxs as jsxs24 } from "react/jsx-runtime";
|
|
2323
2369
|
var Context = createContext2(null);
|
|
2324
2370
|
var glyphs = { success: "circleCheck", danger: "circleX", warn: "circleAlert", info: "info", neutral: "bolt" };
|
|
2325
2371
|
function useToast() {
|
|
@@ -2365,7 +2411,7 @@ function Notice({ notice, remove }) {
|
|
|
2365
2411
|
remaining.current = Math.max(0, remaining.current - (Date.now() - started));
|
|
2366
2412
|
};
|
|
2367
2413
|
}, [dismiss, leaving2, notice.action, paused]);
|
|
2368
|
-
return /* @__PURE__ */
|
|
2414
|
+
return /* @__PURE__ */ jsxs24(
|
|
2369
2415
|
"div",
|
|
2370
2416
|
{
|
|
2371
2417
|
ref: root,
|
|
@@ -2379,12 +2425,12 @@ function Notice({ notice, remove }) {
|
|
|
2379
2425
|
if (!event.currentTarget.contains(event.relatedTarget)) setFocused(false);
|
|
2380
2426
|
},
|
|
2381
2427
|
children: [
|
|
2382
|
-
/* @__PURE__ */
|
|
2383
|
-
/* @__PURE__ */
|
|
2384
|
-
/* @__PURE__ */
|
|
2385
|
-
notice.text && /* @__PURE__ */
|
|
2428
|
+
/* @__PURE__ */ jsx29("span", { className: "ui-toast__icon", children: /* @__PURE__ */ jsx29(Icon, { name: glyphs[tone] }) }),
|
|
2429
|
+
/* @__PURE__ */ jsxs24("div", { className: "ui-toast__body", children: [
|
|
2430
|
+
/* @__PURE__ */ jsx29("div", { className: "ui-toast__title", children: notice.title }),
|
|
2431
|
+
notice.text && /* @__PURE__ */ jsx29("div", { className: "ui-toast__text", children: notice.text })
|
|
2386
2432
|
] }),
|
|
2387
|
-
notice.action && /* @__PURE__ */
|
|
2433
|
+
notice.action && /* @__PURE__ */ jsx29(
|
|
2388
2434
|
"button",
|
|
2389
2435
|
{
|
|
2390
2436
|
type: "button",
|
|
@@ -2399,8 +2445,8 @@ function Notice({ notice, remove }) {
|
|
|
2399
2445
|
children: notice.action.label
|
|
2400
2446
|
}
|
|
2401
2447
|
),
|
|
2402
|
-
/* @__PURE__ */
|
|
2403
|
-
!notice.action && /* @__PURE__ */
|
|
2448
|
+
/* @__PURE__ */ jsx29("button", { type: "button", className: "ui-toast__close", "aria-label": "Dismiss", disabled: leaving2, onClick: dismiss, children: /* @__PURE__ */ jsx29(Icon, { name: "x" }) }),
|
|
2449
|
+
!notice.action && /* @__PURE__ */ jsx29(
|
|
2404
2450
|
"span",
|
|
2405
2451
|
{
|
|
2406
2452
|
className: "ui-toast__timer is-running",
|
|
@@ -2442,10 +2488,10 @@ function Toast({ children }) {
|
|
|
2442
2488
|
setEntries((current) => [...current, { id, notice, remove }]);
|
|
2443
2489
|
}, []);
|
|
2444
2490
|
usePublishedReach(stack2, entries.length);
|
|
2445
|
-
return /* @__PURE__ */
|
|
2491
|
+
return /* @__PURE__ */ jsxs24(Context.Provider, { value: push, children: [
|
|
2446
2492
|
children,
|
|
2447
2493
|
typeof document !== "undefined" && createPortal4(
|
|
2448
|
-
/* @__PURE__ */
|
|
2494
|
+
/* @__PURE__ */ jsx29("div", { className: "ui-toast-stack rx-toast-stack", ref: stack2, children: entries.map((entry) => /* @__PURE__ */ jsx29(Notice, { notice: entry.notice, remove: entry.remove }, entry.id)) }),
|
|
2449
2495
|
document.body
|
|
2450
2496
|
)
|
|
2451
2497
|
] });
|
|
@@ -2456,9 +2502,9 @@ import { useEffect as useEffect13, useId as useId12, useState as useState12 } fr
|
|
|
2456
2502
|
import { applyTheme, paletteHotkey, prism, railCollapsed, themeIcon, themeName } from "@apliteni/apliteni-ui";
|
|
2457
2503
|
|
|
2458
2504
|
// src/SidebarNav.tsx
|
|
2459
|
-
import { forwardRef as
|
|
2505
|
+
import { forwardRef as forwardRef7, useEffect as useEffect12, useId as useId11, useState as useState11 } from "react";
|
|
2460
2506
|
import { ENTRANCE_FALLBACK_MS } from "@apliteni/apliteni-ui/motion";
|
|
2461
|
-
import { Fragment as Fragment7, jsx as
|
|
2507
|
+
import { Fragment as Fragment7, jsx as jsx30, jsxs as jsxs25 } from "react/jsx-runtime";
|
|
2462
2508
|
var badgeText = (badge) => typeof badge === "object" ? badge.text : badge;
|
|
2463
2509
|
function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
|
|
2464
2510
|
const uid = useId11();
|
|
@@ -2484,15 +2530,15 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
|
|
|
2484
2530
|
item.disabled && "is-disabled",
|
|
2485
2531
|
item.danger && "is-danger"
|
|
2486
2532
|
].filter(Boolean).join(" ");
|
|
2487
|
-
const children = /* @__PURE__ */
|
|
2488
|
-
(item.leading ?? item.icon) && /* @__PURE__ */
|
|
2489
|
-
/* @__PURE__ */
|
|
2490
|
-
count != null && count !== "" && /* @__PURE__ */
|
|
2491
|
-
group && /* @__PURE__ */
|
|
2533
|
+
const children = /* @__PURE__ */ jsxs25(Fragment7, { children: [
|
|
2534
|
+
(item.leading ?? item.icon) && /* @__PURE__ */ jsx30("span", { className: "ui-nav__ic", children: item.leading ?? /* @__PURE__ */ jsx30(Icon, { name: item.icon }) }),
|
|
2535
|
+
/* @__PURE__ */ jsx30("span", { className: "ui-nav__label", children: item.label }),
|
|
2536
|
+
count != null && count !== "" && /* @__PURE__ */ jsx30("span", { className: `ui-nav__badge is-${typeof item.badge === "object" ? item.badge.tone ?? "neutral" : "neutral"}`, children: count }),
|
|
2537
|
+
group && /* @__PURE__ */ jsx30("span", { className: "ui-nav__caret", "aria-hidden": "true" })
|
|
2492
2538
|
] });
|
|
2493
2539
|
const common = { className, "aria-label": name, title: collapsed ? name : void 0, children };
|
|
2494
|
-
if (group) return /* @__PURE__ */
|
|
2495
|
-
/* @__PURE__ */
|
|
2540
|
+
if (group) return /* @__PURE__ */ jsxs25("li", { className: `ui-nav__group${open ? " is-open" : ""}`, children: [
|
|
2541
|
+
/* @__PURE__ */ jsx30(
|
|
2496
2542
|
"button",
|
|
2497
2543
|
{
|
|
2498
2544
|
...common,
|
|
@@ -2506,25 +2552,25 @@ function Row({ item, active, activeIs, collapsed, renderLink, sub }) {
|
|
|
2506
2552
|
}
|
|
2507
2553
|
}
|
|
2508
2554
|
),
|
|
2509
|
-
/* @__PURE__ */
|
|
2555
|
+
/* @__PURE__ */ jsx30("ul", { id: uid, className: `ui-nav__sub${entering ? " is-entering" : ""}`, hidden: !open, onAnimationEnd: () => setEntering(false), children: item.items.map((child) => /* @__PURE__ */ jsx30(Row, { item: child, active, activeIs, collapsed, renderLink, sub: true }, child.id)) })
|
|
2510
2556
|
] });
|
|
2511
|
-
if (item.disabled) return /* @__PURE__ */
|
|
2557
|
+
if (item.disabled) return /* @__PURE__ */ jsx30("li", { children: /* @__PURE__ */ jsx30("span", { ...common, role: "link", "aria-disabled": "true" }) });
|
|
2512
2558
|
const props = {
|
|
2513
2559
|
...common,
|
|
2514
2560
|
href: item.href ?? `#${item.id}`,
|
|
2515
2561
|
target: item.target,
|
|
2516
2562
|
"aria-current": isActive ? activeIs === "section" ? "true" : "page" : void 0
|
|
2517
2563
|
};
|
|
2518
|
-
return /* @__PURE__ */
|
|
2564
|
+
return /* @__PURE__ */ jsx30("li", { children: renderLink ? renderLink(item, props) : /* @__PURE__ */ jsx30("a", { ...props }) });
|
|
2519
2565
|
}
|
|
2520
2566
|
function Section({ section, ...props }) {
|
|
2521
2567
|
const uid = useId11();
|
|
2522
|
-
return /* @__PURE__ */
|
|
2523
|
-
section.label && /* @__PURE__ */
|
|
2524
|
-
/* @__PURE__ */
|
|
2568
|
+
return /* @__PURE__ */ jsxs25("div", { className: "ui-nav__section", children: [
|
|
2569
|
+
section.label && /* @__PURE__ */ jsx30("div", { className: "ui-nav__cap", id: uid, "aria-hidden": props.collapsed || void 0, children: section.label }),
|
|
2570
|
+
/* @__PURE__ */ jsx30("ul", { className: "ui-nav__list", "aria-labelledby": section.label ? uid : void 0, children: section.items.map((item) => /* @__PURE__ */ jsx30(Row, { item, ...props }, item.id)) })
|
|
2525
2571
|
] });
|
|
2526
2572
|
}
|
|
2527
|
-
var SidebarNav =
|
|
2573
|
+
var SidebarNav = forwardRef7(function SidebarNav2({
|
|
2528
2574
|
items = [],
|
|
2529
2575
|
sections,
|
|
2530
2576
|
active,
|
|
@@ -2536,8 +2582,8 @@ var SidebarNav = forwardRef5(function SidebarNav2({
|
|
|
2536
2582
|
"aria-label": label = "Sidebar",
|
|
2537
2583
|
...rest
|
|
2538
2584
|
}, ref) {
|
|
2539
|
-
return /* @__PURE__ */
|
|
2540
|
-
(sections?.length ? sections : [{ items }]).map((section, index) => /* @__PURE__ */
|
|
2585
|
+
return /* @__PURE__ */ jsxs25("nav", { ...rest, ref, "aria-label": label, className: ["ui-nav", "ui-nav--side", collapsed && "is-collapsed", className].filter(Boolean).join(" "), children: [
|
|
2586
|
+
(sections?.length ? sections : [{ items }]).map((section, index) => /* @__PURE__ */ jsx30(
|
|
2541
2587
|
Section,
|
|
2542
2588
|
{
|
|
2543
2589
|
section,
|
|
@@ -2548,12 +2594,12 @@ var SidebarNav = forwardRef5(function SidebarNav2({
|
|
|
2548
2594
|
},
|
|
2549
2595
|
index
|
|
2550
2596
|
)),
|
|
2551
|
-
footer && /* @__PURE__ */
|
|
2597
|
+
footer && /* @__PURE__ */ jsx30("div", { className: "ui-nav__foot", children: footer })
|
|
2552
2598
|
] });
|
|
2553
2599
|
});
|
|
2554
2600
|
|
|
2555
2601
|
// src/AppShell.tsx
|
|
2556
|
-
import { Fragment as Fragment8, jsx as
|
|
2602
|
+
import { Fragment as Fragment8, jsx as jsx31, jsxs as jsxs26 } from "react/jsx-runtime";
|
|
2557
2603
|
var path = (value) => value.split(/[?#]/)[0].replace(/\/+$/, "") || "/";
|
|
2558
2604
|
function AppShell({
|
|
2559
2605
|
sections,
|
|
@@ -2626,15 +2672,15 @@ function AppShell({
|
|
|
2626
2672
|
onClick: (event) => {
|
|
2627
2673
|
if (!event.metaKey && !event.ctrlKey && !event.shiftKey && !event.altKey) setMore(false);
|
|
2628
2674
|
},
|
|
2629
|
-
children: /* @__PURE__ */
|
|
2630
|
-
/* @__PURE__ */
|
|
2631
|
-
/* @__PURE__ */
|
|
2632
|
-
section.count != null && /* @__PURE__ */
|
|
2675
|
+
children: /* @__PURE__ */ jsxs26(Fragment8, { children: [
|
|
2676
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsx31(Icon, { name: section.icon }) }),
|
|
2677
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__label", children: section.label }),
|
|
2678
|
+
section.count != null && /* @__PURE__ */ jsx31("span", { className: "ui-nav__badge is-neutral", children: section.count })
|
|
2633
2679
|
] })
|
|
2634
2680
|
};
|
|
2635
|
-
return /* @__PURE__ */
|
|
2681
|
+
return /* @__PURE__ */ jsx31("li", { children: renderLink ? renderLink(section, linkProps) : /* @__PURE__ */ jsx31("a", { ...linkProps }) }, section.href);
|
|
2636
2682
|
});
|
|
2637
|
-
const sidebar = (items, label) => /* @__PURE__ */
|
|
2683
|
+
const sidebar = (items, label) => /* @__PURE__ */ jsx31(
|
|
2638
2684
|
SidebarNav,
|
|
2639
2685
|
{
|
|
2640
2686
|
"aria-label": label,
|
|
@@ -2646,7 +2692,7 @@ function AppShell({
|
|
|
2646
2692
|
const linkProps = { ...props, onClick: (event) => {
|
|
2647
2693
|
if (!event.metaKey && !event.ctrlKey && !event.shiftKey && !event.altKey) setMore(false);
|
|
2648
2694
|
} };
|
|
2649
|
-
return renderLink ? renderLink(section, linkProps) : /* @__PURE__ */
|
|
2695
|
+
return renderLink ? renderLink(section, linkProps) : /* @__PURE__ */ jsx31("a", { ...linkProps });
|
|
2650
2696
|
}
|
|
2651
2697
|
}
|
|
2652
2698
|
);
|
|
@@ -2654,33 +2700,33 @@ function AppShell({
|
|
|
2654
2700
|
const visible = sections.length > 4 ? sections.slice(0, 3) : sections;
|
|
2655
2701
|
const remaining = sections.slice(visible.length);
|
|
2656
2702
|
const initials = account.name.trim().split(/\s+/).map((part) => part[0]).slice(0, 2).join("");
|
|
2657
|
-
return /* @__PURE__ */
|
|
2658
|
-
/* @__PURE__ */
|
|
2659
|
-
/* @__PURE__ */
|
|
2660
|
-
brand ?? /* @__PURE__ */
|
|
2661
|
-
/* @__PURE__ */
|
|
2703
|
+
return /* @__PURE__ */ jsxs26("div", { className: `ui-app ui-app--topbar ui-react-app${collapsed ? " is-collapsed" : ""}`, children: [
|
|
2704
|
+
/* @__PURE__ */ jsxs26("div", { className: "ui-app__rail", children: [
|
|
2705
|
+
/* @__PURE__ */ jsx31("div", { className: "ui-app__head", children: /* @__PURE__ */ jsxs26("a", { className: "ui-app__brand", href: brandHref, "aria-label": word, children: [
|
|
2706
|
+
brand ?? /* @__PURE__ */ jsx31("i", { "aria-hidden": "true", className: "ui-react-app__mark", dangerouslySetInnerHTML: { __html: prism(uid, 24) } }),
|
|
2707
|
+
/* @__PURE__ */ jsx31("span", { children: word })
|
|
2662
2708
|
] }) }),
|
|
2663
2709
|
sidebar(sections, "Sections"),
|
|
2664
|
-
/* @__PURE__ */
|
|
2665
|
-
/* @__PURE__ */
|
|
2666
|
-
/* @__PURE__ */
|
|
2667
|
-
/* @__PURE__ */
|
|
2668
|
-
/* @__PURE__ */
|
|
2710
|
+
/* @__PURE__ */ jsx31("div", { className: "ui-app__foot", children: /* @__PURE__ */ jsx31("div", { className: "ui-app__fold-row", children: /* @__PURE__ */ jsxs26("button", { type: "button", className: "ui-nav__item ui-app__fold", "aria-expanded": !collapsed, "aria-label": foldLabel, onClick: fold, children: [
|
|
2711
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsxs26("svg", { className: "ui-icon", viewBox: "0 0 24 24", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
|
|
2712
|
+
/* @__PURE__ */ jsx31("rect", { x: "3", y: "3", width: "18", height: "18", rx: "2" }),
|
|
2713
|
+
/* @__PURE__ */ jsx31("path", { className: "ui-app__fold-seam", d: "M9 3v18" }),
|
|
2714
|
+
/* @__PURE__ */ jsx31("path", { className: "ui-app__fold-arrow", d: "m16 15-3-3 3-3" })
|
|
2669
2715
|
] }) }),
|
|
2670
|
-
/* @__PURE__ */
|
|
2716
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__label", children: foldLabel })
|
|
2671
2717
|
] }) }) })
|
|
2672
2718
|
] }),
|
|
2673
|
-
/* @__PURE__ */
|
|
2674
|
-
/* @__PURE__ */
|
|
2675
|
-
/* @__PURE__ */
|
|
2676
|
-
/* @__PURE__ */
|
|
2677
|
-
/* @__PURE__ */
|
|
2678
|
-
/* @__PURE__ */
|
|
2719
|
+
/* @__PURE__ */ jsxs26("div", { className: "ui-app__well", children: [
|
|
2720
|
+
/* @__PURE__ */ jsxs26("header", { className: "ui-app__bar", children: [
|
|
2721
|
+
/* @__PURE__ */ jsxs26("button", { type: "button", className: "ui-app__search", "aria-haspopup": "dialog", onClick: () => setSearch(true), children: [
|
|
2722
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-app__search-ic", children: /* @__PURE__ */ jsx31(Icon, { name: "search" }) }),
|
|
2723
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-app__search-txt", children: "Search or run a command\u2026" }),
|
|
2724
|
+
/* @__PURE__ */ jsx31("kbd", { className: "ui-cmdk__key", children: paletteHotkey() })
|
|
2679
2725
|
] }),
|
|
2680
|
-
/* @__PURE__ */
|
|
2726
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-app__bar-gap" }),
|
|
2681
2727
|
bandControl,
|
|
2682
|
-
/* @__PURE__ */
|
|
2683
|
-
/* @__PURE__ */
|
|
2728
|
+
/* @__PURE__ */ jsx31("button", { type: "button", className: "toggle", "aria-label": themeName(theme), title: themeName(theme), onClick: () => applyTheme(theme === "light" ? "dark" : "light"), children: /* @__PURE__ */ jsx31("span", { className: "ic", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: themeIcon(theme) } }) }),
|
|
2729
|
+
/* @__PURE__ */ jsx31("div", { className: "ui-app__user ui-app__user--bar", children: /* @__PURE__ */ jsx31(
|
|
2684
2730
|
Dropdown,
|
|
2685
2731
|
{
|
|
2686
2732
|
variant: "menu",
|
|
@@ -2689,27 +2735,27 @@ function AppShell({
|
|
|
2689
2735
|
ariaLabel: `Signed in as ${account.name}, ${account.email}`,
|
|
2690
2736
|
triggerClass: "ui-app__user-trigger",
|
|
2691
2737
|
panelClass: "ui-app__user-panel",
|
|
2692
|
-
triggerContent: /* @__PURE__ */
|
|
2693
|
-
header: /* @__PURE__ */
|
|
2694
|
-
/* @__PURE__ */
|
|
2695
|
-
/* @__PURE__ */
|
|
2738
|
+
triggerContent: /* @__PURE__ */ jsx31("span", { className: "ui-app__av", "aria-hidden": "true", children: initials }),
|
|
2739
|
+
header: /* @__PURE__ */ jsxs26("div", { className: "ui-dropdown__head", children: [
|
|
2740
|
+
/* @__PURE__ */ jsx31("b", { children: account.name }),
|
|
2741
|
+
/* @__PURE__ */ jsx31("span", { children: account.email })
|
|
2696
2742
|
] }),
|
|
2697
2743
|
items: [{ label: "Sign out", icon: "logout", danger: true }],
|
|
2698
2744
|
onSelect: onSignOut
|
|
2699
2745
|
}
|
|
2700
2746
|
) })
|
|
2701
2747
|
] }),
|
|
2702
|
-
/* @__PURE__ */
|
|
2703
|
-
back && /* @__PURE__ */
|
|
2704
|
-
/* @__PURE__ */
|
|
2705
|
-
lede && /* @__PURE__ */
|
|
2706
|
-
actions && /* @__PURE__ */
|
|
2707
|
-
/* @__PURE__ */
|
|
2748
|
+
/* @__PURE__ */ jsxs26("main", { className: `ui-app__main${width === "wide" ? " ui-app__main--wide" : ""}`, children: [
|
|
2749
|
+
back && /* @__PURE__ */ jsx31(BackLink, { ...back }),
|
|
2750
|
+
/* @__PURE__ */ jsx31("h1", { children: title }),
|
|
2751
|
+
lede && /* @__PURE__ */ jsx31("p", { className: "ui-app__sub", children: lede }),
|
|
2752
|
+
actions && /* @__PURE__ */ jsx31("div", { className: "ui-react-app__actions", children: actions }),
|
|
2753
|
+
/* @__PURE__ */ jsx31("div", { className: "ui-app__body", children })
|
|
2708
2754
|
] })
|
|
2709
2755
|
] }),
|
|
2710
|
-
/* @__PURE__ */
|
|
2756
|
+
/* @__PURE__ */ jsx31("nav", { className: "ui-nav ui-react-app__bottom", "aria-label": "Sections on mobile", children: /* @__PURE__ */ jsxs26("ul", { className: "ui-nav__list", children: [
|
|
2711
2757
|
links(visible),
|
|
2712
|
-
remaining.length > 0 && /* @__PURE__ */
|
|
2758
|
+
remaining.length > 0 && /* @__PURE__ */ jsx31("li", { children: /* @__PURE__ */ jsxs26(
|
|
2713
2759
|
"button",
|
|
2714
2760
|
{
|
|
2715
2761
|
type: "button",
|
|
@@ -2718,20 +2764,20 @@ function AppShell({
|
|
|
2718
2764
|
"aria-expanded": more,
|
|
2719
2765
|
onClick: () => setMore(true),
|
|
2720
2766
|
children: [
|
|
2721
|
-
/* @__PURE__ */
|
|
2722
|
-
/* @__PURE__ */
|
|
2767
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__ic", children: /* @__PURE__ */ jsx31(Icon, { name: "moreHorizontal" }) }),
|
|
2768
|
+
/* @__PURE__ */ jsx31("span", { className: "ui-nav__label", children: "More" })
|
|
2723
2769
|
]
|
|
2724
2770
|
}
|
|
2725
2771
|
) })
|
|
2726
2772
|
] }) }),
|
|
2727
|
-
/* @__PURE__ */
|
|
2728
|
-
/* @__PURE__ */
|
|
2773
|
+
/* @__PURE__ */ jsx31(Drawer, { open: more, onClose: () => setMore(false), title: "More sections", side: "bottom", children: sidebar(remaining, "More sections") }),
|
|
2774
|
+
/* @__PURE__ */ jsx31(CommandPalette, { ...palette ?? { groups: [{ items: sections.map((section) => ({ id: section.href, ...section })) }] }, open: search, onClose: () => setSearch(false) })
|
|
2729
2775
|
] });
|
|
2730
2776
|
}
|
|
2731
2777
|
|
|
2732
2778
|
// src/EmptyState.tsx
|
|
2733
2779
|
import { icon as kitIcon2, illo } from "@apliteni/apliteni-ui";
|
|
2734
|
-
import { jsx as
|
|
2780
|
+
import { jsx as jsx32, jsxs as jsxs27 } from "react/jsx-runtime";
|
|
2735
2781
|
var cases = {
|
|
2736
2782
|
"first-run": { title: "Nothing needs you yet", sub: "New items will appear here when they need your attention.", icon: "check" },
|
|
2737
2783
|
"no-matches": { title: "No results in this view", sub: "Try another search or clear your filters.", icon: "search" },
|
|
@@ -2743,18 +2789,18 @@ function EmptyState({ variant = "first-run", title, sub, icon: icon6, art, actio
|
|
|
2743
2789
|
const heading = title ?? preset.title;
|
|
2744
2790
|
const guidance = sub ?? preset.sub;
|
|
2745
2791
|
const glyph = icon6 ?? preset.icon;
|
|
2746
|
-
return /* @__PURE__ */
|
|
2747
|
-
art ? typeof art === "string" ? /* @__PURE__ */
|
|
2748
|
-
heading && /* @__PURE__ */
|
|
2749
|
-
guidance && /* @__PURE__ */
|
|
2750
|
-
actions && /* @__PURE__ */
|
|
2792
|
+
return /* @__PURE__ */ jsxs27("div", { className: "ui-empty", children: [
|
|
2793
|
+
art ? typeof art === "string" ? /* @__PURE__ */ jsx32("div", { className: "ui-empty__art", dangerouslySetInnerHTML: { __html: /<svg/.test(art) ? art : illo(art) } }) : /* @__PURE__ */ jsx32("div", { className: "ui-empty__art", "aria-hidden": "true", children: art }) : glyph ? /* @__PURE__ */ jsx32("div", { className: "ui-empty__icon", dangerouslySetInnerHTML: { __html: kitIcon2(glyph) } }) : null,
|
|
2794
|
+
heading && /* @__PURE__ */ jsx32("div", { className: "ui-empty__title", children: heading }),
|
|
2795
|
+
guidance && /* @__PURE__ */ jsx32("div", { className: "ui-empty__sub", children: guidance }),
|
|
2796
|
+
actions && /* @__PURE__ */ jsx32("div", { className: "ui-empty__actions", children: actions })
|
|
2751
2797
|
] });
|
|
2752
2798
|
}
|
|
2753
2799
|
|
|
2754
2800
|
// src/ThemeToggle.tsx
|
|
2755
2801
|
import { useSyncExternalStore } from "react";
|
|
2756
2802
|
import { icon as icon5 } from "@apliteni/apliteni-ui";
|
|
2757
|
-
import { jsx as
|
|
2803
|
+
import { jsx as jsx33, jsxs as jsxs28 } from "react/jsx-runtime";
|
|
2758
2804
|
var STORAGE_KEY = "apliteni-strategy-theme";
|
|
2759
2805
|
var CHOICE_EVENT = "apliteni-theme-choice";
|
|
2760
2806
|
var THEME_INIT_SCRIPT = `(()=>{let t;try{t=localStorage.getItem('apliteni-strategy-theme')}catch{}document.documentElement.setAttribute('data-theme',t==='dark'||t==='light'?t:window.matchMedia?.('(prefers-color-scheme: light)').matches?'light':'dark')})()`;
|
|
@@ -2812,10 +2858,10 @@ function ThemeToggle({ labelled = false }) {
|
|
|
2812
2858
|
}
|
|
2813
2859
|
window.dispatchEvent(new Event(CHOICE_EVENT));
|
|
2814
2860
|
};
|
|
2815
|
-
const button = /* @__PURE__ */
|
|
2816
|
-
return labelled ? /* @__PURE__ */
|
|
2861
|
+
const button = /* @__PURE__ */ jsx33("button", { type: "button", className: "toggle", "aria-label": name, title: name, onClick: toggle, children: /* @__PURE__ */ jsx33("span", { className: "ic", "aria-hidden": "true", dangerouslySetInnerHTML: { __html: icon5(theme === "auto" ? "monitor" : theme === "light" ? "sun" : "moon") } }) });
|
|
2862
|
+
return labelled ? /* @__PURE__ */ jsxs28("span", { className: "ui-theme-toggle", children: [
|
|
2817
2863
|
button,
|
|
2818
|
-
/* @__PURE__ */
|
|
2864
|
+
/* @__PURE__ */ jsxs28("span", { children: [
|
|
2819
2865
|
label,
|
|
2820
2866
|
" theme"
|
|
2821
2867
|
] })
|
|
@@ -2833,6 +2879,7 @@ export {
|
|
|
2833
2879
|
Button,
|
|
2834
2880
|
Callout,
|
|
2835
2881
|
Card,
|
|
2882
|
+
Checkbox,
|
|
2836
2883
|
CommandPalette,
|
|
2837
2884
|
Confirm,
|
|
2838
2885
|
DEFAULT_PAGE_SIZE3 as DEFAULT_PAGE_SIZE,
|
|
@@ -2862,6 +2909,7 @@ export {
|
|
|
2862
2909
|
Snippet,
|
|
2863
2910
|
StatBand,
|
|
2864
2911
|
StatusDot,
|
|
2912
|
+
Switch,
|
|
2865
2913
|
THEME_INIT_SCRIPT,
|
|
2866
2914
|
Tabs,
|
|
2867
2915
|
TextArea,
|