lucent-ui 0.36.0 → 0.38.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.
Files changed (14) hide show
  1. package/dist/{LucentProvider-F0EN_7TD.js → LucentProvider-Bm39MMvv.js} +550 -532
  2. package/dist/{LucentProvider-LqNc0AxD.cjs → LucentProvider-CzEDW5SL.cjs} +6 -6
  3. package/dist/devtools.cjs +1 -1
  4. package/dist/devtools.js +1 -1
  5. package/dist/index.cjs +87 -41
  6. package/dist/index.d.ts +92 -5
  7. package/dist/index.js +1519 -1285
  8. package/dist-server/src/components/atoms/Row/Row.manifest.js +10 -2
  9. package/dist-server/src/components/atoms/Stack/Stack.manifest.js +6 -2
  10. package/dist-server/src/components/molecules/Breadcrumb/Breadcrumb.manifest.js +27 -0
  11. package/dist-server/src/components/molecules/PageHeader/PageHeader.manifest.js +144 -0
  12. package/dist-server/src/manifest/examples/button.manifest.js +39 -1
  13. package/dist-server/src/manifest/patterns/action-bar.pattern.js +34 -6
  14. package/package.json +1 -1
package/dist/{LucentProvider-F0EN_7TD.js → LucentProvider-Bm39MMvv.js} RENAMED
@@ -1,7 +1,7 @@
1
- import { jsxs as I, jsx as p, Fragment as Ve } from "react/jsx-runtime";
2
- import { forwardRef as xe, useState as C, useRef as U, useEffect as ne, useLayoutEffect as me, useId as Ke, useCallback as ue, useContext as yt, createContext as wt } from "react";
3
- import { createPortal as kt } from "react-dom";
4
- const Dt = {
1
+ import { jsxs as T, jsx as f, Fragment as Ve } from "react/jsx-runtime";
2
+ import { forwardRef as xe, useState as P, useRef as q, useEffect as ne, useLayoutEffect as me, useId as Ke, useCallback as ue, useContext as yt, createContext as wt } from "react";
3
+ import { createPortal as Dt } from "react-dom";
4
+ const kt = {
5
5
  primary: {
6
6
  background: "var(--lucent-accent-default)",
7
7
  color: "var(--lucent-accent-fg)",
@@ -44,77 +44,95 @@ const Dt = {
44
44
  md: { height: "calc(var(--lucent-space-10) * 0.5 + 22px)", padding: "0 var(--lucent-space-5)", fontSize: "var(--lucent-font-size-md)" },
45
45
  lg: { height: "calc(var(--lucent-space-12) * 0.5 + 26px)", padding: "0 var(--lucent-space-6)", fontSize: "var(--lucent-font-size-lg)" }
46
46
  }, Ye = xe(
47
- ({ variant: e = "primary", size: t = "md", loading: s = !1, fullWidth: a = !1, spread: n = !1, leftIcon: r, rightIcon: o, chevron: c = !1, disableHoverStyles: u = !1, bordered: i = !0, children: d, disabled: g, style: h, ...f }, w) => {
48
- const S = g ?? s, k = !d && !s && (!!r || !!o);
49
- return /* @__PURE__ */ I(
50
- "button",
47
+ ({ variant: e = "primary", size: t = "md", loading: s = !1, fullWidth: a = !1, spread: n = !1, leftIcon: r, rightIcon: o, chevron: c = !1, disableHoverStyles: u = !1, bordered: i = !0, href: d, target: g, rel: h, children: p, disabled: y, style: I, type: k, onClick: L, ...b }, m) => {
48
+ const w = y ?? s, R = !p && !s && (!!r || !!o), E = d !== void 0, X = E ? "a" : "button", A = {
49
+ display: "inline-flex",
50
+ alignItems: "center",
51
+ justifyContent: n ? "space-between" : "center",
52
+ gap: "var(--lucent-space-2)",
53
+ fontFamily: "var(--lucent-font-family-base)",
54
+ fontWeight: "var(--lucent-font-weight-medium)",
55
+ lineHeight: 1,
56
+ letterSpacing: "0.01em",
57
+ borderRadius: "var(--lucent-radius-lg)",
58
+ cursor: w ? "not-allowed" : "pointer",
59
+ width: a ? "100%" : void 0,
60
+ 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)",
61
+ whiteSpace: "nowrap",
62
+ boxSizing: "border-box",
63
+ outline: "none",
64
+ margin: 0,
65
+ ...St[t],
66
+ ...R && { padding: 0, aspectRatio: "1" },
67
+ ...kt[e],
68
+ // Anchor reset — browsers underline <a> by default
69
+ ...E && { textDecoration: "none" },
70
+ ...I,
71
+ ...w && {
72
+ background: "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)",
73
+ color: "var(--lucent-text-disabled)",
74
+ borderColor: "transparent",
75
+ ...E && { pointerEvents: "none" }
76
+ },
77
+ // hide border entirely when bordered prop is false
78
+ ...i === !1 && { border: "none" }
79
+ };
80
+ return /* @__PURE__ */ T(
81
+ X,
51
82
  {
52
- ref: w,
53
- disabled: S,
83
+ ref: m,
54
84
  "aria-busy": s,
55
- style: {
56
- display: "inline-flex",
57
- alignItems: "center",
58
- justifyContent: n ? "space-between" : "center",
59
- gap: "var(--lucent-space-2)",
60
- fontFamily: "var(--lucent-font-family-base)",
61
- fontWeight: "var(--lucent-font-weight-medium)",
62
- lineHeight: 1,
63
- letterSpacing: "0.01em",
64
- borderRadius: "var(--lucent-radius-lg)",
65
- cursor: S ? "not-allowed" : "pointer",
66
- width: a ? "100%" : void 0,
67
- 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)",
68
- whiteSpace: "nowrap",
69
- boxSizing: "border-box",
70
- outline: "none",
71
- margin: 0,
72
- ...St[t],
73
- ...k && { padding: 0, aspectRatio: "1" },
74
- ...Dt[e],
75
- ...h,
76
- ...S && {
77
- background: "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)",
78
- color: "var(--lucent-text-disabled)",
79
- borderColor: "transparent"
80
- },
81
- // hide border entirely when bordered prop is false
82
- ...i === !1 && { border: "none" }
85
+ style: A,
86
+ ...E ? {
87
+ role: "link",
88
+ ...w ? { "aria-disabled": !0, tabIndex: -1 } : { href: d },
89
+ ...g !== void 0 && { target: g },
90
+ ...h !== void 0 && { rel: h }
91
+ } : {
92
+ disabled: w,
93
+ ...k !== void 0 && { type: k }
83
94
  },
84
- onMouseEnter: (v) => {
85
- var b;
86
- !S && !u && zt(v.currentTarget, e, i), (b = f.onMouseEnter) == null || b.call(f, v);
95
+ onMouseEnter: (D) => {
96
+ var C;
97
+ !w && !u && zt(D.currentTarget, e, i), (C = b.onMouseEnter) == null || C.call(b, D);
87
98
  },
88
- onMouseLeave: (v) => {
89
- var b;
90
- !S && !u && Tt(v.currentTarget, e, i), (b = f.onMouseLeave) == null || b.call(f, v);
99
+ onMouseLeave: (D) => {
100
+ var C;
101
+ !w && !u && Tt(D.currentTarget, e, i), (C = b.onMouseLeave) == null || C.call(b, D);
91
102
  },
92
- onMouseDown: (v) => {
93
- var b;
94
- if (!S) {
95
- const D = e === "danger" || e === "danger-outline" || e === "danger-ghost" ? "color-mix(in srgb, var(--lucent-danger-default) 40%, transparent)" : "color-mix(in srgb, var(--lucent-accent-default) 40%, transparent)";
96
- v.currentTarget.style.transform = "translateY(1px)", v.currentTarget.style.boxShadow = `0 0 0 4px ${D}`, v.currentTarget.dataset.pressed = "1";
103
+ onMouseDown: (D) => {
104
+ var C;
105
+ if (!w) {
106
+ const B = e === "danger" || e === "danger-outline" || e === "danger-ghost" ? "color-mix(in srgb, var(--lucent-danger-default) 40%, transparent)" : "color-mix(in srgb, var(--lucent-accent-default) 40%, transparent)";
107
+ D.currentTarget.style.transform = "translateY(1px)", D.currentTarget.style.boxShadow = `0 0 0 4px ${B}`, D.currentTarget.dataset.pressed = "1";
97
108
  }
98
- (b = f.onMouseDown) == null || b.call(f, v);
109
+ (C = b.onMouseDown) == null || C.call(b, D);
110
+ },
111
+ onMouseUp: (D) => {
112
+ var C;
113
+ D.currentTarget.style.transform = "", D.currentTarget.style.boxShadow = "", delete D.currentTarget.dataset.pressed, (C = b.onMouseUp) == null || C.call(b, D);
99
114
  },
100
- onMouseUp: (v) => {
101
- var b;
102
- v.currentTarget.style.transform = "", v.currentTarget.style.boxShadow = "", delete v.currentTarget.dataset.pressed, (b = f.onMouseUp) == null || b.call(f, v);
115
+ onFocus: (D) => {
116
+ var C;
117
+ D.currentTarget.dataset.pressed || (D.currentTarget.style.boxShadow = "0 0 0 3px var(--lucent-accent-subtle)"), (C = b.onFocus) == null || C.call(b, D);
103
118
  },
104
- onFocus: (v) => {
105
- var b;
106
- v.currentTarget.dataset.pressed || (v.currentTarget.style.boxShadow = "0 0 0 3px var(--lucent-accent-subtle)"), (b = f.onFocus) == null || b.call(f, v);
119
+ onBlur: (D) => {
120
+ var C;
121
+ D.currentTarget.style.boxShadow = "", (C = b.onBlur) == null || C.call(b, D);
107
122
  },
108
- onBlur: (v) => {
109
- var b;
110
- v.currentTarget.style.boxShadow = "", (b = f.onBlur) == null || b.call(f, v);
123
+ onClick: (D) => {
124
+ if (E && w) {
125
+ D.preventDefault();
126
+ return;
127
+ }
128
+ L == null || L(D);
111
129
  },
112
- ...f,
130
+ ...b,
113
131
  children: [
114
132
  r,
115
- s ? /* @__PURE__ */ p($t, {}) : d,
133
+ s ? /* @__PURE__ */ f($t, {}) : p,
116
134
  !s && o,
117
- !s && c && /* @__PURE__ */ p(Bt, { size: t })
135
+ !s && c && /* @__PURE__ */ f(Bt, { size: t })
118
136
  ]
119
137
  }
120
138
  );
@@ -139,15 +157,15 @@ function Tt(e, t, s) {
139
157
  const It = { "2xs": 8, xs: 10, sm: 12, md: 14, lg: 16 };
140
158
  function Bt({ size: e }) {
141
159
  const t = It[e];
142
- return /* @__PURE__ */ p("svg", { width: t, height: t, 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__ */ p("polyline", { points: "6 9 12 15 18 9" }) });
160
+ return /* @__PURE__ */ f("svg", { width: t, height: t, 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__ */ f("polyline", { points: "6 9 12 15 18 9" }) });
143
161
  }
144
162
  function $t() {
145
- return /* @__PURE__ */ I("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: [
146
- /* @__PURE__ */ p("style", { children: "@keyframes lucent-spin { to { transform: rotate(360deg); } }" }),
147
- /* @__PURE__ */ p("path", { d: "M12 2a10 10 0 0 1 10 10" })
163
+ return /* @__PURE__ */ T("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: [
164
+ /* @__PURE__ */ f("style", { children: "@keyframes lucent-spin { to { transform: rotate(360deg); } }" }),
165
+ /* @__PURE__ */ f("path", { d: "M12 2a10 10 0 0 1 10 10" })
148
166
  ] });
149
167
  }
150
- const Rt = {
168
+ const Lt = {
151
169
  sm: "calc(var(--lucent-space-8) * 0.5 + 16px)",
152
170
  md: "calc(var(--lucent-space-10) * 0.5 + 20px)",
153
171
  lg: "calc(var(--lucent-space-12) * 0.5 + 24px)"
@@ -181,70 +199,70 @@ const Rt = {
181
199
  style: i,
182
200
  ...d
183
201
  }, g) => {
184
- const h = u ?? `lucent-input-${Math.random().toString(36).slice(2, 7)}`, f = !!a, w = !!d.disabled, [S, k] = C(!1), [v, b] = C(!1), m = w ? "transparent" : f ? "var(--lucent-danger-default)" : S ? "var(--lucent-accent-border)" : v ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", D = S ? `0 0 0 3px ${f ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}` : "none", L = {
202
+ const h = u ?? `lucent-input-${Math.random().toString(36).slice(2, 7)}`, p = !!a, y = !!d.disabled, [I, k] = P(!1), [L, b] = P(!1), m = y ? "transparent" : p ? "var(--lucent-danger-default)" : I ? "var(--lucent-accent-border)" : L ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", w = I ? `0 0 0 3px ${p ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}` : "none", R = {
185
203
  display: "flex",
186
204
  alignItems: "center",
187
- color: w ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
205
+ color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
188
206
  fontSize: Pe[e],
189
207
  fontFamily: "var(--lucent-font-family-base)",
190
208
  whiteSpace: "nowrap",
191
209
  userSelect: "none",
192
210
  flexShrink: 0
193
- }, X = { ...L, paddingLeft: ee[e], paddingRight: "2px" }, O = { ...L, paddingLeft: "2px", paddingRight: ee[e] };
194
- return /* @__PURE__ */ I("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%", ...i }, children: [
195
- t && /* @__PURE__ */ p(
211
+ }, E = { ...R, paddingLeft: ee[e], paddingRight: "2px" }, X = { ...R, paddingLeft: "2px", paddingRight: ee[e] };
212
+ return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%", ...i }, children: [
213
+ t && /* @__PURE__ */ f(
196
214
  "label",
197
215
  {
198
216
  htmlFor: h,
199
217
  style: {
200
218
  fontSize: Me[e],
201
219
  fontWeight: "var(--lucent-font-weight-medium)",
202
- color: w ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
220
+ color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
203
221
  fontFamily: "var(--lucent-font-family-base)"
204
222
  },
205
223
  children: t
206
224
  }
207
225
  ),
208
- /* @__PURE__ */ I(
226
+ /* @__PURE__ */ T(
209
227
  "div",
210
228
  {
211
229
  style: {
212
230
  display: "flex",
213
231
  alignItems: "stretch",
214
- height: Rt[e],
232
+ height: Lt[e],
215
233
  border: `1px solid ${m}`,
216
234
  borderRadius: "var(--lucent-radius-lg)",
217
- boxShadow: D,
218
- background: w ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
235
+ boxShadow: w,
236
+ background: y ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
219
237
  overflow: "hidden",
220
- cursor: w ? "not-allowed" : void 0,
238
+ cursor: y ? "not-allowed" : void 0,
221
239
  transition: [
222
240
  "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
223
241
  "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)"
224
242
  ].join(", ")
225
243
  },
226
244
  onMouseEnter: () => {
227
- w || b(!0);
245
+ y || b(!0);
228
246
  },
229
247
  onMouseLeave: () => b(!1),
230
248
  children: [
231
- o && /* @__PURE__ */ p("span", { style: X, children: o }),
232
- /* @__PURE__ */ I("div", { style: { position: "relative", flex: 1, display: "flex", alignItems: "center", minWidth: 0 }, children: [
233
- n && /* @__PURE__ */ p("span", { style: {
249
+ o && /* @__PURE__ */ f("span", { style: E, children: o }),
250
+ /* @__PURE__ */ T("div", { style: { position: "relative", flex: 1, display: "flex", alignItems: "center", minWidth: 0 }, children: [
251
+ n && /* @__PURE__ */ f("span", { style: {
234
252
  position: "absolute",
235
253
  left: ee[e],
236
- color: w ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
254
+ color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
237
255
  display: "flex",
238
256
  alignItems: "center",
239
257
  pointerEvents: "none"
240
258
  }, children: n }),
241
- /* @__PURE__ */ p(
259
+ /* @__PURE__ */ f(
242
260
  "input",
243
261
  {
244
262
  ref: g,
245
263
  id: h,
246
- "aria-invalid": f,
247
- "aria-describedby": f ? `${h}-error` : s ? `${h}-helper` : void 0,
264
+ "aria-invalid": p,
265
+ "aria-describedby": p ? `${h}-error` : s ? `${h}-helper` : void 0,
248
266
  style: {
249
267
  width: "100%",
250
268
  height: "100%",
@@ -252,37 +270,37 @@ const Rt = {
252
270
  paddingRight: r ? We[e] : ee[e],
253
271
  fontSize: Pe[e],
254
272
  fontFamily: "var(--lucent-font-family-base)",
255
- color: w ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
273
+ color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
256
274
  background: "transparent",
257
275
  border: "none",
258
276
  outline: "none",
259
- cursor: w ? "not-allowed" : void 0,
277
+ cursor: y ? "not-allowed" : void 0,
260
278
  boxSizing: "border-box"
261
279
  },
262
280
  ...d,
263
281
  onFocus: (A) => {
264
- var N;
265
- k(!0), (N = d.onFocus) == null || N.call(d, A);
282
+ var D;
283
+ k(!0), (D = d.onFocus) == null || D.call(d, A);
266
284
  },
267
285
  onBlur: (A) => {
268
- var N;
269
- k(!1), (N = d.onBlur) == null || N.call(d, A);
286
+ var D;
287
+ k(!1), (D = d.onBlur) == null || D.call(d, A);
270
288
  }
271
289
  }
272
290
  ),
273
- r && /* @__PURE__ */ p("span", { style: {
291
+ r && /* @__PURE__ */ f("span", { style: {
274
292
  position: "absolute",
275
293
  right: ee[e],
276
- color: w ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
294
+ color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
277
295
  display: "flex",
278
296
  alignItems: "center"
279
297
  }, children: r })
280
298
  ] }),
281
- c && /* @__PURE__ */ p("span", { style: O, children: c })
299
+ c && /* @__PURE__ */ f("span", { style: X, children: c })
282
300
  ]
283
301
  }
284
302
  ),
285
- f && /* @__PURE__ */ p(
303
+ p && /* @__PURE__ */ f(
286
304
  "span",
287
305
  {
288
306
  id: `${h}-error`,
@@ -295,7 +313,7 @@ const Rt = {
295
313
  children: a
296
314
  }
297
315
  ),
298
- !f && s && /* @__PURE__ */ p(
316
+ !p && s && /* @__PURE__ */ f(
299
317
  "span",
300
318
  {
301
319
  id: `${h}-helper`,
@@ -311,20 +329,20 @@ const Rt = {
311
329
  }
312
330
  );
313
331
  te.displayName = "Input";
314
- const Lt = {
332
+ const Rt = {
315
333
  neutral: { bg: "var(--lucent-surface-secondary)", color: "var(--lucent-text-secondary)", border: "var(--lucent-border-default)" },
316
334
  accent: { bg: "var(--lucent-accent-default)", color: "var(--lucent-accent-fg)", border: "var(--lucent-accent-default)" },
317
335
  success: { bg: "var(--lucent-success-subtle)", color: "var(--lucent-success-text)", border: "var(--lucent-success-subtle)" },
318
336
  warning: { bg: "var(--lucent-warning-subtle)", color: "var(--lucent-warning-text)", border: "var(--lucent-warning-subtle)" },
319
337
  danger: { bg: "var(--lucent-danger-subtle)", color: "var(--lucent-danger-text)", border: "var(--lucent-danger-subtle)" },
320
338
  info: { bg: "var(--lucent-info-subtle)", color: "var(--lucent-info-text)", border: "var(--lucent-info-subtle)" }
321
- }, Ct = {
339
+ }, Ft = {
322
340
  sm: { fontSize: "var(--lucent-font-size-xs)", padding: "0 var(--lucent-space-2)", height: "18px" },
323
341
  md: { fontSize: "var(--lucent-font-size-sm)", padding: "0 var(--lucent-space-2)", height: "22px" }
324
342
  };
325
343
  function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a, style: n }) {
326
- const r = Lt[e], o = Ct[t];
327
- return /* @__PURE__ */ I("span", { style: {
344
+ const r = Rt[e], o = Ft[t];
345
+ return /* @__PURE__ */ T("span", { style: {
328
346
  display: "inline-flex",
329
347
  alignItems: "center",
330
348
  gap: "var(--lucent-space-1)",
@@ -342,7 +360,7 @@ function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a,
342
360
  boxSizing: "border-box",
343
361
  ...n
344
362
  }, children: [
345
- s && /* @__PURE__ */ p("span", { style: {
363
+ s && /* @__PURE__ */ f("span", { style: {
346
364
  width: 6,
347
365
  height: 6,
348
366
  borderRadius: "var(--lucent-radius-full)",
@@ -352,7 +370,7 @@ function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a,
352
370
  a
353
371
  ] });
354
372
  }
355
- const Ft = { sm: "calc(var(--lucent-space-8) * 0.5 + 16px)", md: "calc(var(--lucent-space-10) * 0.5 + 20px)", lg: "calc(var(--lucent-space-12) * 0.5 + 24px)" }, Pt = {
373
+ const Ct = { sm: "calc(var(--lucent-space-8) * 0.5 + 16px)", md: "calc(var(--lucent-space-10) * 0.5 + 20px)", lg: "calc(var(--lucent-space-12) * 0.5 + 24px)" }, Pt = {
356
374
  sm: { track: [28, 16], thumb: 12 },
357
375
  md: { track: [36, 20], thumb: 16 },
358
376
  lg: { track: [44, 24], thumb: 20 }
@@ -378,29 +396,29 @@ function ln({
378
396
  style: d,
379
397
  ...g
380
398
  }) {
381
- const h = u ?? `lucent-toggle-${Math.random().toString(36).slice(2, 7)}`, f = s !== void 0, [w, S] = C(a ?? !1), k = f ? !!s : w, v = U(k), [b, m] = C(0), [D, L] = C(!1);
399
+ const h = u ?? `lucent-toggle-${Math.random().toString(36).slice(2, 7)}`, p = s !== void 0, [y, I] = P(a ?? !1), k = p ? !!s : y, L = q(k), [b, m] = P(0), [w, R] = P(!1);
382
400
  ne(() => {
383
- if (!c && v.current !== k) {
384
- v.current = k, m((G) => G + 1), L(!0);
385
- const E = setTimeout(() => L(!1), 150);
386
- return () => clearTimeout(E);
401
+ if (!c && L.current !== k) {
402
+ L.current = k, m((_) => _ + 1), R(!0);
403
+ const j = setTimeout(() => R(!1), 150);
404
+ return () => clearTimeout(j);
387
405
  }
388
406
  }, [k, c]);
389
- const { track: [X, O], thumb: A } = Pt[t], N = k ? X - A - 2 : 2, Z = (E) => {
390
- f || S(E.target.checked), i == null || i(E);
391
- }, K = /* @__PURE__ */ I(
407
+ const { track: [E, X], thumb: A } = Pt[t], D = k ? E - A - 2 : 2, C = (j) => {
408
+ p || I(j.target.checked), i == null || i(j);
409
+ }, K = /* @__PURE__ */ T(
392
410
  "span",
393
411
  {
394
412
  "aria-hidden": !0,
395
413
  style: {
396
414
  position: "relative",
397
- width: X,
398
- height: O,
399
- borderRadius: O / 2,
415
+ width: E,
416
+ height: X,
417
+ borderRadius: X / 2,
400
418
  flexShrink: 0
401
419
  },
402
420
  children: [
403
- /* @__PURE__ */ p(
421
+ /* @__PURE__ */ f(
404
422
  "span",
405
423
  {
406
424
  style: {
@@ -414,14 +432,14 @@ function ln({
414
432
  },
415
433
  b
416
434
  ),
417
- /* @__PURE__ */ p(
435
+ /* @__PURE__ */ f(
418
436
  "span",
419
437
  {
420
438
  style: {
421
439
  position: "absolute",
422
440
  top: 2,
423
- left: N,
424
- width: D ? A * 1.3 : A,
441
+ left: D,
442
+ width: w ? A * 1.3 : A,
425
443
  height: A,
426
444
  borderRadius: A,
427
445
  background: "#ffffff",
@@ -432,7 +450,7 @@ function ln({
432
450
  )
433
451
  ]
434
452
  }
435
- ), $ = /* @__PURE__ */ I(
453
+ ), B = /* @__PURE__ */ T(
436
454
  "label",
437
455
  {
438
456
  style: {
@@ -448,27 +466,27 @@ function ln({
448
466
  ...n ? {} : d
449
467
  },
450
468
  children: [
451
- /* @__PURE__ */ p(
469
+ /* @__PURE__ */ f(
452
470
  "input",
453
471
  {
454
472
  type: "checkbox",
455
473
  role: "switch",
456
474
  id: h,
457
- checked: f ? s : w,
475
+ checked: p ? s : y,
458
476
  disabled: c,
459
- onChange: Z,
477
+ onChange: C,
460
478
  "aria-checked": k,
461
479
  style: { position: "absolute", opacity: 0, width: 0, height: 0, margin: 0, pointerEvents: "none" },
462
480
  ...g
463
481
  }
464
482
  ),
465
483
  o === "left" && K,
466
- e || r ? /* @__PURE__ */ I("span", { style: { display: "flex", flexDirection: "column", flex: o === "right" ? 1 : void 0 }, children: [
467
- e && /* @__PURE__ */ p("span", { style: {
484
+ e || r ? /* @__PURE__ */ T("span", { style: { display: "flex", flexDirection: "column", flex: o === "right" ? 1 : void 0 }, children: [
485
+ e && /* @__PURE__ */ f("span", { style: {
468
486
  fontWeight: r ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
469
487
  lineHeight: r ? 1.3 : 1
470
488
  }, children: e }),
471
- r && /* @__PURE__ */ p("span", { style: {
489
+ r && /* @__PURE__ */ f("span", { style: {
472
490
  fontSize: "var(--lucent-font-size-xs)",
473
491
  color: c ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
474
492
  marginTop: "2px"
@@ -478,29 +496,29 @@ function ln({
478
496
  ]
479
497
  }
480
498
  );
481
- return /* @__PURE__ */ I(Ve, { children: [
482
- /* @__PURE__ */ p("style", { children: Wt }),
483
- n ? /* @__PURE__ */ p(
499
+ return /* @__PURE__ */ T(Ve, { children: [
500
+ /* @__PURE__ */ f("style", { children: Wt }),
501
+ n ? /* @__PURE__ */ f(
484
502
  "div",
485
503
  {
486
504
  style: {
487
505
  border: "1px solid var(--lucent-border-strong)",
488
506
  borderRadius: "var(--lucent-radius-lg)",
489
- ...r ? { padding: "var(--lucent-space-3)" } : { minHeight: Ft[t], padding: "0 var(--lucent-space-3)", display: "flex", alignItems: "center" },
507
+ ...r ? { padding: "var(--lucent-space-3)" } : { minHeight: Ct[t], padding: "0 var(--lucent-space-3)", display: "flex", alignItems: "center" },
490
508
  background: k && !c ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "transparent",
491
509
  transition: "border-color var(--lucent-duration-fast) var(--lucent-easing-default), background var(--lucent-duration-fast) var(--lucent-easing-default)",
492
510
  cursor: c ? "not-allowed" : "pointer",
493
511
  ...d
494
512
  },
495
- onClick: (E) => {
496
- if (!c && E.target === E.currentTarget) {
497
- const G = E.currentTarget.querySelector("input");
498
- G == null || G.click();
513
+ onClick: (j) => {
514
+ if (!c && j.target === j.currentTarget) {
515
+ const _ = j.currentTarget.querySelector("input");
516
+ _ == null || _.click();
499
517
  }
500
518
  },
501
- children: $
519
+ children: B
502
520
  }
503
- ) : $
521
+ ) : B
504
522
  ] });
505
523
  }
506
524
  const Ht = {
@@ -521,22 +539,22 @@ const Ht = {
521
539
  lg: "var(--lucent-space-3)"
522
540
  }, Ze = xe(
523
541
  ({ options: e, size: t = "md", label: s, helperText: a, errorText: n, placeholder: r, disabled: o, id: c, style: u, ...i }, d) => {
524
- const g = c ?? `lucent-select-${Math.random().toString(36).slice(2, 7)}`, h = !!n, f = !!o, [w, S] = C(!1), [k, v] = C(!1), b = f ? "transparent" : h ? "var(--lucent-danger-default)" : w ? "var(--lucent-accent-border)" : k ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", m = w ? `0 0 0 3px ${h ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}` : "none";
525
- return /* @__PURE__ */ I("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%", ...u }, children: [
526
- s && /* @__PURE__ */ p(
542
+ const g = c ?? `lucent-select-${Math.random().toString(36).slice(2, 7)}`, h = !!n, p = !!o, [y, I] = P(!1), [k, L] = P(!1), b = p ? "transparent" : h ? "var(--lucent-danger-default)" : y ? "var(--lucent-accent-border)" : k ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", m = y ? `0 0 0 3px ${h ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}` : "none";
543
+ return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%", ...u }, children: [
544
+ s && /* @__PURE__ */ f(
527
545
  "label",
528
546
  {
529
547
  htmlFor: g,
530
548
  style: {
531
549
  fontSize: ze[t],
532
550
  fontWeight: "var(--lucent-font-weight-medium)",
533
- color: f ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
551
+ color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
534
552
  fontFamily: "var(--lucent-font-family-base)"
535
553
  },
536
554
  children: s
537
555
  }
538
556
  ),
539
- /* @__PURE__ */ I(
557
+ /* @__PURE__ */ T(
540
558
  "div",
541
559
  {
542
560
  style: {
@@ -547,19 +565,19 @@ const Ht = {
547
565
  border: `1px solid ${b}`,
548
566
  borderRadius: "var(--lucent-radius-lg)",
549
567
  boxShadow: m,
550
- background: f ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
551
- cursor: f ? "not-allowed" : "pointer",
568
+ background: p ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
569
+ cursor: p ? "not-allowed" : "pointer",
552
570
  transition: [
553
571
  "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
554
572
  "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)"
555
573
  ].join(", ")
556
574
  },
557
575
  onMouseEnter: () => {
558
- f || v(!0);
576
+ p || L(!0);
559
577
  },
560
- onMouseLeave: () => v(!1),
578
+ onMouseLeave: () => L(!1),
561
579
  children: [
562
- /* @__PURE__ */ I(
580
+ /* @__PURE__ */ T(
563
581
  "select",
564
582
  {
565
583
  ref: d,
@@ -573,34 +591,34 @@ const Ht = {
573
591
  padding: `0 var(--lucent-space-8) 0 ${Ne[t]}`,
574
592
  fontSize: Nt[t],
575
593
  fontFamily: "var(--lucent-font-family-base)",
576
- color: f ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
594
+ color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
577
595
  background: "transparent",
578
596
  border: "none",
579
597
  borderRadius: "var(--lucent-radius-lg)",
580
598
  outline: "none",
581
599
  appearance: "none",
582
- cursor: f ? "not-allowed" : "pointer",
600
+ cursor: p ? "not-allowed" : "pointer",
583
601
  boxSizing: "border-box"
584
602
  },
585
- onFocus: (D) => {
586
- var L;
587
- f || S(!0), (L = i.onFocus) == null || L.call(i, D);
603
+ onFocus: (w) => {
604
+ var R;
605
+ p || I(!0), (R = i.onFocus) == null || R.call(i, w);
588
606
  },
589
- onBlur: (D) => {
590
- var L;
591
- S(!1), (L = i.onBlur) == null || L.call(i, D);
607
+ onBlur: (w) => {
608
+ var R;
609
+ I(!1), (R = i.onBlur) == null || R.call(i, w);
592
610
  },
593
611
  onMouseDown: () => {
594
- f || S(!0);
612
+ p || I(!0);
595
613
  },
596
614
  ...i,
597
615
  children: [
598
- r && /* @__PURE__ */ p("option", { value: "", disabled: !0, children: r }),
599
- e.map((D) => /* @__PURE__ */ p("option", { value: D.value, disabled: D.disabled, children: D.label }, D.value))
616
+ r && /* @__PURE__ */ f("option", { value: "", disabled: !0, children: r }),
617
+ e.map((w) => /* @__PURE__ */ f("option", { value: w.value, disabled: w.disabled, children: w.label }, w.value))
600
618
  ]
601
619
  }
602
620
  ),
603
- /* @__PURE__ */ p(
621
+ /* @__PURE__ */ f(
604
622
  "span",
605
623
  {
606
624
  "aria-hidden": !0,
@@ -608,17 +626,17 @@ const Ht = {
608
626
  position: "absolute",
609
627
  right: Ne[t],
610
628
  pointerEvents: "none",
611
- color: f ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
629
+ color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
612
630
  display: "flex",
613
631
  alignItems: "center"
614
632
  },
615
- children: /* @__PURE__ */ p("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ p("polyline", { points: "6 9 12 15 18 9" }) })
633
+ children: /* @__PURE__ */ f("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", children: /* @__PURE__ */ f("polyline", { points: "6 9 12 15 18 9" }) })
616
634
  }
617
635
  )
618
636
  ]
619
637
  }
620
638
  ),
621
- h && /* @__PURE__ */ p(
639
+ h && /* @__PURE__ */ f(
622
640
  "span",
623
641
  {
624
642
  id: `${g}-error`,
@@ -631,7 +649,7 @@ const Ht = {
631
649
  children: n
632
650
  }
633
651
  ),
634
- !h && a && /* @__PURE__ */ p(
652
+ !h && a && /* @__PURE__ */ f(
635
653
  "span",
636
654
  {
637
655
  id: `${g}-helper`,
@@ -707,7 +725,7 @@ function cn({
707
725
  },
708
726
  ...i
709
727
  };
710
- return /* @__PURE__ */ p(e, { style: g, ...d, children: u });
728
+ return /* @__PURE__ */ f(e, { style: g, ...d, children: u });
711
729
  }
712
730
  const Ut = { sm: "3px", md: "4px", lg: "5px" }, qt = { sm: "14px", md: "18px", lg: "22px" }, Gt = `
713
731
  .lucent-slider {
@@ -818,14 +836,14 @@ function un({
818
836
  style: g,
819
837
  ...h
820
838
  }) {
821
- const f = i ?? `lucent-slider-${Math.random().toString(36).slice(2, 7)}`, w = o !== void 0, [S, k] = C(
839
+ const p = i ?? `lucent-slider-${Math.random().toString(36).slice(2, 7)}`, y = o !== void 0, [I, k] = P(
822
840
  c ?? Math.round((a + n) / 2)
823
- ), v = w ? o : S, b = `${(v - a) / (n - a) * 100}%`, m = (D) => {
824
- w || k(Number(D.target.value)), d == null || d(D);
841
+ ), L = y ? o : I, b = `${(L - a) / (n - a) * 100}%`, m = (w) => {
842
+ y || k(Number(w.target.value)), d == null || d(w);
825
843
  };
826
- return /* @__PURE__ */ I(Ve, { children: [
827
- /* @__PURE__ */ p("style", { children: Gt }),
828
- /* @__PURE__ */ I(
844
+ return /* @__PURE__ */ T(Ve, { children: [
845
+ /* @__PURE__ */ f("style", { children: Gt }),
846
+ /* @__PURE__ */ T(
829
847
  "div",
830
848
  {
831
849
  style: {
@@ -837,7 +855,7 @@ function un({
837
855
  ...g
838
856
  },
839
857
  children: [
840
- (e || t) && /* @__PURE__ */ I(
858
+ (e || t) && /* @__PURE__ */ T(
841
859
  "div",
842
860
  {
843
861
  style: {
@@ -846,10 +864,10 @@ function un({
846
864
  alignItems: "baseline"
847
865
  },
848
866
  children: [
849
- e && /* @__PURE__ */ p(
867
+ e && /* @__PURE__ */ f(
850
868
  "label",
851
869
  {
852
- htmlFor: f,
870
+ htmlFor: p,
853
871
  style: {
854
872
  fontSize: "var(--lucent-font-size-sm)",
855
873
  fontWeight: "var(--lucent-font-weight-medium)",
@@ -859,7 +877,7 @@ function un({
859
877
  children: e
860
878
  }
861
879
  ),
862
- t && /* @__PURE__ */ p(
880
+ t && /* @__PURE__ */ f(
863
881
  "span",
864
882
  {
865
883
  style: {
@@ -867,23 +885,23 @@ function un({
867
885
  color: u ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
868
886
  fontVariantNumeric: "tabular-nums"
869
887
  },
870
- children: v
888
+ children: L
871
889
  }
872
890
  )
873
891
  ]
874
892
  }
875
893
  ),
876
- /* @__PURE__ */ p(
894
+ /* @__PURE__ */ f(
877
895
  "input",
878
896
  {
879
897
  type: "range",
880
- id: f,
898
+ id: p,
881
899
  className: "lucent-slider",
882
900
  min: a,
883
901
  max: n,
884
902
  step: r,
885
903
  disabled: u,
886
- value: w ? o : S,
904
+ value: y ? o : I,
887
905
  onChange: m,
888
906
  style: {
889
907
  "--ls-track-h": Ut[s],
@@ -922,29 +940,29 @@ function Je({
922
940
  id: c,
923
941
  style: u
924
942
  }) {
925
- var v;
926
- const [i, d] = C(
927
- s ?? ((v = e[0]) == null ? void 0 : v.value) ?? ""
928
- ), g = t !== void 0 ? t : i, h = U(null), [f, w] = C(null), S = U(!1);
943
+ var L;
944
+ const [i, d] = P(
945
+ s ?? ((L = e[0]) == null ? void 0 : L.value) ?? ""
946
+ ), g = t !== void 0 ? t : i, h = q(null), [p, y] = P(null), I = q(!1);
929
947
  me(() => {
930
948
  const b = h.current;
931
949
  if (!b) return;
932
950
  const m = () => {
933
- const L = b.querySelector(`[data-sc-value="${g}"]`);
934
- L && (w({
935
- left: L.offsetLeft,
936
- width: L.offsetWidth,
937
- animate: S.current
938
- }), S.current = !0);
951
+ const R = b.querySelector(`[data-sc-value="${g}"]`);
952
+ R && (y({
953
+ left: R.offsetLeft,
954
+ width: R.offsetWidth,
955
+ animate: I.current
956
+ }), I.current = !0);
939
957
  };
940
958
  m();
941
- const D = new ResizeObserver(m);
942
- return D.observe(b), () => D.disconnect();
959
+ const w = new ResizeObserver(m);
960
+ return w.observe(b), () => w.disconnect();
943
961
  }, [g, e]);
944
962
  const k = (b) => {
945
963
  r || b.disabled || (t === void 0 && d(b.value), a == null || a(b.value));
946
964
  };
947
- return /* @__PURE__ */ I(
965
+ return /* @__PURE__ */ T(
948
966
  "div",
949
967
  {
950
968
  id: c,
@@ -966,35 +984,35 @@ function Je({
966
984
  ...u
967
985
  },
968
986
  children: [
969
- f && /* @__PURE__ */ p(
987
+ p && /* @__PURE__ */ f(
970
988
  "span",
971
989
  {
972
990
  "aria-hidden": !0,
973
991
  style: {
974
992
  position: "absolute",
975
993
  top: 3,
976
- left: f.left + 3,
977
- width: f.width - 6,
994
+ left: p.left + 3,
995
+ width: p.width - 6,
978
996
  height: "calc(100% - 6px)",
979
997
  background: "var(--lucent-surface)",
980
998
  borderRadius: "var(--lucent-radius-lg)",
981
999
  boxShadow: "var(--lucent-shadow-sm)",
982
- transition: f.animate ? "left var(--lucent-duration-base) cubic-bezier(0.34, 1.56, 0.64, 1), width var(--lucent-duration-base) cubic-bezier(0.22, 1, 0.36, 1)" : "none",
1000
+ transition: p.animate ? "left var(--lucent-duration-base) cubic-bezier(0.34, 1.56, 0.64, 1), width var(--lucent-duration-base) cubic-bezier(0.22, 1, 0.36, 1)" : "none",
983
1001
  zIndex: 0,
984
1002
  pointerEvents: "none"
985
1003
  }
986
1004
  }
987
1005
  ),
988
1006
  e.map((b) => {
989
- const m = b.value === g, D = r || !!b.disabled;
990
- return /* @__PURE__ */ p(
1007
+ const m = b.value === g, w = r || !!b.disabled;
1008
+ return /* @__PURE__ */ f(
991
1009
  "button",
992
1010
  {
993
1011
  "data-sc-value": b.value,
994
1012
  type: "button",
995
1013
  role: "radio",
996
1014
  "aria-checked": m,
997
- disabled: D,
1015
+ disabled: w,
998
1016
  onClick: () => k(b),
999
1017
  style: {
1000
1018
  position: "relative",
@@ -1009,11 +1027,11 @@ function Je({
1009
1027
  fontSize: _t[n],
1010
1028
  fontFamily: "var(--lucent-font-family-base)",
1011
1029
  fontWeight: m ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1012
- color: D ? "var(--lucent-text-disabled)" : m ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1030
+ color: w ? "var(--lucent-text-disabled)" : m ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1013
1031
  background: "transparent",
1014
1032
  border: "none",
1015
1033
  borderRadius: "var(--lucent-radius-lg)",
1016
- cursor: D ? "not-allowed" : "pointer",
1034
+ cursor: w ? "not-allowed" : "pointer",
1017
1035
  outline: "none",
1018
1036
  whiteSpace: "nowrap",
1019
1037
  transition: [
@@ -1021,11 +1039,11 @@ function Je({
1021
1039
  "font-weight var(--lucent-duration-fast) var(--lucent-easing-default)"
1022
1040
  ].join(", ")
1023
1041
  },
1024
- onFocus: (L) => {
1025
- L.currentTarget.matches(":focus-visible") && (L.currentTarget.style.boxShadow = "0 0 0 2px var(--lucent-accent-subtle)");
1042
+ onFocus: (R) => {
1043
+ R.currentTarget.matches(":focus-visible") && (R.currentTarget.style.boxShadow = "0 0 0 2px var(--lucent-accent-subtle)");
1026
1044
  },
1027
- onBlur: (L) => {
1028
- L.currentTarget.style.boxShadow = "";
1045
+ onBlur: (R) => {
1046
+ R.currentTarget.style.boxShadow = "";
1029
1047
  },
1030
1048
  children: b.label
1031
1049
  },
@@ -1079,8 +1097,8 @@ const de = xe(({
1079
1097
  onClick: i,
1080
1098
  ...d
1081
1099
  }, g) => {
1082
- const h = Kt[t], f = s === "circle" ? "50%" : Yt[t];
1083
- return /* @__PURE__ */ p(
1100
+ const h = Kt[t], p = s === "circle" ? "50%" : Yt[t];
1101
+ return /* @__PURE__ */ f(
1084
1102
  "button",
1085
1103
  {
1086
1104
  ref: g,
@@ -1093,7 +1111,7 @@ const de = xe(({
1093
1111
  flexShrink: 0,
1094
1112
  ...a ? Jt(e) : { background: e },
1095
1113
  border: "none",
1096
- borderRadius: f,
1114
+ borderRadius: p,
1097
1115
  cursor: r ? "not-allowed" : i ? "pointer" : "default",
1098
1116
  padding: 0,
1099
1117
  outline: "none",
@@ -1102,11 +1120,11 @@ const de = xe(({
1102
1120
  transition: "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)",
1103
1121
  ...o
1104
1122
  },
1105
- onFocus: (w) => {
1106
- r || (w.currentTarget.style.boxShadow = Zt), c == null || c(w);
1123
+ onFocus: (y) => {
1124
+ r || (y.currentTarget.style.boxShadow = Zt), c == null || c(y);
1107
1125
  },
1108
- onBlur: (w) => {
1109
- w.currentTarget.style.boxShadow = n ? Oe : Ae, u == null || u(w);
1126
+ onBlur: (y) => {
1127
+ y.currentTarget.style.boxShadow = n ? Oe : Ae, u == null || u(y);
1110
1128
  },
1111
1129
  ...d
1112
1130
  }
@@ -1138,12 +1156,12 @@ function fe(e, t, s) {
1138
1156
  let u = 0, i = 0, d = 0;
1139
1157
  return e < 60 ? (u = r, i = o) : e < 120 ? (u = o, i = r) : e < 180 ? (i = r, d = o) : e < 240 ? (i = o, d = r) : e < 300 ? (u = o, d = r) : (u = r, d = o), { r: Math.round((u + c) * 255), g: Math.round((i + c) * 255), b: Math.round((d + c) * 255) };
1140
1158
  }
1141
- function Le(e) {
1159
+ function Re(e) {
1142
1160
  const t = e.replace("#", "");
1143
1161
  return t.length === 3 ? `#${t[0]}${t[0]}${t[1]}${t[1]}${t[2]}${t[2]}` : t.length === 6 || t.length === 8 ? `#${t}` : "#000000";
1144
1162
  }
1145
1163
  function Qe(e) {
1146
- const t = Le(e);
1164
+ const t = Re(e);
1147
1165
  return {
1148
1166
  r: parseInt(t.slice(1, 3), 16),
1149
1167
  g: parseInt(t.slice(3, 5), 16),
@@ -1158,7 +1176,7 @@ function $e({ r: e, g: t, b: s, a }) {
1158
1176
  function et({ h: e, s: t, v: s, a }) {
1159
1177
  return { ...Qt(e, t, s), a };
1160
1178
  }
1161
- function q({ r: e, g: t, b: s, a }) {
1179
+ function G({ r: e, g: t, b: s, a }) {
1162
1180
  return { ...ea(e, t, s), a };
1163
1181
  }
1164
1182
  function oe(e) {
@@ -1167,7 +1185,7 @@ function oe(e) {
1167
1185
  function le(e) {
1168
1186
  const t = e.trim();
1169
1187
  if (t.startsWith("#")) {
1170
- const n = Le(t);
1188
+ const n = Re(t);
1171
1189
  return /^#[0-9a-f]{6}([0-9a-f]{2})?$/i.test(n) ? Qe(n) : null;
1172
1190
  }
1173
1191
  const s = t.match(/^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})(?:\s*,\s*([\d.]+))?\s*\)$/);
@@ -1204,11 +1222,11 @@ const aa = [
1204
1222
  "linear-gradient(-45deg, transparent 75%, #c0c0c0 75%)"
1205
1223
  ].join(", ");
1206
1224
  function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatTooltip: r }) {
1207
- const o = U(null), [c, u] = C(!1), i = ue((g) => {
1208
- const h = o.current.getBoundingClientRect(), f = pe((g.clientX - h.left) / h.width, 0, 1);
1209
- a(t + f * (s - t));
1225
+ const o = q(null), [c, u] = P(!1), i = ue((g) => {
1226
+ const h = o.current.getBoundingClientRect(), p = pe((g.clientX - h.left) / h.width, 0, 1);
1227
+ a(t + p * (s - t));
1210
1228
  }, [t, s, a]), d = (e - t) / (s - t) * 100;
1211
- return /* @__PURE__ */ p(
1229
+ return /* @__PURE__ */ f(
1212
1230
  "div",
1213
1231
  {
1214
1232
  ref: o,
@@ -1221,7 +1239,7 @@ function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatToolti
1221
1239
  },
1222
1240
  onPointerUp: () => u(!1),
1223
1241
  onPointerCancel: () => u(!1),
1224
- children: /* @__PURE__ */ p(
1242
+ children: /* @__PURE__ */ f(
1225
1243
  "div",
1226
1244
  {
1227
1245
  style: {
@@ -1238,7 +1256,7 @@ function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatToolti
1238
1256
  zIndex: 1,
1239
1257
  pointerEvents: "none"
1240
1258
  },
1241
- children: c && r && /* @__PURE__ */ p("div", { style: {
1259
+ children: c && r && /* @__PURE__ */ f("div", { style: {
1242
1260
  position: "absolute",
1243
1261
  bottom: "100%",
1244
1262
  left: "50%",
@@ -1260,10 +1278,10 @@ function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatToolti
1260
1278
  );
1261
1279
  }
1262
1280
  function ra() {
1263
- return /* @__PURE__ */ I("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, children: [
1264
- /* @__PURE__ */ p("path", { d: "M2 22l1-1h3l9-9" }),
1265
- /* @__PURE__ */ p("path", { d: "M3 21v-3l9-9" }),
1266
- /* @__PURE__ */ p("path", { d: "M15 6l3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
1281
+ return /* @__PURE__ */ T("svg", { width: 14, height: 14, viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: 2, strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": !0, children: [
1282
+ /* @__PURE__ */ f("path", { d: "M2 22l1-1h3l9-9" }),
1283
+ /* @__PURE__ */ f("path", { d: "M3 21v-3l9-9" }),
1284
+ /* @__PURE__ */ f("path", { d: "M15 6l3.4-3.4a2.1 2.1 0 1 1 3 3L18 9l.4.4a2.1 2.1 0 1 1-3 3l-3.8-3.8a2.1 2.1 0 1 1 3-3l.4.4Z" })
1267
1285
  ] });
1268
1286
  }
1269
1287
  function sa({
@@ -1278,66 +1296,66 @@ function sa({
1278
1296
  id: u,
1279
1297
  style: i
1280
1298
  }) {
1281
- var M, F;
1282
- const d = a === "sm" ? 24 : 40, g = Ke(), h = u ?? g, [f, w] = C(!1), [S, k] = C("hex"), [v, b] = C(0), [m, D] = C(() => {
1299
+ var S, W;
1300
+ const d = a === "sm" ? 24 : 40, g = Ke(), h = u ?? g, [p, y] = P(!1), [I, k] = P("hex"), [L, b] = P(0), [m, w] = P(() => {
1283
1301
  const l = e ? le(e) ?? { r: 0, g: 0, b: 0, a: 1 } : { r: 0, g: 0, b: 0, a: 1 };
1284
- return q(l);
1285
- }), [L, X] = C(() => oe(m).slice(1).toUpperCase()), O = U(null), A = U(null), N = U(null), [Z, K] = C({ top: 0, left: 0 });
1302
+ return G(l);
1303
+ }), [R, E] = P(() => oe(m).slice(1).toUpperCase()), X = q(null), A = q(null), D = q(null), [C, K] = P({ top: 0, left: 0 });
1286
1304
  me(() => {
1287
- if (!f || !O.current) return;
1288
- const l = O.current.getBoundingClientRect();
1305
+ if (!p || !X.current) return;
1306
+ const l = X.current.getBoundingClientRect();
1289
1307
  let x = l.left;
1290
- const T = l.bottom + 8;
1291
- if (N.current) {
1292
- const B = N.current.offsetWidth;
1293
- x + B > window.innerWidth && (x = l.right - B);
1308
+ const z = l.bottom + 8;
1309
+ if (D.current) {
1310
+ const $ = D.current.offsetWidth;
1311
+ x + $ > window.innerWidth && (x = l.right - $);
1294
1312
  }
1295
- K({ top: T, left: x });
1296
- }, [f]), ne(() => {
1313
+ K({ top: z, left: x });
1314
+ }, [p]), ne(() => {
1297
1315
  if (!e) return;
1298
1316
  const l = le(e);
1299
- l && (D(q(l)), X($e(l).slice(1).toUpperCase()));
1317
+ l && (w(G(l)), E($e(l).slice(1).toUpperCase()));
1300
1318
  }, [e]), ne(() => {
1301
- if (!f) return;
1319
+ if (!p) return;
1302
1320
  const l = (x) => {
1303
- var B, H;
1304
- const T = x.target;
1305
- (B = O.current) != null && B.contains(T) || (H = N.current) != null && H.contains(T) || w(!1);
1321
+ var $, O;
1322
+ const z = x.target;
1323
+ ($ = X.current) != null && $.contains(z) || (O = D.current) != null && O.contains(z) || y(!1);
1306
1324
  };
1307
1325
  return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
1308
- }, [f]);
1309
- const $ = ue((l) => {
1310
- D(l);
1326
+ }, [p]);
1327
+ const B = ue((l) => {
1328
+ w(l);
1311
1329
  const x = oe(l);
1312
- X(x.slice(1).toUpperCase()), t == null || t(x);
1313
- }, [t]), E = ue((l) => {
1314
- const x = A.current.getBoundingClientRect(), T = Math.round(pe((l.clientX - x.left) / x.width, 0, 1) * 100), B = Math.round((1 - pe((l.clientY - x.top) / x.height, 0, 1)) * 100);
1315
- $({ ...m, s: T, v: B });
1316
- }, [m, $]), G = ue(async () => {
1330
+ E(x.slice(1).toUpperCase()), t == null || t(x);
1331
+ }, [t]), j = ue((l) => {
1332
+ const x = A.current.getBoundingClientRect(), z = Math.round(pe((l.clientX - x.left) / x.width, 0, 1) * 100), $ = Math.round((1 - pe((l.clientY - x.top) / x.height, 0, 1)) * 100);
1333
+ B({ ...m, s: z, v: $ });
1334
+ }, [m, B]), _ = ue(async () => {
1317
1335
  if ("EyeDropper" in window)
1318
1336
  try {
1319
1337
  const l = await new window.EyeDropper().open(), x = le(l.sRGBHex);
1320
- x && $(q(x));
1338
+ x && B(G(x));
1321
1339
  } catch {
1322
1340
  }
1323
- }, [$]), W = et(m), j = ta(W.r, W.g, W.b), ae = oe(m), Se = oe({ ...m, a: 1 }), Y = Math.round(m.a * 100), y = [
1341
+ }, [B]), N = et(m), U = ta(N.r, N.g, N.b), ae = oe(m), Se = oe({ ...m, a: 1 }), Z = Math.round(m.a * 100), v = [
1324
1342
  { id: "hex", label: "Hex" },
1325
1343
  { id: "rgb", label: "RGB" },
1326
1344
  { id: "hsl", label: "HSL" },
1327
1345
  { id: "hsb", label: "HSB" }
1328
- ], R = typeof window < "u" && "EyeDropper" in window;
1329
- return /* @__PURE__ */ I(
1346
+ ], F = typeof window < "u" && "EyeDropper" in window;
1347
+ return /* @__PURE__ */ T(
1330
1348
  "div",
1331
1349
  {
1332
- ref: O,
1350
+ ref: X,
1333
1351
  style: { display: "inline-flex", flexDirection: n ? "row" : "column", alignItems: n ? "center" : void 0, gap: "var(--lucent-space-1)", position: "relative", ...i },
1334
1352
  children: [
1335
- /* @__PURE__ */ p("style", { children: `
1353
+ /* @__PURE__ */ f("style", { children: `
1336
1354
  .lucent-cp-field::-webkit-outer-spin-button,
1337
1355
  .lucent-cp-field::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
1338
1356
  .lucent-cp-field { -moz-appearance: textfield; }
1339
1357
  ` }),
1340
- s && !n && /* @__PURE__ */ p(
1358
+ s && !n && /* @__PURE__ */ f(
1341
1359
  "label",
1342
1360
  {
1343
1361
  htmlFor: `${h}-swatch`,
@@ -1350,26 +1368,26 @@ function sa({
1350
1368
  children: s
1351
1369
  }
1352
1370
  ),
1353
- /* @__PURE__ */ p(
1371
+ /* @__PURE__ */ f(
1354
1372
  de,
1355
1373
  {
1356
1374
  id: `${h}-swatch`,
1357
- color: `rgba(${W.r},${W.g},${W.b},${m.a})`,
1375
+ color: `rgba(${N.r},${N.g},${N.b},${m.a})`,
1358
1376
  shape: "square",
1359
1377
  showCheckerboard: !0,
1360
1378
  disabled: r,
1361
- onClick: () => w((l) => !l),
1362
- "aria-expanded": f,
1379
+ onClick: () => y((l) => !l),
1380
+ "aria-expanded": p,
1363
1381
  "aria-haspopup": "dialog",
1364
1382
  style: {
1365
1383
  width: d,
1366
1384
  height: d,
1367
1385
  borderRadius: a === "sm" ? "var(--lucent-radius-md)" : "var(--lucent-radius-lg)",
1368
- boxShadow: f ? "inset 0 0 0 2px var(--lucent-accent-border), 0 0 0 3px var(--lucent-accent-subtle)" : "inset 0 0 0 1px rgba(0,0,0,0.2)"
1386
+ boxShadow: p ? "inset 0 0 0 2px var(--lucent-accent-border), 0 0 0 3px var(--lucent-accent-subtle)" : "inset 0 0 0 1px rgba(0,0,0,0.2)"
1369
1387
  }
1370
1388
  }
1371
1389
  ),
1372
- s && n && /* @__PURE__ */ p(
1390
+ s && n && /* @__PURE__ */ f(
1373
1391
  "label",
1374
1392
  {
1375
1393
  htmlFor: `${h}-swatch`,
@@ -1383,17 +1401,17 @@ function sa({
1383
1401
  children: s
1384
1402
  }
1385
1403
  ),
1386
- f && kt(
1387
- /* @__PURE__ */ I(
1404
+ p && Dt(
1405
+ /* @__PURE__ */ T(
1388
1406
  "div",
1389
1407
  {
1390
- ref: N,
1408
+ ref: D,
1391
1409
  role: "dialog",
1392
1410
  "aria-label": "Color picker",
1393
1411
  style: {
1394
1412
  position: "fixed",
1395
- top: Z.top,
1396
- left: Z.left,
1413
+ top: C.top,
1414
+ left: C.left,
1397
1415
  zIndex: 999999,
1398
1416
  background: "color-mix(in srgb, var(--lucent-surface-overlay) 85%, transparent)",
1399
1417
  backdropFilter: "blur(6px)",
@@ -1407,7 +1425,7 @@ function sa({
1407
1425
  flexDirection: "column"
1408
1426
  },
1409
1427
  children: [
1410
- /* @__PURE__ */ I(
1428
+ /* @__PURE__ */ T(
1411
1429
  "div",
1412
1430
  {
1413
1431
  ref: A,
@@ -1420,15 +1438,15 @@ function sa({
1420
1438
  flexShrink: 0
1421
1439
  },
1422
1440
  onPointerDown: (l) => {
1423
- l.currentTarget.setPointerCapture(l.pointerId), E(l);
1441
+ l.currentTarget.setPointerCapture(l.pointerId), j(l);
1424
1442
  },
1425
1443
  onPointerMove: (l) => {
1426
- l.buttons > 0 && E(l);
1444
+ l.buttons > 0 && j(l);
1427
1445
  },
1428
1446
  children: [
1429
- /* @__PURE__ */ p("div", { style: { position: "absolute", inset: 0, background: "linear-gradient(to right, #fff, transparent)" } }),
1430
- /* @__PURE__ */ p("div", { style: { position: "absolute", inset: 0, background: "linear-gradient(to bottom, transparent, #000)" } }),
1431
- /* @__PURE__ */ p("div", { style: {
1447
+ /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: "linear-gradient(to right, #fff, transparent)" } }),
1448
+ /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: "linear-gradient(to bottom, transparent, #000)" } }),
1449
+ /* @__PURE__ */ f("div", { style: {
1432
1450
  position: "absolute",
1433
1451
  left: `${m.s}%`,
1434
1452
  top: `${100 - m.v}%`,
@@ -1443,31 +1461,31 @@ function sa({
1443
1461
  ]
1444
1462
  }
1445
1463
  ),
1446
- /* @__PURE__ */ I("div", { style: { padding: 12, display: "flex", flexDirection: "column", gap: 10 }, children: [
1447
- /* @__PURE__ */ I("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
1448
- /* @__PURE__ */ p(
1464
+ /* @__PURE__ */ T("div", { style: { padding: 12, display: "flex", flexDirection: "column", gap: 10 }, children: [
1465
+ /* @__PURE__ */ T("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
1466
+ /* @__PURE__ */ f(
1449
1467
  de,
1450
1468
  {
1451
- color: `rgba(${W.r},${W.g},${W.b},${m.a})`,
1469
+ color: `rgba(${N.r},${N.g},${N.b},${m.a})`,
1452
1470
  shape: "square",
1453
1471
  showCheckerboard: !0,
1454
1472
  style: { width: 44, height: 44, borderRadius: 8 }
1455
1473
  }
1456
1474
  ),
1457
- /* @__PURE__ */ I("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 8 }, children: [
1458
- /* @__PURE__ */ p(
1475
+ /* @__PURE__ */ T("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 8 }, children: [
1476
+ /* @__PURE__ */ f(
1459
1477
  Xe,
1460
1478
  {
1461
1479
  value: m.h,
1462
1480
  min: 0,
1463
1481
  max: 360,
1464
- onChange: (l) => $({ ...m, h: Math.round(l) }),
1482
+ onChange: (l) => B({ ...m, h: Math.round(l) }),
1465
1483
  trackStyle: { background: "linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)" },
1466
1484
  formatTooltip: (l) => `${Math.round(l)}°`
1467
1485
  }
1468
1486
  ),
1469
- /* @__PURE__ */ I("div", { style: { position: "relative", borderRadius: 6, overflow: "hidden" }, children: [
1470
- /* @__PURE__ */ p("div", { style: {
1487
+ /* @__PURE__ */ T("div", { style: { position: "relative", borderRadius: 6, overflow: "hidden" }, children: [
1488
+ /* @__PURE__ */ f("div", { style: {
1471
1489
  position: "absolute",
1472
1490
  inset: 0,
1473
1491
  backgroundImage: na,
@@ -1475,14 +1493,14 @@ function sa({
1475
1493
  backgroundPosition: "0 0, 0 4px, 4px -4px, -4px 0",
1476
1494
  backgroundColor: "#fff"
1477
1495
  } }),
1478
- /* @__PURE__ */ p("div", { style: { position: "absolute", inset: 0, background: `linear-gradient(to right, transparent, ${Se})` } }),
1479
- /* @__PURE__ */ p(
1496
+ /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: `linear-gradient(to right, transparent, ${Se})` } }),
1497
+ /* @__PURE__ */ f(
1480
1498
  Xe,
1481
1499
  {
1482
1500
  value: m.a,
1483
1501
  min: 0,
1484
1502
  max: 1,
1485
- onChange: (l) => $({ ...m, a: Math.round(l * 100) / 100 }),
1503
+ onChange: (l) => B({ ...m, a: Math.round(l * 100) / 100 }),
1486
1504
  trackStyle: { background: "transparent", position: "relative", zIndex: 1 },
1487
1505
  formatTooltip: (l) => `${Math.round(l * 100)}%`
1488
1506
  }
@@ -1490,41 +1508,41 @@ function sa({
1490
1508
  ] })
1491
1509
  ] })
1492
1510
  ] }),
1493
- /* @__PURE__ */ p(
1511
+ /* @__PURE__ */ f(
1494
1512
  Je,
1495
1513
  {
1496
1514
  size: "sm",
1497
- value: S,
1515
+ value: I,
1498
1516
  onChange: (l) => k(l),
1499
- options: y.map(({ id: l, label: x }) => ({ value: l, label: x }))
1517
+ options: v.map(({ id: l, label: x }) => ({ value: l, label: x }))
1500
1518
  }
1501
1519
  ),
1502
- S === "hex" && /* @__PURE__ */ I("div", { style: { display: "flex", gap: 6, alignItems: "center" }, children: [
1503
- /* @__PURE__ */ p(
1520
+ I === "hex" && /* @__PURE__ */ T("div", { style: { display: "flex", gap: 6, alignItems: "center" }, children: [
1521
+ /* @__PURE__ */ f(
1504
1522
  Ye,
1505
1523
  {
1506
1524
  variant: "secondary",
1507
1525
  size: "sm",
1508
- onClick: G,
1509
- disabled: !R,
1510
- title: R ? "Pick color from screen" : "Not supported in this browser",
1511
- leftIcon: /* @__PURE__ */ p(ra, {}),
1526
+ onClick: _,
1527
+ disabled: !F,
1528
+ title: F ? "Pick color from screen" : "Not supported in this browser",
1529
+ leftIcon: /* @__PURE__ */ f(ra, {}),
1512
1530
  style: { flexShrink: 0, paddingLeft: 8, paddingRight: 8 }
1513
1531
  }
1514
1532
  ),
1515
- /* @__PURE__ */ p(
1533
+ /* @__PURE__ */ f(
1516
1534
  te,
1517
1535
  {
1518
1536
  size: "sm",
1519
1537
  prefix: "#",
1520
- value: L,
1538
+ value: R,
1521
1539
  onChange: (l) => {
1522
1540
  const x = l.target.value.replace(/[^0-9a-fA-F]/g, "");
1523
- if (X(x.toUpperCase()), /^[0-9a-f]{6}$/i.test(x) || /^[0-9a-f]{8}$/i.test(x)) {
1524
- const T = le(`#${x}`);
1525
- if (T) {
1526
- const B = q(T);
1527
- D(B), t == null || t($e(T));
1541
+ if (E(x.toUpperCase()), /^[0-9a-f]{6}$/i.test(x) || /^[0-9a-f]{8}$/i.test(x)) {
1542
+ const z = le(`#${x}`);
1543
+ if (z) {
1544
+ const $ = G(z);
1545
+ w($), t == null || t($e(z));
1528
1546
  }
1529
1547
  }
1530
1548
  },
@@ -1534,84 +1552,84 @@ function sa({
1534
1552
  style: { flex: 1 }
1535
1553
  }
1536
1554
  ),
1537
- /* @__PURE__ */ p(
1555
+ /* @__PURE__ */ f(
1538
1556
  te,
1539
1557
  {
1540
1558
  size: "sm",
1541
1559
  type: "number",
1542
1560
  suffix: "%",
1543
- value: Y,
1561
+ value: Z,
1544
1562
  min: 0,
1545
1563
  max: 100,
1546
1564
  onChange: (l) => {
1547
1565
  const x = +l.target.value;
1548
- !isNaN(x) && x >= 0 && x <= 100 && $({ ...m, a: x / 100 });
1566
+ !isNaN(x) && x >= 0 && x <= 100 && B({ ...m, a: x / 100 });
1549
1567
  },
1550
1568
  className: "lucent-cp-field",
1551
1569
  style: { width: 68, flexShrink: 0 }
1552
1570
  }
1553
1571
  )
1554
1572
  ] }),
1555
- S === "rgb" && /* @__PURE__ */ p("div", { style: { display: "flex", gap: 6 }, children: [
1556
- { label: "R", val: W.r, max: 255, fn: (l) => $(q({ ...W, r: l })) },
1557
- { label: "G", val: W.g, max: 255, fn: (l) => $(q({ ...W, g: l })) },
1558
- { label: "B", val: W.b, max: 255, fn: (l) => $(q({ ...W, b: l })) },
1559
- { label: "A", val: Y, max: 100, fn: (l) => $({ ...m, a: l / 100 }) }
1560
- ].map(({ label: l, val: x, max: T, fn: B }) => /* @__PURE__ */ p(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: T, onChange: (H) => {
1561
- const P = +H.target.value;
1562
- !isNaN(P) && P >= 0 && P <= T && B(P);
1573
+ I === "rgb" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1574
+ { label: "R", val: N.r, max: 255, fn: (l) => B(G({ ...N, r: l })) },
1575
+ { label: "G", val: N.g, max: 255, fn: (l) => B(G({ ...N, g: l })) },
1576
+ { label: "B", val: N.b, max: 255, fn: (l) => B(G({ ...N, b: l })) },
1577
+ { label: "A", val: Z, max: 100, fn: (l) => B({ ...m, a: l / 100 }) }
1578
+ ].map(({ label: l, val: x, max: z, fn: $ }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: z, onChange: (O) => {
1579
+ const H = +O.target.value;
1580
+ !isNaN(H) && H >= 0 && H <= z && $(H);
1563
1581
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
1564
- S === "hsl" && /* @__PURE__ */ p("div", { style: { display: "flex", gap: 6 }, children: [
1565
- { label: "H", val: j.h, max: 360, fn: (l) => {
1566
- const { r: x, g: T, b: B } = fe(l, j.s, j.l);
1567
- $(q({ r: x, g: T, b: B, a: m.a }));
1582
+ I === "hsl" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1583
+ { label: "H", val: U.h, max: 360, fn: (l) => {
1584
+ const { r: x, g: z, b: $ } = fe(l, U.s, U.l);
1585
+ B(G({ r: x, g: z, b: $, a: m.a }));
1568
1586
  } },
1569
- { label: "S", val: j.s, max: 100, fn: (l) => {
1570
- const { r: x, g: T, b: B } = fe(j.h, l, j.l);
1571
- $(q({ r: x, g: T, b: B, a: m.a }));
1587
+ { label: "S", val: U.s, max: 100, fn: (l) => {
1588
+ const { r: x, g: z, b: $ } = fe(U.h, l, U.l);
1589
+ B(G({ r: x, g: z, b: $, a: m.a }));
1572
1590
  } },
1573
- { label: "L", val: j.l, max: 100, fn: (l) => {
1574
- const { r: x, g: T, b: B } = fe(j.h, j.s, l);
1575
- $(q({ r: x, g: T, b: B, a: m.a }));
1591
+ { label: "L", val: U.l, max: 100, fn: (l) => {
1592
+ const { r: x, g: z, b: $ } = fe(U.h, U.s, l);
1593
+ B(G({ r: x, g: z, b: $, a: m.a }));
1576
1594
  } },
1577
- { label: "A", val: Y, max: 100, fn: (l) => $({ ...m, a: l / 100 }) }
1578
- ].map(({ label: l, val: x, max: T, fn: B }) => /* @__PURE__ */ p(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: T, onChange: (H) => {
1579
- const P = +H.target.value;
1580
- !isNaN(P) && P >= 0 && P <= T && B(P);
1595
+ { label: "A", val: Z, max: 100, fn: (l) => B({ ...m, a: l / 100 }) }
1596
+ ].map(({ label: l, val: x, max: z, fn: $ }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: z, onChange: (O) => {
1597
+ const H = +O.target.value;
1598
+ !isNaN(H) && H >= 0 && H <= z && $(H);
1581
1599
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
1582
- S === "hsb" && /* @__PURE__ */ p("div", { style: { display: "flex", gap: 6 }, children: [
1583
- { label: "H", val: m.h, max: 360, fn: (l) => $({ ...m, h: l }) },
1584
- { label: "S", val: m.s, max: 100, fn: (l) => $({ ...m, s: l }) },
1585
- { label: "B", val: m.v, max: 100, fn: (l) => $({ ...m, v: l }) },
1586
- { label: "A", val: Y, max: 100, fn: (l) => $({ ...m, a: l / 100 }) }
1587
- ].map(({ label: l, val: x, max: T, fn: B }) => /* @__PURE__ */ p(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: T, onChange: (H) => {
1588
- const P = +H.target.value;
1589
- !isNaN(P) && P >= 0 && P <= T && B(P);
1600
+ I === "hsb" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1601
+ { label: "H", val: m.h, max: 360, fn: (l) => B({ ...m, h: l }) },
1602
+ { label: "S", val: m.s, max: 100, fn: (l) => B({ ...m, s: l }) },
1603
+ { label: "B", val: m.v, max: 100, fn: (l) => B({ ...m, v: l }) },
1604
+ { label: "A", val: Z, max: 100, fn: (l) => B({ ...m, a: l / 100 }) }
1605
+ ].map(({ label: l, val: x, max: z, fn: $ }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: x, min: 0, max: z, onChange: (O) => {
1606
+ const H = +O.target.value;
1607
+ !isNaN(H) && H >= 0 && H <= z && $(H);
1590
1608
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
1591
- o.length > 0 && /* @__PURE__ */ I("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
1592
- o.length > 1 && /* @__PURE__ */ p(
1609
+ o.length > 0 && /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
1610
+ o.length > 1 && /* @__PURE__ */ f(
1593
1611
  Ze,
1594
1612
  {
1595
1613
  size: "sm",
1596
- value: String(v),
1614
+ value: String(L),
1597
1615
  onChange: (l) => b(Number(l.target.value)),
1598
1616
  options: o.map((l, x) => ({ value: String(x), label: l.label }))
1599
1617
  }
1600
1618
  ),
1601
- o.length === 1 && /* @__PURE__ */ p("span", { style: {
1619
+ o.length === 1 && /* @__PURE__ */ f("span", { style: {
1602
1620
  fontSize: "var(--lucent-font-size-xs)",
1603
1621
  fontWeight: "var(--lucent-font-weight-medium)",
1604
1622
  color: "var(--lucent-text-secondary)",
1605
1623
  fontFamily: "var(--lucent-font-family-base)"
1606
- }, children: (M = o[0]) == null ? void 0 : M.label }),
1607
- /* @__PURE__ */ p("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: (((F = o[v]) == null ? void 0 : F.colors) ?? []).map((l) => {
1608
- const x = Le(l).toLowerCase() === ae.slice(0, 7).toLowerCase();
1609
- return /* @__PURE__ */ p(
1624
+ }, children: (S = o[0]) == null ? void 0 : S.label }),
1625
+ /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: (((W = o[L]) == null ? void 0 : W.colors) ?? []).map((l) => {
1626
+ const x = Re(l).toLowerCase() === ae.slice(0, 7).toLowerCase();
1627
+ return /* @__PURE__ */ f(
1610
1628
  de,
1611
1629
  {
1612
1630
  color: l,
1613
1631
  selected: x,
1614
- onClick: () => $(q(Qe(l)))
1632
+ onClick: () => B(G(Qe(l)))
1615
1633
  },
1616
1634
  l
1617
1635
  );
@@ -1629,83 +1647,83 @@ function sa({
1629
1647
  }
1630
1648
  sa.displayName = "ColorPicker";
1631
1649
  function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "underline", style: r }) {
1632
- var Y;
1633
- const o = s !== void 0, [c, u] = C(t ?? ((Y = e[0]) == null ? void 0 : Y.value) ?? ""), i = o ? s : c, [d, g] = C(null), h = U([]), [f, w] = C(null), S = U(!1), k = n === "pills", v = U(null), b = U(null), m = U(null), [D, L] = C(e.length), [X, O] = C(!1), [A, N] = C(!1), [Z, K] = C(null), $ = e.slice(0, D), E = e.slice(D), G = E.length > 0, W = E.some((y) => y.value === i), j = () => {
1634
- if (W) {
1635
- w(null);
1650
+ var Z;
1651
+ const o = s !== void 0, [c, u] = P(t ?? ((Z = e[0]) == null ? void 0 : Z.value) ?? ""), i = o ? s : c, [d, g] = P(null), h = q([]), [p, y] = P(null), I = q(!1), k = n === "pills", L = q(null), b = q(null), m = q(null), [w, R] = P(e.length), [E, X] = P(!1), [A, D] = P(!1), [C, K] = P(null), B = e.slice(0, w), j = e.slice(w), _ = j.length > 0, N = j.some((v) => v.value === i), U = () => {
1652
+ if (N) {
1653
+ y(null);
1636
1654
  return;
1637
1655
  }
1638
- const y = e.findIndex((M, F) => F < D && M.value === i), R = h.current[y];
1639
- if (R) {
1656
+ const v = e.findIndex((S, W) => W < w && S.value === i), F = h.current[v];
1657
+ if (F) {
1640
1658
  if (k) {
1641
- const M = R.querySelector("span");
1642
- if (!M) return;
1643
- w({ left: M.offsetLeft + R.offsetLeft, width: M.offsetWidth, animate: S.current });
1659
+ const S = F.querySelector("span");
1660
+ if (!S) return;
1661
+ y({ left: S.offsetLeft + F.offsetLeft, width: S.offsetWidth, animate: I.current });
1644
1662
  } else
1645
- w({ left: R.offsetLeft, width: R.offsetWidth, animate: S.current });
1646
- S.current = !0;
1663
+ y({ left: F.offsetLeft, width: F.offsetWidth, animate: I.current });
1664
+ I.current = !0;
1647
1665
  }
1648
1666
  };
1649
1667
  me(() => {
1650
- j(), document.fonts.ready.then(j);
1651
- }, [i, D, k]), ne(() => {
1652
- const y = v.current;
1653
- if (!y) return;
1654
- const R = () => {
1655
- const x = y.clientWidth, T = 70;
1656
- let B = 0, H = 0;
1657
- for (let P = 0; P < e.length; P++) {
1658
- const J = h.current[P];
1668
+ U(), document.fonts.ready.then(U);
1669
+ }, [i, w, k]), ne(() => {
1670
+ const v = L.current;
1671
+ if (!v) return;
1672
+ const F = () => {
1673
+ const x = v.clientWidth, z = 70;
1674
+ let $ = 0, O = 0;
1675
+ for (let H = 0; H < e.length; H++) {
1676
+ const J = h.current[H];
1659
1677
  if (!J) {
1660
- H++;
1678
+ O++;
1661
1679
  continue;
1662
1680
  }
1663
1681
  const Q = J.offsetWidth;
1664
- if (P < e.length - 1) {
1665
- if (B + Q + T > x) break;
1666
- } else if (B + Q > x) break;
1667
- B += Q, H++;
1682
+ if (H < e.length - 1) {
1683
+ if ($ + Q + z > x) break;
1684
+ } else if ($ + Q > x) break;
1685
+ $ += Q, O++;
1668
1686
  }
1669
- if (H >= e.length - 1 && H < e.length) {
1670
- let P = 0;
1687
+ if (O >= e.length - 1 && O < e.length) {
1688
+ let H = 0;
1671
1689
  for (let J = 0; J < e.length; J++) {
1672
1690
  const Q = h.current[J];
1673
- Q && (P += Q.offsetWidth);
1691
+ Q && (H += Q.offsetWidth);
1674
1692
  }
1675
- P <= x && (H = e.length);
1693
+ H <= x && (O = e.length);
1676
1694
  }
1677
- L(H < 1 ? 1 : H);
1695
+ R(O < 1 ? 1 : O);
1678
1696
  };
1679
- let M;
1697
+ let S;
1680
1698
  (() => {
1681
- M = requestAnimationFrame(() => {
1682
- M = requestAnimationFrame(R);
1699
+ S = requestAnimationFrame(() => {
1700
+ S = requestAnimationFrame(F);
1683
1701
  });
1684
1702
  })();
1685
- const l = new ResizeObserver(R);
1686
- return l.observe(y), () => {
1687
- l.disconnect(), cancelAnimationFrame(M);
1703
+ const l = new ResizeObserver(F);
1704
+ return l.observe(v), () => {
1705
+ l.disconnect(), cancelAnimationFrame(S);
1688
1706
  };
1689
1707
  }, [e]), ne(() => {
1690
- if (!X) return;
1691
- const y = (R) => {
1692
- m.current && !m.current.contains(R.target) && b.current && !b.current.contains(R.target) && (O(!1), K(null));
1708
+ if (!E) return;
1709
+ const v = (F) => {
1710
+ m.current && !m.current.contains(F.target) && b.current && !b.current.contains(F.target) && (X(!1), K(null));
1693
1711
  };
1694
- return document.addEventListener("mousedown", y), () => document.removeEventListener("mousedown", y);
1695
- }, [X]);
1696
- const ae = (y) => {
1697
- o || u(y), a == null || a(y);
1698
- }, Se = (y, R) => {
1712
+ return document.addEventListener("mousedown", v), () => document.removeEventListener("mousedown", v);
1713
+ }, [E]);
1714
+ const ae = (v) => {
1715
+ o || u(v), a == null || a(v);
1716
+ }, Se = (v, F) => {
1699
1717
  var x;
1700
- const M = $.map((T, B) => T.disabled ? -1 : B).filter((T) => T !== -1), F = M.indexOf(R);
1718
+ const S = B.map((z, $) => z.disabled ? -1 : $).filter((z) => z !== -1), W = S.indexOf(F);
1701
1719
  let l = -1;
1702
- y.key === "ArrowRight" && (l = M[(F + 1) % M.length] ?? -1), y.key === "ArrowLeft" && (l = M[(F - 1 + M.length) % M.length] ?? -1), y.key === "Home" && (l = M[0] ?? -1), y.key === "End" && (l = M[M.length - 1] ?? -1), l !== -1 && (y.preventDefault(), (x = h.current[l]) == null || x.focus(), ae($[l].value));
1720
+ v.key === "ArrowRight" && (l = S[(W + 1) % S.length] ?? -1), v.key === "ArrowLeft" && (l = S[(W - 1 + S.length) % S.length] ?? -1), v.key === "Home" && (l = S[0] ?? -1), v.key === "End" && (l = S[S.length - 1] ?? -1), l !== -1 && (v.preventDefault(), (x = h.current[l]) == null || x.focus(), ae(B[l].value));
1703
1721
  };
1704
- return /* @__PURE__ */ I("div", { style: { display: "flex", flexDirection: "column", position: "relative", ...r }, children: [
1705
- /* @__PURE__ */ I(
1722
+ return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", position: "relative", ...r }, children: [
1723
+ /* @__PURE__ */ T(
1706
1724
  "div",
1707
1725
  {
1708
- ref: v,
1726
+ ref: L,
1709
1727
  role: "tablist",
1710
1728
  style: {
1711
1729
  position: "relative",
@@ -1718,26 +1736,26 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1718
1736
  }
1719
1737
  },
1720
1738
  children: [
1721
- e.map((y, R) => {
1722
- const M = R < D, F = y.value === i, l = y.disabled ?? !1;
1723
- return /* @__PURE__ */ I(
1739
+ e.map((v, F) => {
1740
+ const S = F < w, W = v.value === i, l = v.disabled ?? !1;
1741
+ return /* @__PURE__ */ T(
1724
1742
  "button",
1725
1743
  {
1726
1744
  ref: (x) => {
1727
- h.current[R] = x;
1745
+ h.current[F] = x;
1728
1746
  },
1729
1747
  role: "tab",
1730
- "aria-selected": F,
1731
- "aria-controls": `lucent-tabpanel-${y.value}`,
1732
- id: `lucent-tab-${y.value}`,
1748
+ "aria-selected": W,
1749
+ "aria-controls": `lucent-tabpanel-${v.value}`,
1750
+ id: `lucent-tab-${v.value}`,
1733
1751
  disabled: l,
1734
- tabIndex: F && M ? 0 : -1,
1752
+ tabIndex: W && S ? 0 : -1,
1735
1753
  onClick: () => {
1736
- l || ae(y.value);
1754
+ l || ae(v.value);
1737
1755
  },
1738
- onKeyDown: (x) => Se(x, R),
1756
+ onKeyDown: (x) => Se(x, F),
1739
1757
  onMouseEnter: () => {
1740
- !l && M && g(R);
1758
+ !l && S && g(F);
1741
1759
  },
1742
1760
  onMouseLeave: () => g(null),
1743
1761
  style: {
@@ -1747,25 +1765,25 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1747
1765
  cursor: l ? "not-allowed" : "pointer",
1748
1766
  fontFamily: "var(--lucent-font-family-base)",
1749
1767
  fontSize: "var(--lucent-font-size-md)",
1750
- fontWeight: F ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1751
- color: l ? "var(--lucent-text-disabled)" : k && F ? "var(--lucent-accent-fg)" : F ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1768
+ fontWeight: W ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1769
+ color: l ? "var(--lucent-text-disabled)" : k && W ? "var(--lucent-accent-fg)" : W ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1752
1770
  transition: "color var(--lucent-duration-fast) var(--lucent-easing-default)",
1753
1771
  whiteSpace: "nowrap",
1754
1772
  outline: "none",
1755
- position: M ? "relative" : "absolute",
1756
- zIndex: F ? 1 : 0,
1773
+ position: S ? "relative" : "absolute",
1774
+ zIndex: W ? 1 : 0,
1757
1775
  // Hidden overflow tabs are positioned off-screen for measurement
1758
- ...M ? {} : { visibility: "hidden", pointerEvents: "none", left: -9999 }
1776
+ ...S ? {} : { visibility: "hidden", pointerEvents: "none", left: -9999 }
1759
1777
  },
1760
1778
  children: [
1761
- /* @__PURE__ */ p("span", { style: {
1779
+ /* @__PURE__ */ f("span", { style: {
1762
1780
  display: "block",
1763
1781
  padding: "var(--lucent-space-1) var(--lucent-space-3)",
1764
1782
  borderRadius: "var(--lucent-radius-md)",
1765
- background: !k && d === R && !F && !l ? "var(--lucent-surface-secondary)" : "transparent",
1783
+ background: !k && d === F && !W && !l ? "var(--lucent-surface-secondary)" : "transparent",
1766
1784
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
1767
- }, children: y.label }),
1768
- k && d === R && !F && !l && M && /* @__PURE__ */ p(
1785
+ }, children: v.label }),
1786
+ k && d === F && !W && !l && S && /* @__PURE__ */ f(
1769
1787
  "span",
1770
1788
  {
1771
1789
  "aria-hidden": !0,
@@ -1784,16 +1802,16 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1784
1802
  )
1785
1803
  ]
1786
1804
  },
1787
- y.value
1805
+ v.value
1788
1806
  );
1789
1807
  }),
1790
- G && /* @__PURE__ */ p(
1808
+ _ && /* @__PURE__ */ f(
1791
1809
  "button",
1792
1810
  {
1793
1811
  ref: b,
1794
- onClick: () => O((y) => !y),
1795
- onMouseEnter: () => N(!0),
1796
- onMouseLeave: () => N(!1),
1812
+ onClick: () => X((v) => !v),
1813
+ onMouseEnter: () => D(!0),
1814
+ onMouseLeave: () => D(!1),
1797
1815
  style: {
1798
1816
  padding: k ? "var(--lucent-space-1) var(--lucent-space-2)" : "var(--lucent-space-1) var(--lucent-space-2) var(--lucent-space-3)",
1799
1817
  background: "none",
@@ -1801,14 +1819,14 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1801
1819
  cursor: "pointer",
1802
1820
  fontFamily: "var(--lucent-font-family-base)",
1803
1821
  fontSize: "var(--lucent-font-size-md)",
1804
- fontWeight: W ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1805
- color: W ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1822
+ fontWeight: N ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1823
+ color: N ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1806
1824
  whiteSpace: "nowrap",
1807
1825
  outline: "none",
1808
1826
  position: "relative",
1809
1827
  flexShrink: 0
1810
1828
  },
1811
- children: /* @__PURE__ */ p("span", { style: {
1829
+ children: /* @__PURE__ */ f("span", { style: {
1812
1830
  display: "block",
1813
1831
  padding: "var(--lucent-space-1) var(--lucent-space-3)",
1814
1832
  borderRadius: "var(--lucent-radius-md)",
@@ -1817,7 +1835,7 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1817
1835
  }, children: "More…" })
1818
1836
  }
1819
1837
  ),
1820
- f != null && /* @__PURE__ */ p(
1838
+ p != null && /* @__PURE__ */ f(
1821
1839
  "span",
1822
1840
  {
1823
1841
  "aria-hidden": !0,
@@ -1825,27 +1843,27 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1825
1843
  position: "absolute",
1826
1844
  top: "var(--lucent-space-1)",
1827
1845
  bottom: "var(--lucent-space-1)",
1828
- left: f.left,
1829
- width: f.width,
1846
+ left: p.left,
1847
+ width: p.width,
1830
1848
  background: "var(--lucent-accent-default)",
1831
1849
  borderRadius: "var(--lucent-radius-md)",
1832
- transition: f.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1850
+ transition: p.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1833
1851
  } : {
1834
1852
  position: "absolute",
1835
1853
  bottom: 0,
1836
- left: f.left,
1837
- width: f.width,
1854
+ left: p.left,
1855
+ width: p.width,
1838
1856
  height: 2,
1839
1857
  background: "var(--lucent-accent-default)",
1840
1858
  borderRadius: "var(--lucent-radius-sm)",
1841
- transition: f.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1859
+ transition: p.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1842
1860
  }
1843
1861
  }
1844
1862
  )
1845
1863
  ]
1846
1864
  }
1847
1865
  ),
1848
- G && X && /* @__PURE__ */ p(
1866
+ _ && E && /* @__PURE__ */ f(
1849
1867
  "div",
1850
1868
  {
1851
1869
  ref: m,
@@ -1862,53 +1880,53 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1862
1880
  padding: "var(--lucent-space-1) 0",
1863
1881
  minWidth: 140
1864
1882
  },
1865
- children: E.map((y, R) => {
1866
- const M = y.value === i, F = y.disabled ?? !1, l = Z === R;
1867
- return /* @__PURE__ */ p(
1883
+ children: j.map((v, F) => {
1884
+ const S = v.value === i, W = v.disabled ?? !1, l = C === F;
1885
+ return /* @__PURE__ */ f(
1868
1886
  "button",
1869
1887
  {
1870
- disabled: F,
1888
+ disabled: W,
1871
1889
  onClick: () => {
1872
- F || (ae(y.value), O(!1));
1890
+ W || (ae(v.value), X(!1));
1873
1891
  },
1874
1892
  onMouseEnter: () => {
1875
- F || K(R);
1893
+ W || K(F);
1876
1894
  },
1877
1895
  onMouseLeave: () => K(null),
1878
1896
  style: {
1879
1897
  display: "block",
1880
1898
  width: "100%",
1881
1899
  padding: "var(--lucent-space-2) var(--lucent-space-4)",
1882
- background: M || l ? "var(--lucent-surface-secondary)" : "none",
1900
+ background: S || l ? "var(--lucent-surface-secondary)" : "none",
1883
1901
  border: "none",
1884
- cursor: F ? "not-allowed" : "pointer",
1902
+ cursor: W ? "not-allowed" : "pointer",
1885
1903
  fontFamily: "var(--lucent-font-family-base)",
1886
1904
  fontSize: "var(--lucent-font-size-md)",
1887
- fontWeight: M ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1888
- color: F ? "var(--lucent-text-disabled)" : M || l ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1905
+ fontWeight: S ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1906
+ color: W ? "var(--lucent-text-disabled)" : S || l ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1889
1907
  textAlign: "left",
1890
1908
  outline: "none",
1891
1909
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), color var(--lucent-duration-fast) var(--lucent-easing-default)"
1892
1910
  },
1893
- children: y.label
1911
+ children: v.label
1894
1912
  },
1895
- y.value
1913
+ v.value
1896
1914
  );
1897
1915
  })
1898
1916
  }
1899
1917
  ),
1900
- e.some((y) => y.content != null) && e.map((y) => /* @__PURE__ */ p(
1918
+ e.some((v) => v.content != null) && e.map((v) => /* @__PURE__ */ f(
1901
1919
  "div",
1902
1920
  {
1903
1921
  role: "tabpanel",
1904
- id: `lucent-tabpanel-${y.value}`,
1905
- "aria-labelledby": `lucent-tab-${y.value}`,
1906
- hidden: y.value !== i,
1922
+ id: `lucent-tabpanel-${v.value}`,
1923
+ "aria-labelledby": `lucent-tab-${v.value}`,
1924
+ hidden: v.value !== i,
1907
1925
  style: { padding: "var(--lucent-space-4) 0", outline: "none" },
1908
1926
  tabIndex: 0,
1909
- children: y.content
1927
+ children: v.content
1910
1928
  },
1911
- y.value
1929
+ v.value
1912
1930
  ))
1913
1931
  ] });
1914
1932
  }
@@ -2030,7 +2048,7 @@ function pa({ r: e, g: t, b: s }) {
2030
2048
  const a = (n) => n.toString(16).padStart(2, "0");
2031
2049
  return `#${a(e)}${a(t)}${a(s)}`;
2032
2050
  }
2033
- function V(e) {
2051
+ function Y(e) {
2034
2052
  const { r: t, g: s, b: a } = fa(e), n = t / 255, r = s / 255, o = a / 255, c = Math.max(n, r, o), u = Math.min(n, r, o);
2035
2053
  let i = 0, d = 0;
2036
2054
  const g = (c + u) / 2;
@@ -2051,38 +2069,38 @@ function V(e) {
2051
2069
  }
2052
2070
  return [i * 360, d, g];
2053
2071
  }
2054
- function _(e, t, s) {
2072
+ function V(e, t, s) {
2055
2073
  e = (e % 360 + 360) % 360, t = Math.min(1, Math.max(0, t)), s = Math.min(1, Math.max(0, s));
2056
2074
  const a = (1 - Math.abs(2 * s - 1)) * t, n = a * (1 - Math.abs(e / 60 % 2 - 1)), r = s - a / 2;
2057
2075
  let o = 0, c = 0, u = 0;
2058
2076
  return e < 60 ? (o = a, c = n) : e < 120 ? (o = n, c = a) : e < 180 ? (c = a, u = n) : e < 240 ? (c = n, u = a) : e < 300 ? (o = n, u = a) : (o = a, u = n), pa({ r: Math.round((o + r) * 255), g: Math.round((c + r) * 255), b: Math.round((u + r) * 255) });
2059
2077
  }
2060
- function z(e, t) {
2061
- const [s, a, n] = V(e);
2062
- return _(s, a, Math.min(1, Math.max(0, n + t)));
2078
+ function M(e, t) {
2079
+ const [s, a, n] = Y(e);
2080
+ return V(s, a, Math.min(1, Math.max(0, n + t)));
2063
2081
  }
2064
2082
  const ga = 222, ba = 0.12;
2065
2083
  function tt(e, t) {
2066
2084
  return t < 0.04 ? [ga, ba] : [e, t];
2067
2085
  }
2068
2086
  function je(e) {
2069
- const [t, s, a] = V(e), [n, r] = tt(t, s);
2070
- return _(n, r, Math.max(0.04, Math.min(0.2, 0.07 + (1 - a))));
2087
+ const [t, s, a] = Y(e), [n, r] = tt(t, s);
2088
+ return V(n, r, Math.max(0.04, Math.min(0.2, 0.07 + (1 - a))));
2071
2089
  }
2072
2090
  function Te(e) {
2073
- const [t, s, a] = V(e), [n, r] = tt(t, s);
2074
- return _(n, r, Math.max(0.06, Math.min(0.5, (1 - a) * 0.6 + 0.06)));
2091
+ const [t, s, a] = Y(e), [n, r] = tt(t, s);
2092
+ return V(n, r, Math.max(0.06, Math.min(0.5, (1 - a) * 0.6 + 0.06)));
2075
2093
  }
2076
2094
  function Ie(e) {
2077
- const [t, s, a] = V(e);
2078
- return _(t, s, Math.max(0.04, Math.min(0.97, 1 - a + 0.04)));
2095
+ const [t, s, a] = Y(e);
2096
+ return V(t, s, Math.max(0.04, Math.min(0.97, 1 - a + 0.04)));
2079
2097
  }
2080
2098
  function Be(e) {
2081
- const [t, s, a] = V(e);
2082
- return _(t, s, Math.max(0.02, Math.min(0.98, 1 - a)));
2099
+ const [t, s, a] = Y(e);
2100
+ return V(t, s, Math.max(0.02, Math.min(0.98, 1 - a)));
2083
2101
  }
2084
2102
  function xa(e) {
2085
- const t = je(e.navigation), s = je(e.bgBase), [a, n, r] = V(s), o = (c) => _(a, n, Math.min(0.25, r + c));
2103
+ const t = je(e.navigation), s = je(e.bgBase), [a, n, r] = Y(s), o = (c) => V(a, n, Math.min(0.25, r + c));
2086
2104
  return {
2087
2105
  // ── Non-color tokens: carry over from light unchanged ──────────────────
2088
2106
  ...e,
@@ -2120,19 +2138,19 @@ function xa(e) {
2120
2138
  accentFg: e.accentFg,
2121
2139
  // auto-recomputed by LucentProvider
2122
2140
  // ── Status: lighten defaults for visibility; darken for subtle bg ─────────
2123
- successDefault: z(e.successDefault, 0.1),
2124
- successSubtle: z(e.successDefault, -0.25),
2125
- successText: z(e.successText, 0.15),
2126
- warningDefault: z(e.warningDefault, 0.1),
2127
- warningSubtle: z(e.warningDefault, -0.25),
2128
- warningText: z(e.warningText, 0.15),
2129
- dangerDefault: z(e.dangerDefault, 0.1),
2130
- dangerHover: z(e.dangerHover, 0.1),
2131
- dangerSubtle: z(e.dangerDefault, -0.25),
2132
- dangerText: z(e.dangerText, 0.15),
2133
- infoDefault: z(e.infoDefault, 0.1),
2134
- infoSubtle: z(e.infoDefault, -0.25),
2135
- infoText: z(e.infoText, 0.15)
2141
+ successDefault: M(e.successDefault, 0.1),
2142
+ successSubtle: M(e.successDefault, -0.25),
2143
+ successText: M(e.successText, 0.15),
2144
+ warningDefault: M(e.warningDefault, 0.1),
2145
+ warningSubtle: M(e.warningDefault, -0.25),
2146
+ warningText: M(e.warningText, 0.15),
2147
+ dangerDefault: M(e.dangerDefault, 0.1),
2148
+ dangerHover: M(e.dangerHover, 0.1),
2149
+ dangerSubtle: M(e.dangerDefault, -0.25),
2150
+ dangerText: M(e.dangerText, 0.15),
2151
+ infoDefault: M(e.infoDefault, 0.1),
2152
+ infoSubtle: M(e.infoDefault, -0.25),
2153
+ infoText: M(e.infoText, 0.15)
2136
2154
  };
2137
2155
  }
2138
2156
  const at = xa(he);
@@ -2150,17 +2168,17 @@ function va(e) {
2150
2168
  const t = parseInt(e.slice(1, 3), 16) / 255, s = parseInt(e.slice(3, 5), 16) / 255, a = parseInt(e.slice(5, 7), 16) / 255, n = (r) => r <= 0.03928 ? r / 12.92 : Math.pow((r + 0.055) / 1.055, 2.4);
2151
2169
  return 0.2126 * n(t) + 0.7152 * n(s) + 0.0722 * n(a);
2152
2170
  }
2153
- const ya = 0.2126729, wa = 0.7151522, ka = 0.072175, Da = 0.56, Sa = 0.57, Ma = 0.65, za = 0.62, Ue = 0.022, Ta = 1.414, Ia = 1.14, Ba = 1.14, qe = 0.027, Ge = 0.027;
2171
+ const ya = 0.2126729, wa = 0.7151522, Da = 0.072175, ka = 0.56, Sa = 0.57, Ma = 0.65, za = 0.62, Ue = 0.022, Ta = 1.414, Ia = 1.14, Ba = 1.14, qe = 0.027, Ge = 0.027;
2154
2172
  function _e(e) {
2155
2173
  const t = parseInt(e.slice(1, 3), 16) / 255, s = parseInt(e.slice(3, 5), 16) / 255, a = parseInt(e.slice(5, 7), 16) / 255, n = Math.pow(t, 2.4), r = Math.pow(s, 2.4), o = Math.pow(a, 2.4);
2156
- let c = ya * n + wa * r + ka * o;
2174
+ let c = ya * n + wa * r + Da * o;
2157
2175
  return c < 0 && (c = 0), c < Ue ? c + Math.pow(Ue - c, Ta) : c;
2158
2176
  }
2159
2177
  function ge(e, t) {
2160
2178
  const s = _e(e), a = _e(t);
2161
2179
  let n;
2162
2180
  if (s > a) {
2163
- const r = (Math.pow(s, Da) - Math.pow(a, Sa)) * Ia;
2181
+ const r = (Math.pow(s, ka) - Math.pow(a, Sa)) * Ia;
2164
2182
  n = r < qe ? 0 : r - qe;
2165
2183
  } else {
2166
2184
  const r = (Math.pow(s, Ma) - Math.pow(a, za)) * Ba;
@@ -2179,25 +2197,25 @@ function nt(e) {
2179
2197
  const i = n - r;
2180
2198
  c = (n + r) / 2 > 0.5 ? i / (2 - n - r) : i / (n + r), n === t ? o = ((s - a) / i + (s < a ? 6 : 0)) / 6 : n === s ? o = ((a - t) / i + 2) / 6 : o = ((t - s) / i + 4) / 6;
2181
2199
  }
2182
- return $a(e) === "#000000" ? Re(o, Math.min(c, 0.6), 0.12) : Re(o, Math.min(c, 0.2), 0.95);
2200
+ return $a(e) === "#000000" ? Le(o, Math.min(c, 0.6), 0.12) : Le(o, Math.min(c, 0.2), 0.95);
2183
2201
  }
2184
- function Ra(e, t, s = 60) {
2202
+ function La(e, t, s = 60) {
2185
2203
  if (Math.abs(ge(e, t)) >= s) return e;
2186
2204
  const a = parseInt(e.slice(1, 3), 16) / 255, n = parseInt(e.slice(3, 5), 16) / 255, r = parseInt(e.slice(5, 7), 16) / 255, o = Math.max(a, n, r), c = Math.min(a, n, r);
2187
2205
  let u = 0, i = 0, d = (o + c) / 2;
2188
2206
  if (o !== c) {
2189
- const f = o - c;
2190
- i = d > 0.5 ? f / (2 - o - c) : f / (o + c), o === a ? u = ((n - r) / f + (n < r ? 6 : 0)) / 6 : o === n ? u = ((r - a) / f + 2) / 6 : u = ((a - n) / f + 4) / 6;
2207
+ const p = o - c;
2208
+ i = d > 0.5 ? p / (2 - o - c) : p / (o + c), o === a ? u = ((n - r) / p + (n < r ? 6 : 0)) / 6 : o === n ? u = ((r - a) / p + 2) / 6 : u = ((a - n) / p + 4) / 6;
2191
2209
  }
2192
2210
  const h = va(t) > 0.5 ? -5e-3 : 5e-3;
2193
- for (let f = 0; f < 100; f++) {
2211
+ for (let p = 0; p < 100; p++) {
2194
2212
  d = Math.min(1, Math.max(0, d + h));
2195
- const w = Re(u, i, d);
2196
- if (Math.abs(ge(w, t)) >= s) return w;
2213
+ const y = Le(u, i, d);
2214
+ if (Math.abs(ge(y, t)) >= s) return y;
2197
2215
  }
2198
2216
  return e;
2199
2217
  }
2200
- function Re(e, t, s) {
2218
+ function Le(e, t, s) {
2201
2219
  const a = (u, i, d) => (d < 0 && (d += 1), d > 1 && (d -= 1), d < 0.16666666666666666 ? u + (i - u) * 6 * d : d < 0.5 ? i : d < 0.6666666666666666 ? u + (i - u) * (0.6666666666666666 - d) * 6 : u);
2202
2220
  let n, r, o;
2203
2221
  if (t === 0)
@@ -2209,32 +2227,32 @@ function Re(e, t, s) {
2209
2227
  const c = (u) => Math.round(u * 255).toString(16).padStart(2, "0");
2210
2228
  return `#${c(n)}${c(r)}${c(o)}`;
2211
2229
  }
2212
- function La(e, t) {
2213
- const [s, a, n] = V(e);
2214
- return t ? _(s, a * 0.3, Math.min(1, n + (1 - n) * 0.85)) : _(s, a, Math.min(0.25, n + 0.04));
2230
+ function Ra(e, t) {
2231
+ const [s, a, n] = Y(e);
2232
+ return t ? V(s, a * 0.3, Math.min(1, n + (1 - n) * 0.85)) : V(s, a, Math.min(0.25, n + 0.04));
2215
2233
  }
2216
2234
  const be = {
2217
2235
  subtle: { light: 0.95, dark: 0.12 },
2218
2236
  text: { light: 0.28, dark: 0.78 }
2219
2237
  };
2220
2238
  function ce(e, t) {
2221
- const [s, a] = V(e);
2222
- return _(s, a * 0.5, t ? be.subtle.light : be.subtle.dark);
2239
+ const [s, a] = Y(e);
2240
+ return V(s, a * 0.5, t ? be.subtle.light : be.subtle.dark);
2223
2241
  }
2224
2242
  function ie(e, t) {
2225
- const [s, a] = V(e);
2226
- return _(s, a, t ? be.text.light : be.text.dark);
2243
+ const [s, a] = Y(e);
2244
+ return V(s, a, t ? be.text.light : be.text.dark);
2227
2245
  }
2228
2246
  function rt(e, t, s) {
2229
2247
  const a = {}, n = s === "light";
2230
- if ("borderDefault" in e && ("borderSubtle" in e || (a.borderSubtle = z(t.borderDefault, n ? 0.05 : -0.02)), "borderStrong" in e || (a.borderStrong = z(t.borderDefault, n ? -0.27 : 0.19))), "bgBase" in e && ("bgSubtle" in e || (a.bgSubtle = z(t.bgBase, n ? -0.02 : 0.02)), "surfaceTint" in e || (a.surfaceTint = z(t.bgBase, n ? -0.04 : 0.03)), !("surface" in e))) {
2231
- const r = La(t.bgBase, n);
2232
- a.surface = r, "surfaceSecondary" in e || (a.surfaceSecondary = z(r, n ? -0.04 : 0.03)), "surfaceRaised" in e || (a.surfaceRaised = z(r, n ? 0 : 0.06)), "surfaceOverlay" in e || (a.surfaceOverlay = z(r, n ? 0 : 0.06));
2248
+ if ("borderDefault" in e && ("borderSubtle" in e || (a.borderSubtle = M(t.borderDefault, n ? 0.05 : -0.02)), "borderStrong" in e || (a.borderStrong = M(t.borderDefault, n ? -0.27 : 0.19))), "bgBase" in e && ("bgSubtle" in e || (a.bgSubtle = M(t.bgBase, n ? -0.02 : 0.02)), "surfaceTint" in e || (a.surfaceTint = M(t.bgBase, n ? -0.04 : 0.03)), !("surface" in e))) {
2249
+ const r = Ra(t.bgBase, n);
2250
+ a.surface = r, "surfaceSecondary" in e || (a.surfaceSecondary = M(r, n ? -0.04 : 0.03)), "surfaceRaised" in e || (a.surfaceRaised = M(r, n ? 0 : 0.06)), "surfaceOverlay" in e || (a.surfaceOverlay = M(r, n ? 0 : 0.06));
2233
2251
  }
2234
- return "surface" in e && ("surfaceSecondary" in e || (a.surfaceSecondary = z(t.surface, n ? -0.04 : 0.03)), "surfaceRaised" in e || (a.surfaceRaised = z(t.surface, n ? 0 : 0.06)), "surfaceOverlay" in e || (a.surfaceOverlay = z(t.surface, n ? 0 : 0.06))), "textPrimary" in e && ("textSecondary" in e || (a.textSecondary = z(t.textPrimary, n ? 0.2 : -0.15)), "textDisabled" in e || (a.textDisabled = z(t.textPrimary, n ? 0.58 : -0.62))), "accentDefault" in e && ("accentHover" in e || (a.accentHover = z(t.accentDefault, n ? 0.05 : -0.07)), "accentSubtle" in e || (a.accentSubtle = z(t.accentDefault, n ? 0.85 : -0.6))), "successDefault" in e && ("successSubtle" in e || (a.successSubtle = ce(t.successDefault, n)), "successText" in e || (a.successText = ie(t.successDefault, n))), "warningDefault" in e && ("warningSubtle" in e || (a.warningSubtle = ce(t.warningDefault, n)), "warningText" in e || (a.warningText = ie(t.warningDefault, n))), "dangerDefault" in e && ("dangerHover" in e || (a.dangerHover = z(t.dangerDefault, n ? 0.05 : -0.07)), "dangerSubtle" in e || (a.dangerSubtle = ce(t.dangerDefault, n)), "dangerText" in e || (a.dangerText = ie(t.dangerDefault, n))), "infoDefault" in e && ("infoSubtle" in e || (a.infoSubtle = ce(t.infoDefault, n)), "infoText" in e || (a.infoText = ie(t.infoDefault, n))), a;
2252
+ return "surface" in e && ("surfaceSecondary" in e || (a.surfaceSecondary = M(t.surface, n ? -0.04 : 0.03)), "surfaceRaised" in e || (a.surfaceRaised = M(t.surface, n ? 0 : 0.06)), "surfaceOverlay" in e || (a.surfaceOverlay = M(t.surface, n ? 0 : 0.06))), "textPrimary" in e && ("textSecondary" in e || (a.textSecondary = M(t.textPrimary, n ? 0.2 : -0.15)), "textDisabled" in e || (a.textDisabled = M(t.textPrimary, n ? 0.58 : -0.62))), "accentDefault" in e && ("accentHover" in e || (a.accentHover = M(t.accentDefault, n ? 0.05 : -0.07)), "accentSubtle" in e || (a.accentSubtle = M(t.accentDefault, n ? 0.85 : -0.6))), "successDefault" in e && ("successSubtle" in e || (a.successSubtle = ce(t.successDefault, n)), "successText" in e || (a.successText = ie(t.successDefault, n))), "warningDefault" in e && ("warningSubtle" in e || (a.warningSubtle = ce(t.warningDefault, n)), "warningText" in e || (a.warningText = ie(t.warningDefault, n))), "dangerDefault" in e && ("dangerHover" in e || (a.dangerHover = M(t.dangerDefault, n ? 0.05 : -0.07)), "dangerSubtle" in e || (a.dangerSubtle = ce(t.dangerDefault, n)), "dangerText" in e || (a.dangerText = ie(t.dangerDefault, n))), "infoDefault" in e && ("infoSubtle" in e || (a.infoSubtle = ce(t.infoDefault, n)), "infoText" in e || (a.infoText = ie(t.infoDefault, n))), a;
2235
2253
  }
2236
2254
  function st(e, t = "light") {
2237
- const a = { ...t === "dark" ? at : he, ...e }, n = rt(e, a, t), r = t === "light" ? z(a.accentDefault, -0.15) : z(a.accentDefault, 0.15);
2255
+ const a = { ...t === "dark" ? at : he, ...e }, n = rt(e, a, t), r = t === "light" ? M(a.accentDefault, -0.15) : M(a.accentDefault, 0.15);
2238
2256
  return {
2239
2257
  ...a,
2240
2258
  ...n,
@@ -2266,7 +2284,7 @@ const ot = {
2266
2284
  dangerDefault: "#ef4444",
2267
2285
  infoDefault: "#3b82f6"
2268
2286
  }
2269
- }, Ca = {
2287
+ }, Fa = {
2270
2288
  name: "brand",
2271
2289
  light: {
2272
2290
  navigation: "#fffefb",
@@ -2362,7 +2380,7 @@ const ot = {
2362
2380
  dangerDefault: "#ef4444",
2363
2381
  infoDefault: "#3b82f6"
2364
2382
  }
2365
- }, Fa = {
2383
+ }, Ca = {
2366
2384
  name: "teal",
2367
2385
  light: {
2368
2386
  navigation: "#f9fbfc",
@@ -2560,7 +2578,7 @@ const ot = {
2560
2578
  radiusXl: "1.5rem",
2561
2579
  radiusFull: "9999px"
2562
2580
  }
2563
- }, ke = {
2581
+ }, De = {
2564
2582
  name: "compact",
2565
2583
  tokens: {
2566
2584
  space0: "0px",
@@ -2594,7 +2612,7 @@ const ot = {
2594
2612
  space20: "5rem",
2595
2613
  space24: "6rem"
2596
2614
  }
2597
- }, De = {
2615
+ }, ke = {
2598
2616
  name: "spacious",
2599
2617
  tokens: {
2600
2618
  space0: "0px",
@@ -2611,7 +2629,7 @@ const ot = {
2611
2629
  space20: "6.25rem",
2612
2630
  space24: "7.5rem"
2613
2631
  }
2614
- }, Ce = {
2632
+ }, Fe = {
2615
2633
  name: "flat",
2616
2634
  light: {
2617
2635
  shadowNone: "none",
@@ -2723,7 +2741,7 @@ const ot = {
2723
2741
  shadowLg: "inset 0 1px 0 0 rgba(255, 255, 255, 0.09), inset 0 0 0 1px rgba(255, 255, 255, 0.05), inset 0 0 16px rgba(255, 255, 255, 0.02), 0 2px 6px rgba(0, 0, 0, 0.15)",
2724
2742
  shadowXl: "inset 0 1px 0 0 rgba(255, 255, 255, 0.12), inset 0 0 0 1px rgba(255, 255, 255, 0.06), inset 0 0 24px rgba(255, 255, 255, 0.03), 0 4px 10px rgba(0, 0, 0, 0.15)"
2725
2743
  }
2726
- }, Fe = {
2744
+ }, Ce = {
2727
2745
  name: "glow",
2728
2746
  light: {
2729
2747
  shadowNone: "none",
@@ -2749,19 +2767,19 @@ const ot = {
2749
2767
  name: "enterprise",
2750
2768
  palette: ot,
2751
2769
  shape: ye,
2752
- density: ke,
2753
- shadow: Ce
2770
+ density: De,
2771
+ shadow: Fe
2754
2772
  }, Ea = {
2755
2773
  name: "playful",
2756
2774
  palette: it,
2757
2775
  shape: we,
2758
- density: De,
2776
+ density: ke,
2759
2777
  shadow: gt
2760
2778
  }, Aa = {
2761
2779
  name: "liquidGlass",
2762
2780
  palette: dt,
2763
2781
  shape: we,
2764
- density: De,
2782
+ density: ke,
2765
2783
  shadow: bt
2766
2784
  }, Oa = {
2767
2785
  name: "bento",
@@ -2773,14 +2791,14 @@ const ot = {
2773
2791
  name: "brutalist",
2774
2792
  palette: ut,
2775
2793
  shape: ye,
2776
- density: ke,
2794
+ density: De,
2777
2795
  shadow: xt
2778
2796
  }, ja = {
2779
2797
  name: "terminal",
2780
2798
  palette: ct,
2781
2799
  shape: ye,
2782
- density: ke,
2783
- shadow: Fe
2800
+ density: De,
2801
+ shadow: Ce
2784
2802
  }, Ua = {
2785
2803
  name: "softUI",
2786
2804
  palette: lt,
@@ -2791,21 +2809,21 @@ const ot = {
2791
2809
  name: "bloom",
2792
2810
  palette: ve,
2793
2811
  shape: re,
2794
- density: De,
2795
- shadow: Fe
2812
+ density: ke,
2813
+ shadow: Ce
2796
2814
  }, Ga = {
2797
2815
  name: "minimal",
2798
2816
  palette: ft,
2799
2817
  shape: re,
2800
2818
  density: se,
2801
- shadow: Ce
2819
+ shadow: Fe
2802
2820
  }, _a = {
2803
2821
  default: ot,
2804
- brand: Ca,
2822
+ brand: Fa,
2805
2823
  indigo: ve,
2806
2824
  violet: lt,
2807
2825
  emerald: ct,
2808
- teal: Fa,
2826
+ teal: Ca,
2809
2827
  rose: it,
2810
2828
  coral: ut,
2811
2829
  amber: Pa,
@@ -2817,18 +2835,18 @@ const ot = {
2817
2835
  rounded: re,
2818
2836
  pill: we
2819
2837
  }, Ka = {
2820
- compact: ke,
2838
+ compact: De,
2821
2839
  default: se,
2822
- spacious: De
2840
+ spacious: ke
2823
2841
  }, Ya = {
2824
- flat: Ce,
2842
+ flat: Fe,
2825
2843
  subtle: pt,
2826
2844
  elevated: gt,
2827
2845
  liquidGlass: bt,
2828
2846
  brutalist: xt,
2829
2847
  neumorphic: mt,
2830
2848
  natural: ht,
2831
- glow: Fe
2849
+ glow: Ce
2832
2850
  }, Za = {
2833
2851
  modern: Ha,
2834
2852
  enterprise: Na,
@@ -2883,20 +2901,20 @@ function fn({
2883
2901
  if (a) {
2884
2902
  const k = st(a, e);
2885
2903
  if (o) {
2886
- const v = {};
2904
+ const L = {};
2887
2905
  for (const [b, m] of Object.entries(o))
2888
- (b.startsWith("space") || b.startsWith("radius") || b.startsWith("shadow") || b.startsWith("duration") || b.startsWith("easing")) && (v[b] = m);
2889
- return { ...k, ...v };
2906
+ (b.startsWith("space") || b.startsWith("radius") || b.startsWith("shadow") || b.startsWith("duration") || b.startsWith("easing")) && (L[b] = m);
2907
+ return { ...k, ...L };
2890
2908
  }
2891
2909
  return k;
2892
2910
  }
2893
- const i = e === "dark" ? at : he, d = o ? { ...o, ...s } : s, g = d ? { ...i, ...d } : i, h = d ? rt(d, g, e) : {}, f = (d == null ? void 0 : d.accentBorder) ?? (e === "light" ? z(g.accentDefault, -0.15) : z(g.accentDefault, 0.15)), w = (d == null ? void 0 : d.accentFg) ?? nt(g.accentDefault), S = Ra(g.accentDefault, w);
2911
+ const i = e === "dark" ? at : he, d = o ? { ...o, ...s } : s, g = d ? { ...i, ...d } : i, h = d ? rt(d, g, e) : {}, p = (d == null ? void 0 : d.accentBorder) ?? (e === "light" ? M(g.accentDefault, -0.15) : M(g.accentDefault, 0.15)), y = (d == null ? void 0 : d.accentFg) ?? nt(g.accentDefault), I = La(g.accentDefault, y);
2894
2912
  return {
2895
2913
  ...g,
2896
2914
  ...h,
2897
- accentDefault: S,
2898
- accentFg: w,
2899
- accentBorder: f
2915
+ accentDefault: I,
2916
+ accentFg: y,
2917
+ accentBorder: p
2900
2918
  };
2901
2919
  })(), u = `html { font-size: 14px; }
2902
2920
  ` + ha(c, ":root");
@@ -2906,7 +2924,7 @@ function fn({
2906
2924
  var d;
2907
2925
  (d = document.getElementById(`lucent-tokens-${r}`)) == null || d.remove();
2908
2926
  };
2909
- }, [r, u]), /* @__PURE__ */ p(vt.Provider, { value: { theme: e, tokens: c }, children: n });
2927
+ }, [r, u]), /* @__PURE__ */ f(vt.Provider, { value: { theme: e, tokens: c }, children: n });
2910
2928
  }
2911
2929
  function pn() {
2912
2930
  return yt(vt);
@@ -2936,14 +2954,14 @@ export {
2936
2954
  re as U,
2937
2955
  ye as V,
2938
2956
  Ua as W,
2939
- De as X,
2957
+ ke as X,
2940
2958
  pt as Y,
2941
2959
  ja as Z,
2942
2960
  pn as _,
2943
- z as a,
2961
+ M as a,
2944
2962
  da as a0,
2945
2963
  ua as a1,
2946
- Ra as a2,
2964
+ La as a2,
2947
2965
  on as b,
2948
2966
  de as c,
2949
2967
  Ze as d,
@@ -2953,10 +2971,10 @@ export {
2953
2971
  ln as h,
2954
2972
  Oa as i,
2955
2973
  qa as j,
2956
- Ca as k,
2974
+ Fa as k,
2957
2975
  Xa as l,
2958
2976
  xt as m,
2959
- ke as n,
2977
+ De as n,
2960
2978
  st as o,
2961
2979
  at as p,
2962
2980
  se as q,
@@ -2966,7 +2984,7 @@ export {
2966
2984
  gt as u,
2967
2985
  ct as v,
2968
2986
  Na as w,
2969
- Ce as x,
2987
+ Fe as x,
2970
2988
  $a as y,
2971
- Fe as z
2989
+ Ce as z
2972
2990
  };