@skiddph/prui 0.3.0 → 0.4.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.
@@ -1,36 +1,36 @@
1
1
  import { jsx as e, jsxs as d, Fragment as je } from "react/jsx-runtime";
2
2
  import * as s from "react";
3
3
  import { Routes as Me, Route as Z, Navigate as $e, MemoryRouter as Oe, BrowserRouter as ze, useLocation as le, 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, ChevronDown as Be, Pencil as Ke, Trash2 as Ve, Plus as Ue, Clock as He } from "lucide-react";
5
- import { cn as E } from "../core/cn.js";
6
- import { Dropdown as Je } from "../core/dropdown.js";
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
+ import { cn as P } from "../core/cn.js";
6
+ import { Dropdown as He } from "../core/dropdown.js";
7
7
  import { Button as z } from "../core/button.js";
8
- import { resolveThemeName as Ye, readPersistedTheme as We, applyTheme as ee, PRUI_THEMES as Xe, themeMode as Ge } from "../theme.js";
9
- import { Modal as se, confirmModal as Qe } from "../core/modal.js";
10
- import { b as Ze, D as et, a as tt } from "./data-table-toolbar-BUy2EWPy.js";
11
- import { Textarea as rt, Input as K } from "../core/input.js";
12
- import { Label as at } from "../core/label.js";
8
+ import { resolveThemeName as We, themeMode as Xe, readPersistedTheme as Ge, applyTheme as ee, listThemes as Qe } from "../theme.js";
9
+ import { Modal as se, 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 K } from "../core/input.js";
12
+ import { Label as nt } from "../core/label.js";
13
13
  import { Select as ie } from "../core/select.js";
14
14
  import { Switch as oe } from "../core/switch.js";
15
15
  import { Card as ue, CardHeader as ce, CardDescription as de, CardTitle as me, CardContent as pe } from "../core/card.js";
16
- const nt = [
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
- ], lt = [
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 st({ mode: t, config: a, children: n }) {
30
+ function it({ mode: t, config: a, children: n }) {
31
31
  const r = t === "auth" || t === "auth+utility", l = t === "utility" || t === "auth+utility", p = [
32
- ...r ? nt : [],
33
- ...l ? lt : []
32
+ ...r ? lt : [],
33
+ ...l ? st : []
34
34
  ], [m, f] = s.useState(null);
35
35
  return s.useEffect(() => {
36
36
  let x = !1;
@@ -48,11 +48,11 @@ function st({ mode: t, config: a, children: n }) {
48
48
  r ? /* @__PURE__ */ e(Z, { 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 it = s.lazy(
52
- () => Promise.resolve().then(() => kt).then((t) => ({ default: t.SessionTimeout }))
51
+ const ot = s.lazy(
52
+ () => Promise.resolve().then(() => Ct).then((t) => ({ default: t.SessionTimeout }))
53
53
  );
54
- function ot(t) {
55
- const a = t !== !1, n = typeof t == "object" ? t : {}, r = n.persist !== !1, l = Ye(n.default ?? "control"), p = Ge(l), [m, f] = s.useState(() => (r ? We() : null) ?? { theme: l, mode: p }), x = s.useCallback(
54
+ function ut(t) {
55
+ const a = t !== !1, n = typeof t == "object" ? t : {}, r = n.persist !== !1, l = We(n.default ?? "control"), p = Xe(l), [m, f] = s.useState(() => (r ? Ge() : null) ?? { theme: l, mode: p }), x = s.useCallback(
56
56
  (h) => {
57
57
  f(h), ee({ theme: h.theme, mode: h.mode, storageKey: r ? "prui:theme" : null });
58
58
  },
@@ -62,10 +62,10 @@ function ot(t) {
62
62
  ee({ theme: m.theme, mode: m.mode, storageKey: r ? "prui:theme" : null });
63
63
  }, [m, r]), { enabled: a, state: m, setTheme: x };
64
64
  }
65
- function ut({ config: t }) {
66
- const { enabled: a, state: n, setTheme: r } = ot(t);
65
+ function ct({ config: t }) {
66
+ const { enabled: a, state: n, setTheme: r } = ut(t);
67
67
  return a ? /* @__PURE__ */ e(
68
- Je,
68
+ He,
69
69
  {
70
70
  align: "end",
71
71
  trigger: /* @__PURE__ */ e(
@@ -73,12 +73,13 @@ 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("span", { className: "text-xs font-semibold uppercase", children: n.theme.slice(0, 2) })
79
+ children: /* @__PURE__ */ e(Be, { className: "h-4 w-4", "aria-hidden": !0 })
79
80
  }
80
81
  ),
81
- items: Xe.map((l) => ({
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
  }))
@@ -88,7 +89,7 @@ function ut({ config: t }) {
88
89
  function te(t, a) {
89
90
  return a === "/" ? t === "/" : t === a || t.startsWith(a + "/");
90
91
  }
91
- function ct({ item: t, onNavigate: a }) {
92
+ function dt({ item: t, onNavigate: a }) {
92
93
  const { pathname: n } = le(), r = (t.items ?? []).some(
93
94
  (f) => f.href ? te(n, f.href) : (f.items ?? []).some((x) => x.href && te(n, x.href))
94
95
  ), [l, p] = s.useState(r);
@@ -103,30 +104,30 @@ function ct({ item: t, onNavigate: a }) {
103
104
  type: "button",
104
105
  "aria-expanded": l,
105
106
  onClick: () => p((f) => !f),
106
- className: E(
107
+ className: P(
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
  r ? "text-[var(--prui-fg)]" : "text-[var(--prui-dim)] hover:text-[var(--prui-fg)]"
109
110
  ),
110
111
  children: [
111
112
  m ? /* @__PURE__ */ e(m, { 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(Be, { className: E("h-4 w-4 transition-transform", !l && "-rotate-90"), "aria-hidden": !0 })
114
+ /* @__PURE__ */ e(Ke, { className: P("h-4 w-4 transition-transform", !l && "-rotate-90"), "aria-hidden": !0 })
114
115
  ]
115
116
  }
116
117
  ),
117
118
  l ? /* @__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((f) => /* @__PURE__ */ e(fe, { item: f, onNavigate: a, nested: !0 }, f.href ?? f.label)) }) : null
118
119
  ] });
119
120
  }
120
- function dt({ label: t }) {
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
124
  function fe({ item: t, onNavigate: a, nested: n }) {
124
- return t.items && t.items.length > 0 ? /* @__PURE__ */ e(ct, { item: t, onNavigate: a }) : t.heading || !t.href && !t.items ? /* @__PURE__ */ e(dt, { label: t.label }) : t.href ? /* @__PURE__ */ e("li", { children: /* @__PURE__ */ d(
125
+ return t.items && t.items.length > 0 ? /* @__PURE__ */ e(dt, { item: t, onNavigate: a }) : 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: r }) => E(
130
+ className: ({ isActive: r }) => P(
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
  r ? "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)]"
@@ -141,7 +142,7 @@ function fe({ item: t, onNavigate: a, nested: n }) {
141
142
  function re({ nav: t, onNavigate: a }) {
142
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((n) => /* @__PURE__ */ e(fe, { item: n, onNavigate: a }, n.href ?? n.label)) }) });
143
144
  }
144
- function mt({ brand: t }) {
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,7 +150,7 @@ 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 pt({
153
+ function ft({
153
154
  open: t,
154
155
  onOpenChange: a,
155
156
  entries: n,
@@ -210,7 +211,7 @@ function pt({
210
211
  "aria-selected": b === f,
211
212
  onMouseEnter: () => x(b),
212
213
  onClick: () => S(o),
213
- className: E(
214
+ className: P(
214
215
  "cursor-pointer rounded-[calc(var(--prui-radius)-1px)] px-3 py-2 text-sm text-[var(--prui-fg)]",
215
216
  b === f && "bg-[var(--prui-raise)]"
216
217
  ),
@@ -227,7 +228,7 @@ function pt({
227
228
  }
228
229
  );
229
230
  }
230
- function ft(t) {
231
+ function ht(t) {
231
232
  const {
232
233
  brand: a,
233
234
  nav: n = [],
@@ -239,7 +240,7 @@ function ft(t) {
239
240
  pages: x,
240
241
  pagesConfig: h,
241
242
  children: S
242
- } = t, o = typeof r == "object" ? r : { enabled: r !== !1 }, b = o.enabled !== !1, M = o.hotkey ?? "/", R = m.collapsible !== !1, [P, w] = s.useState(m.defaultOpen === !0), [$, C] = s.useState(!1), k = le(), O = Ae(), v = s.useMemo(
243
+ } = t, o = typeof r == "object" ? r : { enabled: r !== !1 }, b = o.enabled !== !1, M = o.hotkey ?? "/", R = m.collapsible !== !1, [E, w] = s.useState(m.defaultOpen === !0), [$, C] = s.useState(!1), k = le(), O = Ae(), v = s.useMemo(
243
244
  () => p === !1 ? null : p === !0 ? {} : p,
244
245
  [p]
245
246
  ), i = s.useCallback(() => {
@@ -265,12 +266,12 @@ function ft(t) {
265
266
  s.useEffect(() => {
266
267
  y.current !== k.pathname && (y.current = k.pathname, w(!1));
267
268
  }, [k.pathname]), s.useEffect(() => {
268
- if (!P) return;
269
+ if (!E) return;
269
270
  const T = document.body.style.overflow;
270
271
  return document.body.style.overflow = "hidden", () => {
271
272
  document.body.style.overflow = T;
272
273
  };
273
- }, [P]);
274
+ }, [E]);
274
275
  const c = m.width ?? 240;
275
276
  return /* @__PURE__ */ d("div", { className: "prui-app flex min-h-screen bg-[var(--prui-background)] text-[var(--prui-fg)]", children: [
276
277
  /* @__PURE__ */ e(
@@ -282,7 +283,7 @@ function ft(t) {
282
283
  children: /* @__PURE__ */ e("div", { className: "h-full overflow-y-auto p-2 pt-4 scrollbar-thin", children: /* @__PURE__ */ e(re, { nav: n }) })
283
284
  }
284
285
  ),
285
- P ? /* @__PURE__ */ d("div", { className: "md:hidden fixed inset-0 z-40", "data-testid": "mobile-drawer", children: [
286
+ E ? /* @__PURE__ */ d("div", { className: "md:hidden fixed inset-0 z-40", "data-testid": "mobile-drawer", children: [
286
287
  /* @__PURE__ */ e(
287
288
  "div",
288
289
  {
@@ -334,7 +335,7 @@ function ft(t) {
334
335
  children: /* @__PURE__ */ e(_e, { className: "h-4 w-4", "aria-hidden": !0 })
335
336
  }
336
337
  ) : null,
337
- /* @__PURE__ */ e("div", { className: "min-w-0 justify-self-start", children: /* @__PURE__ */ e(mt, { brand: a }) }),
338
+ /* @__PURE__ */ e("div", { className: "min-w-0 justify-self-start", children: /* @__PURE__ */ e(pt, { brand: a }) }),
338
339
  b ? /* @__PURE__ */ d(
339
340
  "button",
340
341
  {
@@ -351,29 +352,29 @@ function ft(t) {
351
352
  ) : null,
352
353
  /* @__PURE__ */ d("div", { className: "flex items-center gap-2 justify-self-end", children: [
353
354
  f,
354
- /* @__PURE__ */ e(ut, { config: l })
355
+ /* @__PURE__ */ e(ct, { config: l })
355
356
  ] })
356
357
  ]
357
358
  }
358
359
  ),
359
- /* @__PURE__ */ e("main", { className: "flex-1 p-4 md:p-6", children: x ? /* @__PURE__ */ e(st, { mode: x, config: h, children: S }) : S ?? /* @__PURE__ */ e(De, {}) })
360
+ /* @__PURE__ */ e("main", { className: "flex-1 p-4 md:p-6", children: x ? /* @__PURE__ */ e(it, { mode: x, config: h, children: S }) : S ?? /* @__PURE__ */ e(De, {}) })
360
361
  ] }),
361
362
  v ? /* @__PURE__ */ e(s.Suspense, { fallback: null, children: /* @__PURE__ */ e(
362
- it,
363
+ ot,
363
364
  {
364
365
  timeout: v.sessionTimeout,
365
366
  warningTime: v.warningTime,
366
367
  onTimeout: i
367
368
  }
368
369
  ) }) : null,
369
- b ? /* @__PURE__ */ e(pt, { open: $, onOpenChange: C, entries: g, placeholder: o.placeholder, onNavigate: O }) : null
370
+ b ? /* @__PURE__ */ e(ft, { open: $, onOpenChange: C, entries: g, placeholder: o.placeholder, onNavigate: O }) : null
370
371
  ] });
371
372
  }
372
- function It(t) {
373
+ function _t(t) {
373
374
  const { router: a = "browser", initialEntries: n } = t;
374
- return /* @__PURE__ */ e(a === "memory" ? Oe : ze, { initialEntries: n, children: /* @__PURE__ */ e(ft, { ...t }) });
375
+ return /* @__PURE__ */ e(a === "memory" ? Oe : ze, { initialEntries: n, children: /* @__PURE__ */ e(ht, { ...t }) });
375
376
  }
376
- const _t = {
377
+ const qt = {
377
378
  name: "App",
378
379
  props: [
379
380
  { name: "brand", type: "{ name, mark?, href? }", default: "undefined", control: "object" },
@@ -389,10 +390,10 @@ const _t = {
389
390
  { name: "children", type: "ReactNode", default: "Outlet", control: "none" }
390
391
  ]
391
392
  };
392
- function ht(t) {
393
+ function bt(t) {
393
394
  return Array.isArray(t) ? { fields: t } : t;
394
395
  }
395
- function bt(t) {
396
+ function gt(t) {
396
397
  if (t)
397
398
  return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
398
399
  }
@@ -402,7 +403,7 @@ function ae(t, a) {
402
403
  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
404
  return n;
404
405
  }
405
- function gt({
406
+ function vt({
406
407
  schema: t,
407
408
  initialValues: a,
408
409
  defaultValues: n,
@@ -413,7 +414,7 @@ function gt({
413
414
  error: f,
414
415
  className: x
415
416
  }) {
416
- const h = s.useMemo(() => ht(t), [t]), S = a ?? n, [o, b] = s.useState(() => ae(h, S)), [M, R] = s.useState({}), [P, w] = s.useState(null), [$, C] = s.useState(!1);
417
+ const h = s.useMemo(() => bt(t), [t]), S = a ?? n, [o, b] = s.useState(() => ae(h, S)), [M, R] = s.useState({}), [E, w] = s.useState(null), [$, C] = s.useState(!1);
417
418
  s.useEffect(() => {
418
419
  b(ae(h, S));
419
420
  }, [JSON.stringify(h), JSON.stringify(S ?? {})]);
@@ -447,20 +448,20 @@ function gt({
447
448
  }
448
449
  }
449
450
  }, v = m || $;
450
- return /* @__PURE__ */ d("form", { onSubmit: O, className: E("prui-form flex flex-col gap-4", x), noValidate: !0, children: [
451
- /* @__PURE__ */ e("div", { className: E("grid gap-4", h.columns === 2 && "md:grid-cols-2"), children: h.fields.map((i) => {
451
+ return /* @__PURE__ */ d("form", { onSubmit: O, className: P("prui-form flex flex-col gap-4", x), noValidate: !0, children: [
452
+ /* @__PURE__ */ e("div", { className: P("grid gap-4", h.columns === 2 && "md:grid-cols-2"), children: h.fields.map((i) => {
452
453
  const g = M[i.name], y = {
453
454
  id: `prui-form-${i.name}`,
454
455
  "aria-invalid": g ? !0 : void 0,
455
456
  "aria-describedby": g ? `prui-form-${i.name}-error` : void 0
456
457
  };
457
- return /* @__PURE__ */ d("div", { className: E("flex flex-col gap-1.5", i.colSpan === 2 && "md:col-span-2", i.className), children: [
458
- /* @__PURE__ */ d(at, { htmlFor: y.id, children: [
458
+ return /* @__PURE__ */ d("div", { className: P("flex flex-col gap-1.5", i.colSpan === 2 && "md:col-span-2", i.className), children: [
459
+ /* @__PURE__ */ d(nt, { htmlFor: y.id, children: [
459
460
  i.label,
460
461
  i.required ? /* @__PURE__ */ e("span", { className: "ml-0.5 text-[var(--prui-danger)]", children: "*" }) : null
461
462
  ] }),
462
463
  i.type === "textarea" ? /* @__PURE__ */ e(
463
- rt,
464
+ at,
464
465
  {
465
466
  ...y,
466
467
  placeholder: i.placeholder,
@@ -472,7 +473,7 @@ function gt({
472
473
  ie,
473
474
  {
474
475
  ...y,
475
- options: bt(i.options),
476
+ options: gt(i.options),
476
477
  placeholder: i.placeholder,
477
478
  disabled: i.disabled || v,
478
479
  value: String(o[i.name] ?? ""),
@@ -510,14 +511,14 @@ function gt({
510
511
  g ? /* @__PURE__ */ e("p", { id: `prui-form-${i.name}-error`, role: "alert", className: "text-xs text-[var(--prui-danger)]", children: g }) : null
511
512
  ] }, i.name);
512
513
  }) }),
513
- f ?? P ? /* @__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: f ?? P }) : null,
514
+ f ?? E ? /* @__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: f ?? E }) : null,
514
515
  /* @__PURE__ */ d("div", { className: "flex items-center justify-end gap-2", children: [
515
516
  l ? /* @__PURE__ */ e(z, { type: "button", variant: "ghost", onClick: l, disabled: v, children: p }) : null,
516
517
  /* @__PURE__ */ e(z, { type: "submit", variant: "primary", loading: v, children: h.submitLabel ?? "Submit" })
517
518
  ] })
518
519
  ] });
519
520
  }
520
- const qt = {
521
+ const Bt = {
521
522
  name: "Form",
522
523
  props: [
523
524
  { name: "schema", type: "FormSchema", default: null, control: "object" },
@@ -532,22 +533,22 @@ function he(t) {
532
533
  if (t)
533
534
  return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
534
535
  }
535
- function vt(t, a) {
536
+ function xt(t, a) {
536
537
  return { fields: t.filter((r) => r.formField !== !1 && !r.hidden).filter((r) => r.key !== "id" && r.key !== "actions").map((r) => {
537
538
  var l;
538
539
  return {
539
540
  name: r.key,
540
541
  label: typeof r.label == "string" ? r.label : r.key,
541
- type: xt(r, a),
542
+ type: yt(r, a),
542
543
  options: (l = he(r.filterOptions ?? r.options)) == null ? void 0 : l.map((p) => ({ label: p.label, value: p.value })),
543
544
  required: !1
544
545
  };
545
546
  }), submitLabel: a ? "Save" : "Create" };
546
547
  }
547
- function xt(t, a) {
548
+ function yt(t, a) {
548
549
  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
550
  }
550
- function Bt({
551
+ function Kt({
551
552
  name: t,
552
553
  columns: a,
553
554
  list: n,
@@ -563,13 +564,13 @@ function Bt({
563
564
  pageSize: b = 20,
564
565
  className: M
565
566
  }) {
566
- const R = p ?? m, P = f ?? ["create", "edit", "delete"], w = (u) => P.includes(u) && (u === "create" ? !!r : u === "edit" ? !!l : !!R), [$, C] = s.useState([]), [k, O] = s.useState(null), [v, i] = s.useState(1), [g, y] = s.useState(b), [c, T] = s.useState([null]), [N, j] = s.useState(""), [F, be] = s.useState({}), [q, ge] = s.useState(null), [ve, V] = s.useState(!0), [U, H] = s.useState(null), [A, J] = s.useState(null), [xe, L] = s.useState(!1), [ye, Y] = s.useState(!1), W = c[v - 1] ?? null, X = JSON.stringify(F), I = s.useCallback(async () => {
567
- V(!0), H(null);
567
+ const R = p ?? m, E = f ?? ["create", "edit", "delete"], w = (u) => E.includes(u) && (u === "create" ? !!r : u === "edit" ? !!l : !!R), [$, C] = s.useState([]), [k, O] = s.useState(null), [v, i] = s.useState(1), [g, y] = s.useState(b), [c, T] = s.useState([null]), [N, j] = s.useState(""), [F, be] = s.useState({}), [q, ge] = s.useState(null), [ve, V] = s.useState(!0), [U, J] = s.useState(null), [A, Y] = s.useState(null), [xe, L] = s.useState(!1), [ye, H] = s.useState(!1), W = c[v - 1] ?? null, X = JSON.stringify(F), I = s.useCallback(async () => {
568
+ V(!0), J(null);
568
569
  try {
569
570
  const u = await n({ search: N, cursor: W, pageSize: g, sort: q, filters: F });
570
571
  C(u.rows), O(u.nextCursor ?? u.cursor ?? null);
571
572
  } catch (u) {
572
- H(u instanceof Error ? u.message : String(u)), C([]), O(null);
573
+ J(u instanceof Error ? u.message : String(u)), C([]), O(null);
573
574
  } finally {
574
575
  V(!1);
575
576
  }
@@ -587,22 +588,22 @@ function Bt({
587
588
  })), we = (u, _) => {
588
589
  be((B) => ({ ...B, [u]: _ }));
589
590
  }, Se = () => {
590
- J(null), L(!0);
591
+ Y(null), L(!0);
591
592
  }, ke = (u) => {
592
- J(u), L(!0);
593
+ Y(u), L(!0);
593
594
  }, Ce = async (u) => {
594
- if (!(!await Qe({
595
+ if (!(!await Ze({
595
596
  title: `Delete ${D}?`,
596
597
  message: "This action cannot be undone.",
597
598
  confirmText: "Delete",
598
599
  cancelText: "Cancel",
599
600
  type: "danger"
600
601
  }) || !R)) {
601
- Y(!0);
602
+ H(!0);
602
603
  try {
603
604
  await R(u), await I();
604
605
  } finally {
605
- Y(!1);
606
+ H(!1);
606
607
  }
607
608
  }
608
609
  }, Te = (u, _) => {
@@ -614,7 +615,7 @@ function Bt({
614
615
  });
615
616
  }
616
617
  i(u);
617
- }, Ee = [
618
+ }, Pe = [
618
619
  ...a.filter((u) => !u.hidden),
619
620
  ...w("edit") || w("delete") ? [
620
621
  {
@@ -622,18 +623,18 @@ function Bt({
622
623
  label: "",
623
624
  align: "right",
624
625
  render: (u) => /* @__PURE__ */ d("div", { className: "flex items-center justify-end gap-1", children: [
625
- w("edit") ? /* @__PURE__ */ e(z, { variant: "ghost", size: "icon", "aria-label": "Edit", onClick: () => ke(u), "data-testid": "resource-edit", children: /* @__PURE__ */ e(Ke, { className: "h-3.5 w-3.5", "aria-hidden": !0 }) }) : null,
626
- w("delete") ? /* @__PURE__ */ e(z, { variant: "ghost", size: "icon", "aria-label": "Delete", disabled: ye, onClick: () => void Ce(u), "data-testid": "resource-delete", children: /* @__PURE__ */ e(Ve, { className: "h-3.5 w-3.5 text-[var(--prui-danger)]", "aria-hidden": !0 }) }) : null
626
+ w("edit") ? /* @__PURE__ */ e(z, { variant: "ghost", size: "icon", "aria-label": "Edit", onClick: () => ke(u), "data-testid": "resource-edit", children: /* @__PURE__ */ e(Ve, { className: "h-3.5 w-3.5", "aria-hidden": !0 }) }) : null,
627
+ w("delete") ? /* @__PURE__ */ e(z, { variant: "ghost", size: "icon", "aria-label": "Delete", disabled: ye, onClick: () => void Ce(u), "data-testid": "resource-delete", children: /* @__PURE__ */ e(Ue, { className: "h-3.5 w-3.5 text-[var(--prui-danger)]", "aria-hidden": !0 }) }) : null
627
628
  ] })
628
629
  }
629
630
  ] : []
630
- ], G = h ?? vt(a, A), Pe = A ? Object.fromEntries(
631
+ ], G = h ?? xt(a, A), Ee = A ? Object.fromEntries(
631
632
  G.fields.map((u) => [u.name, A[u.name] ?? ""])
632
633
  ) : void 0, D = t.replace(/s$/, "");
633
- return /* @__PURE__ */ d("div", { className: E("prui-resource flex flex-col gap-2", M), "data-testid": "resource", children: [
634
+ return /* @__PURE__ */ d("div", { className: P("prui-resource flex flex-col gap-2", M), "data-testid": "resource", children: [
634
635
  /* @__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
636
  /* @__PURE__ */ e(
636
- Ze,
637
+ et,
637
638
  {
638
639
  searchPlaceholder: o ?? `Search ${t}...`,
639
640
  searchValue: N,
@@ -642,16 +643,16 @@ function Bt({
642
643
  filterValues: F,
643
644
  onFilterChange: we,
644
645
  actions: w("create") ? /* @__PURE__ */ d(z, { variant: "primary", size: "sm", onClick: Se, "data-testid": "resource-create", children: [
645
- /* @__PURE__ */ e(Ue, { className: "h-4 w-4", "aria-hidden": !0 }),
646
+ /* @__PURE__ */ e(Je, { className: "h-4 w-4", "aria-hidden": !0 }),
646
647
  "New ",
647
648
  D
648
649
  ] }) : void 0
649
650
  }
650
651
  ),
651
652
  U ? /* @__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: U }) : null,
652
- /* @__PURE__ */ e(et, { columns: Ee, rows: $, rowKey: S, sort: q, onSortChange: ge, loading: ve }),
653
+ /* @__PURE__ */ e(tt, { columns: Pe, rows: $, rowKey: S, sort: q, onSortChange: ge, loading: ve }),
653
654
  /* @__PURE__ */ e(
654
- tt,
655
+ rt,
655
656
  {
656
657
  page: v,
657
658
  pageSize: g,
@@ -664,10 +665,10 @@ function Bt({
664
665
  /* @__PURE__ */ d(se, { open: xe, onClose: () => L(!1), size: "sm", ariaLabel: A ? `Edit ${D}` : `New ${D}`, noPadding: !0, children: [
665
666
  /* @__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: A ? `Edit ${D}` : `New ${D}` }) }),
666
667
  /* @__PURE__ */ e("div", { className: "px-8 pb-8", children: x ?? /* @__PURE__ */ e(
667
- gt,
668
+ vt,
668
669
  {
669
670
  schema: G,
670
- initialValues: Pe,
671
+ initialValues: Ee,
671
672
  onCancel: () => L(!1),
672
673
  onSubmit: async (u) => {
673
674
  A ? await (l == null ? void 0 : l(A, u)) : await (r == null ? void 0 : r(u)), L(!1), await I();
@@ -677,7 +678,7 @@ function Bt({
677
678
  ] })
678
679
  ] });
679
680
  }
680
- const Kt = {
681
+ const Vt = {
681
682
  name: "Resource",
682
683
  props: [
683
684
  { name: "name", type: "string", default: null, control: "text" },
@@ -693,8 +694,8 @@ const Kt = {
693
694
  { name: "pageSize", type: "number", default: "20", control: "number" }
694
695
  ]
695
696
  };
696
- function Vt({ items: t, className: a }) {
697
- 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) => {
697
+ function Ut({ items: t, className: a }) {
698
+ return /* @__PURE__ */ e("div", { className: P("prui-stat-row grid gap-3 sm:grid-cols-2 lg:grid-cols-4", a), children: t.map((n, r) => {
698
699
  const l = n.icon;
699
700
  return /* @__PURE__ */ d(ue, { "data-testid": "stat-card", children: [
700
701
  /* @__PURE__ */ d(ce, { className: "pb-2", children: [
@@ -707,7 +708,7 @@ function Vt({ items: t, className: a }) {
707
708
  n.delta ? /* @__PURE__ */ e(pe, { className: "pb-3", children: /* @__PURE__ */ e(
708
709
  "span",
709
710
  {
710
- className: E(
711
+ className: P(
711
712
  "text-xs font-medium",
712
713
  n.trend === "up" && "text-[var(--prui-ok)]",
713
714
  n.trend === "down" && "text-[var(--prui-danger)]",
@@ -719,18 +720,18 @@ function Vt({ items: t, className: a }) {
719
720
  ] }, `${n.label}-${r}`);
720
721
  }) });
721
722
  }
722
- const Ut = {
723
+ const Jt = {
723
724
  name: "StatRow",
724
725
  props: [
725
726
  { name: "items", type: "StatItem[]", default: null, control: "object" },
726
727
  { name: "className", type: "string", default: "undefined", control: "text" }
727
728
  ]
728
729
  };
729
- function yt(t) {
730
+ function Nt(t) {
730
731
  if (t)
731
732
  return t.map((a) => typeof a == "string" || typeof a == "number" ? { label: String(a), value: String(a) } : a);
732
733
  }
733
- function Nt({ field: t }) {
734
+ function wt({ field: t }) {
734
735
  const { name: a, type: n, value: r, onChange: l } = t;
735
736
  if (!n || !a) return null;
736
737
  const p = `prui-settings-${a}`;
@@ -747,7 +748,7 @@ function Nt({ field: t }) {
747
748
  {
748
749
  id: p,
749
750
  className: "w-56",
750
- options: yt(t.options) ?? [],
751
+ options: Nt(t.options) ?? [],
751
752
  value: String(r ?? ""),
752
753
  onChange: (m) => l == null ? void 0 : l(m),
753
754
  "aria-label": t.label
@@ -764,8 +765,8 @@ function Nt({ field: t }) {
764
765
  }
765
766
  );
766
767
  }
767
- function Ht({ title: t = "Settings", sections: a, className: n }) {
768
- return /* @__PURE__ */ d("div", { className: E("prui-settings mx-auto flex w-full max-w-4xl flex-col gap-6", n), children: [
768
+ function Yt({ title: t = "Settings", sections: a, className: n }) {
769
+ return /* @__PURE__ */ d("div", { className: P("prui-settings mx-auto flex w-full max-w-4xl flex-col gap-6", n), children: [
769
770
  /* @__PURE__ */ e("h1", { className: "text-xl font-semibold text-[var(--prui-fg)]", children: t }),
770
771
  /* @__PURE__ */ d("div", { className: "flex flex-col gap-6 md:flex-row", children: [
771
772
  /* @__PURE__ */ e("nav", { "aria-label": "Settings sections", className: "md:w-56 md:shrink-0", children: /* @__PURE__ */ e("ul", { className: "flex flex-row flex-wrap gap-1 md:flex-col", children: a.map((r) => /* @__PURE__ */ e("li", { children: /* @__PURE__ */ e(
@@ -786,20 +787,20 @@ function Ht({ title: t = "Settings", sections: a, className: n }) {
786
787
  /* @__PURE__ */ e("dt", { className: "text-sm font-medium text-[var(--prui-fg)]", children: l.label }),
787
788
  l.description ? /* @__PURE__ */ e("dd", { className: "text-xs text-[var(--prui-dim)]", children: l.description }) : null
788
789
  ] }),
789
- /* @__PURE__ */ e("div", { className: "shrink-0", children: l.control ?? /* @__PURE__ */ e(Nt, { field: l }) })
790
+ /* @__PURE__ */ e("div", { className: "shrink-0", children: l.control ?? /* @__PURE__ */ e(wt, { field: l }) })
790
791
  ] }, `${l.label}-${p}`)) }) })
791
792
  ] }, r.id)) })
792
793
  ] })
793
794
  ] });
794
795
  }
795
- const Jt = {
796
+ const Ht = {
796
797
  name: "Settings",
797
798
  props: [
798
799
  { name: "title", type: "string", default: "'Settings'", control: "text" },
799
800
  { name: "sections", type: "SettingsSection[]", default: null, control: "object" }
800
801
  ]
801
802
  }, ne = ["mousedown", "keydown", "scroll", "touchstart", "click"];
802
- function wt({
803
+ function St({
803
804
  timeout: t = 15,
804
805
  warningTime: a = 2,
805
806
  onTimeout: n,
@@ -807,21 +808,21 @@ function wt({
807
808
  title: l = "Session expiring soon",
808
809
  message: p = "Your session is about to expire due to inactivity."
809
810
  }) {
810
- const m = Math.max(0, t) * 6e4, f = Math.min(Math.max(0, a) * 6e4, m), [x, h] = s.useState(!1), [S, o] = s.useState(f), b = s.useRef(null), M = s.useRef(null), R = s.useRef(null), P = s.useRef(!1), w = s.useCallback(() => {
811
+ const m = Math.max(0, t) * 6e4, f = Math.min(Math.max(0, a) * 6e4, m), [x, h] = s.useState(!1), [S, o] = s.useState(f), b = s.useRef(null), M = s.useRef(null), R = s.useRef(null), E = s.useRef(!1), w = s.useCallback(() => {
811
812
  for (const g of [b, M, R])
812
813
  g.current != null && (clearInterval(g.current), clearTimeout(g.current), g.current = null);
813
814
  }, []), $ = s.useCallback(() => {
814
815
  w(), h(!1), n == null || n();
815
816
  }, [w, n]), C = s.useCallback(() => {
816
- w(), h(!1), P.current = !1, b.current = window.setTimeout(() => {
817
- P.current = !0, o(f), h(!0), R.current = window.setInterval(() => {
817
+ w(), h(!1), E.current = !1, b.current = window.setTimeout(() => {
818
+ E.current = !0, o(f), h(!0), R.current = window.setInterval(() => {
818
819
  o((g) => g <= 1e3 ? ($(), 0) : g - 1e3);
819
820
  }, 1e3);
820
821
  }, m - f), M.current = window.setTimeout($, m);
821
822
  }, [w, $, m, f]);
822
823
  s.useEffect(() => {
823
824
  const g = () => {
824
- P.current || C();
825
+ E.current || C();
825
826
  };
826
827
  for (const y of ne) document.addEventListener(y, g, { passive: !0 });
827
828
  return C(), () => {
@@ -841,7 +842,7 @@ function wt({
841
842
  ariaLabel: l,
842
843
  children: [
843
844
  /* @__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(He, { className: "h-6 w-6 text-[var(--prui-warn)]", "aria-hidden": !0 }) }),
845
+ /* @__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
846
  /* @__PURE__ */ e("h2", { className: "text-lg font-semibold text-[var(--prui-fg)]", children: l }),
846
847
  /* @__PURE__ */ e("p", { className: "text-sm text-[var(--prui-dim)]", children: p }),
847
848
  /* @__PURE__ */ e("div", { className: "py-4 font-mono text-4xl font-bold text-[var(--prui-fg)]", "data-testid": "session-countdown", children: i })
@@ -854,7 +855,7 @@ function wt({
854
855
  }
855
856
  );
856
857
  }
857
- const St = {
858
+ const kt = {
858
859
  name: "SessionTimeout",
859
860
  props: [
860
861
  { name: "timeout", type: "number", default: "15", control: "number" },
@@ -862,13 +863,13 @@ const St = {
862
863
  { name: "onTimeout", type: "() => void", default: null, control: "none" },
863
864
  { name: "onExtend", type: "() => void", default: null, control: "none" }
864
865
  ]
865
- }, kt = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
866
+ }, Ct = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
866
867
  __proto__: null,
867
- SessionTimeout: wt,
868
- sessionTimeoutPropsMeta: St
868
+ SessionTimeout: St,
869
+ sessionTimeoutPropsMeta: kt
869
870
  }, Symbol.toStringTag, { value: "Module" }));
870
- function Yt({ title: t, description: a, brand: n, width: r = "max-w-sm", footer: l, children: p, className: m }) {
871
- return /* @__PURE__ */ e("div", { className: E("prui-auth-shell flex min-h-[100dvh] items-center justify-center bg-[var(--prui-background)] p-4", m), "data-testid": "auth-shell", children: /* @__PURE__ */ d("div", { className: E("w-full", r), children: [
871
+ function Wt({ title: t, description: a, brand: n, width: r = "max-w-sm", footer: l, children: p, className: m }) {
872
+ return /* @__PURE__ */ e("div", { className: P("prui-auth-shell flex min-h-[100dvh] items-center justify-center bg-[var(--prui-background)] p-4", m), "data-testid": "auth-shell", children: /* @__PURE__ */ d("div", { className: P("w-full", r), children: [
872
873
  n ? /* @__PURE__ */ d("div", { className: "mb-6 flex items-center justify-center gap-2", "data-testid": "auth-shell-brand", children: [
873
874
  n.mark ? /* @__PURE__ */ e("img", { src: n.mark, alt: "", className: "h-8 w-8 rounded-[var(--prui-radius-1)] object-cover" }) : null,
874
875
  /* @__PURE__ */ e("span", { className: "text-lg font-semibold text-[var(--prui-fg)]", children: n.name })
@@ -883,7 +884,7 @@ function Yt({ title: t, description: a, brand: n, width: r = "max-w-sm", footer:
883
884
  ] })
884
885
  ] }) });
885
886
  }
886
- const Wt = {
887
+ const Xt = {
887
888
  name: "AuthShell",
888
889
  props: [
889
890
  { name: "title", type: "string", default: null, control: "text" },
@@ -895,23 +896,23 @@ const Wt = {
895
896
  ]
896
897
  };
897
898
  export {
898
- It as A,
899
- pt as C,
900
- gt as F,
901
- Bt as R,
902
- wt as S,
903
- ft as a,
904
- Yt as b,
905
- st as c,
906
- Ht as d,
899
+ _t as A,
900
+ ft as C,
901
+ vt as F,
902
+ Kt as R,
903
+ St as S,
904
+ ht as a,
905
+ Wt as b,
906
+ it as c,
907
+ Yt as d,
907
908
  re as e,
908
- Vt as f,
909
- _t as g,
910
- Wt as h,
911
- qt as i,
912
- Jt as j,
913
- Ut as k,
914
- Kt as r,
915
- St as s,
916
- ot as u
909
+ Ut as f,
910
+ qt as g,
911
+ Xt as h,
912
+ Bt as i,
913
+ Ht as j,
914
+ Jt as k,
915
+ Vt as r,
916
+ kt as s,
917
+ ut as u
917
918
  };