lucent-ui 0.40.0 → 0.41.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 (26) hide show
  1. package/dist/LucentProvider-DluNb5H9.cjs +109 -0
  2. package/dist/{LucentProvider-Bm39MMvv.js → LucentProvider-lGSitrJV.js} +1019 -1001
  3. package/dist/devtools.cjs +1 -1
  4. package/dist/devtools.js +1 -1
  5. package/dist/index.cjs +47 -42
  6. package/dist/index.d.ts +33 -4
  7. package/dist/index.js +2252 -1998
  8. package/dist-server/server/pattern-registry.js +6 -0
  9. package/dist-server/server/recipe-registry.js +18 -0
  10. package/dist-server/src/components/molecules/PageLayout/PageLayout.manifest.js +65 -8
  11. package/dist-server/src/manifest/patterns/index.js +2 -0
  12. package/dist-server/src/manifest/patterns/multi-step-wizard.pattern.js +180 -0
  13. package/dist-server/src/manifest/patterns/search-filter-panel.pattern.js +188 -0
  14. package/dist-server/src/manifest/patterns/tab-page.pattern.js +152 -0
  15. package/dist-server/src/manifest/recipes/action-bar.recipe.js +91 -0
  16. package/dist-server/src/manifest/recipes/collapsible-card.recipe.js +100 -0
  17. package/dist-server/src/manifest/recipes/empty-state-card.recipe.js +72 -0
  18. package/dist-server/src/manifest/recipes/form-layout.recipe.js +98 -0
  19. package/dist-server/src/manifest/recipes/index.js +8 -0
  20. package/dist-server/src/manifest/recipes/profile-card.recipe.js +101 -0
  21. package/dist-server/src/manifest/recipes/search-filter-bar.recipe.js +122 -0
  22. package/dist-server/src/manifest/recipes/settings-panel.recipe.js +167 -0
  23. package/dist-server/src/manifest/recipes/stats-row.recipe.js +106 -0
  24. package/dist-server/src/manifest/validate.test.js +28 -0
  25. package/package.json +1 -1
  26. package/dist/LucentProvider-CzEDW5SL.cjs +0 -109
package/dist/{LucentProvider-Bm39MMvv.js → LucentProvider-lGSitrJV.js} RENAMED
@@ -1,7 +1,7 @@
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 = {
1
+ import { jsxs as T, jsx as f, Fragment as Ye } from "react/jsx-runtime";
2
+ import { forwardRef as he, useState as F, useRef as j, useEffect as re, useLayoutEffect as ve, useId as Ze, useCallback as fe, useContext as Dt, createContext as St } from "react";
3
+ import { createPortal as kt } from "react-dom";
4
+ const Mt = {
5
5
  primary: {
6
6
  background: "var(--lucent-accent-default)",
7
7
  color: "var(--lucent-accent-fg)",
@@ -37,15 +37,15 @@ const kt = {
37
37
  color: "var(--lucent-danger-text)",
38
38
  border: "1px solid transparent"
39
39
  }
40
- }, St = {
40
+ }, zt = {
41
41
  "2xs": { height: "22px", padding: "0 var(--lucent-space-2)", fontSize: "var(--lucent-font-size-xs)", borderRadius: "var(--lucent-radius-md)" },
42
42
  xs: { height: "26px", padding: "0 var(--lucent-space-3)", fontSize: "var(--lucent-font-size-xs)" },
43
43
  sm: { height: "calc(var(--lucent-space-8) * 0.5 + 18px)", padding: "0 var(--lucent-space-4)", fontSize: "var(--lucent-font-size-sm)" },
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
- }, 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, 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 = {
46
+ }, Je = he(
47
+ ({ variant: e = "primary", size: t = "md", loading: o = !1, fullWidth: a = !1, spread: n = !1, leftIcon: r, rightIcon: s, chevron: c = !1, disableHoverStyles: i = !1, bordered: d = !0, href: u, target: x, rel: h, children: b, disabled: v, style: B, type: I, onClick: k, ...p }, m) => {
48
+ const S = v ?? o, $ = !b && !o && (!!r || !!s), C = u !== void 0, O = C ? "a" : "button", N = {
49
49
  display: "inline-flex",
50
50
  alignItems: "center",
51
51
  justifyContent: n ? "space-between" : "center",
@@ -55,91 +55,91 @@ const kt = {
55
55
  lineHeight: 1,
56
56
  letterSpacing: "0.01em",
57
57
  borderRadius: "var(--lucent-radius-lg)",
58
- cursor: w ? "not-allowed" : "pointer",
58
+ cursor: S ? "not-allowed" : "pointer",
59
59
  width: a ? "100%" : void 0,
60
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
61
  whiteSpace: "nowrap",
62
62
  boxSizing: "border-box",
63
63
  outline: "none",
64
64
  margin: 0,
65
- ...St[t],
66
- ...R && { padding: 0, aspectRatio: "1" },
67
- ...kt[e],
65
+ ...zt[t],
66
+ ...$ && { padding: 0, aspectRatio: "1" },
67
+ ...Mt[e],
68
68
  // Anchor reset — browsers underline <a> by default
69
- ...E && { textDecoration: "none" },
70
- ...I,
71
- ...w && {
69
+ ...C && { textDecoration: "none" },
70
+ ...B,
71
+ ...S && {
72
72
  background: "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)",
73
73
  color: "var(--lucent-text-disabled)",
74
74
  borderColor: "transparent",
75
- ...E && { pointerEvents: "none" }
75
+ ...C && { pointerEvents: "none" }
76
76
  },
77
77
  // hide border entirely when bordered prop is false
78
- ...i === !1 && { border: "none" }
78
+ ...d === !1 && { border: "none" }
79
79
  };
80
80
  return /* @__PURE__ */ T(
81
- X,
81
+ O,
82
82
  {
83
83
  ref: m,
84
- "aria-busy": s,
85
- style: A,
86
- ...E ? {
84
+ "aria-busy": o,
85
+ style: N,
86
+ ...C ? {
87
87
  role: "link",
88
- ...w ? { "aria-disabled": !0, tabIndex: -1 } : { href: d },
89
- ...g !== void 0 && { target: g },
88
+ ...S ? { "aria-disabled": !0, tabIndex: -1 } : { href: u },
89
+ ...x !== void 0 && { target: x },
90
90
  ...h !== void 0 && { rel: h }
91
91
  } : {
92
- disabled: w,
93
- ...k !== void 0 && { type: k }
92
+ disabled: S,
93
+ ...I !== void 0 && { type: I }
94
94
  },
95
95
  onMouseEnter: (D) => {
96
- var C;
97
- !w && !u && zt(D.currentTarget, e, i), (C = b.onMouseEnter) == null || C.call(b, D);
96
+ var R;
97
+ !S && !i && It(D.currentTarget, e, d), (R = p.onMouseEnter) == null || R.call(p, D);
98
98
  },
99
99
  onMouseLeave: (D) => {
100
- var C;
101
- !w && !u && Tt(D.currentTarget, e, i), (C = b.onMouseLeave) == null || C.call(b, D);
100
+ var R;
101
+ !S && !i && Bt(D.currentTarget, e, d), (R = p.onMouseLeave) == null || R.call(p, D);
102
102
  },
103
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";
104
+ var R;
105
+ if (!S) {
106
+ const P = 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 ${P}`, D.currentTarget.dataset.pressed = "1";
108
108
  }
109
- (C = b.onMouseDown) == null || C.call(b, D);
109
+ (R = p.onMouseDown) == null || R.call(p, D);
110
110
  },
111
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);
112
+ var R;
113
+ D.currentTarget.style.transform = "", D.currentTarget.style.boxShadow = "", delete D.currentTarget.dataset.pressed, (R = p.onMouseUp) == null || R.call(p, D);
114
114
  },
115
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);
116
+ var R;
117
+ D.currentTarget.dataset.pressed || (D.currentTarget.style.boxShadow = "0 0 0 3px var(--lucent-accent-subtle)"), (R = p.onFocus) == null || R.call(p, D);
118
118
  },
119
119
  onBlur: (D) => {
120
- var C;
121
- D.currentTarget.style.boxShadow = "", (C = b.onBlur) == null || C.call(b, D);
120
+ var R;
121
+ D.currentTarget.style.boxShadow = "", (R = p.onBlur) == null || R.call(p, D);
122
122
  },
123
123
  onClick: (D) => {
124
- if (E && w) {
124
+ if (C && S) {
125
125
  D.preventDefault();
126
126
  return;
127
127
  }
128
- L == null || L(D);
128
+ k == null || k(D);
129
129
  },
130
- ...b,
130
+ ...p,
131
131
  children: [
132
132
  r,
133
- s ? /* @__PURE__ */ f($t, {}) : p,
134
- !s && o,
135
- !s && c && /* @__PURE__ */ f(Bt, { size: t })
133
+ o ? /* @__PURE__ */ f(Lt, {}) : b,
134
+ !o && s,
135
+ !o && c && /* @__PURE__ */ f(Pt, { size: t })
136
136
  ]
137
137
  }
138
138
  );
139
139
  }
140
140
  );
141
- Ye.displayName = "Button";
142
- const Mt = {
141
+ Je.displayName = "Button";
142
+ const Tt = {
143
143
  primary: "0 4px 14px -2px color-mix(in srgb, var(--lucent-accent-default) 25%, transparent)",
144
144
  secondary: "0 4px 14px -2px color-mix(in srgb, var(--lucent-accent-default) 20%, transparent)",
145
145
  outline: "0 4px 14px -2px color-mix(in srgb, var(--lucent-accent-default) 20%, transparent)",
@@ -148,32 +148,32 @@ const Mt = {
148
148
  "danger-outline": "0 4px 14px -2px color-mix(in srgb, var(--lucent-danger-default) 20%, transparent)",
149
149
  "danger-ghost": "0 4px 14px -2px color-mix(in srgb, var(--lucent-danger-default) 15%, transparent)"
150
150
  };
151
- function zt(e, t, s) {
152
- e.style.transform = "translateY(-1px)", e.style.boxShadow = Mt[t], t === "primary" ? e.style.background = "var(--lucent-accent-hover)" : t === "secondary" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 22%, transparent)" : t === "outline" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 10%, transparent)" : t === "ghost" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 8%, transparent)" : t === "danger" ? (e.style.background = "var(--lucent-danger-hover)", s !== !1 && (e.style.borderColor = "var(--lucent-danger-hover)")) : t === "danger-outline" ? (e.style.background = "color-mix(in srgb, var(--lucent-danger-default) 10%, var(--lucent-surface))", s !== !1 && (e.style.borderColor = "var(--lucent-danger-hover)")) : t === "danger-ghost" && (e.style.background = "color-mix(in srgb, var(--lucent-danger-default) 8%, var(--lucent-surface))");
151
+ function It(e, t, o) {
152
+ e.style.transform = "translateY(-1px)", e.style.boxShadow = Tt[t], t === "primary" ? e.style.background = "var(--lucent-accent-hover)" : t === "secondary" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 22%, transparent)" : t === "outline" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 10%, transparent)" : t === "ghost" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 8%, transparent)" : t === "danger" ? (e.style.background = "var(--lucent-danger-hover)", o !== !1 && (e.style.borderColor = "var(--lucent-danger-hover)")) : t === "danger-outline" ? (e.style.background = "color-mix(in srgb, var(--lucent-danger-default) 10%, var(--lucent-surface))", o !== !1 && (e.style.borderColor = "var(--lucent-danger-hover)")) : t === "danger-ghost" && (e.style.background = "color-mix(in srgb, var(--lucent-danger-default) 8%, var(--lucent-surface))");
153
153
  }
154
- function Tt(e, t, s) {
155
- e.style.transform = "", e.style.boxShadow = "", t === "primary" ? e.style.background = "var(--lucent-accent-default)" : t === "secondary" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 16%, transparent)" : t === "outline" || t === "ghost" ? e.style.background = "transparent" : t === "danger" ? (e.style.background = "var(--lucent-danger-default)", s !== !1 && (e.style.borderColor = "var(--lucent-danger-default)")) : t === "danger-outline" ? (e.style.background = "transparent", s !== !1 && (e.style.borderColor = "var(--lucent-danger-default)")) : t === "danger-ghost" && (e.style.background = "transparent");
154
+ function Bt(e, t, o) {
155
+ e.style.transform = "", e.style.boxShadow = "", t === "primary" ? e.style.background = "var(--lucent-accent-default)" : t === "secondary" ? e.style.background = "color-mix(in srgb, var(--lucent-accent-default) 16%, transparent)" : t === "outline" || t === "ghost" ? e.style.background = "transparent" : t === "danger" ? (e.style.background = "var(--lucent-danger-default)", o !== !1 && (e.style.borderColor = "var(--lucent-danger-default)")) : t === "danger-outline" ? (e.style.background = "transparent", o !== !1 && (e.style.borderColor = "var(--lucent-danger-default)")) : t === "danger-ghost" && (e.style.background = "transparent");
156
156
  }
157
- const It = { "2xs": 8, xs: 10, sm: 12, md: 14, lg: 16 };
158
- function Bt({ size: e }) {
159
- const t = It[e];
157
+ const $t = { "2xs": 8, xs: 10, sm: 12, md: 14, lg: 16 };
158
+ function Pt({ size: e }) {
159
+ const t = $t[e];
160
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" }) });
161
161
  }
162
- function $t() {
162
+ function Lt() {
163
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
164
  /* @__PURE__ */ f("style", { children: "@keyframes lucent-spin { to { transform: rotate(360deg); } }" }),
165
165
  /* @__PURE__ */ f("path", { d: "M12 2a10 10 0 0 1 10 10" })
166
166
  ] });
167
167
  }
168
- const Lt = {
168
+ const Rt = {
169
169
  sm: "calc(var(--lucent-space-8) * 0.5 + 16px)",
170
170
  md: "calc(var(--lucent-space-10) * 0.5 + 20px)",
171
171
  lg: "calc(var(--lucent-space-12) * 0.5 + 24px)"
172
- }, Pe = {
172
+ }, He = {
173
173
  sm: "var(--lucent-font-size-sm)",
174
174
  md: "var(--lucent-font-size-md)",
175
175
  lg: "var(--lucent-font-size-md)"
176
- }, Me = {
176
+ }, Te = {
177
177
  sm: "var(--lucent-font-size-sm)",
178
178
  md: "var(--lucent-font-size-sm)",
179
179
  lg: "var(--lucent-font-size-md)"
@@ -181,43 +181,43 @@ const Lt = {
181
181
  sm: "var(--lucent-space-3)",
182
182
  md: "var(--lucent-space-4)",
183
183
  lg: "var(--lucent-space-4)"
184
- }, We = {
184
+ }, Ne = {
185
185
  sm: "calc(var(--lucent-space-3) + 14px + var(--lucent-space-2))",
186
186
  md: "calc(var(--lucent-space-4) + 18px + var(--lucent-space-2))",
187
187
  lg: "calc(var(--lucent-space-4) + 20px + var(--lucent-space-3))"
188
- }, te = xe(
188
+ }, te = he(
189
189
  ({
190
190
  size: e = "md",
191
191
  label: t,
192
- helperText: s,
192
+ helperText: o,
193
193
  errorText: a,
194
194
  leftElement: n,
195
195
  rightElement: r,
196
- prefix: o,
196
+ prefix: s,
197
197
  suffix: c,
198
- id: u,
199
- style: i,
200
- ...d
201
- }, g) => {
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 = {
198
+ id: i,
199
+ style: d,
200
+ ...u
201
+ }, x) => {
202
+ const h = i ?? `lucent-input-${Math.random().toString(36).slice(2, 7)}`, b = !!a, v = !!u.disabled, [B, I] = F(!1), [k, p] = F(!1), m = v ? "transparent" : b ? "var(--lucent-danger-default)" : B ? "var(--lucent-accent-border)" : k ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", S = B ? `0 0 0 3px ${b ? "var(--lucent-danger-subtle)" : "var(--lucent-accent-subtle)"}` : "none", $ = {
203
203
  display: "flex",
204
204
  alignItems: "center",
205
- color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
206
- fontSize: Pe[e],
205
+ color: v ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
206
+ fontSize: He[e],
207
207
  fontFamily: "var(--lucent-font-family-base)",
208
208
  whiteSpace: "nowrap",
209
209
  userSelect: "none",
210
210
  flexShrink: 0
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: [
211
+ }, C = { ...$, paddingLeft: ee[e], paddingRight: "2px" }, O = { ...$, paddingLeft: "2px", paddingRight: ee[e] };
212
+ return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: "var(--lucent-space-1)", width: "100%", ...d }, children: [
213
213
  t && /* @__PURE__ */ f(
214
214
  "label",
215
215
  {
216
216
  htmlFor: h,
217
217
  style: {
218
- fontSize: Me[e],
218
+ fontSize: Te[e],
219
219
  fontWeight: "var(--lucent-font-weight-medium)",
220
- color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
220
+ color: v ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
221
221
  fontFamily: "var(--lucent-font-family-base)"
222
222
  },
223
223
  children: t
@@ -229,29 +229,29 @@ const Lt = {
229
229
  style: {
230
230
  display: "flex",
231
231
  alignItems: "stretch",
232
- height: Lt[e],
232
+ height: Rt[e],
233
233
  border: `1px solid ${m}`,
234
234
  borderRadius: "var(--lucent-radius-lg)",
235
- boxShadow: w,
236
- background: y ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
235
+ boxShadow: S,
236
+ background: v ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
237
237
  overflow: "hidden",
238
- cursor: y ? "not-allowed" : void 0,
238
+ cursor: v ? "not-allowed" : void 0,
239
239
  transition: [
240
240
  "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
241
241
  "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)"
242
242
  ].join(", ")
243
243
  },
244
244
  onMouseEnter: () => {
245
- y || b(!0);
245
+ v || p(!0);
246
246
  },
247
- onMouseLeave: () => b(!1),
247
+ onMouseLeave: () => p(!1),
248
248
  children: [
249
- o && /* @__PURE__ */ f("span", { style: E, children: o }),
249
+ s && /* @__PURE__ */ f("span", { style: C, children: s }),
250
250
  /* @__PURE__ */ T("div", { style: { position: "relative", flex: 1, display: "flex", alignItems: "center", minWidth: 0 }, children: [
251
251
  n && /* @__PURE__ */ f("span", { style: {
252
252
  position: "absolute",
253
253
  left: ee[e],
254
- color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
254
+ color: v ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
255
255
  display: "flex",
256
256
  alignItems: "center",
257
257
  pointerEvents: "none"
@@ -259,96 +259,96 @@ const Lt = {
259
259
  /* @__PURE__ */ f(
260
260
  "input",
261
261
  {
262
- ref: g,
262
+ ref: x,
263
263
  id: h,
264
- "aria-invalid": p,
265
- "aria-describedby": p ? `${h}-error` : s ? `${h}-helper` : void 0,
264
+ "aria-invalid": b,
265
+ "aria-describedby": b ? `${h}-error` : o ? `${h}-helper` : void 0,
266
266
  style: {
267
267
  width: "100%",
268
268
  height: "100%",
269
- paddingLeft: n ? We[e] : ee[e],
270
- paddingRight: r ? We[e] : ee[e],
271
- fontSize: Pe[e],
269
+ paddingLeft: n ? Ne[e] : ee[e],
270
+ paddingRight: r ? Ne[e] : ee[e],
271
+ fontSize: He[e],
272
272
  fontFamily: "var(--lucent-font-family-base)",
273
- color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
273
+ color: v ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
274
274
  background: "transparent",
275
275
  border: "none",
276
276
  outline: "none",
277
- cursor: y ? "not-allowed" : void 0,
277
+ cursor: v ? "not-allowed" : void 0,
278
278
  boxSizing: "border-box"
279
279
  },
280
- ...d,
281
- onFocus: (A) => {
280
+ ...u,
281
+ onFocus: (N) => {
282
282
  var D;
283
- k(!0), (D = d.onFocus) == null || D.call(d, A);
283
+ I(!0), (D = u.onFocus) == null || D.call(u, N);
284
284
  },
285
- onBlur: (A) => {
285
+ onBlur: (N) => {
286
286
  var D;
287
- k(!1), (D = d.onBlur) == null || D.call(d, A);
287
+ I(!1), (D = u.onBlur) == null || D.call(u, N);
288
288
  }
289
289
  }
290
290
  ),
291
291
  r && /* @__PURE__ */ f("span", { style: {
292
292
  position: "absolute",
293
293
  right: ee[e],
294
- color: y ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
294
+ color: v ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
295
295
  display: "flex",
296
296
  alignItems: "center"
297
297
  }, children: r })
298
298
  ] }),
299
- c && /* @__PURE__ */ f("span", { style: X, children: c })
299
+ c && /* @__PURE__ */ f("span", { style: O, children: c })
300
300
  ]
301
301
  }
302
302
  ),
303
- p && /* @__PURE__ */ f(
303
+ b && /* @__PURE__ */ f(
304
304
  "span",
305
305
  {
306
306
  id: `${h}-error`,
307
307
  role: "alert",
308
308
  style: {
309
- fontSize: Me[e],
309
+ fontSize: Te[e],
310
310
  color: "var(--lucent-danger-text)",
311
311
  fontFamily: "var(--lucent-font-family-base)"
312
312
  },
313
313
  children: a
314
314
  }
315
315
  ),
316
- !p && s && /* @__PURE__ */ f(
316
+ !b && o && /* @__PURE__ */ f(
317
317
  "span",
318
318
  {
319
319
  id: `${h}-helper`,
320
320
  style: {
321
- fontSize: Me[e],
321
+ fontSize: Te[e],
322
322
  color: "var(--lucent-text-secondary)",
323
323
  fontFamily: "var(--lucent-font-family-base)"
324
324
  },
325
- children: s
325
+ children: o
326
326
  }
327
327
  )
328
328
  ] });
329
329
  }
330
330
  );
331
331
  te.displayName = "Input";
332
- const Rt = {
332
+ const Ft = {
333
333
  neutral: { bg: "var(--lucent-surface-secondary)", color: "var(--lucent-text-secondary)", border: "var(--lucent-border-default)" },
334
334
  accent: { bg: "var(--lucent-accent-default)", color: "var(--lucent-accent-fg)", border: "var(--lucent-accent-default)" },
335
335
  success: { bg: "var(--lucent-success-subtle)", color: "var(--lucent-success-text)", border: "var(--lucent-success-subtle)" },
336
336
  warning: { bg: "var(--lucent-warning-subtle)", color: "var(--lucent-warning-text)", border: "var(--lucent-warning-subtle)" },
337
337
  danger: { bg: "var(--lucent-danger-subtle)", color: "var(--lucent-danger-text)", border: "var(--lucent-danger-subtle)" },
338
338
  info: { bg: "var(--lucent-info-subtle)", color: "var(--lucent-info-text)", border: "var(--lucent-info-subtle)" }
339
- }, Ft = {
339
+ }, Ct = {
340
340
  sm: { fontSize: "var(--lucent-font-size-xs)", padding: "0 var(--lucent-space-2)", height: "18px" },
341
341
  md: { fontSize: "var(--lucent-font-size-sm)", padding: "0 var(--lucent-space-2)", height: "22px" }
342
342
  };
343
- function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a, style: n }) {
344
- const r = Rt[e], o = Ft[t];
343
+ function un({ variant: e = "neutral", size: t = "md", dot: o = !1, children: a, style: n }) {
344
+ const r = Ft[e], s = Ct[t];
345
345
  return /* @__PURE__ */ T("span", { style: {
346
346
  display: "inline-flex",
347
347
  alignItems: "center",
348
348
  gap: "var(--lucent-space-1)",
349
- height: o.height,
350
- padding: o.padding,
351
- fontSize: o.fontSize,
349
+ height: s.height,
350
+ padding: s.padding,
351
+ fontSize: s.fontSize,
352
352
  fontFamily: "var(--lucent-font-family-base)",
353
353
  fontWeight: "var(--lucent-font-weight-medium)",
354
354
  lineHeight: 1,
@@ -360,7 +360,7 @@ function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a,
360
360
  boxSizing: "border-box",
361
361
  ...n
362
362
  }, children: [
363
- s && /* @__PURE__ */ f("span", { style: {
363
+ o && /* @__PURE__ */ f("span", { style: {
364
364
  width: 6,
365
365
  height: 6,
366
366
  borderRadius: "var(--lucent-radius-full)",
@@ -370,11 +370,11 @@ function on({ variant: e = "neutral", size: t = "md", dot: s = !1, children: a,
370
370
  a
371
371
  ] });
372
372
  }
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 = {
373
+ const Wt = { 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)" }, Ht = {
374
374
  sm: { track: [28, 16], thumb: 12 },
375
375
  md: { track: [36, 20], thumb: 16 },
376
376
  lg: { track: [44, 24], thumb: 20 }
377
- }, He = "cubic-bezier(0.34, 1.56, 0.64, 1)", Wt = `
377
+ }, Ee = "cubic-bezier(0.34, 1.56, 0.64, 1)", Nt = `
378
378
  @keyframes lucent-toggle-pop {
379
379
  0% { transform: scale(1); }
380
380
  35% { transform: scale(0.94); }
@@ -382,39 +382,39 @@ const Ct = { sm: "calc(var(--lucent-space-8) * 0.5 + 16px)", md: "calc(var(--luc
382
382
  100% { transform: scale(1); }
383
383
  }
384
384
  `;
385
- function ln({
385
+ function dn({
386
386
  label: e,
387
387
  size: t = "md",
388
- checked: s,
388
+ checked: o,
389
389
  defaultChecked: a,
390
390
  contained: n = !1,
391
391
  helperText: r,
392
- align: o = "left",
392
+ align: s = "left",
393
393
  disabled: c,
394
- id: u,
395
- onChange: i,
396
- style: d,
397
- ...g
394
+ id: i,
395
+ onChange: d,
396
+ style: u,
397
+ ...x
398
398
  }) {
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);
400
- ne(() => {
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);
399
+ const h = i ?? `lucent-toggle-${Math.random().toString(36).slice(2, 7)}`, b = o !== void 0, [v, B] = F(a ?? !1), I = b ? !!o : v, k = j(I), [p, m] = F(0), [S, $] = F(!1);
400
+ re(() => {
401
+ if (!c && k.current !== I) {
402
+ k.current = I, m((q) => q + 1), $(!0);
403
+ const E = setTimeout(() => $(!1), 150);
404
+ return () => clearTimeout(E);
405
405
  }
406
- }, [k, c]);
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(
406
+ }, [I, c]);
407
+ const { track: [C, O], thumb: N } = Ht[t], D = I ? C - N - 2 : 2, R = (E) => {
408
+ b || B(E.target.checked), d == null || d(E);
409
+ }, V = /* @__PURE__ */ T(
410
410
  "span",
411
411
  {
412
412
  "aria-hidden": !0,
413
413
  style: {
414
414
  position: "relative",
415
- width: E,
416
- height: X,
417
- borderRadius: X / 2,
415
+ width: C,
416
+ height: O,
417
+ borderRadius: O / 2,
418
418
  flexShrink: 0
419
419
  },
420
420
  children: [
@@ -425,12 +425,12 @@ function ln({
425
425
  position: "absolute",
426
426
  inset: 0,
427
427
  borderRadius: "inherit",
428
- background: c ? "var(--lucent-surface-secondary)" : k ? "var(--lucent-accent-default)" : "color-mix(in srgb, var(--lucent-text-primary) 12%, transparent)",
428
+ background: c ? "var(--lucent-surface-secondary)" : I ? "var(--lucent-accent-default)" : "color-mix(in srgb, var(--lucent-text-primary) 12%, transparent)",
429
429
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)",
430
- animation: b > 0 ? `lucent-toggle-pop 240ms ${He} forwards` : void 0
430
+ animation: p > 0 ? `lucent-toggle-pop 240ms ${Ee} forwards` : void 0
431
431
  }
432
432
  },
433
- b
433
+ p
434
434
  ),
435
435
  /* @__PURE__ */ f(
436
436
  "span",
@@ -439,31 +439,31 @@ function ln({
439
439
  position: "absolute",
440
440
  top: 2,
441
441
  left: D,
442
- width: w ? A * 1.3 : A,
443
- height: A,
444
- borderRadius: A,
442
+ width: S ? N * 1.3 : N,
443
+ height: N,
444
+ borderRadius: N,
445
445
  background: "#ffffff",
446
446
  boxShadow: "0 1px 3px rgb(0 0 0 / 0.2)",
447
- transition: `left 260ms ${He}, width 200ms cubic-bezier(0.22, 1, 0.36, 1)`
447
+ transition: `left 260ms ${Ee}, width 200ms cubic-bezier(0.22, 1, 0.36, 1)`
448
448
  }
449
449
  }
450
450
  )
451
451
  ]
452
452
  }
453
- ), B = /* @__PURE__ */ T(
453
+ ), P = /* @__PURE__ */ T(
454
454
  "label",
455
455
  {
456
456
  style: {
457
- display: o === "right" ? "flex" : "inline-flex",
457
+ display: s === "right" ? "flex" : "inline-flex",
458
458
  alignItems: r ? "flex-start" : "center",
459
459
  gap: "var(--lucent-space-2)",
460
- ...o === "right" ? { width: "100%" } : {},
460
+ ...s === "right" ? { width: "100%" } : {},
461
461
  cursor: c ? "not-allowed" : "pointer",
462
462
  fontFamily: "var(--lucent-font-family-base)",
463
463
  fontSize: t === "sm" ? "var(--lucent-font-size-sm)" : "var(--lucent-font-size-md)",
464
464
  color: c ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
465
465
  userSelect: "none",
466
- ...n ? {} : d
466
+ ...n ? {} : u
467
467
  },
468
468
  children: [
469
469
  /* @__PURE__ */ f(
@@ -472,16 +472,16 @@ function ln({
472
472
  type: "checkbox",
473
473
  role: "switch",
474
474
  id: h,
475
- checked: p ? s : y,
475
+ checked: b ? o : v,
476
476
  disabled: c,
477
- onChange: C,
478
- "aria-checked": k,
477
+ onChange: R,
478
+ "aria-checked": I,
479
479
  style: { position: "absolute", opacity: 0, width: 0, height: 0, margin: 0, pointerEvents: "none" },
480
- ...g
480
+ ...x
481
481
  }
482
482
  ),
483
- o === "left" && K,
484
- e || r ? /* @__PURE__ */ T("span", { style: { display: "flex", flexDirection: "column", flex: o === "right" ? 1 : void 0 }, children: [
483
+ s === "left" && V,
484
+ e || r ? /* @__PURE__ */ T("span", { style: { display: "flex", flexDirection: "column", flex: s === "right" ? 1 : void 0 }, children: [
485
485
  e && /* @__PURE__ */ f("span", { style: {
486
486
  fontWeight: r ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
487
487
  lineHeight: r ? 1.3 : 1
@@ -492,66 +492,66 @@ function ln({
492
492
  marginTop: "2px"
493
493
  }, children: r })
494
494
  ] }) : null,
495
- o === "right" && K
495
+ s === "right" && V
496
496
  ]
497
497
  }
498
498
  );
499
- return /* @__PURE__ */ T(Ve, { children: [
500
- /* @__PURE__ */ f("style", { children: Wt }),
499
+ return /* @__PURE__ */ T(Ye, { children: [
500
+ /* @__PURE__ */ f("style", { children: Nt }),
501
501
  n ? /* @__PURE__ */ f(
502
502
  "div",
503
503
  {
504
504
  style: {
505
505
  border: "1px solid var(--lucent-border-strong)",
506
506
  borderRadius: "var(--lucent-radius-lg)",
507
- ...r ? { padding: "var(--lucent-space-3)" } : { minHeight: Ct[t], padding: "0 var(--lucent-space-3)", display: "flex", alignItems: "center" },
508
- background: k && !c ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "transparent",
507
+ ...r ? { padding: "var(--lucent-space-3)" } : { minHeight: Wt[t], padding: "0 var(--lucent-space-3)", display: "flex", alignItems: "center" },
508
+ background: I && !c ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "transparent",
509
509
  transition: "border-color var(--lucent-duration-fast) var(--lucent-easing-default), background var(--lucent-duration-fast) var(--lucent-easing-default)",
510
510
  cursor: c ? "not-allowed" : "pointer",
511
- ...d
511
+ ...u
512
512
  },
513
- onClick: (j) => {
514
- if (!c && j.target === j.currentTarget) {
515
- const _ = j.currentTarget.querySelector("input");
516
- _ == null || _.click();
513
+ onClick: (E) => {
514
+ if (!c && E.target === E.currentTarget) {
515
+ const q = E.currentTarget.querySelector("input");
516
+ q == null || q.click();
517
517
  }
518
518
  },
519
- children: B
519
+ children: P
520
520
  }
521
- ) : B
521
+ ) : P
522
522
  ] });
523
523
  }
524
- const Ht = {
524
+ const Et = {
525
525
  sm: "calc(var(--lucent-space-8) * 0.5 + 16px)",
526
526
  md: "calc(var(--lucent-space-10) * 0.5 + 20px)",
527
527
  lg: "calc(var(--lucent-space-12) * 0.5 + 24px)"
528
- }, Nt = {
528
+ }, At = {
529
529
  sm: "var(--lucent-font-size-sm)",
530
530
  md: "var(--lucent-font-size-md)",
531
531
  lg: "var(--lucent-font-size-md)"
532
- }, ze = {
532
+ }, Ie = {
533
533
  sm: "var(--lucent-font-size-sm)",
534
534
  md: "var(--lucent-font-size-sm)",
535
535
  lg: "var(--lucent-font-size-md)"
536
- }, Ne = {
536
+ }, Ae = {
537
537
  sm: "var(--lucent-space-2)",
538
538
  md: "var(--lucent-space-3)",
539
539
  lg: "var(--lucent-space-3)"
540
- }, Ze = xe(
541
- ({ options: e, size: t = "md", label: s, helperText: a, errorText: n, placeholder: r, disabled: o, id: c, style: u, ...i }, d) => {
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(
540
+ }, Qe = he(
541
+ ({ options: e, size: t = "md", label: o, helperText: a, errorText: n, placeholder: r, disabled: s, id: c, style: i, ...d }, u) => {
542
+ const x = c ?? `lucent-select-${Math.random().toString(36).slice(2, 7)}`, h = !!n, b = !!s, [v, B] = F(!1), [I, k] = F(!1), p = b ? "transparent" : h ? "var(--lucent-danger-default)" : v ? "var(--lucent-accent-border)" : I ? "var(--lucent-border-strong)" : "var(--lucent-border-default)", m = v ? `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%", ...i }, children: [
544
+ o && /* @__PURE__ */ f(
545
545
  "label",
546
546
  {
547
- htmlFor: g,
547
+ htmlFor: x,
548
548
  style: {
549
- fontSize: ze[t],
549
+ fontSize: Ie[t],
550
550
  fontWeight: "var(--lucent-font-weight-medium)",
551
- color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
551
+ color: b ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
552
552
  fontFamily: "var(--lucent-font-family-base)"
553
553
  },
554
- children: s
554
+ children: o
555
555
  }
556
556
  ),
557
557
  /* @__PURE__ */ T(
@@ -561,60 +561,60 @@ const Ht = {
561
561
  position: "relative",
562
562
  display: "flex",
563
563
  alignItems: "center",
564
- height: Ht[t],
565
- border: `1px solid ${b}`,
564
+ height: Et[t],
565
+ border: `1px solid ${p}`,
566
566
  borderRadius: "var(--lucent-radius-lg)",
567
567
  boxShadow: m,
568
- background: p ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
569
- cursor: p ? "not-allowed" : "pointer",
568
+ background: b ? "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)" : "var(--lucent-surface)",
569
+ cursor: b ? "not-allowed" : "pointer",
570
570
  transition: [
571
571
  "border-color var(--lucent-duration-fast) var(--lucent-easing-default)",
572
572
  "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)"
573
573
  ].join(", ")
574
574
  },
575
575
  onMouseEnter: () => {
576
- p || L(!0);
576
+ b || k(!0);
577
577
  },
578
- onMouseLeave: () => L(!1),
578
+ onMouseLeave: () => k(!1),
579
579
  children: [
580
580
  /* @__PURE__ */ T(
581
581
  "select",
582
582
  {
583
- ref: d,
584
- id: g,
585
- disabled: o,
583
+ ref: u,
584
+ id: x,
585
+ disabled: s,
586
586
  "aria-invalid": h,
587
- "aria-describedby": h ? `${g}-error` : a ? `${g}-helper` : void 0,
587
+ "aria-describedby": h ? `${x}-error` : a ? `${x}-helper` : void 0,
588
588
  style: {
589
589
  width: "100%",
590
590
  height: "100%",
591
- padding: `0 var(--lucent-space-8) 0 ${Ne[t]}`,
592
- fontSize: Nt[t],
591
+ padding: `0 var(--lucent-space-8) 0 ${Ae[t]}`,
592
+ fontSize: At[t],
593
593
  fontFamily: "var(--lucent-font-family-base)",
594
- color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
594
+ color: b ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
595
595
  background: "transparent",
596
596
  border: "none",
597
597
  borderRadius: "var(--lucent-radius-lg)",
598
598
  outline: "none",
599
599
  appearance: "none",
600
- cursor: p ? "not-allowed" : "pointer",
600
+ cursor: b ? "not-allowed" : "pointer",
601
601
  boxSizing: "border-box"
602
602
  },
603
- onFocus: (w) => {
604
- var R;
605
- p || I(!0), (R = i.onFocus) == null || R.call(i, w);
603
+ onFocus: (S) => {
604
+ var $;
605
+ b || B(!0), ($ = d.onFocus) == null || $.call(d, S);
606
606
  },
607
- onBlur: (w) => {
608
- var R;
609
- I(!1), (R = i.onBlur) == null || R.call(i, w);
607
+ onBlur: (S) => {
608
+ var $;
609
+ B(!1), ($ = d.onBlur) == null || $.call(d, S);
610
610
  },
611
611
  onMouseDown: () => {
612
- p || I(!0);
612
+ b || B(!0);
613
613
  },
614
- ...i,
614
+ ...d,
615
615
  children: [
616
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))
617
+ e.map((S) => /* @__PURE__ */ f("option", { value: S.value, disabled: S.disabled, children: S.label }, S.value))
618
618
  ]
619
619
  }
620
620
  ),
@@ -624,9 +624,9 @@ const Ht = {
624
624
  "aria-hidden": !0,
625
625
  style: {
626
626
  position: "absolute",
627
- right: Ne[t],
627
+ right: Ae[t],
628
628
  pointerEvents: "none",
629
- color: p ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
629
+ color: b ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
630
630
  display: "flex",
631
631
  alignItems: "center"
632
632
  },
@@ -639,10 +639,10 @@ const Ht = {
639
639
  h && /* @__PURE__ */ f(
640
640
  "span",
641
641
  {
642
- id: `${g}-error`,
642
+ id: `${x}-error`,
643
643
  role: "alert",
644
644
  style: {
645
- fontSize: ze[t],
645
+ fontSize: Ie[t],
646
646
  color: "var(--lucent-danger-text)",
647
647
  fontFamily: "var(--lucent-font-family-base)"
648
648
  },
@@ -652,9 +652,9 @@ const Ht = {
652
652
  !h && a && /* @__PURE__ */ f(
653
653
  "span",
654
654
  {
655
- id: `${g}-helper`,
655
+ id: `${x}-helper`,
656
656
  style: {
657
- fontSize: ze[t],
657
+ fontSize: Ie[t],
658
658
  color: "var(--lucent-text-secondary)",
659
659
  fontFamily: "var(--lucent-font-family-base)"
660
660
  },
@@ -664,8 +664,8 @@ const Ht = {
664
664
  ] });
665
665
  }
666
666
  );
667
- Ze.displayName = "Select";
668
- const Et = {
667
+ Qe.displayName = "Select";
668
+ const Ot = {
669
669
  primary: "var(--lucent-text-primary)",
670
670
  secondary: "var(--lucent-text-secondary)",
671
671
  disabled: "var(--lucent-text-disabled)",
@@ -675,7 +675,7 @@ const Et = {
675
675
  warning: "var(--lucent-warning-text)",
676
676
  danger: "var(--lucent-danger-text)",
677
677
  info: "var(--lucent-info-text)"
678
- }, At = {
678
+ }, Xt = {
679
679
  xs: "var(--lucent-font-size-xs)",
680
680
  sm: "var(--lucent-font-size-sm)",
681
681
  md: "var(--lucent-font-size-md)",
@@ -683,51 +683,51 @@ const Et = {
683
683
  xl: "var(--lucent-font-size-xl)",
684
684
  "2xl": "var(--lucent-font-size-2xl)",
685
685
  "3xl": "var(--lucent-font-size-3xl)"
686
- }, Ot = {
686
+ }, jt = {
687
687
  regular: "var(--lucent-font-weight-regular)",
688
688
  medium: "var(--lucent-font-weight-medium)",
689
689
  semibold: "var(--lucent-font-weight-semibold)",
690
690
  bold: "var(--lucent-font-weight-bold)"
691
- }, Xt = {
691
+ }, Ut = {
692
692
  tight: "var(--lucent-line-height-tight)",
693
693
  base: "var(--lucent-line-height-base)",
694
694
  relaxed: "var(--lucent-line-height-relaxed)"
695
- }, jt = {
695
+ }, qt = {
696
696
  base: "var(--lucent-font-family-base)",
697
697
  mono: "var(--lucent-font-family-mono)",
698
698
  display: "var(--lucent-font-family-display)"
699
699
  };
700
- function cn({
700
+ function fn({
701
701
  as: e = "p",
702
702
  size: t = "md",
703
- weight: s = "regular",
703
+ weight: o = "regular",
704
704
  color: a = "primary",
705
705
  align: n,
706
706
  lineHeight: r = "base",
707
- family: o = "base",
707
+ family: s = "base",
708
708
  truncate: c = !1,
709
- children: u,
710
- style: i,
711
- ...d
709
+ children: i,
710
+ style: d,
711
+ ...u
712
712
  }) {
713
- const g = {
714
- fontSize: At[t],
715
- fontWeight: Ot[s],
716
- color: Et[a],
713
+ const x = {
714
+ fontSize: Xt[t],
715
+ fontWeight: jt[o],
716
+ color: Ot[a],
717
717
  ...n !== void 0 && { textAlign: n },
718
- lineHeight: Xt[r],
719
- fontFamily: jt[o],
718
+ lineHeight: Ut[r],
719
+ fontFamily: qt[s],
720
720
  margin: 0,
721
721
  ...c && {
722
722
  overflow: "hidden",
723
723
  textOverflow: "ellipsis",
724
724
  whiteSpace: "nowrap"
725
725
  },
726
- ...i
726
+ ...d
727
727
  };
728
- return /* @__PURE__ */ f(e, { style: g, ...d, children: u });
728
+ return /* @__PURE__ */ f(e, { style: x, ...u, children: i });
729
729
  }
730
- const Ut = { sm: "3px", md: "4px", lg: "5px" }, qt = { sm: "14px", md: "18px", lg: "22px" }, Gt = `
730
+ const Gt = { sm: "3px", md: "4px", lg: "5px" }, _t = { sm: "14px", md: "18px", lg: "22px" }, Vt = `
731
731
  .lucent-slider {
732
732
  -webkit-appearance: none;
733
733
  appearance: none;
@@ -821,28 +821,28 @@ const Ut = { sm: "3px", md: "4px", lg: "5px" }, qt = { sm: "14px", md: "18px", l
821
821
  cursor: not-allowed;
822
822
  }
823
823
  `;
824
- function un({
824
+ function pn({
825
825
  label: e,
826
826
  showValue: t = !1,
827
- size: s = "md",
827
+ size: o = "md",
828
828
  min: a = 0,
829
829
  max: n = 100,
830
830
  step: r = 1,
831
- value: o,
831
+ value: s,
832
832
  defaultValue: c,
833
- disabled: u,
834
- id: i,
835
- onChange: d,
836
- style: g,
833
+ disabled: i,
834
+ id: d,
835
+ onChange: u,
836
+ style: x,
837
837
  ...h
838
838
  }) {
839
- const p = i ?? `lucent-slider-${Math.random().toString(36).slice(2, 7)}`, y = o !== void 0, [I, k] = P(
839
+ const b = d ?? `lucent-slider-${Math.random().toString(36).slice(2, 7)}`, v = s !== void 0, [B, I] = F(
840
840
  c ?? Math.round((a + n) / 2)
841
- ), L = y ? o : I, b = `${(L - a) / (n - a) * 100}%`, m = (w) => {
842
- y || k(Number(w.target.value)), d == null || d(w);
841
+ ), k = v ? s : B, p = `${(k - a) / (n - a) * 100}%`, m = (S) => {
842
+ v || I(Number(S.target.value)), u == null || u(S);
843
843
  };
844
- return /* @__PURE__ */ T(Ve, { children: [
845
- /* @__PURE__ */ f("style", { children: Gt }),
844
+ return /* @__PURE__ */ T(Ye, { children: [
845
+ /* @__PURE__ */ f("style", { children: Vt }),
846
846
  /* @__PURE__ */ T(
847
847
  "div",
848
848
  {
@@ -852,7 +852,7 @@ function un({
852
852
  gap: "var(--lucent-space-1)",
853
853
  width: "100%",
854
854
  fontFamily: "var(--lucent-font-family-base)",
855
- ...g
855
+ ...x
856
856
  },
857
857
  children: [
858
858
  (e || t) && /* @__PURE__ */ T(
@@ -867,12 +867,12 @@ function un({
867
867
  e && /* @__PURE__ */ f(
868
868
  "label",
869
869
  {
870
- htmlFor: p,
870
+ htmlFor: b,
871
871
  style: {
872
872
  fontSize: "var(--lucent-font-size-sm)",
873
873
  fontWeight: "var(--lucent-font-weight-medium)",
874
- color: u ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
875
- cursor: u ? "not-allowed" : "default"
874
+ color: i ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
875
+ cursor: i ? "not-allowed" : "default"
876
876
  },
877
877
  children: e
878
878
  }
@@ -882,10 +882,10 @@ function un({
882
882
  {
883
883
  style: {
884
884
  fontSize: "var(--lucent-font-size-sm)",
885
- color: u ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
885
+ color: i ? "var(--lucent-text-disabled)" : "var(--lucent-text-secondary)",
886
886
  fontVariantNumeric: "tabular-nums"
887
887
  },
888
- children: L
888
+ children: k
889
889
  }
890
890
  )
891
891
  ]
@@ -895,18 +895,18 @@ function un({
895
895
  "input",
896
896
  {
897
897
  type: "range",
898
- id: p,
898
+ id: b,
899
899
  className: "lucent-slider",
900
900
  min: a,
901
901
  max: n,
902
902
  step: r,
903
- disabled: u,
904
- value: y ? o : I,
903
+ disabled: i,
904
+ value: v ? s : B,
905
905
  onChange: m,
906
906
  style: {
907
- "--ls-track-h": Ut[s],
908
- "--ls-thumb": qt[s],
909
- "--ls-fill": b
907
+ "--ls-track-h": Gt[o],
908
+ "--ls-thumb": _t[o],
909
+ "--ls-fill": p
910
910
  },
911
911
  ...h
912
912
  }
@@ -916,51 +916,51 @@ function un({
916
916
  )
917
917
  ] });
918
918
  }
919
- const Ee = {
919
+ const Oe = {
920
920
  sm: "calc(var(--lucent-space-8) * 0.5 + 18px)",
921
921
  md: "calc(var(--lucent-space-10) * 0.5 + 22px)",
922
922
  lg: "calc(var(--lucent-space-12) * 0.5 + 26px)"
923
- }, _t = {
923
+ }, Kt = {
924
924
  sm: "var(--lucent-font-size-sm)",
925
925
  md: "var(--lucent-font-size-md)",
926
926
  lg: "var(--lucent-font-size-lg)"
927
- }, Vt = {
927
+ }, Yt = {
928
928
  sm: "var(--lucent-space-3)",
929
929
  md: "var(--lucent-space-4)",
930
930
  lg: "var(--lucent-space-5)"
931
931
  };
932
- function Je({
932
+ function et({
933
933
  options: e,
934
934
  value: t,
935
- defaultValue: s,
935
+ defaultValue: o,
936
936
  onChange: a,
937
937
  size: n = "md",
938
938
  disabled: r = !1,
939
- fullWidth: o = !0,
939
+ fullWidth: s = !0,
940
940
  id: c,
941
- style: u
941
+ style: i
942
942
  }) {
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);
947
- me(() => {
948
- const b = h.current;
949
- if (!b) return;
943
+ var k;
944
+ const [d, u] = F(
945
+ o ?? ((k = e[0]) == null ? void 0 : k.value) ?? ""
946
+ ), x = t !== void 0 ? t : d, h = j(null), [b, v] = F(null), B = j(!1);
947
+ ve(() => {
948
+ const p = h.current;
949
+ if (!p) return;
950
950
  const m = () => {
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);
951
+ const $ = p.querySelector(`[data-sc-value="${x}"]`);
952
+ $ && (v({
953
+ left: $.offsetLeft,
954
+ width: $.offsetWidth,
955
+ animate: B.current
956
+ }), B.current = !0);
957
957
  };
958
958
  m();
959
- const w = new ResizeObserver(m);
960
- return w.observe(b), () => w.disconnect();
961
- }, [g, e]);
962
- const k = (b) => {
963
- r || b.disabled || (t === void 0 && d(b.value), a == null || a(b.value));
959
+ const S = new ResizeObserver(m);
960
+ return S.observe(p), () => S.disconnect();
961
+ }, [x, e]);
962
+ const I = (p) => {
963
+ r || p.disabled || (t === void 0 && u(p.value), a == null || a(p.value));
964
964
  };
965
965
  return /* @__PURE__ */ T(
966
966
  "div",
@@ -972,8 +972,8 @@ function Je({
972
972
  position: "relative",
973
973
  display: "flex",
974
974
  alignItems: "center",
975
- width: o ? "100%" : "fit-content",
976
- height: Ee[n],
975
+ width: s ? "100%" : "fit-content",
976
+ height: Oe[n],
977
977
  // color-mix with transparent produces a relative tint that adapts to any
978
978
  // parent background (white, tinted chrome, dark mode). Baseline 2023.
979
979
  background: "color-mix(in srgb, var(--lucent-text-primary) 6%, transparent)",
@@ -981,39 +981,39 @@ function Je({
981
981
  padding: 0,
982
982
  gap: 0,
983
983
  opacity: r ? 0.5 : 1,
984
- ...u
984
+ ...i
985
985
  },
986
986
  children: [
987
- p && /* @__PURE__ */ f(
987
+ b && /* @__PURE__ */ f(
988
988
  "span",
989
989
  {
990
990
  "aria-hidden": !0,
991
991
  style: {
992
992
  position: "absolute",
993
993
  top: 3,
994
- left: p.left + 3,
995
- width: p.width - 6,
994
+ left: b.left + 3,
995
+ width: b.width - 6,
996
996
  height: "calc(100% - 6px)",
997
997
  background: "var(--lucent-surface)",
998
998
  borderRadius: "var(--lucent-radius-lg)",
999
999
  boxShadow: "var(--lucent-shadow-sm)",
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",
1000
+ transition: b.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",
1001
1001
  zIndex: 0,
1002
1002
  pointerEvents: "none"
1003
1003
  }
1004
1004
  }
1005
1005
  ),
1006
- e.map((b) => {
1007
- const m = b.value === g, w = r || !!b.disabled;
1006
+ e.map((p) => {
1007
+ const m = p.value === x, S = r || !!p.disabled;
1008
1008
  return /* @__PURE__ */ f(
1009
1009
  "button",
1010
1010
  {
1011
- "data-sc-value": b.value,
1011
+ "data-sc-value": p.value,
1012
1012
  type: "button",
1013
1013
  role: "radio",
1014
1014
  "aria-checked": m,
1015
- disabled: w,
1016
- onClick: () => k(b),
1015
+ disabled: S,
1016
+ onClick: () => I(p),
1017
1017
  style: {
1018
1018
  position: "relative",
1019
1019
  zIndex: 1,
@@ -1022,16 +1022,16 @@ function Je({
1022
1022
  justifyContent: "center",
1023
1023
  gap: "var(--lucent-space-1)",
1024
1024
  flex: 1,
1025
- height: Ee[n],
1026
- padding: `0 ${Vt[n]}`,
1027
- fontSize: _t[n],
1025
+ height: Oe[n],
1026
+ padding: `0 ${Yt[n]}`,
1027
+ fontSize: Kt[n],
1028
1028
  fontFamily: "var(--lucent-font-family-base)",
1029
1029
  fontWeight: m ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1030
- color: w ? "var(--lucent-text-disabled)" : m ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1030
+ color: S ? "var(--lucent-text-disabled)" : m ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1031
1031
  background: "transparent",
1032
1032
  border: "none",
1033
1033
  borderRadius: "var(--lucent-radius-lg)",
1034
- cursor: w ? "not-allowed" : "pointer",
1034
+ cursor: S ? "not-allowed" : "pointer",
1035
1035
  outline: "none",
1036
1036
  whiteSpace: "nowrap",
1037
1037
  transition: [
@@ -1039,38 +1039,38 @@ function Je({
1039
1039
  "font-weight var(--lucent-duration-fast) var(--lucent-easing-default)"
1040
1040
  ].join(", ")
1041
1041
  },
1042
- onFocus: (R) => {
1043
- R.currentTarget.matches(":focus-visible") && (R.currentTarget.style.boxShadow = "0 0 0 2px var(--lucent-accent-subtle)");
1042
+ onFocus: ($) => {
1043
+ $.currentTarget.matches(":focus-visible") && ($.currentTarget.style.boxShadow = "0 0 0 2px var(--lucent-accent-subtle)");
1044
1044
  },
1045
- onBlur: (R) => {
1046
- R.currentTarget.style.boxShadow = "";
1045
+ onBlur: ($) => {
1046
+ $.currentTarget.style.boxShadow = "";
1047
1047
  },
1048
- children: b.label
1048
+ children: p.label
1049
1049
  },
1050
- b.value
1050
+ p.value
1051
1051
  );
1052
1052
  })
1053
1053
  ]
1054
1054
  }
1055
1055
  );
1056
1056
  }
1057
- Je.displayName = "SegmentedControl";
1058
- const Kt = {
1057
+ et.displayName = "SegmentedControl";
1058
+ const Zt = {
1059
1059
  xs: 12,
1060
1060
  sm: 16,
1061
1061
  md: 22,
1062
1062
  lg: 28,
1063
1063
  xl: 36,
1064
1064
  "2xl": 48
1065
- }, Yt = {
1065
+ }, Jt = {
1066
1066
  xs: "var(--lucent-radius-sm)",
1067
1067
  sm: "var(--lucent-radius-sm)",
1068
1068
  md: "var(--lucent-radius-md)",
1069
1069
  lg: "var(--lucent-radius-md)",
1070
1070
  xl: "var(--lucent-radius-lg)",
1071
1071
  "2xl": "var(--lucent-radius-lg)"
1072
- }, Ae = "inset 0 0 0 1px rgba(0,0,0,0.2)", Oe = "inset 0 0 0 2px rgba(0,0,0,0.5)", Zt = "inset 0 0 0 1px rgba(0,0,0,0.2), 0 0 0 3px var(--lucent-accent-subtle)";
1073
- function Jt(e) {
1072
+ }, Xe = "inset 0 0 0 1px rgba(0,0,0,0.2)", je = "inset 0 0 0 2px rgba(0,0,0,0.5)", Qt = "inset 0 0 0 1px rgba(0,0,0,0.2), 0 0 0 3px var(--lucent-accent-subtle)";
1073
+ function ea(e) {
1074
1074
  return {
1075
1075
  backgroundImage: [
1076
1076
  `linear-gradient(${e}, ${e})`,
@@ -1084,84 +1084,84 @@ function Jt(e) {
1084
1084
  backgroundColor: "#fff"
1085
1085
  };
1086
1086
  }
1087
- const de = xe(({
1087
+ const pe = he(({
1088
1088
  color: e,
1089
1089
  size: t = "md",
1090
- shape: s = "circle",
1090
+ shape: o = "circle",
1091
1091
  showCheckerboard: a = !1,
1092
1092
  selected: n = !1,
1093
1093
  disabled: r = !1,
1094
- style: o,
1094
+ style: s,
1095
1095
  onFocus: c,
1096
- onBlur: u,
1097
- onClick: i,
1098
- ...d
1099
- }, g) => {
1100
- const h = Kt[t], p = s === "circle" ? "50%" : Yt[t];
1096
+ onBlur: i,
1097
+ onClick: d,
1098
+ ...u
1099
+ }, x) => {
1100
+ const h = Zt[t], b = o === "circle" ? "50%" : Jt[t];
1101
1101
  return /* @__PURE__ */ f(
1102
1102
  "button",
1103
1103
  {
1104
- ref: g,
1104
+ ref: x,
1105
1105
  type: "button",
1106
1106
  disabled: r,
1107
- onClick: i,
1107
+ onClick: d,
1108
1108
  style: {
1109
1109
  width: h,
1110
1110
  height: h,
1111
1111
  flexShrink: 0,
1112
- ...a ? Jt(e) : { background: e },
1112
+ ...a ? ea(e) : { background: e },
1113
1113
  border: "none",
1114
- borderRadius: p,
1115
- cursor: r ? "not-allowed" : i ? "pointer" : "default",
1114
+ borderRadius: b,
1115
+ cursor: r ? "not-allowed" : d ? "pointer" : "default",
1116
1116
  padding: 0,
1117
1117
  outline: "none",
1118
1118
  opacity: r ? 0.4 : 1,
1119
- boxShadow: n ? Oe : Ae,
1119
+ boxShadow: n ? je : Xe,
1120
1120
  transition: "box-shadow var(--lucent-duration-fast) var(--lucent-easing-default)",
1121
- ...o
1121
+ ...s
1122
1122
  },
1123
- onFocus: (y) => {
1124
- r || (y.currentTarget.style.boxShadow = Zt), c == null || c(y);
1123
+ onFocus: (v) => {
1124
+ r || (v.currentTarget.style.boxShadow = Qt), c == null || c(v);
1125
1125
  },
1126
- onBlur: (y) => {
1127
- y.currentTarget.style.boxShadow = n ? Oe : Ae, u == null || u(y);
1126
+ onBlur: (v) => {
1127
+ v.currentTarget.style.boxShadow = n ? je : Xe, i == null || i(v);
1128
1128
  },
1129
- ...d
1129
+ ...u
1130
1130
  }
1131
1131
  );
1132
1132
  });
1133
- de.displayName = "ColorSwatch";
1134
- function pe(e, t, s) {
1135
- return Math.max(t, Math.min(s, e));
1136
- }
1137
- function Qt(e, t, s) {
1138
- const a = t / 100, n = s / 100, r = n * a, o = r * (1 - Math.abs(e / 60 % 2 - 1)), c = n - r;
1139
- let u = 0, i = 0, d = 0;
1140
- 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) };
1141
- }
1142
- function ea(e, t, s) {
1143
- const a = e / 255, n = t / 255, r = s / 255, o = Math.max(a, n, r), c = Math.min(a, n, r), u = o - c, i = o, d = o === 0 ? 0 : u / o;
1144
- let g = 0;
1145
- return u !== 0 && (o === a ? g = ((n - r) / u + (n < r ? 6 : 0)) / 6 : o === n ? g = ((r - a) / u + 2) / 6 : g = ((a - n) / u + 4) / 6), { h: Math.round(g * 360), s: Math.round(d * 100), v: Math.round(i * 100) };
1146
- }
1147
- function ta(e, t, s) {
1148
- const a = e / 255, n = t / 255, r = s / 255, o = Math.max(a, n, r), c = Math.min(a, n, r), u = (o + c) / 2;
1149
- if (o === c) return { h: 0, s: 0, l: Math.round(u * 100) };
1150
- const i = o - c, d = u > 0.5 ? i / (2 - o - c) : i / (o + c);
1151
- let g = 0;
1152
- return o === a ? g = ((n - r) / i + (n < r ? 6 : 0)) / 6 : o === n ? g = ((r - a) / i + 2) / 6 : g = ((a - n) / i + 4) / 6, { h: Math.round(g * 360), s: Math.round(d * 100), l: Math.round(u * 100) };
1153
- }
1154
- function fe(e, t, s) {
1155
- const a = t / 100, n = s / 100, r = (1 - Math.abs(2 * n - 1)) * a, o = r * (1 - Math.abs(e / 60 % 2 - 1)), c = n - r / 2;
1156
- let u = 0, i = 0, d = 0;
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) };
1158
- }
1159
- function Re(e) {
1133
+ pe.displayName = "ColorSwatch";
1134
+ function be(e, t, o) {
1135
+ return Math.max(t, Math.min(o, e));
1136
+ }
1137
+ function ta(e, t, o) {
1138
+ const a = t / 100, n = o / 100, r = n * a, s = r * (1 - Math.abs(e / 60 % 2 - 1)), c = n - r;
1139
+ let i = 0, d = 0, u = 0;
1140
+ return e < 60 ? (i = r, d = s) : e < 120 ? (i = s, d = r) : e < 180 ? (d = r, u = s) : e < 240 ? (d = s, u = r) : e < 300 ? (i = s, u = r) : (i = r, u = s), { r: Math.round((i + c) * 255), g: Math.round((d + c) * 255), b: Math.round((u + c) * 255) };
1141
+ }
1142
+ function aa(e, t, o) {
1143
+ const a = e / 255, n = t / 255, r = o / 255, s = Math.max(a, n, r), c = Math.min(a, n, r), i = s - c, d = s, u = s === 0 ? 0 : i / s;
1144
+ let x = 0;
1145
+ return i !== 0 && (s === a ? x = ((n - r) / i + (n < r ? 6 : 0)) / 6 : s === n ? x = ((r - a) / i + 2) / 6 : x = ((a - n) / i + 4) / 6), { h: Math.round(x * 360), s: Math.round(u * 100), v: Math.round(d * 100) };
1146
+ }
1147
+ function na(e, t, o) {
1148
+ const a = e / 255, n = t / 255, r = o / 255, s = Math.max(a, n, r), c = Math.min(a, n, r), i = (s + c) / 2;
1149
+ if (s === c) return { h: 0, s: 0, l: Math.round(i * 100) };
1150
+ const d = s - c, u = i > 0.5 ? d / (2 - s - c) : d / (s + c);
1151
+ let x = 0;
1152
+ return s === a ? x = ((n - r) / d + (n < r ? 6 : 0)) / 6 : s === n ? x = ((r - a) / d + 2) / 6 : x = ((a - n) / d + 4) / 6, { h: Math.round(x * 360), s: Math.round(u * 100), l: Math.round(i * 100) };
1153
+ }
1154
+ function ge(e, t, o) {
1155
+ const a = t / 100, n = o / 100, r = (1 - Math.abs(2 * n - 1)) * a, s = r * (1 - Math.abs(e / 60 % 2 - 1)), c = n - r / 2;
1156
+ let i = 0, d = 0, u = 0;
1157
+ return e < 60 ? (i = r, d = s) : e < 120 ? (i = s, d = r) : e < 180 ? (d = r, u = s) : e < 240 ? (d = s, u = r) : e < 300 ? (i = s, u = r) : (i = r, u = s), { r: Math.round((i + c) * 255), g: Math.round((d + c) * 255), b: Math.round((u + c) * 255) };
1158
+ }
1159
+ function Fe(e) {
1160
1160
  const t = e.replace("#", "");
1161
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";
1162
1162
  }
1163
- function Qe(e) {
1164
- const t = Re(e);
1163
+ function tt(e) {
1164
+ const t = Fe(e);
1165
1165
  return {
1166
1166
  r: parseInt(t.slice(1, 3), 16),
1167
1167
  g: parseInt(t.slice(3, 5), 16),
@@ -1169,38 +1169,38 @@ function Qe(e) {
1169
1169
  a: t.length === 9 ? +(parseInt(t.slice(7, 9), 16) / 255).toFixed(2) : 1
1170
1170
  };
1171
1171
  }
1172
- function $e({ r: e, g: t, b: s, a }) {
1173
- const n = (o) => pe(Math.round(o), 0, 255).toString(16).padStart(2, "0"), r = `#${n(e)}${n(t)}${n(s)}`;
1172
+ function Le({ r: e, g: t, b: o, a }) {
1173
+ const n = (s) => be(Math.round(s), 0, 255).toString(16).padStart(2, "0"), r = `#${n(e)}${n(t)}${n(o)}`;
1174
1174
  return a < 1 ? `${r}${n(Math.round(a * 255))}` : r;
1175
1175
  }
1176
- function et({ h: e, s: t, v: s, a }) {
1177
- return { ...Qt(e, t, s), a };
1176
+ function at({ h: e, s: t, v: o, a }) {
1177
+ return { ...ta(e, t, o), a };
1178
1178
  }
1179
- function G({ r: e, g: t, b: s, a }) {
1180
- return { ...ea(e, t, s), a };
1179
+ function U({ r: e, g: t, b: o, a }) {
1180
+ return { ...aa(e, t, o), a };
1181
1181
  }
1182
- function oe(e) {
1183
- return $e(et(e));
1182
+ function ce(e) {
1183
+ return Le(at(e));
1184
1184
  }
1185
- function le(e) {
1185
+ function ie(e) {
1186
1186
  const t = e.trim();
1187
1187
  if (t.startsWith("#")) {
1188
- const n = Re(t);
1189
- return /^#[0-9a-f]{6}([0-9a-f]{2})?$/i.test(n) ? Qe(n) : null;
1188
+ const n = Fe(t);
1189
+ return /^#[0-9a-f]{6}([0-9a-f]{2})?$/i.test(n) ? tt(n) : null;
1190
1190
  }
1191
- const s = t.match(/^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})(?:\s*,\s*([\d.]+))?\s*\)$/);
1192
- if (s) {
1193
- const n = +(s[1] ?? "0"), r = +(s[2] ?? "0"), o = +(s[3] ?? "0"), c = s[4] !== void 0 ? +s[4] : 1;
1194
- return [n, r, o].every((u) => u <= 255) && c >= 0 && c <= 1 ? { r: n, g: r, b: o, a: c } : null;
1191
+ const o = t.match(/^rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})(?:\s*,\s*([\d.]+))?\s*\)$/);
1192
+ if (o) {
1193
+ const n = +(o[1] ?? "0"), r = +(o[2] ?? "0"), s = +(o[3] ?? "0"), c = o[4] !== void 0 ? +o[4] : 1;
1194
+ return [n, r, s].every((i) => i <= 255) && c >= 0 && c <= 1 ? { r: n, g: r, b: s, a: c } : null;
1195
1195
  }
1196
1196
  const a = t.match(/^hsl\(\s*(\d{1,3})\s*,\s*(\d{1,3})%?\s*,\s*(\d{1,3})%?\s*\)$/);
1197
1197
  if (a) {
1198
- const n = +(a[1] ?? "0"), r = +(a[2] ?? "0"), o = +(a[3] ?? "0");
1199
- return n <= 360 && r <= 100 && o <= 100 ? { ...fe(n, r, o), a: 1 } : null;
1198
+ const n = +(a[1] ?? "0"), r = +(a[2] ?? "0"), s = +(a[3] ?? "0");
1199
+ return n <= 360 && r <= 100 && s <= 100 ? { ...ge(n, r, s), a: 1 } : null;
1200
1200
  }
1201
1201
  return null;
1202
1202
  }
1203
- const aa = [
1203
+ const ra = [
1204
1204
  {
1205
1205
  label: "Presets",
1206
1206
  colors: [
@@ -1215,36 +1215,36 @@ const aa = [
1215
1215
  "#e11d48"
1216
1216
  ]
1217
1217
  }
1218
- ], na = [
1218
+ ], oa = [
1219
1219
  "linear-gradient(45deg, #c0c0c0 25%, transparent 25%)",
1220
1220
  "linear-gradient(-45deg, #c0c0c0 25%, transparent 25%)",
1221
1221
  "linear-gradient(45deg, transparent 75%, #c0c0c0 75%)",
1222
1222
  "linear-gradient(-45deg, transparent 75%, #c0c0c0 75%)"
1223
1223
  ].join(", ");
1224
- function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatTooltip: r }) {
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));
1228
- }, [t, s, a]), d = (e - t) / (s - t) * 100;
1224
+ function Ue({ value: e, min: t, max: o, onChange: a, trackStyle: n, formatTooltip: r }) {
1225
+ const s = j(null), [c, i] = F(!1), d = fe((x) => {
1226
+ const h = s.current.getBoundingClientRect(), b = be((x.clientX - h.left) / h.width, 0, 1);
1227
+ a(t + b * (o - t));
1228
+ }, [t, o, a]), u = (e - t) / (o - t) * 100;
1229
1229
  return /* @__PURE__ */ f(
1230
1230
  "div",
1231
1231
  {
1232
- ref: o,
1232
+ ref: s,
1233
1233
  style: { position: "relative", height: 12, borderRadius: 6, cursor: "crosshair", userSelect: "none", ...n },
1234
- onPointerDown: (g) => {
1235
- g.currentTarget.setPointerCapture(g.pointerId), u(!0), i(g);
1234
+ onPointerDown: (x) => {
1235
+ x.currentTarget.setPointerCapture(x.pointerId), i(!0), d(x);
1236
1236
  },
1237
- onPointerMove: (g) => {
1238
- g.buttons > 0 && i(g);
1237
+ onPointerMove: (x) => {
1238
+ x.buttons > 0 && d(x);
1239
1239
  },
1240
- onPointerUp: () => u(!1),
1241
- onPointerCancel: () => u(!1),
1240
+ onPointerUp: () => i(!1),
1241
+ onPointerCancel: () => i(!1),
1242
1242
  children: /* @__PURE__ */ f(
1243
1243
  "div",
1244
1244
  {
1245
1245
  style: {
1246
1246
  position: "absolute",
1247
- left: `${d}%`,
1247
+ left: `${u}%`,
1248
1248
  top: "50%",
1249
1249
  transform: "translate(-50%, -50%)",
1250
1250
  width: 14,
@@ -1277,85 +1277,85 @@ function Xe({ value: e, min: t, max: s, onChange: a, trackStyle: n, formatToolti
1277
1277
  }
1278
1278
  );
1279
1279
  }
1280
- function ra() {
1280
+ function sa() {
1281
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
1282
  /* @__PURE__ */ f("path", { d: "M2 22l1-1h3l9-9" }),
1283
1283
  /* @__PURE__ */ f("path", { d: "M3 21v-3l9-9" }),
1284
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" })
1285
1285
  ] });
1286
1286
  }
1287
- function sa({
1287
+ function la({
1288
1288
  value: e,
1289
1289
  onChange: t,
1290
- label: s,
1290
+ label: o,
1291
1291
  size: a = "md",
1292
1292
  inline: n = !1,
1293
1293
  disabled: r = !1,
1294
- presetGroups: o = aa,
1294
+ presetGroups: s = ra,
1295
1295
  portalContainer: c,
1296
- id: u,
1297
- style: i
1296
+ id: i,
1297
+ style: d
1298
1298
  }) {
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(() => {
1301
- const l = e ? le(e) ?? { r: 0, g: 0, b: 0, a: 1 } : { r: 0, g: 0, b: 0, a: 1 };
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 });
1304
- me(() => {
1305
- if (!p || !X.current) return;
1306
- const l = X.current.getBoundingClientRect();
1307
- let x = l.left;
1308
- const z = l.bottom + 8;
1299
+ var w, L;
1300
+ const u = a === "sm" ? 24 : 40, x = Ze(), h = i ?? x, [b, v] = F(!1), [B, I] = F("hex"), [k, p] = F(0), [m, S] = F(() => {
1301
+ const l = e ? ie(e) ?? { r: 0, g: 0, b: 0, a: 1 } : { r: 0, g: 0, b: 0, a: 1 };
1302
+ return U(l);
1303
+ }), [$, C] = F(() => ce(m).slice(1).toUpperCase()), O = j(null), N = j(null), D = j(null), [R, V] = F({ top: 0, left: 0 });
1304
+ ve(() => {
1305
+ if (!b || !O.current) return;
1306
+ const l = O.current.getBoundingClientRect();
1307
+ let g = l.left;
1308
+ const y = l.bottom + 8;
1309
1309
  if (D.current) {
1310
- const $ = D.current.offsetWidth;
1311
- x + $ > window.innerWidth && (x = l.right - $);
1310
+ const M = D.current.offsetWidth;
1311
+ g + M > window.innerWidth && (g = l.right - M);
1312
1312
  }
1313
- K({ top: z, left: x });
1314
- }, [p]), ne(() => {
1313
+ V({ top: y, left: g });
1314
+ }, [b]), re(() => {
1315
1315
  if (!e) return;
1316
- const l = le(e);
1317
- l && (w(G(l)), E($e(l).slice(1).toUpperCase()));
1318
- }, [e]), ne(() => {
1319
- if (!p) return;
1320
- const l = (x) => {
1321
- var $, O;
1322
- const z = x.target;
1323
- ($ = X.current) != null && $.contains(z) || (O = D.current) != null && O.contains(z) || y(!1);
1316
+ const l = ie(e);
1317
+ l && (S(U(l)), C(Le(l).slice(1).toUpperCase()));
1318
+ }, [e]), re(() => {
1319
+ if (!b) return;
1320
+ const l = (g) => {
1321
+ var M, A;
1322
+ const y = g.target;
1323
+ (M = O.current) != null && M.contains(y) || (A = D.current) != null && A.contains(y) || v(!1);
1324
1324
  };
1325
1325
  return document.addEventListener("mousedown", l), () => document.removeEventListener("mousedown", l);
1326
- }, [p]);
1327
- const B = ue((l) => {
1328
- w(l);
1329
- const x = oe(l);
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 () => {
1326
+ }, [b]);
1327
+ const P = fe((l) => {
1328
+ S(l);
1329
+ const g = ce(l);
1330
+ C(g.slice(1).toUpperCase()), t == null || t(g);
1331
+ }, [t]), E = fe((l) => {
1332
+ const g = N.current.getBoundingClientRect(), y = Math.round(be((l.clientX - g.left) / g.width, 0, 1) * 100), M = Math.round((1 - be((l.clientY - g.top) / g.height, 0, 1)) * 100);
1333
+ P({ ...m, s: y, v: M });
1334
+ }, [m, P]), q = fe(async () => {
1335
1335
  if ("EyeDropper" in window)
1336
1336
  try {
1337
- const l = await new window.EyeDropper().open(), x = le(l.sRGBHex);
1338
- x && B(G(x));
1337
+ const l = await new window.EyeDropper().open(), g = ie(l.sRGBHex);
1338
+ g && P(U(g));
1339
1339
  } catch {
1340
1340
  }
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 = [
1341
+ }, [P]), H = at(m), X = na(H.r, H.g, H.b), ae = ce(m), le = ce({ ...m, a: 1 }), K = Math.round(m.a * 100), ze = [
1342
1342
  { id: "hex", label: "Hex" },
1343
1343
  { id: "rgb", label: "RGB" },
1344
1344
  { id: "hsl", label: "HSL" },
1345
1345
  { id: "hsb", label: "HSB" }
1346
- ], F = typeof window < "u" && "EyeDropper" in window;
1346
+ ], ne = typeof window < "u" && "EyeDropper" in window;
1347
1347
  return /* @__PURE__ */ T(
1348
1348
  "div",
1349
1349
  {
1350
- ref: X,
1351
- style: { display: "inline-flex", flexDirection: n ? "row" : "column", alignItems: n ? "center" : void 0, gap: "var(--lucent-space-1)", position: "relative", ...i },
1350
+ ref: O,
1351
+ style: { display: "inline-flex", flexDirection: n ? "row" : "column", alignItems: n ? "center" : void 0, gap: "var(--lucent-space-1)", position: "relative", ...d },
1352
1352
  children: [
1353
1353
  /* @__PURE__ */ f("style", { children: `
1354
1354
  .lucent-cp-field::-webkit-outer-spin-button,
1355
1355
  .lucent-cp-field::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
1356
1356
  .lucent-cp-field { -moz-appearance: textfield; }
1357
1357
  ` }),
1358
- s && !n && /* @__PURE__ */ f(
1358
+ o && !n && /* @__PURE__ */ f(
1359
1359
  "label",
1360
1360
  {
1361
1361
  htmlFor: `${h}-swatch`,
@@ -1365,29 +1365,29 @@ function sa({
1365
1365
  color: r ? "var(--lucent-text-disabled)" : "var(--lucent-text-primary)",
1366
1366
  fontFamily: "var(--lucent-font-family-base)"
1367
1367
  },
1368
- children: s
1368
+ children: o
1369
1369
  }
1370
1370
  ),
1371
1371
  /* @__PURE__ */ f(
1372
- de,
1372
+ pe,
1373
1373
  {
1374
1374
  id: `${h}-swatch`,
1375
- color: `rgba(${N.r},${N.g},${N.b},${m.a})`,
1375
+ color: `rgba(${H.r},${H.g},${H.b},${m.a})`,
1376
1376
  shape: "square",
1377
1377
  showCheckerboard: !0,
1378
1378
  disabled: r,
1379
- onClick: () => y((l) => !l),
1380
- "aria-expanded": p,
1379
+ onClick: () => v((l) => !l),
1380
+ "aria-expanded": b,
1381
1381
  "aria-haspopup": "dialog",
1382
1382
  style: {
1383
- width: d,
1384
- height: d,
1383
+ width: u,
1384
+ height: u,
1385
1385
  borderRadius: a === "sm" ? "var(--lucent-radius-md)" : "var(--lucent-radius-lg)",
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)"
1386
+ boxShadow: b ? "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)"
1387
1387
  }
1388
1388
  }
1389
1389
  ),
1390
- s && n && /* @__PURE__ */ f(
1390
+ o && n && /* @__PURE__ */ f(
1391
1391
  "label",
1392
1392
  {
1393
1393
  htmlFor: `${h}-swatch`,
@@ -1398,10 +1398,10 @@ function sa({
1398
1398
  fontFamily: "var(--lucent-font-family-base)",
1399
1399
  cursor: "pointer"
1400
1400
  },
1401
- children: s
1401
+ children: o
1402
1402
  }
1403
1403
  ),
1404
- p && Dt(
1404
+ b && kt(
1405
1405
  /* @__PURE__ */ T(
1406
1406
  "div",
1407
1407
  {
@@ -1410,8 +1410,8 @@ function sa({
1410
1410
  "aria-label": "Color picker",
1411
1411
  style: {
1412
1412
  position: "fixed",
1413
- top: C.top,
1414
- left: C.left,
1413
+ top: R.top,
1414
+ left: R.left,
1415
1415
  zIndex: 999999,
1416
1416
  background: "color-mix(in srgb, var(--lucent-surface-overlay) 85%, transparent)",
1417
1417
  backdropFilter: "blur(6px)",
@@ -1428,7 +1428,7 @@ function sa({
1428
1428
  /* @__PURE__ */ T(
1429
1429
  "div",
1430
1430
  {
1431
- ref: A,
1431
+ ref: N,
1432
1432
  style: {
1433
1433
  position: "relative",
1434
1434
  height: 160,
@@ -1438,10 +1438,10 @@ function sa({
1438
1438
  flexShrink: 0
1439
1439
  },
1440
1440
  onPointerDown: (l) => {
1441
- l.currentTarget.setPointerCapture(l.pointerId), j(l);
1441
+ l.currentTarget.setPointerCapture(l.pointerId), E(l);
1442
1442
  },
1443
1443
  onPointerMove: (l) => {
1444
- l.buttons > 0 && j(l);
1444
+ l.buttons > 0 && E(l);
1445
1445
  },
1446
1446
  children: [
1447
1447
  /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: "linear-gradient(to right, #fff, transparent)" } }),
@@ -1464,9 +1464,9 @@ function sa({
1464
1464
  /* @__PURE__ */ T("div", { style: { padding: 12, display: "flex", flexDirection: "column", gap: 10 }, children: [
1465
1465
  /* @__PURE__ */ T("div", { style: { display: "flex", gap: 10, alignItems: "center" }, children: [
1466
1466
  /* @__PURE__ */ f(
1467
- de,
1467
+ pe,
1468
1468
  {
1469
- color: `rgba(${N.r},${N.g},${N.b},${m.a})`,
1469
+ color: `rgba(${H.r},${H.g},${H.b},${m.a})`,
1470
1470
  shape: "square",
1471
1471
  showCheckerboard: !0,
1472
1472
  style: { width: 44, height: 44, borderRadius: 8 }
@@ -1474,12 +1474,12 @@ function sa({
1474
1474
  ),
1475
1475
  /* @__PURE__ */ T("div", { style: { flex: 1, display: "flex", flexDirection: "column", gap: 8 }, children: [
1476
1476
  /* @__PURE__ */ f(
1477
- Xe,
1477
+ Ue,
1478
1478
  {
1479
1479
  value: m.h,
1480
1480
  min: 0,
1481
1481
  max: 360,
1482
- onChange: (l) => B({ ...m, h: Math.round(l) }),
1482
+ onChange: (l) => P({ ...m, h: Math.round(l) }),
1483
1483
  trackStyle: { background: "linear-gradient(to right, #f00 0%, #ff0 17%, #0f0 33%, #0ff 50%, #00f 67%, #f0f 83%, #f00 100%)" },
1484
1484
  formatTooltip: (l) => `${Math.round(l)}°`
1485
1485
  }
@@ -1488,19 +1488,19 @@ function sa({
1488
1488
  /* @__PURE__ */ f("div", { style: {
1489
1489
  position: "absolute",
1490
1490
  inset: 0,
1491
- backgroundImage: na,
1491
+ backgroundImage: oa,
1492
1492
  backgroundSize: "8px 8px",
1493
1493
  backgroundPosition: "0 0, 0 4px, 4px -4px, -4px 0",
1494
1494
  backgroundColor: "#fff"
1495
1495
  } }),
1496
- /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: `linear-gradient(to right, transparent, ${Se})` } }),
1496
+ /* @__PURE__ */ f("div", { style: { position: "absolute", inset: 0, background: `linear-gradient(to right, transparent, ${le})` } }),
1497
1497
  /* @__PURE__ */ f(
1498
- Xe,
1498
+ Ue,
1499
1499
  {
1500
1500
  value: m.a,
1501
1501
  min: 0,
1502
1502
  max: 1,
1503
- onChange: (l) => B({ ...m, a: Math.round(l * 100) / 100 }),
1503
+ onChange: (l) => P({ ...m, a: Math.round(l * 100) / 100 }),
1504
1504
  trackStyle: { background: "transparent", position: "relative", zIndex: 1 },
1505
1505
  formatTooltip: (l) => `${Math.round(l * 100)}%`
1506
1506
  }
@@ -1509,24 +1509,24 @@ function sa({
1509
1509
  ] })
1510
1510
  ] }),
1511
1511
  /* @__PURE__ */ f(
1512
- Je,
1512
+ et,
1513
1513
  {
1514
1514
  size: "sm",
1515
- value: I,
1516
- onChange: (l) => k(l),
1517
- options: v.map(({ id: l, label: x }) => ({ value: l, label: x }))
1515
+ value: B,
1516
+ onChange: (l) => I(l),
1517
+ options: ze.map(({ id: l, label: g }) => ({ value: l, label: g }))
1518
1518
  }
1519
1519
  ),
1520
- I === "hex" && /* @__PURE__ */ T("div", { style: { display: "flex", gap: 6, alignItems: "center" }, children: [
1520
+ B === "hex" && /* @__PURE__ */ T("div", { style: { display: "flex", gap: 6, alignItems: "center" }, children: [
1521
1521
  /* @__PURE__ */ f(
1522
- Ye,
1522
+ Je,
1523
1523
  {
1524
1524
  variant: "secondary",
1525
1525
  size: "sm",
1526
- onClick: _,
1527
- disabled: !F,
1528
- title: F ? "Pick color from screen" : "Not supported in this browser",
1529
- leftIcon: /* @__PURE__ */ f(ra, {}),
1526
+ onClick: q,
1527
+ disabled: !ne,
1528
+ title: ne ? "Pick color from screen" : "Not supported in this browser",
1529
+ leftIcon: /* @__PURE__ */ f(sa, {}),
1530
1530
  style: { flexShrink: 0, paddingLeft: 8, paddingRight: 8 }
1531
1531
  }
1532
1532
  ),
@@ -1535,14 +1535,14 @@ function sa({
1535
1535
  {
1536
1536
  size: "sm",
1537
1537
  prefix: "#",
1538
- value: R,
1538
+ value: $,
1539
1539
  onChange: (l) => {
1540
- const x = l.target.value.replace(/[^0-9a-fA-F]/g, "");
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));
1540
+ const g = l.target.value.replace(/[^0-9a-fA-F]/g, "");
1541
+ if (C(g.toUpperCase()), /^[0-9a-f]{6}$/i.test(g) || /^[0-9a-f]{8}$/i.test(g)) {
1542
+ const y = ie(`#${g}`);
1543
+ if (y) {
1544
+ const M = U(y);
1545
+ S(M), t == null || t(Le(y));
1546
1546
  }
1547
1547
  }
1548
1548
  },
@@ -1558,78 +1558,78 @@ function sa({
1558
1558
  size: "sm",
1559
1559
  type: "number",
1560
1560
  suffix: "%",
1561
- value: Z,
1561
+ value: K,
1562
1562
  min: 0,
1563
1563
  max: 100,
1564
1564
  onChange: (l) => {
1565
- const x = +l.target.value;
1566
- !isNaN(x) && x >= 0 && x <= 100 && B({ ...m, a: x / 100 });
1565
+ const g = +l.target.value;
1566
+ !isNaN(g) && g >= 0 && g <= 100 && P({ ...m, a: g / 100 });
1567
1567
  },
1568
1568
  className: "lucent-cp-field",
1569
1569
  style: { width: 68, flexShrink: 0 }
1570
1570
  }
1571
1571
  )
1572
1572
  ] }),
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);
1573
+ B === "rgb" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1574
+ { label: "R", val: H.r, max: 255, fn: (l) => P(U({ ...H, r: l })) },
1575
+ { label: "G", val: H.g, max: 255, fn: (l) => P(U({ ...H, g: l })) },
1576
+ { label: "B", val: H.b, max: 255, fn: (l) => P(U({ ...H, b: l })) },
1577
+ { label: "A", val: K, max: 100, fn: (l) => P({ ...m, a: l / 100 }) }
1578
+ ].map(({ label: l, val: g, max: y, fn: M }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: g, min: 0, max: y, onChange: (A) => {
1579
+ const W = +A.target.value;
1580
+ !isNaN(W) && W >= 0 && W <= y && M(W);
1581
1581
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
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 }));
1582
+ B === "hsl" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1583
+ { label: "H", val: X.h, max: 360, fn: (l) => {
1584
+ const { r: g, g: y, b: M } = ge(l, X.s, X.l);
1585
+ P(U({ r: g, g: y, b: M, a: m.a }));
1586
1586
  } },
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 }));
1587
+ { label: "S", val: X.s, max: 100, fn: (l) => {
1588
+ const { r: g, g: y, b: M } = ge(X.h, l, X.l);
1589
+ P(U({ r: g, g: y, b: M, a: m.a }));
1590
1590
  } },
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 }));
1591
+ { label: "L", val: X.l, max: 100, fn: (l) => {
1592
+ const { r: g, g: y, b: M } = ge(X.h, X.s, l);
1593
+ P(U({ r: g, g: y, b: M, a: m.a }));
1594
1594
  } },
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);
1595
+ { label: "A", val: K, max: 100, fn: (l) => P({ ...m, a: l / 100 }) }
1596
+ ].map(({ label: l, val: g, max: y, fn: M }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: g, min: 0, max: y, onChange: (A) => {
1597
+ const W = +A.target.value;
1598
+ !isNaN(W) && W >= 0 && W <= y && M(W);
1599
1599
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
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);
1600
+ B === "hsb" && /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6 }, children: [
1601
+ { label: "H", val: m.h, max: 360, fn: (l) => P({ ...m, h: l }) },
1602
+ { label: "S", val: m.s, max: 100, fn: (l) => P({ ...m, s: l }) },
1603
+ { label: "B", val: m.v, max: 100, fn: (l) => P({ ...m, v: l }) },
1604
+ { label: "A", val: K, max: 100, fn: (l) => P({ ...m, a: l / 100 }) }
1605
+ ].map(({ label: l, val: g, max: y, fn: M }) => /* @__PURE__ */ f(te, { size: "sm", type: "number", prefix: l, value: g, min: 0, max: y, onChange: (A) => {
1606
+ const W = +A.target.value;
1607
+ !isNaN(W) && W >= 0 && W <= y && M(W);
1608
1608
  }, className: "lucent-cp-field", style: { flex: 1 } }, l)) }),
1609
- o.length > 0 && /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
1610
- o.length > 1 && /* @__PURE__ */ f(
1611
- Ze,
1609
+ s.length > 0 && /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", gap: 8 }, children: [
1610
+ s.length > 1 && /* @__PURE__ */ f(
1611
+ Qe,
1612
1612
  {
1613
1613
  size: "sm",
1614
- value: String(L),
1615
- onChange: (l) => b(Number(l.target.value)),
1616
- options: o.map((l, x) => ({ value: String(x), label: l.label }))
1614
+ value: String(k),
1615
+ onChange: (l) => p(Number(l.target.value)),
1616
+ options: s.map((l, g) => ({ value: String(g), label: l.label }))
1617
1617
  }
1618
1618
  ),
1619
- o.length === 1 && /* @__PURE__ */ f("span", { style: {
1619
+ s.length === 1 && /* @__PURE__ */ f("span", { style: {
1620
1620
  fontSize: "var(--lucent-font-size-xs)",
1621
1621
  fontWeight: "var(--lucent-font-weight-medium)",
1622
1622
  color: "var(--lucent-text-secondary)",
1623
1623
  fontFamily: "var(--lucent-font-family-base)"
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();
1624
+ }, children: (w = s[0]) == null ? void 0 : w.label }),
1625
+ /* @__PURE__ */ f("div", { style: { display: "flex", gap: 6, flexWrap: "wrap" }, children: (((L = s[k]) == null ? void 0 : L.colors) ?? []).map((l) => {
1626
+ const g = Fe(l).toLowerCase() === ae.slice(0, 7).toLowerCase();
1627
1627
  return /* @__PURE__ */ f(
1628
- de,
1628
+ pe,
1629
1629
  {
1630
1630
  color: l,
1631
- selected: x,
1632
- onClick: () => B(G(Qe(l)))
1631
+ selected: g,
1632
+ onClick: () => P(U(tt(l)))
1633
1633
  },
1634
1634
  l
1635
1635
  );
@@ -1645,85 +1645,103 @@ function sa({
1645
1645
  }
1646
1646
  );
1647
1647
  }
1648
- sa.displayName = "ColorPicker";
1649
- function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "underline", style: r }) {
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);
1648
+ la.displayName = "ColorPicker";
1649
+ const ca = {
1650
+ sm: {
1651
+ fontSize: "var(--lucent-font-size-sm)",
1652
+ buttonPadding: "var(--lucent-space-1) var(--lucent-space-1)",
1653
+ buttonPaddingUnderline: "0 var(--lucent-space-1) var(--lucent-space-2)",
1654
+ innerPadding: "var(--lucent-space-1) var(--lucent-space-2)",
1655
+ panelPadding: "var(--lucent-space-3) 0",
1656
+ dropdownPadding: "var(--lucent-space-1) var(--lucent-space-3)"
1657
+ },
1658
+ md: {
1659
+ fontSize: "var(--lucent-font-size-md)",
1660
+ buttonPadding: "var(--lucent-space-1) var(--lucent-space-2)",
1661
+ buttonPaddingUnderline: "var(--lucent-space-1) var(--lucent-space-2) var(--lucent-space-3)",
1662
+ innerPadding: "var(--lucent-space-1) var(--lucent-space-3)",
1663
+ panelPadding: "var(--lucent-space-4) 0",
1664
+ dropdownPadding: "var(--lucent-space-2) var(--lucent-space-4)"
1665
+ }
1666
+ };
1667
+ function gn({ tabs: e, defaultValue: t, value: o, onChange: a, variant: n = "underline", size: r = "md", style: s }) {
1668
+ var ne;
1669
+ const c = o !== void 0, [i, d] = F(t ?? ((ne = e[0]) == null ? void 0 : ne.value) ?? ""), u = c ? o : i, [x, h] = F(null), b = j([]), [v, B] = F(null), I = j(!1), k = n === "pills", p = ca[r], m = j(null), S = j(null), $ = j(null), [C, O] = F(e.length), [N, D] = F(!1), [R, V] = F(!1), [P, E] = F(null), q = e.slice(0, C), H = e.slice(C), X = H.length > 0, ae = H.some((w) => w.value === u), le = () => {
1670
+ if (ae) {
1671
+ B(null);
1654
1672
  return;
1655
1673
  }
1656
- const v = e.findIndex((S, W) => W < w && S.value === i), F = h.current[v];
1657
- if (F) {
1674
+ const w = e.findIndex((l, g) => g < C && l.value === u), L = b.current[w];
1675
+ if (L) {
1658
1676
  if (k) {
1659
- const S = F.querySelector("span");
1660
- if (!S) return;
1661
- y({ left: S.offsetLeft + F.offsetLeft, width: S.offsetWidth, animate: I.current });
1677
+ const l = L.querySelector("span");
1678
+ if (!l) return;
1679
+ B({ left: l.offsetLeft + L.offsetLeft, width: l.offsetWidth, animate: I.current });
1662
1680
  } else
1663
- y({ left: F.offsetLeft, width: F.offsetWidth, animate: I.current });
1681
+ B({ left: L.offsetLeft, width: L.offsetWidth, animate: I.current });
1664
1682
  I.current = !0;
1665
1683
  }
1666
1684
  };
1667
- me(() => {
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];
1685
+ ve(() => {
1686
+ le(), document.fonts.ready.then(le);
1687
+ }, [u, C, k]), re(() => {
1688
+ const w = m.current;
1689
+ if (!w) return;
1690
+ const L = () => {
1691
+ const M = w.clientWidth, A = 70;
1692
+ let W = 0, Y = 0;
1693
+ for (let Z = 0; Z < e.length; Z++) {
1694
+ const J = b.current[Z];
1677
1695
  if (!J) {
1678
- O++;
1696
+ Y++;
1679
1697
  continue;
1680
1698
  }
1681
1699
  const Q = J.offsetWidth;
1682
- if (H < e.length - 1) {
1683
- if ($ + Q + z > x) break;
1684
- } else if ($ + Q > x) break;
1685
- $ += Q, O++;
1700
+ if (Z < e.length - 1) {
1701
+ if (W + Q + A > M) break;
1702
+ } else if (W + Q > M) break;
1703
+ W += Q, Y++;
1686
1704
  }
1687
- if (O >= e.length - 1 && O < e.length) {
1688
- let H = 0;
1705
+ if (Y >= e.length - 1 && Y < e.length) {
1706
+ let Z = 0;
1689
1707
  for (let J = 0; J < e.length; J++) {
1690
- const Q = h.current[J];
1691
- Q && (H += Q.offsetWidth);
1708
+ const Q = b.current[J];
1709
+ Q && (Z += Q.offsetWidth);
1692
1710
  }
1693
- H <= x && (O = e.length);
1711
+ Z <= M && (Y = e.length);
1694
1712
  }
1695
- R(O < 1 ? 1 : O);
1713
+ O(Y < 1 ? 1 : Y);
1696
1714
  };
1697
- let S;
1715
+ let l;
1698
1716
  (() => {
1699
- S = requestAnimationFrame(() => {
1700
- S = requestAnimationFrame(F);
1717
+ l = requestAnimationFrame(() => {
1718
+ l = requestAnimationFrame(L);
1701
1719
  });
1702
1720
  })();
1703
- const l = new ResizeObserver(F);
1704
- return l.observe(v), () => {
1705
- l.disconnect(), cancelAnimationFrame(S);
1721
+ const y = new ResizeObserver(L);
1722
+ return y.observe(w), () => {
1723
+ y.disconnect(), cancelAnimationFrame(l);
1706
1724
  };
1707
- }, [e]), ne(() => {
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));
1725
+ }, [e]), re(() => {
1726
+ if (!N) return;
1727
+ const w = (L) => {
1728
+ $.current && !$.current.contains(L.target) && S.current && !S.current.contains(L.target) && (D(!1), E(null));
1711
1729
  };
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) => {
1717
- var x;
1718
- const S = B.map((z, $) => z.disabled ? -1 : $).filter((z) => z !== -1), W = S.indexOf(F);
1719
- let l = -1;
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));
1730
+ return document.addEventListener("mousedown", w), () => document.removeEventListener("mousedown", w);
1731
+ }, [N]);
1732
+ const K = (w) => {
1733
+ c || d(w), a == null || a(w);
1734
+ }, ze = (w, L) => {
1735
+ var M;
1736
+ const l = q.map((A, W) => A.disabled ? -1 : W).filter((A) => A !== -1), g = l.indexOf(L);
1737
+ let y = -1;
1738
+ w.key === "ArrowRight" && (y = l[(g + 1) % l.length] ?? -1), w.key === "ArrowLeft" && (y = l[(g - 1 + l.length) % l.length] ?? -1), w.key === "Home" && (y = l[0] ?? -1), w.key === "End" && (y = l[l.length - 1] ?? -1), y !== -1 && (w.preventDefault(), (M = b.current[y]) == null || M.focus(), K(q[y].value));
1721
1739
  };
1722
- return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", position: "relative", ...r }, children: [
1740
+ return /* @__PURE__ */ T("div", { style: { display: "flex", flexDirection: "column", position: "relative", ...s }, children: [
1723
1741
  /* @__PURE__ */ T(
1724
1742
  "div",
1725
1743
  {
1726
- ref: L,
1744
+ ref: m,
1727
1745
  role: "tablist",
1728
1746
  style: {
1729
1747
  position: "relative",
@@ -1736,54 +1754,54 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1736
1754
  }
1737
1755
  },
1738
1756
  children: [
1739
- e.map((v, F) => {
1740
- const S = F < w, W = v.value === i, l = v.disabled ?? !1;
1757
+ e.map((w, L) => {
1758
+ const l = L < C, g = w.value === u, y = w.disabled ?? !1;
1741
1759
  return /* @__PURE__ */ T(
1742
1760
  "button",
1743
1761
  {
1744
- ref: (x) => {
1745
- h.current[F] = x;
1762
+ ref: (M) => {
1763
+ b.current[L] = M;
1746
1764
  },
1747
1765
  role: "tab",
1748
- "aria-selected": W,
1749
- "aria-controls": `lucent-tabpanel-${v.value}`,
1750
- id: `lucent-tab-${v.value}`,
1751
- disabled: l,
1752
- tabIndex: W && S ? 0 : -1,
1766
+ "aria-selected": g,
1767
+ "aria-controls": `lucent-tabpanel-${w.value}`,
1768
+ id: `lucent-tab-${w.value}`,
1769
+ disabled: y,
1770
+ tabIndex: g && l ? 0 : -1,
1753
1771
  onClick: () => {
1754
- l || ae(v.value);
1772
+ y || K(w.value);
1755
1773
  },
1756
- onKeyDown: (x) => Se(x, F),
1774
+ onKeyDown: (M) => ze(M, L),
1757
1775
  onMouseEnter: () => {
1758
- !l && S && g(F);
1776
+ !y && l && h(L);
1759
1777
  },
1760
- onMouseLeave: () => g(null),
1778
+ onMouseLeave: () => h(null),
1761
1779
  style: {
1762
- padding: k ? "var(--lucent-space-1) var(--lucent-space-2)" : "var(--lucent-space-1) var(--lucent-space-2) var(--lucent-space-3)",
1780
+ padding: k ? p.buttonPadding : p.buttonPaddingUnderline,
1763
1781
  background: "none",
1764
1782
  border: "none",
1765
- cursor: l ? "not-allowed" : "pointer",
1783
+ cursor: y ? "not-allowed" : "pointer",
1766
1784
  fontFamily: "var(--lucent-font-family-base)",
1767
- fontSize: "var(--lucent-font-size-md)",
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)",
1785
+ fontSize: p.fontSize,
1786
+ fontWeight: g ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1787
+ color: y ? "var(--lucent-text-disabled)" : k && g ? "var(--lucent-accent-fg)" : g ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1770
1788
  transition: "color var(--lucent-duration-fast) var(--lucent-easing-default)",
1771
1789
  whiteSpace: "nowrap",
1772
1790
  outline: "none",
1773
- position: S ? "relative" : "absolute",
1774
- zIndex: W ? 1 : 0,
1791
+ position: l ? "relative" : "absolute",
1792
+ zIndex: g ? 1 : 0,
1775
1793
  // Hidden overflow tabs are positioned off-screen for measurement
1776
- ...S ? {} : { visibility: "hidden", pointerEvents: "none", left: -9999 }
1794
+ ...l ? {} : { visibility: "hidden", pointerEvents: "none", left: -9999 }
1777
1795
  },
1778
1796
  children: [
1779
1797
  /* @__PURE__ */ f("span", { style: {
1780
1798
  display: "block",
1781
- padding: "var(--lucent-space-1) var(--lucent-space-3)",
1799
+ padding: p.innerPadding,
1782
1800
  borderRadius: "var(--lucent-radius-md)",
1783
- background: !k && d === F && !W && !l ? "var(--lucent-surface-secondary)" : "transparent",
1801
+ background: !k && x === L && !g && !y ? "var(--lucent-surface-secondary)" : "transparent",
1784
1802
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
1785
- }, children: v.label }),
1786
- k && d === F && !W && !l && S && /* @__PURE__ */ f(
1803
+ }, children: w.label }),
1804
+ k && x === L && !g && !y && l && /* @__PURE__ */ f(
1787
1805
  "span",
1788
1806
  {
1789
1807
  "aria-hidden": !0,
@@ -1802,25 +1820,25 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1802
1820
  )
1803
1821
  ]
1804
1822
  },
1805
- v.value
1823
+ w.value
1806
1824
  );
1807
1825
  }),
1808
- _ && /* @__PURE__ */ f(
1826
+ X && /* @__PURE__ */ f(
1809
1827
  "button",
1810
1828
  {
1811
- ref: b,
1812
- onClick: () => X((v) => !v),
1813
- onMouseEnter: () => D(!0),
1814
- onMouseLeave: () => D(!1),
1829
+ ref: S,
1830
+ onClick: () => D((w) => !w),
1831
+ onMouseEnter: () => V(!0),
1832
+ onMouseLeave: () => V(!1),
1815
1833
  style: {
1816
- padding: k ? "var(--lucent-space-1) var(--lucent-space-2)" : "var(--lucent-space-1) var(--lucent-space-2) var(--lucent-space-3)",
1834
+ padding: k ? p.buttonPadding : p.buttonPaddingUnderline,
1817
1835
  background: "none",
1818
1836
  border: "none",
1819
1837
  cursor: "pointer",
1820
1838
  fontFamily: "var(--lucent-font-family-base)",
1821
- fontSize: "var(--lucent-font-size-md)",
1822
- fontWeight: N ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1823
- color: N ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1839
+ fontSize: p.fontSize,
1840
+ fontWeight: ae ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1841
+ color: ae ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1824
1842
  whiteSpace: "nowrap",
1825
1843
  outline: "none",
1826
1844
  position: "relative",
@@ -1828,14 +1846,14 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1828
1846
  },
1829
1847
  children: /* @__PURE__ */ f("span", { style: {
1830
1848
  display: "block",
1831
- padding: "var(--lucent-space-1) var(--lucent-space-3)",
1849
+ padding: p.innerPadding,
1832
1850
  borderRadius: "var(--lucent-radius-md)",
1833
- background: A ? "var(--lucent-surface-secondary)" : "transparent",
1851
+ background: R ? "var(--lucent-surface-secondary)" : "transparent",
1834
1852
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default)"
1835
1853
  }, children: "More…" })
1836
1854
  }
1837
1855
  ),
1838
- p != null && /* @__PURE__ */ f(
1856
+ v != null && /* @__PURE__ */ f(
1839
1857
  "span",
1840
1858
  {
1841
1859
  "aria-hidden": !0,
@@ -1843,30 +1861,30 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1843
1861
  position: "absolute",
1844
1862
  top: "var(--lucent-space-1)",
1845
1863
  bottom: "var(--lucent-space-1)",
1846
- left: p.left,
1847
- width: p.width,
1864
+ left: v.left,
1865
+ width: v.width,
1848
1866
  background: "var(--lucent-accent-default)",
1849
1867
  borderRadius: "var(--lucent-radius-md)",
1850
- transition: p.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1868
+ transition: v.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1851
1869
  } : {
1852
1870
  position: "absolute",
1853
1871
  bottom: 0,
1854
- left: p.left,
1855
- width: p.width,
1872
+ left: v.left,
1873
+ width: v.width,
1856
1874
  height: 2,
1857
1875
  background: "var(--lucent-accent-default)",
1858
1876
  borderRadius: "var(--lucent-radius-sm)",
1859
- transition: p.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1877
+ transition: v.animate ? "left 220ms var(--lucent-easing-default), width 220ms var(--lucent-easing-default)" : "none"
1860
1878
  }
1861
1879
  }
1862
1880
  )
1863
1881
  ]
1864
1882
  }
1865
1883
  ),
1866
- _ && E && /* @__PURE__ */ f(
1884
+ X && N && /* @__PURE__ */ f(
1867
1885
  "div",
1868
1886
  {
1869
- ref: m,
1887
+ ref: $,
1870
1888
  style: {
1871
1889
  position: "absolute",
1872
1890
  top: "100%",
@@ -1880,57 +1898,57 @@ function dn({ tabs: e, defaultValue: t, value: s, onChange: a, variant: n = "und
1880
1898
  padding: "var(--lucent-space-1) 0",
1881
1899
  minWidth: 140
1882
1900
  },
1883
- children: j.map((v, F) => {
1884
- const S = v.value === i, W = v.disabled ?? !1, l = C === F;
1901
+ children: H.map((w, L) => {
1902
+ const l = w.value === u, g = w.disabled ?? !1, y = P === L;
1885
1903
  return /* @__PURE__ */ f(
1886
1904
  "button",
1887
1905
  {
1888
- disabled: W,
1906
+ disabled: g,
1889
1907
  onClick: () => {
1890
- W || (ae(v.value), X(!1));
1908
+ g || (K(w.value), D(!1));
1891
1909
  },
1892
1910
  onMouseEnter: () => {
1893
- W || K(F);
1911
+ g || E(L);
1894
1912
  },
1895
- onMouseLeave: () => K(null),
1913
+ onMouseLeave: () => E(null),
1896
1914
  style: {
1897
1915
  display: "block",
1898
1916
  width: "100%",
1899
- padding: "var(--lucent-space-2) var(--lucent-space-4)",
1900
- background: S || l ? "var(--lucent-surface-secondary)" : "none",
1917
+ padding: p.dropdownPadding,
1918
+ background: l || y ? "var(--lucent-surface-secondary)" : "none",
1901
1919
  border: "none",
1902
- cursor: W ? "not-allowed" : "pointer",
1920
+ cursor: g ? "not-allowed" : "pointer",
1903
1921
  fontFamily: "var(--lucent-font-family-base)",
1904
- fontSize: "var(--lucent-font-size-md)",
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)",
1922
+ fontSize: p.fontSize,
1923
+ fontWeight: l ? "var(--lucent-font-weight-medium)" : "var(--lucent-font-weight-regular)",
1924
+ color: g ? "var(--lucent-text-disabled)" : l || y ? "var(--lucent-text-primary)" : "var(--lucent-text-secondary)",
1907
1925
  textAlign: "left",
1908
1926
  outline: "none",
1909
1927
  transition: "background var(--lucent-duration-fast) var(--lucent-easing-default), color var(--lucent-duration-fast) var(--lucent-easing-default)"
1910
1928
  },
1911
- children: v.label
1929
+ children: w.label
1912
1930
  },
1913
- v.value
1931
+ w.value
1914
1932
  );
1915
1933
  })
1916
1934
  }
1917
1935
  ),
1918
- e.some((v) => v.content != null) && e.map((v) => /* @__PURE__ */ f(
1936
+ e.some((w) => w.content != null) && e.map((w) => /* @__PURE__ */ f(
1919
1937
  "div",
1920
1938
  {
1921
1939
  role: "tabpanel",
1922
- id: `lucent-tabpanel-${v.value}`,
1923
- "aria-labelledby": `lucent-tab-${v.value}`,
1924
- hidden: v.value !== i,
1925
- style: { padding: "var(--lucent-space-4) 0", outline: "none" },
1940
+ id: `lucent-tabpanel-${w.value}`,
1941
+ "aria-labelledby": `lucent-tab-${w.value}`,
1942
+ hidden: w.value !== u,
1943
+ style: { padding: p.panelPadding, outline: "none" },
1926
1944
  tabIndex: 0,
1927
- children: v.content
1945
+ children: w.content
1928
1946
  },
1929
- v.value
1947
+ w.value
1930
1948
  ))
1931
1949
  ] });
1932
1950
  }
1933
- const oa = {
1951
+ const ia = {
1934
1952
  fontFamilyBase: '"DM Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
1935
1953
  fontFamilyMono: '"DM Mono", "Fira Code", "Cascadia Code", monospace',
1936
1954
  fontFamilyDisplay: '"Georama", "DM Sans", sans-serif',
@@ -1951,7 +1969,7 @@ const oa = {
1951
1969
  letterSpacingTight: "-0.02em",
1952
1970
  letterSpacingBase: "0em",
1953
1971
  letterSpacingWide: "0.04em"
1954
- }, la = {
1972
+ }, ua = {
1955
1973
  space0: "0px",
1956
1974
  space1: "0.25rem",
1957
1975
  space2: "0.5rem",
@@ -1965,38 +1983,38 @@ const oa = {
1965
1983
  space16: "4rem",
1966
1984
  space20: "5rem",
1967
1985
  space24: "6rem"
1968
- }, ca = {
1986
+ }, da = {
1969
1987
  radiusNone: "0px",
1970
1988
  radiusSm: "0.25rem",
1971
1989
  radiusMd: "0.375rem",
1972
1990
  radiusLg: "0.5rem",
1973
1991
  radiusXl: "0.75rem",
1974
1992
  radiusFull: "9999px"
1975
- }, ia = {
1993
+ }, fa = {
1976
1994
  durationFast: "100ms",
1977
1995
  durationBase: "200ms",
1978
1996
  durationSlow: "350ms",
1979
1997
  easingDefault: "cubic-bezier(0.4, 0, 0.2, 1)",
1980
1998
  easingEmphasized: "cubic-bezier(0.2, 0, 0, 1)",
1981
1999
  easingDecelerate: "cubic-bezier(0, 0, 0.2, 1)"
1982
- }, ua = {
2000
+ }, pa = {
1983
2001
  shadowNone: "none",
1984
2002
  shadowSm: "0 1px 2px rgb(0 0 0 / 0.12)",
1985
2003
  shadowMd: "0 2px 4px rgb(0 0 0 / 0.18)",
1986
2004
  shadowLg: "0 3px 8px rgb(0 0 0 / 0.18)",
1987
2005
  shadowXl: "0 5px 14px rgb(0 0 0 / 0.2)"
1988
- }, da = {
2006
+ }, ga = {
1989
2007
  shadowNone: "none",
1990
2008
  shadowSm: "inset 0 1px 0 0 rgba(255, 255, 255, 0.04), 0 1px 2px rgba(0, 0, 0, 0.4)",
1991
2009
  shadowMd: "inset 0 1px 0 0 rgba(255, 255, 255, 0.06), 0 1px 4px rgba(0, 0, 0, 0.45)",
1992
2010
  shadowLg: "inset 0 1px 0 0 rgba(255, 255, 255, 0.08), 0 2px 8px rgba(0, 0, 0, 0.45)",
1993
2011
  shadowXl: "inset 0 1px 0 0 rgba(255, 255, 255, 0.1), 0 4px 14px rgba(0, 0, 0, 0.5)"
1994
- }, he = {
1995
- ...oa,
1996
- ...la,
1997
- ...ca,
2012
+ }, ye = {
1998
2013
  ...ia,
1999
2014
  ...ua,
2015
+ ...da,
2016
+ ...fa,
2017
+ ...pa,
2000
2018
  // Navigation — chrome/shell (sidebar, header, footer)
2001
2019
  navigation: "#f4f6f8",
2002
2020
  // Backgrounds — main content area
@@ -2040,227 +2058,227 @@ const oa = {
2040
2058
  infoSubtle: "#eff6ff",
2041
2059
  infoText: "#1d4ed8"
2042
2060
  };
2043
- function fa(e) {
2044
- const t = parseInt(e.slice(1, 3), 16), s = parseInt(e.slice(3, 5), 16), a = parseInt(e.slice(5, 7), 16);
2045
- return { r: t, g: s, b: a };
2061
+ function ba(e) {
2062
+ const t = parseInt(e.slice(1, 3), 16), o = parseInt(e.slice(3, 5), 16), a = parseInt(e.slice(5, 7), 16);
2063
+ return { r: t, g: o, b: a };
2046
2064
  }
2047
- function pa({ r: e, g: t, b: s }) {
2065
+ function xa({ r: e, g: t, b: o }) {
2048
2066
  const a = (n) => n.toString(16).padStart(2, "0");
2049
- return `#${a(e)}${a(t)}${a(s)}`;
2050
- }
2051
- function Y(e) {
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);
2053
- let i = 0, d = 0;
2054
- const g = (c + u) / 2;
2055
- if (c !== u) {
2056
- const h = c - u;
2057
- switch (d = g > 0.5 ? h / (2 - c - u) : h / (c + u), c) {
2067
+ return `#${a(e)}${a(t)}${a(o)}`;
2068
+ }
2069
+ function _(e) {
2070
+ const { r: t, g: o, b: a } = ba(e), n = t / 255, r = o / 255, s = a / 255, c = Math.max(n, r, s), i = Math.min(n, r, s);
2071
+ let d = 0, u = 0;
2072
+ const x = (c + i) / 2;
2073
+ if (c !== i) {
2074
+ const h = c - i;
2075
+ switch (u = x > 0.5 ? h / (2 - c - i) : h / (c + i), c) {
2058
2076
  case n:
2059
- i = (r - o) / h + (r < o ? 6 : 0);
2077
+ d = (r - s) / h + (r < s ? 6 : 0);
2060
2078
  break;
2061
2079
  case r:
2062
- i = (o - n) / h + 2;
2080
+ d = (s - n) / h + 2;
2063
2081
  break;
2064
- case o:
2065
- i = (n - r) / h + 4;
2082
+ case s:
2083
+ d = (n - r) / h + 4;
2066
2084
  break;
2067
2085
  }
2068
- i /= 6;
2086
+ d /= 6;
2069
2087
  }
2070
- return [i * 360, d, g];
2088
+ return [d * 360, u, x];
2071
2089
  }
2072
- function V(e, t, s) {
2073
- e = (e % 360 + 360) % 360, t = Math.min(1, Math.max(0, t)), s = Math.min(1, Math.max(0, s));
2074
- const a = (1 - Math.abs(2 * s - 1)) * t, n = a * (1 - Math.abs(e / 60 % 2 - 1)), r = s - a / 2;
2075
- let o = 0, c = 0, u = 0;
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) });
2090
+ function G(e, t, o) {
2091
+ e = (e % 360 + 360) % 360, t = Math.min(1, Math.max(0, t)), o = Math.min(1, Math.max(0, o));
2092
+ const a = (1 - Math.abs(2 * o - 1)) * t, n = a * (1 - Math.abs(e / 60 % 2 - 1)), r = o - a / 2;
2093
+ let s = 0, c = 0, i = 0;
2094
+ return e < 60 ? (s = a, c = n) : e < 120 ? (s = n, c = a) : e < 180 ? (c = a, i = n) : e < 240 ? (c = n, i = a) : e < 300 ? (s = n, i = a) : (s = a, i = n), xa({ r: Math.round((s + r) * 255), g: Math.round((c + r) * 255), b: Math.round((i + r) * 255) });
2077
2095
  }
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)));
2096
+ function z(e, t) {
2097
+ const [o, a, n] = _(e);
2098
+ return G(o, a, Math.min(1, Math.max(0, n + t)));
2081
2099
  }
2082
- const ga = 222, ba = 0.12;
2083
- function tt(e, t) {
2084
- return t < 0.04 ? [ga, ba] : [e, t];
2100
+ const ma = 222, ha = 0.12;
2101
+ function nt(e, t) {
2102
+ return t < 0.04 ? [ma, ha] : [e, t];
2085
2103
  }
2086
- function je(e) {
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))));
2104
+ function qe(e) {
2105
+ const [t, o, a] = _(e), [n, r] = nt(t, o);
2106
+ return G(n, r, Math.max(0.04, Math.min(0.2, 0.07 + (1 - a))));
2089
2107
  }
2090
- function Te(e) {
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)));
2108
+ function Be(e) {
2109
+ const [t, o, a] = _(e), [n, r] = nt(t, o);
2110
+ return G(n, r, Math.max(0.06, Math.min(0.5, (1 - a) * 0.6 + 0.06)));
2093
2111
  }
2094
- function Ie(e) {
2095
- const [t, s, a] = Y(e);
2096
- return V(t, s, Math.max(0.04, Math.min(0.97, 1 - a + 0.04)));
2112
+ function $e(e) {
2113
+ const [t, o, a] = _(e);
2114
+ return G(t, o, Math.max(0.04, Math.min(0.97, 1 - a + 0.04)));
2097
2115
  }
2098
- function Be(e) {
2099
- const [t, s, a] = Y(e);
2100
- return V(t, s, Math.max(0.02, Math.min(0.98, 1 - a)));
2116
+ function Pe(e) {
2117
+ const [t, o, a] = _(e);
2118
+ return G(t, o, Math.max(0.02, Math.min(0.98, 1 - a)));
2101
2119
  }
2102
- function xa(e) {
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));
2120
+ function va(e) {
2121
+ const t = qe(e.navigation), o = qe(e.bgBase), [a, n, r] = _(o), s = (c) => G(a, n, Math.min(0.25, r + c));
2104
2122
  return {
2105
2123
  // ── Non-color tokens: carry over from light unchanged ──────────────────
2106
2124
  ...e,
2107
2125
  // ── Shadows: dark variants have higher opacity for visibility ───────────
2108
- ...da,
2126
+ ...ga,
2109
2127
  // ── Navigation ──────────────────────────────────────────────────────────
2110
2128
  navigation: t,
2111
2129
  // ── Backgrounds ─────────────────────────────────────────────────────────
2112
- bgBase: s,
2113
- bgSubtle: o(0.02),
2130
+ bgBase: o,
2131
+ bgSubtle: s(0.02),
2114
2132
  bgOverlay: "rgb(0 0 0 / 0.6)",
2115
2133
  // ── Surfaces: slight elevation steps above bgBase ────────────────────────
2116
- surface: o(0.02),
2117
- surfaceSecondary: o(0.05),
2118
- surfaceRaised: o(0.08),
2119
- surfaceOverlay: o(0.08),
2120
- surfaceTint: o(0.03),
2134
+ surface: s(0.02),
2135
+ surfaceSecondary: s(0.05),
2136
+ surfaceRaised: s(0.08),
2137
+ surfaceOverlay: s(0.08),
2138
+ surfaceTint: s(0.03),
2121
2139
  // ── Borders ──────────────────────────────────────────────────────────────
2122
- borderDefault: Te(e.borderDefault),
2123
- borderSubtle: Te(e.borderSubtle),
2124
- borderStrong: Te(e.borderStrong),
2125
- controlTrack: o(0.1),
2140
+ borderDefault: Be(e.borderDefault),
2141
+ borderSubtle: Be(e.borderSubtle),
2142
+ borderStrong: Be(e.borderStrong),
2143
+ controlTrack: s(0.1),
2126
2144
  // ── Text ─────────────────────────────────────────────────────────────────
2127
- textPrimary: Ie(e.textPrimary),
2128
- textSecondary: Ie(e.textSecondary),
2129
- textDisabled: Ie(e.textDisabled),
2145
+ textPrimary: $e(e.textPrimary),
2146
+ textSecondary: $e(e.textSecondary),
2147
+ textDisabled: $e(e.textDisabled),
2130
2148
  // textInverse flips to dark bg so it reads on light accent surfaces
2131
- textInverse: s,
2149
+ textInverse: o,
2132
2150
  // ── Accent ───────────────────────────────────────────────────────────────
2133
- accentDefault: Be(e.accentDefault),
2134
- accentHover: Be(e.accentHover),
2135
- accentSubtle: Be(e.accentSubtle),
2151
+ accentDefault: Pe(e.accentDefault),
2152
+ accentHover: Pe(e.accentHover),
2153
+ accentSubtle: Pe(e.accentSubtle),
2136
2154
  accentBorder: e.accentBorder,
2137
2155
  // auto-recomputed by LucentProvider
2138
2156
  accentFg: e.accentFg,
2139
2157
  // auto-recomputed by LucentProvider
2140
2158
  // ── Status: lighten defaults for visibility; darken for subtle bg ─────────
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)
2159
+ successDefault: z(e.successDefault, 0.1),
2160
+ successSubtle: z(e.successDefault, -0.25),
2161
+ successText: z(e.successText, 0.15),
2162
+ warningDefault: z(e.warningDefault, 0.1),
2163
+ warningSubtle: z(e.warningDefault, -0.25),
2164
+ warningText: z(e.warningText, 0.15),
2165
+ dangerDefault: z(e.dangerDefault, 0.1),
2166
+ dangerHover: z(e.dangerHover, 0.1),
2167
+ dangerSubtle: z(e.dangerDefault, -0.25),
2168
+ dangerText: z(e.dangerText, 0.15),
2169
+ infoDefault: z(e.infoDefault, 0.1),
2170
+ infoSubtle: z(e.infoDefault, -0.25),
2171
+ infoText: z(e.infoText, 0.15)
2154
2172
  };
2155
2173
  }
2156
- const at = xa(he);
2157
- function ma(e) {
2158
- return "--lucent-" + e.replace(/([A-Z])/g, (t) => `-${t.toLowerCase()}`).replace(/([a-z])(\d)/g, (t, s, a) => `${s}-${a}`);
2174
+ const rt = va(ye);
2175
+ function ya(e) {
2176
+ return "--lucent-" + e.replace(/([A-Z])/g, (t) => `-${t.toLowerCase()}`).replace(/([a-z])(\d)/g, (t, o, a) => `${o}-${a}`);
2159
2177
  }
2160
- function ha(e, t = ":root") {
2161
- const s = Object.entries(e).map(([a, n]) => ` ${ma(a)}: ${n};`).join(`
2178
+ function wa(e, t = ":root") {
2179
+ const o = Object.entries(e).map(([a, n]) => ` ${ya(a)}: ${n};`).join(`
2162
2180
  `);
2163
2181
  return `${t} {
2164
- ${s}
2182
+ ${o}
2165
2183
  }`;
2166
2184
  }
2167
- function va(e) {
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);
2169
- return 0.2126 * n(t) + 0.7152 * n(s) + 0.0722 * n(a);
2185
+ function Da(e) {
2186
+ const t = parseInt(e.slice(1, 3), 16) / 255, o = 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);
2187
+ return 0.2126 * n(t) + 0.7152 * n(o) + 0.0722 * n(a);
2170
2188
  }
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;
2172
- function _e(e) {
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);
2174
- let c = ya * n + wa * r + Da * o;
2175
- return c < 0 && (c = 0), c < Ue ? c + Math.pow(Ue - c, Ta) : c;
2189
+ const Sa = 0.2126729, ka = 0.7151522, Ma = 0.072175, za = 0.56, Ta = 0.57, Ia = 0.65, Ba = 0.62, Ge = 0.022, $a = 1.414, Pa = 1.14, La = 1.14, _e = 0.027, Ve = 0.027;
2190
+ function Ke(e) {
2191
+ const t = parseInt(e.slice(1, 3), 16) / 255, o = parseInt(e.slice(3, 5), 16) / 255, a = parseInt(e.slice(5, 7), 16) / 255, n = Math.pow(t, 2.4), r = Math.pow(o, 2.4), s = Math.pow(a, 2.4);
2192
+ let c = Sa * n + ka * r + Ma * s;
2193
+ return c < 0 && (c = 0), c < Ge ? c + Math.pow(Ge - c, $a) : c;
2176
2194
  }
2177
- function ge(e, t) {
2178
- const s = _e(e), a = _e(t);
2195
+ function xe(e, t) {
2196
+ const o = Ke(e), a = Ke(t);
2179
2197
  let n;
2180
- if (s > a) {
2181
- const r = (Math.pow(s, ka) - Math.pow(a, Sa)) * Ia;
2182
- n = r < qe ? 0 : r - qe;
2198
+ if (o > a) {
2199
+ const r = (Math.pow(o, za) - Math.pow(a, Ta)) * Pa;
2200
+ n = r < _e ? 0 : r - _e;
2183
2201
  } else {
2184
- const r = (Math.pow(s, Ma) - Math.pow(a, za)) * Ba;
2185
- n = r > -Ge ? 0 : r + Ge;
2202
+ const r = (Math.pow(o, Ia) - Math.pow(a, Ba)) * La;
2203
+ n = r > -Ve ? 0 : r + Ve;
2186
2204
  }
2187
2205
  return n * 100;
2188
2206
  }
2189
- function $a(e) {
2190
- const t = Math.abs(ge(e, "#ffffff")), s = Math.abs(ge(e, "#000000"));
2191
- return t >= s ? "#ffffff" : "#000000";
2207
+ function Ra(e) {
2208
+ const t = Math.abs(xe(e, "#ffffff")), o = Math.abs(xe(e, "#000000"));
2209
+ return t >= o ? "#ffffff" : "#000000";
2192
2210
  }
2193
- function nt(e) {
2194
- 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.max(t, s, a), r = Math.min(t, s, a);
2195
- let o = 0, c = 0;
2211
+ function ot(e) {
2212
+ const t = parseInt(e.slice(1, 3), 16) / 255, o = parseInt(e.slice(3, 5), 16) / 255, a = parseInt(e.slice(5, 7), 16) / 255, n = Math.max(t, o, a), r = Math.min(t, o, a);
2213
+ let s = 0, c = 0;
2196
2214
  if (n !== r) {
2197
- const i = n - r;
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;
2215
+ const d = n - r;
2216
+ c = (n + r) / 2 > 0.5 ? d / (2 - n - r) : d / (n + r), n === t ? s = ((o - a) / d + (o < a ? 6 : 0)) / 6 : n === o ? s = ((a - t) / d + 2) / 6 : s = ((t - o) / d + 4) / 6;
2199
2217
  }
2200
- return $a(e) === "#000000" ? Le(o, Math.min(c, 0.6), 0.12) : Le(o, Math.min(c, 0.2), 0.95);
2201
- }
2202
- function La(e, t, s = 60) {
2203
- if (Math.abs(ge(e, t)) >= s) return e;
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);
2205
- let u = 0, i = 0, d = (o + c) / 2;
2206
- if (o !== c) {
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;
2218
+ return Ra(e) === "#000000" ? Re(s, Math.min(c, 0.6), 0.12) : Re(s, Math.min(c, 0.2), 0.95);
2219
+ }
2220
+ function Fa(e, t, o = 60) {
2221
+ if (Math.abs(xe(e, t)) >= o) return e;
2222
+ 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, s = Math.max(a, n, r), c = Math.min(a, n, r);
2223
+ let i = 0, d = 0, u = (s + c) / 2;
2224
+ if (s !== c) {
2225
+ const b = s - c;
2226
+ d = u > 0.5 ? b / (2 - s - c) : b / (s + c), s === a ? i = ((n - r) / b + (n < r ? 6 : 0)) / 6 : s === n ? i = ((r - a) / b + 2) / 6 : i = ((a - n) / b + 4) / 6;
2209
2227
  }
2210
- const h = va(t) > 0.5 ? -5e-3 : 5e-3;
2211
- for (let p = 0; p < 100; p++) {
2212
- d = Math.min(1, Math.max(0, d + h));
2213
- const y = Le(u, i, d);
2214
- if (Math.abs(ge(y, t)) >= s) return y;
2228
+ const h = Da(t) > 0.5 ? -5e-3 : 5e-3;
2229
+ for (let b = 0; b < 100; b++) {
2230
+ u = Math.min(1, Math.max(0, u + h));
2231
+ const v = Re(i, d, u);
2232
+ if (Math.abs(xe(v, t)) >= o) return v;
2215
2233
  }
2216
2234
  return e;
2217
2235
  }
2218
- function Le(e, t, s) {
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);
2220
- let n, r, o;
2236
+ function Re(e, t, o) {
2237
+ const a = (i, d, u) => (u < 0 && (u += 1), u > 1 && (u -= 1), u < 0.16666666666666666 ? i + (d - i) * 6 * u : u < 0.5 ? d : u < 0.6666666666666666 ? i + (d - i) * (0.6666666666666666 - u) * 6 : i);
2238
+ let n, r, s;
2221
2239
  if (t === 0)
2222
- n = r = o = s;
2240
+ n = r = s = o;
2223
2241
  else {
2224
- const u = s < 0.5 ? s * (1 + t) : s + t - s * t, i = 2 * s - u;
2225
- n = a(i, u, e + 1 / 3), r = a(i, u, e), o = a(i, u, e - 1 / 3);
2242
+ const i = o < 0.5 ? o * (1 + t) : o + t - o * t, d = 2 * o - i;
2243
+ n = a(d, i, e + 1 / 3), r = a(d, i, e), s = a(d, i, e - 1 / 3);
2226
2244
  }
2227
- const c = (u) => Math.round(u * 255).toString(16).padStart(2, "0");
2228
- return `#${c(n)}${c(r)}${c(o)}`;
2245
+ const c = (i) => Math.round(i * 255).toString(16).padStart(2, "0");
2246
+ return `#${c(n)}${c(r)}${c(s)}`;
2229
2247
  }
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));
2248
+ function Ca(e, t) {
2249
+ const [o, a, n] = _(e);
2250
+ return t ? G(o, a * 0.3, Math.min(1, n + (1 - n) * 0.85)) : G(o, a, Math.min(0.25, n + 0.04));
2233
2251
  }
2234
- const be = {
2252
+ const me = {
2235
2253
  subtle: { light: 0.95, dark: 0.12 },
2236
2254
  text: { light: 0.28, dark: 0.78 }
2237
2255
  };
2238
- function ce(e, t) {
2239
- const [s, a] = Y(e);
2240
- return V(s, a * 0.5, t ? be.subtle.light : be.subtle.dark);
2241
- }
2242
- function ie(e, t) {
2243
- const [s, a] = Y(e);
2244
- return V(s, a, t ? be.text.light : be.text.dark);
2245
- }
2246
- function rt(e, t, s) {
2247
- const a = {}, n = s === "light";
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));
2256
+ function ue(e, t) {
2257
+ const [o, a] = _(e);
2258
+ return G(o, a * 0.5, t ? me.subtle.light : me.subtle.dark);
2259
+ }
2260
+ function de(e, t) {
2261
+ const [o, a] = _(e);
2262
+ return G(o, a, t ? me.text.light : me.text.dark);
2263
+ }
2264
+ function st(e, t, o) {
2265
+ const a = {}, n = o === "light";
2266
+ 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))) {
2267
+ const r = Ca(t.bgBase, n);
2268
+ 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));
2251
2269
  }
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;
2270
+ 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 = ue(t.successDefault, n)), "successText" in e || (a.successText = de(t.successDefault, n))), "warningDefault" in e && ("warningSubtle" in e || (a.warningSubtle = ue(t.warningDefault, n)), "warningText" in e || (a.warningText = de(t.warningDefault, n))), "dangerDefault" in e && ("dangerHover" in e || (a.dangerHover = z(t.dangerDefault, n ? 0.05 : -0.07)), "dangerSubtle" in e || (a.dangerSubtle = ue(t.dangerDefault, n)), "dangerText" in e || (a.dangerText = de(t.dangerDefault, n))), "infoDefault" in e && ("infoSubtle" in e || (a.infoSubtle = ue(t.infoDefault, n)), "infoText" in e || (a.infoText = de(t.infoDefault, n))), a;
2253
2271
  }
2254
- function st(e, t = "light") {
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);
2272
+ function lt(e, t = "light") {
2273
+ const a = { ...t === "dark" ? rt : ye, ...e }, n = st(e, a, t), r = t === "light" ? z(a.accentDefault, -0.15) : z(a.accentDefault, 0.15);
2256
2274
  return {
2257
2275
  ...a,
2258
2276
  ...n,
2259
- accentFg: nt(a.accentDefault),
2277
+ accentFg: ot(a.accentDefault),
2260
2278
  accentBorder: r
2261
2279
  };
2262
2280
  }
2263
- const ot = {
2281
+ const ct = {
2264
2282
  name: "default",
2265
2283
  light: {
2266
2284
  navigation: "#f4f6f8",
@@ -2284,7 +2302,7 @@ const ot = {
2284
2302
  dangerDefault: "#ef4444",
2285
2303
  infoDefault: "#3b82f6"
2286
2304
  }
2287
- }, Fa = {
2305
+ }, Wa = {
2288
2306
  name: "brand",
2289
2307
  light: {
2290
2308
  navigation: "#fffefb",
@@ -2308,7 +2326,7 @@ const ot = {
2308
2326
  dangerDefault: "#ef4444",
2309
2327
  infoDefault: "#3b82f6"
2310
2328
  }
2311
- }, ve = {
2329
+ }, we = {
2312
2330
  name: "indigo",
2313
2331
  light: {
2314
2332
  navigation: "#ffffff",
@@ -2332,7 +2350,7 @@ const ot = {
2332
2350
  dangerDefault: "#ef4444",
2333
2351
  infoDefault: "#3b82f6"
2334
2352
  }
2335
- }, lt = {
2353
+ }, it = {
2336
2354
  name: "violet",
2337
2355
  light: {
2338
2356
  navigation: "#f8f4ff",
@@ -2356,7 +2374,7 @@ const ot = {
2356
2374
  dangerDefault: "#ef4444",
2357
2375
  infoDefault: "#3b82f6"
2358
2376
  }
2359
- }, ct = {
2377
+ }, ut = {
2360
2378
  name: "emerald",
2361
2379
  light: {
2362
2380
  navigation: "#f4fcf9",
@@ -2380,7 +2398,7 @@ const ot = {
2380
2398
  dangerDefault: "#ef4444",
2381
2399
  infoDefault: "#3b82f6"
2382
2400
  }
2383
- }, Ca = {
2401
+ }, Ha = {
2384
2402
  name: "teal",
2385
2403
  light: {
2386
2404
  navigation: "#f9fbfc",
@@ -2404,7 +2422,7 @@ const ot = {
2404
2422
  dangerDefault: "#ef4444",
2405
2423
  infoDefault: "#3b82f6"
2406
2424
  }
2407
- }, it = {
2425
+ }, dt = {
2408
2426
  name: "rose",
2409
2427
  light: {
2410
2428
  navigation: "#fff4f6",
@@ -2428,7 +2446,7 @@ const ot = {
2428
2446
  dangerDefault: "#ef4444",
2429
2447
  infoDefault: "#3b82f6"
2430
2448
  }
2431
- }, ut = {
2449
+ }, ft = {
2432
2450
  name: "coral",
2433
2451
  light: {
2434
2452
  navigation: "#fff9f7",
@@ -2452,7 +2470,7 @@ const ot = {
2452
2470
  dangerDefault: "#ef4444",
2453
2471
  infoDefault: "#3b82f6"
2454
2472
  }
2455
- }, Pa = {
2473
+ }, Na = {
2456
2474
  name: "amber",
2457
2475
  light: {
2458
2476
  navigation: "#fffdf6",
@@ -2476,7 +2494,7 @@ const ot = {
2476
2494
  dangerDefault: "#ef4444",
2477
2495
  infoDefault: "#3b82f6"
2478
2496
  }
2479
- }, dt = {
2497
+ }, pt = {
2480
2498
  name: "ocean",
2481
2499
  light: {
2482
2500
  navigation: "#ebf1ff",
@@ -2500,7 +2518,7 @@ const ot = {
2500
2518
  dangerDefault: "#ef4444",
2501
2519
  infoDefault: "#3b82f6"
2502
2520
  }
2503
- }, ft = {
2521
+ }, gt = {
2504
2522
  name: "slate",
2505
2523
  light: {
2506
2524
  navigation: "#f7f8fa",
@@ -2524,7 +2542,7 @@ const ot = {
2524
2542
  dangerDefault: "#ef4444",
2525
2543
  infoDefault: "#3b82f6"
2526
2544
  }
2527
- }, Wa = {
2545
+ }, Ea = {
2528
2546
  name: "sage",
2529
2547
  light: {
2530
2548
  navigation: "#f4f8f4",
@@ -2548,7 +2566,7 @@ const ot = {
2548
2566
  dangerDefault: "#ef4444",
2549
2567
  infoDefault: "#3b82f6"
2550
2568
  }
2551
- }, ye = {
2569
+ }, De = {
2552
2570
  name: "sharp",
2553
2571
  tokens: {
2554
2572
  radiusNone: "0px",
@@ -2558,7 +2576,7 @@ const ot = {
2558
2576
  radiusXl: "0.375rem",
2559
2577
  radiusFull: "9999px"
2560
2578
  }
2561
- }, re = {
2579
+ }, oe = {
2562
2580
  name: "rounded",
2563
2581
  tokens: {
2564
2582
  radiusNone: "0px",
@@ -2568,7 +2586,7 @@ const ot = {
2568
2586
  radiusXl: "0.75rem",
2569
2587
  radiusFull: "9999px"
2570
2588
  }
2571
- }, we = {
2589
+ }, Se = {
2572
2590
  name: "pill",
2573
2591
  tokens: {
2574
2592
  radiusNone: "0px",
@@ -2578,7 +2596,7 @@ const ot = {
2578
2596
  radiusXl: "1.5rem",
2579
2597
  radiusFull: "9999px"
2580
2598
  }
2581
- }, De = {
2599
+ }, ke = {
2582
2600
  name: "compact",
2583
2601
  tokens: {
2584
2602
  space0: "0px",
@@ -2612,7 +2630,7 @@ const ot = {
2612
2630
  space20: "5rem",
2613
2631
  space24: "6rem"
2614
2632
  }
2615
- }, ke = {
2633
+ }, Me = {
2616
2634
  name: "spacious",
2617
2635
  tokens: {
2618
2636
  space0: "0px",
@@ -2629,7 +2647,7 @@ const ot = {
2629
2647
  space20: "6.25rem",
2630
2648
  space24: "7.5rem"
2631
2649
  }
2632
- }, Fe = {
2650
+ }, Ce = {
2633
2651
  name: "flat",
2634
2652
  light: {
2635
2653
  shadowNone: "none",
@@ -2645,7 +2663,7 @@ const ot = {
2645
2663
  shadowLg: "none",
2646
2664
  shadowXl: "none"
2647
2665
  }
2648
- }, pt = {
2666
+ }, bt = {
2649
2667
  name: "subtle",
2650
2668
  light: {
2651
2669
  shadowNone: "none",
@@ -2661,7 +2679,7 @@ const ot = {
2661
2679
  shadowLg: "0 0 40px color-mix(in srgb, var(--lucent-accent-default) 9%, transparent), inset 0 1px 0 0 rgba(255, 255, 255, 0.05)",
2662
2680
  shadowXl: "0 0 56px color-mix(in srgb, var(--lucent-accent-default) 12%, transparent), inset 0 1px 0 0 rgba(255, 255, 255, 0.06)"
2663
2681
  }
2664
- }, gt = {
2682
+ }, xt = {
2665
2683
  name: "elevated",
2666
2684
  light: {
2667
2685
  shadowNone: "none",
@@ -2677,7 +2695,7 @@ const ot = {
2677
2695
  shadowLg: "inset 0 1px 0 0 rgba(255, 255, 255, 0.1), inset 0 0 28px rgba(255, 255, 255, 0.04), 0 0 1px rgba(255, 255, 255, 0.08)",
2678
2696
  shadowXl: "inset 0 1px 0 0 rgba(255, 255, 255, 0.12), inset 0 0 36px rgba(255, 255, 255, 0.05), 0 0 1px rgba(255, 255, 255, 0.1)"
2679
2697
  }
2680
- }, bt = {
2698
+ }, mt = {
2681
2699
  name: "liquidGlass",
2682
2700
  light: {
2683
2701
  shadowNone: "none",
@@ -2693,7 +2711,7 @@ const ot = {
2693
2711
  shadowLg: "inset 0 1px 0 0 rgba(255, 255, 255, 0.1), inset 0 0 30px rgba(255, 255, 255, 0.03), 0 0 50px rgba(255, 255, 255, 0.04)",
2694
2712
  shadowXl: "inset 0 1px 0 0 rgba(255, 255, 255, 0.12), inset 0 0 40px rgba(255, 255, 255, 0.04), 0 0 70px rgba(255, 255, 255, 0.05)"
2695
2713
  }
2696
- }, xt = {
2714
+ }, ht = {
2697
2715
  name: "brutalist",
2698
2716
  light: {
2699
2717
  shadowNone: "none",
@@ -2709,7 +2727,7 @@ const ot = {
2709
2727
  shadowLg: "0 0 0 3px color-mix(in srgb, var(--lucent-accent-default) 70%, transparent), 6px 6px 0 0 color-mix(in srgb, var(--lucent-accent-default) 40%, transparent)",
2710
2728
  shadowXl: "0 0 0 3px color-mix(in srgb, var(--lucent-accent-default) 75%, transparent), 8px 8px 0 0 color-mix(in srgb, var(--lucent-accent-default) 45%, transparent)"
2711
2729
  }
2712
- }, mt = {
2730
+ }, vt = {
2713
2731
  name: "neumorphic",
2714
2732
  light: {
2715
2733
  shadowNone: "none",
@@ -2725,7 +2743,7 @@ const ot = {
2725
2743
  shadowLg: "0 20px 30px rgba(0, 0, 0, 0.5)",
2726
2744
  shadowXl: "0 28px 40px rgba(0, 0, 0, 0.55)"
2727
2745
  }
2728
- }, ht = {
2746
+ }, yt = {
2729
2747
  name: "natural",
2730
2748
  light: {
2731
2749
  shadowNone: "none",
@@ -2741,7 +2759,7 @@ const ot = {
2741
2759
  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)",
2742
2760
  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)"
2743
2761
  }
2744
- }, Ce = {
2762
+ }, We = {
2745
2763
  name: "glow",
2746
2764
  light: {
2747
2765
  shadowNone: "none",
@@ -2757,234 +2775,234 @@ const ot = {
2757
2775
  shadowLg: "0 0 36px color-mix(in srgb, var(--lucent-accent-default) 35%, transparent)",
2758
2776
  shadowXl: "0 0 50px color-mix(in srgb, var(--lucent-accent-default) 40%, transparent)"
2759
2777
  }
2760
- }, Ha = {
2778
+ }, Aa = {
2761
2779
  name: "modern",
2762
- palette: ve,
2763
- shape: re,
2780
+ palette: we,
2781
+ shape: oe,
2764
2782
  density: se,
2765
- shadow: pt
2766
- }, Na = {
2767
- name: "enterprise",
2768
- palette: ot,
2769
- shape: ye,
2770
- density: De,
2771
- shadow: Fe
2772
- }, Ea = {
2773
- name: "playful",
2774
- palette: it,
2775
- shape: we,
2776
- density: ke,
2777
- shadow: gt
2778
- }, Aa = {
2779
- name: "liquidGlass",
2780
- palette: dt,
2781
- shape: we,
2782
- density: ke,
2783
2783
  shadow: bt
2784
2784
  }, Oa = {
2785
- name: "bento",
2786
- palette: ve,
2787
- shape: re,
2788
- density: se,
2789
- shadow: ht
2785
+ name: "enterprise",
2786
+ palette: ct,
2787
+ shape: De,
2788
+ density: ke,
2789
+ shadow: Ce
2790
2790
  }, Xa = {
2791
- name: "brutalist",
2792
- palette: ut,
2793
- shape: ye,
2794
- density: De,
2791
+ name: "playful",
2792
+ palette: dt,
2793
+ shape: Se,
2794
+ density: Me,
2795
2795
  shadow: xt
2796
2796
  }, ja = {
2797
- name: "terminal",
2798
- palette: ct,
2799
- shape: ye,
2800
- density: De,
2801
- shadow: Ce
2797
+ name: "liquidGlass",
2798
+ palette: pt,
2799
+ shape: Se,
2800
+ density: Me,
2801
+ shadow: mt
2802
2802
  }, Ua = {
2803
- name: "softUI",
2804
- palette: lt,
2805
- shape: we,
2803
+ name: "bento",
2804
+ palette: we,
2805
+ shape: oe,
2806
2806
  density: se,
2807
- shadow: mt
2807
+ shadow: yt
2808
2808
  }, qa = {
2809
- name: "bloom",
2810
- palette: ve,
2811
- shape: re,
2809
+ name: "brutalist",
2810
+ palette: ft,
2811
+ shape: De,
2812
2812
  density: ke,
2813
- shadow: Ce
2813
+ shadow: ht
2814
2814
  }, Ga = {
2815
- name: "minimal",
2816
- palette: ft,
2817
- shape: re,
2818
- density: se,
2819
- shadow: Fe
2815
+ name: "terminal",
2816
+ palette: ut,
2817
+ shape: De,
2818
+ density: ke,
2819
+ shadow: We
2820
2820
  }, _a = {
2821
- default: ot,
2822
- brand: Fa,
2823
- indigo: ve,
2824
- violet: lt,
2825
- emerald: ct,
2826
- teal: Ca,
2827
- rose: it,
2828
- coral: ut,
2829
- amber: Pa,
2830
- ocean: dt,
2831
- slate: ft,
2832
- sage: Wa
2821
+ name: "softUI",
2822
+ palette: it,
2823
+ shape: Se,
2824
+ density: se,
2825
+ shadow: vt
2833
2826
  }, Va = {
2834
- sharp: ye,
2835
- rounded: re,
2836
- pill: we
2827
+ name: "bloom",
2828
+ palette: we,
2829
+ shape: oe,
2830
+ density: Me,
2831
+ shadow: We
2837
2832
  }, Ka = {
2838
- compact: De,
2839
- default: se,
2840
- spacious: ke
2833
+ name: "minimal",
2834
+ palette: gt,
2835
+ shape: oe,
2836
+ density: se,
2837
+ shadow: Ce
2841
2838
  }, Ya = {
2842
- flat: Fe,
2843
- subtle: pt,
2844
- elevated: gt,
2845
- liquidGlass: bt,
2846
- brutalist: xt,
2847
- neumorphic: mt,
2848
- natural: ht,
2849
- glow: Ce
2839
+ default: ct,
2840
+ brand: Wa,
2841
+ indigo: we,
2842
+ violet: it,
2843
+ emerald: ut,
2844
+ teal: Ha,
2845
+ rose: dt,
2846
+ coral: ft,
2847
+ amber: Na,
2848
+ ocean: pt,
2849
+ slate: gt,
2850
+ sage: Ea
2850
2851
  }, Za = {
2851
- modern: Ha,
2852
- enterprise: Na,
2853
- playful: Ea,
2854
- liquidGlass: Aa,
2855
- bento: Oa,
2856
- brutalist: Xa,
2857
- terminal: ja,
2858
- softUI: Ua,
2859
- bloom: qa,
2860
- minimal: Ga
2852
+ sharp: De,
2853
+ rounded: oe,
2854
+ pill: Se
2855
+ }, Ja = {
2856
+ compact: ke,
2857
+ default: se,
2858
+ spacious: Me
2859
+ }, Qa = {
2860
+ flat: Ce,
2861
+ subtle: bt,
2862
+ elevated: xt,
2863
+ liquidGlass: mt,
2864
+ brutalist: ht,
2865
+ neumorphic: vt,
2866
+ natural: yt,
2867
+ glow: We
2868
+ }, en = {
2869
+ modern: Aa,
2870
+ enterprise: Oa,
2871
+ playful: Xa,
2872
+ liquidGlass: ja,
2873
+ bento: Ua,
2874
+ brutalist: qa,
2875
+ terminal: Ga,
2876
+ softUI: _a,
2877
+ bloom: Va,
2878
+ minimal: Ka
2861
2879
  };
2862
- function Ja(e) {
2863
- return typeof e == "string" ? _a[e] : e;
2880
+ function tn(e) {
2881
+ return typeof e == "string" ? Ya[e] : e;
2864
2882
  }
2865
- function Qa(e) {
2866
- return typeof e == "string" ? Va[e] : e;
2883
+ function an(e) {
2884
+ return typeof e == "string" ? Za[e] : e;
2867
2885
  }
2868
- function en(e) {
2869
- return typeof e == "string" ? Ka[e] : e;
2886
+ function nn(e) {
2887
+ return typeof e == "string" ? Ja[e] : e;
2870
2888
  }
2871
- function tn(e) {
2872
- return typeof e == "string" ? Ya[e] : e;
2889
+ function rn(e) {
2890
+ return typeof e == "string" ? Qa[e] : e;
2873
2891
  }
2874
- function an(e, t) {
2875
- let s, a, n, r;
2892
+ function on(e, t) {
2893
+ let o, a, n, r;
2876
2894
  if (typeof e == "string") {
2877
- const c = Za[e];
2895
+ const c = en[e];
2878
2896
  if (!c) return {};
2879
- s = c.palette, a = c.shape, n = c.density, r = c.shadow;
2897
+ o = c.palette, a = c.shape, n = c.density, r = c.shadow;
2880
2898
  } else
2881
- e.palette !== void 0 && (s = Ja(e.palette)), e.shape !== void 0 && (a = Qa(e.shape)), e.density !== void 0 && (n = en(e.density)), e.shadow !== void 0 && (r = tn(e.shadow));
2882
- const o = {};
2883
- if (s) {
2884
- const c = st(s[t], t);
2885
- Object.assign(o, c);
2899
+ e.palette !== void 0 && (o = tn(e.palette)), e.shape !== void 0 && (a = an(e.shape)), e.density !== void 0 && (n = nn(e.density)), e.shadow !== void 0 && (r = rn(e.shadow));
2900
+ const s = {};
2901
+ if (o) {
2902
+ const c = lt(o[t], t);
2903
+ Object.assign(s, c);
2886
2904
  }
2887
- return a && Object.assign(o, a.tokens), n && Object.assign(o, n.tokens), r && Object.assign(o, r[t]), o;
2905
+ return a && Object.assign(s, a.tokens), n && Object.assign(s, n.tokens), r && Object.assign(s, r[t]), s;
2888
2906
  }
2889
- const vt = wt({
2907
+ const wt = St({
2890
2908
  theme: "light",
2891
- tokens: he
2909
+ tokens: ye
2892
2910
  });
2893
- function fn({
2911
+ function bn({
2894
2912
  theme: e = "light",
2895
2913
  preset: t,
2896
- tokens: s,
2914
+ tokens: o,
2897
2915
  anchors: a,
2898
2916
  children: n
2899
2917
  }) {
2900
- const r = Ke().replace(/:/g, ""), o = t ? an(t, e) : void 0, c = (() => {
2918
+ const r = Ze().replace(/:/g, ""), s = t ? on(t, e) : void 0, c = (() => {
2901
2919
  if (a) {
2902
- const k = st(a, e);
2903
- if (o) {
2904
- const L = {};
2905
- for (const [b, m] of Object.entries(o))
2906
- (b.startsWith("space") || b.startsWith("radius") || b.startsWith("shadow") || b.startsWith("duration") || b.startsWith("easing")) && (L[b] = m);
2907
- return { ...k, ...L };
2920
+ const I = lt(a, e);
2921
+ if (s) {
2922
+ const k = {};
2923
+ for (const [p, m] of Object.entries(s))
2924
+ (p.startsWith("space") || p.startsWith("radius") || p.startsWith("shadow") || p.startsWith("duration") || p.startsWith("easing")) && (k[p] = m);
2925
+ return { ...I, ...k };
2908
2926
  }
2909
- return k;
2927
+ return I;
2910
2928
  }
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);
2929
+ const d = e === "dark" ? rt : ye, u = s ? { ...s, ...o } : o, x = u ? { ...d, ...u } : d, h = u ? st(u, x, e) : {}, b = (u == null ? void 0 : u.accentBorder) ?? (e === "light" ? z(x.accentDefault, -0.15) : z(x.accentDefault, 0.15)), v = (u == null ? void 0 : u.accentFg) ?? ot(x.accentDefault), B = Fa(x.accentDefault, v);
2912
2930
  return {
2913
- ...g,
2931
+ ...x,
2914
2932
  ...h,
2915
- accentDefault: I,
2916
- accentFg: y,
2917
- accentBorder: p
2933
+ accentDefault: B,
2934
+ accentFg: v,
2935
+ accentBorder: b
2918
2936
  };
2919
- })(), u = `html { font-size: 14px; }
2920
- ` + ha(c, ":root");
2921
- return me(() => {
2922
- let i = document.getElementById(`lucent-tokens-${r}`);
2923
- return i || (i = document.createElement("style"), i.id = `lucent-tokens-${r}`, document.head.appendChild(i)), i.textContent = u, () => {
2924
- var d;
2925
- (d = document.getElementById(`lucent-tokens-${r}`)) == null || d.remove();
2937
+ })(), i = `html { font-size: 14px; }
2938
+ ` + wa(c, ":root");
2939
+ return ve(() => {
2940
+ let d = document.getElementById(`lucent-tokens-${r}`);
2941
+ return d || (d = document.createElement("style"), d.id = `lucent-tokens-${r}`, document.head.appendChild(d)), d.textContent = i, () => {
2942
+ var u;
2943
+ (u = document.getElementById(`lucent-tokens-${r}`)) == null || u.remove();
2926
2944
  };
2927
- }, [r, u]), /* @__PURE__ */ f(vt.Provider, { value: { theme: e, tokens: c }, children: n });
2945
+ }, [r, i]), /* @__PURE__ */ f(wt.Provider, { value: { theme: e, tokens: c }, children: n });
2928
2946
  }
2929
- function pn() {
2930
- return yt(vt);
2947
+ function xn() {
2948
+ return Dt(wt);
2931
2949
  }
2932
2950
  export {
2933
- ma as $,
2934
- ve as A,
2935
- Ye as B,
2936
- sa as C,
2937
- he as D,
2938
- Aa as E,
2939
- bt as F,
2940
- ha as G,
2941
- Ga as H,
2951
+ ya as $,
2952
+ we as A,
2953
+ Je as B,
2954
+ la as C,
2955
+ ye as D,
2956
+ ja as E,
2957
+ mt as F,
2958
+ wa as G,
2959
+ Ka as H,
2942
2960
  te as I,
2943
- Ha as J,
2944
- ht as K,
2945
- fn as L,
2946
- mt as M,
2947
- dt as N,
2948
- we as O,
2949
- Ea as P,
2950
- an as Q,
2951
- it as R,
2952
- Je as S,
2953
- cn as T,
2954
- re as U,
2955
- ye as V,
2956
- Ua as W,
2957
- ke as X,
2958
- pt as Y,
2959
- ja as Z,
2960
- pn as _,
2961
- M as a,
2962
- da as a0,
2963
- ua as a1,
2964
- La as a2,
2965
- on as b,
2966
- de as c,
2967
- Ze as d,
2968
- un as e,
2969
- dn as f,
2970
- nt as g,
2971
- ln as h,
2972
- Oa as i,
2973
- qa as j,
2974
- Fa as k,
2975
- Xa as l,
2976
- xt as m,
2977
- De as n,
2978
- st as o,
2979
- at as p,
2961
+ Aa as J,
2962
+ yt as K,
2963
+ bn as L,
2964
+ vt as M,
2965
+ pt as N,
2966
+ Se as O,
2967
+ Xa as P,
2968
+ on as Q,
2969
+ dt as R,
2970
+ et as S,
2971
+ fn as T,
2972
+ oe as U,
2973
+ De as V,
2974
+ _a as W,
2975
+ Me as X,
2976
+ bt as Y,
2977
+ Ga as Z,
2978
+ xn as _,
2979
+ z as a,
2980
+ ga as a0,
2981
+ pa as a1,
2982
+ Fa as a2,
2983
+ un as b,
2984
+ pe as c,
2985
+ Qe as d,
2986
+ pn as e,
2987
+ gn as f,
2988
+ ot as g,
2989
+ dn as h,
2990
+ Ua as i,
2991
+ Va as j,
2992
+ Wa as k,
2993
+ qa as l,
2994
+ ht as m,
2995
+ ke as n,
2996
+ lt as o,
2997
+ rt as p,
2980
2998
  se as q,
2981
- ot as r,
2982
- xa as s,
2983
- rt as t,
2984
- gt as u,
2985
- ct as v,
2986
- Na as w,
2987
- Fe as x,
2988
- $a as y,
2989
- Ce as z
2999
+ ct as r,
3000
+ va as s,
3001
+ st as t,
3002
+ xt as u,
3003
+ ut as v,
3004
+ Oa as w,
3005
+ Ce as x,
3006
+ Ra as y,
3007
+ We as z
2990
3008
  };