lucent-ui 0.4.2 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js CHANGED
@@ -1,10 +1,10 @@
1
- import { jsxs as h, jsx as e, Fragment as V } from "react/jsx-runtime";
2
- import { forwardRef as H, useRef as F, useEffect as B, useState as z, useCallback as Q, useContext as re, createContext as oe, useLayoutEffect as ie, useId as le } from "react";
3
- const ge = {
1
+ import { jsxs as h, jsx as e, Fragment as W } from "react/jsx-runtime";
2
+ import { forwardRef as U, useRef as F, useEffect as L, useState as M, useCallback as Z, useContext as ie, createContext as le, useLayoutEffect as se, useId as ce } from "react";
3
+ const ye = {
4
4
  primary: {
5
5
  background: "var(--lucent-accent-default)",
6
6
  color: "var(--lucent-text-on-accent)",
7
- border: "1px solid var(--lucent-accent-default)"
7
+ border: "1px solid var(--lucent-accent-border)"
8
8
  },
9
9
  secondary: {
10
10
  background: "var(--lucent-surface-default)",
@@ -21,18 +21,18 @@ const ge = {
21
21
  color: "#ffffff",
22
22
  border: "1px solid var(--lucent-danger-default)"
23
23
  }
24
- }, ve = {
24
+ }, xe = {
25
25
  sm: { height: "32px", padding: "0 var(--lucent-space-3)", fontSize: "var(--lucent-font-size-sm)" },
26
26
  md: { height: "38px", padding: "0 var(--lucent-space-4)", fontSize: "var(--lucent-font-size-md)" },
27
27
  lg: { height: "46px", padding: "0 var(--lucent-space-5)", fontSize: "var(--lucent-font-size-lg)" }
28
- }, be = H(
29
- ({ variant: t = "primary", size: n = "md", loading: a = !1, fullWidth: o = !1, spread: r = !1, leftIcon: i, rightIcon: l, chevron: c = !1, disableHoverStyles: f = !1, children: g, disabled: y, style: d, ...s }, u) => {
30
- const v = y ?? a;
28
+ }, we = U(
29
+ ({ variant: t = "primary", size: n = "md", loading: a = !1, fullWidth: o = !1, spread: r = !1, leftIcon: i, rightIcon: l, chevron: s = !1, disableHoverStyles: u = !1, bordered: m = !0, children: b, disabled: d, style: p, ...c }, v) => {
30
+ const y = d ?? a;
31
31
  return /* @__PURE__ */ h(
32
32
  "button",
33
33
  {
34
- ref: u,
35
- disabled: v,
34
+ ref: v,
35
+ disabled: y,
36
36
  "aria-busy": a,
37
37
  style: {
38
38
  display: "inline-flex",
@@ -44,76 +44,78 @@ const ge = {
44
44
  lineHeight: 1,
45
45
  letterSpacing: "0.01em",
46
46
  borderRadius: "var(--lucent-radius-lg)",
47
- cursor: v ? "not-allowed" : "pointer",
47
+ cursor: y ? "not-allowed" : "pointer",
48
48
  width: o ? "100%" : void 0,
49
49
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), border-color var(--lucent-duration-fast) var(--lucent-easing-default), box-shadow var(--lucent-duration-fast) var(--lucent-easing-default), transform 80ms var(--lucent-easing-default)",
50
50
  whiteSpace: "nowrap",
51
51
  boxSizing: "border-box",
52
52
  outline: "none",
53
53
  margin: 0,
54
- ...ve[n],
55
- ...ge[t],
56
- ...d,
57
- ...v && {
54
+ ...xe[n],
55
+ ...ye[t],
56
+ ...p,
57
+ ...y && {
58
58
  background: "var(--lucent-bg-muted)",
59
59
  color: "var(--lucent-text-disabled)",
60
60
  borderColor: "transparent"
61
- }
61
+ },
62
+ // hide border entirely when bordered prop is false
63
+ ...m === !1 && { border: "none" }
62
64
  },
63
- onMouseEnter: (m) => {
64
- var k;
65
- !v && !f && ye(m.currentTarget, t), (k = s.onMouseEnter) == null || k.call(s, m);
65
+ onMouseEnter: (w) => {
66
+ var g;
67
+ !y && !u && ke(w.currentTarget, t, m), (g = c.onMouseEnter) == null || g.call(c, w);
66
68
  },
67
- onMouseLeave: (m) => {
68
- var k;
69
- !v && !f && xe(m.currentTarget, t), (k = s.onMouseLeave) == null || k.call(s, m);
69
+ onMouseLeave: (w) => {
70
+ var g;
71
+ !y && !u && Se(w.currentTarget, t, m), (g = c.onMouseLeave) == null || g.call(c, w);
70
72
  },
71
- onMouseDown: (m) => {
72
- var k;
73
- v || (m.currentTarget.style.transform = "scale(0.95)"), (k = s.onMouseDown) == null || k.call(s, m);
73
+ onMouseDown: (w) => {
74
+ var g;
75
+ y || (w.currentTarget.style.transform = "scale(0.95)"), (g = c.onMouseDown) == null || g.call(c, w);
74
76
  },
75
- onMouseUp: (m) => {
76
- var k;
77
- m.currentTarget.style.transform = "", (k = s.onMouseUp) == null || k.call(s, m);
77
+ onMouseUp: (w) => {
78
+ var g;
79
+ w.currentTarget.style.transform = "", (g = c.onMouseUp) == null || g.call(c, w);
78
80
  },
79
- onFocus: (m) => {
80
- var k;
81
- m.currentTarget.style.boxShadow = "0 0 0 3px var(--lucent-accent-subtle)", (k = s.onFocus) == null || k.call(s, m);
81
+ onFocus: (w) => {
82
+ var g;
83
+ w.currentTarget.style.boxShadow = "0 0 0 3px var(--lucent-accent-subtle)", (g = c.onFocus) == null || g.call(c, w);
82
84
  },
83
- onBlur: (m) => {
84
- var k;
85
- m.currentTarget.style.boxShadow = "", (k = s.onBlur) == null || k.call(s, m);
85
+ onBlur: (w) => {
86
+ var g;
87
+ w.currentTarget.style.boxShadow = "", (g = c.onBlur) == null || g.call(c, w);
86
88
  },
87
- ...s,
89
+ ...c,
88
90
  children: [
89
91
  i,
90
- a ? /* @__PURE__ */ e(Se, {}) : g,
92
+ a ? /* @__PURE__ */ e(Ie, {}) : b,
91
93
  !a && l,
92
- !a && c && /* @__PURE__ */ e(ke, { size: n })
94
+ !a && s && /* @__PURE__ */ e(Ce, { size: n })
93
95
  ]
94
96
  }
95
97
  );
96
98
  }
97
99
  );
98
- be.displayName = "Button";
99
- function ye(t, n) {
100
- n === "primary" ? (t.style.background = "var(--lucent-accent-hover)", t.style.borderColor = "var(--lucent-accent-hover)") : n === "secondary" ? t.style.background = "var(--lucent-bg-subtle)" : n === "ghost" ? t.style.background = "var(--lucent-bg-muted)" : n === "danger" && (t.style.background = "var(--lucent-danger-hover)", t.style.borderColor = "var(--lucent-danger-hover)");
100
+ we.displayName = "Button";
101
+ function ke(t, n, a) {
102
+ n === "primary" ? (t.style.background = "var(--lucent-accent-hover)", a !== !1 && (t.style.borderColor = "var(--lucent-accent-border)")) : n === "secondary" ? t.style.background = "var(--lucent-bg-subtle)" : n === "ghost" ? t.style.background = "var(--lucent-bg-muted)" : n === "danger" && (t.style.background = "var(--lucent-danger-hover)", a !== !1 && (t.style.borderColor = "var(--lucent-danger-hover)"));
101
103
  }
102
- function xe(t, n) {
103
- n === "primary" ? (t.style.background = "var(--lucent-accent-default)", t.style.borderColor = "var(--lucent-accent-default)") : n === "secondary" ? t.style.background = "var(--lucent-surface-default)" : n === "ghost" ? t.style.background = "transparent" : n === "danger" && (t.style.background = "var(--lucent-danger-default)", t.style.borderColor = "var(--lucent-danger-default)");
104
+ function Se(t, n, a) {
105
+ n === "primary" ? (t.style.background = "var(--lucent-accent-default)", a !== !1 && (t.style.borderColor = "var(--lucent-accent-border)")) : n === "secondary" ? t.style.background = "var(--lucent-surface-default)" : n === "ghost" ? t.style.background = "transparent" : n === "danger" && (t.style.background = "var(--lucent-danger-default)", a !== !1 && (t.style.borderColor = "var(--lucent-danger-default)"));
104
106
  }
105
- const we = { sm: 12, md: 14, lg: 16 };
106
- function ke({ size: t }) {
107
- const n = we[t];
107
+ const Te = { sm: 12, md: 14, lg: 16 };
108
+ function Ce({ size: t }) {
109
+ const n = Te[t];
108
110
  return /* @__PURE__ */ e("svg", { width: n, height: n, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, style: { flexShrink: 0, marginLeft: -2 }, children: /* @__PURE__ */ e("polyline", { points: "6 9 12 15 18 9" }) });
109
111
  }
110
- function Se() {
112
+ function Ie() {
111
113
  return /* @__PURE__ */ h("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", "aria-hidden": !0, style: { animation: "lucent-spin 0.7s linear infinite", flexShrink: 0 }, children: [
112
114
  /* @__PURE__ */ e("style", { children: "@keyframes lucent-spin { to { transform: rotate(360deg); } }" }),
113
115
  /* @__PURE__ */ e("path", { d: "M12 2a10 10 0 0 1 10 10" })
114
116
  ] });
115
117
  }
116
- const Wt = {
118
+ const rn = {
117
119
  id: "button",
118
120
  name: "Button",
119
121
  tier: "atom",
@@ -165,6 +167,13 @@ const Wt = {
165
167
  default: "false",
166
168
  description: "Stretches the button to fill its container width."
167
169
  },
170
+ {
171
+ name: "bordered",
172
+ type: "boolean",
173
+ required: !1,
174
+ default: "true",
175
+ description: "When false removes the button border entirely, producing a flat look."
176
+ },
168
177
  {
169
178
  name: "leftIcon",
170
179
  type: "ReactNode",
@@ -216,6 +225,10 @@ const Wt = {
216
225
  {
217
226
  title: "Full-width submit",
218
227
  code: '<Button variant="primary" type="submit" fullWidth>Sign in</Button>'
228
+ },
229
+ {
230
+ title: "Borderless primary",
231
+ code: '<Button variant="primary" bordered={false}>Flat primary</Button>'
219
232
  }
220
233
  ],
221
234
  compositionGraph: [],
@@ -224,14 +237,14 @@ const Wt = {
224
237
  ariaAttributes: ["aria-disabled", "aria-busy"],
225
238
  keyboardInteractions: ["Enter — activates the button", "Space — activates the button"]
226
239
  }
227
- }, se = H(
228
- ({ label: t, helperText: n, errorText: a, leftElement: o, rightElement: r, id: i, style: l, ...c }, f) => {
229
- const g = i ?? `lucent-input-${Math.random().toString(36).slice(2, 7)}`, y = !!a, d = !!c.disabled;
240
+ }, de = U(
241
+ ({ label: t, helperText: n, errorText: a, leftElement: o, rightElement: r, id: i, style: l, ...s }, u) => {
242
+ const m = i ?? `lucent-input-${Math.random().toString(36).slice(2, 7)}`, b = !!a, d = !!s.disabled;
230
243
  return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%" }, children: [
231
244
  t && /* @__PURE__ */ e(
232
245
  "label",
233
246
  {
234
- htmlFor: g,
247
+ htmlFor: m,
235
248
  style: {
236
249
  fontSize: "var(--lucent-font-size-sm)",
237
250
  fontWeight: "var(--lucent-font-weight-medium)",
@@ -253,10 +266,10 @@ const Wt = {
253
266
  /* @__PURE__ */ e(
254
267
  "input",
255
268
  {
256
- ref: f,
257
- id: g,
258
- "aria-invalid": y,
259
- "aria-describedby": y ? `${g}-error` : n ? `${g}-helper` : void 0,
269
+ ref: u,
270
+ id: m,
271
+ "aria-invalid": b,
272
+ "aria-describedby": b ? `${m}-error` : n ? `${m}-helper` : void 0,
260
273
  style: {
261
274
  width: "100%",
262
275
  height: "40px",
@@ -265,7 +278,7 @@ const Wt = {
265
278
  fontFamily: "var(--lucent-font-family-base)",
266
279
  color: d ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
267
280
  background: d ? "var(--lucent-bg-muted)" : "var(--lucent-surface-default)",
268
- border: `1px solid ${d ? "transparent" : y ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
281
+ border: `1px solid ${d ? "transparent" : b ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
269
282
  cursor: d ? "not-allowed" : void 0,
270
283
  borderRadius: "var(--lucent-radius-lg)",
271
284
  outline: "none",
@@ -273,23 +286,23 @@ const Wt = {
273
286
  transition: "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
274
287
  ...l
275
288
  },
276
- onMouseEnter: (s) => {
277
- var u;
278
- !c.disabled && s.currentTarget !== document.activeElement && (s.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-border-strong)"), (u = c.onMouseEnter) == null || u.call(c, s);
289
+ onMouseEnter: (p) => {
290
+ var c;
291
+ !s.disabled && p.currentTarget !== document.activeElement && (p.currentTarget.style.borderColor = b ? "var(--lucent-danger-default)" : "var(--lucent-border-strong)"), (c = s.onMouseEnter) == null || c.call(s, p);
279
292
  },
280
- onMouseLeave: (s) => {
281
- var u;
282
- !c.disabled && s.currentTarget !== document.activeElement && (s.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"), (u = c.onMouseLeave) == null || u.call(c, s);
293
+ onMouseLeave: (p) => {
294
+ var c;
295
+ !s.disabled && p.currentTarget !== document.activeElement && (p.currentTarget.style.borderColor = b ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"), (c = s.onMouseLeave) == null || c.call(s, p);
283
296
  },
284
- onFocus: (s) => {
285
- var u;
286
- s.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", s.currentTarget.style.boxShadow = `0 0 0 3px ${y ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (u = c.onFocus) == null || u.call(c, s);
297
+ onFocus: (p) => {
298
+ var c;
299
+ p.currentTarget.style.borderColor = b ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", p.currentTarget.style.boxShadow = `0 0 0 3px ${b ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (c = s.onFocus) == null || c.call(s, p);
287
300
  },
288
- onBlur: (s) => {
289
- var u;
290
- s.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", s.currentTarget.style.boxShadow = "none", (u = c.onBlur) == null || u.call(c, s);
301
+ onBlur: (p) => {
302
+ var c;
303
+ p.currentTarget.style.borderColor = b ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", p.currentTarget.style.boxShadow = "none", (c = s.onBlur) == null || c.call(s, p);
291
304
  },
292
- ...c
305
+ ...s
293
306
  }
294
307
  ),
295
308
  r && /* @__PURE__ */ e("span", { style: {
@@ -300,10 +313,10 @@ const Wt = {
300
313
  alignItems: "center"
301
314
  }, children: r })
302
315
  ] }),
303
- y && /* @__PURE__ */ e(
316
+ b && /* @__PURE__ */ e(
304
317
  "span",
305
318
  {
306
- id: `${g}-error`,
319
+ id: `${m}-error`,
307
320
  role: "alert",
308
321
  style: {
309
322
  fontSize: "var(--lucent-font-size-sm)",
@@ -313,10 +326,10 @@ const Wt = {
313
326
  children: a
314
327
  }
315
328
  ),
316
- !y && n && /* @__PURE__ */ e(
329
+ !b && n && /* @__PURE__ */ e(
317
330
  "span",
318
331
  {
319
- id: `${g}-helper`,
332
+ id: `${m}-helper`,
320
333
  style: {
321
334
  fontSize: "var(--lucent-font-size-sm)",
322
335
  color: "var(--lucent-text-secondary)",
@@ -328,8 +341,8 @@ const Wt = {
328
341
  ] });
329
342
  }
330
343
  );
331
- se.displayName = "Input";
332
- const Vt = {
344
+ de.displayName = "Input";
345
+ const on = {
333
346
  id: "input",
334
347
  name: "Input",
335
348
  tier: "atom",
@@ -361,14 +374,14 @@ const Vt = {
361
374
  ariaAttributes: ["aria-invalid", "aria-describedby", "aria-label"],
362
375
  keyboardInteractions: ["Tab — focuses the input"]
363
376
  }
364
- }, Te = H(
365
- ({ label: t, helperText: n, errorText: a, autoResize: o = !1, maxLength: r, showCount: i = !1, id: l, value: c, onChange: f, style: g, ...y }, d) => {
366
- const s = F(null), u = d ?? s, v = l ?? `lucent-textarea-${Math.random().toString(36).slice(2, 7)}`, m = !!a, k = typeof c == "string" ? c.length : 0;
367
- return B(() => {
377
+ }, Me = U(
378
+ ({ label: t, helperText: n, errorText: a, autoResize: o = !1, maxLength: r, showCount: i = !1, id: l, value: s, onChange: u, style: m, ...b }, d) => {
379
+ const p = F(null), c = d ?? p, v = l ?? `lucent-textarea-${Math.random().toString(36).slice(2, 7)}`, y = !!a, w = typeof s == "string" ? s.length : 0;
380
+ return L(() => {
368
381
  if (!o) return;
369
- const b = u.current;
370
- b && (b.style.height = "auto", b.style.height = `${b.scrollHeight}px`);
371
- }, [c, o, u]), /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%" }, children: [
382
+ const g = c.current;
383
+ g && (g.style.height = "auto", g.style.height = `${g.scrollHeight}px`);
384
+ }, [s, o, c]), /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%" }, children: [
372
385
  t && /* @__PURE__ */ e("label", { htmlFor: v, style: {
373
386
  fontSize: "var(--lucent-font-size-sm)",
374
387
  fontWeight: "var(--lucent-font-weight-medium)",
@@ -378,13 +391,13 @@ const Vt = {
378
391
  /* @__PURE__ */ e(
379
392
  "textarea",
380
393
  {
381
- ref: u,
394
+ ref: c,
382
395
  id: v,
383
396
  maxLength: r,
384
- value: c,
385
- onChange: f,
386
- "aria-invalid": m,
387
- "aria-describedby": m ? `${v}-error` : n ? `${v}-helper` : void 0,
397
+ value: s,
398
+ onChange: u,
399
+ "aria-invalid": y,
400
+ "aria-describedby": y ? `${v}-error` : n ? `${v}-helper` : void 0,
388
401
  style: {
389
402
  width: "100%",
390
403
  minHeight: "100px",
@@ -393,47 +406,47 @@ const Vt = {
393
406
  fontFamily: "var(--lucent-font-family-base)",
394
407
  color: "var(--lucent-text-primary)",
395
408
  background: "var(--lucent-surface-default)",
396
- border: `1px solid ${m ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
409
+ border: `1px solid ${y ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
397
410
  borderRadius: "var(--lucent-radius-md)",
398
411
  outline: "none",
399
412
  resize: o ? "none" : "vertical",
400
413
  boxSizing: "border-box",
401
414
  lineHeight: "var(--lucent-line-height-base)",
402
415
  transition: "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
403
- ...g
416
+ ...m
404
417
  },
405
- onFocus: (b) => {
418
+ onFocus: (g) => {
406
419
  var x;
407
- b.currentTarget.style.borderColor = m ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", b.currentTarget.style.boxShadow = `0 0 0 3px ${m ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (x = y.onFocus) == null || x.call(y, b);
420
+ g.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", g.currentTarget.style.boxShadow = `0 0 0 3px ${y ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (x = b.onFocus) == null || x.call(b, g);
408
421
  },
409
- onBlur: (b) => {
422
+ onBlur: (g) => {
410
423
  var x;
411
- b.currentTarget.style.borderColor = m ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", b.currentTarget.style.boxShadow = "none", (x = y.onBlur) == null || x.call(y, b);
424
+ g.currentTarget.style.borderColor = y ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", g.currentTarget.style.boxShadow = "none", (x = b.onBlur) == null || x.call(b, g);
412
425
  },
413
- ...y
426
+ ...b
414
427
  }
415
428
  ),
416
429
  /* @__PURE__ */ h("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "flex-start" }, children: [
417
430
  /* @__PURE__ */ h("div", { children: [
418
- m && /* @__PURE__ */ e("span", { id: `${v}-error`, role: "alert", style: { fontSize: "var(--lucent-font-size-sm)", color: "var(--lucent-danger-text)", fontFamily: "var(--lucent-font-family-base)" }, children: a }),
419
- !m && n && /* @__PURE__ */ e("span", { id: `${v}-helper`, style: { fontSize: "var(--lucent-font-size-sm)", color: "var(--lucent-text-secondary)", fontFamily: "var(--lucent-font-family-base)" }, children: n })
431
+ y && /* @__PURE__ */ e("span", { id: `${v}-error`, role: "alert", style: { fontSize: "var(--lucent-font-size-sm)", color: "var(--lucent-danger-text)", fontFamily: "var(--lucent-font-family-base)" }, children: a }),
432
+ !y && n && /* @__PURE__ */ e("span", { id: `${v}-helper`, style: { fontSize: "var(--lucent-font-size-sm)", color: "var(--lucent-text-secondary)", fontFamily: "var(--lucent-font-family-base)" }, children: n })
420
433
  ] }),
421
434
  (i || r) && /* @__PURE__ */ h("span", { style: {
422
435
  fontSize: "var(--lucent-font-size-xs)",
423
- color: r && k >= r ? "var(--lucent-danger-text)" : "var(--lucent-text-secondary)",
436
+ color: r && w >= r ? "var(--lucent-danger-text)" : "var(--lucent-text-secondary)",
424
437
  fontFamily: "var(--lucent-font-family-mono)",
425
438
  flexShrink: 0,
426
439
  marginLeft: "var(--lucent-space-2)"
427
440
  }, children: [
428
- k,
441
+ w,
429
442
  r ? `/${r}` : ""
430
443
  ] })
431
444
  ] })
432
445
  ] });
433
446
  }
434
447
  );
435
- Te.displayName = "Textarea";
436
- const Ot = {
448
+ Me.displayName = "Textarea";
449
+ const ln = {
437
450
  id: "textarea",
438
451
  name: "Textarea",
439
452
  tier: "atom",
@@ -465,19 +478,19 @@ const Ot = {
465
478
  ariaAttributes: ["aria-multiline", "aria-invalid", "aria-describedby"],
466
479
  keyboardInteractions: ["Tab — focuses the textarea"]
467
480
  }
468
- }, Ce = {
481
+ }, ze = {
469
482
  neutral: { bg: "var(--lucent-bg-muted)", color: "var(--lucent-text-secondary)", border: "var(--lucent-border-default)" },
470
483
  accent: { bg: "var(--lucent-accent-default)", color: "var(--lucent-text-on-accent)", border: "var(--lucent-accent-default)" },
471
484
  success: { bg: "var(--lucent-success-subtle)", color: "var(--lucent-success-text)", border: "var(--lucent-success-subtle)" },
472
485
  warning: { bg: "var(--lucent-warning-subtle)", color: "var(--lucent-warning-text)", border: "var(--lucent-warning-subtle)" },
473
486
  danger: { bg: "var(--lucent-danger-subtle)", color: "var(--lucent-danger-text)", border: "var(--lucent-danger-subtle)" },
474
487
  info: { bg: "var(--lucent-info-subtle)", color: "var(--lucent-info-text)", border: "var(--lucent-info-subtle)" }
475
- }, Ie = {
488
+ }, qe = {
476
489
  sm: { fontSize: "var(--lucent-font-size-xs)", padding: "0 var(--lucent-space-2)", height: "18px" },
477
490
  md: { fontSize: "var(--lucent-font-size-sm)", padding: "0 var(--lucent-space-2)", height: "22px" }
478
491
  };
479
- function jt({ variant: t = "neutral", size: n = "md", dot: a = !1, children: o, style: r }) {
480
- const i = Ce[t], l = Ie[n];
492
+ function sn({ variant: t = "neutral", size: n = "md", dot: a = !1, children: o, style: r }) {
493
+ const i = ze[t], l = qe[n];
481
494
  return /* @__PURE__ */ h("span", { style: {
482
495
  display: "inline-flex",
483
496
  alignItems: "center",
@@ -506,7 +519,7 @@ function jt({ variant: t = "neutral", size: n = "md", dot: a = !1, children: o,
506
519
  o
507
520
  ] });
508
521
  }
509
- const Ht = {
522
+ const cn = {
510
523
  id: "badge",
511
524
  name: "Badge",
512
525
  tier: "atom",
@@ -531,27 +544,27 @@ const Ht = {
531
544
  role: "status",
532
545
  notes: "Use aria-label on the parent element when badge meaning depends on context."
533
546
  }
534
- }, Me = {
547
+ }, Ee = {
535
548
  xs: 24,
536
549
  sm: 32,
537
550
  md: 40,
538
551
  lg: 56,
539
552
  xl: 80
540
- }, ze = {
553
+ }, De = {
541
554
  xs: "var(--lucent-font-size-xs)",
542
555
  sm: "var(--lucent-font-size-xs)",
543
556
  md: "var(--lucent-font-size-sm)",
544
557
  lg: "var(--lucent-font-size-lg)",
545
558
  xl: "var(--lucent-font-size-xl)"
546
559
  };
547
- function Ee(t, n) {
560
+ function Ae(t, n) {
548
561
  var o, r, i;
549
562
  if (n) return n.slice(0, 2).toUpperCase();
550
563
  const a = t.trim().split(/\s+/);
551
564
  return a.length === 1 ? (((o = a[0]) == null ? void 0 : o[0]) ?? "").toUpperCase() : ((((r = a[0]) == null ? void 0 : r[0]) ?? "") + (((i = a[a.length - 1]) == null ? void 0 : i[0]) ?? "")).toUpperCase();
552
565
  }
553
- function Ut({ src: t, alt: n, size: a = "md", initials: o, style: r, ...i }) {
554
- const l = Me[a], c = Ee(n, o), f = {
566
+ function dn({ src: t, alt: n, size: a = "md", initials: o, style: r, ...i }) {
567
+ const l = Ee[a], s = Ae(n, o), u = {
555
568
  width: l,
556
569
  height: l,
557
570
  borderRadius: "var(--lucent-radius-full)",
@@ -571,7 +584,7 @@ function Ut({ src: t, alt: n, size: a = "md", initials: o, style: r, ...i }) {
571
584
  alt: n,
572
585
  width: l,
573
586
  height: l,
574
- style: { ...f, objectFit: "cover" },
587
+ style: { ...u, objectFit: "cover" },
575
588
  ...i
576
589
  }
577
590
  ) : /* @__PURE__ */ e(
@@ -580,18 +593,18 @@ function Ut({ src: t, alt: n, size: a = "md", initials: o, style: r, ...i }) {
580
593
  role: "img",
581
594
  "aria-label": n,
582
595
  style: {
583
- ...f,
596
+ ...u,
584
597
  background: "var(--lucent-accent-default)",
585
598
  color: "var(--lucent-text-on-accent)",
586
- fontSize: ze[a],
599
+ fontSize: De[a],
587
600
  fontWeight: "var(--lucent-font-weight-semibold)",
588
601
  fontFamily: "var(--lucent-font-family-base)"
589
602
  },
590
- children: c
603
+ children: s
591
604
  }
592
605
  );
593
606
  }
594
- const Gt = {
607
+ const un = {
595
608
  id: "avatar",
596
609
  name: "Avatar",
597
610
  tier: "atom",
@@ -617,19 +630,19 @@ const Gt = {
617
630
  ariaAttributes: ["aria-label"],
618
631
  notes: 'When src is present, renders as <img> with alt. When showing initials, renders as <span role="img" aria-label>.'
619
632
  }
620
- }, qe = {
633
+ }, Fe = {
621
634
  xs: 12,
622
635
  sm: 16,
623
636
  md: 24,
624
637
  lg: 36
625
- }, De = {
638
+ }, Be = {
626
639
  xs: 2.5,
627
640
  sm: 2.5,
628
641
  md: 2,
629
642
  lg: 2
630
643
  };
631
- function Ae({ size: t = "md", label: n = "Loading…", color: a }) {
632
- const o = qe[t], r = De[t];
644
+ function Re({ size: t = "md", label: n = "Loading…", color: a }) {
645
+ const o = Fe[t], r = Be[t];
633
646
  return /* @__PURE__ */ h("span", { role: "status", "aria-label": n, style: { display: "inline-flex", alignItems: "center", justifyContent: "center" }, children: [
634
647
  /* @__PURE__ */ h(
635
648
  "svg",
@@ -658,7 +671,7 @@ function Ae({ size: t = "md", label: n = "Loading…", color: a }) {
658
671
  /* @__PURE__ */ e("span", { style: { position: "absolute", width: 1, height: 1, overflow: "hidden", clip: "rect(0,0,0,0)", whiteSpace: "nowrap" }, children: n })
659
672
  ] });
660
673
  }
661
- const _t = {
674
+ const pn = {
662
675
  id: "spinner",
663
676
  name: "Spinner",
664
677
  tier: "atom",
@@ -683,7 +696,7 @@ const _t = {
683
696
  notes: 'The visible SVG is aria-hidden. The label is conveyed via a visually-hidden span inside role="status".'
684
697
  }
685
698
  };
686
- function Yt({ orientation: t = "horizontal", label: n, spacing: a = "var(--lucent-space-4)", style: o }) {
699
+ function fn({ orientation: t = "horizontal", label: n, spacing: a = "var(--lucent-space-4)", style: o }) {
687
700
  return t === "vertical" ? /* @__PURE__ */ e(
688
701
  "span",
689
702
  {
@@ -738,7 +751,7 @@ function Yt({ orientation: t = "horizontal", label: n, spacing: a = "var(--lucen
738
751
  }
739
752
  );
740
753
  }
741
- const Kt = {
754
+ const hn = {
742
755
  id: "divider",
743
756
  name: "Divider",
744
757
  tier: "atom",
@@ -761,7 +774,7 @@ const Kt = {
761
774
  role: "separator",
762
775
  ariaAttributes: ["aria-orientation", "aria-label"]
763
776
  }
764
- }, Fe = { sm: 14, md: 16 }, Ne = `
777
+ }, Ne = { sm: 14, md: 16 }, Le = `
765
778
  @keyframes lucent-cb-pop {
766
779
  0% { transform: scale(1); }
767
780
  35% { transform: scale(0.82); }
@@ -773,7 +786,7 @@ const Kt = {
773
786
  60% { transform: scale(1.15) rotate(2deg); }
774
787
  100% { opacity: 1; transform: scale(1) rotate(0deg); }
775
788
  }
776
- `, Re = H(
789
+ `, ue = U(
777
790
  ({
778
791
  label: t,
779
792
  size: n = "md",
@@ -782,41 +795,45 @@ const Kt = {
782
795
  defaultChecked: r,
783
796
  disabled: i,
784
797
  id: l,
785
- onChange: c,
786
- style: f,
787
- ...g
788
- }, y) => {
789
- const d = F(null), s = l ?? `lucent-checkbox-${Math.random().toString(36).slice(2, 7)}`, u = Fe[n], v = o !== void 0, [m, k] = z(r ?? !1), b = v ? !!o : m, x = F(b), [E, T] = z(0);
790
- B(() => {
791
- !i && x.current !== b && (x.current = b, T((S) => S + 1));
792
- }, [b, i]);
793
- const p = Q(
794
- (S) => {
795
- d.current = S, typeof y == "function" ? y(S) : y && (y.current = S);
798
+ onChange: s,
799
+ style: u,
800
+ ...m
801
+ }, b) => {
802
+ const d = F(null), p = l ?? `lucent-checkbox-${Math.random().toString(36).slice(2, 7)}`, c = Ne[n], v = o !== void 0, [y, w] = M(r ?? !1), g = v ? !!o : y, x = F(g), [I, k] = M(0);
803
+ L(() => {
804
+ !i && x.current !== g && (x.current = g, k((C) => C + 1));
805
+ }, [g, i]);
806
+ const f = Z(
807
+ (C) => {
808
+ d.current = C, typeof b == "function" ? b(C) : b && (b.current = C);
796
809
  },
797
- [y]
810
+ [b]
798
811
  );
799
- B(() => {
812
+ L(() => {
800
813
  d.current && (d.current.indeterminate = a);
801
814
  }, [a]);
802
- const C = (S) => {
803
- v || k(S.target.checked), c == null || c(S);
804
- }, D = i ? "var(--lucent-text-disabled)" : "var(--lucent-text-on-accent)", w = {
805
- width: u,
806
- height: u,
807
- borderRadius: "var(--lucent-radius-sm)",
808
- border: `1.5px solid ${i ? "transparent" : b || a ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)"}`,
809
- background: i ? "var(--lucent-bg-muted)" : b || a ? "var(--lucent-accent-default)" : "var(--lucent-surface-default)",
815
+ const S = (C) => {
816
+ v || w(C.target.checked), s == null || s(C);
817
+ }, D = i ? "var(--lucent-text-disabled)" : "var(--lucent-text-on-accent)", T = {
818
+ width: c,
819
+ height: c,
820
+ // fixed corner so global radius overrides (e.g. via customizer) don't
821
+ // turn checkboxes into circles. the design spec keeps them slightly
822
+ // rounded regardless of theming.
823
+ // bumping up a bit to keep the box from feeling too sharp.
824
+ borderRadius: "4px",
825
+ border: `1.5px solid ${i ? "transparent" : g || a ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)"}`,
826
+ background: i ? "var(--lucent-bg-muted)" : g || a ? "var(--lucent-accent-default)" : "var(--lucent-surface-default)",
810
827
  display: "inline-flex",
811
828
  alignItems: "center",
812
829
  justifyContent: "center",
813
830
  flexShrink: 0,
814
831
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
815
832
  // Re-key forces the animation to restart on every toggle.
816
- animation: E > 0 ? "lucent-cb-pop 220ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" : void 0
833
+ animation: I > 0 ? "lucent-cb-pop 220ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" : void 0
817
834
  };
818
- return /* @__PURE__ */ h(V, { children: [
819
- /* @__PURE__ */ e("style", { children: Ne }),
835
+ return /* @__PURE__ */ h(W, { children: [
836
+ /* @__PURE__ */ e("style", { children: Le }),
820
837
  /* @__PURE__ */ h(
821
838
  "label",
822
839
  {
@@ -829,28 +846,28 @@ const Kt = {
829
846
  fontSize: n === "sm" ? "var(--lucent-font-size-sm)" : "var(--lucent-font-size-md)",
830
847
  color: i ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
831
848
  userSelect: "none",
832
- ...f
849
+ ...u
833
850
  },
834
851
  children: [
835
852
  /* @__PURE__ */ e(
836
853
  "input",
837
854
  {
838
- ref: p,
855
+ ref: f,
839
856
  type: "checkbox",
840
- id: s,
841
- checked: v ? o : m,
857
+ id: p,
858
+ checked: v ? o : y,
842
859
  disabled: i,
843
- onChange: C,
860
+ onChange: S,
844
861
  style: { position: "absolute", opacity: 0, width: 0, height: 0, margin: 0, pointerEvents: "none" },
845
- ...g
862
+ ...m
846
863
  }
847
864
  ),
848
- /* @__PURE__ */ h("span", { "aria-hidden": !0, style: w, children: [
849
- b && !a && /* @__PURE__ */ e(
865
+ /* @__PURE__ */ h("span", { "aria-hidden": !0, style: T, children: [
866
+ g && !a && /* @__PURE__ */ e(
850
867
  "svg",
851
868
  {
852
- width: u - 4,
853
- height: u - 4,
869
+ width: c - 4,
870
+ height: c - 4,
854
871
  viewBox: "0 0 10 10",
855
872
  fill: "none",
856
873
  style: { animation: "lucent-cb-mark 200ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" },
@@ -860,15 +877,15 @@ const Kt = {
860
877
  a && /* @__PURE__ */ e(
861
878
  "svg",
862
879
  {
863
- width: u - 4,
864
- height: u - 4,
880
+ width: c - 4,
881
+ height: c - 4,
865
882
  viewBox: "0 0 10 10",
866
883
  fill: "none",
867
884
  style: { animation: "lucent-cb-mark 200ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" },
868
885
  children: /* @__PURE__ */ e("path", { d: "M2 5H8", stroke: D, strokeWidth: 1.5, strokeLinecap: "round" })
869
886
  }
870
887
  )
871
- ] }, E),
888
+ ] }, I),
872
889
  t
873
890
  ]
874
891
  }
@@ -876,8 +893,8 @@ const Kt = {
876
893
  ] });
877
894
  }
878
895
  );
879
- Re.displayName = "Checkbox";
880
- const Xt = {
896
+ ue.displayName = "Checkbox";
897
+ const mn = {
881
898
  id: "checkbox",
882
899
  name: "Checkbox",
883
900
  tier: "atom",
@@ -946,7 +963,7 @@ const Xt = {
946
963
  ariaAttributes: ["aria-checked", "aria-disabled"],
947
964
  keyboardInteractions: ["Space — toggles checked state"]
948
965
  }
949
- }, Le = `
966
+ }, $e = `
950
967
  @keyframes lucent-radio-pop {
951
968
  0% { transform: scale(1); }
952
969
  35% { transform: scale(0.82); }
@@ -958,8 +975,8 @@ const Xt = {
958
975
  60% { transform: scale(1.2); }
959
976
  100% { opacity: 1; transform: scale(1); }
960
977
  }
961
- `, ce = oe(null);
962
- function Be({
978
+ `, pe = le(null);
979
+ function Pe({
963
980
  name: t,
964
981
  value: n,
965
982
  onChange: a,
@@ -968,7 +985,7 @@ function Be({
968
985
  label: i,
969
986
  children: l
970
987
  }) {
971
- return /* @__PURE__ */ e(ce.Provider, { value: { name: t, value: n, onChange: a, disabled: o ?? !1 }, children: /* @__PURE__ */ e(
988
+ return /* @__PURE__ */ e(pe.Provider, { value: { name: t, value: n, onChange: a, disabled: o ?? !1 }, children: /* @__PURE__ */ e(
972
989
  "div",
973
990
  {
974
991
  role: "radiogroup",
@@ -983,27 +1000,27 @@ function Be({
983
1000
  }
984
1001
  ) });
985
1002
  }
986
- const $e = { sm: 14, md: 16 };
987
- function Jt({ value: t, label: n, size: a = "md", disabled: o, id: r, onChange: i, checked: l, ...c }) {
988
- const f = re(ce), g = r ?? `lucent-radio-${Math.random().toString(36).slice(2, 7)}`, y = $e[a], d = o ?? (f == null ? void 0 : f.disabled) ?? !1, s = f ? f.value === t : !!l, u = F(s), [v, m] = z(0);
989
- B(() => {
990
- !d && u.current !== s && (u.current = s, m((E) => E + 1));
991
- }, [s, d]);
992
- const k = (E) => {
993
- f == null || f.onChange(t), i == null || i(E);
994
- }, b = {
995
- width: y / 2,
996
- height: y / 2,
1003
+ const We = { sm: 14, md: 16 };
1004
+ function gn({ value: t, label: n, size: a = "md", disabled: o, id: r, onChange: i, checked: l, ...s }) {
1005
+ const u = ie(pe), m = r ?? `lucent-radio-${Math.random().toString(36).slice(2, 7)}`, b = We[a], d = o ?? (u == null ? void 0 : u.disabled) ?? !1, p = u ? u.value === t : !!l, c = F(p), [v, y] = M(0);
1006
+ L(() => {
1007
+ !d && c.current !== p && (c.current = p, y((I) => I + 1));
1008
+ }, [p, d]);
1009
+ const w = (I) => {
1010
+ u == null || u.onChange(t), i == null || i(I);
1011
+ }, g = {
1012
+ width: b / 2,
1013
+ height: b / 2,
997
1014
  borderRadius: "50%",
998
1015
  background: d ? "var(--lucent-text-disabled)" : "var(--lucent-text-on-accent)",
999
- animation: s ? "lucent-radio-dot 200ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" : void 0,
1000
- opacity: s ? 1 : 0
1016
+ animation: p ? "lucent-radio-dot 200ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" : void 0,
1017
+ opacity: p ? 1 : 0
1001
1018
  }, x = {
1002
- width: y,
1003
- height: y,
1019
+ width: b,
1020
+ height: b,
1004
1021
  borderRadius: "50%",
1005
- border: `1.5px solid ${d ? "transparent" : s ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)"}`,
1006
- background: d ? "var(--lucent-bg-muted)" : s ? "var(--lucent-accent-default)" : "var(--lucent-surface-default)",
1022
+ border: `1.5px solid ${d ? "transparent" : p ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)"}`,
1023
+ background: d ? "var(--lucent-bg-muted)" : p ? "var(--lucent-accent-default)" : "var(--lucent-surface-default)",
1007
1024
  display: "inline-flex",
1008
1025
  alignItems: "center",
1009
1026
  justifyContent: "center",
@@ -1011,8 +1028,8 @@ function Jt({ value: t, label: n, size: a = "md", disabled: o, id: r, onChange:
1011
1028
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
1012
1029
  animation: v > 0 ? "lucent-radio-pop 220ms cubic-bezier(0.34, 1.56, 0.64, 1) forwards" : void 0
1013
1030
  };
1014
- return /* @__PURE__ */ h(V, { children: [
1015
- /* @__PURE__ */ e("style", { children: Le }),
1031
+ return /* @__PURE__ */ h(W, { children: [
1032
+ /* @__PURE__ */ e("style", { children: $e }),
1016
1033
  /* @__PURE__ */ h(
1017
1034
  "label",
1018
1035
  {
@@ -1031,31 +1048,31 @@ function Jt({ value: t, label: n, size: a = "md", disabled: o, id: r, onChange:
1031
1048
  "input",
1032
1049
  {
1033
1050
  type: "radio",
1034
- id: g,
1051
+ id: m,
1035
1052
  value: t,
1036
- name: (f == null ? void 0 : f.name) ?? c.name,
1037
- checked: s,
1053
+ name: (u == null ? void 0 : u.name) ?? s.name,
1054
+ checked: p,
1038
1055
  disabled: d,
1039
- onChange: k,
1056
+ onChange: w,
1040
1057
  style: { position: "absolute", opacity: 0, width: 0, height: 0, margin: 0, pointerEvents: "none" },
1041
- ...c
1058
+ ...s
1042
1059
  }
1043
1060
  ),
1044
- /* @__PURE__ */ e("span", { "aria-hidden": !0, style: x, children: /* @__PURE__ */ e("span", { style: b }) }, v),
1061
+ /* @__PURE__ */ e("span", { "aria-hidden": !0, style: x, children: /* @__PURE__ */ e("span", { style: g }) }, v),
1045
1062
  n
1046
1063
  ]
1047
1064
  }
1048
1065
  )
1049
1066
  ] });
1050
1067
  }
1051
- function Qt({
1068
+ function bn({
1052
1069
  defaultValue: t = "",
1053
1070
  onChange: n,
1054
1071
  ...a
1055
1072
  }) {
1056
- const [o, r] = z(t);
1073
+ const [o, r] = M(t);
1057
1074
  return /* @__PURE__ */ e(
1058
- Be,
1075
+ Pe,
1059
1076
  {
1060
1077
  ...a,
1061
1078
  value: o,
@@ -1065,7 +1082,7 @@ function Qt({
1065
1082
  }
1066
1083
  );
1067
1084
  }
1068
- const Zt = {
1085
+ const vn = {
1069
1086
  id: "radio",
1070
1087
  name: "Radio",
1071
1088
  tier: "atom",
@@ -1142,11 +1159,11 @@ const Zt = {
1142
1159
  "Space — selects the focused radio"
1143
1160
  ]
1144
1161
  }
1145
- }, Pe = {
1162
+ }, Ve = {
1146
1163
  sm: { track: [28, 16], thumb: 12 },
1147
1164
  md: { track: [36, 20], thumb: 16 },
1148
1165
  lg: { track: [44, 24], thumb: 20 }
1149
- }, Z = "cubic-bezier(0.34, 1.56, 0.64, 1)", We = `
1166
+ }, ee = "cubic-bezier(0.34, 1.56, 0.64, 1)", Oe = `
1150
1167
  @keyframes lucent-toggle-pop {
1151
1168
  0% { transform: scale(1); }
1152
1169
  35% { transform: scale(0.94); }
@@ -1154,7 +1171,7 @@ const Zt = {
1154
1171
  100% { transform: scale(1); }
1155
1172
  }
1156
1173
  `;
1157
- function en({
1174
+ function yn({
1158
1175
  label: t,
1159
1176
  size: n = "md",
1160
1177
  checked: a,
@@ -1162,18 +1179,18 @@ function en({
1162
1179
  disabled: r,
1163
1180
  id: i,
1164
1181
  onChange: l,
1165
- style: c,
1166
- ...f
1182
+ style: s,
1183
+ ...u
1167
1184
  }) {
1168
- const g = i ?? `lucent-toggle-${Math.random().toString(36).slice(2, 7)}`, y = a !== void 0, [d, s] = z(o ?? !1), u = y ? !!a : d, v = F(u), [m, k] = z(0);
1169
- B(() => {
1170
- !r && v.current !== u && (v.current = u, k((C) => C + 1));
1171
- }, [u, r]);
1172
- const { track: [b, x], thumb: E } = Pe[n], T = u ? b - E - 2 : 2, p = (C) => {
1173
- y || s(C.target.checked), l == null || l(C);
1185
+ const m = i ?? `lucent-toggle-${Math.random().toString(36).slice(2, 7)}`, b = a !== void 0, [d, p] = M(o ?? !1), c = b ? !!a : d, v = F(c), [y, w] = M(0);
1186
+ L(() => {
1187
+ !r && v.current !== c && (v.current = c, w((S) => S + 1));
1188
+ }, [c, r]);
1189
+ const { track: [g, x], thumb: I } = Ve[n], k = c ? g - I - 2 : 2, f = (S) => {
1190
+ b || p(S.target.checked), l == null || l(S);
1174
1191
  };
1175
- return /* @__PURE__ */ h(V, { children: [
1176
- /* @__PURE__ */ e("style", { children: We }),
1192
+ return /* @__PURE__ */ h(W, { children: [
1193
+ /* @__PURE__ */ e("style", { children: Oe }),
1177
1194
  /* @__PURE__ */ h(
1178
1195
  "label",
1179
1196
  {
@@ -1186,7 +1203,7 @@ function en({
1186
1203
  fontSize: "var(--lucent-font-size-md)",
1187
1204
  color: r ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
1188
1205
  userSelect: "none",
1189
- ...c
1206
+ ...s
1190
1207
  },
1191
1208
  children: [
1192
1209
  /* @__PURE__ */ e(
@@ -1194,13 +1211,13 @@ function en({
1194
1211
  {
1195
1212
  type: "checkbox",
1196
1213
  role: "switch",
1197
- id: g,
1198
- checked: y ? a : d,
1214
+ id: m,
1215
+ checked: b ? a : d,
1199
1216
  disabled: r,
1200
- onChange: p,
1201
- "aria-checked": u,
1217
+ onChange: f,
1218
+ "aria-checked": c,
1202
1219
  style: { position: "absolute", opacity: 0, width: 0, height: 0, margin: 0, pointerEvents: "none" },
1203
- ...f
1220
+ ...u
1204
1221
  }
1205
1222
  ),
1206
1223
  /* @__PURE__ */ e(
@@ -1209,13 +1226,13 @@ function en({
1209
1226
  "aria-hidden": !0,
1210
1227
  style: {
1211
1228
  position: "relative",
1212
- width: b,
1229
+ width: g,
1213
1230
  height: x,
1214
1231
  borderRadius: x / 2,
1215
- background: r ? "var(--lucent-bg-muted)" : u ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)",
1232
+ background: r ? "var(--lucent-bg-muted)" : c ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)",
1216
1233
  flexShrink: 0,
1217
1234
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)",
1218
- animation: m > 0 ? `lucent-toggle-pop 240ms ${Z} forwards` : void 0
1235
+ animation: y > 0 ? `lucent-toggle-pop 240ms ${ee} forwards` : void 0
1219
1236
  },
1220
1237
  children: /* @__PURE__ */ e(
1221
1238
  "span",
@@ -1223,18 +1240,18 @@ function en({
1223
1240
  style: {
1224
1241
  position: "absolute",
1225
1242
  top: 2,
1226
- left: T,
1227
- width: E,
1228
- height: E,
1243
+ left: k,
1244
+ width: I,
1245
+ height: I,
1229
1246
  borderRadius: "50%",
1230
1247
  background: "#ffffff",
1231
1248
  boxShadow: "0 1px 3px rgb(0 0 0 / 0.2)",
1232
- transition: `left 260ms ${Z}`
1249
+ transition: `left 260ms ${ee}`
1233
1250
  }
1234
1251
  }
1235
1252
  )
1236
1253
  },
1237
- m
1254
+ y
1238
1255
  ),
1239
1256
  t
1240
1257
  ]
@@ -1242,7 +1259,7 @@ function en({
1242
1259
  )
1243
1260
  ] });
1244
1261
  }
1245
- const tn = {
1262
+ const xn = {
1246
1263
  id: "toggle",
1247
1264
  name: "Toggle",
1248
1265
  tier: "atom",
@@ -1306,17 +1323,17 @@ const tn = {
1306
1323
  ariaAttributes: ["aria-checked", "aria-disabled"],
1307
1324
  keyboardInteractions: ["Space — toggles the switch state"]
1308
1325
  }
1309
- }, Ve = {
1326
+ }, He = {
1310
1327
  sm: "32px",
1311
1328
  md: "40px",
1312
1329
  lg: "46px"
1313
- }, Oe = {
1330
+ }, je = {
1314
1331
  sm: "var(--lucent-font-size-sm)",
1315
1332
  md: "var(--lucent-font-size-md)",
1316
1333
  lg: "var(--lucent-font-size-lg)"
1317
- }, je = H(
1318
- ({ options: t, size: n = "md", label: a, helperText: o, errorText: r, placeholder: i, disabled: l, id: c, style: f, ...g }, y) => {
1319
- const d = c ?? `lucent-select-${Math.random().toString(36).slice(2, 7)}`, s = !!r;
1334
+ }, Ue = U(
1335
+ ({ options: t, size: n = "md", label: a, helperText: o, errorText: r, placeholder: i, disabled: l, id: s, style: u, ...m }, b) => {
1336
+ const d = s ?? `lucent-select-${Math.random().toString(36).slice(2, 7)}`, p = !!r;
1320
1337
  return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%" }, children: [
1321
1338
  a && /* @__PURE__ */ e(
1322
1339
  "label",
@@ -1335,48 +1352,48 @@ const tn = {
1335
1352
  /* @__PURE__ */ h(
1336
1353
  "select",
1337
1354
  {
1338
- ref: y,
1355
+ ref: b,
1339
1356
  id: d,
1340
1357
  disabled: l,
1341
- "aria-invalid": s,
1342
- "aria-describedby": s ? `${d}-error` : o ? `${d}-helper` : void 0,
1358
+ "aria-invalid": p,
1359
+ "aria-describedby": p ? `${d}-error` : o ? `${d}-helper` : void 0,
1343
1360
  style: {
1344
1361
  width: "100%",
1345
- height: Ve[n],
1362
+ height: He[n],
1346
1363
  padding: "0 var(--lucent-space-8) 0 var(--lucent-space-3)",
1347
- fontSize: Oe[n],
1364
+ fontSize: je[n],
1348
1365
  fontFamily: "var(--lucent-font-family-base)",
1349
1366
  color: "var(--lucent-text-primary)",
1350
1367
  background: "var(--lucent-surface-default)",
1351
- border: `1px solid ${s ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
1368
+ border: `1px solid ${p ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"}`,
1352
1369
  borderRadius: "var(--lucent-radius-lg)",
1353
1370
  outline: "none",
1354
1371
  boxSizing: "border-box",
1355
1372
  appearance: "none",
1356
1373
  cursor: l ? "not-allowed" : "pointer",
1357
1374
  transition: "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
1358
- ...f
1375
+ ...u
1359
1376
  },
1360
- onMouseEnter: (u) => {
1377
+ onMouseEnter: (c) => {
1361
1378
  var v;
1362
- !l && u.currentTarget !== document.activeElement && (u.currentTarget.style.borderColor = s ? "var(--lucent-danger-default)" : "var(--lucent-border-strong)"), (v = g.onMouseEnter) == null || v.call(g, u);
1379
+ !l && c.currentTarget !== document.activeElement && (c.currentTarget.style.borderColor = p ? "var(--lucent-danger-default)" : "var(--lucent-border-strong)"), (v = m.onMouseEnter) == null || v.call(m, c);
1363
1380
  },
1364
- onMouseLeave: (u) => {
1381
+ onMouseLeave: (c) => {
1365
1382
  var v;
1366
- !l && u.currentTarget !== document.activeElement && (u.currentTarget.style.borderColor = s ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"), (v = g.onMouseLeave) == null || v.call(g, u);
1383
+ !l && c.currentTarget !== document.activeElement && (c.currentTarget.style.borderColor = p ? "var(--lucent-danger-default)" : "var(--lucent-border-default)"), (v = m.onMouseLeave) == null || v.call(m, c);
1367
1384
  },
1368
- onFocus: (u) => {
1385
+ onFocus: (c) => {
1369
1386
  var v;
1370
- u.currentTarget.style.borderColor = s ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", u.currentTarget.style.boxShadow = `0 0 0 3px ${s ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (v = g.onFocus) == null || v.call(g, u);
1387
+ c.currentTarget.style.borderColor = p ? "var(--lucent-danger-default)" : "var(--lucent-focus-ring)", c.currentTarget.style.boxShadow = `0 0 0 3px ${p ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}`, (v = m.onFocus) == null || v.call(m, c);
1371
1388
  },
1372
- onBlur: (u) => {
1389
+ onBlur: (c) => {
1373
1390
  var v;
1374
- u.currentTarget.style.borderColor = s ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", u.currentTarget.style.boxShadow = "none", (v = g.onBlur) == null || v.call(g, u);
1391
+ c.currentTarget.style.borderColor = p ? "var(--lucent-danger-default)" : "var(--lucent-border-default)", c.currentTarget.style.boxShadow = "none", (v = m.onBlur) == null || v.call(m, c);
1375
1392
  },
1376
- ...g,
1393
+ ...m,
1377
1394
  children: [
1378
1395
  i && /* @__PURE__ */ e("option", { value: "", disabled: !0, children: i }),
1379
- t.map((u) => /* @__PURE__ */ e("option", { value: u.value, disabled: u.disabled, children: u.label }, u.value))
1396
+ t.map((c) => /* @__PURE__ */ e("option", { value: c.value, disabled: c.disabled, children: c.label }, c.value))
1380
1397
  ]
1381
1398
  }
1382
1399
  ),
@@ -1396,7 +1413,7 @@ const tn = {
1396
1413
  }
1397
1414
  )
1398
1415
  ] }),
1399
- s && /* @__PURE__ */ e(
1416
+ p && /* @__PURE__ */ e(
1400
1417
  "span",
1401
1418
  {
1402
1419
  id: `${d}-error`,
@@ -1409,7 +1426,7 @@ const tn = {
1409
1426
  children: r
1410
1427
  }
1411
1428
  ),
1412
- !s && o && /* @__PURE__ */ e(
1429
+ !p && o && /* @__PURE__ */ e(
1413
1430
  "span",
1414
1431
  {
1415
1432
  id: `${d}-helper`,
@@ -1424,8 +1441,8 @@ const tn = {
1424
1441
  ] });
1425
1442
  }
1426
1443
  );
1427
- je.displayName = "Select";
1428
- const nn = {
1444
+ Ue.displayName = "Select";
1445
+ const wn = {
1429
1446
  id: "select",
1430
1447
  name: "Select",
1431
1448
  tier: "atom",
@@ -1523,19 +1540,19 @@ const nn = {
1523
1540
  "Escape — closes the list"
1524
1541
  ]
1525
1542
  }
1526
- }, He = {
1543
+ }, Ge = {
1527
1544
  neutral: { bg: "var(--lucent-bg-muted)", color: "var(--lucent-text-secondary)", border: "var(--lucent-border-default)", dismissHover: "var(--lucent-border-strong)" },
1528
1545
  accent: { bg: "var(--lucent-accent-subtle)", color: "var(--lucent-accent-active)", border: "var(--lucent-accent-subtle)", dismissHover: "var(--lucent-accent-default)" },
1529
1546
  success: { bg: "var(--lucent-success-subtle)", color: "var(--lucent-success-text)", border: "var(--lucent-success-subtle)", dismissHover: "var(--lucent-success-default)" },
1530
1547
  warning: { bg: "var(--lucent-warning-subtle)", color: "var(--lucent-warning-text)", border: "var(--lucent-warning-subtle)", dismissHover: "var(--lucent-warning-default)" },
1531
1548
  danger: { bg: "var(--lucent-danger-subtle)", color: "var(--lucent-danger-text)", border: "var(--lucent-danger-subtle)", dismissHover: "var(--lucent-danger-default)" },
1532
1549
  info: { bg: "var(--lucent-info-subtle)", color: "var(--lucent-info-text)", border: "var(--lucent-info-subtle)", dismissHover: "var(--lucent-info-default)" }
1533
- }, Ue = {
1550
+ }, _e = {
1534
1551
  sm: { fontSize: "var(--lucent-font-size-xs)", height: "20px", padding: "0 var(--lucent-space-2)", iconSize: 10, gap: "var(--lucent-space-1)" },
1535
1552
  md: { fontSize: "var(--lucent-font-size-sm)", height: "24px", padding: "0 var(--lucent-space-2)", iconSize: 12, gap: "var(--lucent-space-1)" }
1536
1553
  };
1537
- function an({ children: t, variant: n = "neutral", size: a = "md", onDismiss: o, disabled: r }) {
1538
- const i = He[n], l = Ue[a];
1554
+ function kn({ children: t, variant: n = "neutral", size: a = "md", onDismiss: o, disabled: r }) {
1555
+ const i = Ge[n], l = _e[a];
1539
1556
  return /* @__PURE__ */ h(
1540
1557
  "span",
1541
1558
  {
@@ -1581,11 +1598,11 @@ function an({ children: t, variant: n = "neutral", size: a = "md", onDismiss: o,
1581
1598
  flexShrink: 0,
1582
1599
  lineHeight: 1
1583
1600
  },
1584
- onMouseEnter: (c) => {
1585
- r || (c.currentTarget.style.background = i.dismissHover + "33");
1601
+ onMouseEnter: (s) => {
1602
+ r || (s.currentTarget.style.background = i.dismissHover + "33");
1586
1603
  },
1587
- onMouseLeave: (c) => {
1588
- c.currentTarget.style.background = "transparent";
1604
+ onMouseLeave: (s) => {
1605
+ s.currentTarget.style.background = "transparent";
1589
1606
  },
1590
1607
  children: /* @__PURE__ */ e("svg", { width: l.iconSize, height: l.iconSize, viewBox: "0 0 10 10", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", children: /* @__PURE__ */ e("path", { d: "M2 2L8 8M8 2L2 8" }) })
1591
1608
  }
@@ -1594,7 +1611,7 @@ function an({ children: t, variant: n = "neutral", size: a = "md", onDismiss: o,
1594
1611
  }
1595
1612
  );
1596
1613
  }
1597
- const rn = {
1614
+ const Sn = {
1598
1615
  id: "tag",
1599
1616
  name: "Tag",
1600
1617
  tier: "atom",
@@ -1651,12 +1668,12 @@ const rn = {
1651
1668
  notes: 'The dismiss button has aria-label="Dismiss" and is keyboard-focusable.',
1652
1669
  keyboardInteractions: ["Enter / Space — activates the dismiss button when focused"]
1653
1670
  }
1654
- }, A = 5, Ge = {
1671
+ }, A = 5, Ye = {
1655
1672
  top: { bottom: "100%", left: "50%", transform: "translateX(-50%)", marginBottom: A + 3 },
1656
1673
  bottom: { top: "100%", left: "50%", transform: "translateX(-50%)", marginTop: A + 3 },
1657
1674
  left: { right: "100%", top: "50%", transform: "translateY(-50%)", marginRight: A + 3 },
1658
1675
  right: { left: "100%", top: "50%", transform: "translateY(-50%)", marginLeft: A + 3 }
1659
- }, _e = {
1676
+ }, Ke = {
1660
1677
  top: {
1661
1678
  bottom: -A,
1662
1679
  left: "50%",
@@ -1686,20 +1703,20 @@ const rn = {
1686
1703
  borderColor: "transparent var(--lucent-text-primary) transparent transparent"
1687
1704
  }
1688
1705
  };
1689
- function on({ content: t, children: n, placement: a = "top", delay: o = 300 }) {
1690
- const [r, i] = z(!1), l = F(null), c = () => {
1706
+ function Tn({ content: t, children: n, placement: a = "top", delay: o = 300 }) {
1707
+ const [r, i] = M(!1), l = F(null), s = () => {
1691
1708
  l.current = setTimeout(() => i(!0), o);
1692
- }, f = () => {
1709
+ }, u = () => {
1693
1710
  l.current && clearTimeout(l.current), i(!1);
1694
1711
  };
1695
1712
  return t ? /* @__PURE__ */ h(
1696
1713
  "span",
1697
1714
  {
1698
1715
  style: { position: "relative", display: "inline-flex" },
1699
- onMouseEnter: c,
1700
- onMouseLeave: f,
1701
- onFocus: c,
1702
- onBlur: f,
1716
+ onMouseEnter: s,
1717
+ onMouseLeave: u,
1718
+ onFocus: s,
1719
+ onBlur: u,
1703
1720
  children: [
1704
1721
  n,
1705
1722
  r && /* @__PURE__ */ h(
@@ -1708,7 +1725,7 @@ function on({ content: t, children: n, placement: a = "top", delay: o = 300 }) {
1708
1725
  role: "tooltip",
1709
1726
  style: {
1710
1727
  position: "absolute",
1711
- ...Ge[a],
1728
+ ...Ye[a],
1712
1729
  background: "var(--lucent-text-primary)",
1713
1730
  color: "var(--lucent-bg-base)",
1714
1731
  padding: "5px 10px",
@@ -1733,7 +1750,7 @@ function on({ content: t, children: n, placement: a = "top", delay: o = 300 }) {
1733
1750
  width: 0,
1734
1751
  height: 0,
1735
1752
  borderStyle: "solid",
1736
- ..._e[a]
1753
+ ...Ke[a]
1737
1754
  }
1738
1755
  }
1739
1756
  )
@@ -1742,9 +1759,9 @@ function on({ content: t, children: n, placement: a = "top", delay: o = 300 }) {
1742
1759
  )
1743
1760
  ]
1744
1761
  }
1745
- ) : /* @__PURE__ */ e(V, { children: n });
1762
+ ) : /* @__PURE__ */ e(W, { children: n });
1746
1763
  }
1747
- const ln = {
1764
+ const Cn = {
1748
1765
  id: "tooltip",
1749
1766
  name: "Tooltip",
1750
1767
  tier: "atom",
@@ -1793,15 +1810,15 @@ const ln = {
1793
1810
  ariaAttributes: ['role="tooltip"'],
1794
1811
  notes: 'The tooltip is shown on both hover and focus, making it accessible to keyboard users. Content is exposed via role="tooltip".'
1795
1812
  }
1796
- }, Ye = {
1813
+ }, Xe = {
1797
1814
  xs: 12,
1798
1815
  sm: 14,
1799
1816
  md: 16,
1800
1817
  lg: 20,
1801
1818
  xl: 24
1802
1819
  };
1803
- function sn({ children: t, size: n = "md", label: a, color: o, style: r }) {
1804
- const i = Ye[n];
1820
+ function In({ children: t, size: n = "md", label: a, color: o, style: r }) {
1821
+ const i = Xe[n];
1805
1822
  return /* @__PURE__ */ e(
1806
1823
  "span",
1807
1824
  {
@@ -1822,7 +1839,7 @@ function sn({ children: t, size: n = "md", label: a, color: o, style: r }) {
1822
1839
  }
1823
1840
  );
1824
1841
  }
1825
- const cn = {
1842
+ const Mn = {
1826
1843
  id: "icon",
1827
1844
  name: "Icon",
1828
1845
  tier: "atom",
@@ -1870,7 +1887,7 @@ const cn = {
1870
1887
  ariaAttributes: ["aria-label", "aria-hidden"],
1871
1888
  notes: 'aria-hidden="true" is applied automatically when no label is given, hiding the icon from screen readers.'
1872
1889
  }
1873
- }, Ke = {
1890
+ }, Je = {
1874
1891
  primary: "var(--lucent-text-primary)",
1875
1892
  secondary: "var(--lucent-text-secondary)",
1876
1893
  disabled: "var(--lucent-text-disabled)",
@@ -1880,7 +1897,7 @@ const cn = {
1880
1897
  warning: "var(--lucent-warning-text)",
1881
1898
  danger: "var(--lucent-danger-text)",
1882
1899
  info: "var(--lucent-info-text)"
1883
- }, Xe = {
1900
+ }, Qe = {
1884
1901
  xs: "var(--lucent-font-size-xs)",
1885
1902
  sm: "var(--lucent-font-size-sm)",
1886
1903
  md: "var(--lucent-font-size-md)",
@@ -1888,21 +1905,21 @@ const cn = {
1888
1905
  xl: "var(--lucent-font-size-xl)",
1889
1906
  "2xl": "var(--lucent-font-size-2xl)",
1890
1907
  "3xl": "var(--lucent-font-size-3xl)"
1891
- }, Je = {
1908
+ }, Ze = {
1892
1909
  regular: "var(--lucent-font-weight-regular)",
1893
1910
  medium: "var(--lucent-font-weight-medium)",
1894
1911
  semibold: "var(--lucent-font-weight-semibold)",
1895
1912
  bold: "var(--lucent-font-weight-bold)"
1896
- }, Qe = {
1913
+ }, et = {
1897
1914
  tight: "var(--lucent-line-height-tight)",
1898
1915
  base: "var(--lucent-line-height-base)",
1899
1916
  relaxed: "var(--lucent-line-height-relaxed)"
1900
- }, Ze = {
1917
+ }, tt = {
1901
1918
  base: "var(--lucent-font-family-base)",
1902
1919
  mono: "var(--lucent-font-family-mono)",
1903
1920
  display: "var(--lucent-font-family-display)"
1904
1921
  };
1905
- function q({
1922
+ function E({
1906
1923
  as: t = "p",
1907
1924
  size: n = "md",
1908
1925
  weight: a = "regular",
@@ -1910,29 +1927,29 @@ function q({
1910
1927
  align: r = "left",
1911
1928
  lineHeight: i = "base",
1912
1929
  family: l = "base",
1913
- truncate: c = !1,
1914
- children: f,
1915
- style: g,
1916
- ...y
1930
+ truncate: s = !1,
1931
+ children: u,
1932
+ style: m,
1933
+ ...b
1917
1934
  }) {
1918
1935
  const d = {
1919
- fontSize: Xe[n],
1920
- fontWeight: Je[a],
1921
- color: Ke[o],
1936
+ fontSize: Qe[n],
1937
+ fontWeight: Ze[a],
1938
+ color: Je[o],
1922
1939
  textAlign: r,
1923
- lineHeight: Qe[i],
1924
- fontFamily: Ze[l],
1940
+ lineHeight: et[i],
1941
+ fontFamily: tt[l],
1925
1942
  margin: 0,
1926
- ...c && {
1943
+ ...s && {
1927
1944
  overflow: "hidden",
1928
1945
  textOverflow: "ellipsis",
1929
1946
  whiteSpace: "nowrap"
1930
1947
  },
1931
- ...g
1948
+ ...m
1932
1949
  };
1933
- return /* @__PURE__ */ e(t, { style: d, ...y, children: f });
1950
+ return /* @__PURE__ */ e(t, { style: d, ...b, children: u });
1934
1951
  }
1935
- const dn = {
1952
+ const zn = {
1936
1953
  id: "text",
1937
1954
  name: "Text",
1938
1955
  tier: "atom",
@@ -2030,7 +2047,7 @@ const dn = {
2030
2047
  notes: 'The rendered element determines the implicit ARIA role. Use heading elements (h1–h6) for document headings so screen readers can navigate the page structure. Use `as="label"` with `htmlFor` to associate labels with form controls. Decorative text needs no additional ARIA.'
2031
2048
  }
2032
2049
  };
2033
- function un({
2050
+ function qn({
2034
2051
  children: t,
2035
2052
  href: n,
2036
2053
  isActive: a = !1,
@@ -2038,7 +2055,7 @@ function un({
2038
2055
  disabled: r = !1,
2039
2056
  onClick: i,
2040
2057
  as: l,
2041
- style: c
2058
+ style: s
2042
2059
  }) {
2043
2060
  return /* @__PURE__ */ h(
2044
2061
  l ?? "a",
@@ -2063,13 +2080,13 @@ function un({
2063
2080
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), color var(--lucent-duration-fast) var(--lucent-easing-default)",
2064
2081
  userSelect: "none",
2065
2082
  boxSizing: "border-box",
2066
- ...c
2083
+ ...s
2067
2084
  },
2068
- onMouseEnter: (g) => {
2069
- !r && !a && (g.currentTarget.style.background = "var(--lucent-bg-muted)");
2085
+ onMouseEnter: (m) => {
2086
+ !r && !a && (m.currentTarget.style.background = "var(--lucent-bg-muted)");
2070
2087
  },
2071
- onMouseLeave: (g) => {
2072
- !r && !a && (g.currentTarget.style.background = "transparent");
2088
+ onMouseLeave: (m) => {
2089
+ !r && !a && (m.currentTarget.style.background = "transparent");
2073
2090
  },
2074
2091
  children: [
2075
2092
  o != null && /* @__PURE__ */ e("span", { style: { display: "flex", flexShrink: 0, color: "inherit" }, children: o }),
@@ -2078,7 +2095,784 @@ function un({
2078
2095
  }
2079
2096
  );
2080
2097
  }
2081
- function pn({
2098
+ const nt = { sm: "3px", md: "4px", lg: "5px" }, at = { sm: "14px", md: "18px", lg: "22px" }, rt = `
2099
+ .lucent-slider {
2100
+ -webkit-appearance: none;
2101
+ appearance: none;
2102
+ width: 100%;
2103
+ background: transparent;
2104
+ cursor: pointer;
2105
+ outline: none;
2106
+ margin: 0;
2107
+ padding: 6px 0;
2108
+ box-sizing: border-box;
2109
+ }
2110
+ .lucent-slider:disabled { cursor: not-allowed; }
2111
+
2112
+ /* WebKit track */
2113
+ .lucent-slider::-webkit-slider-runnable-track {
2114
+ height: var(--ls-track-h);
2115
+ border-radius: 999px;
2116
+ background: linear-gradient(
2117
+ to right,
2118
+ var(--lucent-accent-default) 0%,
2119
+ var(--lucent-accent-default) var(--ls-fill),
2120
+ var(--lucent-border-default) var(--ls-fill),
2121
+ var(--lucent-border-default) 100%
2122
+ );
2123
+ }
2124
+ .lucent-slider:disabled::-webkit-slider-runnable-track {
2125
+ background: var(--lucent-border-default);
2126
+ }
2127
+
2128
+ /* WebKit thumb */
2129
+ .lucent-slider::-webkit-slider-thumb {
2130
+ -webkit-appearance: none;
2131
+ appearance: none;
2132
+ width: var(--ls-thumb);
2133
+ height: var(--ls-thumb);
2134
+ border-radius: 50%;
2135
+ background: var(--lucent-accent-default);
2136
+ border: 2px solid var(--lucent-surface-default);
2137
+ box-shadow: 0 1px 3px rgb(0 0 0 / 0.15);
2138
+ margin-top: calc((var(--ls-thumb) - var(--ls-track-h)) / -2);
2139
+ transition: transform 120ms ease, box-shadow 120ms ease;
2140
+ cursor: pointer;
2141
+ }
2142
+ .lucent-slider:not(:disabled):hover::-webkit-slider-thumb {
2143
+ transform: scale(1.15);
2144
+ }
2145
+ .lucent-slider:focus-visible::-webkit-slider-thumb {
2146
+ box-shadow: 0 0 0 3px var(--lucent-accent-subtle);
2147
+ }
2148
+ .lucent-slider:disabled::-webkit-slider-thumb {
2149
+ background: var(--lucent-bg-muted);
2150
+ border-color: var(--lucent-border-default);
2151
+ cursor: not-allowed;
2152
+ }
2153
+
2154
+ /* Firefox track */
2155
+ .lucent-slider::-moz-range-track {
2156
+ height: var(--ls-track-h);
2157
+ border-radius: 999px;
2158
+ background: var(--lucent-border-default);
2159
+ }
2160
+ .lucent-slider::-moz-range-progress {
2161
+ height: var(--ls-track-h);
2162
+ border-radius: 999px;
2163
+ background: var(--lucent-accent-default);
2164
+ }
2165
+ .lucent-slider:disabled::-moz-range-progress {
2166
+ background: transparent;
2167
+ }
2168
+
2169
+ /* Firefox thumb */
2170
+ .lucent-slider::-moz-range-thumb {
2171
+ width: var(--ls-thumb);
2172
+ height: var(--ls-thumb);
2173
+ border-radius: 50%;
2174
+ background: var(--lucent-accent-default);
2175
+ border: 2px solid var(--lucent-surface-default);
2176
+ box-shadow: 0 1px 3px rgb(0 0 0 / 0.15);
2177
+ cursor: pointer;
2178
+ transition: transform 120ms ease, box-shadow 120ms ease;
2179
+ }
2180
+ .lucent-slider:not(:disabled):hover::-moz-range-thumb {
2181
+ transform: scale(1.15);
2182
+ }
2183
+ .lucent-slider:focus-visible::-moz-range-thumb {
2184
+ box-shadow: 0 0 0 3px var(--lucent-accent-subtle);
2185
+ }
2186
+ .lucent-slider:disabled::-moz-range-thumb {
2187
+ background: var(--lucent-bg-muted);
2188
+ border-color: var(--lucent-border-default);
2189
+ cursor: not-allowed;
2190
+ }
2191
+ `;
2192
+ function En({
2193
+ label: t,
2194
+ showValue: n = !1,
2195
+ size: a = "md",
2196
+ min: o = 0,
2197
+ max: r = 100,
2198
+ step: i = 1,
2199
+ value: l,
2200
+ defaultValue: s,
2201
+ disabled: u,
2202
+ id: m,
2203
+ onChange: b,
2204
+ style: d,
2205
+ ...p
2206
+ }) {
2207
+ const c = m ?? `lucent-slider-${Math.random().toString(36).slice(2, 7)}`, v = l !== void 0, [y, w] = M(
2208
+ s ?? Math.round((o + r) / 2)
2209
+ ), g = v ? l : y, x = `${(g - o) / (r - o) * 100}%`, I = (k) => {
2210
+ v || w(Number(k.target.value)), b == null || b(k);
2211
+ };
2212
+ return /* @__PURE__ */ h(W, { children: [
2213
+ /* @__PURE__ */ e("style", { children: rt }),
2214
+ /* @__PURE__ */ h(
2215
+ "div",
2216
+ {
2217
+ style: {
2218
+ display: "flex",
2219
+ flexDirection: "column",
2220
+ gap: "var(--lucent-space-1)",
2221
+ width: "100%",
2222
+ fontFamily: "var(--lucent-font-family-base)",
2223
+ ...d
2224
+ },
2225
+ children: [
2226
+ (t || n) && /* @__PURE__ */ h(
2227
+ "div",
2228
+ {
2229
+ style: {
2230
+ display: "flex",
2231
+ justifyContent: "space-between",
2232
+ alignItems: "baseline"
2233
+ },
2234
+ children: [
2235
+ t && /* @__PURE__ */ e(
2236
+ "label",
2237
+ {
2238
+ htmlFor: c,
2239
+ style: {
2240
+ fontSize: "var(--lucent-font-size-sm)",
2241
+ fontWeight: "var(--lucent-font-weight-medium)",
2242
+ color: u ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
2243
+ cursor: u ? "not-allowed" : "default"
2244
+ },
2245
+ children: t
2246
+ }
2247
+ ),
2248
+ n && /* @__PURE__ */ e(
2249
+ "span",
2250
+ {
2251
+ style: {
2252
+ fontSize: "var(--lucent-font-size-sm)",
2253
+ color: u ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
2254
+ fontVariantNumeric: "tabular-nums"
2255
+ },
2256
+ children: g
2257
+ }
2258
+ )
2259
+ ]
2260
+ }
2261
+ ),
2262
+ /* @__PURE__ */ e(
2263
+ "input",
2264
+ {
2265
+ type: "range",
2266
+ id: c,
2267
+ className: "lucent-slider",
2268
+ min: o,
2269
+ max: r,
2270
+ step: i,
2271
+ disabled: u,
2272
+ value: v ? l : y,
2273
+ onChange: I,
2274
+ style: {
2275
+ "--ls-track-h": nt[a],
2276
+ "--ls-thumb": at[a],
2277
+ "--ls-fill": x
2278
+ },
2279
+ ...p
2280
+ }
2281
+ )
2282
+ ]
2283
+ }
2284
+ )
2285
+ ] });
2286
+ }
2287
+ const Dn = {
2288
+ id: "slider",
2289
+ name: "Slider",
2290
+ tier: "atom",
2291
+ domain: "neutral",
2292
+ specVersion: "0.1",
2293
+ description: "A range input styled with Lucent tokens for selecting a numeric value within a bounded range.",
2294
+ designIntent: 'Use Slider for continuous or stepped numeric inputs where the relative position matters — volume, brightness, border radius, spacing scale. Pair with showValue when the exact number is meaningful to the user. For precise numeric entry, use Input with type="number" instead. Disabled state uses muted colours without opacity hacks.',
2295
+ props: [
2296
+ {
2297
+ name: "min",
2298
+ type: "number",
2299
+ required: !1,
2300
+ default: "0",
2301
+ description: "Minimum value."
2302
+ },
2303
+ {
2304
+ name: "max",
2305
+ type: "number",
2306
+ required: !1,
2307
+ default: "100",
2308
+ description: "Maximum value."
2309
+ },
2310
+ {
2311
+ name: "step",
2312
+ type: "number",
2313
+ required: !1,
2314
+ default: "1",
2315
+ description: "Increment step between values."
2316
+ },
2317
+ {
2318
+ name: "value",
2319
+ type: "number",
2320
+ required: !1,
2321
+ description: "Controlled current value. Pair with onChange."
2322
+ },
2323
+ {
2324
+ name: "defaultValue",
2325
+ type: "number",
2326
+ required: !1,
2327
+ description: "Initial value for uncontrolled usage. Defaults to the midpoint of min/max."
2328
+ },
2329
+ {
2330
+ name: "onChange",
2331
+ type: "function",
2332
+ required: !1,
2333
+ description: "Called on every value change."
2334
+ },
2335
+ {
2336
+ name: "label",
2337
+ type: "string",
2338
+ required: !1,
2339
+ description: "Visible label rendered above the track."
2340
+ },
2341
+ {
2342
+ name: "showValue",
2343
+ type: "boolean",
2344
+ required: !1,
2345
+ default: "false",
2346
+ description: "Displays the current numeric value to the right of the label."
2347
+ },
2348
+ {
2349
+ name: "size",
2350
+ type: "enum",
2351
+ required: !1,
2352
+ default: "md",
2353
+ description: "Controls track thickness and thumb diameter.",
2354
+ enumValues: ["sm", "md", "lg"]
2355
+ },
2356
+ {
2357
+ name: "disabled",
2358
+ type: "boolean",
2359
+ required: !1,
2360
+ default: "false",
2361
+ description: "Prevents interaction and dims the control."
2362
+ }
2363
+ ],
2364
+ usageExamples: [
2365
+ { title: "Basic", code: '<Slider label="Volume" showValue />' },
2366
+ { title: "Controlled", code: '<Slider label="Opacity" min={0} max={1} step={0.01} value={opacity} onChange={e => setOpacity(Number(e.target.value))} showValue />' },
2367
+ { title: "Sizes", code: `<Slider size="sm" label="Small" />
2368
+ <Slider size="md" label="Medium" />
2369
+ <Slider size="lg" label="Large" />` },
2370
+ { title: "Disabled", code: '<Slider label="Locked" disabled defaultValue={40} />' }
2371
+ ],
2372
+ compositionGraph: [],
2373
+ accessibility: {
2374
+ role: "slider",
2375
+ ariaAttributes: ["aria-valuemin", "aria-valuemax", "aria-valuenow", "aria-disabled"],
2376
+ keyboardInteractions: [
2377
+ "ArrowRight / ArrowUp — increase value by step",
2378
+ "ArrowLeft / ArrowDown — decrease value by step",
2379
+ "Home — jump to min",
2380
+ "End — jump to max"
2381
+ ]
2382
+ }
2383
+ }, ot = 2e3;
2384
+ function it() {
2385
+ return /* @__PURE__ */ h("svg", { width: 13, height: 13, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, children: [
2386
+ /* @__PURE__ */ e("rect", { x: "9", y: "9", width: "13", height: "13", rx: "2", ry: "2" }),
2387
+ /* @__PURE__ */ e("path", { d: "M5 15H4a2 2 0 01-2-2V4a2 2 0 012-2h9a2 2 0 012 2v1" })
2388
+ ] });
2389
+ }
2390
+ function lt() {
2391
+ return /* @__PURE__ */ e("svg", { width: 13, height: 13, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2.5, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M20 6L9 17l-5-5" }) });
2392
+ }
2393
+ function An({
2394
+ code: t,
2395
+ language: n,
2396
+ tabs: a,
2397
+ variant: o = "code",
2398
+ helperText: r,
2399
+ showCopyButton: i = !0,
2400
+ style: l
2401
+ }) {
2402
+ var g, x;
2403
+ const s = !!(a != null && a.length), [u, m] = M(0), [b, d] = M(!1), p = s ? ((g = a[u]) == null ? void 0 : g.code) ?? "" : t ?? "", c = s ? (x = a[u]) == null ? void 0 : x.language : n, v = async () => {
2404
+ try {
2405
+ await navigator.clipboard.writeText(p), d(!0), setTimeout(() => d(!1), ot);
2406
+ } catch {
2407
+ }
2408
+ }, y = {
2409
+ display: "inline-flex",
2410
+ alignItems: "center",
2411
+ gap: "var(--lucent-space-1)",
2412
+ padding: "3px var(--lucent-space-2)",
2413
+ border: "1px solid transparent",
2414
+ borderRadius: "var(--lucent-radius-md)",
2415
+ background: "transparent",
2416
+ color: b ? "var(--lucent-success-default)" : "var(--lucent-text-secondary)",
2417
+ fontFamily: "var(--lucent-font-family-base)",
2418
+ fontSize: "var(--lucent-font-size-xs)",
2419
+ cursor: "pointer",
2420
+ flexShrink: 0,
2421
+ transition: "color var(--lucent-duration-fast) var(--lucent-easing-default), background var(--lucent-duration-fast) var(--lucent-easing-default)"
2422
+ }, w = () => /* @__PURE__ */ h(
2423
+ "button",
2424
+ {
2425
+ onClick: v,
2426
+ "aria-label": b ? "Copied!" : "Copy code",
2427
+ style: y,
2428
+ onMouseEnter: (I) => {
2429
+ b || (I.currentTarget.style.background = "var(--lucent-bg-hover)", I.currentTarget.style.color = "var(--lucent-text-primary)");
2430
+ },
2431
+ onMouseLeave: (I) => {
2432
+ b || (I.currentTarget.style.background = "transparent", I.currentTarget.style.color = "var(--lucent-text-secondary)");
2433
+ },
2434
+ children: [
2435
+ b ? /* @__PURE__ */ e(lt, {}) : /* @__PURE__ */ e(it, {}),
2436
+ b ? "Copied!" : "Copy"
2437
+ ]
2438
+ }
2439
+ );
2440
+ return /* @__PURE__ */ h(
2441
+ "div",
2442
+ {
2443
+ style: {
2444
+ borderRadius: "var(--lucent-radius-lg)",
2445
+ border: "1px solid var(--lucent-border-default)",
2446
+ overflow: "hidden",
2447
+ ...l
2448
+ },
2449
+ children: [
2450
+ s && /* @__PURE__ */ e(
2451
+ "div",
2452
+ {
2453
+ style: {
2454
+ display: "flex",
2455
+ alignItems: "flex-end",
2456
+ background: "var(--lucent-surface-default)",
2457
+ borderBottom: "1px solid var(--lucent-border-default)",
2458
+ padding: "0 var(--lucent-space-2)"
2459
+ },
2460
+ children: a.map((I, k) => {
2461
+ const f = k === u;
2462
+ return /* @__PURE__ */ h(
2463
+ "button",
2464
+ {
2465
+ onClick: () => {
2466
+ m(k), d(!1);
2467
+ },
2468
+ style: {
2469
+ display: "inline-flex",
2470
+ alignItems: "center",
2471
+ gap: "var(--lucent-space-1)",
2472
+ padding: "var(--lucent-space-2) var(--lucent-space-3)",
2473
+ border: "none",
2474
+ borderBottom: f ? "2px solid var(--lucent-accent-default)" : "2px solid transparent",
2475
+ marginBottom: -1,
2476
+ background: "transparent",
2477
+ color: f ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
2478
+ fontFamily: "var(--lucent-font-family-base)",
2479
+ fontSize: "var(--lucent-font-size-sm)",
2480
+ fontWeight: f ? "var(--lucent-font-weight-semibold)" : "var(--lucent-font-weight-regular)",
2481
+ cursor: "pointer",
2482
+ transition: "color var(--lucent-duration-fast) var(--lucent-easing-default)",
2483
+ whiteSpace: "nowrap"
2484
+ },
2485
+ onMouseEnter: (S) => {
2486
+ f || (S.currentTarget.style.color = "var(--lucent-text-primary)");
2487
+ },
2488
+ onMouseLeave: (S) => {
2489
+ f || (S.currentTarget.style.color = "var(--lucent-text-secondary)");
2490
+ },
2491
+ children: [
2492
+ I.icon !== void 0 && /* @__PURE__ */ e("span", { style: { display: "inline-flex", alignItems: "center" }, children: I.icon }),
2493
+ I.label
2494
+ ]
2495
+ },
2496
+ I.label
2497
+ );
2498
+ })
2499
+ }
2500
+ ),
2501
+ !s && (!!c || i) && /* @__PURE__ */ h(
2502
+ "div",
2503
+ {
2504
+ style: {
2505
+ display: "flex",
2506
+ alignItems: "center",
2507
+ justifyContent: c ? "space-between" : "flex-end",
2508
+ padding: "0 var(--lucent-space-3)",
2509
+ height: 36,
2510
+ background: "var(--lucent-bg-muted)",
2511
+ borderBottom: "1px solid var(--lucent-border-default)"
2512
+ },
2513
+ children: [
2514
+ c && /* @__PURE__ */ e(
2515
+ "span",
2516
+ {
2517
+ style: {
2518
+ fontSize: "var(--lucent-font-size-xs)",
2519
+ fontFamily: "var(--lucent-font-family-mono)",
2520
+ color: "var(--lucent-text-secondary)",
2521
+ letterSpacing: "var(--lucent-letter-spacing-wide)"
2522
+ },
2523
+ children: c
2524
+ }
2525
+ ),
2526
+ i && /* @__PURE__ */ e(w, {})
2527
+ ]
2528
+ }
2529
+ ),
2530
+ r && /* @__PURE__ */ e(
2531
+ "div",
2532
+ {
2533
+ style: {
2534
+ padding: "var(--lucent-space-2) var(--lucent-space-4)",
2535
+ fontSize: "var(--lucent-font-size-xs)",
2536
+ color: "var(--lucent-text-secondary)",
2537
+ fontFamily: "var(--lucent-font-family-base)",
2538
+ background: "var(--lucent-bg-muted)",
2539
+ borderBottom: "1px solid var(--lucent-border-default)"
2540
+ },
2541
+ children: r
2542
+ }
2543
+ ),
2544
+ o === "code" ? /* @__PURE__ */ h("div", { style: { position: "relative" }, children: [
2545
+ /* @__PURE__ */ e(
2546
+ "pre",
2547
+ {
2548
+ style: {
2549
+ margin: 0,
2550
+ padding: "var(--lucent-space-4)",
2551
+ paddingRight: s && i ? "var(--lucent-space-16)" : "var(--lucent-space-4)",
2552
+ background: "var(--lucent-bg-muted)",
2553
+ overflowX: "auto",
2554
+ lineHeight: 1.65
2555
+ },
2556
+ children: /* @__PURE__ */ e(
2557
+ "code",
2558
+ {
2559
+ style: {
2560
+ fontFamily: "var(--lucent-font-family-mono)",
2561
+ fontSize: "var(--lucent-font-size-sm)",
2562
+ color: "var(--lucent-text-primary)"
2563
+ },
2564
+ children: p
2565
+ }
2566
+ )
2567
+ }
2568
+ ),
2569
+ s && i && /* @__PURE__ */ e("div", { style: { position: "absolute", top: "var(--lucent-space-2)", right: "var(--lucent-space-3)" }, children: /* @__PURE__ */ e(w, {}) })
2570
+ ] }) : (
2571
+ /* ── Prompt area ── */
2572
+ /* @__PURE__ */ h(
2573
+ "div",
2574
+ {
2575
+ style: {
2576
+ display: "flex",
2577
+ alignItems: "center",
2578
+ gap: "var(--lucent-space-3)",
2579
+ padding: "var(--lucent-space-3) var(--lucent-space-4)",
2580
+ background: "var(--lucent-bg-muted)"
2581
+ },
2582
+ children: [
2583
+ /* @__PURE__ */ e(
2584
+ "span",
2585
+ {
2586
+ style: {
2587
+ flex: 1,
2588
+ overflow: "hidden",
2589
+ whiteSpace: "nowrap",
2590
+ textOverflow: "ellipsis",
2591
+ fontFamily: "var(--lucent-font-family-mono)",
2592
+ fontSize: "var(--lucent-font-size-sm)",
2593
+ color: "var(--lucent-text-primary)"
2594
+ },
2595
+ children: p
2596
+ }
2597
+ ),
2598
+ i && /* @__PURE__ */ e(w, {})
2599
+ ]
2600
+ }
2601
+ )
2602
+ )
2603
+ ]
2604
+ }
2605
+ );
2606
+ }
2607
+ const Fn = {
2608
+ id: "code-block",
2609
+ name: "CodeBlock",
2610
+ tier: "atom",
2611
+ domain: "neutral",
2612
+ specVersion: "0.1",
2613
+ description: "A styled code display with optional tabs, a language label, copy-to-clipboard, and an AI prompt variant.",
2614
+ designIntent: "Use CodeBlock for static code snippets, install commands, API examples, and AI prompt sharing. The tabs prop switches between related snippets (e.g. pnpm / npm / yarn). The prompt variant renders a single-line truncated display suited to AI tool prompts — the full text is always copied even when visually clipped. Zero-dependency — no syntax highlighting library is bundled.",
2615
+ props: [
2616
+ {
2617
+ name: "code",
2618
+ type: "string",
2619
+ required: !1,
2620
+ description: "Code string — used in single (non-tabbed) mode."
2621
+ },
2622
+ {
2623
+ name: "language",
2624
+ type: "string",
2625
+ required: !1,
2626
+ description: "Language label shown in the header (non-tabbed mode only). Purely cosmetic."
2627
+ },
2628
+ {
2629
+ name: "tabs",
2630
+ type: "array",
2631
+ required: !1,
2632
+ description: "Tabbed mode. Each entry has { label, code, language?, icon? }. Switching tabs resets the copied state."
2633
+ },
2634
+ {
2635
+ name: "variant",
2636
+ type: "enum",
2637
+ required: !1,
2638
+ default: "code",
2639
+ enumValues: ["code", "prompt"],
2640
+ description: '"code" renders a <pre><code> block with horizontal scroll. "prompt" renders a single-line truncated span suited to AI prompts.'
2641
+ },
2642
+ {
2643
+ name: "helperText",
2644
+ type: "string",
2645
+ required: !1,
2646
+ description: "Descriptive text rendered between the tab bar and the code area."
2647
+ },
2648
+ {
2649
+ name: "showCopyButton",
2650
+ type: "boolean",
2651
+ required: !1,
2652
+ default: "true",
2653
+ description: 'Renders a copy-to-clipboard button. Shows a "Copied!" confirmation for 2 s on success.'
2654
+ }
2655
+ ],
2656
+ usageExamples: [
2657
+ {
2658
+ title: "Single snippet",
2659
+ code: '<CodeBlock language="tsx" code={`<Button variant="primary">Save</Button>`} />'
2660
+ },
2661
+ {
2662
+ title: "Tabbed install commands",
2663
+ code: `<CodeBlock tabs={[
2664
+ { label: 'pnpm', code: 'pnpm add lucent-ui', language: 'bash' },
2665
+ { label: 'npm', code: 'npm install lucent-ui', language: 'bash' },
2666
+ ]} />`
2667
+ },
2668
+ {
2669
+ title: "AI prompt",
2670
+ code: `<CodeBlock
2671
+ variant="prompt"
2672
+ helperText="Paste into Claude:"
2673
+ tabs={[
2674
+ { label: 'Claude', icon: '♦', code: '"Add a Button with variant=\\"primary\\"."' },
2675
+ { label: 'Cursor', icon: '↖', code: '@lucent-ui Add a primary Button.' },
2676
+ ]}
2677
+ />`
2678
+ }
2679
+ ],
2680
+ compositionGraph: [],
2681
+ accessibility: {
2682
+ role: "region",
2683
+ ariaAttributes: ["aria-label (copy button)"],
2684
+ keyboardInteractions: [
2685
+ "Tab — focuses the copy button",
2686
+ "Enter / Space — copies the code"
2687
+ ]
2688
+ }
2689
+ }, st = `
2690
+ .lucent-table-row:hover > td,
2691
+ .lucent-table-row:hover > th {
2692
+ background: var(--lucent-bg-hover) !important;
2693
+ }
2694
+ .lucent-table-striped tbody .lucent-table-row:nth-child(even) > td,
2695
+ .lucent-table-striped tbody .lucent-table-row:nth-child(even) > th {
2696
+ background: var(--lucent-bg-muted);
2697
+ }
2698
+ `;
2699
+ function ct({ children: t, style: n, ...a }) {
2700
+ return /* @__PURE__ */ e(
2701
+ "thead",
2702
+ {
2703
+ style: {
2704
+ background: "var(--lucent-bg-muted)",
2705
+ ...n
2706
+ },
2707
+ ...a,
2708
+ children: t
2709
+ }
2710
+ );
2711
+ }
2712
+ function dt({ children: t, ...n }) {
2713
+ return /* @__PURE__ */ e("tbody", { ...n, children: t });
2714
+ }
2715
+ function ut({ children: t, style: n, ...a }) {
2716
+ return /* @__PURE__ */ e(
2717
+ "tfoot",
2718
+ {
2719
+ style: {
2720
+ background: "var(--lucent-bg-muted)",
2721
+ ...n
2722
+ },
2723
+ ...a,
2724
+ children: t
2725
+ }
2726
+ );
2727
+ }
2728
+ function pt({ children: t, className: n, ...a }) {
2729
+ return /* @__PURE__ */ e(
2730
+ "tr",
2731
+ {
2732
+ className: ["lucent-table-row", n].filter(Boolean).join(" "),
2733
+ ...a,
2734
+ children: t
2735
+ }
2736
+ );
2737
+ }
2738
+ function ft({ as: t, children: n, style: a, ...o }) {
2739
+ const r = t === "th", i = {
2740
+ padding: "var(--lucent-space-3) var(--lucent-space-4)",
2741
+ fontFamily: "var(--lucent-font-family-base)",
2742
+ fontSize: "var(--lucent-font-size-sm)",
2743
+ borderBottom: "1px solid var(--lucent-border-default)",
2744
+ textAlign: "left",
2745
+ verticalAlign: "middle",
2746
+ color: r ? "var(--lucent-text-secondary)" : "var(--lucent-text-primary)",
2747
+ fontWeight: r ? "var(--lucent-font-weight-semibold)" : "var(--lucent-font-weight-regular)",
2748
+ whiteSpace: r ? "nowrap" : void 0,
2749
+ ...a
2750
+ };
2751
+ return r ? /* @__PURE__ */ e("th", { scope: "col", style: i, ...o, children: n }) : /* @__PURE__ */ e("td", { style: i, ...o, children: n });
2752
+ }
2753
+ function G({ striped: t = !1, children: n, className: a, style: o, ...r }) {
2754
+ const i = [
2755
+ "lucent-table",
2756
+ t && "lucent-table-striped",
2757
+ a
2758
+ ].filter(Boolean).join(" ");
2759
+ return /* @__PURE__ */ h(W, { children: [
2760
+ /* @__PURE__ */ e("style", { children: st }),
2761
+ /* @__PURE__ */ e("div", { style: { overflowX: "auto", width: "100%" }, children: /* @__PURE__ */ e(
2762
+ "table",
2763
+ {
2764
+ className: i,
2765
+ style: {
2766
+ width: "100%",
2767
+ borderCollapse: "collapse",
2768
+ fontFamily: "var(--lucent-font-family-base)",
2769
+ fontSize: "var(--lucent-font-size-sm)",
2770
+ ...o
2771
+ },
2772
+ ...r,
2773
+ children: n
2774
+ }
2775
+ ) })
2776
+ ] });
2777
+ }
2778
+ G.Head = ct;
2779
+ G.Body = dt;
2780
+ G.Foot = ut;
2781
+ G.Row = pt;
2782
+ G.Cell = ft;
2783
+ const Bn = {
2784
+ id: "table",
2785
+ name: "Table",
2786
+ tier: "atom",
2787
+ domain: "neutral",
2788
+ specVersion: "0.1",
2789
+ description: "A lightweight, token-styled HTML table primitive with compound sub-components. Distinct from DataTable — no sorting, filtering, or pagination.",
2790
+ designIntent: "Use Table for static or lightly dynamic tabular data where full DataTable features are not needed — props tables, changelog entries, comparison grids, reference docs. The compound API (Table.Head, Table.Body, Table.Row, Table.Cell) maps directly to semantic HTML so screen readers get the full table structure. Horizontal overflow is handled automatically by a scroll wrapper.",
2791
+ props: [
2792
+ {
2793
+ name: "striped",
2794
+ type: "boolean",
2795
+ required: !1,
2796
+ default: "false",
2797
+ description: "Applies alternating bgMuted backgrounds to even tbody rows."
2798
+ },
2799
+ {
2800
+ name: "Table.Head",
2801
+ type: "component",
2802
+ required: !1,
2803
+ description: "Renders <thead> with bgMuted background. Accepts Table.Row children."
2804
+ },
2805
+ {
2806
+ name: "Table.Body",
2807
+ type: "component",
2808
+ required: !1,
2809
+ description: "Renders <tbody>. Accepts Table.Row children."
2810
+ },
2811
+ {
2812
+ name: "Table.Foot",
2813
+ type: "component",
2814
+ required: !1,
2815
+ description: "Renders <tfoot> with bgMuted background."
2816
+ },
2817
+ {
2818
+ name: "Table.Row",
2819
+ type: "component",
2820
+ required: !1,
2821
+ description: "Renders <tr> with a hover highlight. Accepts Table.Cell children."
2822
+ },
2823
+ {
2824
+ name: "Table.Cell",
2825
+ type: "component",
2826
+ required: !1,
2827
+ description: 'Renders <td> by default or <th scope="col"> when as="th". Header cells are semibold + secondary colour; data cells are regular + primary.'
2828
+ }
2829
+ ],
2830
+ usageExamples: [
2831
+ {
2832
+ title: "Basic",
2833
+ code: `<Table>
2834
+ <Table.Head>
2835
+ <Table.Row>
2836
+ <Table.Cell as="th">Name</Table.Cell>
2837
+ <Table.Cell as="th">Role</Table.Cell>
2838
+ </Table.Row>
2839
+ </Table.Head>
2840
+ <Table.Body>
2841
+ <Table.Row>
2842
+ <Table.Cell>Alice</Table.Cell>
2843
+ <Table.Cell>Engineer</Table.Cell>
2844
+ </Table.Row>
2845
+ </Table.Body>
2846
+ </Table>`
2847
+ },
2848
+ {
2849
+ title: "Striped",
2850
+ code: `<Table striped>
2851
+ <Table.Head>…</Table.Head>
2852
+ <Table.Body>…</Table.Body>
2853
+ </Table>`
2854
+ },
2855
+ {
2856
+ title: "Custom cell content",
2857
+ code: `<Table.Cell>
2858
+ <Badge variant="success">Active</Badge>
2859
+ </Table.Cell>`
2860
+ }
2861
+ ],
2862
+ compositionGraph: [
2863
+ { componentId: "table-head", componentName: "Table.Head", role: "head", required: !1 },
2864
+ { componentId: "table-body", componentName: "Table.Body", role: "body", required: !1 },
2865
+ { componentId: "table-foot", componentName: "Table.Foot", role: "foot", required: !1 },
2866
+ { componentId: "table-row", componentName: "Table.Row", role: "row", required: !1 },
2867
+ { componentId: "table-cell", componentName: "Table.Cell", role: "cell", required: !1 }
2868
+ ],
2869
+ accessibility: {
2870
+ role: "table",
2871
+ ariaAttributes: ['scope="col" on th cells'],
2872
+ keyboardInteractions: ["Standard browser table navigation"]
2873
+ }
2874
+ };
2875
+ function Rn({
2082
2876
  label: t,
2083
2877
  htmlFor: n,
2084
2878
  required: a = !1,
@@ -2087,17 +2881,17 @@ function pn({
2087
2881
  children: i,
2088
2882
  style: l
2089
2883
  }) {
2090
- const c = r ?? o, f = r ? "danger" : "secondary";
2884
+ const s = r ?? o, u = r ? "danger" : "secondary";
2091
2885
  return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)", ...l }, children: [
2092
2886
  t && /* @__PURE__ */ h("div", { style: { display: "flex", alignItems: "baseline", gap: "var(--lucent-space-1)" }, children: [
2093
- /* @__PURE__ */ e(q, { as: "label", size: "sm", weight: "medium", lineHeight: "tight", ...n !== void 0 && { htmlFor: n }, children: t }),
2094
- a && /* @__PURE__ */ e(q, { as: "span", size: "sm", color: "danger", lineHeight: "tight", "aria-hidden": "true", children: "*" })
2887
+ /* @__PURE__ */ e(E, { as: "label", size: "sm", weight: "medium", lineHeight: "tight", ...n !== void 0 && { htmlFor: n }, children: t }),
2888
+ a && /* @__PURE__ */ e(E, { as: "span", size: "sm", color: "danger", lineHeight: "tight", "aria-hidden": "true", children: "*" })
2095
2889
  ] }),
2096
2890
  i,
2097
- c && /* @__PURE__ */ e(q, { size: "xs", color: f, lineHeight: "tight", children: c })
2891
+ s && /* @__PURE__ */ e(E, { size: "xs", color: u, lineHeight: "tight", children: s })
2098
2892
  ] });
2099
2893
  }
2100
- const fn = {
2894
+ const Nn = {
2101
2895
  id: "form-field",
2102
2896
  name: "FormField",
2103
2897
  tier: "molecule",
@@ -2183,11 +2977,11 @@ const fn = {
2183
2977
  ariaAttributes: ["aria-required", "aria-describedby"],
2184
2978
  notes: 'Link the wrapped control to an error message using aria-describedby on the control and a matching id on the error element for full screen reader support. The required asterisk is aria-hidden; set aria-required="true" on the control itself.'
2185
2979
  }
2186
- }, et = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2980
+ }, ht = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2187
2981
  /* @__PURE__ */ e("circle", { cx: "6.5", cy: "6.5", r: "4", stroke: "currentColor", strokeWidth: "1.5" }),
2188
2982
  /* @__PURE__ */ e("path", { d: "M9.5 9.5L13 13", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
2189
- ] }), tt = () => /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
2190
- function hn({
2983
+ ] }), mt = () => /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
2984
+ function Ln({
2191
2985
  value: t,
2192
2986
  onChange: n,
2193
2987
  placeholder: a = "Search…",
@@ -2195,23 +2989,23 @@ function hn({
2195
2989
  onResultSelect: r,
2196
2990
  isLoading: i = !1,
2197
2991
  disabled: l = !1,
2198
- id: c,
2199
- style: f
2992
+ id: s,
2993
+ style: u
2200
2994
  }) {
2201
- const [g, y] = z(!1), [d, s] = z(null), u = F(null), v = g && o.length > 0, m = () => {
2995
+ const [m, b] = M(!1), [d, p] = M(null), c = F(null), v = m && o.length > 0, y = () => {
2202
2996
  n("");
2203
- }, k = (T) => {
2204
- r == null || r(T), y(!1);
2205
- }, b = () => {
2206
- u.current = setTimeout(() => y(!1), 150);
2997
+ }, w = (k) => {
2998
+ r == null || r(k), b(!1);
2999
+ }, g = () => {
3000
+ c.current = setTimeout(() => b(!1), 150);
2207
3001
  }, x = () => {
2208
- u.current && clearTimeout(u.current), y(!0);
2209
- }, E = i ? /* @__PURE__ */ e(Ae, { size: "sm" }) : t ? /* @__PURE__ */ e(
3002
+ c.current && clearTimeout(c.current), b(!0);
3003
+ }, I = i ? /* @__PURE__ */ e(Re, { size: "sm" }) : t ? /* @__PURE__ */ e(
2210
3004
  "button",
2211
3005
  {
2212
3006
  type: "button",
2213
3007
  "aria-label": "Clear search",
2214
- onClick: m,
3008
+ onClick: y,
2215
3009
  style: {
2216
3010
  display: "flex",
2217
3011
  alignItems: "center",
@@ -2222,29 +3016,29 @@ function hn({
2222
3016
  borderRadius: "var(--lucent-radius-sm)",
2223
3017
  color: "var(--lucent-text-secondary)"
2224
3018
  },
2225
- onMouseEnter: (T) => {
2226
- T.currentTarget.style.color = "var(--lucent-text-primary)";
3019
+ onMouseEnter: (k) => {
3020
+ k.currentTarget.style.color = "var(--lucent-text-primary)";
2227
3021
  },
2228
- onMouseLeave: (T) => {
2229
- T.currentTarget.style.color = "var(--lucent-text-secondary)";
3022
+ onMouseLeave: (k) => {
3023
+ k.currentTarget.style.color = "var(--lucent-text-secondary)";
2230
3024
  },
2231
- children: /* @__PURE__ */ e(tt, {})
3025
+ children: /* @__PURE__ */ e(mt, {})
2232
3026
  }
2233
3027
  ) : null;
2234
- return /* @__PURE__ */ h("div", { style: { position: "relative", ...f }, children: [
3028
+ return /* @__PURE__ */ h("div", { style: { position: "relative", ...u }, children: [
2235
3029
  /* @__PURE__ */ e(
2236
- se,
3030
+ de,
2237
3031
  {
2238
- id: c,
3032
+ id: s,
2239
3033
  type: "search",
2240
3034
  value: t,
2241
- onChange: (T) => n(T.target.value),
3035
+ onChange: (k) => n(k.target.value),
2242
3036
  placeholder: a,
2243
3037
  disabled: l,
2244
- leftElement: /* @__PURE__ */ e(et, {}),
2245
- rightElement: E ?? void 0,
3038
+ leftElement: /* @__PURE__ */ e(ht, {}),
3039
+ rightElement: I ?? void 0,
2246
3040
  onFocus: x,
2247
- onBlur: b
3041
+ onBlur: g
2248
3042
  }
2249
3043
  ),
2250
3044
  v && /* @__PURE__ */ e(
@@ -2263,29 +3057,29 @@ function hn({
2263
3057
  boxShadow: "var(--lucent-shadow-md)",
2264
3058
  overflow: "hidden"
2265
3059
  },
2266
- children: o.map((T, p) => /* @__PURE__ */ e(
3060
+ children: o.map((k, f) => /* @__PURE__ */ e(
2267
3061
  "div",
2268
3062
  {
2269
3063
  role: "option",
2270
3064
  "aria-selected": !1,
2271
- onMouseDown: () => k(T),
2272
- onMouseEnter: () => s(p),
2273
- onMouseLeave: () => s(null),
3065
+ onMouseDown: () => w(k),
3066
+ onMouseEnter: () => p(f),
3067
+ onMouseLeave: () => p(null),
2274
3068
  style: {
2275
3069
  padding: "var(--lucent-space-2) var(--lucent-space-3)",
2276
3070
  cursor: "pointer",
2277
- background: d === p ? "var(--lucent-bg-subtle)" : "transparent",
3071
+ background: d === f ? "var(--lucent-bg-subtle)" : "transparent",
2278
3072
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
2279
3073
  },
2280
- children: /* @__PURE__ */ e(q, { as: "span", size: "md", children: T.label })
3074
+ children: /* @__PURE__ */ e(E, { as: "span", size: "md", children: k.label })
2281
3075
  },
2282
- T.id
3076
+ k.id
2283
3077
  ))
2284
3078
  }
2285
3079
  )
2286
3080
  ] });
2287
3081
  }
2288
- const mn = {
3082
+ const $n = {
2289
3083
  id: "search-input",
2290
3084
  name: "SearchInput",
2291
3085
  tier: "molecule",
@@ -2381,23 +3175,23 @@ const [results, setResults] = useState([]);
2381
3175
  keyboardInteractions: ["Enter to select focused result", "Escape to close dropdown"],
2382
3176
  notes: 'The results list uses role="listbox" with role="option" items. For full keyboard navigation (arrow keys to move between results), wire up onKeyDown on the Input and manage an activeIndex state.'
2383
3177
  }
2384
- }, nt = {
3178
+ }, gt = {
2385
3179
  none: "0",
2386
3180
  sm: "var(--lucent-space-3)",
2387
3181
  md: "var(--lucent-space-4)",
2388
3182
  lg: "var(--lucent-space-6)"
2389
- }, at = {
3183
+ }, bt = {
2390
3184
  none: "var(--lucent-shadow-none)",
2391
3185
  sm: "var(--lucent-shadow-sm)",
2392
3186
  md: "var(--lucent-shadow-md)",
2393
3187
  lg: "var(--lucent-shadow-lg)"
2394
- }, rt = {
3188
+ }, vt = {
2395
3189
  none: "var(--lucent-radius-none)",
2396
3190
  sm: "var(--lucent-radius-sm)",
2397
3191
  md: "var(--lucent-radius-md)",
2398
3192
  lg: "var(--lucent-radius-lg)"
2399
3193
  };
2400
- function gn({
3194
+ function Pn({
2401
3195
  header: t,
2402
3196
  footer: n,
2403
3197
  children: a,
@@ -2406,7 +3200,7 @@ function gn({
2406
3200
  radius: i = "md",
2407
3201
  style: l
2408
3202
  }) {
2409
- const c = nt[o], f = rt[i];
3203
+ const s = gt[o], u = vt[i];
2410
3204
  return /* @__PURE__ */ h(
2411
3205
  "div",
2412
3206
  {
@@ -2415,8 +3209,8 @@ function gn({
2415
3209
  flexDirection: "column",
2416
3210
  background: "var(--lucent-surface-default)",
2417
3211
  border: "1px solid var(--lucent-border-default)",
2418
- borderRadius: f,
2419
- boxShadow: at[r],
3212
+ borderRadius: u,
3213
+ boxShadow: bt[r],
2420
3214
  overflow: "hidden",
2421
3215
  boxSizing: "border-box",
2422
3216
  ...l
@@ -2426,18 +3220,18 @@ function gn({
2426
3220
  "div",
2427
3221
  {
2428
3222
  style: {
2429
- padding: c,
3223
+ padding: s,
2430
3224
  borderBottom: "1px solid var(--lucent-border-default)"
2431
3225
  },
2432
3226
  children: t
2433
3227
  }
2434
3228
  ),
2435
- /* @__PURE__ */ e("div", { style: { padding: c, flex: 1 }, children: a }),
3229
+ /* @__PURE__ */ e("div", { style: { padding: s, flex: 1 }, children: a }),
2436
3230
  n != null && /* @__PURE__ */ e(
2437
3231
  "div",
2438
3232
  {
2439
3233
  style: {
2440
- padding: c,
3234
+ padding: s,
2441
3235
  borderTop: "1px solid var(--lucent-border-default)"
2442
3236
  },
2443
3237
  children: n
@@ -2447,7 +3241,7 @@ function gn({
2447
3241
  }
2448
3242
  );
2449
3243
  }
2450
- const vn = {
3244
+ const Wn = {
2451
3245
  id: "card",
2452
3246
  name: "Card",
2453
3247
  tier: "molecule",
@@ -2532,30 +3326,30 @@ const vn = {
2532
3326
  accessibility: {
2533
3327
  notes: "Card has no implicit ARIA role. If the card represents a landmark, wrap it in a <section> or <article> and provide an aria-label. For interactive cards (clickable), make the wrapper a <button> or <a> and ensure focus styles are visible."
2534
3328
  }
2535
- }, ot = {
3329
+ }, yt = {
2536
3330
  info: { bg: "var(--lucent-info-subtle)", border: "var(--lucent-info-default)", iconColor: "var(--lucent-info-text)", textColor: "info" },
2537
3331
  success: { bg: "var(--lucent-success-subtle)", border: "var(--lucent-success-default)", iconColor: "var(--lucent-success-text)", textColor: "success" },
2538
3332
  warning: { bg: "var(--lucent-warning-subtle)", border: "var(--lucent-warning-default)", iconColor: "var(--lucent-warning-text)", textColor: "warning" },
2539
3333
  danger: { bg: "var(--lucent-danger-subtle)", border: "var(--lucent-danger-default)", iconColor: "var(--lucent-danger-text)", textColor: "danger" }
2540
- }, it = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
3334
+ }, xt = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2541
3335
  /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
2542
3336
  /* @__PURE__ */ e("path", { d: "M8 5.5V8.5M8 10.5V11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
2543
- ] }), lt = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
3337
+ ] }), wt = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2544
3338
  /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
2545
3339
  /* @__PURE__ */ e("path", { d: "M5 8L7 10L11 6", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" })
2546
- ] }), st = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
3340
+ ] }), kt = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2547
3341
  /* @__PURE__ */ e("path", { d: "M8 2L14.5 13H1.5L8 2Z", stroke: "currentColor", strokeWidth: "1.5", strokeLinejoin: "round" }),
2548
3342
  /* @__PURE__ */ e("path", { d: "M8 6V9M8 11V11.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
2549
- ] }), ct = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
3343
+ ] }), St = () => /* @__PURE__ */ h("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", children: [
2550
3344
  /* @__PURE__ */ e("circle", { cx: "8", cy: "8", r: "6.5", stroke: "currentColor", strokeWidth: "1.5" }),
2551
3345
  /* @__PURE__ */ e("path", { d: "M5.5 5.5L10.5 10.5M10.5 5.5L5.5 10.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" })
2552
- ] }), dt = {
2553
- info: /* @__PURE__ */ e(it, {}),
2554
- success: /* @__PURE__ */ e(lt, {}),
2555
- warning: /* @__PURE__ */ e(st, {}),
2556
- danger: /* @__PURE__ */ e(ct, {})
2557
- }, ut = () => /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
2558
- function bn({
3346
+ ] }), Tt = {
3347
+ info: /* @__PURE__ */ e(xt, {}),
3348
+ success: /* @__PURE__ */ e(wt, {}),
3349
+ warning: /* @__PURE__ */ e(kt, {}),
3350
+ danger: /* @__PURE__ */ e(St, {})
3351
+ }, Ct = () => /* @__PURE__ */ e("svg", { width: "14", height: "14", viewBox: "0 0 14 14", fill: "none", "aria-hidden": "true", children: /* @__PURE__ */ e("path", { d: "M3 3L11 11M11 3L3 11", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) });
3352
+ function Vn({
2559
3353
  variant: t = "info",
2560
3354
  title: n,
2561
3355
  children: a,
@@ -2563,7 +3357,7 @@ function bn({
2563
3357
  icon: r,
2564
3358
  style: i
2565
3359
  }) {
2566
- const l = ot[t], c = r ?? dt[t];
3360
+ const l = yt[t], s = r ?? Tt[t];
2567
3361
  return /* @__PURE__ */ h(
2568
3362
  "div",
2569
3363
  {
@@ -2590,12 +3384,12 @@ function bn({
2590
3384
  alignItems: "center",
2591
3385
  paddingTop: 2
2592
3386
  },
2593
- children: c
3387
+ children: s
2594
3388
  }
2595
3389
  ),
2596
3390
  /* @__PURE__ */ h("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)" }, children: [
2597
- n && /* @__PURE__ */ e(q, { as: "span", size: "sm", weight: "semibold", color: l.textColor, lineHeight: "tight", children: n }),
2598
- a && /* @__PURE__ */ e(q, { as: "span", size: "sm", color: l.textColor, lineHeight: "base", children: a })
3391
+ n && /* @__PURE__ */ e(E, { as: "span", size: "sm", weight: "semibold", color: l.textColor, lineHeight: "tight", children: n }),
3392
+ a && /* @__PURE__ */ e(E, { as: "span", size: "sm", color: l.textColor, lineHeight: "base", children: a })
2599
3393
  ] }),
2600
3394
  o && /* @__PURE__ */ e(
2601
3395
  "button",
@@ -2615,20 +3409,20 @@ function bn({
2615
3409
  color: l.iconColor,
2616
3410
  opacity: 0.7
2617
3411
  },
2618
- onMouseEnter: (f) => {
2619
- f.currentTarget.style.opacity = "1";
3412
+ onMouseEnter: (u) => {
3413
+ u.currentTarget.style.opacity = "1";
2620
3414
  },
2621
- onMouseLeave: (f) => {
2622
- f.currentTarget.style.opacity = "0.7";
3415
+ onMouseLeave: (u) => {
3416
+ u.currentTarget.style.opacity = "0.7";
2623
3417
  },
2624
- children: /* @__PURE__ */ e(ut, {})
3418
+ children: /* @__PURE__ */ e(Ct, {})
2625
3419
  }
2626
3420
  )
2627
3421
  ]
2628
3422
  }
2629
3423
  );
2630
3424
  }
2631
- const yn = {
3425
+ const On = {
2632
3426
  id: "alert",
2633
3427
  name: "Alert",
2634
3428
  tier: "molecule",
@@ -2703,7 +3497,7 @@ const yn = {
2703
3497
  notes: 'role="alert" causes screen readers to announce the content immediately when rendered. For non-urgent status messages, consider using role="status" instead by overriding via style/wrapper.'
2704
3498
  }
2705
3499
  };
2706
- function xn({
3500
+ function Hn({
2707
3501
  illustration: t,
2708
3502
  title: n,
2709
3503
  description: a,
@@ -2738,15 +3532,15 @@ function xn({
2738
3532
  }
2739
3533
  ),
2740
3534
  /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)" }, children: [
2741
- /* @__PURE__ */ e(q, { as: "h3", size: "lg", weight: "semibold", align: "center", lineHeight: "tight", children: n }),
2742
- a && /* @__PURE__ */ e(q, { size: "sm", color: "secondary", align: "center", lineHeight: "relaxed", children: a })
3535
+ /* @__PURE__ */ e(E, { as: "h3", size: "lg", weight: "semibold", align: "center", lineHeight: "tight", children: n }),
3536
+ a && /* @__PURE__ */ e(E, { size: "sm", color: "secondary", align: "center", lineHeight: "relaxed", children: a })
2743
3537
  ] }),
2744
3538
  o != null && /* @__PURE__ */ e("div", { children: o })
2745
3539
  ]
2746
3540
  }
2747
3541
  );
2748
3542
  }
2749
- const wn = {
3543
+ const jn = {
2750
3544
  id: "empty-state",
2751
3545
  name: "EmptyState",
2752
3546
  tier: "molecule",
@@ -2817,16 +3611,16 @@ const wn = {
2817
3611
  accessibility: {
2818
3612
  notes: "The title renders as an h3 by default. If EmptyState appears inside a section with its own heading hierarchy, override by passing a Text component as part of a custom layout. Ensure the action element has a descriptive label for screen readers."
2819
3613
  }
2820
- }, pt = {
3614
+ }, It = {
2821
3615
  text: "1em",
2822
3616
  circle: 40,
2823
3617
  rectangle: 40
2824
- }, ft = {
3618
+ }, Mt = {
2825
3619
  text: "var(--lucent-radius-sm)",
2826
3620
  circle: "var(--lucent-radius-full)",
2827
3621
  rectangle: "var(--lucent-radius-md)"
2828
3622
  };
2829
- function ee({
3623
+ function te({
2830
3624
  width: t,
2831
3625
  height: n,
2832
3626
  radius: a,
@@ -2850,7 +3644,7 @@ function ee({
2850
3644
  }
2851
3645
  );
2852
3646
  }
2853
- function kn({
3647
+ function Un({
2854
3648
  variant: t = "rectangle",
2855
3649
  width: n = "100%",
2856
3650
  height: a,
@@ -2859,39 +3653,39 @@ function kn({
2859
3653
  radius: i,
2860
3654
  style: l
2861
3655
  }) {
2862
- const c = a ?? pt[t], f = i ?? ft[t], g = r ? /* @__PURE__ */ e("style", { children: `
3656
+ const s = a ?? It[t], u = i ?? Mt[t], m = r ? /* @__PURE__ */ e("style", { children: `
2863
3657
  @keyframes lucent-skeleton-shimmer {
2864
3658
  0% { background-position: 200% 0; }
2865
3659
  100% { background-position: -200% 0; }
2866
3660
  }
2867
3661
  ` }) : null;
2868
- return t === "text" && o > 1 ? /* @__PURE__ */ h(V, { children: [
2869
- g,
2870
- /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)", ...l }, children: Array.from({ length: o }).map((y, d) => /* @__PURE__ */ e(
2871
- ee,
3662
+ return t === "text" && o > 1 ? /* @__PURE__ */ h(W, { children: [
3663
+ m,
3664
+ /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)", ...l }, children: Array.from({ length: o }).map((b, d) => /* @__PURE__ */ e(
3665
+ te,
2872
3666
  {
2873
3667
  width: d === o - 1 ? "70%" : n,
2874
- height: c,
2875
- radius: f,
3668
+ height: s,
3669
+ radius: u,
2876
3670
  animate: r
2877
3671
  },
2878
3672
  d
2879
3673
  )) })
2880
- ] }) : /* @__PURE__ */ h(V, { children: [
2881
- g,
3674
+ ] }) : /* @__PURE__ */ h(W, { children: [
3675
+ m,
2882
3676
  /* @__PURE__ */ e(
2883
- ee,
3677
+ te,
2884
3678
  {
2885
3679
  width: t === "circle" ? a ?? 40 : n,
2886
- height: c,
2887
- radius: f,
3680
+ height: s,
3681
+ radius: u,
2888
3682
  animate: r,
2889
3683
  ...l !== void 0 && { style: l }
2890
3684
  }
2891
3685
  )
2892
3686
  ] });
2893
3687
  }
2894
- const Sn = {
3688
+ const Gn = {
2895
3689
  id: "skeleton",
2896
3690
  name: "Skeleton",
2897
3691
  tier: "molecule",
@@ -2978,7 +3772,7 @@ const Sn = {
2978
3772
  notes: 'Wrap loading regions with aria-busy="true" on the container so screen readers know content is loading. Individual Skeleton elements are presentational and do not need ARIA attributes themselves.'
2979
3773
  }
2980
3774
  };
2981
- function Tn({ items: t, separator: n = "/", style: a }) {
3775
+ function _n({ items: t, separator: n = "/", style: a }) {
2982
3776
  return /* @__PURE__ */ e("nav", { "aria-label": "Breadcrumb", style: a, children: /* @__PURE__ */ e(
2983
3777
  "ol",
2984
3778
  {
@@ -2995,7 +3789,7 @@ function Tn({ items: t, separator: n = "/", style: a }) {
2995
3789
  children: t.map((o, r) => {
2996
3790
  const i = r === t.length - 1;
2997
3791
  return /* @__PURE__ */ h("li", { style: { display: "flex", alignItems: "center", gap: "var(--lucent-space-1)" }, children: [
2998
- i ? /* @__PURE__ */ e(q, { size: "sm", color: "primary", as: "span", "aria-current": "page", children: o.label }) : o.href != null ? /* @__PURE__ */ e(
3792
+ i ? /* @__PURE__ */ e(E, { size: "sm", color: "primary", as: "span", "aria-current": "page", children: o.label }) : o.href != null ? /* @__PURE__ */ e(
2999
3793
  "a",
3000
3794
  {
3001
3795
  href: o.href,
@@ -3044,20 +3838,20 @@ function Tn({ items: t, separator: n = "/", style: a }) {
3044
3838
  }
3045
3839
  ) });
3046
3840
  }
3047
- function Cn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3048
- var b;
3049
- const i = a !== void 0, [l, c] = z(n ?? ((b = t[0]) == null ? void 0 : b.value) ?? ""), f = i ? a : l, [g, y] = z(null), d = F([]), [s, u] = z(null), v = F(!1);
3050
- ie(() => {
3051
- const x = t.findIndex((T) => T.value === f), E = d.current[x];
3052
- E && (u({ left: E.offsetLeft, width: E.offsetWidth, animate: v.current }), v.current = !0);
3053
- }, [f, t]);
3054
- const m = (x) => {
3055
- i || c(x), o == null || o(x);
3056
- }, k = (x, E) => {
3841
+ function Yn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3842
+ var g;
3843
+ const i = a !== void 0, [l, s] = M(n ?? ((g = t[0]) == null ? void 0 : g.value) ?? ""), u = i ? a : l, [m, b] = M(null), d = F([]), [p, c] = M(null), v = F(!1);
3844
+ se(() => {
3845
+ const x = t.findIndex((k) => k.value === u), I = d.current[x];
3846
+ I && (c({ left: I.offsetLeft, width: I.offsetWidth, animate: v.current }), v.current = !0);
3847
+ }, [u, t]);
3848
+ const y = (x) => {
3849
+ i || s(x), o == null || o(x);
3850
+ }, w = (x, I) => {
3057
3851
  var D;
3058
- const T = t.map((w, S) => w.disabled ? -1 : S).filter((w) => w !== -1), p = T.indexOf(E);
3059
- let C = -1;
3060
- x.key === "ArrowRight" && (C = T[(p + 1) % T.length] ?? -1), x.key === "ArrowLeft" && (C = T[(p - 1 + T.length) % T.length] ?? -1), x.key === "Home" && (C = T[0] ?? -1), x.key === "End" && (C = T[T.length - 1] ?? -1), C !== -1 && (x.preventDefault(), (D = d.current[C]) == null || D.focus(), m(t[C].value));
3852
+ const k = t.map((T, C) => T.disabled ? -1 : C).filter((T) => T !== -1), f = k.indexOf(I);
3853
+ let S = -1;
3854
+ x.key === "ArrowRight" && (S = k[(f + 1) % k.length] ?? -1), x.key === "ArrowLeft" && (S = k[(f - 1 + k.length) % k.length] ?? -1), x.key === "Home" && (S = k[0] ?? -1), x.key === "End" && (S = k[k.length - 1] ?? -1), S !== -1 && (x.preventDefault(), (D = d.current[S]) == null || D.focus(), y(t[S].value));
3061
3855
  };
3062
3856
  return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", ...r }, children: [
3063
3857
  /* @__PURE__ */ h(
@@ -3070,37 +3864,37 @@ function Cn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3070
3864
  borderBottom: "1px solid var(--lucent-border-default)"
3071
3865
  },
3072
3866
  children: [
3073
- t.map((x, E) => {
3074
- const T = x.value === f, p = x.disabled ?? !1;
3867
+ t.map((x, I) => {
3868
+ const k = x.value === u, f = x.disabled ?? !1;
3075
3869
  return /* @__PURE__ */ e(
3076
3870
  "button",
3077
3871
  {
3078
- ref: (C) => {
3079
- d.current[E] = C;
3872
+ ref: (S) => {
3873
+ d.current[I] = S;
3080
3874
  },
3081
3875
  role: "tab",
3082
- "aria-selected": T,
3876
+ "aria-selected": k,
3083
3877
  "aria-controls": `lucent-tabpanel-${x.value}`,
3084
3878
  id: `lucent-tab-${x.value}`,
3085
- disabled: p,
3086
- tabIndex: T ? 0 : -1,
3879
+ disabled: f,
3880
+ tabIndex: k ? 0 : -1,
3087
3881
  onClick: () => {
3088
- p || m(x.value);
3882
+ f || y(x.value);
3089
3883
  },
3090
- onKeyDown: (C) => k(C, E),
3884
+ onKeyDown: (S) => w(S, I),
3091
3885
  onMouseEnter: () => {
3092
- p || y(E);
3886
+ f || b(I);
3093
3887
  },
3094
- onMouseLeave: () => y(null),
3888
+ onMouseLeave: () => b(null),
3095
3889
  style: {
3096
3890
  padding: "var(--lucent-space-1) var(--lucent-space-2) var(--lucent-space-3)",
3097
3891
  background: "none",
3098
3892
  border: "none",
3099
- cursor: p ? "not-allowed" : "pointer",
3893
+ cursor: f ? "not-allowed" : "pointer",
3100
3894
  fontFamily: "var(--lucent-font-family-base)",
3101
3895
  fontSize: "var(--lucent-font-size-md)",
3102
- fontWeight: T ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
3103
- color: p ? "var(--lucent-text-disabled)" : T ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
3896
+ fontWeight: k ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
3897
+ color: f ? "var(--lucent-text-disabled)" : k ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
3104
3898
  transition: "color var(--lucent-duration-fast) var(--lucent-easing-default)",
3105
3899
  whiteSpace: "nowrap",
3106
3900
  outline: "none"
@@ -3109,26 +3903,26 @@ function Cn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3109
3903
  display: "block",
3110
3904
  padding: "var(--lucent-space-1) var(--lucent-space-3)",
3111
3905
  borderRadius: "var(--lucent-radius-md)",
3112
- background: g === E && !T ? "var(--lucent-bg-subtle)" : "transparent",
3906
+ background: m === I && !k ? "var(--lucent-bg-subtle)" : "transparent",
3113
3907
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
3114
3908
  }, children: x.label })
3115
3909
  },
3116
3910
  x.value
3117
3911
  );
3118
3912
  }),
3119
- s != null && /* @__PURE__ */ e(
3913
+ p != null && /* @__PURE__ */ e(
3120
3914
  "span",
3121
3915
  {
3122
3916
  "aria-hidden": !0,
3123
3917
  style: {
3124
3918
  position: "absolute",
3125
3919
  bottom: 0,
3126
- left: s.left,
3127
- width: s.width,
3920
+ left: p.left,
3921
+ width: p.width,
3128
3922
  height: 2,
3129
3923
  background: "var(--lucent-accent-default)",
3130
3924
  borderRadius: "var(--lucent-radius-sm)",
3131
- transition: s.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
3925
+ transition: p.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
3132
3926
  }
3133
3927
  }
3134
3928
  )
@@ -3141,7 +3935,7 @@ function Cn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3141
3935
  role: "tabpanel",
3142
3936
  id: `lucent-tabpanel-${x.value}`,
3143
3937
  "aria-labelledby": `lucent-tab-${x.value}`,
3144
- hidden: x.value !== f,
3938
+ hidden: x.value !== u,
3145
3939
  style: { padding: "var(--lucent-space-4) 0", outline: "none" },
3146
3940
  tabIndex: 0,
3147
3941
  children: x.content
@@ -3150,39 +3944,39 @@ function Cn({ tabs: t, defaultValue: n, value: a, onChange: o, style: r }) {
3150
3944
  ))
3151
3945
  ] });
3152
3946
  }
3153
- const ht = `
3947
+ const zt = `
3154
3948
  @keyframes lucent-collapsible-open {
3155
3949
  from { opacity: 0; transform: translateY(-4px); }
3156
3950
  to { opacity: 1; transform: translateY(0); }
3157
3951
  }
3158
3952
  `;
3159
- function In({ trigger: t, children: n, defaultOpen: a = !1, open: o, onOpenChange: r, style: i }) {
3160
- const l = o !== void 0, [c, f] = z(a), g = l ? o : c, y = F(null), [d, s] = z(g ? void 0 : 0), u = F(!1);
3161
- B(() => {
3162
- const m = y.current;
3163
- if (m)
3164
- if (g) {
3165
- const k = m.scrollHeight;
3166
- s(k), u.current = !0;
3167
- const b = setTimeout(() => {
3168
- s(void 0), u.current = !1;
3953
+ function Kn({ trigger: t, children: n, defaultOpen: a = !1, open: o, onOpenChange: r, style: i }) {
3954
+ const l = o !== void 0, [s, u] = M(a), m = l ? o : s, b = F(null), [d, p] = M(m ? void 0 : 0), c = F(!1);
3955
+ L(() => {
3956
+ const y = b.current;
3957
+ if (y)
3958
+ if (m) {
3959
+ const w = y.scrollHeight;
3960
+ p(w), c.current = !0;
3961
+ const g = setTimeout(() => {
3962
+ p(void 0), c.current = !1;
3169
3963
  }, 220);
3170
- return () => clearTimeout(b);
3964
+ return () => clearTimeout(g);
3171
3965
  } else
3172
- s(m.scrollHeight), m.getBoundingClientRect(), s(0);
3173
- }, [g]);
3966
+ p(y.scrollHeight), y.getBoundingClientRect(), p(0);
3967
+ }, [m]);
3174
3968
  const v = () => {
3175
- const m = !g;
3176
- l || f(m), r == null || r(m);
3969
+ const y = !m;
3970
+ l || u(y), r == null || r(y);
3177
3971
  };
3178
- return /* @__PURE__ */ h(V, { children: [
3179
- /* @__PURE__ */ e("style", { children: ht }),
3972
+ return /* @__PURE__ */ h(W, { children: [
3973
+ /* @__PURE__ */ e("style", { children: zt }),
3180
3974
  /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", fontFamily: "var(--lucent-font-family-base)", fontSize: "var(--lucent-font-size-md)", ...i }, children: [
3181
3975
  /* @__PURE__ */ h(
3182
3976
  "button",
3183
3977
  {
3184
3978
  onClick: v,
3185
- "aria-expanded": g,
3979
+ "aria-expanded": m,
3186
3980
  style: {
3187
3981
  display: "flex",
3188
3982
  alignItems: "center",
@@ -3199,15 +3993,15 @@ function In({ trigger: t, children: n, defaultOpen: a = !1, open: o, onOpenChang
3199
3993
  },
3200
3994
  children: [
3201
3995
  /* @__PURE__ */ e("span", { style: { flex: 1 }, children: t }),
3202
- /* @__PURE__ */ e(mt, { open: g })
3996
+ /* @__PURE__ */ e(qt, { open: m })
3203
3997
  ]
3204
3998
  }
3205
3999
  ),
3206
4000
  /* @__PURE__ */ e(
3207
4001
  "div",
3208
4002
  {
3209
- ref: y,
3210
- "aria-hidden": !g,
4003
+ ref: b,
4004
+ "aria-hidden": !m,
3211
4005
  style: {
3212
4006
  overflow: "hidden",
3213
4007
  height: d !== void 0 ? d : "auto",
@@ -3218,7 +4012,7 @@ function In({ trigger: t, children: n, defaultOpen: a = !1, open: o, onOpenChang
3218
4012
  {
3219
4013
  style: {
3220
4014
  padding: "var(--lucent-space-2) var(--lucent-space-4) var(--lucent-space-3)",
3221
- animation: g ? "lucent-collapsible-open 200ms var(--lucent-easing-default) forwards" : void 0
4015
+ animation: m ? "lucent-collapsible-open 200ms var(--lucent-easing-default) forwards" : void 0
3222
4016
  },
3223
4017
  children: n
3224
4018
  }
@@ -3228,7 +4022,7 @@ function In({ trigger: t, children: n, defaultOpen: a = !1, open: o, onOpenChang
3228
4022
  ] })
3229
4023
  ] });
3230
4024
  }
3231
- function mt({ open: t }) {
4025
+ function qt({ open: t }) {
3232
4026
  return /* @__PURE__ */ e(
3233
4027
  "svg",
3234
4028
  {
@@ -3251,10 +4045,10 @@ function mt({ open: t }) {
3251
4045
  }
3252
4046
  );
3253
4047
  }
3254
- function G(t) {
4048
+ function _(t) {
3255
4049
  return typeof t == "number" ? `${t}px` : t;
3256
4050
  }
3257
- function Mn({
4051
+ function Xn({
3258
4052
  children: t,
3259
4053
  header: n,
3260
4054
  sidebar: a,
@@ -3262,14 +4056,14 @@ function Mn({
3262
4056
  headerHeight: r = 48,
3263
4057
  sidebarCollapsed: i = !1,
3264
4058
  rightSidebar: l,
3265
- rightSidebarWidth: c = 240,
3266
- rightSidebarCollapsed: f = !1,
3267
- footer: g,
3268
- footerHeight: y = 28,
4059
+ rightSidebarWidth: s = 240,
4060
+ rightSidebarCollapsed: u = !1,
4061
+ footer: m,
4062
+ footerHeight: b = 28,
3269
4063
  mainStyle: d,
3270
- style: s
4064
+ style: p
3271
4065
  }) {
3272
- const u = G(r), v = G(o), m = G(c), k = G(y);
4066
+ const c = _(r), v = _(o), y = _(s), w = _(b);
3273
4067
  return /* @__PURE__ */ h(
3274
4068
  "div",
3275
4069
  {
@@ -3279,7 +4073,7 @@ function Mn({
3279
4073
  height: "100vh",
3280
4074
  overflow: "hidden",
3281
4075
  fontFamily: "var(--lucent-font-family-base)",
3282
- ...s
4076
+ ...p
3283
4077
  },
3284
4078
  children: [
3285
4079
  n != null && /* @__PURE__ */ e(
@@ -3287,7 +4081,7 @@ function Mn({
3287
4081
  {
3288
4082
  style: {
3289
4083
  flexShrink: 0,
3290
- height: u,
4084
+ height: c,
3291
4085
  zIndex: 10,
3292
4086
  background: "var(--lucent-surface-default)"
3293
4087
  },
@@ -3330,10 +4124,10 @@ function Mn({
3330
4124
  "aside",
3331
4125
  {
3332
4126
  style: {
3333
- width: f ? 0 : m,
4127
+ width: u ? 0 : y,
3334
4128
  flexShrink: 0,
3335
4129
  overflow: "hidden",
3336
- overflowY: f ? "hidden" : "auto",
4130
+ overflowY: u ? "hidden" : "auto",
3337
4131
  background: "var(--lucent-surface-default)",
3338
4132
  transition: "width 200ms var(--lucent-easing-default)"
3339
4133
  },
@@ -3341,23 +4135,23 @@ function Mn({
3341
4135
  }
3342
4136
  )
3343
4137
  ] }),
3344
- g != null && /* @__PURE__ */ e(
4138
+ m != null && /* @__PURE__ */ e(
3345
4139
  "div",
3346
4140
  {
3347
4141
  style: {
3348
4142
  flexShrink: 0,
3349
- height: k,
4143
+ height: w,
3350
4144
  zIndex: 10,
3351
4145
  background: "var(--lucent-surface-default)"
3352
4146
  },
3353
- children: g
4147
+ children: m
3354
4148
  }
3355
4149
  )
3356
4150
  ]
3357
4151
  }
3358
4152
  );
3359
4153
  }
3360
- function gt({ state: t }) {
4154
+ function Et({ state: t }) {
3361
4155
  return /* @__PURE__ */ h(
3362
4156
  "svg",
3363
4157
  {
@@ -3388,7 +4182,7 @@ function gt({ state: t }) {
3388
4182
  }
3389
4183
  );
3390
4184
  }
3391
- function te({ dir: t }) {
4185
+ function ne({ dir: t }) {
3392
4186
  return /* @__PURE__ */ e("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", "aria-hidden": !0, children: /* @__PURE__ */ e(
3393
4187
  "path",
3394
4188
  {
@@ -3400,7 +4194,7 @@ function te({ dir: t }) {
3400
4194
  }
3401
4195
  ) });
3402
4196
  }
3403
- function zn({
4197
+ function Jn({
3404
4198
  columns: t,
3405
4199
  rows: n,
3406
4200
  pageSize: a = 10,
@@ -3409,21 +4203,21 @@ function zn({
3409
4203
  emptyState: i,
3410
4204
  style: l
3411
4205
  }) {
3412
- const [c, f] = z(null), [g, y] = z(0), [d, s] = z(null), u = o !== void 0, v = u ? o : g, m = c ? [...n].sort((p, C) => {
3413
- const D = p[c.key], w = C[c.key], S = String(D ?? "").localeCompare(String(w ?? ""), void 0, { numeric: !0 });
3414
- return c.dir === "asc" ? S : -S;
3415
- }) : n, k = a > 0 ? m.slice(v * a, (v + 1) * a) : m, b = a > 0 ? Math.max(1, Math.ceil(m.length / a)) : 1, x = (p) => {
3416
- u || y(p), r == null || r(p);
3417
- }, E = (p) => {
3418
- f((C) => !C || C.key !== p ? { key: p, dir: "asc" } : C.dir === "asc" ? { key: p, dir: "desc" } : null), u || y(0), r == null || r(0);
3419
- }, T = [];
3420
- if (b <= 7)
3421
- for (let p = 0; p < b; p++) T.push(p);
4206
+ const [s, u] = M(null), [m, b] = M(0), [d, p] = M(null), c = o !== void 0, v = c ? o : m, y = s ? [...n].sort((f, S) => {
4207
+ const D = f[s.key], T = S[s.key], C = String(D ?? "").localeCompare(String(T ?? ""), void 0, { numeric: !0 });
4208
+ return s.dir === "asc" ? C : -C;
4209
+ }) : n, w = a > 0 ? y.slice(v * a, (v + 1) * a) : y, g = a > 0 ? Math.max(1, Math.ceil(y.length / a)) : 1, x = (f) => {
4210
+ c || b(f), r == null || r(f);
4211
+ }, I = (f) => {
4212
+ u((S) => !S || S.key !== f ? { key: f, dir: "asc" } : S.dir === "asc" ? { key: f, dir: "desc" } : null), c || b(0), r == null || r(0);
4213
+ }, k = [];
4214
+ if (g <= 7)
4215
+ for (let f = 0; f < g; f++) k.push(f);
3422
4216
  else {
3423
- T.push(0), v > 2 && T.push("…");
3424
- for (let p = Math.max(1, v - 1); p <= Math.min(b - 2, v + 1); p++)
3425
- T.push(p);
3426
- v < b - 3 && T.push("…"), T.push(b - 1);
4217
+ k.push(0), v > 2 && k.push("…");
4218
+ for (let f = Math.max(1, v - 1); f <= Math.min(g - 2, v + 1); f++)
4219
+ k.push(f);
4220
+ v < g - 3 && k.push("…"), k.push(g - 1);
3427
4221
  }
3428
4222
  return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-3)", ...l }, children: [
3429
4223
  /* @__PURE__ */ e("div", { style: {
@@ -3436,46 +4230,46 @@ function zn({
3436
4230
  fontFamily: "var(--lucent-font-family-base)",
3437
4231
  fontSize: "var(--lucent-font-size-sm)"
3438
4232
  }, children: [
3439
- /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { style: { borderBottom: "1px solid var(--lucent-border-default)" }, children: t.map((p) => {
3440
- const C = (c == null ? void 0 : c.key) === p.key ? c.dir : "none";
4233
+ /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ e("tr", { style: { borderBottom: "1px solid var(--lucent-border-default)" }, children: t.map((f) => {
4234
+ const S = (s == null ? void 0 : s.key) === f.key ? s.dir : "none";
3441
4235
  return /* @__PURE__ */ e(
3442
4236
  "th",
3443
4237
  {
3444
- onClick: p.sortable ? () => E(p.key) : void 0,
4238
+ onClick: f.sortable ? () => I(f.key) : void 0,
3445
4239
  style: {
3446
4240
  padding: "var(--lucent-space-3) var(--lucent-space-4)",
3447
- textAlign: p.align ?? "left",
4241
+ textAlign: f.align ?? "left",
3448
4242
  fontWeight: "var(--lucent-font-weight-medium)",
3449
4243
  color: "var(--lucent-text-secondary)",
3450
4244
  background: "var(--lucent-bg-subtle)",
3451
- cursor: p.sortable ? "pointer" : "default",
4245
+ cursor: f.sortable ? "pointer" : "default",
3452
4246
  userSelect: "none",
3453
4247
  whiteSpace: "nowrap",
3454
- ...p.width ? { width: p.width } : {}
4248
+ ...f.width ? { width: f.width } : {}
3455
4249
  },
3456
4250
  children: /* @__PURE__ */ h("span", { style: { display: "inline-flex", alignItems: "center", gap: "var(--lucent-space-1)" }, children: [
3457
- p.header,
3458
- p.sortable && /* @__PURE__ */ e(gt, { state: C })
4251
+ f.header,
4252
+ f.sortable && /* @__PURE__ */ e(Et, { state: S })
3459
4253
  ] })
3460
4254
  },
3461
- p.key
4255
+ f.key
3462
4256
  );
3463
4257
  }) }) }),
3464
- /* @__PURE__ */ e("tbody", { children: k.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
4258
+ /* @__PURE__ */ e("tbody", { children: w.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
3465
4259
  "td",
3466
4260
  {
3467
4261
  colSpan: t.length,
3468
4262
  style: { padding: "var(--lucent-space-12)", textAlign: "center" },
3469
- children: i ?? /* @__PURE__ */ e(q, { color: "secondary", children: "No data" })
4263
+ children: i ?? /* @__PURE__ */ e(E, { color: "secondary", children: "No data" })
3470
4264
  }
3471
- ) }) : k.map((p, C) => /* @__PURE__ */ e(
4265
+ ) }) : w.map((f, S) => /* @__PURE__ */ e(
3472
4266
  "tr",
3473
4267
  {
3474
- onMouseEnter: () => s(C),
3475
- onMouseLeave: () => s(null),
4268
+ onMouseEnter: () => p(S),
4269
+ onMouseLeave: () => p(null),
3476
4270
  style: {
3477
- borderBottom: C < k.length - 1 ? "1px solid var(--lucent-border-subtle)" : "none",
3478
- background: d === C ? "var(--lucent-bg-subtle)" : "var(--lucent-surface-default)",
4271
+ borderBottom: S < w.length - 1 ? "1px solid var(--lucent-border-subtle)" : "none",
4272
+ background: d === S ? "var(--lucent-bg-subtle)" : "var(--lucent-surface-default)",
3479
4273
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
3480
4274
  },
3481
4275
  children: t.map((D) => /* @__PURE__ */ e(
@@ -3487,70 +4281,70 @@ function zn({
3487
4281
  textAlign: D.align ?? "left",
3488
4282
  verticalAlign: "middle"
3489
4283
  },
3490
- children: D.render ? D.render(p, C) : String(p[D.key] ?? "")
4284
+ children: D.render ? D.render(f, S) : String(f[D.key] ?? "")
3491
4285
  },
3492
4286
  D.key
3493
4287
  ))
3494
4288
  },
3495
- C
4289
+ S
3496
4290
  )) })
3497
4291
  ] }) }),
3498
- a > 0 && m.length > 0 && /* @__PURE__ */ h("div", { style: {
4292
+ a > 0 && y.length > 0 && /* @__PURE__ */ h("div", { style: {
3499
4293
  display: "flex",
3500
4294
  alignItems: "center",
3501
4295
  justifyContent: "space-between",
3502
4296
  gap: "var(--lucent-space-3)",
3503
4297
  flexWrap: "wrap"
3504
4298
  }, children: [
3505
- /* @__PURE__ */ e(q, { color: "secondary", size: "sm", children: m.length === 1 ? "1 row" : `${v * a + 1}–${Math.min((v + 1) * a, m.length)} of ${m.length} rows` }),
4299
+ /* @__PURE__ */ e(E, { color: "secondary", size: "sm", children: y.length === 1 ? "1 row" : `${v * a + 1}–${Math.min((v + 1) * a, y.length)} of ${y.length} rows` }),
3506
4300
  /* @__PURE__ */ h("div", { style: { display: "flex", alignItems: "center", gap: "var(--lucent-space-1)" }, children: [
3507
4301
  /* @__PURE__ */ e(
3508
- Y,
4302
+ K,
3509
4303
  {
3510
4304
  onClick: () => x(v - 1),
3511
4305
  disabled: v === 0,
3512
4306
  "aria-label": "Previous page",
3513
- children: /* @__PURE__ */ e(te, { dir: "left" })
4307
+ children: /* @__PURE__ */ e(ne, { dir: "left" })
3514
4308
  }
3515
4309
  ),
3516
- T.map(
3517
- (p, C) => p === "…" ? /* @__PURE__ */ e("span", { style: {
4310
+ k.map(
4311
+ (f, S) => f === "…" ? /* @__PURE__ */ e("span", { style: {
3518
4312
  padding: "0 var(--lucent-space-1)",
3519
4313
  color: "var(--lucent-text-disabled)",
3520
4314
  fontSize: "var(--lucent-font-size-sm)"
3521
- }, children: "…" }, `ellipsis-${C}`) : /* @__PURE__ */ e(
3522
- Y,
4315
+ }, children: "…" }, `ellipsis-${S}`) : /* @__PURE__ */ e(
4316
+ K,
3523
4317
  {
3524
- onClick: () => x(p),
3525
- active: p === v,
3526
- "aria-label": `Page ${p + 1}`,
3527
- "aria-current": p === v ? "page" : void 0,
3528
- children: p + 1
4318
+ onClick: () => x(f),
4319
+ active: f === v,
4320
+ "aria-label": `Page ${f + 1}`,
4321
+ "aria-current": f === v ? "page" : void 0,
4322
+ children: f + 1
3529
4323
  },
3530
- p
4324
+ f
3531
4325
  )
3532
4326
  ),
3533
4327
  /* @__PURE__ */ e(
3534
- Y,
4328
+ K,
3535
4329
  {
3536
4330
  onClick: () => x(v + 1),
3537
- disabled: v >= b - 1,
4331
+ disabled: v >= g - 1,
3538
4332
  "aria-label": "Next page",
3539
- children: /* @__PURE__ */ e(te, { dir: "right" })
4333
+ children: /* @__PURE__ */ e(ne, { dir: "right" })
3540
4334
  }
3541
4335
  )
3542
4336
  ] })
3543
4337
  ] })
3544
4338
  ] });
3545
4339
  }
3546
- function Y({
4340
+ function K({
3547
4341
  children: t,
3548
4342
  onClick: n,
3549
4343
  disabled: a,
3550
4344
  active: o,
3551
4345
  ...r
3552
4346
  }) {
3553
- const [i, l] = z(!1);
4347
+ const [i, l] = M(!1);
3554
4348
  return /* @__PURE__ */ e(
3555
4349
  "button",
3556
4350
  {
@@ -3580,7 +4374,7 @@ function Y({
3580
4374
  }
3581
4375
  );
3582
4376
  }
3583
- const En = {
4377
+ const Qn = {
3584
4378
  id: "data-table",
3585
4379
  name: "DataTable",
3586
4380
  tier: "molecule",
@@ -3671,18 +4465,18 @@ const En = {
3671
4465
  keyboardInteractions: ["Tab to pagination controls", "Enter/Space to activate buttons"],
3672
4466
  notes: 'Column headers with sortable:true are interactive buttons with aria-sort reflecting the current sort direction. Pagination buttons include aria-label and aria-current="page" for the active page.'
3673
4467
  }
3674
- }, vt = `
4468
+ }, Dt = `
3675
4469
  @keyframes lucent-palette-in {
3676
4470
  from { opacity: 0; transform: scale(0.96) translateY(-8px); }
3677
4471
  to { opacity: 1; transform: scale(1) translateY(0); }
3678
4472
  }
3679
4473
  `;
3680
- function bt(t, n) {
4474
+ function At(t, n) {
3681
4475
  var o;
3682
4476
  const a = n.toLowerCase();
3683
4477
  return t.label.toLowerCase().includes(a) || (((o = t.description) == null ? void 0 : o.toLowerCase().includes(a)) ?? !1);
3684
4478
  }
3685
- function qn({
4479
+ function Zn({
3686
4480
  commands: t,
3687
4481
  placeholder: n = "Search commands…",
3688
4482
  shortcutKey: a = "k",
@@ -3690,49 +4484,49 @@ function qn({
3690
4484
  onOpenChange: r,
3691
4485
  style: i
3692
4486
  }) {
3693
- const l = o !== void 0, [c, f] = z(!1), g = l ? o : c, [y, d] = z(""), [s, u] = z(0), v = F(null), m = F(null), k = F(!1);
3694
- if (!k.current) {
3695
- const w = document.createElement("style");
3696
- w.textContent = vt, document.head.appendChild(w), k.current = !0;
4487
+ const l = o !== void 0, [s, u] = M(!1), m = l ? o : s, [b, d] = M(""), [p, c] = M(0), v = F(null), y = F(null), w = F(!1);
4488
+ if (!w.current) {
4489
+ const T = document.createElement("style");
4490
+ T.textContent = Dt, document.head.appendChild(T), w.current = !0;
3697
4491
  }
3698
- const b = Q((w) => {
3699
- l || f(w), r == null || r(w);
4492
+ const g = Z((T) => {
4493
+ l || u(T), r == null || r(T);
3700
4494
  }, [l, r]);
3701
- B(() => {
3702
- const w = (S) => {
3703
- (S.metaKey || S.ctrlKey) && S.key === a && (S.preventDefault(), b(!g));
4495
+ L(() => {
4496
+ const T = (C) => {
4497
+ (C.metaKey || C.ctrlKey) && C.key === a && (C.preventDefault(), g(!m));
3704
4498
  };
3705
- return window.addEventListener("keydown", w), () => window.removeEventListener("keydown", w);
3706
- }, [g, a, b]), B(() => {
3707
- g && (d(""), u(0), setTimeout(() => {
3708
- var w;
3709
- return (w = v.current) == null ? void 0 : w.focus();
4499
+ return window.addEventListener("keydown", T), () => window.removeEventListener("keydown", T);
4500
+ }, [m, a, g]), L(() => {
4501
+ m && (d(""), c(0), setTimeout(() => {
4502
+ var T;
4503
+ return (T = v.current) == null ? void 0 : T.focus();
3710
4504
  }, 10));
3711
- }, [g]);
3712
- const x = y ? t.filter((w) => bt(w, y)) : t, E = x.filter((w) => !w.disabled);
3713
- B(() => {
3714
- const w = m.current;
3715
- if (!w) return;
3716
- const S = w.querySelector('[data-active="true"]');
3717
- S == null || S.scrollIntoView({ block: "nearest" });
3718
- }, [s]);
3719
- const T = (w) => {
3720
- w.disabled || (w.onSelect(), b(!1));
3721
- }, p = (w) => {
3722
- if (w.key === "Escape") {
3723
- b(!1);
4505
+ }, [m]);
4506
+ const x = b ? t.filter((T) => At(T, b)) : t, I = x.filter((T) => !T.disabled);
4507
+ L(() => {
4508
+ const T = y.current;
4509
+ if (!T) return;
4510
+ const C = T.querySelector('[data-active="true"]');
4511
+ C == null || C.scrollIntoView({ block: "nearest" });
4512
+ }, [p]);
4513
+ const k = (T) => {
4514
+ T.disabled || (T.onSelect(), g(!1));
4515
+ }, f = (T) => {
4516
+ if (T.key === "Escape") {
4517
+ g(!1);
3724
4518
  return;
3725
4519
  }
3726
- if (w.key === "ArrowDown" && (w.preventDefault(), u((S) => Math.min(S + 1, E.length - 1))), w.key === "ArrowUp" && (w.preventDefault(), u((S) => Math.max(S - 1, 0))), w.key === "Enter") {
3727
- const S = E[s];
3728
- S && T(S);
4520
+ if (T.key === "ArrowDown" && (T.preventDefault(), c((C) => Math.min(C + 1, I.length - 1))), T.key === "ArrowUp" && (T.preventDefault(), c((C) => Math.max(C - 1, 0))), T.key === "Enter") {
4521
+ const C = I[p];
4522
+ C && k(C);
3729
4523
  }
3730
- }, C = [];
3731
- for (const w of x) {
3732
- const S = C[C.length - 1];
3733
- S && S.group === w.group ? S.items.push(w) : C.push({ group: w.group, items: [w] });
4524
+ }, S = [];
4525
+ for (const T of x) {
4526
+ const C = S[S.length - 1];
4527
+ C && C.group === T.group ? C.items.push(T) : S.push({ group: T.group, items: [T] });
3734
4528
  }
3735
- if (!g) return null;
4529
+ if (!m) return null;
3736
4530
  let D = 0;
3737
4531
  return /* @__PURE__ */ e(
3738
4532
  "div",
@@ -3740,7 +4534,7 @@ function qn({
3740
4534
  role: "dialog",
3741
4535
  "aria-label": "Command palette",
3742
4536
  "aria-modal": "true",
3743
- onClick: () => b(!1),
4537
+ onClick: () => g(!1),
3744
4538
  style: {
3745
4539
  position: "fixed",
3746
4540
  inset: 0,
@@ -3758,7 +4552,7 @@ function qn({
3758
4552
  role: "combobox",
3759
4553
  "aria-haspopup": "listbox",
3760
4554
  "aria-expanded": "true",
3761
- onClick: (w) => w.stopPropagation(),
4555
+ onClick: (T) => T.stopPropagation(),
3762
4556
  style: {
3763
4557
  width: "100%",
3764
4558
  maxWidth: 560,
@@ -3789,11 +4583,11 @@ function qn({
3789
4583
  role: "searchbox",
3790
4584
  "aria-autocomplete": "list",
3791
4585
  "aria-controls": "lucent-command-list",
3792
- value: y,
3793
- onChange: (w) => {
3794
- d(w.target.value), u(0);
4586
+ value: b,
4587
+ onChange: (T) => {
4588
+ d(T.target.value), c(0);
3795
4589
  },
3796
- onKeyDown: p,
4590
+ onKeyDown: f,
3797
4591
  placeholder: n,
3798
4592
  style: {
3799
4593
  flex: 1,
@@ -3824,32 +4618,32 @@ function qn({
3824
4618
  {
3825
4619
  id: "lucent-command-list",
3826
4620
  role: "listbox",
3827
- ref: m,
4621
+ ref: y,
3828
4622
  style: { maxHeight: 360, overflowY: "auto", padding: "var(--lucent-space-1) 0" },
3829
- children: x.length === 0 ? /* @__PURE__ */ e("div", { style: { padding: "var(--lucent-space-8)", textAlign: "center" }, children: /* @__PURE__ */ h(q, { color: "secondary", children: [
4623
+ children: x.length === 0 ? /* @__PURE__ */ e("div", { style: { padding: "var(--lucent-space-8)", textAlign: "center" }, children: /* @__PURE__ */ h(E, { color: "secondary", children: [
3830
4624
  'No results for "',
3831
- y,
4625
+ b,
3832
4626
  '"'
3833
- ] }) }) : C.map(({ group: w, items: S }, P) => /* @__PURE__ */ h("div", { children: [
3834
- w && /* @__PURE__ */ e("div", { style: {
4627
+ ] }) }) : S.map(({ group: T, items: C }, P) => /* @__PURE__ */ h("div", { children: [
4628
+ T && /* @__PURE__ */ e("div", { style: {
3835
4629
  padding: "var(--lucent-space-2) var(--lucent-space-4) var(--lucent-space-1)",
3836
4630
  ...P > 0 ? { borderTop: "1px solid var(--lucent-border-subtle)", marginTop: "var(--lucent-space-1)" } : {}
3837
- }, children: /* @__PURE__ */ e(q, { size: "xs", color: "secondary", weight: "medium", children: w }) }),
3838
- S.map((N) => {
3839
- const $ = N.disabled ?? !1;
3840
- let I = !1;
3841
- return $ || (I = D === s, D++), /* @__PURE__ */ h(
4631
+ }, children: /* @__PURE__ */ e(E, { size: "xs", color: "secondary", weight: "medium", children: T }) }),
4632
+ C.map((B) => {
4633
+ const $ = B.disabled ?? !1;
4634
+ let z = !1;
4635
+ return $ || (z = D === p, D++), /* @__PURE__ */ h(
3842
4636
  "div",
3843
4637
  {
3844
4638
  role: "option",
3845
- "aria-selected": I,
4639
+ "aria-selected": z,
3846
4640
  "aria-disabled": $,
3847
- "data-active": I,
3848
- onClick: () => T(N),
4641
+ "data-active": z,
4642
+ onClick: () => k(B),
3849
4643
  onMouseEnter: () => {
3850
4644
  if (!$) {
3851
- const M = E.indexOf(N);
3852
- M !== -1 && u(M);
4645
+ const q = I.indexOf(B);
4646
+ q !== -1 && c(q);
3853
4647
  }
3854
4648
  },
3855
4649
  style: {
@@ -3858,19 +4652,19 @@ function qn({
3858
4652
  gap: "var(--lucent-space-3)",
3859
4653
  padding: "var(--lucent-space-2) var(--lucent-space-4)",
3860
4654
  cursor: $ ? "not-allowed" : "pointer",
3861
- background: I ? "var(--lucent-bg-muted)" : "transparent",
4655
+ background: z ? "var(--lucent-bg-muted)" : "transparent",
3862
4656
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)",
3863
4657
  opacity: $ ? 0.5 : 1
3864
4658
  },
3865
4659
  children: [
3866
- N.icon && /* @__PURE__ */ e("span", { style: { flexShrink: 0, color: "var(--lucent-text-secondary)", display: "flex" }, children: N.icon }),
4660
+ B.icon && /* @__PURE__ */ e("span", { style: { flexShrink: 0, color: "var(--lucent-text-secondary)", display: "flex" }, children: B.icon }),
3867
4661
  /* @__PURE__ */ h("div", { style: { flex: 1, minWidth: 0 }, children: [
3868
- /* @__PURE__ */ e(q, { size: "sm", weight: "medium", truncate: !0, children: N.label }),
3869
- N.description && /* @__PURE__ */ e(q, { size: "xs", color: "secondary", truncate: !0, children: N.description })
4662
+ /* @__PURE__ */ e(E, { size: "sm", weight: "medium", truncate: !0, children: B.label }),
4663
+ B.description && /* @__PURE__ */ e(E, { size: "xs", color: "secondary", truncate: !0, children: B.description })
3870
4664
  ] })
3871
4665
  ]
3872
4666
  },
3873
- N.id
4667
+ B.id
3874
4668
  );
3875
4669
  })
3876
4670
  ] }, P))
@@ -3886,7 +4680,7 @@ function qn({
3886
4680
  ["↑↓", "Navigate"],
3887
4681
  ["↵", "Select"],
3888
4682
  ["Esc", "Close"]
3889
- ].map(([w, S]) => /* @__PURE__ */ h("span", { style: { display: "flex", alignItems: "center", gap: "var(--lucent-space-1)" }, children: [
4683
+ ].map(([T, C]) => /* @__PURE__ */ h("span", { style: { display: "flex", alignItems: "center", gap: "var(--lucent-space-1)" }, children: [
3890
4684
  /* @__PURE__ */ e("kbd", { style: {
3891
4685
  padding: "1px 5px",
3892
4686
  borderRadius: "var(--lucent-radius-sm)",
@@ -3895,16 +4689,16 @@ function qn({
3895
4689
  fontFamily: "var(--lucent-font-family-mono)",
3896
4690
  fontSize: "var(--lucent-font-size-xs)",
3897
4691
  color: "var(--lucent-text-secondary)"
3898
- }, children: w }),
3899
- /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: S })
3900
- ] }, w)) })
4692
+ }, children: T }),
4693
+ /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: C })
4694
+ ] }, T)) })
3901
4695
  ]
3902
4696
  }
3903
4697
  )
3904
4698
  }
3905
4699
  );
3906
4700
  }
3907
- const Dn = {
4701
+ const ea = {
3908
4702
  id: "command-palette",
3909
4703
  name: "CommandPalette",
3910
4704
  tier: "overlay",
@@ -3987,7 +4781,7 @@ const Dn = {
3987
4781
  notes: 'The backdrop and panel use role="dialog" with aria-modal="true". The input is role="searchbox". The result list is role="listbox" with role="option" items. Focus is moved to the search input on open.'
3988
4782
  }
3989
4783
  };
3990
- function yt({ label: t, onRemove: n, disabled: a }) {
4784
+ function Ft({ label: t, onRemove: n, disabled: a }) {
3991
4785
  return /* @__PURE__ */ h("span", { style: {
3992
4786
  display: "inline-flex",
3993
4787
  alignItems: "center",
@@ -4029,7 +4823,7 @@ function yt({ label: t, onRemove: n, disabled: a }) {
4029
4823
  )
4030
4824
  ] });
4031
4825
  }
4032
- function An({
4826
+ function ta({
4033
4827
  options: t,
4034
4828
  value: n,
4035
4829
  defaultValue: a = [],
@@ -4037,44 +4831,44 @@ function An({
4037
4831
  placeholder: r = "Select…",
4038
4832
  disabled: i = !1,
4039
4833
  max: l,
4040
- style: c
4834
+ style: s
4041
4835
  }) {
4042
- const f = n !== void 0, [g, y] = z(a), d = f ? n : g, [s, u] = z(!1), [v, m] = z(""), [k, b] = z(0), [x, E] = z(!1), T = F(null), p = F(null), C = le();
4043
- B(() => {
4044
- if (!s) return;
4045
- const I = (M) => {
4836
+ const u = n !== void 0, [m, b] = M(a), d = u ? n : m, [p, c] = M(!1), [v, y] = M(""), [w, g] = M(0), [x, I] = M(!1), k = F(null), f = F(null), S = ce();
4837
+ L(() => {
4838
+ if (!p) return;
4839
+ const z = (q) => {
4046
4840
  var R;
4047
- (R = T.current) != null && R.contains(M.target) || (u(!1), m(""));
4841
+ (R = k.current) != null && R.contains(q.target) || (c(!1), y(""));
4048
4842
  };
4049
- return document.addEventListener("mousedown", I), () => document.removeEventListener("mousedown", I);
4050
- }, [s]);
4051
- const D = (I) => {
4052
- const M = d.includes(I) ? d.filter((R) => R !== I) : l !== void 0 && d.length >= l ? d : [...d, I];
4053
- f || y(M), o == null || o(M);
4054
- }, w = (I) => {
4055
- const M = d.filter((R) => R !== I);
4056
- f || y(M), o == null || o(M);
4057
- }, S = t.filter(
4058
- (I) => I.label.toLowerCase().includes(v.toLowerCase())
4059
- ), P = (I) => {
4060
- if (I.key === "Escape") {
4061
- u(!1), m("");
4843
+ return document.addEventListener("mousedown", z), () => document.removeEventListener("mousedown", z);
4844
+ }, [p]);
4845
+ const D = (z) => {
4846
+ const q = d.includes(z) ? d.filter((R) => R !== z) : l !== void 0 && d.length >= l ? d : [...d, z];
4847
+ u || b(q), o == null || o(q);
4848
+ }, T = (z) => {
4849
+ const q = d.filter((R) => R !== z);
4850
+ u || b(q), o == null || o(q);
4851
+ }, C = t.filter(
4852
+ (z) => z.label.toLowerCase().includes(v.toLowerCase())
4853
+ ), P = (z) => {
4854
+ if (z.key === "Escape") {
4855
+ c(!1), y("");
4062
4856
  return;
4063
4857
  }
4064
- if (I.key === "ArrowDown" && (I.preventDefault(), u(!0), b((M) => Math.min(M + 1, S.length - 1))), I.key === "ArrowUp" && (I.preventDefault(), b((M) => Math.max(M - 1, 0))), I.key === "Enter") {
4065
- I.preventDefault();
4066
- const M = S[k];
4067
- M && !M.disabled && D(M.value);
4858
+ if (z.key === "ArrowDown" && (z.preventDefault(), c(!0), g((q) => Math.min(q + 1, C.length - 1))), z.key === "ArrowUp" && (z.preventDefault(), g((q) => Math.max(q - 1, 0))), z.key === "Enter") {
4859
+ z.preventDefault();
4860
+ const q = C[w];
4861
+ q && !q.disabled && D(q.value);
4068
4862
  }
4069
- I.key === "Backspace" && v === "" && d.length > 0 && w(d[d.length - 1]);
4070
- }, N = l !== void 0 && d.length >= l, $ = i ? "var(--lucent-border-default)" : x ? "var(--lucent-accent-default)" : "var(--lucent-border-default)";
4071
- return /* @__PURE__ */ h("div", { ref: T, style: { position: "relative", ...c }, children: [
4863
+ z.key === "Backspace" && v === "" && d.length > 0 && T(d[d.length - 1]);
4864
+ }, B = l !== void 0 && d.length >= l, $ = i ? "var(--lucent-border-default)" : x ? "var(--lucent-accent-default)" : "var(--lucent-border-default)";
4865
+ return /* @__PURE__ */ h("div", { ref: k, style: { position: "relative", ...s }, children: [
4072
4866
  /* @__PURE__ */ h(
4073
4867
  "div",
4074
4868
  {
4075
4869
  onClick: () => {
4076
- var I;
4077
- i || (u(!0), (I = p.current) == null || I.focus());
4870
+ var z;
4871
+ i || (c(!0), (z = f.current) == null || z.focus());
4078
4872
  },
4079
4873
  style: {
4080
4874
  display: "flex",
@@ -4092,26 +4886,26 @@ function An({
4092
4886
  outlineOffset: 2
4093
4887
  },
4094
4888
  children: [
4095
- d.map((I) => {
4096
- const M = t.find((R) => R.value === I);
4097
- return M ? /* @__PURE__ */ e(yt, { label: M.label, onRemove: () => w(I), disabled: i }, I) : null;
4889
+ d.map((z) => {
4890
+ const q = t.find((R) => R.value === z);
4891
+ return q ? /* @__PURE__ */ e(Ft, { label: q.label, onRemove: () => T(z), disabled: i }, z) : null;
4098
4892
  }),
4099
4893
  /* @__PURE__ */ e(
4100
4894
  "input",
4101
4895
  {
4102
- ref: p,
4896
+ ref: f,
4103
4897
  value: v,
4104
- onChange: (I) => {
4105
- m(I.target.value), u(!0), b(0);
4898
+ onChange: (z) => {
4899
+ y(z.target.value), c(!0), g(0);
4106
4900
  },
4107
4901
  onKeyDown: P,
4108
- onFocus: () => E(!0),
4109
- onBlur: () => E(!1),
4902
+ onFocus: () => I(!0),
4903
+ onBlur: () => I(!1),
4110
4904
  disabled: i,
4111
4905
  placeholder: d.length === 0 ? r : "",
4112
4906
  "aria-autocomplete": "list",
4113
- "aria-controls": C,
4114
- "aria-expanded": s,
4907
+ "aria-controls": S,
4908
+ "aria-expanded": p,
4115
4909
  role: "combobox",
4116
4910
  style: {
4117
4911
  flex: "1 1 80px",
@@ -4130,10 +4924,10 @@ function An({
4130
4924
  ]
4131
4925
  }
4132
4926
  ),
4133
- s && !i && /* @__PURE__ */ h(
4927
+ p && !i && /* @__PURE__ */ h(
4134
4928
  "div",
4135
4929
  {
4136
- id: C,
4930
+ id: S,
4137
4931
  role: "listbox",
4138
4932
  "aria-multiselectable": "true",
4139
4933
  style: {
@@ -4151,50 +4945,49 @@ function An({
4151
4945
  padding: "var(--lucent-space-1) 0"
4152
4946
  },
4153
4947
  children: [
4154
- S.length === 0 ? /* @__PURE__ */ e("div", { style: { padding: "var(--lucent-space-3) var(--lucent-space-4)" }, children: /* @__PURE__ */ e(q, { color: "secondary", size: "sm", children: "No options" }) }) : S.map((I, M) => {
4155
- const R = d.includes(I.value), O = M === k, W = I.disabled ?? !1, U = N && !R;
4948
+ C.length === 0 ? /* @__PURE__ */ e("div", { style: { padding: "var(--lucent-space-3) var(--lucent-space-4)" }, children: /* @__PURE__ */ e(E, { color: "secondary", size: "sm", children: "No options" }) }) : C.map((z, q) => {
4949
+ const R = d.includes(z.value), O = q === w, V = z.disabled ?? !1, H = B && !R;
4156
4950
  return /* @__PURE__ */ h(
4157
4951
  "div",
4158
4952
  {
4159
4953
  role: "option",
4160
4954
  "aria-selected": R,
4161
- "aria-disabled": W || U,
4955
+ "aria-disabled": V || H,
4162
4956
  onClick: () => {
4163
- !W && !U && D(I.value);
4957
+ !V && !H && D(z.value);
4164
4958
  },
4165
- onMouseEnter: () => b(M),
4959
+ onMouseEnter: () => g(q),
4166
4960
  style: {
4167
4961
  display: "flex",
4168
4962
  alignItems: "center",
4169
4963
  gap: "var(--lucent-space-2)",
4170
4964
  padding: "var(--lucent-space-2) var(--lucent-space-3)",
4171
- cursor: W || U ? "not-allowed" : "pointer",
4965
+ cursor: V || H ? "not-allowed" : "pointer",
4172
4966
  background: O ? "var(--lucent-bg-subtle)" : "transparent",
4173
- opacity: W || U ? 0.5 : 1
4967
+ opacity: V || H ? 0.5 : 1
4174
4968
  },
4175
4969
  children: [
4176
- /* @__PURE__ */ e("span", { style: {
4177
- flexShrink: 0,
4178
- width: 16,
4179
- height: 16,
4180
- borderRadius: "var(--lucent-radius-sm)",
4181
- border: `1.5px solid ${R ? "var(--lucent-accent-default)" : "var(--lucent-border-strong)"}`,
4182
- background: R ? "var(--lucent-accent-default)" : "transparent",
4183
- display: "flex",
4184
- alignItems: "center",
4185
- justifyContent: "center",
4186
- transition: "background var(--lucent-duration-fast), border-color var(--lucent-duration-fast)"
4187
- }, children: R && /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M2 5l2.5 2.5L8 3", stroke: "var(--lucent-text-on-accent)", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) }),
4188
- /* @__PURE__ */ e(q, { size: "sm", children: I.label })
4970
+ /* @__PURE__ */ e(
4971
+ ue,
4972
+ {
4973
+ checked: R,
4974
+ disabled: V || H,
4975
+ size: "md",
4976
+ style: { margin: 0, pointerEvents: "none" },
4977
+ "aria-hidden": !0,
4978
+ readOnly: !0
4979
+ }
4980
+ ),
4981
+ /* @__PURE__ */ e(E, { size: "sm", children: z.label })
4189
4982
  ]
4190
4983
  },
4191
- I.value
4984
+ z.value
4192
4985
  );
4193
4986
  }),
4194
- N && /* @__PURE__ */ e("div", { style: {
4987
+ B && /* @__PURE__ */ e("div", { style: {
4195
4988
  padding: "var(--lucent-space-2) var(--lucent-space-3)",
4196
4989
  borderTop: "1px solid var(--lucent-border-subtle)"
4197
- }, children: /* @__PURE__ */ h(q, { size: "xs", color: "secondary", children: [
4990
+ }, children: /* @__PURE__ */ h(E, { size: "xs", color: "secondary", children: [
4198
4991
  "Max ",
4199
4992
  l,
4200
4993
  " selected"
@@ -4204,7 +4997,7 @@ function An({
4204
4997
  )
4205
4998
  ] });
4206
4999
  }
4207
- const Fn = {
5000
+ const na = {
4208
5001
  id: "multi-select",
4209
5002
  name: "MultiSelect",
4210
5003
  tier: "molecule",
@@ -4299,22 +5092,22 @@ const Fn = {
4299
5092
  notes: 'The input carries role="combobox" with aria-expanded and aria-controls pointing to the listbox. Each option has role="option" with aria-selected. Remove buttons on tags have descriptive aria-label.'
4300
5093
  }
4301
5094
  };
4302
- function xt(t, n) {
5095
+ function Bt(t, n) {
4303
5096
  return new Date(t, n + 1, 0).getDate();
4304
5097
  }
4305
- function wt(t, n) {
5098
+ function Rt(t, n) {
4306
5099
  return new Date(t, n, 1).getDay();
4307
5100
  }
4308
- function _(t, n) {
5101
+ function Y(t, n) {
4309
5102
  return t.getFullYear() === n.getFullYear() && t.getMonth() === n.getMonth() && t.getDate() === n.getDate();
4310
5103
  }
4311
- function K(t, n) {
5104
+ function X(t, n) {
4312
5105
  return new Date(t.getFullYear(), t.getMonth(), t.getDate()) < new Date(n.getFullYear(), n.getMonth(), n.getDate());
4313
5106
  }
4314
- function ne(t, n) {
5107
+ function ae(t, n) {
4315
5108
  return new Date(t.getFullYear(), t.getMonth(), t.getDate()) > new Date(n.getFullYear(), n.getMonth(), n.getDate());
4316
5109
  }
4317
- const kt = [
5110
+ const Nt = [
4318
5111
  "January",
4319
5112
  "February",
4320
5113
  "March",
@@ -4327,12 +5120,12 @@ const kt = [
4327
5120
  "October",
4328
5121
  "November",
4329
5122
  "December"
4330
- ], St = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
5123
+ ], Lt = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
4331
5124
  function j(t) {
4332
5125
  return `${t.getFullYear()}-${String(t.getMonth() + 1).padStart(2, "0")}-${String(t.getDate()).padStart(2, "0")}`;
4333
5126
  }
4334
- function ae({ dir: t, onClick: n, disabled: a }) {
4335
- const [o, r] = z(!1);
5127
+ function re({ dir: t, onClick: n, disabled: a }) {
5128
+ const [o, r] = M(!1);
4336
5129
  return /* @__PURE__ */ e(
4337
5130
  "button",
4338
5131
  {
@@ -4368,7 +5161,7 @@ function ae({ dir: t, onClick: n, disabled: a }) {
4368
5161
  }
4369
5162
  );
4370
5163
  }
4371
- function X({
5164
+ function J({
4372
5165
  year: t,
4373
5166
  month: n,
4374
5167
  selected: a,
@@ -4376,39 +5169,39 @@ function X({
4376
5169
  min: r,
4377
5170
  max: i,
4378
5171
  onSelect: l,
4379
- onPrevMonth: c,
4380
- onNextMonth: f,
4381
- highlightRange: g
5172
+ onPrevMonth: s,
5173
+ onNextMonth: u,
5174
+ highlightRange: m
4382
5175
  }) {
4383
- const y = xt(t, n), d = wt(t, n), [s, u] = z(null), v = [
5176
+ const b = Bt(t, n), d = Rt(t, n), [p, c] = M(null), v = [
4384
5177
  ...Array(d).fill(null),
4385
- ...Array.from({ length: y }, (m, k) => k + 1)
5178
+ ...Array.from({ length: b }, (y, w) => w + 1)
4386
5179
  ];
4387
5180
  for (; v.length % 7 !== 0; ) v.push(null);
4388
5181
  return /* @__PURE__ */ h("div", { children: [
4389
5182
  /* @__PURE__ */ h("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", marginBottom: "var(--lucent-space-3)" }, children: [
4390
- /* @__PURE__ */ e(ae, { dir: "prev", onClick: c }),
4391
- /* @__PURE__ */ h(q, { weight: "medium", size: "sm", children: [
4392
- kt[n],
5183
+ /* @__PURE__ */ e(re, { dir: "prev", onClick: s }),
5184
+ /* @__PURE__ */ h(E, { weight: "medium", size: "sm", children: [
5185
+ Nt[n],
4393
5186
  " ",
4394
5187
  t
4395
5188
  ] }),
4396
- /* @__PURE__ */ e(ae, { dir: "next", onClick: f })
5189
+ /* @__PURE__ */ e(re, { dir: "next", onClick: u })
4397
5190
  ] }),
4398
- /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2, marginBottom: "var(--lucent-space-1)" }, children: St.map((m) => /* @__PURE__ */ e("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: m }) }, m)) }),
4399
- /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2 }, children: v.map((m, k) => {
4400
- if (!m) return /* @__PURE__ */ e("div", {}, k);
4401
- const b = new Date(t, n, m), x = a ? _(b, a) : !1, E = _(b, o), T = (r ? K(b, r) : !1) || (i ? ne(b, i) : !1);
4402
- let p = !1;
4403
- return g != null && g.start && (g != null && g.end) && (p = !K(b, g.start) && !ne(b, g.end)), /* @__PURE__ */ e(
5191
+ /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2, marginBottom: "var(--lucent-space-1)" }, children: Lt.map((y) => /* @__PURE__ */ e("div", { style: { textAlign: "center" }, children: /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: y }) }, y)) }),
5192
+ /* @__PURE__ */ e("div", { style: { display: "grid", gridTemplateColumns: "repeat(7, 1fr)", gap: 2 }, children: v.map((y, w) => {
5193
+ if (!y) return /* @__PURE__ */ e("div", {}, w);
5194
+ const g = new Date(t, n, y), x = a ? Y(g, a) : !1, I = Y(g, o), k = (r ? X(g, r) : !1) || (i ? ae(g, i) : !1);
5195
+ let f = !1;
5196
+ return m != null && m.start && (m != null && m.end) && (f = !X(g, m.start) && !ae(g, m.end)), /* @__PURE__ */ e(
4404
5197
  "button",
4405
5198
  {
4406
5199
  type: "button",
4407
- disabled: T,
4408
- onClick: () => !T && l(b),
4409
- onMouseEnter: () => u(m),
4410
- onMouseLeave: () => u(null),
4411
- "aria-label": j(b),
5200
+ disabled: k,
5201
+ onClick: () => !k && l(g),
5202
+ onMouseEnter: () => c(y),
5203
+ onMouseLeave: () => c(null),
5204
+ "aria-label": j(g),
4412
5205
  "aria-pressed": x,
4413
5206
  style: {
4414
5207
  display: "flex",
@@ -4416,24 +5209,24 @@ function X({
4416
5209
  justifyContent: "center",
4417
5210
  height: 32,
4418
5211
  width: "100%",
4419
- border: E && !x ? "1px solid var(--lucent-border-strong)" : "1px solid transparent",
5212
+ border: I && !x ? "1px solid var(--lucent-border-strong)" : "1px solid transparent",
4420
5213
  borderRadius: "var(--lucent-radius-md)",
4421
- background: x ? "var(--lucent-accent-default)" : p ? "var(--lucent-accent-subtle)" : s === m && !T ? "var(--lucent-bg-muted)" : "transparent",
4422
- color: x ? "var(--lucent-text-on-accent)" : T ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
5214
+ background: x ? "var(--lucent-accent-default)" : f ? "var(--lucent-accent-subtle)" : p === y && !k ? "var(--lucent-bg-muted)" : "transparent",
5215
+ color: x ? "var(--lucent-text-on-accent)" : k ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
4423
5216
  fontSize: "var(--lucent-font-size-sm)",
4424
5217
  fontFamily: "var(--lucent-font-family-base)",
4425
- fontWeight: E ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
4426
- cursor: T ? "not-allowed" : "pointer",
5218
+ fontWeight: I ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
5219
+ cursor: k ? "not-allowed" : "pointer",
4427
5220
  transition: "background var(--lucent-duration-fast)"
4428
5221
  },
4429
- children: m
5222
+ children: y
4430
5223
  },
4431
- k
5224
+ w
4432
5225
  );
4433
5226
  }) })
4434
5227
  ] });
4435
5228
  }
4436
- function Nn({
5229
+ function aa({
4437
5230
  value: t,
4438
5231
  defaultValue: n,
4439
5232
  onChange: a,
@@ -4441,48 +5234,48 @@ function Nn({
4441
5234
  disabled: r = !1,
4442
5235
  min: i,
4443
5236
  max: l,
4444
- style: c
5237
+ style: s
4445
5238
  }) {
4446
- const f = t !== void 0, [g, y] = z(n), d = f ? t : g, s = /* @__PURE__ */ new Date(), [u, v] = z((d ?? s).getFullYear()), [m, k] = z((d ?? s).getMonth()), [b, x] = z(!1), [E, T] = z(!1), p = F(null);
4447
- B(() => {
4448
- if (!b) return;
4449
- const S = (P) => {
4450
- var N;
4451
- (N = p.current) != null && N.contains(P.target) || x(!1);
5239
+ const u = t !== void 0, [m, b] = M(n), d = u ? t : m, p = /* @__PURE__ */ new Date(), [c, v] = M((d ?? p).getFullYear()), [y, w] = M((d ?? p).getMonth()), [g, x] = M(!1), [I, k] = M(!1), f = F(null);
5240
+ L(() => {
5241
+ if (!g) return;
5242
+ const C = (P) => {
5243
+ var B;
5244
+ (B = f.current) != null && B.contains(P.target) || x(!1);
4452
5245
  };
4453
- return document.addEventListener("mousedown", S), () => document.removeEventListener("mousedown", S);
4454
- }, [b]);
4455
- const C = (S) => {
4456
- f || y(S), a == null || a(S), x(!1);
5246
+ return document.addEventListener("mousedown", C), () => document.removeEventListener("mousedown", C);
5247
+ }, [g]);
5248
+ const S = (C) => {
5249
+ u || b(C), a == null || a(C), x(!1);
4457
5250
  }, D = () => {
4458
- m === 0 ? (k(11), v((S) => S - 1)) : k((S) => S - 1);
4459
- }, w = () => {
4460
- m === 11 ? (k(0), v((S) => S + 1)) : k((S) => S + 1);
5251
+ y === 0 ? (w(11), v((C) => C - 1)) : w((C) => C - 1);
5252
+ }, T = () => {
5253
+ y === 11 ? (w(0), v((C) => C + 1)) : w((C) => C + 1);
4461
5254
  };
4462
- return /* @__PURE__ */ h("div", { ref: p, style: { position: "relative", display: "inline-block", ...c }, children: [
5255
+ return /* @__PURE__ */ h("div", { ref: f, style: { position: "relative", display: "inline-block", ...s }, children: [
4463
5256
  /* @__PURE__ */ h(
4464
5257
  "button",
4465
5258
  {
4466
5259
  type: "button",
4467
5260
  disabled: r,
4468
- onClick: () => !r && x((S) => !S),
4469
- onFocus: () => T(!0),
4470
- onBlur: () => T(!1),
5261
+ onClick: () => !r && x((C) => !C),
5262
+ onFocus: () => k(!0),
5263
+ onBlur: () => k(!1),
4471
5264
  "aria-haspopup": "dialog",
4472
- "aria-expanded": b,
5265
+ "aria-expanded": g,
4473
5266
  style: {
4474
5267
  display: "inline-flex",
4475
5268
  alignItems: "center",
4476
5269
  gap: "var(--lucent-space-2)",
4477
5270
  padding: "var(--lucent-space-2) var(--lucent-space-3)",
4478
5271
  borderRadius: "var(--lucent-radius-md)",
4479
- border: `1px solid ${E ? "var(--lucent-accent-default)" : "var(--lucent-border-default)"}`,
5272
+ border: `1px solid ${I ? "var(--lucent-accent-default)" : "var(--lucent-border-default)"}`,
4480
5273
  background: r ? "var(--lucent-bg-muted)" : "var(--lucent-surface-default)",
4481
5274
  color: d ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
4482
5275
  fontFamily: "var(--lucent-font-family-base)",
4483
5276
  fontSize: "var(--lucent-font-size-sm)",
4484
5277
  cursor: r ? "not-allowed" : "pointer",
4485
- outline: E ? "2px solid var(--lucent-focus-ring)" : "none",
5278
+ outline: I ? "2px solid var(--lucent-focus-ring)" : "none",
4486
5279
  outlineOffset: 2,
4487
5280
  minWidth: 160,
4488
5281
  transition: "border-color var(--lucent-duration-fast)"
@@ -4497,7 +5290,7 @@ function Nn({
4497
5290
  ]
4498
5291
  }
4499
5292
  ),
4500
- b && /* @__PURE__ */ e(
5293
+ g && /* @__PURE__ */ e(
4501
5294
  "div",
4502
5295
  {
4503
5296
  role: "dialog",
@@ -4515,24 +5308,24 @@ function Nn({
4515
5308
  minWidth: 260
4516
5309
  },
4517
5310
  children: /* @__PURE__ */ e(
4518
- X,
5311
+ J,
4519
5312
  {
4520
- year: u,
4521
- month: m,
5313
+ year: c,
5314
+ month: y,
4522
5315
  ...d !== void 0 && { selected: d },
4523
- today: s,
5316
+ today: p,
4524
5317
  ...i !== void 0 && { min: i },
4525
5318
  ...l !== void 0 && { max: l },
4526
- onSelect: C,
5319
+ onSelect: S,
4527
5320
  onPrevMonth: D,
4528
- onNextMonth: w
5321
+ onNextMonth: T
4529
5322
  }
4530
5323
  )
4531
5324
  }
4532
5325
  )
4533
5326
  ] });
4534
5327
  }
4535
- const Rn = {
5328
+ const ra = {
4536
5329
  id: "date-picker",
4537
5330
  name: "DatePicker",
4538
5331
  tier: "molecule",
@@ -4618,10 +5411,10 @@ const Rn = {
4618
5411
  notes: 'The calendar popover is role="dialog". Each day button has aria-label with the full date and aria-pressed for selected state. Full arrow-key navigation within the calendar grid is a planned enhancement.'
4619
5412
  }
4620
5413
  };
4621
- function Tt(t, n) {
4622
- return t ? _(t.start, t.end) ? j(t.start) : `${j(t.start)} → ${j(t.end)}` : n;
5414
+ function $t(t, n) {
5415
+ return t ? Y(t.start, t.end) ? j(t.start) : `${j(t.start)} → ${j(t.end)}` : n;
4623
5416
  }
4624
- function Ln({
5417
+ function oa({
4625
5418
  value: t,
4626
5419
  defaultValue: n,
4627
5420
  onChange: a,
@@ -4629,40 +5422,40 @@ function Ln({
4629
5422
  disabled: r = !1,
4630
5423
  min: i,
4631
5424
  max: l,
4632
- style: c
5425
+ style: s
4633
5426
  }) {
4634
- const f = t !== void 0, [g, y] = z(n), d = f ? t : g, [s, u] = z(null), v = /* @__PURE__ */ new Date(), [m, k] = z(((d == null ? void 0 : d.start) ?? v).getFullYear()), [b, x] = z(((d == null ? void 0 : d.start) ?? v).getMonth()), E = b === 11 ? 0 : b + 1, T = b === 11 ? m + 1 : m, [p, C] = z(!1), [D, w] = z(!1), S = F(null);
4635
- B(() => {
4636
- if (!p) return;
4637
- const M = (R) => {
5427
+ const u = t !== void 0, [m, b] = M(n), d = u ? t : m, [p, c] = M(null), v = /* @__PURE__ */ new Date(), [y, w] = M(((d == null ? void 0 : d.start) ?? v).getFullYear()), [g, x] = M(((d == null ? void 0 : d.start) ?? v).getMonth()), I = g === 11 ? 0 : g + 1, k = g === 11 ? y + 1 : y, [f, S] = M(!1), [D, T] = M(!1), C = F(null);
5428
+ L(() => {
5429
+ if (!f) return;
5430
+ const q = (R) => {
4638
5431
  var O;
4639
- (O = S.current) != null && O.contains(R.target) || (C(!1), u(null));
5432
+ (O = C.current) != null && O.contains(R.target) || (S(!1), c(null));
4640
5433
  };
4641
- return document.addEventListener("mousedown", M), () => document.removeEventListener("mousedown", M);
4642
- }, [p]);
4643
- const P = (M) => {
4644
- if (!s)
4645
- u(M);
5434
+ return document.addEventListener("mousedown", q), () => document.removeEventListener("mousedown", q);
5435
+ }, [f]);
5436
+ const P = (q) => {
5437
+ if (!p)
5438
+ c(q);
4646
5439
  else {
4647
- const [R, O] = K(M, s) || _(M, s) ? [M, s] : [s, M], W = { start: R, end: O };
4648
- f || y(W), a == null || a(W), u(null), C(!1);
5440
+ const [R, O] = X(q, p) || Y(q, p) ? [q, p] : [p, q], V = { start: R, end: O };
5441
+ u || b(V), a == null || a(V), c(null), S(!1);
4649
5442
  }
4650
- }, N = () => {
4651
- b === 0 ? (x(11), k((M) => M - 1)) : x((M) => M - 1);
5443
+ }, B = () => {
5444
+ g === 0 ? (x(11), w((q) => q - 1)) : x((q) => q - 1);
4652
5445
  }, $ = () => {
4653
- b === 11 ? (x(0), k((M) => M + 1)) : x((M) => M + 1);
4654
- }, I = s ? { start: s, end: s } : d ? { start: d.start, end: d.end } : void 0;
4655
- return /* @__PURE__ */ h("div", { ref: S, style: { position: "relative", display: "inline-block", ...c }, children: [
5446
+ g === 11 ? (x(0), w((q) => q + 1)) : x((q) => q + 1);
5447
+ }, z = p ? { start: p, end: p } : d ? { start: d.start, end: d.end } : void 0;
5448
+ return /* @__PURE__ */ h("div", { ref: C, style: { position: "relative", display: "inline-block", ...s }, children: [
4656
5449
  /* @__PURE__ */ h(
4657
5450
  "button",
4658
5451
  {
4659
5452
  type: "button",
4660
5453
  disabled: r,
4661
- onClick: () => !r && C((M) => !M),
4662
- onFocus: () => w(!0),
4663
- onBlur: () => w(!1),
5454
+ onClick: () => !r && S((q) => !q),
5455
+ onFocus: () => T(!0),
5456
+ onBlur: () => T(!1),
4664
5457
  "aria-haspopup": "dialog",
4665
- "aria-expanded": p,
5458
+ "aria-expanded": f,
4666
5459
  style: {
4667
5460
  display: "inline-flex",
4668
5461
  alignItems: "center",
@@ -4686,11 +5479,11 @@ function Ln({
4686
5479
  /* @__PURE__ */ e("path", { d: "M1 6h12", stroke: "currentColor", strokeWidth: "1.3" }),
4687
5480
  /* @__PURE__ */ e("path", { d: "M4 1v2M10 1v2", stroke: "currentColor", strokeWidth: "1.3", strokeLinecap: "round" })
4688
5481
  ] }),
4689
- /* @__PURE__ */ e("span", { style: { flex: 1, textAlign: "left" }, children: Tt(d, o) })
5482
+ /* @__PURE__ */ e("span", { style: { flex: 1, textAlign: "left" }, children: $t(d, o) })
4690
5483
  ]
4691
5484
  }
4692
5485
  ),
4693
- p && /* @__PURE__ */ h(
5486
+ f && /* @__PURE__ */ h(
4694
5487
  "div",
4695
5488
  {
4696
5489
  role: "dialog",
@@ -4710,48 +5503,48 @@ function Ln({
4710
5503
  },
4711
5504
  children: [
4712
5505
  /* @__PURE__ */ e("div", { style: { minWidth: 220 }, children: /* @__PURE__ */ e(
4713
- X,
5506
+ J,
4714
5507
  {
4715
- year: m,
4716
- month: b,
5508
+ year: y,
5509
+ month: g,
4717
5510
  ...(d == null ? void 0 : d.start) !== void 0 && { selected: d.start },
4718
5511
  today: v,
4719
5512
  ...i !== void 0 && { min: i },
4720
5513
  ...l !== void 0 && { max: l },
4721
5514
  onSelect: P,
4722
- onPrevMonth: N,
5515
+ onPrevMonth: B,
4723
5516
  onNextMonth: $,
4724
- ...I !== void 0 && { highlightRange: I }
5517
+ ...z !== void 0 && { highlightRange: z }
4725
5518
  }
4726
5519
  ) }),
4727
5520
  /* @__PURE__ */ e("div", { style: { width: 1, background: "var(--lucent-border-subtle)", flexShrink: 0 } }),
4728
5521
  /* @__PURE__ */ e("div", { style: { minWidth: 220 }, children: /* @__PURE__ */ e(
4729
- X,
5522
+ J,
4730
5523
  {
4731
- year: T,
4732
- month: E,
5524
+ year: k,
5525
+ month: I,
4733
5526
  ...(d == null ? void 0 : d.end) !== void 0 && { selected: d.end },
4734
5527
  today: v,
4735
5528
  ...i !== void 0 && { min: i },
4736
5529
  ...l !== void 0 && { max: l },
4737
5530
  onSelect: P,
4738
- onPrevMonth: N,
5531
+ onPrevMonth: B,
4739
5532
  onNextMonth: $,
4740
- ...I !== void 0 && { highlightRange: I }
5533
+ ...z !== void 0 && { highlightRange: z }
4741
5534
  }
4742
5535
  ) })
4743
5536
  ]
4744
5537
  }
4745
5538
  ),
4746
- s && p && /* @__PURE__ */ e("div", { style: { position: "absolute", top: "calc(100% + 4px)", left: 0, zIndex: 1001, pointerEvents: "none" } }),
4747
- s && p && /* @__PURE__ */ e("div", { style: {
5539
+ p && f && /* @__PURE__ */ e("div", { style: { position: "absolute", top: "calc(100% + 4px)", left: 0, zIndex: 1001, pointerEvents: "none" } }),
5540
+ p && f && /* @__PURE__ */ e("div", { style: {
4748
5541
  position: "absolute",
4749
5542
  bottom: -24,
4750
5543
  left: 0
4751
- }, children: /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: "Now pick the end date" }) })
5544
+ }, children: /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: "Now pick the end date" }) })
4752
5545
  ] });
4753
5546
  }
4754
- const Bn = {
5547
+ const ia = {
4755
5548
  id: "date-range-picker",
4756
5549
  name: "DateRangePicker",
4757
5550
  tier: "molecule",
@@ -4833,17 +5626,17 @@ const Bn = {
4833
5626
  notes: 'Inherits Calendar accessibility from DatePicker. The two-step selection flow is reinforced with a visible "Now pick the end date" hint.'
4834
5627
  }
4835
5628
  };
4836
- function J(t) {
5629
+ function Q(t) {
4837
5630
  return t < 1024 ? `${t} B` : t < 1024 * 1024 ? `${(t / 1024).toFixed(1)} KB` : `${(t / (1024 * 1024)).toFixed(1)} MB`;
4838
5631
  }
4839
- function Ct() {
5632
+ function Pt() {
4840
5633
  return Math.random().toString(36).slice(2);
4841
5634
  }
4842
- function It({
5635
+ function Wt({
4843
5636
  item: t,
4844
5637
  onRemove: n
4845
5638
  }) {
4846
- const [a, o] = z(!1), r = t.progress, i = !!t.error;
5639
+ const [a, o] = M(!1), r = t.progress, i = !!t.error;
4847
5640
  return /* @__PURE__ */ h("div", { style: {
4848
5641
  display: "flex",
4849
5642
  alignItems: "center",
@@ -4858,8 +5651,8 @@ function It({
4858
5651
  /* @__PURE__ */ e("path", { d: "M12 2v4h4", stroke: "currentColor", strokeWidth: "1.3" })
4859
5652
  ] }),
4860
5653
  /* @__PURE__ */ h("div", { style: { flex: 1, minWidth: 0 }, children: [
4861
- /* @__PURE__ */ e(q, { size: "sm", truncate: !0, children: t.file.name }),
4862
- i ? /* @__PURE__ */ e(q, { size: "xs", color: "danger", children: t.error }) : /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: J(t.file.size) }),
5654
+ /* @__PURE__ */ e(E, { size: "sm", truncate: !0, children: t.file.name }),
5655
+ i ? /* @__PURE__ */ e(E, { size: "xs", color: "danger", children: t.error }) : /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: Q(t.file.size) }),
4863
5656
  r !== void 0 && !i && /* @__PURE__ */ e("div", { style: {
4864
5657
  marginTop: 4,
4865
5658
  height: 3,
@@ -4901,7 +5694,7 @@ function It({
4901
5694
  )
4902
5695
  ] });
4903
5696
  }
4904
- function $n({
5697
+ function la({
4905
5698
  accept: t,
4906
5699
  multiple: n = !1,
4907
5700
  maxSize: a,
@@ -4909,31 +5702,31 @@ function $n({
4909
5702
  onChange: r,
4910
5703
  onError: i,
4911
5704
  disabled: l = !1,
4912
- style: c
5705
+ style: s
4913
5706
  }) {
4914
- const f = o !== void 0, [g, y] = z([]), d = f ? o : g, [s, u] = z(!1), [v, m] = z(!1), k = F(null), b = Q((p) => {
4915
- if (!p || l) return;
4916
- const C = [];
4917
- for (const w of Array.from(p)) {
4918
- if (a && w.size > a) {
4919
- i == null || i(`"${w.name}" exceeds the ${J(a)} limit.`);
5707
+ const u = o !== void 0, [m, b] = M([]), d = u ? o : m, [p, c] = M(!1), [v, y] = M(!1), w = F(null), g = Z((f) => {
5708
+ if (!f || l) return;
5709
+ const S = [];
5710
+ for (const T of Array.from(f)) {
5711
+ if (a && T.size > a) {
5712
+ i == null || i(`"${T.name}" exceeds the ${Q(a)} limit.`);
4920
5713
  continue;
4921
5714
  }
4922
- if (!n && d.length + C.length >= 1) break;
4923
- C.push({ id: Ct(), file: w });
5715
+ if (!n && d.length + S.length >= 1) break;
5716
+ S.push({ id: Pt(), file: T });
4924
5717
  }
4925
- if (C.length === 0) return;
4926
- const D = n ? [...d, ...C] : C;
4927
- f || y(D), r == null || r(D);
4928
- }, [l, d, f, a, n, r, i]), x = (p) => {
4929
- const C = d.filter((D) => D.id !== p);
4930
- f || y(C), r == null || r(C);
4931
- }, E = (p) => {
4932
- p.preventDefault(), u(!1), b(p.dataTransfer.files);
4933
- }, T = (p) => {
4934
- b(p.target.files), p.target.value = "";
5718
+ if (S.length === 0) return;
5719
+ const D = n ? [...d, ...S] : S;
5720
+ u || b(D), r == null || r(D);
5721
+ }, [l, d, u, a, n, r, i]), x = (f) => {
5722
+ const S = d.filter((D) => D.id !== f);
5723
+ u || b(S), r == null || r(S);
5724
+ }, I = (f) => {
5725
+ f.preventDefault(), c(!1), g(f.dataTransfer.files);
5726
+ }, k = (f) => {
5727
+ g(f.target.files), f.target.value = "";
4935
5728
  };
4936
- return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-3)", ...c }, children: [
5729
+ return /* @__PURE__ */ h("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-3)", ...s }, children: [
4937
5730
  /* @__PURE__ */ h(
4938
5731
  "div",
4939
5732
  {
@@ -4942,20 +5735,20 @@ function $n({
4942
5735
  "aria-label": "Upload files",
4943
5736
  "aria-disabled": l,
4944
5737
  onClick: () => {
4945
- var p;
4946
- return !l && ((p = k.current) == null ? void 0 : p.click());
5738
+ var f;
5739
+ return !l && ((f = w.current) == null ? void 0 : f.click());
4947
5740
  },
4948
- onKeyDown: (p) => {
4949
- var C;
4950
- (p.key === "Enter" || p.key === " ") && (p.preventDefault(), (C = k.current) == null || C.click());
5741
+ onKeyDown: (f) => {
5742
+ var S;
5743
+ (f.key === "Enter" || f.key === " ") && (f.preventDefault(), (S = w.current) == null || S.click());
4951
5744
  },
4952
- onFocus: () => m(!0),
4953
- onBlur: () => m(!1),
4954
- onDragOver: (p) => {
4955
- p.preventDefault(), l || u(!0);
5745
+ onFocus: () => y(!0),
5746
+ onBlur: () => y(!1),
5747
+ onDragOver: (f) => {
5748
+ f.preventDefault(), l || c(!0);
4956
5749
  },
4957
- onDragLeave: () => u(!1),
4958
- onDrop: E,
5750
+ onDragLeave: () => c(!1),
5751
+ onDrop: I,
4959
5752
  style: {
4960
5753
  display: "flex",
4961
5754
  flexDirection: "column",
@@ -4964,8 +5757,8 @@ function $n({
4964
5757
  gap: "var(--lucent-space-2)",
4965
5758
  padding: "var(--lucent-space-8) var(--lucent-space-6)",
4966
5759
  borderRadius: "var(--lucent-radius-lg)",
4967
- border: `2px dashed ${l ? "var(--lucent-border-default)" : s || v ? "var(--lucent-accent-default)" : "var(--lucent-border-default)"}`,
4968
- background: s ? "var(--lucent-accent-subtle)" : "var(--lucent-bg-subtle)",
5760
+ border: `2px dashed ${l ? "var(--lucent-border-default)" : p || v ? "var(--lucent-accent-default)" : "var(--lucent-border-default)"}`,
5761
+ background: p ? "var(--lucent-accent-subtle)" : "var(--lucent-bg-subtle)",
4969
5762
  cursor: l ? "not-allowed" : "pointer",
4970
5763
  transition: "border-color var(--lucent-duration-fast), background var(--lucent-duration-fast)",
4971
5764
  outline: "none"
@@ -4979,7 +5772,7 @@ function $n({
4979
5772
  viewBox: "0 0 32 32",
4980
5773
  fill: "none",
4981
5774
  "aria-hidden": !0,
4982
- style: { color: l ? "var(--lucent-text-disabled)" : s ? "var(--lucent-accent-default)" : "var(--lucent-text-secondary)" },
5775
+ style: { color: l ? "var(--lucent-text-disabled)" : p ? "var(--lucent-accent-default)" : "var(--lucent-text-secondary)" },
4983
5776
  children: [
4984
5777
  /* @__PURE__ */ e("path", { d: "M16 20V10M16 10l-4 4M16 10l4 4", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round" }),
4985
5778
  /* @__PURE__ */ e("path", { d: "M8 24h16", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round" })
@@ -4987,21 +5780,21 @@ function $n({
4987
5780
  }
4988
5781
  ),
4989
5782
  /* @__PURE__ */ h("div", { style: { textAlign: "center" }, children: [
4990
- /* @__PURE__ */ e(q, { color: l ? "disabled" : "primary", weight: "medium", children: s ? "Drop to upload" : "Drop files here or click to browse" }),
4991
- (t || a) && /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: [
5783
+ /* @__PURE__ */ e(E, { color: l ? "disabled" : "primary", weight: "medium", children: p ? "Drop to upload" : "Drop files here or click to browse" }),
5784
+ (t || a) && /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: [
4992
5785
  t && `Accepted: ${t}`,
4993
- a && `Max size: ${J(a)}`
5786
+ a && `Max size: ${Q(a)}`
4994
5787
  ].filter(Boolean).join(" · ") })
4995
5788
  ] }),
4996
5789
  /* @__PURE__ */ e(
4997
5790
  "input",
4998
5791
  {
4999
- ref: k,
5792
+ ref: w,
5000
5793
  type: "file",
5001
5794
  accept: t,
5002
5795
  multiple: n,
5003
5796
  disabled: l,
5004
- onChange: T,
5797
+ onChange: k,
5005
5798
  style: { display: "none" },
5006
5799
  tabIndex: -1
5007
5800
  }
@@ -5009,10 +5802,10 @@ function $n({
5009
5802
  ]
5010
5803
  }
5011
5804
  ),
5012
- d.length > 0 && /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)" }, children: d.map((p) => /* @__PURE__ */ e(It, { item: p, onRemove: x }, p.id)) })
5805
+ d.length > 0 && /* @__PURE__ */ e("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-2)" }, children: d.map((f) => /* @__PURE__ */ e(Wt, { item: f, onRemove: x }, f.id)) })
5013
5806
  ] });
5014
5807
  }
5015
- const Pn = {
5808
+ const sa = {
5016
5809
  id: "file-upload",
5017
5810
  name: "FileUpload",
5018
5811
  tier: "molecule",
@@ -5110,23 +5903,23 @@ const handleChange = async (updated: UploadFile[]) => {
5110
5903
  keyboardInteractions: ["Enter/Space to open file picker", "Tab to focus drop zone"],
5111
5904
  notes: 'The drop zone has role="button" with tabIndex=0 and responds to Enter/Space. Remove buttons on file rows have aria-label including the filename.'
5112
5905
  }
5113
- }, Mt = {
5906
+ }, Vt = {
5114
5907
  default: "var(--lucent-border-strong)",
5115
5908
  success: "var(--lucent-success-default)",
5116
5909
  warning: "var(--lucent-warning-default)",
5117
5910
  danger: "var(--lucent-danger-default)",
5118
5911
  info: "var(--lucent-info-default)"
5119
- }, zt = {
5912
+ }, Ot = {
5120
5913
  default: "var(--lucent-bg-muted)",
5121
5914
  success: "var(--lucent-success-subtle)",
5122
5915
  warning: "var(--lucent-warning-subtle)",
5123
5916
  danger: "var(--lucent-danger-subtle)",
5124
5917
  info: "var(--lucent-info-subtle)"
5125
5918
  };
5126
- function Et({ status: t }) {
5919
+ function Ht({ status: t }) {
5127
5920
  return t === "success" ? /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M2 5l2 2 4-4", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) }) : t === "danger" ? /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M2 2l6 6M8 2L2 8", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) : t === "warning" ? /* @__PURE__ */ e("svg", { width: "10", height: "10", viewBox: "0 0 10 10", fill: "none", "aria-hidden": !0, children: /* @__PURE__ */ e("path", { d: "M5 2v4M5 7.5v.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round" }) }) : null;
5128
5921
  }
5129
- function Wn({ items: t, style: n }) {
5922
+ function ca({ items: t, style: n }) {
5130
5923
  return /* @__PURE__ */ e(
5131
5924
  "ol",
5132
5925
  {
@@ -5139,7 +5932,7 @@ function Wn({ items: t, style: n }) {
5139
5932
  ...n
5140
5933
  },
5141
5934
  children: t.map((a, o) => {
5142
- const r = a.status ?? "default", i = Mt[r], l = zt[r], c = o === t.length - 1;
5935
+ const r = a.status ?? "default", i = Vt[r], l = Ot[r], s = o === t.length - 1;
5143
5936
  return /* @__PURE__ */ h(
5144
5937
  "li",
5145
5938
  {
@@ -5168,8 +5961,8 @@ function Wn({ items: t, style: n }) {
5168
5961
  color: i,
5169
5962
  flexShrink: 0,
5170
5963
  zIndex: 1
5171
- }, children: a.icon ?? /* @__PURE__ */ e(Et, { status: r }) }),
5172
- !c && /* @__PURE__ */ e("div", { style: {
5964
+ }, children: a.icon ?? /* @__PURE__ */ e(Ht, { status: r }) }),
5965
+ !s && /* @__PURE__ */ e("div", { style: {
5173
5966
  flex: 1,
5174
5967
  width: 2,
5175
5968
  background: "var(--lucent-border-subtle)",
@@ -5179,14 +5972,14 @@ function Wn({ items: t, style: n }) {
5179
5972
  ] }),
5180
5973
  /* @__PURE__ */ h("div", { style: {
5181
5974
  flex: 1,
5182
- paddingBottom: c ? 0 : "var(--lucent-space-6)",
5975
+ paddingBottom: s ? 0 : "var(--lucent-space-6)",
5183
5976
  paddingTop: 4
5184
5977
  }, children: [
5185
5978
  /* @__PURE__ */ h("div", { style: { display: "flex", alignItems: "baseline", justifyContent: "space-between", gap: "var(--lucent-space-3)", flexWrap: "wrap" }, children: [
5186
- /* @__PURE__ */ e(q, { weight: "medium", size: "sm", children: a.title }),
5187
- a.date && /* @__PURE__ */ e(q, { size: "xs", color: "secondary", children: a.date })
5979
+ /* @__PURE__ */ e(E, { weight: "medium", size: "sm", children: a.title }),
5980
+ a.date && /* @__PURE__ */ e(E, { size: "xs", color: "secondary", children: a.date })
5188
5981
  ] }),
5189
- a.description && /* @__PURE__ */ e("div", { style: { marginTop: "var(--lucent-space-1)" }, children: /* @__PURE__ */ e(q, { size: "sm", color: "secondary", children: a.description }) })
5982
+ a.description && /* @__PURE__ */ e("div", { style: { marginTop: "var(--lucent-space-1)" }, children: /* @__PURE__ */ e(E, { size: "sm", color: "secondary", children: a.description }) })
5190
5983
  ] })
5191
5984
  ]
5192
5985
  },
@@ -5196,7 +5989,7 @@ function Wn({ items: t, style: n }) {
5196
5989
  }
5197
5990
  );
5198
5991
  }
5199
- const Vn = {
5992
+ const da = {
5200
5993
  id: "timeline",
5201
5994
  name: "Timeline",
5202
5995
  tier: "molecule",
@@ -5250,7 +6043,7 @@ const Vn = {
5250
6043
  keyboardInteractions: ["Standard document flow — no interactive elements unless custom icons include them"],
5251
6044
  notes: "Timeline is a semantic <ol> with <li> items. It is non-interactive by default. If items contain interactive elements (links, buttons), those elements carry their own keyboard behaviour."
5252
6045
  }
5253
- }, de = {
6046
+ }, fe = {
5254
6047
  fontFamilyBase: '"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
5255
6048
  fontFamilyMono: '"DM Mono", "Fira Code", "Cascadia Code", monospace',
5256
6049
  fontFamilyDisplay: '"Georama", "DM Sans", sans-serif',
@@ -5271,7 +6064,7 @@ const Vn = {
5271
6064
  letterSpacingTight: "-0.02em",
5272
6065
  letterSpacingBase: "0em",
5273
6066
  letterSpacingWide: "0.04em"
5274
- }, ue = {
6067
+ }, he = {
5275
6068
  space0: "0px",
5276
6069
  space1: "0.25rem",
5277
6070
  space2: "0.5rem",
@@ -5285,38 +6078,38 @@ const Vn = {
5285
6078
  space16: "4rem",
5286
6079
  space20: "5rem",
5287
6080
  space24: "6rem"
5288
- }, pe = {
6081
+ }, me = {
5289
6082
  radiusNone: "0px",
5290
6083
  radiusSm: "0.25rem",
5291
6084
  radiusMd: "0.375rem",
5292
6085
  radiusLg: "0.5rem",
5293
6086
  radiusXl: "0.75rem",
5294
6087
  radiusFull: "9999px"
5295
- }, fe = {
6088
+ }, ge = {
5296
6089
  durationFast: "100ms",
5297
6090
  durationBase: "200ms",
5298
6091
  durationSlow: "350ms",
5299
6092
  easingDefault: "cubic-bezier(0.4, 0, 0.2, 1)",
5300
6093
  easingEmphasized: "cubic-bezier(0.2, 0, 0, 1)",
5301
6094
  easingDecelerate: "cubic-bezier(0, 0, 0.2, 1)"
5302
- }, qt = {
6095
+ }, jt = {
5303
6096
  shadowNone: "none",
5304
6097
  shadowSm: "0 1px 2px 0 rgb(0 0 0 / 0.05)",
5305
6098
  shadowMd: "0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1)",
5306
6099
  shadowLg: "0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1)",
5307
6100
  shadowXl: "0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1)"
5308
- }, Dt = {
6101
+ }, Ut = {
5309
6102
  shadowNone: "none",
5310
6103
  shadowSm: "0 1px 2px 0 rgb(0 0 0 / 0.3)",
5311
6104
  shadowMd: "0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.4)",
5312
6105
  shadowLg: "0 10px 15px -3px rgb(0 0 0 / 0.4), 0 4px 6px -4px rgb(0 0 0 / 0.4)",
5313
6106
  shadowXl: "0 20px 25px -5px rgb(0 0 0 / 0.5), 0 8px 10px -6px rgb(0 0 0 / 0.5)"
5314
- }, he = {
5315
- ...de,
5316
- ...ue,
5317
- ...pe,
6107
+ }, be = {
5318
6108
  ...fe,
5319
- ...qt,
6109
+ ...he,
6110
+ ...me,
6111
+ ...ge,
6112
+ ...jt,
5320
6113
  // Backgrounds
5321
6114
  bgBase: "#ffffff",
5322
6115
  bgSubtle: "#f9fafb",
@@ -5343,6 +6136,8 @@ const Vn = {
5343
6136
  accentHover: "#1f2937",
5344
6137
  accentActive: "#374151",
5345
6138
  accentSubtle: "#f3f4f6",
6139
+ // placeholder — actual value is recomputed in LucentProvider
6140
+ accentBorder: "#111827",
5346
6141
  // Status
5347
6142
  successDefault: "#16a34a",
5348
6143
  successSubtle: "#f0fdf4",
@@ -5359,12 +6154,12 @@ const Vn = {
5359
6154
  infoText: "#1d4ed8",
5360
6155
  // Focus
5361
6156
  focusRing: "#111827"
5362
- }, At = {
5363
- ...de,
5364
- ...ue,
5365
- ...pe,
6157
+ }, Gt = {
5366
6158
  ...fe,
5367
- ...Dt,
6159
+ ...he,
6160
+ ...me,
6161
+ ...ge,
6162
+ ...Ut,
5368
6163
  // Backgrounds
5369
6164
  bgBase: "#0b0d12",
5370
6165
  bgSubtle: "#111318",
@@ -5391,6 +6186,8 @@ const Vn = {
5391
6186
  accentHover: "#e5e7eb",
5392
6187
  accentActive: "#d1d5db",
5393
6188
  accentSubtle: "rgb(249 250 251 / 0.1)",
6189
+ // placeholder — actual value is recomputed in LucentProvider
6190
+ accentBorder: "#f9fafb",
5394
6191
  // Status
5395
6192
  successDefault: "#22c55e",
5396
6193
  successSubtle: "rgb(34 197 94 / 0.1)",
@@ -5408,77 +6205,117 @@ const Vn = {
5408
6205
  // Focus
5409
6206
  focusRing: "#f9fafb"
5410
6207
  };
5411
- function Ft(t) {
6208
+ function _t(t) {
5412
6209
  return "--lucent-" + t.replace(/([A-Z])/g, (n) => `-${n.toLowerCase()}`).replace(/([a-z])(\d)/g, (n, a, o) => `${a}-${o}`);
5413
6210
  }
5414
- function Nt(t, n = ":root") {
5415
- const a = Object.entries(t).map(([o, r]) => ` ${Ft(o)}: ${r};`).join(`
6211
+ function Yt(t, n = ":root") {
6212
+ const a = Object.entries(t).map(([o, r]) => ` ${_t(o)}: ${r};`).join(`
5416
6213
  `);
5417
6214
  return `${n} {
5418
6215
  ${a}
5419
6216
  }`;
5420
6217
  }
5421
- function Rt(t) {
6218
+ function Kt(t) {
5422
6219
  const n = parseInt(t.slice(1, 3), 16) / 255, a = parseInt(t.slice(3, 5), 16) / 255, o = parseInt(t.slice(5, 7), 16) / 255, r = (i) => i <= 0.03928 ? i / 12.92 : Math.pow((i + 0.055) / 1.055, 2.4);
5423
6220
  return 0.2126 * r(n) + 0.7152 * r(a) + 0.0722 * r(o);
5424
6221
  }
5425
- function Lt(t) {
5426
- return Rt(t) < 0.179 ? "#ffffff" : "#000000";
6222
+ function Xt(t) {
6223
+ return Kt(t) < 0.179 ? "#ffffff" : "#000000";
6224
+ }
6225
+ function Jt(t) {
6226
+ const n = parseInt(t.slice(1, 3), 16), a = parseInt(t.slice(3, 5), 16), o = parseInt(t.slice(5, 7), 16);
6227
+ return { r: n, g: a, b: o };
6228
+ }
6229
+ function Qt({ r: t, g: n, b: a }) {
6230
+ const o = (r) => r.toString(16).padStart(2, "0");
6231
+ return `#${o(t)}${o(n)}${o(a)}`;
6232
+ }
6233
+ function Zt(t) {
6234
+ const { r: n, g: a, b: o } = Jt(t), r = n / 255, i = a / 255, l = o / 255, s = Math.max(r, i, l), u = Math.min(r, i, l);
6235
+ let m = 0, b = 0;
6236
+ const d = (s + u) / 2;
6237
+ if (s !== u) {
6238
+ const p = s - u;
6239
+ switch (b = d > 0.5 ? p / (2 - s - u) : p / (s + u), s) {
6240
+ case r:
6241
+ m = (i - l) / p + (i < l ? 6 : 0);
6242
+ break;
6243
+ case i:
6244
+ m = (l - r) / p + 2;
6245
+ break;
6246
+ case l:
6247
+ m = (r - i) / p + 4;
6248
+ break;
6249
+ }
6250
+ m /= 6;
6251
+ }
6252
+ return [m * 360, b, d];
6253
+ }
6254
+ function en(t, n, a) {
6255
+ t = (t % 360 + 360) % 360, n = Math.min(1, Math.max(0, n)), a = Math.min(1, Math.max(0, a));
6256
+ const o = (1 - Math.abs(2 * a - 1)) * n, r = o * (1 - Math.abs(t / 60 % 2 - 1)), i = a - o / 2;
6257
+ let l = 0, s = 0, u = 0;
6258
+ return t < 60 ? (l = o, s = r) : t < 120 ? (l = r, s = o) : t < 180 ? (s = o, u = r) : t < 240 ? (s = r, u = o) : t < 300 ? (l = r, u = o) : (l = o, u = r), Qt({ r: Math.round((l + i) * 255), g: Math.round((s + i) * 255), b: Math.round((u + i) * 255) });
6259
+ }
6260
+ function oe(t, n) {
6261
+ const [a, o, r] = Zt(t);
6262
+ return en(a, o, Math.min(1, Math.max(0, r + n)));
5427
6263
  }
5428
- const me = oe({
6264
+ const ve = le({
5429
6265
  theme: "light",
5430
- tokens: he
6266
+ tokens: be
5431
6267
  });
5432
- function On({
6268
+ function ua({
5433
6269
  theme: t = "light",
5434
6270
  tokens: n,
5435
6271
  children: a
5436
6272
  }) {
5437
- const o = le().replace(/:/g, ""), r = t === "dark" ? At : he, i = n ? { ...r, ...n } : r, l = {
6273
+ const o = ce().replace(/:/g, ""), r = t === "dark" ? Gt : be, i = n ? { ...r, ...n } : r, l = n != null && n.accentBorder ? n.accentBorder : t === "light" ? oe(i.accentDefault, -0.15) : oe(i.accentDefault, 0.15), s = {
5438
6274
  ...i,
5439
- textOnAccent: (n == null ? void 0 : n.textOnAccent) ?? Lt(i.accentDefault)
5440
- }, c = `html { font-size: 13px; }
5441
- ` + Nt(l, ":root");
5442
- return ie(() => {
5443
- let f = document.getElementById(`lucent-tokens-${o}`);
5444
- return f || (f = document.createElement("style"), f.id = `lucent-tokens-${o}`, document.head.appendChild(f)), f.textContent = c, () => {
5445
- var g;
5446
- (g = document.getElementById(`lucent-tokens-${o}`)) == null || g.remove();
6275
+ textOnAccent: (n == null ? void 0 : n.textOnAccent) ?? Xt(i.accentDefault),
6276
+ accentBorder: l
6277
+ }, u = `html { font-size: 13px; }
6278
+ ` + Yt(s, ":root");
6279
+ return se(() => {
6280
+ let m = document.getElementById(`lucent-tokens-${o}`);
6281
+ return m || (m = document.createElement("style"), m.id = `lucent-tokens-${o}`, document.head.appendChild(m)), m.textContent = u, () => {
6282
+ var b;
6283
+ (b = document.getElementById(`lucent-tokens-${o}`)) == null || b.remove();
5447
6284
  };
5448
- }, [o, c]), /* @__PURE__ */ e(me.Provider, { value: { theme: t, tokens: l }, children: a });
6285
+ }, [o, u]), /* @__PURE__ */ e(ve.Provider, { value: { theme: t, tokens: s }, children: a });
5449
6286
  }
5450
- function jn() {
5451
- return re(me);
6287
+ function pa() {
6288
+ return ie(ve);
5452
6289
  }
5453
- const Hn = {
6290
+ const fa = {
5454
6291
  accentDefault: "#e9c96b",
5455
6292
  accentHover: "#ddb84e",
5456
6293
  accentActive: "#c9a33b",
5457
6294
  accentSubtle: "#fef9ec",
5458
6295
  focusRing: "#e9c96b"
5459
6296
  };
5460
- function L(t, n) {
6297
+ function N(t, n) {
5461
6298
  return { field: t, message: n };
5462
6299
  }
5463
- function Bt(t) {
6300
+ function tn(t) {
5464
6301
  const n = [];
5465
6302
  if (typeof t != "object" || t === null)
5466
- return { valid: !1, errors: [L("manifest", "Must be a non-null object")] };
6303
+ return { valid: !1, errors: [N("manifest", "Must be a non-null object")] };
5467
6304
  const a = t, o = ["id", "name", "description", "designIntent", "specVersion"];
5468
6305
  for (const i of o)
5469
- (typeof a[i] != "string" || a[i].trim() === "") && n.push(L(i, "Must be a non-empty string"));
5470
- typeof a.id == "string" && !/^[a-z][a-z0-9-]*$/.test(a.id) && n.push(L("id", 'Must be kebab-case (e.g. "button", "form-field")'));
6306
+ (typeof a[i] != "string" || a[i].trim() === "") && n.push(N(i, "Must be a non-empty string"));
6307
+ typeof a.id == "string" && !/^[a-z][a-z0-9-]*$/.test(a.id) && n.push(N("id", 'Must be kebab-case (e.g. "button", "form-field")'));
5471
6308
  const r = ["atom", "molecule", "block", "flow", "overlay"];
5472
- return r.includes(a.tier) || n.push(L("tier", `Must be one of: ${r.join(", ")}`)), (typeof a.domain != "string" || a.domain.trim() === "") && n.push(L("domain", "Must be a non-empty string")), Array.isArray(a.props) ? a.props.forEach((i, l) => {
5473
- const c = i, f = `props[${l}]`;
5474
- (typeof c.name != "string" || c.name === "") && n.push(L(`${f}.name`, "Must be a non-empty string")), (typeof c.type != "string" || c.type === "") && n.push(L(`${f}.type`, "Must be a non-empty string")), typeof c.required != "boolean" && n.push(L(`${f}.required`, "Must be a boolean")), (typeof c.description != "string" || c.description === "") && n.push(L(`${f}.description`, "Must be a non-empty string"));
5475
- }) : n.push(L("props", "Must be an array")), Array.isArray(a.usageExamples) ? a.usageExamples.length === 0 ? n.push(L("usageExamples", "Must have at least one example")) : a.usageExamples.forEach((i, l) => {
5476
- const c = i, f = `usageExamples[${l}]`;
5477
- (typeof c.title != "string" || c.title === "") && n.push(L(`${f}.title`, "Must be a non-empty string")), (typeof c.code != "string" || c.code === "") && n.push(L(`${f}.code`, "Must be a non-empty string"));
5478
- }) : n.push(L("usageExamples", "Must be an array")), Array.isArray(a.compositionGraph) || n.push(L("compositionGraph", "Must be an array (empty array is fine for atoms)")), typeof a.specVersion == "string" && !/^\d+\.\d+$/.test(a.specVersion) && n.push(L("specVersion", 'Must be "MAJOR.MINOR" format, e.g. "0.1"')), { valid: n.length === 0, errors: n };
6309
+ return r.includes(a.tier) || n.push(N("tier", `Must be one of: ${r.join(", ")}`)), (typeof a.domain != "string" || a.domain.trim() === "") && n.push(N("domain", "Must be a non-empty string")), Array.isArray(a.props) ? a.props.forEach((i, l) => {
6310
+ const s = i, u = `props[${l}]`;
6311
+ (typeof s.name != "string" || s.name === "") && n.push(N(`${u}.name`, "Must be a non-empty string")), (typeof s.type != "string" || s.type === "") && n.push(N(`${u}.type`, "Must be a non-empty string")), typeof s.required != "boolean" && n.push(N(`${u}.required`, "Must be a boolean")), (typeof s.description != "string" || s.description === "") && n.push(N(`${u}.description`, "Must be a non-empty string"));
6312
+ }) : n.push(N("props", "Must be an array")), Array.isArray(a.usageExamples) ? a.usageExamples.length === 0 ? n.push(N("usageExamples", "Must have at least one example")) : a.usageExamples.forEach((i, l) => {
6313
+ const s = i, u = `usageExamples[${l}]`;
6314
+ (typeof s.title != "string" || s.title === "") && n.push(N(`${u}.title`, "Must be a non-empty string")), (typeof s.code != "string" || s.code === "") && n.push(N(`${u}.code`, "Must be a non-empty string"));
6315
+ }) : n.push(N("usageExamples", "Must be an array")), Array.isArray(a.compositionGraph) || n.push(N("compositionGraph", "Must be an array (empty array is fine for atoms)")), typeof a.specVersion == "string" && !/^\d+\.\d+$/.test(a.specVersion) && n.push(N("specVersion", 'Must be "MAJOR.MINOR" format, e.g. "0.1"')), { valid: n.length === 0, errors: n };
5479
6316
  }
5480
- function Un(t) {
5481
- const n = Bt(t);
6317
+ function ha(t) {
6318
+ const n = tn(t);
5482
6319
  if (!n.valid) {
5483
6320
  const a = n.errors.map((o) => ` ${o.field}: ${o.message}`).join(`
5484
6321
  `);
@@ -5486,86 +6323,92 @@ function Un(t) {
5486
6323
  ${a}`);
5487
6324
  }
5488
6325
  }
5489
- function Gn(t) {
6326
+ function ma(t) {
5490
6327
  if (typeof t != "object" || t === null) return !1;
5491
6328
  const n = t;
5492
6329
  return typeof n.name == "string" && typeof n.type == "string" && typeof n.required == "boolean" && typeof n.description == "string";
5493
6330
  }
5494
- const _n = "1.0", Yn = "0.1.0";
6331
+ const ga = "1.0", ba = "0.1.0";
5495
6332
  export {
5496
- bn as Alert,
5497
- yn as AlertManifest,
5498
- Ut as Avatar,
5499
- Gt as AvatarManifest,
5500
- jt as Badge,
5501
- Ht as BadgeManifest,
5502
- Tn as Breadcrumb,
5503
- be as Button,
5504
- Wt as ButtonManifest,
5505
- Dn as COMMAND_PALETTE_MANIFEST,
5506
- gn as Card,
5507
- vn as CardManifest,
5508
- Re as Checkbox,
5509
- Xt as CheckboxManifest,
5510
- In as Collapsible,
5511
- qn as CommandPalette,
5512
- En as DATA_TABLE_MANIFEST,
5513
- Rn as DATE_PICKER_MANIFEST,
5514
- Bn as DATE_RANGE_PICKER_MANIFEST,
5515
- zn as DataTable,
5516
- Nn as DatePicker,
5517
- Ln as DateRangePicker,
5518
- Yt as Divider,
5519
- Kt as DividerManifest,
5520
- xn as EmptyState,
5521
- wn as EmptyStateManifest,
5522
- Pn as FILE_UPLOAD_MANIFEST,
5523
- $n as FileUpload,
5524
- pn as FormField,
5525
- fn as FormFieldManifest,
5526
- sn as Icon,
5527
- cn as IconManifest,
5528
- se as Input,
5529
- Vt as InputManifest,
5530
- Yn as LUCENT_UI_VERSION,
5531
- On as LucentProvider,
5532
- _n as MANIFEST_SPEC_VERSION,
5533
- Fn as MULTI_SELECT_MANIFEST,
5534
- An as MultiSelect,
5535
- un as NavLink,
5536
- Mn as PageLayout,
5537
- Jt as Radio,
5538
- Be as RadioGroup,
5539
- Qt as RadioGroupUncontrolled,
5540
- Zt as RadioManifest,
5541
- hn as SearchInput,
5542
- mn as SearchInputManifest,
5543
- je as Select,
5544
- nn as SelectManifest,
5545
- kn as Skeleton,
5546
- Sn as SkeletonManifest,
5547
- Ae as Spinner,
5548
- _t as SpinnerManifest,
5549
- Vn as TIMELINE_MANIFEST,
5550
- Cn as Tabs,
5551
- an as Tag,
5552
- rn as TagManifest,
5553
- q as Text,
5554
- dn as TextManifest,
5555
- Te as Textarea,
5556
- Ot as TextareaManifest,
5557
- Wn as Timeline,
5558
- en as Toggle,
5559
- tn as ToggleManifest,
5560
- on as Tooltip,
5561
- ln as TooltipManifest,
5562
- Un as assertManifest,
5563
- Hn as brandTokens,
5564
- At as darkTokens,
5565
- Lt as getContrastText,
5566
- Gn as isValidPropDescriptor,
5567
- he as lightTokens,
5568
- Nt as makeLibraryCSS,
5569
- jn as useLucent,
5570
- Bt as validateManifest
6333
+ Vn as Alert,
6334
+ On as AlertManifest,
6335
+ dn as Avatar,
6336
+ un as AvatarManifest,
6337
+ sn as Badge,
6338
+ cn as BadgeManifest,
6339
+ _n as Breadcrumb,
6340
+ we as Button,
6341
+ rn as ButtonManifest,
6342
+ ea as COMMAND_PALETTE_MANIFEST,
6343
+ Pn as Card,
6344
+ Wn as CardManifest,
6345
+ ue as Checkbox,
6346
+ mn as CheckboxManifest,
6347
+ An as CodeBlock,
6348
+ Fn as CodeBlockManifest,
6349
+ Kn as Collapsible,
6350
+ Zn as CommandPalette,
6351
+ Qn as DATA_TABLE_MANIFEST,
6352
+ ra as DATE_PICKER_MANIFEST,
6353
+ ia as DATE_RANGE_PICKER_MANIFEST,
6354
+ Jn as DataTable,
6355
+ aa as DatePicker,
6356
+ oa as DateRangePicker,
6357
+ fn as Divider,
6358
+ hn as DividerManifest,
6359
+ Hn as EmptyState,
6360
+ jn as EmptyStateManifest,
6361
+ sa as FILE_UPLOAD_MANIFEST,
6362
+ la as FileUpload,
6363
+ Rn as FormField,
6364
+ Nn as FormFieldManifest,
6365
+ In as Icon,
6366
+ Mn as IconManifest,
6367
+ de as Input,
6368
+ on as InputManifest,
6369
+ ba as LUCENT_UI_VERSION,
6370
+ ua as LucentProvider,
6371
+ ga as MANIFEST_SPEC_VERSION,
6372
+ na as MULTI_SELECT_MANIFEST,
6373
+ ta as MultiSelect,
6374
+ qn as NavLink,
6375
+ Xn as PageLayout,
6376
+ gn as Radio,
6377
+ Pe as RadioGroup,
6378
+ bn as RadioGroupUncontrolled,
6379
+ vn as RadioManifest,
6380
+ Ln as SearchInput,
6381
+ $n as SearchInputManifest,
6382
+ Ue as Select,
6383
+ wn as SelectManifest,
6384
+ Un as Skeleton,
6385
+ Gn as SkeletonManifest,
6386
+ En as Slider,
6387
+ Dn as SliderManifest,
6388
+ Re as Spinner,
6389
+ pn as SpinnerManifest,
6390
+ da as TIMELINE_MANIFEST,
6391
+ G as Table,
6392
+ Bn as TableManifest,
6393
+ Yn as Tabs,
6394
+ kn as Tag,
6395
+ Sn as TagManifest,
6396
+ E as Text,
6397
+ zn as TextManifest,
6398
+ Me as Textarea,
6399
+ ln as TextareaManifest,
6400
+ ca as Timeline,
6401
+ yn as Toggle,
6402
+ xn as ToggleManifest,
6403
+ Tn as Tooltip,
6404
+ Cn as TooltipManifest,
6405
+ ha as assertManifest,
6406
+ fa as brandTokens,
6407
+ Gt as darkTokens,
6408
+ Xt as getContrastText,
6409
+ ma as isValidPropDescriptor,
6410
+ be as lightTokens,
6411
+ Yt as makeLibraryCSS,
6412
+ pa as useLucent,
6413
+ tn as validateManifest
5571
6414
  };