@skiddph/prui 0.3.0 → 0.4.1
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/dist/app/app.d.ts +4 -1
- package/dist/app.js +1 -1
- package/dist/chunks/{auth-shell-DsAwGqf8.js → auth-shell-BYG_ozPZ.js} +405 -402
- package/dist/core/button.d.ts +7 -2
- package/dist/core/button.js +45 -32
- package/dist/core/card.d.ts +9 -2
- package/dist/core/card.js +73 -58
- package/dist/core/index.d.ts +1 -0
- package/dist/core/input.d.ts +14 -1
- package/dist/core/input.js +32 -17
- package/dist/core/surface.d.ts +40 -0
- package/dist/core/surface.js +37 -0
- package/dist/core.js +63 -60
- package/dist/forms/form.d.ts +78 -0
- package/dist/forms/index.d.ts +8 -0
- package/dist/forms/registry.d.ts +4 -0
- package/dist/forms/types.d.ts +55 -0
- package/dist/forms.js +364 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +150 -131
- package/dist/prui-utilities.css +1 -1
- package/dist/prui.css +37 -1
- package/dist/theme/base.css +36 -0
- package/dist/theme/index.d.ts +51 -0
- package/dist/theme.js +110 -35
- package/package.json +5 -1
|
@@ -1,71 +1,71 @@
|
|
|
1
1
|
import { jsx as e, jsxs as d, Fragment as je } from "react/jsx-runtime";
|
|
2
|
-
import * as
|
|
3
|
-
import { Routes as Me, Route as
|
|
4
|
-
import { X as Ie, Menu as _e, Search as qe,
|
|
2
|
+
import * as i from "react";
|
|
3
|
+
import { Routes as Me, Route as ee, Navigate as $e, MemoryRouter as Oe, BrowserRouter as ze, useLocation as se, useNavigate as Ae, Outlet as De, Link as Fe, NavLink as Le } from "react-router-dom";
|
|
4
|
+
import { X as Ie, Menu as _e, Search as qe, Palette as Be, ChevronDown as Ke, Pencil as Ve, Trash2 as Ue, Plus as Je, Clock as Ye } from "lucide-react";
|
|
5
5
|
import { cn as E } from "../core/cn.js";
|
|
6
|
-
import { Dropdown as
|
|
7
|
-
import { Button as
|
|
8
|
-
import { resolveThemeName as
|
|
9
|
-
import { Modal as
|
|
10
|
-
import { b as
|
|
11
|
-
import { Textarea as
|
|
12
|
-
import { Label as
|
|
13
|
-
import { Select as
|
|
14
|
-
import { Switch as
|
|
15
|
-
import { Card as
|
|
16
|
-
const
|
|
6
|
+
import { Dropdown as He } from "../core/dropdown.js";
|
|
7
|
+
import { Button as A } from "../core/button.js";
|
|
8
|
+
import { resolveThemeName as We, themeMode as Xe, readPersistedTheme as Ge, applyTheme as te, listThemes as Qe } from "../theme.js";
|
|
9
|
+
import { Modal as ie, confirmModal as Ze } from "../core/modal.js";
|
|
10
|
+
import { b as et, D as tt, a as rt } from "./data-table-toolbar-BUy2EWPy.js";
|
|
11
|
+
import { Textarea as at, Input as V } from "../core/input.js";
|
|
12
|
+
import { Label as nt } from "../core/label.js";
|
|
13
|
+
import { Select as oe } from "../core/select.js";
|
|
14
|
+
import { Switch as ue } from "../core/switch.js";
|
|
15
|
+
import { Card as ce, CardHeader as de, CardDescription as me, CardTitle as pe, CardContent as fe } from "../core/card.js";
|
|
16
|
+
const lt = [
|
|
17
17
|
{ path: "/login", name: "login" },
|
|
18
18
|
{ path: "/register", name: "register" },
|
|
19
19
|
{ path: "/forgot-password", name: "forgotPassword" },
|
|
20
20
|
{ path: "/reset-password", name: "resetPassword" },
|
|
21
21
|
{ path: "/otp", name: "otp" },
|
|
22
22
|
{ path: "/logout", name: "logout" }
|
|
23
|
-
],
|
|
23
|
+
], st = [
|
|
24
24
|
{ path: "/404", name: "notFound" },
|
|
25
25
|
{ path: "/error", name: "error" },
|
|
26
26
|
{ path: "/profile", name: "profile" },
|
|
27
27
|
{ path: "/settings", name: "settings" },
|
|
28
28
|
{ path: "/admin-setup", name: "adminSetup" }
|
|
29
29
|
];
|
|
30
|
-
function
|
|
31
|
-
const r = t === "auth" || t === "auth+utility", l = t === "utility" || t === "auth+utility",
|
|
32
|
-
...r ?
|
|
33
|
-
...l ?
|
|
34
|
-
], [
|
|
35
|
-
return
|
|
36
|
-
let
|
|
37
|
-
return import("../pages.js").then((
|
|
38
|
-
|
|
30
|
+
function it({ mode: t, config: a, children: n }) {
|
|
31
|
+
const r = t === "auth" || t === "auth+utility", l = t === "utility" || t === "auth+utility", m = [
|
|
32
|
+
...r ? lt : [],
|
|
33
|
+
...l ? st : []
|
|
34
|
+
], [p, v] = i.useState(null);
|
|
35
|
+
return i.useEffect(() => {
|
|
36
|
+
let h = !1;
|
|
37
|
+
return import("../pages.js").then((f) => {
|
|
38
|
+
h || v(f.PagesRegistry);
|
|
39
39
|
}), () => {
|
|
40
|
-
|
|
40
|
+
h = !0;
|
|
41
41
|
};
|
|
42
|
-
}, []),
|
|
43
|
-
|
|
44
|
-
const
|
|
45
|
-
return
|
|
42
|
+
}, []), p ? /* @__PURE__ */ d(Me, { children: [
|
|
43
|
+
m.map(({ path: h, name: f }) => {
|
|
44
|
+
const k = p[f];
|
|
45
|
+
return k ? /* @__PURE__ */ e(ee, { path: h, element: /* @__PURE__ */ e(k, { ...(a == null ? void 0 : a[f]) ?? {} }) }, h) : null;
|
|
46
46
|
}),
|
|
47
47
|
n,
|
|
48
|
-
r ? /* @__PURE__ */ e(
|
|
48
|
+
r ? /* @__PURE__ */ e(ee, { path: "*", element: /* @__PURE__ */ e($e, { to: "/login", replace: !0 }) }) : null
|
|
49
49
|
] }) : /* @__PURE__ */ e("div", { className: "p-8 text-center text-sm text-[var(--prui-dim)]", children: "Loading…" });
|
|
50
50
|
}
|
|
51
|
-
const
|
|
52
|
-
() => Promise.resolve().then(() =>
|
|
51
|
+
const ot = i.lazy(
|
|
52
|
+
() => Promise.resolve().then(() => Ct).then((t) => ({ default: t.SessionTimeout }))
|
|
53
53
|
);
|
|
54
|
-
function
|
|
55
|
-
const a = t !== !1, n = typeof t == "object" ? t : {}, r = n.persist !== !1, l =
|
|
56
|
-
(
|
|
57
|
-
f
|
|
54
|
+
function ut(t) {
|
|
55
|
+
const a = t !== !1, n = typeof t == "object" ? t : {}, r = n.persist !== !1, l = We(n.default ?? "control"), m = Xe(l), [p, v] = i.useState(() => (r ? Ge() : null) ?? { theme: l, mode: m }), h = i.useCallback(
|
|
56
|
+
(f) => {
|
|
57
|
+
v(f), te({ theme: f.theme, mode: f.mode, storageKey: r ? "prui:theme" : null });
|
|
58
58
|
},
|
|
59
59
|
[r]
|
|
60
60
|
);
|
|
61
|
-
return
|
|
62
|
-
|
|
63
|
-
}, [
|
|
61
|
+
return i.useEffect(() => {
|
|
62
|
+
te({ theme: p.theme, mode: p.mode, storageKey: r ? "prui:theme" : null });
|
|
63
|
+
}, [p, r]), { enabled: a, state: p, setTheme: h };
|
|
64
64
|
}
|
|
65
|
-
function
|
|
66
|
-
const { enabled: a, state: n, setTheme: r } =
|
|
65
|
+
function ct({ config: t }) {
|
|
66
|
+
const { enabled: a, state: n, setTheme: r } = ut(t);
|
|
67
67
|
return a ? /* @__PURE__ */ e(
|
|
68
|
-
|
|
68
|
+
He,
|
|
69
69
|
{
|
|
70
70
|
align: "end",
|
|
71
71
|
trigger: /* @__PURE__ */ e(
|
|
@@ -73,63 +73,64 @@ function ut({ config: t }) {
|
|
|
73
73
|
{
|
|
74
74
|
type: "button",
|
|
75
75
|
"aria-label": "Switch theme",
|
|
76
|
+
title: `Theme: ${n.theme}`,
|
|
76
77
|
"data-testid": "theme-toggle",
|
|
77
78
|
className: "inline-flex h-8 w-8 items-center justify-center rounded-[var(--prui-radius)] text-[var(--prui-dim)] hover:bg-[var(--prui-raise)] hover:text-[var(--prui-fg)] cursor-pointer",
|
|
78
|
-
children: /* @__PURE__ */ e(
|
|
79
|
+
children: /* @__PURE__ */ e(Be, { className: "h-4 w-4", "aria-hidden": !0 })
|
|
79
80
|
}
|
|
80
81
|
),
|
|
81
|
-
items:
|
|
82
|
+
items: Qe().map((l) => ({
|
|
82
83
|
label: `${l}${l === n.theme ? " (active)" : ""}`,
|
|
83
84
|
onSelect: () => r({ theme: l, mode: l === "daylight" ? "light" : "dark" })
|
|
84
85
|
}))
|
|
85
86
|
}
|
|
86
87
|
) : null;
|
|
87
88
|
}
|
|
88
|
-
function
|
|
89
|
+
function re(t, a) {
|
|
89
90
|
return a === "/" ? t === "/" : t === a || t.startsWith(a + "/");
|
|
90
91
|
}
|
|
91
|
-
function
|
|
92
|
-
const { pathname:
|
|
93
|
-
(
|
|
94
|
-
), [
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
}, [
|
|
98
|
-
const
|
|
92
|
+
function dt({ item: t, onNavigate: a, expandAllOn: n }) {
|
|
93
|
+
const { pathname: r } = se(), l = (t.items ?? []).some(
|
|
94
|
+
(h) => h.href ? re(r, h.href) : (h.items ?? []).some((f) => f.href && re(r, f.href))
|
|
95
|
+
), [m, p] = i.useState(l || n !== void 0 && r === n);
|
|
96
|
+
i.useEffect(() => {
|
|
97
|
+
l && p(!0);
|
|
98
|
+
}, [l]);
|
|
99
|
+
const v = t.icon;
|
|
99
100
|
return /* @__PURE__ */ d("li", { "data-testid": "nav-group", children: [
|
|
100
101
|
/* @__PURE__ */ d(
|
|
101
102
|
"button",
|
|
102
103
|
{
|
|
103
104
|
type: "button",
|
|
104
|
-
"aria-expanded":
|
|
105
|
-
onClick: () => p((
|
|
105
|
+
"aria-expanded": m,
|
|
106
|
+
onClick: () => p((h) => !h),
|
|
106
107
|
className: E(
|
|
107
108
|
"flex w-full items-center gap-2 rounded-[var(--prui-radius)] px-2.5 py-1.5 text-sm cursor-pointer",
|
|
108
|
-
|
|
109
|
+
l ? "text-[var(--prui-fg)]" : "text-[var(--prui-dim)] hover:text-[var(--prui-fg)]"
|
|
109
110
|
),
|
|
110
111
|
children: [
|
|
111
|
-
|
|
112
|
+
v ? /* @__PURE__ */ e(v, { className: "h-4 w-4 shrink-0", "aria-hidden": !0 }) : null,
|
|
112
113
|
/* @__PURE__ */ e("span", { className: "flex-1 text-left truncate", children: t.label }),
|
|
113
|
-
/* @__PURE__ */ e(
|
|
114
|
+
/* @__PURE__ */ e(Ke, { className: E("h-4 w-4 transition-transform", !m && "-rotate-90"), "aria-hidden": !0 })
|
|
114
115
|
]
|
|
115
116
|
}
|
|
116
117
|
),
|
|
117
|
-
|
|
118
|
+
m ? /* @__PURE__ */ e("ul", { className: "ml-4 mt-0.5 flex flex-col gap-0.5 border-l border-[var(--prui-line)] pl-2", children: (t.items ?? []).map((h) => /* @__PURE__ */ e(he, { item: h, onNavigate: a, nested: !0, expandAllOn: n }, h.href ?? h.label)) }) : null
|
|
118
119
|
] });
|
|
119
120
|
}
|
|
120
|
-
function
|
|
121
|
+
function mt({ label: t }) {
|
|
121
122
|
return /* @__PURE__ */ e("li", { className: "px-2.5 pb-1 pt-3 text-[10px] font-semibold uppercase tracking-[0.1em] text-[var(--prui-dim)]", "data-testid": "nav-subgroup", children: t });
|
|
122
123
|
}
|
|
123
|
-
function
|
|
124
|
-
return t.items && t.items.length > 0 ? /* @__PURE__ */ e(
|
|
124
|
+
function he({ item: t, onNavigate: a, nested: n, expandAllOn: r }) {
|
|
125
|
+
return t.items && t.items.length > 0 ? /* @__PURE__ */ e(dt, { item: t, onNavigate: a, expandAllOn: r }) : t.heading || !t.href && !t.items ? /* @__PURE__ */ e(mt, { label: t.label }) : t.href ? /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
|
|
125
126
|
Le,
|
|
126
127
|
{
|
|
127
128
|
to: t.href,
|
|
128
129
|
onClick: a,
|
|
129
|
-
className: ({ isActive:
|
|
130
|
+
className: ({ isActive: l }) => E(
|
|
130
131
|
"flex items-center gap-2 rounded-[var(--prui-radius)] px-2.5 py-1.5 text-sm",
|
|
131
132
|
n && "pl-2.5",
|
|
132
|
-
|
|
133
|
+
l ? "bg-[var(--prui-brand)]/15 text-[var(--prui-brand)] font-medium" : "text-[var(--prui-dim)] hover:text-[var(--prui-fg)] hover:bg-[var(--prui-raise)]"
|
|
133
134
|
),
|
|
134
135
|
children: [
|
|
135
136
|
t.icon && !n ? /* @__PURE__ */ e(t.icon, { className: "h-4 w-4 shrink-0", "aria-hidden": !0 }) : null,
|
|
@@ -138,10 +139,10 @@ function fe({ item: t, onNavigate: a, nested: n }) {
|
|
|
138
139
|
}
|
|
139
140
|
) }) : null;
|
|
140
141
|
}
|
|
141
|
-
function
|
|
142
|
-
return /* @__PURE__ */ e("nav", { "aria-label": "Main", className: "prui-app-nav", children: /* @__PURE__ */ e("ul", { className: "flex flex-col gap-0.5", children: t.map((
|
|
142
|
+
function ae({ nav: t, onNavigate: a, expandAllOn: n }) {
|
|
143
|
+
return /* @__PURE__ */ e("nav", { "aria-label": "Main", className: "prui-app-nav", children: /* @__PURE__ */ e("ul", { className: "flex flex-col gap-0.5", children: t.map((r) => /* @__PURE__ */ e(he, { item: r, onNavigate: a, expandAllOn: n }, r.href ?? r.label)) }) });
|
|
143
144
|
}
|
|
144
|
-
function
|
|
145
|
+
function pt({ brand: t }) {
|
|
145
146
|
if (!t) return null;
|
|
146
147
|
const a = /* @__PURE__ */ d(je, { children: [
|
|
147
148
|
t.mark ? /* @__PURE__ */ e("img", { src: t.mark, alt: "", className: "h-6 w-6 rounded-[var(--prui-radius-1)] object-cover" }) : null,
|
|
@@ -149,28 +150,28 @@ function mt({ brand: t }) {
|
|
|
149
150
|
] }), n = "flex items-center gap-2 px-1 py-1 min-w-0";
|
|
150
151
|
return t.href === null ? /* @__PURE__ */ e("div", { className: n, children: a }) : /* @__PURE__ */ e(Fe, { to: t.href ?? "/", className: n, "aria-label": t.name, children: a });
|
|
151
152
|
}
|
|
152
|
-
function
|
|
153
|
+
function ft({
|
|
153
154
|
open: t,
|
|
154
155
|
onOpenChange: a,
|
|
155
156
|
entries: n,
|
|
156
157
|
placeholder: r = "Type a command or search...",
|
|
157
158
|
onNavigate: l
|
|
158
159
|
}) {
|
|
159
|
-
const [
|
|
160
|
-
const
|
|
161
|
-
return
|
|
162
|
-
}, [n,
|
|
163
|
-
if (
|
|
164
|
-
const
|
|
165
|
-
a(!1),
|
|
160
|
+
const [m, p] = i.useState(""), [v, h] = i.useState(0), f = i.useMemo(() => {
|
|
161
|
+
const u = m.trim().toLowerCase();
|
|
162
|
+
return u ? n.filter((b) => b.label.toLowerCase().includes(u)) : n;
|
|
163
|
+
}, [n, m]);
|
|
164
|
+
if (i.useEffect(() => h(0), [m]), !t) return null;
|
|
165
|
+
const k = (u) => {
|
|
166
|
+
a(!1), u.onSelect ? u.onSelect() : u.href && (l == null || l(u.href));
|
|
166
167
|
};
|
|
167
168
|
return /* @__PURE__ */ e(
|
|
168
169
|
"div",
|
|
169
170
|
{
|
|
170
171
|
className: "fixed inset-0 z-50 flex items-start justify-center pt-24",
|
|
171
172
|
style: { backgroundColor: "rgba(0,0,0,0.55)" },
|
|
172
|
-
onMouseDown: (
|
|
173
|
-
|
|
173
|
+
onMouseDown: (u) => {
|
|
174
|
+
u.target === u.currentTarget && a(!1);
|
|
174
175
|
},
|
|
175
176
|
children: /* @__PURE__ */ d(
|
|
176
177
|
"div",
|
|
@@ -189,37 +190,37 @@ function pt({
|
|
|
189
190
|
role: "combobox",
|
|
190
191
|
"aria-expanded": "true",
|
|
191
192
|
"aria-label": "Command palette search",
|
|
192
|
-
"aria-activedescendant":
|
|
193
|
+
"aria-activedescendant": f[v] ? `palette-option-${v}` : void 0,
|
|
193
194
|
placeholder: r,
|
|
194
|
-
value:
|
|
195
|
-
onChange: (
|
|
196
|
-
onKeyDown: (
|
|
197
|
-
if (
|
|
198
|
-
const b =
|
|
195
|
+
value: m,
|
|
196
|
+
onChange: (u) => p(u.target.value),
|
|
197
|
+
onKeyDown: (u) => {
|
|
198
|
+
if (u.key === "Escape" && a(!1), u.key === "ArrowDown" && (u.preventDefault(), h((b) => Math.min(b + 1, f.length - 1))), u.key === "ArrowUp" && (u.preventDefault(), h((b) => Math.max(b - 1, 0))), u.key === "Enter") {
|
|
199
|
+
const b = f[v];
|
|
199
200
|
b && (a(!1), b.onSelect ? b.onSelect() : b.href && (l == null || l(b.href)));
|
|
200
201
|
}
|
|
201
202
|
},
|
|
202
203
|
className: "w-full bg-transparent px-4 py-3 text-sm text-[var(--prui-fg)] placeholder:text-[var(--prui-dim)] outline-none border-b border-[var(--prui-line)] rounded-t-[var(--prui-radius)]"
|
|
203
204
|
}
|
|
204
205
|
),
|
|
205
|
-
/* @__PURE__ */ e("ul", { role: "listbox", className: "max-h-64 overflow-auto p-1", children:
|
|
206
|
+
/* @__PURE__ */ e("ul", { role: "listbox", className: "max-h-64 overflow-auto p-1", children: f.length === 0 ? /* @__PURE__ */ e("li", { className: "px-3 py-2 text-sm text-[var(--prui-dim)]", children: "No matches." }) : f.map((u, b) => /* @__PURE__ */ d(
|
|
206
207
|
"li",
|
|
207
208
|
{
|
|
208
209
|
id: `palette-option-${b}`,
|
|
209
210
|
role: "option",
|
|
210
|
-
"aria-selected": b ===
|
|
211
|
-
onMouseEnter: () =>
|
|
212
|
-
onClick: () =>
|
|
211
|
+
"aria-selected": b === v,
|
|
212
|
+
onMouseEnter: () => h(b),
|
|
213
|
+
onClick: () => k(u),
|
|
213
214
|
className: E(
|
|
214
215
|
"cursor-pointer rounded-[calc(var(--prui-radius)-1px)] px-3 py-2 text-sm text-[var(--prui-fg)]",
|
|
215
|
-
b ===
|
|
216
|
+
b === v && "bg-[var(--prui-raise)]"
|
|
216
217
|
),
|
|
217
218
|
children: [
|
|
218
|
-
|
|
219
|
-
|
|
219
|
+
u.group ? /* @__PURE__ */ e("span", { className: "mr-2 text-xs text-[var(--prui-dim)]", children: u.group }) : null,
|
|
220
|
+
u.label
|
|
220
221
|
]
|
|
221
222
|
},
|
|
222
|
-
`${
|
|
223
|
+
`${u.label}-${b}`
|
|
223
224
|
)) })
|
|
224
225
|
]
|
|
225
226
|
}
|
|
@@ -227,68 +228,69 @@ function pt({
|
|
|
227
228
|
}
|
|
228
229
|
);
|
|
229
230
|
}
|
|
230
|
-
function
|
|
231
|
+
function ht(t) {
|
|
231
232
|
const {
|
|
232
233
|
brand: a,
|
|
233
234
|
nav: n = [],
|
|
234
235
|
search: r = !0,
|
|
235
236
|
theme: l = !0,
|
|
236
|
-
auth:
|
|
237
|
-
sidebar:
|
|
238
|
-
header:
|
|
239
|
-
pages:
|
|
240
|
-
pagesConfig:
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
237
|
+
auth: m = !1,
|
|
238
|
+
sidebar: p = {},
|
|
239
|
+
header: v,
|
|
240
|
+
pages: h,
|
|
241
|
+
pagesConfig: f,
|
|
242
|
+
expandAllOn: k,
|
|
243
|
+
children: u
|
|
244
|
+
} = t, b = typeof r == "object" ? r : { enabled: r !== !1 }, M = b.enabled !== !1, P = b.hotkey ?? "/", O = p.collapsible !== !1, [y, T] = i.useState(p.defaultOpen === !0), [R, C] = i.useState(!1), $ = se(), w = Ae(), s = i.useMemo(
|
|
245
|
+
() => m === !1 ? null : m === !0 ? {} : m,
|
|
246
|
+
[m]
|
|
247
|
+
), g = i.useCallback(() => {
|
|
248
|
+
s != null && s.onTimeout ? s.onTimeout() : w((s == null ? void 0 : s.loginPath) ?? "/login");
|
|
249
|
+
}, [s, w]), x = i.useMemo(() => {
|
|
250
|
+
const N = [];
|
|
251
|
+
for (const S of n)
|
|
252
|
+
if (S.items)
|
|
253
|
+
for (const j of S.items)
|
|
254
|
+
j.href && N.push({ label: `${S.label} / ${j.label}`, href: j.href, group: S.label });
|
|
255
|
+
else S.href && N.push({ label: S.label, href: S.href });
|
|
256
|
+
return N;
|
|
255
257
|
}, [n]);
|
|
256
|
-
|
|
257
|
-
if (!
|
|
258
|
-
const
|
|
259
|
-
const j =
|
|
260
|
-
|
|
258
|
+
i.useEffect(() => {
|
|
259
|
+
if (!M) return;
|
|
260
|
+
const N = (S) => {
|
|
261
|
+
const j = S.target, q = j && (j.tagName === "INPUT" || j.tagName === "TEXTAREA" || j.isContentEditable);
|
|
262
|
+
S.key === P && !q && !S.metaKey && !S.ctrlKey && !S.altKey && (S.preventDefault(), C(!0));
|
|
261
263
|
};
|
|
262
|
-
return document.addEventListener("keydown",
|
|
263
|
-
}, [
|
|
264
|
-
const
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
}, [
|
|
268
|
-
if (!
|
|
269
|
-
const
|
|
264
|
+
return document.addEventListener("keydown", N), () => document.removeEventListener("keydown", N);
|
|
265
|
+
}, [P, M]);
|
|
266
|
+
const c = i.useRef($.pathname);
|
|
267
|
+
i.useEffect(() => {
|
|
268
|
+
c.current !== $.pathname && (c.current = $.pathname, T(!1));
|
|
269
|
+
}, [$.pathname]), i.useEffect(() => {
|
|
270
|
+
if (!y) return;
|
|
271
|
+
const N = document.body.style.overflow;
|
|
270
272
|
return document.body.style.overflow = "hidden", () => {
|
|
271
|
-
document.body.style.overflow =
|
|
273
|
+
document.body.style.overflow = N;
|
|
272
274
|
};
|
|
273
|
-
}, [
|
|
274
|
-
const
|
|
275
|
+
}, [y]);
|
|
276
|
+
const z = p.width ?? 240;
|
|
275
277
|
return /* @__PURE__ */ d("div", { className: "prui-app flex min-h-screen bg-[var(--prui-background)] text-[var(--prui-fg)]", children: [
|
|
276
278
|
/* @__PURE__ */ e(
|
|
277
279
|
"aside",
|
|
278
280
|
{
|
|
279
281
|
"data-testid": "sidebar",
|
|
280
282
|
className: "hidden md:block md:fixed md:inset-y-0 md:left-0 md:z-30 md:w-[var(--prui-sidebar-width)] md:border-r md:border-[var(--prui-line)] md:bg-[var(--prui-surface)]",
|
|
281
|
-
style: { "--prui-sidebar-width": `${
|
|
282
|
-
children: /* @__PURE__ */ e("div", { className: "h-full overflow-y-auto p-2 pt-4 scrollbar-thin", children: /* @__PURE__ */ e(
|
|
283
|
+
style: { "--prui-sidebar-width": `${z}px` },
|
|
284
|
+
children: /* @__PURE__ */ e("div", { className: "h-full overflow-y-auto p-2 pt-4 scrollbar-thin", children: /* @__PURE__ */ e(ae, { nav: n, expandAllOn: k }) })
|
|
283
285
|
}
|
|
284
286
|
),
|
|
285
|
-
|
|
287
|
+
y ? /* @__PURE__ */ d("div", { className: "md:hidden fixed inset-0 z-40", "data-testid": "mobile-drawer", children: [
|
|
286
288
|
/* @__PURE__ */ e(
|
|
287
289
|
"div",
|
|
288
290
|
{
|
|
289
291
|
className: "absolute inset-0",
|
|
290
292
|
style: { backgroundColor: "rgba(0,0,0,0.55)" },
|
|
291
|
-
onClick: () =>
|
|
293
|
+
onClick: () => T(!1),
|
|
292
294
|
"data-testid": "drawer-backdrop"
|
|
293
295
|
}
|
|
294
296
|
),
|
|
@@ -305,37 +307,37 @@ function ft(t) {
|
|
|
305
307
|
{
|
|
306
308
|
type: "button",
|
|
307
309
|
"aria-label": "Close navigation",
|
|
308
|
-
onClick: () =>
|
|
310
|
+
onClick: () => T(!1),
|
|
309
311
|
className: "rounded-[var(--prui-radius)] p-1 text-[var(--prui-dim)] hover:text-[var(--prui-fg)] cursor-pointer",
|
|
310
312
|
children: /* @__PURE__ */ e(Ie, { className: "h-4 w-4", "aria-hidden": !0 })
|
|
311
313
|
}
|
|
312
314
|
) }),
|
|
313
|
-
/* @__PURE__ */ e(
|
|
315
|
+
/* @__PURE__ */ e(ae, { nav: n, onNavigate: () => T(!1), expandAllOn: k })
|
|
314
316
|
]
|
|
315
317
|
}
|
|
316
318
|
)
|
|
317
319
|
] }) : null,
|
|
318
|
-
/* @__PURE__ */ d("div", { className: "flex min-w-0 flex-1 flex-col md:ml-[var(--prui-sidebar-width)]", style: { "--prui-sidebar-width": `${
|
|
320
|
+
/* @__PURE__ */ d("div", { className: "flex min-w-0 flex-1 flex-col md:ml-[var(--prui-sidebar-width)]", style: { "--prui-sidebar-width": `${z}px` }, children: [
|
|
319
321
|
/* @__PURE__ */ d(
|
|
320
322
|
"header",
|
|
321
323
|
{
|
|
322
324
|
"data-testid": "app-header",
|
|
323
325
|
className: "sticky top-0 z-30 grid h-14 grid-cols-[1fr_auto_1fr] items-center gap-4 border-b border-[var(--prui-line)] bg-[var(--prui-surface)] px-4 md:px-6",
|
|
324
326
|
children: [
|
|
325
|
-
|
|
326
|
-
|
|
327
|
+
O ? /* @__PURE__ */ e(
|
|
328
|
+
A,
|
|
327
329
|
{
|
|
328
330
|
variant: "ghost",
|
|
329
331
|
size: "icon",
|
|
330
332
|
"aria-label": "Open navigation",
|
|
331
333
|
className: "md:hidden",
|
|
332
|
-
onClick: () =>
|
|
334
|
+
onClick: () => T(!0),
|
|
333
335
|
"data-testid": "drawer-toggle",
|
|
334
336
|
children: /* @__PURE__ */ e(_e, { className: "h-4 w-4", "aria-hidden": !0 })
|
|
335
337
|
}
|
|
336
338
|
) : null,
|
|
337
|
-
/* @__PURE__ */ e("div", { className: "min-w-0 justify-self-start", children: /* @__PURE__ */ e(
|
|
338
|
-
|
|
339
|
+
/* @__PURE__ */ e("div", { className: "min-w-0 justify-self-start", children: /* @__PURE__ */ e(pt, { brand: a }) }),
|
|
340
|
+
M ? /* @__PURE__ */ d(
|
|
339
341
|
"button",
|
|
340
342
|
{
|
|
341
343
|
type: "button",
|
|
@@ -344,36 +346,36 @@ function ft(t) {
|
|
|
344
346
|
className: "hidden h-8 w-[min(420px,34vw)] items-center gap-2 rounded-[var(--prui-radius)] border border-[var(--prui-line)] bg-[var(--prui-background)] px-3.5 text-sm text-[var(--prui-dim)] hover:border-[var(--prui-dim)] cursor-pointer md:flex",
|
|
345
347
|
children: [
|
|
346
348
|
/* @__PURE__ */ e(qe, { className: "h-4 w-4", "aria-hidden": !0 }),
|
|
347
|
-
/* @__PURE__ */ e("span", { className: "flex-1 text-left", children:
|
|
348
|
-
/* @__PURE__ */ e("kbd", { className: "ml-auto rounded-[var(--prui-radius-1)] border border-[var(--prui-line)] bg-[var(--prui-raise)] px-1.5 py-0.5 text-xs", children:
|
|
349
|
+
/* @__PURE__ */ e("span", { className: "flex-1 text-left", children: b.placeholder ?? "Search..." }),
|
|
350
|
+
/* @__PURE__ */ e("kbd", { className: "ml-auto rounded-[var(--prui-radius-1)] border border-[var(--prui-line)] bg-[var(--prui-raise)] px-1.5 py-0.5 text-xs", children: P })
|
|
349
351
|
]
|
|
350
352
|
}
|
|
351
353
|
) : null,
|
|
352
354
|
/* @__PURE__ */ d("div", { className: "flex items-center gap-2 justify-self-end", children: [
|
|
353
|
-
|
|
354
|
-
/* @__PURE__ */ e(
|
|
355
|
+
v,
|
|
356
|
+
/* @__PURE__ */ e(ct, { config: l })
|
|
355
357
|
] })
|
|
356
358
|
]
|
|
357
359
|
}
|
|
358
360
|
),
|
|
359
|
-
/* @__PURE__ */ e("main", { className: "flex-1 p-4 md:p-6", children:
|
|
361
|
+
/* @__PURE__ */ e("main", { className: "flex-1 p-4 md:p-6", children: h ? /* @__PURE__ */ e(it, { mode: h, config: f, children: u }) : u ?? /* @__PURE__ */ e(De, {}) })
|
|
360
362
|
] }),
|
|
361
|
-
|
|
362
|
-
|
|
363
|
+
s ? /* @__PURE__ */ e(i.Suspense, { fallback: null, children: /* @__PURE__ */ e(
|
|
364
|
+
ot,
|
|
363
365
|
{
|
|
364
|
-
timeout:
|
|
365
|
-
warningTime:
|
|
366
|
-
onTimeout:
|
|
366
|
+
timeout: s.sessionTimeout,
|
|
367
|
+
warningTime: s.warningTime,
|
|
368
|
+
onTimeout: g
|
|
367
369
|
}
|
|
368
370
|
) }) : null,
|
|
369
|
-
|
|
371
|
+
M ? /* @__PURE__ */ e(ft, { open: R, onOpenChange: C, entries: x, placeholder: b.placeholder, onNavigate: w }) : null
|
|
370
372
|
] });
|
|
371
373
|
}
|
|
372
|
-
function
|
|
374
|
+
function _t(t) {
|
|
373
375
|
const { router: a = "browser", initialEntries: n } = t;
|
|
374
|
-
return /* @__PURE__ */ e(a === "memory" ? Oe : ze, { initialEntries: n, children: /* @__PURE__ */ e(
|
|
376
|
+
return /* @__PURE__ */ e(a === "memory" ? Oe : ze, { initialEntries: n, children: /* @__PURE__ */ e(ht, { ...t }) });
|
|
375
377
|
}
|
|
376
|
-
const
|
|
378
|
+
const qt = {
|
|
377
379
|
name: "App",
|
|
378
380
|
props: [
|
|
379
381
|
{ name: "brand", type: "{ name, mark?, href? }", default: "undefined", control: "object" },
|
|
@@ -385,139 +387,140 @@ const _t = {
|
|
|
385
387
|
{ name: "router", type: "'browser' | 'memory'", default: "'browser'", control: "select", options: ["browser", "memory", "react-router"] },
|
|
386
388
|
{ name: "initialEntries", type: "string[]", default: "undefined", control: "object" },
|
|
387
389
|
{ name: "pages", type: "'auth' | 'utility' | 'auth+utility'", default: "undefined", control: "select", options: ["auth", "utility", "auth+utility"] },
|
|
390
|
+
{ name: "expandAllOn", type: "string (pathname)", default: "undefined", control: "text" },
|
|
388
391
|
{ name: "header", type: "ReactNode", default: null, control: "none" },
|
|
389
392
|
{ name: "children", type: "ReactNode", default: "Outlet", control: "none" }
|
|
390
393
|
]
|
|
391
394
|
};
|
|
392
|
-
function
|
|
395
|
+
function bt(t) {
|
|
393
396
|
return Array.isArray(t) ? { fields: t } : t;
|
|
394
397
|
}
|
|
395
|
-
function
|
|
398
|
+
function gt(t) {
|
|
396
399
|
if (t)
|
|
397
400
|
return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
|
|
398
401
|
}
|
|
399
|
-
function
|
|
402
|
+
function ne(t, a) {
|
|
400
403
|
const n = {};
|
|
401
404
|
for (const r of t.fields)
|
|
402
405
|
a && r.name in a ? n[r.name] = a[r.name] : r.defaultValue !== void 0 ? n[r.name] = r.defaultValue : r.type === "boolean" ? n[r.name] = !1 : n[r.name] = "";
|
|
403
406
|
return n;
|
|
404
407
|
}
|
|
405
|
-
function
|
|
408
|
+
function vt({
|
|
406
409
|
schema: t,
|
|
407
410
|
initialValues: a,
|
|
408
411
|
defaultValues: n,
|
|
409
412
|
onSubmit: r,
|
|
410
413
|
onCancel: l,
|
|
411
|
-
cancelLabel:
|
|
412
|
-
submitting:
|
|
413
|
-
error:
|
|
414
|
-
className:
|
|
414
|
+
cancelLabel: m = "Cancel",
|
|
415
|
+
submitting: p = !1,
|
|
416
|
+
error: v,
|
|
417
|
+
className: h
|
|
415
418
|
}) {
|
|
416
|
-
const
|
|
417
|
-
|
|
418
|
-
b(
|
|
419
|
-
}, [JSON.stringify(
|
|
420
|
-
const
|
|
421
|
-
b((
|
|
422
|
-
if (!
|
|
423
|
-
const c = { ...
|
|
424
|
-
return delete c[
|
|
419
|
+
const f = i.useMemo(() => bt(t), [t]), k = a ?? n, [u, b] = i.useState(() => ne(f, k)), [M, P] = i.useState({}), [O, y] = i.useState(null), [T, R] = i.useState(!1);
|
|
420
|
+
i.useEffect(() => {
|
|
421
|
+
b(ne(f, k));
|
|
422
|
+
}, [JSON.stringify(f), JSON.stringify(k ?? {})]);
|
|
423
|
+
const C = (s, g) => {
|
|
424
|
+
b((x) => ({ ...x, [s]: g })), P((x) => {
|
|
425
|
+
if (!x[s]) return x;
|
|
426
|
+
const c = { ...x };
|
|
427
|
+
return delete c[s], c;
|
|
425
428
|
});
|
|
426
|
-
},
|
|
427
|
-
var
|
|
428
|
-
|
|
429
|
+
}, $ = async (s) => {
|
|
430
|
+
var x;
|
|
431
|
+
s.preventDefault();
|
|
429
432
|
const g = {};
|
|
430
|
-
for (const c of
|
|
433
|
+
for (const c of f.fields) {
|
|
431
434
|
if (c.required) {
|
|
432
|
-
const N =
|
|
435
|
+
const N = u[c.name];
|
|
433
436
|
(N === "" || N == null || Array.isArray(N) && N.length === 0) && (g[c.name] = c.name === void 0 ? "Required" : `${c.label} is required.`);
|
|
434
437
|
}
|
|
435
|
-
const
|
|
436
|
-
|
|
438
|
+
const z = (x = c.validate) == null ? void 0 : x.call(c, u[c.name], u);
|
|
439
|
+
z && (g[c.name] = z);
|
|
437
440
|
}
|
|
438
|
-
if (
|
|
439
|
-
|
|
441
|
+
if (P(g), !(Object.keys(g).length > 0)) {
|
|
442
|
+
y(null);
|
|
440
443
|
try {
|
|
441
|
-
const c = r == null ? void 0 : r({ ...
|
|
442
|
-
c && typeof c.then == "function" && (
|
|
444
|
+
const c = r == null ? void 0 : r({ ...u });
|
|
445
|
+
c && typeof c.then == "function" && (R(!0), await c);
|
|
443
446
|
} catch (c) {
|
|
444
|
-
|
|
447
|
+
y(c instanceof Error ? c.message : String(c));
|
|
445
448
|
} finally {
|
|
446
|
-
|
|
449
|
+
R(!1);
|
|
447
450
|
}
|
|
448
451
|
}
|
|
449
|
-
},
|
|
450
|
-
return /* @__PURE__ */ d("form", { onSubmit:
|
|
451
|
-
/* @__PURE__ */ e("div", { className: E("grid gap-4",
|
|
452
|
-
const g = M[
|
|
453
|
-
id: `prui-form-${
|
|
452
|
+
}, w = p || T;
|
|
453
|
+
return /* @__PURE__ */ d("form", { onSubmit: $, className: E("prui-form flex flex-col gap-4", h), noValidate: !0, children: [
|
|
454
|
+
/* @__PURE__ */ e("div", { className: E("grid gap-4", f.columns === 2 && "md:grid-cols-2"), children: f.fields.map((s) => {
|
|
455
|
+
const g = M[s.name], x = {
|
|
456
|
+
id: `prui-form-${s.name}`,
|
|
454
457
|
"aria-invalid": g ? !0 : void 0,
|
|
455
|
-
"aria-describedby": g ? `prui-form-${
|
|
458
|
+
"aria-describedby": g ? `prui-form-${s.name}-error` : void 0
|
|
456
459
|
};
|
|
457
|
-
return /* @__PURE__ */ d("div", { className: E("flex flex-col gap-1.5",
|
|
458
|
-
/* @__PURE__ */ d(
|
|
459
|
-
|
|
460
|
-
|
|
460
|
+
return /* @__PURE__ */ d("div", { className: E("flex flex-col gap-1.5", s.colSpan === 2 && "md:col-span-2", s.className), children: [
|
|
461
|
+
/* @__PURE__ */ d(nt, { htmlFor: x.id, children: [
|
|
462
|
+
s.label,
|
|
463
|
+
s.required ? /* @__PURE__ */ e("span", { className: "ml-0.5 text-[var(--prui-danger)]", children: "*" }) : null
|
|
461
464
|
] }),
|
|
462
|
-
|
|
463
|
-
|
|
465
|
+
s.type === "textarea" ? /* @__PURE__ */ e(
|
|
466
|
+
at,
|
|
464
467
|
{
|
|
465
|
-
...
|
|
466
|
-
placeholder:
|
|
467
|
-
disabled:
|
|
468
|
-
value: String(
|
|
469
|
-
onChange: (c) =>
|
|
468
|
+
...x,
|
|
469
|
+
placeholder: s.placeholder,
|
|
470
|
+
disabled: s.disabled || w,
|
|
471
|
+
value: String(u[s.name] ?? ""),
|
|
472
|
+
onChange: (c) => C(s.name, c.target.value)
|
|
470
473
|
}
|
|
471
|
-
) :
|
|
472
|
-
|
|
474
|
+
) : s.type === "select" ? /* @__PURE__ */ e(
|
|
475
|
+
oe,
|
|
473
476
|
{
|
|
474
|
-
...
|
|
475
|
-
options:
|
|
476
|
-
placeholder:
|
|
477
|
-
disabled:
|
|
478
|
-
value: String(
|
|
479
|
-
onChange: (c) =>
|
|
477
|
+
...x,
|
|
478
|
+
options: gt(s.options),
|
|
479
|
+
placeholder: s.placeholder,
|
|
480
|
+
disabled: s.disabled || w,
|
|
481
|
+
value: String(u[s.name] ?? ""),
|
|
482
|
+
onChange: (c) => C(s.name, c)
|
|
480
483
|
}
|
|
481
|
-
) :
|
|
482
|
-
|
|
484
|
+
) : s.type === "date" ? /* @__PURE__ */ e(
|
|
485
|
+
V,
|
|
483
486
|
{
|
|
484
|
-
...
|
|
487
|
+
...x,
|
|
485
488
|
type: "date",
|
|
486
|
-
placeholder:
|
|
487
|
-
disabled:
|
|
488
|
-
value: String(
|
|
489
|
-
onChange: (c) =>
|
|
489
|
+
placeholder: s.placeholder,
|
|
490
|
+
disabled: s.disabled || w,
|
|
491
|
+
value: String(u[s.name] ?? ""),
|
|
492
|
+
onChange: (c) => C(s.name, c.target.value)
|
|
490
493
|
}
|
|
491
|
-
) :
|
|
492
|
-
|
|
494
|
+
) : s.type === "boolean" ? /* @__PURE__ */ e(
|
|
495
|
+
ue,
|
|
493
496
|
{
|
|
494
|
-
...
|
|
495
|
-
disabled:
|
|
496
|
-
checked: !!
|
|
497
|
-
onChange: (c) =>
|
|
497
|
+
...x,
|
|
498
|
+
disabled: s.disabled || w,
|
|
499
|
+
checked: !!u[s.name],
|
|
500
|
+
onChange: (c) => C(s.name, c)
|
|
498
501
|
}
|
|
499
502
|
) : /* @__PURE__ */ e(
|
|
500
|
-
|
|
503
|
+
V,
|
|
501
504
|
{
|
|
502
|
-
...
|
|
503
|
-
type:
|
|
504
|
-
placeholder:
|
|
505
|
-
disabled:
|
|
506
|
-
value: String(
|
|
507
|
-
onChange: (c) =>
|
|
505
|
+
...x,
|
|
506
|
+
type: s.type ?? "text",
|
|
507
|
+
placeholder: s.placeholder,
|
|
508
|
+
disabled: s.disabled || w,
|
|
509
|
+
value: String(u[s.name] ?? ""),
|
|
510
|
+
onChange: (c) => C(s.name, s.type === "number" ? c.target.value === "" ? "" : Number(c.target.value) : c.target.value)
|
|
508
511
|
}
|
|
509
512
|
),
|
|
510
|
-
g ? /* @__PURE__ */ e("p", { id: `prui-form-${
|
|
511
|
-
] },
|
|
513
|
+
g ? /* @__PURE__ */ e("p", { id: `prui-form-${s.name}-error`, role: "alert", className: "text-xs text-[var(--prui-danger)]", children: g }) : null
|
|
514
|
+
] }, s.name);
|
|
512
515
|
}) }),
|
|
513
|
-
|
|
516
|
+
v ?? O ? /* @__PURE__ */ e("p", { role: "alert", "data-testid": "form-error", className: "rounded-[var(--prui-radius)] border border-[var(--prui-danger)]/40 bg-[var(--prui-danger)]/10 px-3 py-2 text-sm text-[var(--prui-danger)]", children: v ?? O }) : null,
|
|
514
517
|
/* @__PURE__ */ d("div", { className: "flex items-center justify-end gap-2", children: [
|
|
515
|
-
l ? /* @__PURE__ */ e(
|
|
516
|
-
/* @__PURE__ */ e(
|
|
518
|
+
l ? /* @__PURE__ */ e(A, { type: "button", variant: "ghost", onClick: l, disabled: w, children: m }) : null,
|
|
519
|
+
/* @__PURE__ */ e(A, { type: "submit", variant: "primary", loading: w, children: f.submitLabel ?? "Submit" })
|
|
517
520
|
] })
|
|
518
521
|
] });
|
|
519
522
|
}
|
|
520
|
-
const
|
|
523
|
+
const Bt = {
|
|
521
524
|
name: "Form",
|
|
522
525
|
props: [
|
|
523
526
|
{ name: "schema", type: "FormSchema", default: null, control: "object" },
|
|
@@ -528,156 +531,156 @@ const qt = {
|
|
|
528
531
|
{ name: "error", type: "string | null", default: "null", control: "text" }
|
|
529
532
|
]
|
|
530
533
|
};
|
|
531
|
-
function
|
|
534
|
+
function be(t) {
|
|
532
535
|
if (t)
|
|
533
536
|
return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
|
|
534
537
|
}
|
|
535
|
-
function
|
|
538
|
+
function xt(t, a) {
|
|
536
539
|
return { fields: t.filter((r) => r.formField !== !1 && !r.hidden).filter((r) => r.key !== "id" && r.key !== "actions").map((r) => {
|
|
537
540
|
var l;
|
|
538
541
|
return {
|
|
539
542
|
name: r.key,
|
|
540
543
|
label: typeof r.label == "string" ? r.label : r.key,
|
|
541
|
-
type:
|
|
542
|
-
options: (l =
|
|
544
|
+
type: yt(r, a),
|
|
545
|
+
options: (l = be(r.filterOptions ?? r.options)) == null ? void 0 : l.map((m) => ({ label: m.label, value: m.value })),
|
|
543
546
|
required: !1
|
|
544
547
|
};
|
|
545
548
|
}), submitLabel: a ? "Save" : "Create" };
|
|
546
549
|
}
|
|
547
|
-
function
|
|
550
|
+
function yt(t, a) {
|
|
548
551
|
return t.filter === "select" ? "select" : typeof (a == null ? void 0 : a[t.key]) == "number" || t.filter === "number" || t.filter === "numberrange" || t.filter === "price" ? "number" : t.filter === "date" || t.filter === "daterange" ? "date" : "text";
|
|
549
552
|
}
|
|
550
|
-
function
|
|
553
|
+
function Kt({
|
|
551
554
|
name: t,
|
|
552
555
|
columns: a,
|
|
553
556
|
list: n,
|
|
554
557
|
create: r,
|
|
555
558
|
update: l,
|
|
556
|
-
remove:
|
|
557
|
-
delete:
|
|
558
|
-
actions:
|
|
559
|
-
form:
|
|
560
|
-
formSchema:
|
|
561
|
-
rowKey:
|
|
562
|
-
searchPlaceholder:
|
|
559
|
+
remove: m,
|
|
560
|
+
delete: p,
|
|
561
|
+
actions: v,
|
|
562
|
+
form: h,
|
|
563
|
+
formSchema: f,
|
|
564
|
+
rowKey: k,
|
|
565
|
+
searchPlaceholder: u,
|
|
563
566
|
pageSize: b = 20,
|
|
564
567
|
className: M
|
|
565
568
|
}) {
|
|
566
|
-
const
|
|
567
|
-
|
|
569
|
+
const P = m ?? p, O = v ?? ["create", "edit", "delete"], y = (o) => O.includes(o) && (o === "create" ? !!r : o === "edit" ? !!l : !!P), [T, R] = i.useState([]), [C, $] = i.useState(null), [w, s] = i.useState(1), [g, x] = i.useState(b), [c, z] = i.useState([null]), [N, S] = i.useState(""), [j, q] = i.useState({}), [B, ge] = i.useState(null), [ve, U] = i.useState(!0), [J, Y] = i.useState(null), [D, H] = i.useState(null), [xe, L] = i.useState(!1), [ye, W] = i.useState(!1), X = c[w - 1] ?? null, G = JSON.stringify(j), I = i.useCallback(async () => {
|
|
570
|
+
U(!0), Y(null);
|
|
568
571
|
try {
|
|
569
|
-
const
|
|
570
|
-
|
|
571
|
-
} catch (
|
|
572
|
-
|
|
572
|
+
const o = await n({ search: N, cursor: X, pageSize: g, sort: B, filters: j });
|
|
573
|
+
R(o.rows), $(o.nextCursor ?? o.cursor ?? null);
|
|
574
|
+
} catch (o) {
|
|
575
|
+
Y(o instanceof Error ? o.message : String(o)), R([]), $(null);
|
|
573
576
|
} finally {
|
|
574
|
-
|
|
577
|
+
U(!1);
|
|
575
578
|
}
|
|
576
|
-
}, [N,
|
|
577
|
-
|
|
579
|
+
}, [N, X, g, B, G, n]);
|
|
580
|
+
i.useEffect(() => {
|
|
578
581
|
I();
|
|
579
|
-
}, [I]),
|
|
580
|
-
|
|
581
|
-
}, [N, g,
|
|
582
|
-
const Ne = a.filter((
|
|
583
|
-
key:
|
|
584
|
-
label: typeof
|
|
585
|
-
type:
|
|
586
|
-
options:
|
|
587
|
-
})), we = (
|
|
588
|
-
|
|
582
|
+
}, [I]), i.useEffect(() => {
|
|
583
|
+
s(1), z([null]);
|
|
584
|
+
}, [N, g, G]);
|
|
585
|
+
const Ne = a.filter((o) => o.filter).map((o) => ({
|
|
586
|
+
key: o.key,
|
|
587
|
+
label: typeof o.label == "string" ? o.label : o.key,
|
|
588
|
+
type: o.filter === "numberrange" ? "number" : o.filter,
|
|
589
|
+
options: be(o.filterOptions ?? o.options)
|
|
590
|
+
})), we = (o, _) => {
|
|
591
|
+
q((K) => ({ ...K, [o]: _ }));
|
|
589
592
|
}, Se = () => {
|
|
590
|
-
|
|
591
|
-
}, ke = (
|
|
592
|
-
|
|
593
|
-
}, Ce = async (
|
|
594
|
-
if (!(!await
|
|
595
|
-
title: `Delete ${
|
|
593
|
+
H(null), L(!0);
|
|
594
|
+
}, ke = (o) => {
|
|
595
|
+
H(o), L(!0);
|
|
596
|
+
}, Ce = async (o) => {
|
|
597
|
+
if (!(!await Ze({
|
|
598
|
+
title: `Delete ${F}?`,
|
|
596
599
|
message: "This action cannot be undone.",
|
|
597
600
|
confirmText: "Delete",
|
|
598
601
|
cancelText: "Cancel",
|
|
599
602
|
type: "danger"
|
|
600
|
-
}) || !
|
|
601
|
-
|
|
603
|
+
}) || !P)) {
|
|
604
|
+
W(!0);
|
|
602
605
|
try {
|
|
603
|
-
await
|
|
606
|
+
await P(o), await I();
|
|
604
607
|
} finally {
|
|
605
|
-
|
|
608
|
+
W(!1);
|
|
606
609
|
}
|
|
607
610
|
}
|
|
608
|
-
}, Te = (
|
|
611
|
+
}, Te = (o, _) => {
|
|
609
612
|
if (_ === "next") {
|
|
610
|
-
const
|
|
611
|
-
|
|
612
|
-
const
|
|
613
|
-
return
|
|
613
|
+
const K = C;
|
|
614
|
+
z((Re) => {
|
|
615
|
+
const Z = [...Re];
|
|
616
|
+
return Z[o - 1] = K, Z;
|
|
614
617
|
});
|
|
615
618
|
}
|
|
616
|
-
|
|
617
|
-
},
|
|
618
|
-
...a.filter((
|
|
619
|
-
...
|
|
619
|
+
s(o);
|
|
620
|
+
}, Pe = [
|
|
621
|
+
...a.filter((o) => !o.hidden),
|
|
622
|
+
...y("edit") || y("delete") ? [
|
|
620
623
|
{
|
|
621
624
|
key: "actions",
|
|
622
625
|
label: "",
|
|
623
626
|
align: "right",
|
|
624
|
-
render: (
|
|
625
|
-
|
|
626
|
-
|
|
627
|
+
render: (o) => /* @__PURE__ */ d("div", { className: "flex items-center justify-end gap-1", children: [
|
|
628
|
+
y("edit") ? /* @__PURE__ */ e(A, { variant: "ghost", size: "icon", "aria-label": "Edit", onClick: () => ke(o), "data-testid": "resource-edit", children: /* @__PURE__ */ e(Ve, { className: "h-3.5 w-3.5", "aria-hidden": !0 }) }) : null,
|
|
629
|
+
y("delete") ? /* @__PURE__ */ e(A, { variant: "ghost", size: "icon", "aria-label": "Delete", disabled: ye, onClick: () => void Ce(o), "data-testid": "resource-delete", children: /* @__PURE__ */ e(Ue, { className: "h-3.5 w-3.5 text-[var(--prui-danger)]", "aria-hidden": !0 }) }) : null
|
|
627
630
|
] })
|
|
628
631
|
}
|
|
629
632
|
] : []
|
|
630
|
-
],
|
|
631
|
-
|
|
632
|
-
) : void 0,
|
|
633
|
+
], Q = f ?? xt(a, D), Ee = D ? Object.fromEntries(
|
|
634
|
+
Q.fields.map((o) => [o.name, D[o.name] ?? ""])
|
|
635
|
+
) : void 0, F = t.replace(/s$/, "");
|
|
633
636
|
return /* @__PURE__ */ d("div", { className: E("prui-resource flex flex-col gap-2", M), "data-testid": "resource", children: [
|
|
634
637
|
/* @__PURE__ */ e("div", { className: "flex items-center justify-between", children: /* @__PURE__ */ e("h1", { className: "text-xl font-semibold capitalize text-[var(--prui-fg)]", children: t }) }),
|
|
635
638
|
/* @__PURE__ */ e(
|
|
636
|
-
|
|
639
|
+
et,
|
|
637
640
|
{
|
|
638
|
-
searchPlaceholder:
|
|
641
|
+
searchPlaceholder: u ?? `Search ${t}...`,
|
|
639
642
|
searchValue: N,
|
|
640
|
-
onSearchChange:
|
|
643
|
+
onSearchChange: S,
|
|
641
644
|
filters: Ne,
|
|
642
|
-
filterValues:
|
|
645
|
+
filterValues: j,
|
|
643
646
|
onFilterChange: we,
|
|
644
|
-
actions:
|
|
645
|
-
/* @__PURE__ */ e(
|
|
647
|
+
actions: y("create") ? /* @__PURE__ */ d(A, { variant: "primary", size: "sm", onClick: Se, "data-testid": "resource-create", children: [
|
|
648
|
+
/* @__PURE__ */ e(Je, { className: "h-4 w-4", "aria-hidden": !0 }),
|
|
646
649
|
"New ",
|
|
647
|
-
|
|
650
|
+
F
|
|
648
651
|
] }) : void 0
|
|
649
652
|
}
|
|
650
653
|
),
|
|
651
|
-
|
|
652
|
-
/* @__PURE__ */ e(
|
|
654
|
+
J ? /* @__PURE__ */ e("div", { role: "alert", "data-testid": "resource-error", className: "rounded-[var(--prui-radius)] border border-[var(--prui-danger)]/40 bg-[var(--prui-danger)]/10 px-3 py-2 text-sm text-[var(--prui-danger)]", children: J }) : null,
|
|
655
|
+
/* @__PURE__ */ e(tt, { columns: Pe, rows: T, rowKey: k, sort: B, onSortChange: ge, loading: ve }),
|
|
653
656
|
/* @__PURE__ */ e(
|
|
654
|
-
|
|
657
|
+
rt,
|
|
655
658
|
{
|
|
656
|
-
page:
|
|
659
|
+
page: w,
|
|
657
660
|
pageSize: g,
|
|
658
|
-
hasNextPage:
|
|
659
|
-
hasPreviousPage:
|
|
661
|
+
hasNextPage: C != null,
|
|
662
|
+
hasPreviousPage: w > 1,
|
|
660
663
|
onPageChange: Te,
|
|
661
|
-
onPageSizeChange: (
|
|
664
|
+
onPageSizeChange: (o) => x(o)
|
|
662
665
|
}
|
|
663
666
|
),
|
|
664
|
-
/* @__PURE__ */ d(
|
|
665
|
-
/* @__PURE__ */ e("div", { className: "px-8 pt-8 pb-2", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold", style: { color: "var(--prui-fg)" }, children:
|
|
666
|
-
/* @__PURE__ */ e("div", { className: "px-8 pb-8", children:
|
|
667
|
-
|
|
667
|
+
/* @__PURE__ */ d(ie, { open: xe, onClose: () => L(!1), size: "sm", ariaLabel: D ? `Edit ${F}` : `New ${F}`, noPadding: !0, children: [
|
|
668
|
+
/* @__PURE__ */ e("div", { className: "px-8 pt-8 pb-2", children: /* @__PURE__ */ e("h2", { className: "text-lg font-semibold", style: { color: "var(--prui-fg)" }, children: D ? `Edit ${F}` : `New ${F}` }) }),
|
|
669
|
+
/* @__PURE__ */ e("div", { className: "px-8 pb-8", children: h ?? /* @__PURE__ */ e(
|
|
670
|
+
vt,
|
|
668
671
|
{
|
|
669
|
-
schema:
|
|
670
|
-
initialValues:
|
|
672
|
+
schema: Q,
|
|
673
|
+
initialValues: Ee,
|
|
671
674
|
onCancel: () => L(!1),
|
|
672
|
-
onSubmit: async (
|
|
673
|
-
|
|
675
|
+
onSubmit: async (o) => {
|
|
676
|
+
D ? await (l == null ? void 0 : l(D, o)) : await (r == null ? void 0 : r(o)), L(!1), await I();
|
|
674
677
|
}
|
|
675
678
|
}
|
|
676
679
|
) })
|
|
677
680
|
] })
|
|
678
681
|
] });
|
|
679
682
|
}
|
|
680
|
-
const
|
|
683
|
+
const Vt = {
|
|
681
684
|
name: "Resource",
|
|
682
685
|
props: [
|
|
683
686
|
{ name: "name", type: "string", default: null, control: "text" },
|
|
@@ -693,18 +696,18 @@ const Kt = {
|
|
|
693
696
|
{ name: "pageSize", type: "number", default: "20", control: "number" }
|
|
694
697
|
]
|
|
695
698
|
};
|
|
696
|
-
function
|
|
699
|
+
function Ut({ items: t, className: a }) {
|
|
697
700
|
return /* @__PURE__ */ e("div", { className: E("prui-stat-row grid gap-3 sm:grid-cols-2 lg:grid-cols-4", a), children: t.map((n, r) => {
|
|
698
701
|
const l = n.icon;
|
|
699
|
-
return /* @__PURE__ */ d(
|
|
700
|
-
/* @__PURE__ */ d(
|
|
701
|
-
/* @__PURE__ */ d(
|
|
702
|
+
return /* @__PURE__ */ d(ce, { "data-testid": "stat-card", children: [
|
|
703
|
+
/* @__PURE__ */ d(de, { className: "pb-2", children: [
|
|
704
|
+
/* @__PURE__ */ d(me, { className: "flex items-center gap-1.5 text-xs", children: [
|
|
702
705
|
l ? /* @__PURE__ */ e(l, { className: "h-3.5 w-3.5", "aria-hidden": !0 }) : null,
|
|
703
706
|
n.label
|
|
704
707
|
] }),
|
|
705
|
-
/* @__PURE__ */ e(
|
|
708
|
+
/* @__PURE__ */ e(pe, { className: "text-2xl", children: n.value })
|
|
706
709
|
] }),
|
|
707
|
-
n.delta ? /* @__PURE__ */ e(
|
|
710
|
+
n.delta ? /* @__PURE__ */ e(fe, { className: "pb-3", children: /* @__PURE__ */ e(
|
|
708
711
|
"span",
|
|
709
712
|
{
|
|
710
713
|
className: E(
|
|
@@ -719,52 +722,52 @@ function Vt({ items: t, className: a }) {
|
|
|
719
722
|
] }, `${n.label}-${r}`);
|
|
720
723
|
}) });
|
|
721
724
|
}
|
|
722
|
-
const
|
|
725
|
+
const Jt = {
|
|
723
726
|
name: "StatRow",
|
|
724
727
|
props: [
|
|
725
728
|
{ name: "items", type: "StatItem[]", default: null, control: "object" },
|
|
726
729
|
{ name: "className", type: "string", default: "undefined", control: "text" }
|
|
727
730
|
]
|
|
728
731
|
};
|
|
729
|
-
function
|
|
732
|
+
function Nt(t) {
|
|
730
733
|
if (t)
|
|
731
734
|
return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
|
|
732
735
|
}
|
|
733
|
-
function
|
|
736
|
+
function wt({ field: t }) {
|
|
734
737
|
const { name: a, type: n, value: r, onChange: l } = t;
|
|
735
738
|
if (!n || !a) return null;
|
|
736
|
-
const
|
|
737
|
-
return n === "switch" ? /* @__PURE__ */ e("label", { className: "flex items-center gap-2", htmlFor:
|
|
738
|
-
|
|
739
|
+
const m = `prui-settings-${a}`;
|
|
740
|
+
return n === "switch" ? /* @__PURE__ */ e("label", { className: "flex items-center gap-2", htmlFor: m, children: /* @__PURE__ */ e(
|
|
741
|
+
ue,
|
|
739
742
|
{
|
|
740
|
-
id:
|
|
743
|
+
id: m,
|
|
741
744
|
checked: !!r,
|
|
742
|
-
onChange: (
|
|
745
|
+
onChange: (p) => l == null ? void 0 : l(p),
|
|
743
746
|
"aria-label": t.label
|
|
744
747
|
}
|
|
745
748
|
) }) : n === "select" ? /* @__PURE__ */ e(
|
|
746
|
-
|
|
749
|
+
oe,
|
|
747
750
|
{
|
|
748
|
-
id:
|
|
751
|
+
id: m,
|
|
749
752
|
className: "w-56",
|
|
750
|
-
options:
|
|
753
|
+
options: Nt(t.options) ?? [],
|
|
751
754
|
value: String(r ?? ""),
|
|
752
|
-
onChange: (
|
|
755
|
+
onChange: (p) => l == null ? void 0 : l(p),
|
|
753
756
|
"aria-label": t.label
|
|
754
757
|
}
|
|
755
758
|
) : /* @__PURE__ */ e(
|
|
756
|
-
|
|
759
|
+
V,
|
|
757
760
|
{
|
|
758
|
-
id:
|
|
761
|
+
id: m,
|
|
759
762
|
type: n === "number" ? "number" : "text",
|
|
760
763
|
className: "h-8 w-56",
|
|
761
764
|
value: String(r ?? ""),
|
|
762
|
-
onChange: (
|
|
765
|
+
onChange: (p) => l == null ? void 0 : l(n === "number" ? p.target.value === "" ? "" : Number(p.target.value) : p.target.value),
|
|
763
766
|
"aria-label": t.label
|
|
764
767
|
}
|
|
765
768
|
);
|
|
766
769
|
}
|
|
767
|
-
function
|
|
770
|
+
function Yt({ title: t = "Settings", sections: a, className: n }) {
|
|
768
771
|
return /* @__PURE__ */ d("div", { className: E("prui-settings mx-auto flex w-full max-w-4xl flex-col gap-6", n), children: [
|
|
769
772
|
/* @__PURE__ */ e("h1", { className: "text-xl font-semibold text-[var(--prui-fg)]", children: t }),
|
|
770
773
|
/* @__PURE__ */ d("div", { className: "flex flex-col gap-6 md:flex-row", children: [
|
|
@@ -776,85 +779,85 @@ function Ht({ title: t = "Settings", sections: a, className: n }) {
|
|
|
776
779
|
children: r.title ?? r.label ?? r.id
|
|
777
780
|
}
|
|
778
781
|
) }, r.id)) }) }),
|
|
779
|
-
/* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 flex-col gap-4", children: a.map((r) => /* @__PURE__ */ d(
|
|
780
|
-
/* @__PURE__ */ d(
|
|
781
|
-
/* @__PURE__ */ e(
|
|
782
|
-
r.description ? /* @__PURE__ */ e(
|
|
782
|
+
/* @__PURE__ */ e("div", { className: "flex min-w-0 flex-1 flex-col gap-4", children: a.map((r) => /* @__PURE__ */ d(ce, { id: `settings-${r.id}`, "data-testid": "settings-section", children: [
|
|
783
|
+
/* @__PURE__ */ d(de, { children: [
|
|
784
|
+
/* @__PURE__ */ e(pe, { children: r.title ?? r.label ?? r.id }),
|
|
785
|
+
r.description ? /* @__PURE__ */ e(me, { children: r.description }) : null
|
|
783
786
|
] }),
|
|
784
|
-
/* @__PURE__ */ e(
|
|
787
|
+
/* @__PURE__ */ e(fe, { children: r.content ?? /* @__PURE__ */ e("dl", { className: "flex flex-col divide-y divide-[var(--prui-line)]", children: (r.fields ?? []).map((l, m) => /* @__PURE__ */ d("div", { className: "flex flex-col gap-2 py-3 first:pt-0 last:pb-0 sm:flex-row sm:items-center sm:justify-between", children: [
|
|
785
788
|
/* @__PURE__ */ d("div", { className: "min-w-0", children: [
|
|
786
789
|
/* @__PURE__ */ e("dt", { className: "text-sm font-medium text-[var(--prui-fg)]", children: l.label }),
|
|
787
790
|
l.description ? /* @__PURE__ */ e("dd", { className: "text-xs text-[var(--prui-dim)]", children: l.description }) : null
|
|
788
791
|
] }),
|
|
789
|
-
/* @__PURE__ */ e("div", { className: "shrink-0", children: l.control ?? /* @__PURE__ */ e(
|
|
790
|
-
] }, `${l.label}-${
|
|
792
|
+
/* @__PURE__ */ e("div", { className: "shrink-0", children: l.control ?? /* @__PURE__ */ e(wt, { field: l }) })
|
|
793
|
+
] }, `${l.label}-${m}`)) }) })
|
|
791
794
|
] }, r.id)) })
|
|
792
795
|
] })
|
|
793
796
|
] });
|
|
794
797
|
}
|
|
795
|
-
const
|
|
798
|
+
const Ht = {
|
|
796
799
|
name: "Settings",
|
|
797
800
|
props: [
|
|
798
801
|
{ name: "title", type: "string", default: "'Settings'", control: "text" },
|
|
799
802
|
{ name: "sections", type: "SettingsSection[]", default: null, control: "object" }
|
|
800
803
|
]
|
|
801
|
-
},
|
|
802
|
-
function
|
|
804
|
+
}, le = ["mousedown", "keydown", "scroll", "touchstart", "click"];
|
|
805
|
+
function St({
|
|
803
806
|
timeout: t = 15,
|
|
804
807
|
warningTime: a = 2,
|
|
805
808
|
onTimeout: n,
|
|
806
809
|
onExtend: r,
|
|
807
810
|
title: l = "Session expiring soon",
|
|
808
|
-
message:
|
|
811
|
+
message: m = "Your session is about to expire due to inactivity."
|
|
809
812
|
}) {
|
|
810
|
-
const
|
|
811
|
-
for (const g of [b, M,
|
|
813
|
+
const p = Math.max(0, t) * 6e4, v = Math.min(Math.max(0, a) * 6e4, p), [h, f] = i.useState(!1), [k, u] = i.useState(v), b = i.useRef(null), M = i.useRef(null), P = i.useRef(null), O = i.useRef(!1), y = i.useCallback(() => {
|
|
814
|
+
for (const g of [b, M, P])
|
|
812
815
|
g.current != null && (clearInterval(g.current), clearTimeout(g.current), g.current = null);
|
|
813
|
-
}, []),
|
|
814
|
-
|
|
815
|
-
}, [
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
|
|
816
|
+
}, []), T = i.useCallback(() => {
|
|
817
|
+
y(), f(!1), n == null || n();
|
|
818
|
+
}, [y, n]), R = i.useCallback(() => {
|
|
819
|
+
y(), f(!1), O.current = !1, b.current = window.setTimeout(() => {
|
|
820
|
+
O.current = !0, u(v), f(!0), P.current = window.setInterval(() => {
|
|
821
|
+
u((g) => g <= 1e3 ? (T(), 0) : g - 1e3);
|
|
819
822
|
}, 1e3);
|
|
820
|
-
},
|
|
821
|
-
}, [
|
|
822
|
-
|
|
823
|
+
}, p - v), M.current = window.setTimeout(T, p);
|
|
824
|
+
}, [y, T, p, v]);
|
|
825
|
+
i.useEffect(() => {
|
|
823
826
|
const g = () => {
|
|
824
|
-
|
|
827
|
+
O.current || R();
|
|
825
828
|
};
|
|
826
|
-
for (const
|
|
827
|
-
return
|
|
828
|
-
|
|
829
|
-
for (const
|
|
829
|
+
for (const x of le) document.addEventListener(x, g, { passive: !0 });
|
|
830
|
+
return R(), () => {
|
|
831
|
+
y();
|
|
832
|
+
for (const x of le) document.removeEventListener(x, g);
|
|
830
833
|
};
|
|
831
|
-
}, [
|
|
832
|
-
const
|
|
833
|
-
r == null || r(),
|
|
834
|
-
},
|
|
834
|
+
}, [R, y]);
|
|
835
|
+
const C = () => {
|
|
836
|
+
r == null || r(), R();
|
|
837
|
+
}, $ = Math.floor(k / 6e4), w = Math.floor(k % 6e4 / 1e3), s = `${$}:${String(w).padStart(2, "0")}`;
|
|
835
838
|
return /* @__PURE__ */ d(
|
|
836
|
-
|
|
839
|
+
ie,
|
|
837
840
|
{
|
|
838
|
-
open:
|
|
839
|
-
onClose:
|
|
841
|
+
open: h,
|
|
842
|
+
onClose: C,
|
|
840
843
|
size: "sm",
|
|
841
844
|
ariaLabel: l,
|
|
842
845
|
children: [
|
|
843
846
|
/* @__PURE__ */ d("div", { className: "flex flex-col items-center gap-1 px-8 pb-2 pt-8 text-center", children: [
|
|
844
|
-
/* @__PURE__ */ e("div", { className: "mb-2 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--prui-warn)]/15", children: /* @__PURE__ */ e(
|
|
847
|
+
/* @__PURE__ */ e("div", { className: "mb-2 flex h-12 w-12 items-center justify-center rounded-full bg-[var(--prui-warn)]/15", children: /* @__PURE__ */ e(Ye, { className: "h-6 w-6 text-[var(--prui-warn)]", "aria-hidden": !0 }) }),
|
|
845
848
|
/* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-[var(--prui-fg)]", children: l }),
|
|
846
|
-
/* @__PURE__ */ e("p", { className: "text-sm text-[var(--prui-dim)]", children:
|
|
847
|
-
/* @__PURE__ */ e("div", { className: "py-4 font-mono text-4xl font-bold text-[var(--prui-fg)]", "data-testid": "session-countdown", children:
|
|
849
|
+
/* @__PURE__ */ e("p", { className: "text-sm text-[var(--prui-dim)]", children: m }),
|
|
850
|
+
/* @__PURE__ */ e("div", { className: "py-4 font-mono text-4xl font-bold text-[var(--prui-fg)]", "data-testid": "session-countdown", children: s })
|
|
848
851
|
] }),
|
|
849
852
|
/* @__PURE__ */ d("div", { className: "flex flex-col gap-2 px-8 pb-8 sm:flex-row", children: [
|
|
850
|
-
/* @__PURE__ */ e(
|
|
851
|
-
/* @__PURE__ */ e(
|
|
853
|
+
/* @__PURE__ */ e(A, { variant: "default", className: "flex-1", onClick: T, "data-testid": "session-logout", children: "Log out now" }),
|
|
854
|
+
/* @__PURE__ */ e(A, { variant: "primary", className: "flex-1", onClick: C, "data-testid": "session-extend", children: "Continue session" })
|
|
852
855
|
] })
|
|
853
856
|
]
|
|
854
857
|
}
|
|
855
858
|
);
|
|
856
859
|
}
|
|
857
|
-
const
|
|
860
|
+
const kt = {
|
|
858
861
|
name: "SessionTimeout",
|
|
859
862
|
props: [
|
|
860
863
|
{ name: "timeout", type: "number", default: "15", control: "number" },
|
|
@@ -862,13 +865,13 @@ const St = {
|
|
|
862
865
|
{ name: "onTimeout", type: "() => void", default: null, control: "none" },
|
|
863
866
|
{ name: "onExtend", type: "() => void", default: null, control: "none" }
|
|
864
867
|
]
|
|
865
|
-
},
|
|
868
|
+
}, Ct = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
866
869
|
__proto__: null,
|
|
867
|
-
SessionTimeout:
|
|
868
|
-
sessionTimeoutPropsMeta:
|
|
870
|
+
SessionTimeout: St,
|
|
871
|
+
sessionTimeoutPropsMeta: kt
|
|
869
872
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
870
|
-
function
|
|
871
|
-
return /* @__PURE__ */ e("div", { className: E("prui-auth-shell flex min-h-[100dvh] items-center justify-center bg-[var(--prui-background)] p-4",
|
|
873
|
+
function Wt({ title: t, description: a, brand: n, width: r = "max-w-sm", footer: l, children: m, className: p }) {
|
|
874
|
+
return /* @__PURE__ */ e("div", { className: E("prui-auth-shell flex min-h-[100dvh] items-center justify-center bg-[var(--prui-background)] p-4", p), "data-testid": "auth-shell", children: /* @__PURE__ */ d("div", { className: E("w-full", r), children: [
|
|
872
875
|
n ? /* @__PURE__ */ d("div", { className: "mb-6 flex items-center justify-center gap-2", "data-testid": "auth-shell-brand", children: [
|
|
873
876
|
n.mark ? /* @__PURE__ */ e("img", { src: n.mark, alt: "", className: "h-8 w-8 rounded-[var(--prui-radius-1)] object-cover" }) : null,
|
|
874
877
|
/* @__PURE__ */ e("span", { className: "text-lg font-semibold text-[var(--prui-fg)]", children: n.name })
|
|
@@ -878,12 +881,12 @@ function Yt({ title: t, description: a, brand: n, width: r = "max-w-sm", footer:
|
|
|
878
881
|
/* @__PURE__ */ e("h1", { className: "text-lg font-semibold text-[var(--prui-fg)]", children: t }),
|
|
879
882
|
a ? /* @__PURE__ */ e("p", { className: "text-sm text-[var(--prui-dim)]", children: a }) : null
|
|
880
883
|
] }),
|
|
881
|
-
|
|
884
|
+
m,
|
|
882
885
|
l ? /* @__PURE__ */ e("div", { className: "mt-4 text-center text-sm text-[var(--prui-dim)]", children: l }) : null
|
|
883
886
|
] })
|
|
884
887
|
] }) });
|
|
885
888
|
}
|
|
886
|
-
const
|
|
889
|
+
const Xt = {
|
|
887
890
|
name: "AuthShell",
|
|
888
891
|
props: [
|
|
889
892
|
{ name: "title", type: "string", default: null, control: "text" },
|
|
@@ -895,23 +898,23 @@ const Wt = {
|
|
|
895
898
|
]
|
|
896
899
|
};
|
|
897
900
|
export {
|
|
898
|
-
|
|
899
|
-
|
|
900
|
-
|
|
901
|
-
|
|
902
|
-
|
|
903
|
-
|
|
904
|
-
|
|
905
|
-
|
|
906
|
-
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
901
|
+
_t as A,
|
|
902
|
+
ft as C,
|
|
903
|
+
vt as F,
|
|
904
|
+
Kt as R,
|
|
905
|
+
St as S,
|
|
906
|
+
ht as a,
|
|
907
|
+
Wt as b,
|
|
908
|
+
it as c,
|
|
909
|
+
Yt as d,
|
|
910
|
+
ae as e,
|
|
911
|
+
Ut as f,
|
|
912
|
+
qt as g,
|
|
913
|
+
Xt as h,
|
|
914
|
+
Bt as i,
|
|
915
|
+
Ht as j,
|
|
916
|
+
Jt as k,
|
|
917
|
+
Vt as r,
|
|
918
|
+
kt as s,
|
|
919
|
+
ut as u
|
|
917
920
|
};
|