beth-clarity 1.1.20 → 1.1.22

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 (3) hide show
  1. package/dist/clarity-design-system.es.js +956 -909
  2. package/dist/clarity-design-system.umd.js +2 -2
  3. package/package.json +1 -1
package/dist/clarity-design-system.es.js CHANGED
@@ -1,36 +1,36 @@
1
- import { jsx as a, jsxs as w, Fragment as ot } from "react/jsx-runtime";
2
- import E, { useState as T, useRef as M, useEffect as D, forwardRef as ct, isValidElement as se, createContext as Q, cloneElement as z, useContext as Z, useMemo as te, useCallback as ce, useLayoutEffect as dt } from "react";
3
- import mt from "react-dom";
4
- const Dt = ({
1
+ import { jsx as n, jsxs as w, Fragment as ft } from "react/jsx-runtime";
2
+ import L, { useState as T, useRef as F, useEffect as I, forwardRef as ht, isValidElement as ae, createContext as Q, cloneElement as z, useContext as U, useMemo as te, useCallback as de, useLayoutEffect as yt } from "react";
3
+ import vt from "react-dom";
4
+ const Wt = ({
5
5
  variant: e = "primary",
6
6
  product: t,
7
- tone: s,
8
- size: n = "medium",
9
- bgColor: l,
10
- textColor: i,
7
+ tone: a,
8
+ size: s = "medium",
9
+ bgColor: r,
10
+ textColor: l,
11
11
  children: d,
12
12
  className: o = "",
13
- rounded: r = !1,
13
+ rounded: i = !1,
14
14
  outlined: c = !1,
15
15
  ...p
16
16
  }) => {
17
- const v = "clarity-badge", m = !!l, f = t && s && !m;
17
+ const v = "clarity-badge", m = !!r, f = t && a && !m;
18
18
  let u = "";
19
19
  m ? u = `${v}--custom-bg` : f ? u = `${v}--custom` : u = `${v}--${e}`;
20
20
  const h = [
21
21
  v,
22
22
  u,
23
- `${v}--${n}`,
24
- r ? `${v}--rounded` : "",
23
+ `${v}--${s}`,
24
+ i ? `${v}--rounded` : "",
25
25
  c ? `${v}--outlined` : "",
26
26
  o
27
27
  ].filter(Boolean).join(" "), y = {};
28
- m && (y.backgroundColor = l, i && (y.color = i));
29
- const b = f && t && s ? {
30
- "--custom-bg-color": `var(--clarity-${t}-${s})`,
31
- "--custom-text-color": s && parseInt(s) >= 500 ? "white" : `var(--clarity-${t}-800)`
28
+ m && (y.backgroundColor = r, l && (y.color = l));
29
+ const b = f && t && a ? {
30
+ "--custom-bg-color": `var(--clarity-${t}-${a})`,
31
+ "--custom-text-color": a && parseInt(a) >= 500 ? "white" : `var(--clarity-${t}-800)`
32
32
  } : {};
33
- return /* @__PURE__ */ a(
33
+ return /* @__PURE__ */ n(
34
34
  "span",
35
35
  {
36
36
  className: h,
@@ -42,7 +42,7 @@ const Dt = ({
42
42
  children: d
43
43
  }
44
44
  );
45
- }, ve = {
45
+ }, we = {
46
46
  fontFamily: {
47
47
  sans: ["Inter", "system-ui", "sans-serif"],
48
48
  mono: ["Fira Code", "monospace"]
@@ -69,100 +69,112 @@ const Dt = ({
69
69
  wide: "0.025em",
70
70
  wider: "0.05em"
71
71
  }
72
- }, ue = (e) => {
72
+ }, fe = (e) => {
73
73
  if (e) {
74
+ if (e.startsWith("#") || e.startsWith("rgb") || e.startsWith("hsl") || e === "transparent")
75
+ return e;
74
76
  if (e.includes(".")) {
75
- const [t, s] = e.split(".");
76
- return `var(--clarity-${t}-${s})`;
77
+ const [t, a] = e.split(".");
78
+ return `var(--clarity-${t}-${a})`;
77
79
  }
78
80
  return `var(--clarity-${e})`;
79
81
  }
80
- }, U = (e) => e !== void 0 ? `var(--clarity-spacing-${e})` : void 0, de = E.forwardRef(({
82
+ }, J = (e) => e !== void 0 ? `var(--clarity-spacing-${e})` : void 0, me = L.forwardRef(({
81
83
  as: e,
82
84
  children: t,
83
- className: s,
84
- display: n,
85
+ className: a,
86
+ display: s,
87
+ position: r,
85
88
  flexDirection: l,
86
- alignItems: i,
87
- justifyContent: d,
88
- gap: o,
89
- m: r,
90
- mt: c,
91
- mr: p,
92
- mb: v,
93
- ml: m,
94
- mx: f,
95
- my: u,
96
- p: h,
97
- pt: y,
98
- pr: b,
99
- pb: N,
100
- pl: B,
101
- px: x,
102
- py: _,
103
- bg: $,
104
- color: L,
105
- fontSize: k,
106
- fontWeight: j,
107
- textAlign: I,
108
- lineHeight: A,
109
- letterSpacing: O,
110
- borderRadius: g,
111
- boxShadow: V,
89
+ alignItems: d,
90
+ justifyContent: o,
91
+ gap: i,
92
+ m: c,
93
+ mt: p,
94
+ mr: v,
95
+ mb: m,
96
+ ml: f,
97
+ mx: u,
98
+ my: h,
99
+ p: y,
100
+ pt: b,
101
+ pr: N,
102
+ pb: B,
103
+ pl: x,
104
+ px: g,
105
+ py: $,
106
+ bg: E,
107
+ color: k,
108
+ fontSize: j,
109
+ fontWeight: S,
110
+ textAlign: A,
111
+ lineHeight: R,
112
+ letterSpacing: _,
113
+ borderRadius: V,
114
+ borderTopLeftRadius: P,
115
+ borderTopRightRadius: M,
116
+ borderBottomLeftRadius: q,
117
+ borderBottomRightRadius: Z,
118
+ boxShadow: W,
112
119
  borderWidth: H,
113
- borderTopWidth: W,
114
- borderRightWidth: q,
115
- borderBottomWidth: X,
116
- borderLeftWidth: F,
117
- borderXWidth: P,
118
- borderYWidth: Y,
119
- borderColor: le,
120
- ...re
121
- }, ie) => {
122
- const C = e || "div", S = (R, J) => {
123
- if (R === void 0 || R === 0) return;
124
- const rt = `var(--clarity-border-width-${R})`, it = J ? ue(J) : "currentColor";
125
- return `${rt} solid ${it}`;
126
- }, G = {
127
- display: n,
120
+ borderTopWidth: ee,
121
+ borderRightWidth: re,
122
+ borderBottomWidth: le,
123
+ borderLeftWidth: ie,
124
+ borderXWidth: C,
125
+ borderYWidth: O,
126
+ borderColor: G,
127
+ ...D
128
+ }, X) => {
129
+ const dt = e || "div", oe = (pe, Ne) => {
130
+ if (pe === void 0 || pe === 0) return;
131
+ const ut = `var(--clarity-border-width-${pe})`, pt = Ne ? fe(Ne) : "currentColor";
132
+ return `${ut} solid ${pt}`;
133
+ }, mt = {
134
+ display: s,
135
+ position: r,
128
136
  flexDirection: l,
129
- alignItems: i,
130
- justifyContent: d,
131
- gap: U(o),
132
- marginTop: U(c ?? u ?? r),
133
- marginRight: U(p ?? f ?? r),
134
- marginBottom: U(v ?? u ?? r),
135
- marginLeft: U(m ?? f ?? r),
136
- paddingTop: U(y ?? _ ?? h),
137
- paddingRight: U(b ?? x ?? h),
138
- paddingBottom: U(N ?? _ ?? h),
139
- paddingLeft: U(B ?? x ?? h),
140
- backgroundColor: $ ? ue($) : void 0,
141
- color: L ? ue(L) : void 0,
142
- fontSize: k ? `var(--clarity-font-size-${k})` : void 0,
143
- fontWeight: j ? ve.fontWeight[j] : void 0,
144
- textAlign: I,
145
- lineHeight: A,
146
- letterSpacing: O ? ve.letterSpacing[O] : void 0,
147
- borderRadius: g ? `var(--clarity-radius-${g})` : void 0,
148
- boxShadow: V ? `var(--clarity-shadow-${V})` : void 0,
149
- border: S(H, le),
150
- borderTop: S(W ?? Y),
151
- borderRight: S(q ?? P),
152
- borderBottom: S(X ?? Y),
153
- borderLeft: S(F ?? P)
137
+ alignItems: d,
138
+ justifyContent: o,
139
+ gap: J(i),
140
+ marginTop: J(p ?? h ?? c),
141
+ marginRight: J(v ?? u ?? c),
142
+ marginBottom: J(m ?? h ?? c),
143
+ marginLeft: J(f ?? u ?? c),
144
+ paddingTop: J(b ?? $ ?? y),
145
+ paddingRight: J(N ?? g ?? y),
146
+ paddingBottom: J(B ?? $ ?? y),
147
+ paddingLeft: J(x ?? g ?? y),
148
+ backgroundColor: E ? fe(E) : void 0,
149
+ color: k ? fe(k) : void 0,
150
+ fontSize: j ? `var(--clarity-font-size-${j})` : void 0,
151
+ fontWeight: S ? we.fontWeight[S] : void 0,
152
+ textAlign: A,
153
+ lineHeight: R,
154
+ letterSpacing: _ ? we.letterSpacing[_] : void 0,
155
+ borderRadius: V ? `var(--clarity-radius-${V})` : void 0,
156
+ borderTopLeftRadius: P ? `var(--clarity-radius-${P})` : void 0,
157
+ borderTopRightRadius: M ? `var(--clarity-radius-${M})` : void 0,
158
+ borderBottomLeftRadius: q ? `var(--clarity-radius-${q})` : void 0,
159
+ borderBottomRightRadius: Z ? `var(--clarity-radius-${Z})` : void 0,
160
+ boxShadow: W ? `var(--clarity-shadow-${W})` : void 0,
161
+ border: oe(H, G),
162
+ borderTop: oe(ee ?? O),
163
+ borderRight: oe(re ?? C),
164
+ borderBottom: oe(le ?? O),
165
+ borderLeft: oe(ie ?? C)
154
166
  };
155
- return /* @__PURE__ */ a(C, { ref: ie, className: `clarity-box ${s || ""}`.trim(), style: G, ...re, children: t });
156
- }), At = ({
167
+ return /* @__PURE__ */ n(dt, { ref: X, className: `clarity-box ${a || ""}`.trim(), style: mt, ...D, children: t });
168
+ }), Ft = ({
157
169
  variant: e = "primary",
158
170
  size: t = "medium",
159
- disabled: s = !1,
160
- loading: n = !1,
161
- children: l,
162
- onClick: i,
171
+ disabled: a = !1,
172
+ loading: s = !1,
173
+ children: r,
174
+ onClick: l,
163
175
  type: d = "button",
164
176
  className: o = "",
165
- title: r,
177
+ title: i,
166
178
  customColor: c,
167
179
  customColorHover: p,
168
180
  ...v
@@ -171,8 +183,8 @@ const Dt = ({
171
183
  m,
172
184
  !c && `${m}--${e}`,
173
185
  `${m}--${t}`,
174
- n && `${m}--loading`,
175
- s && `${m}--disabled`,
186
+ s && `${m}--loading`,
187
+ a && `${m}--disabled`,
176
188
  o
177
189
  ].filter(Boolean).join(" "), u = {};
178
190
  return c && (u["--button-bg"] = c, u["--button-hover-bg"] = p || `${c}E6`, u["--button-border"] = c, u["--button-hover-border"] = p || `${c}E6`, u["--button-fg"] = "#fff"), /* @__PURE__ */ w(
@@ -180,59 +192,59 @@ const Dt = ({
180
192
  {
181
193
  className: f,
182
194
  style: u,
183
- disabled: s || n,
184
- onClick: i,
195
+ disabled: a || s,
196
+ onClick: l,
185
197
  type: d,
186
- title: r,
198
+ title: i,
187
199
  ...v,
188
200
  children: [
189
- n && /* @__PURE__ */ a("div", { className: `${m}__spinner` }),
190
- l
201
+ s && /* @__PURE__ */ n("div", { className: `${m}__spinner` }),
202
+ r
191
203
  ]
192
204
  }
193
205
  );
194
- }, Pt = ({
206
+ }, Gt = ({
195
207
  variant: e = "primary",
196
208
  size: t = "medium",
197
- filled: s = !0,
198
- items: n,
199
- value: l,
200
- multiple: i = !1,
209
+ filled: a = !0,
210
+ items: s,
211
+ value: r,
212
+ multiple: l = !1,
201
213
  disabled: d = !1,
202
214
  onChange: o,
203
- className: r = "",
215
+ className: i = "",
204
216
  ...c
205
217
  }) => {
206
218
  const p = "clarity-button-group", v = `${p}--${e}`, m = [
207
219
  p,
208
220
  v,
209
221
  `${p}--${t}`,
210
- !s && `${p}--outline`,
222
+ !a && `${p}--outline`,
211
223
  d && `${p}--disabled`,
212
- r
224
+ i
213
225
  ].filter(Boolean).join(" "), f = (h) => {
214
226
  if (d || !o) return;
215
- const y = n.find((b) => b.id === h);
227
+ const y = s.find((b) => b.id === h);
216
228
  if (!(y != null && y.disabled))
217
- if (i) {
218
- const b = Array.isArray(l) ? l : [], N = b.includes(h) ? b.filter((B) => B !== h) : [...b, h];
229
+ if (l) {
230
+ const b = Array.isArray(r) ? r : [], N = b.includes(h) ? b.filter((B) => B !== h) : [...b, h];
219
231
  o(N);
220
232
  } else
221
233
  o(h);
222
- }, u = (h) => i ? Array.isArray(l) && l.includes(h) : l === h;
223
- return /* @__PURE__ */ a(
234
+ }, u = (h) => l ? Array.isArray(r) && r.includes(h) : r === h;
235
+ return /* @__PURE__ */ n(
224
236
  "div",
225
237
  {
226
238
  className: m,
227
239
  role: "group",
228
240
  ...c,
229
- children: n.map((h, y) => {
241
+ children: s.map((h, y) => {
230
242
  const b = u(h.id), N = [
231
243
  `${p}__item`,
232
244
  b && `${p}__item--selected`,
233
245
  h.disabled && `${p}__item--disabled`,
234
246
  y === 0 && `${p}__item--first`,
235
- y === n.length - 1 && `${p}__item--last`
247
+ y === s.length - 1 && `${p}__item--last`
236
248
  ].filter(Boolean).join(" ");
237
249
  return /* @__PURE__ */ w(
238
250
  "button",
@@ -243,8 +255,8 @@ const Dt = ({
243
255
  type: "button",
244
256
  "aria-pressed": b,
245
257
  children: [
246
- h.icon && /* @__PURE__ */ a("span", { className: `${p}__item-icon`, children: h.icon }),
247
- /* @__PURE__ */ a("span", { className: `${p}__item-label`, children: h.label })
258
+ h.icon && /* @__PURE__ */ n("span", { className: `${p}__item-icon`, children: h.icon }),
259
+ /* @__PURE__ */ n("span", { className: `${p}__item-label`, children: h.label })
248
260
  ]
249
261
  },
250
262
  h.id
@@ -252,16 +264,16 @@ const Dt = ({
252
264
  })
253
265
  }
254
266
  );
255
- }, ut = E.forwardRef(({
267
+ }, bt = L.forwardRef(({
256
268
  variant: e,
257
269
  size: t = "medium",
258
- label: s,
259
- helperText: n,
260
- error: l = !1,
261
- errorMessage: i,
270
+ label: a,
271
+ helperText: s,
272
+ error: r = !1,
273
+ errorMessage: l,
262
274
  startIcon: d,
263
275
  endIcon: o,
264
- className: r = "",
276
+ className: i = "",
265
277
  disabled: c = !1,
266
278
  value: p,
267
279
  defaultValue: v,
@@ -269,33 +281,33 @@ const Dt = ({
269
281
  onBlur: f,
270
282
  ...u
271
283
  }, h) => {
272
- const [y, b] = T(!1), [N, B] = T(!1), x = M(null);
273
- E.useImperativeHandle(h, () => x.current), D(() => {
284
+ const [y, b] = T(!1), [N, B] = T(!1), x = F(null);
285
+ L.useImperativeHandle(h, () => x.current), I(() => {
274
286
  const k = x.current;
275
287
  k && B(k.value.length > 0);
276
288
  }, [p, v]);
277
- const _ = (k) => {
289
+ const g = (k) => {
278
290
  b(!0), m == null || m(k);
279
291
  }, $ = (k) => {
280
292
  b(!1), B(k.target.value.length > 0), f == null || f(k);
281
- }, L = [
293
+ }, E = [
282
294
  "clarity-input",
283
295
  "clarity-input--outlined",
284
296
  `clarity-input--${t}`,
285
297
  e && `clarity-input--${e}`,
286
- l && "clarity-input--error",
298
+ r && "clarity-input--error",
287
299
  c && "clarity-input--disabled",
288
300
  y && "clarity-input--focused",
289
301
  N && "clarity-input--has-value",
290
302
  d && "clarity-input--with-start-icon",
291
303
  o && "clarity-input--with-end-icon",
292
- r
304
+ i
293
305
  ].filter(Boolean).join(" ");
294
306
  return /* @__PURE__ */ w("div", { className: "clarity-input-wrapper", children: [
295
- /* @__PURE__ */ w("div", { className: L, children: [
296
- d && /* @__PURE__ */ a("div", { className: "clarity-input__start-icon", children: d }),
307
+ /* @__PURE__ */ w("div", { className: E, children: [
308
+ d && /* @__PURE__ */ n("div", { className: "clarity-input__start-icon", children: d }),
297
309
  /* @__PURE__ */ w("div", { className: "clarity-input__field", children: [
298
- /* @__PURE__ */ a(
310
+ /* @__PURE__ */ n(
299
311
  "input",
300
312
  {
301
313
  ref: x,
@@ -303,29 +315,29 @@ const Dt = ({
303
315
  disabled: c,
304
316
  value: p,
305
317
  defaultValue: v,
306
- onFocus: _,
318
+ onFocus: g,
307
319
  onBlur: $,
308
320
  ...u
309
321
  }
310
322
  ),
311
- s && /* @__PURE__ */ a("label", { className: "clarity-input__label", children: s })
323
+ a && /* @__PURE__ */ n("label", { className: "clarity-input__label", children: a })
312
324
  ] }),
313
- o && /* @__PURE__ */ a("div", { className: "clarity-input__end-icon", children: o })
325
+ o && /* @__PURE__ */ n("div", { className: "clarity-input__end-icon", children: o })
314
326
  ] }),
315
- (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-input__helper-text", children: l && i ? i : n })
327
+ (s || r && l) && /* @__PURE__ */ n("div", { className: "clarity-input__helper-text", children: r && l ? l : s })
316
328
  ] });
317
329
  });
318
- ut.displayName = "Input";
319
- const pt = E.forwardRef(({
330
+ bt.displayName = "Input";
331
+ const Ct = L.forwardRef(({
320
332
  variant: e,
321
333
  size: t = "medium",
322
- label: s,
323
- helperText: n,
324
- error: l = !1,
325
- errorMessage: i,
334
+ label: a,
335
+ helperText: s,
336
+ error: r = !1,
337
+ errorMessage: l,
326
338
  startIcon: d,
327
339
  endIcon: o,
328
- className: r = "",
340
+ className: i = "",
329
341
  disabled: c = !1,
330
342
  value: p,
331
343
  defaultValue: v,
@@ -337,37 +349,37 @@ const pt = E.forwardRef(({
337
349
  resizable: b = !0,
338
350
  ...N
339
351
  }, B) => {
340
- const [x, _] = T(!1), [$, L] = T(!1), k = M(null);
341
- E.useImperativeHandle(B, () => k.current), D(() => {
342
- const g = k.current;
343
- g && L(g.value.length > 0);
352
+ const [x, g] = T(!1), [$, E] = T(!1), k = F(null);
353
+ L.useImperativeHandle(B, () => k.current), I(() => {
354
+ const _ = k.current;
355
+ _ && E(_.value.length > 0);
344
356
  }, [p, v]);
345
- const j = (g) => {
346
- _(!0), m == null || m(g);
347
- }, I = (g) => {
348
- _(!1), L(g.target.value.length > 0), f == null || f(g);
357
+ const j = (_) => {
358
+ g(!0), m == null || m(_);
359
+ }, S = (_) => {
360
+ g(!1), E(_.target.value.length > 0), f == null || f(_);
349
361
  }, A = [
350
362
  "clarity-textarea",
351
363
  "clarity-textarea--outlined",
352
364
  `clarity-textarea--${t}`,
353
365
  e && `clarity-textarea--${e}`,
354
- l && "clarity-textarea--error",
366
+ r && "clarity-textarea--error",
355
367
  c && "clarity-textarea--disabled",
356
368
  x && "clarity-textarea--focused",
357
369
  $ && "clarity-textarea--has-value",
358
370
  d && "clarity-textarea--with-start-icon",
359
371
  o && "clarity-textarea--with-end-icon",
360
- r
361
- ].filter(Boolean).join(" "), O = {
372
+ i
373
+ ].filter(Boolean).join(" "), R = {
362
374
  resize: b ? "vertical" : "none",
363
375
  minHeight: h ? `${h}px` : void 0,
364
376
  maxHeight: y ? `${y}px` : void 0
365
377
  };
366
378
  return /* @__PURE__ */ w("div", { className: "clarity-textarea-wrapper", children: [
367
379
  /* @__PURE__ */ w("div", { className: A, children: [
368
- d && /* @__PURE__ */ a("div", { className: "clarity-textarea__start-icon", children: d }),
380
+ d && /* @__PURE__ */ n("div", { className: "clarity-textarea__start-icon", children: d }),
369
381
  /* @__PURE__ */ w("div", { className: "clarity-textarea__field", children: [
370
- /* @__PURE__ */ a(
382
+ /* @__PURE__ */ n(
371
383
  "textarea",
372
384
  {
373
385
  ref: k,
@@ -376,30 +388,30 @@ const pt = E.forwardRef(({
376
388
  value: p,
377
389
  defaultValue: v,
378
390
  onFocus: j,
379
- onBlur: I,
391
+ onBlur: S,
380
392
  rows: u,
381
- style: O,
393
+ style: R,
382
394
  ...N
383
395
  }
384
396
  ),
385
- s && /* @__PURE__ */ a("label", { className: "clarity-textarea__label", children: s })
397
+ a && /* @__PURE__ */ n("label", { className: "clarity-textarea__label", children: a })
386
398
  ] }),
387
- o && /* @__PURE__ */ a("div", { className: "clarity-textarea__end-icon", children: o })
399
+ o && /* @__PURE__ */ n("div", { className: "clarity-textarea__end-icon", children: o })
388
400
  ] }),
389
- (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-textarea__helper-text", children: l && i ? i : n })
401
+ (s || r && l) && /* @__PURE__ */ n("div", { className: "clarity-textarea__helper-text", children: r && l ? l : s })
390
402
  ] });
391
403
  });
392
- pt.displayName = "Textarea";
393
- const ft = E.forwardRef(({
404
+ Ct.displayName = "Textarea";
405
+ const Nt = L.forwardRef(({
394
406
  variant: e,
395
407
  size: t = "medium",
396
- label: s,
397
- helperText: n,
398
- error: l = !1,
399
- errorMessage: i,
408
+ label: a,
409
+ helperText: s,
410
+ error: r = !1,
411
+ errorMessage: l,
400
412
  startIcon: d,
401
413
  endIcon: o,
402
- className: r = "",
414
+ className: i = "",
403
415
  disabled: c = !1,
404
416
  value: p,
405
417
  defaultValue: v,
@@ -412,94 +424,94 @@ const ft = E.forwardRef(({
412
424
  isSearchable: N = !1,
413
425
  ...B
414
426
  }, x) => {
415
- const [_, $] = T(!1), [L, k] = T(!1), [j, I] = T(p || v || ""), [A, O] = T(""), g = M(null), V = M(null);
416
- E.useImperativeHandle(x, () => g.current), D(() => {
417
- p !== void 0 && I(p);
418
- }, [p]), D(() => {
419
- const C = (S) => {
420
- g.current && !g.current.contains(S.target) && ($(!1), k(!1), f == null || f());
427
+ const [g, $] = T(!1), [E, k] = T(!1), [j, S] = T(p || v || ""), [A, R] = T(""), _ = F(null), V = F(null);
428
+ L.useImperativeHandle(x, () => _.current), I(() => {
429
+ p !== void 0 && S(p);
430
+ }, [p]), I(() => {
431
+ const C = (O) => {
432
+ _.current && !_.current.contains(O.target) && ($(!1), k(!1), f == null || f());
421
433
  };
422
434
  return document.addEventListener("mousedown", C), () => document.removeEventListener("mousedown", C);
423
435
  }, [f]);
424
- const H = N && A ? h.filter(
436
+ const P = N && A ? h.filter(
425
437
  (C) => C.label.toLowerCase().includes(A.toLowerCase())
426
- ) : h, W = () => {
427
- c || ($(!_), k(!_), _ ? (f == null || f(), N && O("")) : (m == null || m(), N && setTimeout(() => {
438
+ ) : h, M = () => {
439
+ c || ($(!g), k(!g), g ? (f == null || f(), N && R("")) : (m == null || m(), N && setTimeout(() => {
428
440
  var C;
429
441
  (C = V.current) == null || C.focus();
430
442
  }, 0)));
431
443
  }, q = (C) => {
432
- C.disabled || (I(C.value), $(!1), k(!1), O(""), u == null || u(C.value), f == null || f());
433
- }, X = (C) => {
434
- O(C.target.value);
435
- }, F = (C) => {
436
- C.key === "Escape" ? ($(!1), k(!1), O("")) : C.key === "Enter" && H.length > 0 && H[0] && q(H[0]);
437
- }, P = h.find((C) => C.value === j), Y = j !== "" && j !== void 0, le = (C) => {
438
- C.stopPropagation(), I(""), u == null || u("");
439
- }, re = Y || L || y || N && A, ie = [
444
+ C.disabled || (S(C.value), $(!1), k(!1), R(""), u == null || u(C.value), f == null || f());
445
+ }, Z = (C) => {
446
+ R(C.target.value);
447
+ }, W = (C) => {
448
+ C.key === "Escape" ? ($(!1), k(!1), R("")) : C.key === "Enter" && P.length > 0 && P[0] && q(P[0]);
449
+ }, H = h.find((C) => C.value === j), ee = j !== "" && j !== void 0, re = (C) => {
450
+ C.stopPropagation(), S(""), u == null || u("");
451
+ }, le = ee || E || y || N && A, ie = [
440
452
  "clarity-select",
441
453
  "clarity-select--outlined",
442
454
  `clarity-select--${t}`,
443
455
  e && `clarity-select--${e}`,
444
- l && "clarity-select--error",
456
+ r && "clarity-select--error",
445
457
  c && "clarity-select--disabled",
446
- (L || _) && "clarity-select--focused",
447
- re && "clarity-select--label-up",
448
- _ && "clarity-select--open",
458
+ (E || g) && "clarity-select--focused",
459
+ le && "clarity-select--label-up",
460
+ g && "clarity-select--open",
449
461
  N && "clarity-select--searchable",
450
462
  d && "clarity-select--with-start-icon",
451
463
  (o || b) && "clarity-select--with-end-icon",
452
- r
464
+ i
453
465
  ].filter(Boolean).join(" ");
454
466
  return /* @__PURE__ */ w("div", { className: "clarity-select-wrapper", children: [
455
467
  /* @__PURE__ */ w(
456
468
  "div",
457
469
  {
458
- ref: g,
470
+ ref: _,
459
471
  className: ie,
460
- onClick: N ? void 0 : W,
472
+ onClick: N ? void 0 : M,
461
473
  role: "combobox",
462
- "aria-expanded": _,
474
+ "aria-expanded": g,
463
475
  "aria-haspopup": "listbox",
464
476
  tabIndex: c || N ? -1 : 0,
465
477
  ...B,
466
478
  children: [
467
- d && /* @__PURE__ */ a("div", { className: "clarity-select__start-icon", children: d }),
479
+ d && /* @__PURE__ */ n("div", { className: "clarity-select__start-icon", children: d }),
468
480
  /* @__PURE__ */ w("div", { className: "clarity-select__field", children: [
469
- N ? /* @__PURE__ */ a(
481
+ N ? /* @__PURE__ */ n(
470
482
  "input",
471
483
  {
472
484
  ref: V,
473
485
  type: "text",
474
486
  className: "clarity-select__search-input",
475
- value: _ ? A : P ? P.label : "",
476
- onChange: X,
477
- onKeyDown: F,
487
+ value: g ? A : H ? H.label : "",
488
+ onChange: Z,
489
+ onKeyDown: W,
478
490
  onFocus: () => {
479
- _ || ($(!0), k(!0), m == null || m());
491
+ g || ($(!0), k(!0), m == null || m());
480
492
  },
481
- placeholder: P ? P.label : y,
493
+ placeholder: H ? H.label : y,
482
494
  disabled: c,
483
- readOnly: !_
495
+ readOnly: !g
484
496
  }
485
- ) : /* @__PURE__ */ a("div", { className: "clarity-select__display", children: P ? P.label : y }),
486
- s && /* @__PURE__ */ a("label", { className: "clarity-select__label", children: s })
497
+ ) : /* @__PURE__ */ n("div", { className: "clarity-select__display", children: H ? H.label : y }),
498
+ a && /* @__PURE__ */ n("label", { className: "clarity-select__label", children: a })
487
499
  ] }),
488
- b && Y && /* @__PURE__ */ a(
500
+ b && ee && /* @__PURE__ */ n(
489
501
  "button",
490
502
  {
491
503
  type: "button",
492
504
  className: "clarity-select__clear-button",
493
- onClick: le,
505
+ onClick: re,
494
506
  "aria-label": "Limpar seleção",
495
- children: /* @__PURE__ */ a(
507
+ children: /* @__PURE__ */ n(
496
508
  "svg",
497
509
  {
498
510
  width: "16",
499
511
  height: "16",
500
512
  viewBox: "0 0 16 16",
501
513
  fill: "none",
502
- children: /* @__PURE__ */ a(
514
+ children: /* @__PURE__ */ n(
503
515
  "path",
504
516
  {
505
517
  d: "M12 4L4 12M4 4L12 12",
@@ -513,12 +525,12 @@ const ft = E.forwardRef(({
513
525
  )
514
526
  }
515
527
  ),
516
- /* @__PURE__ */ a(
528
+ /* @__PURE__ */ n(
517
529
  "div",
518
530
  {
519
531
  className: "clarity-select__end-icon",
520
- onClick: N ? W : void 0,
521
- children: o || /* @__PURE__ */ a(
532
+ onClick: N ? M : void 0,
533
+ children: o || /* @__PURE__ */ n(
522
534
  "svg",
523
535
  {
524
536
  className: "clarity-select__arrow",
@@ -526,7 +538,7 @@ const ft = E.forwardRef(({
526
538
  height: "16",
527
539
  viewBox: "0 0 16 16",
528
540
  fill: "none",
529
- children: /* @__PURE__ */ a(
541
+ children: /* @__PURE__ */ n(
530
542
  "path",
531
543
  {
532
544
  d: "M4 6L8 10L12 6",
@@ -540,7 +552,7 @@ const ft = E.forwardRef(({
540
552
  )
541
553
  }
542
554
  ),
543
- _ && /* @__PURE__ */ a("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ a("ul", { className: "clarity-select__options", role: "listbox", children: H.length > 0 ? H.map((C) => /* @__PURE__ */ a(
555
+ g && /* @__PURE__ */ n("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ n("ul", { className: "clarity-select__options", role: "listbox", children: P.length > 0 ? P.map((C) => /* @__PURE__ */ n(
544
556
  "li",
545
557
  {
546
558
  className: [
@@ -554,24 +566,24 @@ const ft = E.forwardRef(({
554
566
  children: C.label
555
567
  },
556
568
  C.value
557
- )) : /* @__PURE__ */ a("li", { className: "clarity-select__option clarity-select__option--no-results", children: "Nenhum resultado encontrado" }) }) })
569
+ )) : /* @__PURE__ */ n("li", { className: "clarity-select__option clarity-select__option--no-results", children: "Nenhum resultado encontrado" }) }) })
558
570
  ]
559
571
  }
560
572
  ),
561
- (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-select__helper-text", children: l && i ? i : n })
573
+ (s || r && l) && /* @__PURE__ */ n("div", { className: "clarity-select__helper-text", children: r && l ? l : s })
562
574
  ] });
563
575
  });
564
- ft.displayName = "Select";
565
- const ht = ct(({
576
+ Nt.displayName = "Select";
577
+ const wt = ht(({
566
578
  options: e = [],
567
579
  value: t = [],
568
- onChange: s,
569
- placeholder: n = "Selecione opções",
570
- label: l,
571
- helperText: i,
580
+ onChange: a,
581
+ placeholder: s = "Selecione opções",
582
+ label: r,
583
+ helperText: l,
572
584
  error: d = !1,
573
585
  errorMessage: o,
574
- disabled: r = !1,
586
+ disabled: i = !1,
575
587
  variant: c = "primary",
576
588
  size: p = "medium",
577
589
  maxSelectedLabels: v = 3,
@@ -583,65 +595,65 @@ const ht = ct(({
583
595
  "data-testid": b,
584
596
  ...N
585
597
  }, B) => {
586
- const [x, _] = T(!1), [$, L] = T(""), [k, j] = T(!1), I = M(null), A = M(null), O = M(null), g = (C) => {
587
- I.current = C, B && (typeof B == "function" ? B(C) : B.current = C);
598
+ const [x, g] = T(!1), [$, E] = T(""), [k, j] = T(!1), S = F(null), A = F(null), R = F(null), _ = (C) => {
599
+ S.current = C, B && (typeof B == "function" ? B(C) : B.current = C);
588
600
  };
589
- D(() => {
590
- const C = (S) => {
591
- I.current && !I.current.contains(S.target) && (_(!1), j(!1), L(""));
601
+ I(() => {
602
+ const C = (O) => {
603
+ S.current && !S.current.contains(O.target) && (g(!1), j(!1), E(""));
592
604
  };
593
605
  return document.addEventListener("click", C), () => document.removeEventListener("click", C);
594
606
  }, []);
595
607
  const V = e.filter(
596
608
  (C) => C.label.toLowerCase().includes($.toLowerCase())
597
- ), H = () => {
598
- r || (_(!x), j(!x), x ? L("") : setTimeout(() => {
609
+ ), P = () => {
610
+ i || (g(!x), j(!x), x ? E("") : setTimeout(() => {
599
611
  var C;
600
612
  (C = A.current) == null || C.focus();
601
613
  }, 100));
602
- }, W = (C, S) => {
603
- if (r)
614
+ }, M = (C, O) => {
615
+ if (i)
604
616
  return;
605
- S && (S.stopPropagation(), S.preventDefault());
617
+ O && (O.stopPropagation(), O.preventDefault());
606
618
  const G = t.includes(C);
607
- let R;
608
- G ? R = t.filter((J) => J !== C) : R = [...t, C], s && s(R);
609
- }, q = (C, S) => {
610
- if (S.stopPropagation(), r) return;
611
- const G = t.filter((R) => R !== C);
612
- s == null || s(G);
613
- }, X = (C) => {
614
- C.stopPropagation(), !r && (s == null || s([]));
615
- }, F = (C) => {
616
- L(C.target.value);
617
- }, P = (C) => {
618
- C.key === "Escape" && (_(!1), j(!1), L(""));
619
- }, Y = k || x || t.length > 0, le = () => {
619
+ let D;
620
+ G ? D = t.filter((X) => X !== C) : D = [...t, C], a && a(D);
621
+ }, q = (C, O) => {
622
+ if (O.stopPropagation(), i) return;
623
+ const G = t.filter((D) => D !== C);
624
+ a == null || a(G);
625
+ }, Z = (C) => {
626
+ C.stopPropagation(), !i && (a == null || a([]));
627
+ }, W = (C) => {
628
+ E(C.target.value);
629
+ }, H = (C) => {
630
+ C.key === "Escape" && (g(!1), j(!1), E(""));
631
+ }, ee = k || x || t.length > 0, re = () => {
620
632
  if (t.length === 0) return null;
621
633
  const C = t.map(
622
- (R) => e.find((J) => J.value === R)
623
- ).filter(Boolean), S = C.slice(0, v), G = C.length - v;
634
+ (D) => e.find((X) => X.value === D)
635
+ ).filter(Boolean), O = C.slice(0, v), G = C.length - v;
624
636
  return /* @__PURE__ */ w("div", { className: "clarity-multiselect__chips", children: [
625
- S.map((R) => /* @__PURE__ */ w("div", { className: "clarity-multiselect__chip", children: [
626
- /* @__PURE__ */ a("span", { className: "clarity-multiselect__chip-label", children: R.label }),
627
- !r && /* @__PURE__ */ a(
637
+ O.map((D) => /* @__PURE__ */ w("div", { className: "clarity-multiselect__chip", children: [
638
+ /* @__PURE__ */ n("span", { className: "clarity-multiselect__chip-label", children: D.label }),
639
+ !i && /* @__PURE__ */ n(
628
640
  "button",
629
641
  {
630
642
  type: "button",
631
643
  className: "clarity-multiselect__chip-remove",
632
- onClick: (J) => q(R.value, J),
633
- "aria-label": `Remover ${R.label}`,
644
+ onClick: (X) => q(D.value, X),
645
+ "aria-label": `Remover ${D.label}`,
634
646
  children: "×"
635
647
  }
636
648
  )
637
- ] }, R.value)),
649
+ ] }, D.value)),
638
650
  G > 0 && /* @__PURE__ */ w("div", { className: "clarity-multiselect__chip clarity-multiselect__chip--count", children: [
639
651
  "+",
640
652
  G,
641
653
  " mais"
642
654
  ] })
643
655
  ] });
644
- }, re = [
656
+ }, le = [
645
657
  "clarity-multiselect-wrapper",
646
658
  f
647
659
  ].filter(Boolean).join(" "), ie = [
@@ -650,16 +662,16 @@ const ht = ct(({
650
662
  `clarity-multiselect--${p}`,
651
663
  x && "clarity-multiselect--open",
652
664
  k && "clarity-multiselect--focused",
653
- Y && "clarity-multiselect--label-up",
665
+ ee && "clarity-multiselect--label-up",
654
666
  d && "clarity-multiselect--error",
655
- r && "clarity-multiselect--disabled",
667
+ i && "clarity-multiselect--disabled",
656
668
  t.length > 0 && "clarity-multiselect--has-value"
657
669
  ].filter(Boolean).join(" ");
658
- return /* @__PURE__ */ w("div", { className: re, children: [
670
+ return /* @__PURE__ */ w("div", { className: le, children: [
659
671
  /* @__PURE__ */ w(
660
672
  "div",
661
673
  {
662
- ref: g,
674
+ ref: _,
663
675
  className: ie,
664
676
  "data-testid": b,
665
677
  ...N,
@@ -668,25 +680,25 @@ const ht = ct(({
668
680
  "div",
669
681
  {
670
682
  className: "clarity-multiselect__field",
671
- onClick: H,
683
+ onClick: P,
672
684
  children: [
673
- l && /* @__PURE__ */ w("label", { className: "clarity-multiselect__label", children: [
674
- l,
675
- y && /* @__PURE__ */ a("span", { className: "clarity-multiselect__required", children: "*" })
685
+ r && /* @__PURE__ */ w("label", { className: "clarity-multiselect__label", children: [
686
+ r,
687
+ y && /* @__PURE__ */ n("span", { className: "clarity-multiselect__required", children: "*" })
676
688
  ] }),
677
- /* @__PURE__ */ a("div", { className: "clarity-multiselect__content", children: t.length > 0 ? le() : /* @__PURE__ */ a("span", { className: "clarity-multiselect__placeholder", children: n }) }),
689
+ /* @__PURE__ */ n("div", { className: "clarity-multiselect__content", children: t.length > 0 ? re() : /* @__PURE__ */ n("span", { className: "clarity-multiselect__placeholder", children: s }) }),
678
690
  /* @__PURE__ */ w("div", { className: "clarity-multiselect__icons", children: [
679
- t.length > 0 && !r && /* @__PURE__ */ a(
691
+ t.length > 0 && !i && /* @__PURE__ */ n(
680
692
  "button",
681
693
  {
682
694
  type: "button",
683
695
  className: "clarity-multiselect__clear-button",
684
- onClick: X,
696
+ onClick: Z,
685
697
  "aria-label": "Limpar seleção",
686
698
  children: "×"
687
699
  }
688
700
  ),
689
- /* @__PURE__ */ a("div", { className: "clarity-multiselect__dropdown-icon", children: /* @__PURE__ */ a("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ a(
701
+ /* @__PURE__ */ n("div", { className: "clarity-multiselect__dropdown-icon", children: /* @__PURE__ */ n("svg", { width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", children: /* @__PURE__ */ n(
690
702
  "path",
691
703
  {
692
704
  d: "M4 6L8 10L12 6",
@@ -700,8 +712,8 @@ const ht = ct(({
700
712
  ]
701
713
  }
702
714
  ),
703
- x && /* @__PURE__ */ w("div", { ref: O, className: "clarity-multiselect__dropdown", children: [
704
- /* @__PURE__ */ a("div", { className: "clarity-multiselect__search", children: /* @__PURE__ */ a(
715
+ x && /* @__PURE__ */ w("div", { ref: R, className: "clarity-multiselect__dropdown", children: [
716
+ /* @__PURE__ */ n("div", { className: "clarity-multiselect__search", children: /* @__PURE__ */ n(
705
717
  "input",
706
718
  {
707
719
  ref: A,
@@ -709,26 +721,26 @@ const ht = ct(({
709
721
  className: "clarity-multiselect__search-input",
710
722
  placeholder: "Buscar opções...",
711
723
  value: $,
712
- onChange: F,
713
- onKeyDown: P
724
+ onChange: W,
725
+ onKeyDown: H
714
726
  }
715
727
  ) }),
716
- /* @__PURE__ */ a("ul", { className: "clarity-multiselect__options", children: V.length > 0 ? V.map((C) => {
717
- const S = t.includes(C.value), G = C.disabled || r;
728
+ /* @__PURE__ */ n("ul", { className: "clarity-multiselect__options", children: V.length > 0 ? V.map((C) => {
729
+ const O = t.includes(C.value), G = C.disabled || i;
718
730
  return /* @__PURE__ */ w(
719
731
  "li",
720
732
  {
721
733
  className: [
722
734
  "clarity-multiselect__option",
723
- S && "clarity-multiselect__option--selected",
735
+ O && "clarity-multiselect__option--selected",
724
736
  G && "clarity-multiselect__option--disabled"
725
737
  ].filter(Boolean).join(" "),
726
- onClick: (R) => !G && W(C.value, R),
738
+ onClick: (D) => !G && M(C.value, D),
727
739
  children: [
728
- /* @__PURE__ */ a("div", { className: "clarity-multiselect__option-checkbox", children: /* @__PURE__ */ a("div", { className: [
740
+ /* @__PURE__ */ n("div", { className: "clarity-multiselect__option-checkbox", children: /* @__PURE__ */ n("div", { className: [
729
741
  "clarity-multiselect__checkbox",
730
- S && "clarity-multiselect__checkbox--checked"
731
- ].filter(Boolean).join(" "), children: S && /* @__PURE__ */ a("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ a(
742
+ O && "clarity-multiselect__checkbox--checked"
743
+ ].filter(Boolean).join(" "), children: O && /* @__PURE__ */ n("svg", { width: "12", height: "12", viewBox: "0 0 12 12", fill: "none", children: /* @__PURE__ */ n(
732
744
  "path",
733
745
  {
734
746
  d: "M2 6L5 9L10 3",
@@ -738,88 +750,88 @@ const ht = ct(({
738
750
  strokeLinejoin: "round"
739
751
  }
740
752
  ) }) }) }),
741
- /* @__PURE__ */ a("span", { className: "clarity-multiselect__option-label", children: C.label })
753
+ /* @__PURE__ */ n("span", { className: "clarity-multiselect__option-label", children: C.label })
742
754
  ]
743
755
  },
744
756
  C.value
745
757
  );
746
- }) : /* @__PURE__ */ a("li", { className: "clarity-multiselect__option clarity-multiselect__option--no-results", children: "Nenhum resultado encontrado" }) })
758
+ }) : /* @__PURE__ */ n("li", { className: "clarity-multiselect__option clarity-multiselect__option--no-results", children: "Nenhum resultado encontrado" }) })
747
759
  ] })
748
760
  ]
749
761
  }
750
762
  ),
751
- (i || d && o) && /* @__PURE__ */ a("div", { className: "clarity-multiselect__helper", children: d && o ? /* @__PURE__ */ a("span", { className: "clarity-multiselect__error-message", children: o }) : i && /* @__PURE__ */ a("span", { className: "clarity-multiselect__helper-text", children: i }) })
763
+ (l || d && o) && /* @__PURE__ */ n("div", { className: "clarity-multiselect__helper", children: d && o ? /* @__PURE__ */ n("span", { className: "clarity-multiselect__error-message", children: o }) : l && /* @__PURE__ */ n("span", { className: "clarity-multiselect__helper-text", children: l }) })
752
764
  ] });
753
765
  });
754
- ht.displayName = "MultiSelect";
755
- const be = Q(null), Ce = () => {
756
- const e = Z(be);
766
+ wt.displayName = "MultiSelect";
767
+ const ge = Q(null), _e = () => {
768
+ const e = U(ge);
757
769
  if (!e)
758
770
  throw new Error("useModal must be used within a Modal provider");
759
771
  return e;
760
- }, Ne = ({
772
+ }, $e = ({
761
773
  children: e,
762
774
  className: t = "",
763
- title: s
775
+ title: a
764
776
  }) => {
765
- const { onClose: n, variant: l, showCloseButton: i } = Ce(), d = [
777
+ const { onClose: s, variant: r, showCloseButton: l } = _e(), d = [
766
778
  "clarity-modal-header",
767
779
  t,
768
- l && `clarity-modal-header--${l}`
780
+ r && `clarity-modal-header--${r}`
769
781
  ].filter(Boolean).join(" "), o = [
770
782
  "clarity-modal-close",
771
- l && `clarity-modal-close--${l}`
783
+ r && `clarity-modal-close--${r}`
772
784
  ].filter(Boolean).join(" ");
773
785
  return /* @__PURE__ */ w("div", { className: d, children: [
774
- s && /* @__PURE__ */ a("h2", { className: "clarity-modal-title", children: s }),
786
+ a && /* @__PURE__ */ n("h2", { className: "clarity-modal-title", children: a }),
775
787
  e,
776
- i && /* @__PURE__ */ a("button", { className: o, onClick: (r) => {
777
- r.stopPropagation(), n();
788
+ l && /* @__PURE__ */ n("button", { className: o, onClick: (i) => {
789
+ i.stopPropagation(), s();
778
790
  }, children: "×" })
779
791
  ] });
780
792
  };
781
- Ne.displayName = "Modal.Header";
782
- const we = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-modal-content ${t}`, children: e });
783
- we.displayName = "Modal.Content";
784
- const _e = ({ children: e, className: t = "" }) => /* @__PURE__ */ w("div", { className: `clarity-modal-footer ${t}`, children: [
785
- /* @__PURE__ */ a("div", { className: "clarity-modal-scroll-indicator" }),
793
+ $e.displayName = "Modal.Header";
794
+ const ke = ({ children: e, className: t = "" }) => /* @__PURE__ */ n("div", { className: `clarity-modal-content ${t}`, children: e });
795
+ ke.displayName = "Modal.Content";
796
+ const xe = ({ children: e, className: t = "" }) => /* @__PURE__ */ w("div", { className: `clarity-modal-footer ${t}`, children: [
797
+ /* @__PURE__ */ n("div", { className: "clarity-modal-scroll-indicator" }),
786
798
  e
787
799
  ] });
788
- _e.displayName = "Modal.Footer";
789
- const ge = ({ children: e, onClick: t }) => z(e, {
790
- onClick: (s) => {
791
- var n, l;
792
- t == null || t(), (l = (n = e.props).onClick) == null || l.call(n, s);
800
+ xe.displayName = "Modal.Footer";
801
+ const Te = ({ children: e, onClick: t }) => z(e, {
802
+ onClick: (a) => {
803
+ var s, r;
804
+ t == null || t(), (r = (s = e.props).onClick) == null || r.call(s, a);
793
805
  }
794
806
  });
795
- ge.displayName = "Modal.Trigger";
796
- const $e = ({ children: e }) => {
797
- const { onClose: t } = Ce();
807
+ Te.displayName = "Modal.Trigger";
808
+ const Be = ({ children: e }) => {
809
+ const { onClose: t } = _e();
798
810
  return z(e, {
799
- onClick: (s) => {
800
- var n, l;
801
- t(), (l = (n = e.props).onClick) == null || l.call(n, s);
811
+ onClick: (a) => {
812
+ var s, r;
813
+ t(), (r = (s = e.props).onClick) == null || r.call(s, a);
802
814
  }
803
815
  });
804
816
  };
805
- $e.displayName = "Modal.Close";
806
- const K = ({
817
+ Be.displayName = "Modal.Close";
818
+ const Y = ({
807
819
  isOpen: e,
808
820
  onClose: t,
809
- onOpen: s,
810
- children: n,
811
- className: l = "",
812
- variant: i,
821
+ onOpen: a,
822
+ children: s,
823
+ className: r = "",
824
+ variant: l,
813
825
  size: d = "medium",
814
826
  showCloseButton: o = !0,
815
- closeOnOverlayClick: r = !0
827
+ closeOnOverlayClick: i = !0
816
828
  }) => {
817
829
  const [c, p] = T(!1), m = e !== void 0 ? e : c, f = t || (() => {
818
830
  p(!1);
819
831
  });
820
- D(() => {
821
- m && (s == null || s());
822
- }, [m, s]), D(() => {
832
+ I(() => {
833
+ m && (a == null || a());
834
+ }, [m, a]), I(() => {
823
835
  const N = (B) => {
824
836
  B.key === "Escape" && f();
825
837
  };
@@ -828,242 +840,242 @@ const K = ({
828
840
  };
829
841
  }, [m, f]);
830
842
  const u = (N) => {
831
- r && N.target === N.currentTarget && f();
832
- }, h = E.Children.toArray(n).find(
833
- (N) => se(N) && N.type.displayName === "Modal.Trigger"
834
- ), y = E.Children.toArray(n).filter(
835
- (N) => se(N) && N.type.displayName !== "Modal.Trigger"
836
- ), b = ["clarity-modal", l, `clarity-modal--${d}`].filter(Boolean).join(" ");
837
- return /* @__PURE__ */ w(be.Provider, { value: { onClose: f, variant: i, showCloseButton: o }, children: [
843
+ i && N.target === N.currentTarget && f();
844
+ }, h = L.Children.toArray(s).find(
845
+ (N) => ae(N) && N.type.displayName === "Modal.Trigger"
846
+ ), y = L.Children.toArray(s).filter(
847
+ (N) => ae(N) && N.type.displayName !== "Modal.Trigger"
848
+ ), b = ["clarity-modal", r, `clarity-modal--${d}`].filter(Boolean).join(" ");
849
+ return /* @__PURE__ */ w(ge.Provider, { value: { onClose: f, variant: l, showCloseButton: o }, children: [
838
850
  h && z(h, { onClick: () => p(!0) }),
839
- m && /* @__PURE__ */ a("div", { className: "clarity-modal-overlay", onClick: u, children: /* @__PURE__ */ a("div", { className: b, children: y }) })
851
+ m && /* @__PURE__ */ n("div", { className: "clarity-modal-overlay", onClick: u, children: /* @__PURE__ */ n("div", { className: b, children: y }) })
840
852
  ] });
841
853
  };
842
- K.Header = Ne;
843
- K.Content = we;
844
- K.Footer = _e;
845
- K.Trigger = ge;
846
- K.Close = $e;
847
- K.displayName = "Modal";
848
- const ke = Q(void 0), Vt = () => {
849
- const e = Z(ke);
854
+ Y.Header = $e;
855
+ Y.Content = ke;
856
+ Y.Footer = xe;
857
+ Y.Trigger = Te;
858
+ Y.Close = Be;
859
+ Y.displayName = "Modal";
860
+ const je = Q(void 0), zt = () => {
861
+ const e = U(je);
850
862
  if (!e)
851
863
  throw new Error("useToast must be used within a ToastProvider");
852
864
  return e;
853
- }, yt = ({ id: e, message: t, variant: s, duration: n, onClose: l, invertColors: i }) => {
865
+ }, gt = ({ id: e, message: t, variant: a, duration: s, onClose: r, invertColors: l }) => {
854
866
  const [d, o] = T("entering");
855
- D(() => {
867
+ I(() => {
856
868
  const c = setTimeout(() => {
857
869
  o("visible");
858
870
  }, 10), p = setTimeout(() => {
859
871
  o("exiting");
860
- }, n * 1e3 - 300), v = setTimeout(() => {
861
- l(e);
862
- }, n * 1e3);
872
+ }, s * 1e3 - 300), v = setTimeout(() => {
873
+ r(e);
874
+ }, s * 1e3);
863
875
  return () => {
864
876
  clearTimeout(c), clearTimeout(p), clearTimeout(v);
865
877
  };
866
- }, [e, n, l]);
867
- const r = [
878
+ }, [e, s, r]);
879
+ const i = [
868
880
  "cl-toast",
869
- s,
870
- i ? "colored-background" : "",
881
+ a,
882
+ l ? "colored-background" : "",
871
883
  `cl-toast-${d}`
872
884
  ].filter(Boolean).join(" ");
873
- return /* @__PURE__ */ w("div", { className: r, children: [
874
- /* @__PURE__ */ a("div", { className: "cl-toast-message", children: t }),
875
- /* @__PURE__ */ a("button", { onClick: () => o("exiting"), className: "cl-toast-close-button", children: "×" }),
876
- /* @__PURE__ */ a(
885
+ return /* @__PURE__ */ w("div", { className: i, children: [
886
+ /* @__PURE__ */ n("div", { className: "cl-toast-message", children: t }),
887
+ /* @__PURE__ */ n("button", { onClick: () => o("exiting"), className: "cl-toast-close-button", children: "×" }),
888
+ /* @__PURE__ */ n(
877
889
  "div",
878
890
  {
879
891
  className: "cl-toast-progress-bar",
880
- style: { animationDuration: `${n}s` }
892
+ style: { animationDuration: `${s}s` }
881
893
  }
882
894
  )
883
895
  ] });
884
- }, Ht = ({ children: e }) => {
885
- const [t, s] = T([]), n = te(() => {
896
+ }, Ut = ({ children: e }) => {
897
+ const [t, a] = T([]), s = te(() => {
886
898
  if (typeof document < "u") {
887
- const r = document.createElement("div");
888
- return r.id = "toast-portal-root", r;
899
+ const i = document.createElement("div");
900
+ return i.id = "toast-portal-root", i;
889
901
  }
890
902
  return null;
891
903
  }, []);
892
- D(() => {
893
- if (n)
894
- return document.body.appendChild(n), () => {
895
- document.body.removeChild(n);
904
+ I(() => {
905
+ if (s)
906
+ return document.body.appendChild(s), () => {
907
+ document.body.removeChild(s);
896
908
  };
897
- }, [n]);
898
- const l = ce((r) => {
909
+ }, [s]);
910
+ const r = de((i) => {
899
911
  const p = {
900
912
  id: (/* @__PURE__ */ new Date()).toISOString() + Math.random(),
901
913
  // duration: 5,
902
914
  // position: 'right-top',
903
- ...r
915
+ ...i
904
916
  };
905
- s((v) => {
917
+ a((v) => {
906
918
  const m = [p, ...v];
907
919
  return m.length > 4 ? m.slice(0, 4) : m;
908
920
  });
909
- }, []), i = ce((r) => {
910
- s((c) => c.filter((p) => p.id !== r));
911
- }, []), d = te(() => t.reduce((r, c) => (r[c.position] || (r[c.position] = []), r[c.position].push(c), r), {}), [t]), o = te(() => ({ show: l }), [l]);
912
- return /* @__PURE__ */ w(ke.Provider, { value: o, children: [
921
+ }, []), l = de((i) => {
922
+ a((c) => c.filter((p) => p.id !== i));
923
+ }, []), d = te(() => t.reduce((i, c) => (i[c.position] || (i[c.position] = []), i[c.position].push(c), i), {}), [t]), o = te(() => ({ show: r }), [r]);
924
+ return /* @__PURE__ */ w(je.Provider, { value: o, children: [
913
925
  e,
914
- n && mt.createPortal(
915
- Object.entries(d).map(([r, c]) => /* @__PURE__ */ a("div", { className: `cl-toast-container ${r}`, children: c.map((p) => /* @__PURE__ */ a(yt, { ...p, onClose: i }, p.id)) }, r)),
916
- n
926
+ s && vt.createPortal(
927
+ Object.entries(d).map(([i, c]) => /* @__PURE__ */ n("div", { className: `cl-toast-container ${i}`, children: c.map((p) => /* @__PURE__ */ n(gt, { ...p, onClose: l }, p.id)) }, i)),
928
+ s
917
929
  )
918
930
  ] });
919
- }, xe = Q(null), Te = () => {
920
- const e = Z(xe);
931
+ }, Le = Q(null), Ee = () => {
932
+ const e = U(Le);
921
933
  if (!e)
922
934
  throw new Error("useOffcanvas must be used within an Offcanvas provider");
923
935
  return e;
924
- }, Be = ({
936
+ }, Se = ({
925
937
  children: e,
926
938
  className: t = ""
927
939
  }) => {
928
- const { onClose: s, variant: n, showCloseButton: l, title: i } = Te(), d = [
940
+ const { onClose: a, variant: s, showCloseButton: r, title: l } = Ee(), d = [
929
941
  "clarity-offcanvas-header",
930
942
  t
931
943
  ].filter(Boolean).join(" "), o = [
932
944
  "clarity-offcanvas-close",
933
- n && `clarity-offcanvas-close--${n}`
934
- ].filter(Boolean).join(" "), r = [
945
+ s && `clarity-offcanvas-close--${s}`
946
+ ].filter(Boolean).join(" "), i = [
935
947
  "clarity-offcanvas-title",
936
- n && `clarity-offcanvas-title--${n}`
948
+ s && `clarity-offcanvas-title--${s}`
937
949
  ].filter(Boolean).join(" ");
938
950
  return /* @__PURE__ */ w("div", { className: d, children: [
939
- i && /* @__PURE__ */ a("h2", { className: r, children: i }),
951
+ l && /* @__PURE__ */ n("h2", { className: i, children: l }),
940
952
  e,
941
- l && /* @__PURE__ */ a("button", { className: o, onClick: (c) => {
942
- c.stopPropagation(), s();
953
+ r && /* @__PURE__ */ n("button", { className: o, onClick: (c) => {
954
+ c.stopPropagation(), a();
943
955
  }, children: "×" })
944
956
  ] });
945
957
  };
946
- Be.displayName = "Offcanvas.Header";
947
- const je = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-offcanvas-content ${t}`, children: e });
948
- je.displayName = "Offcanvas.Content";
949
- const Ee = ({ children: e, onClick: t, variant: s }) => z(e, {
950
- onClick: (n) => {
951
- var l, i;
952
- t == null || t(), (i = (l = e.props).onClick) == null || i.call(l, n);
958
+ Se.displayName = "Offcanvas.Header";
959
+ const Re = ({ children: e, className: t = "" }) => /* @__PURE__ */ n("div", { className: `clarity-offcanvas-content ${t}`, children: e });
960
+ Re.displayName = "Offcanvas.Content";
961
+ const Oe = ({ children: e, onClick: t, variant: a }) => z(e, {
962
+ onClick: (s) => {
963
+ var r, l;
964
+ t == null || t(), (l = (r = e.props).onClick) == null || l.call(r, s);
953
965
  },
954
- variant: s
966
+ variant: a
955
967
  });
956
- Ee.displayName = "Offcanvas.Trigger";
957
- const pe = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-offcanvas-footer ${t}`, children: e });
958
- pe.displayName = "Offcanvas.Footer";
959
- const Le = ({ children: e }) => {
960
- const { onClose: t } = Te();
968
+ Oe.displayName = "Offcanvas.Trigger";
969
+ const he = ({ children: e, className: t = "" }) => /* @__PURE__ */ n("div", { className: `clarity-offcanvas-footer ${t}`, children: e });
970
+ he.displayName = "Offcanvas.Footer";
971
+ const Ie = ({ children: e }) => {
972
+ const { onClose: t } = Ee();
961
973
  return z(e, {
962
- onClick: (s) => {
963
- var n, l;
964
- t(), (l = (n = e.props).onClick) == null || l.call(n, s);
974
+ onClick: (a) => {
975
+ var s, r;
976
+ t(), (r = (s = e.props).onClick) == null || r.call(s, a);
965
977
  }
966
978
  });
967
979
  };
968
- Le.displayName = "Offcanvas.Close";
969
- const ae = ({
980
+ Ie.displayName = "Offcanvas.Close";
981
+ const se = ({
970
982
  isOpen: e,
971
983
  onClose: t,
972
- onOpen: s,
973
- children: n,
974
- className: l = "",
975
- variant: i,
984
+ onOpen: a,
985
+ children: s,
986
+ className: r = "",
987
+ variant: l,
976
988
  placement: d = "right",
977
989
  closeOnOverlayClick: o = !0,
978
- showCloseButton: r = !0,
990
+ showCloseButton: i = !0,
979
991
  title: c
980
992
  }) => {
981
- const [p, v] = T(!1), [m, f] = T(!1), [u, h] = T(!1), y = e !== void 0, b = y ? e : p, N = ce(() => {
993
+ const [p, v] = T(!1), [m, f] = T(!1), [u, h] = T(!1), y = e !== void 0, b = y ? e : p, N = de(() => {
982
994
  t ? t() : v(!1);
983
- }, [t]), B = ce(() => {
984
- y || v(!0), s == null || s();
985
- }, [y, s]);
986
- D(() => {
995
+ }, [t]), B = de(() => {
996
+ y || v(!0), a == null || a();
997
+ }, [y, a]);
998
+ I(() => {
987
999
  if (b) {
988
1000
  h(!0);
989
- const g = setTimeout(() => {
1001
+ const _ = setTimeout(() => {
990
1002
  f(!0);
991
1003
  }, 50);
992
- return () => clearTimeout(g);
1004
+ return () => clearTimeout(_);
993
1005
  } else {
994
1006
  f(!1);
995
- const g = setTimeout(() => {
1007
+ const _ = setTimeout(() => {
996
1008
  h(!1);
997
1009
  }, 300);
998
- return () => clearTimeout(g);
1010
+ return () => clearTimeout(_);
999
1011
  }
1000
- }, [b]), D(() => {
1001
- const g = (V) => {
1012
+ }, [b]), I(() => {
1013
+ const _ = (V) => {
1002
1014
  V.key === "Escape" && N();
1003
1015
  };
1004
- return b ? (document.addEventListener("keydown", g), document.body.style.overflow = "hidden") : (document.removeEventListener("keydown", g), document.body.style.overflow = "unset"), () => {
1005
- document.removeEventListener("keydown", g), document.body.style.overflow = "unset";
1016
+ return b ? (document.addEventListener("keydown", _), document.body.style.overflow = "hidden") : (document.removeEventListener("keydown", _), document.body.style.overflow = "unset"), () => {
1017
+ document.removeEventListener("keydown", _), document.body.style.overflow = "unset";
1006
1018
  };
1007
1019
  }, [b, N]);
1008
- const x = (g) => {
1009
- o && g.target === g.currentTarget && N();
1010
- }, _ = E.Children.toArray(n);
1011
- let $, L, k, j, I;
1012
- _.forEach((g) => {
1013
- if (se(g))
1014
- if (g.type.displayName === "Offcanvas.Trigger")
1015
- $ = g;
1016
- else if (g.type.displayName === "Offcanvas.Header")
1017
- L = g;
1018
- else if (g.type.displayName === "Offcanvas.Content") {
1019
- k = g;
1020
- const H = E.Children.toArray(k.props.children).filter((W) => se(W) && W.type.displayName === "Offcanvas.Close" ? (I = W, !1) : !0);
1021
- k = z(k, { children: H });
1022
- } else g.type.displayName === "Offcanvas.Footer" && (j = g);
1023
- }), I && (j ? j = z(j, {
1024
- children: /* @__PURE__ */ w(ot, { children: [
1020
+ const x = (_) => {
1021
+ o && _.target === _.currentTarget && N();
1022
+ }, g = L.Children.toArray(s);
1023
+ let $, E, k, j, S;
1024
+ g.forEach((_) => {
1025
+ if (ae(_))
1026
+ if (_.type.displayName === "Offcanvas.Trigger")
1027
+ $ = _;
1028
+ else if (_.type.displayName === "Offcanvas.Header")
1029
+ E = _;
1030
+ else if (_.type.displayName === "Offcanvas.Content") {
1031
+ k = _;
1032
+ const P = L.Children.toArray(k.props.children).filter((M) => ae(M) && M.type.displayName === "Offcanvas.Close" ? (S = M, !1) : !0);
1033
+ k = z(k, { children: P });
1034
+ } else _.type.displayName === "Offcanvas.Footer" && (j = _);
1035
+ }), S && (j ? j = z(j, {
1036
+ children: /* @__PURE__ */ w(ft, { children: [
1025
1037
  j.props.children,
1026
- I
1038
+ S
1027
1039
  ] })
1028
- }) : j = /* @__PURE__ */ a(pe, { children: I }));
1040
+ }) : j = /* @__PURE__ */ n(he, { children: S }));
1029
1041
  const A = [
1030
1042
  "clarity-offcanvas",
1031
- l,
1043
+ r,
1032
1044
  `clarity-offcanvas--${d}`,
1033
- i && `clarity-offcanvas--${i}`,
1045
+ l && `clarity-offcanvas--${l}`,
1034
1046
  m ? "clarity-offcanvas--open" : "clarity-offcanvas--closed"
1035
- ].filter(Boolean).join(" "), O = [
1047
+ ].filter(Boolean).join(" "), R = [
1036
1048
  "clarity-offcanvas-overlay",
1037
1049
  m ? "clarity-offcanvas-overlay--visible" : ""
1038
1050
  ].filter(Boolean).join(" ");
1039
- return /* @__PURE__ */ w(xe.Provider, { value: { onClose: N, variant: i, showCloseButton: r, placement: d, title: c }, children: [
1040
- $ && z($, { onClick: B, variant: i }),
1051
+ return /* @__PURE__ */ w(Le.Provider, { value: { onClose: N, variant: l, showCloseButton: i, placement: d, title: c }, children: [
1052
+ $ && z($, { onClick: B, variant: l }),
1041
1053
  u && // Only render if shouldRender is true
1042
- /* @__PURE__ */ a("div", { className: O, onClick: x, children: /* @__PURE__ */ w("div", { className: A, children: [
1043
- L,
1054
+ /* @__PURE__ */ n("div", { className: R, onClick: x, children: /* @__PURE__ */ w("div", { className: A, children: [
1055
+ E,
1044
1056
  k,
1045
- j && /* @__PURE__ */ a("div", { className: "clarity-offcanvas-scroll-indicator" }),
1057
+ j && /* @__PURE__ */ n("div", { className: "clarity-offcanvas-scroll-indicator" }),
1046
1058
  " ",
1047
1059
  j
1048
1060
  ] }) })
1049
1061
  ] });
1050
1062
  };
1051
- ae.Header = Be;
1052
- ae.Content = je;
1053
- ae.Footer = pe;
1054
- ae.Trigger = Ee;
1055
- ae.Close = Le;
1056
- ae.displayName = "Offcanvas";
1057
- const vt = E.forwardRef(({
1063
+ se.Header = Se;
1064
+ se.Content = Re;
1065
+ se.Footer = he;
1066
+ se.Trigger = Oe;
1067
+ se.Close = Ie;
1068
+ se.displayName = "Offcanvas";
1069
+ const _t = L.forwardRef(({
1058
1070
  type: e,
1059
1071
  variant: t = "primary",
1060
- size: s = "medium",
1061
- label: n,
1062
- helperText: l,
1063
- error: i = !1,
1072
+ size: a = "medium",
1073
+ label: s,
1074
+ helperText: r,
1075
+ error: l = !1,
1064
1076
  errorMessage: d,
1065
1077
  labelPosition: o = "right",
1066
- className: r = "",
1078
+ className: i = "",
1067
1079
  disabled: c = !1,
1068
1080
  checked: p,
1069
1081
  id: v,
@@ -1073,23 +1085,23 @@ const vt = E.forwardRef(({
1073
1085
  "clarity-check-input-wrapper",
1074
1086
  `clarity-check-input-wrapper--${o}`,
1075
1087
  c && "clarity-check-input-wrapper--disabled",
1076
- i && "clarity-check-input-wrapper--error"
1088
+ l && "clarity-check-input-wrapper--error"
1077
1089
  ].filter(Boolean).join(" "), y = [
1078
1090
  "clarity-check-input",
1079
1091
  `clarity-check-input--${e}`,
1080
- `clarity-check-input--${s}`,
1092
+ `clarity-check-input--${a}`,
1081
1093
  t && `clarity-check-input--${t}`,
1082
- i && "clarity-check-input--error",
1094
+ l && "clarity-check-input--error",
1083
1095
  c && "clarity-check-input--disabled",
1084
- r
1096
+ i
1085
1097
  ].filter(Boolean).join(" "), b = [
1086
1098
  "clarity-check-input__label",
1087
- `clarity-check-input__label--${s}`,
1099
+ `clarity-check-input__label--${a}`,
1088
1100
  c && "clarity-check-input__label--disabled"
1089
1101
  ].filter(Boolean).join(" ");
1090
1102
  return /* @__PURE__ */ w("div", { className: "clarity-check-input-container", children: [
1091
1103
  /* @__PURE__ */ w("label", { className: h, htmlFor: u, children: [
1092
- /* @__PURE__ */ a(
1104
+ /* @__PURE__ */ n(
1093
1105
  "input",
1094
1106
  {
1095
1107
  ref: f,
@@ -1102,14 +1114,14 @@ const vt = E.forwardRef(({
1102
1114
  }
1103
1115
  ),
1104
1116
  /* @__PURE__ */ w("div", { className: "clarity-check-input__custom", children: [
1105
- e === "checkbox" && /* @__PURE__ */ a(
1117
+ e === "checkbox" && /* @__PURE__ */ n(
1106
1118
  "svg",
1107
1119
  {
1108
1120
  className: "clarity-check-input__icon",
1109
1121
  viewBox: "0 0 16 16",
1110
1122
  fill: "none",
1111
1123
  xmlns: "http://www.w3.org/2000/svg",
1112
- children: /* @__PURE__ */ a(
1124
+ children: /* @__PURE__ */ n(
1113
1125
  "path",
1114
1126
  {
1115
1127
  d: "M13.5 4.5L6 12L2.5 8.5",
@@ -1121,24 +1133,24 @@ const vt = E.forwardRef(({
1121
1133
  )
1122
1134
  }
1123
1135
  ),
1124
- e === "radio" && /* @__PURE__ */ a("div", { className: "clarity-check-input__radio-dot" })
1136
+ e === "radio" && /* @__PURE__ */ n("div", { className: "clarity-check-input__radio-dot" })
1125
1137
  ] }),
1126
- n && /* @__PURE__ */ a("span", { className: b, children: n })
1138
+ s && /* @__PURE__ */ n("span", { className: b, children: s })
1127
1139
  ] }),
1128
- (l || i && d) && /* @__PURE__ */ a("div", { className: "clarity-check-input__helper-text", children: i && d ? d : l })
1140
+ (r || l && d) && /* @__PURE__ */ n("div", { className: "clarity-check-input__helper-text", children: l && d ? d : r })
1129
1141
  ] });
1130
1142
  });
1131
- vt.displayName = "CheckInput";
1132
- const bt = E.forwardRef(({
1143
+ _t.displayName = "CheckInput";
1144
+ const $t = L.forwardRef(({
1133
1145
  variant: e = "primary",
1134
1146
  size: t = "medium",
1135
- label: s,
1136
- helperText: n,
1137
- error: l = !1,
1138
- errorMessage: i,
1147
+ label: a,
1148
+ helperText: s,
1149
+ error: r = !1,
1150
+ errorMessage: l,
1139
1151
  labelPosition: d = "right",
1140
1152
  className: o = "",
1141
- disabled: r = !1,
1153
+ disabled: i = !1,
1142
1154
  checked: c,
1143
1155
  id: p,
1144
1156
  ...v
@@ -1146,131 +1158,131 @@ const bt = E.forwardRef(({
1146
1158
  const f = p || `input-switch-${Math.random().toString(36).substr(2, 9)}`, u = [
1147
1159
  "clarity-input-switch-wrapper",
1148
1160
  `clarity-input-switch-wrapper--${d}`,
1149
- r && "clarity-input-switch-wrapper--disabled",
1150
- l && "clarity-input-switch-wrapper--error"
1161
+ i && "clarity-input-switch-wrapper--disabled",
1162
+ r && "clarity-input-switch-wrapper--error"
1151
1163
  ].filter(Boolean).join(" "), h = [
1152
1164
  "clarity-input-switch",
1153
1165
  `clarity-input-switch--${t}`,
1154
1166
  e && `clarity-input-switch--${e}`,
1155
- l && "clarity-input-switch--error",
1156
- r && "clarity-input-switch--disabled",
1167
+ r && "clarity-input-switch--error",
1168
+ i && "clarity-input-switch--disabled",
1157
1169
  o
1158
1170
  ].filter(Boolean).join(" "), y = [
1159
1171
  "clarity-input-switch__label",
1160
1172
  `clarity-input-switch__label--${t}`,
1161
- r && "clarity-input-switch__label--disabled"
1173
+ i && "clarity-input-switch__label--disabled"
1162
1174
  ].filter(Boolean).join(" ");
1163
1175
  return /* @__PURE__ */ w("div", { className: "clarity-input-switch-container", children: [
1164
1176
  /* @__PURE__ */ w("label", { className: u, htmlFor: f, children: [
1165
- /* @__PURE__ */ a(
1177
+ /* @__PURE__ */ n(
1166
1178
  "input",
1167
1179
  {
1168
1180
  ref: m,
1169
1181
  id: f,
1170
1182
  type: "checkbox",
1171
1183
  className: h,
1172
- disabled: r,
1184
+ disabled: i,
1173
1185
  checked: c,
1174
1186
  ...v
1175
1187
  }
1176
1188
  ),
1177
- /* @__PURE__ */ a("div", { className: "clarity-input-switch__track", children: /* @__PURE__ */ a("div", { className: "clarity-input-switch__thumb" }) }),
1178
- s && /* @__PURE__ */ a("span", { className: y, children: s })
1189
+ /* @__PURE__ */ n("div", { className: "clarity-input-switch__track", children: /* @__PURE__ */ n("div", { className: "clarity-input-switch__thumb" }) }),
1190
+ a && /* @__PURE__ */ n("span", { className: y, children: a })
1179
1191
  ] }),
1180
- (n || l && i) && /* @__PURE__ */ a("div", { className: "clarity-input-switch__helper-text", children: l && i ? i : n })
1192
+ (s || r && l) && /* @__PURE__ */ n("div", { className: "clarity-input-switch__helper-text", children: r && l ? l : s })
1181
1193
  ] });
1182
1194
  });
1183
- bt.displayName = "InputSwitch";
1184
- const Se = Q(null), fe = () => {
1185
- const e = Z(Se);
1195
+ $t.displayName = "InputSwitch";
1196
+ const De = Q(null), ye = () => {
1197
+ const e = U(De);
1186
1198
  if (!e)
1187
1199
  throw new Error("useConfirmationDialog must be used within a ConfirmationDialog provider");
1188
1200
  return e;
1189
- }, Oe = ({ children: e, className: t = "" }) => {
1190
- const { variant: s } = fe(), n = `clarity-confirmation-dialog-header ${t} clarity-confirmation-dialog-header--${s}`;
1191
- return /* @__PURE__ */ a("div", { className: n, children: e });
1201
+ }, Ae = ({ children: e, className: t = "" }) => {
1202
+ const { variant: a } = ye(), s = `clarity-confirmation-dialog-header ${t} clarity-confirmation-dialog-header--${a}`;
1203
+ return /* @__PURE__ */ n("div", { className: s, children: e });
1192
1204
  };
1193
- Oe.displayName = "ConfirmationDialog.Header";
1194
- const Ie = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-confirmation-dialog-content ${t}`, children: e });
1195
- Ie.displayName = "ConfirmationDialog.Content";
1196
- const Re = ({ children: e, className: t = "" }) => /* @__PURE__ */ a("div", { className: `clarity-confirmation-dialog-footer ${t}`, children: e });
1197
- Re.displayName = "ConfirmationDialog.Footer";
1198
- const De = ({ children: e }) => z(e, {
1205
+ Ae.displayName = "ConfirmationDialog.Header";
1206
+ const Pe = ({ children: e, className: t = "" }) => /* @__PURE__ */ n("div", { className: `clarity-confirmation-dialog-content ${t}`, children: e });
1207
+ Pe.displayName = "ConfirmationDialog.Content";
1208
+ const Ve = ({ children: e, className: t = "" }) => /* @__PURE__ */ n("div", { className: `clarity-confirmation-dialog-footer ${t}`, children: e });
1209
+ Ve.displayName = "ConfirmationDialog.Footer";
1210
+ const He = ({ children: e }) => z(e, {
1199
1211
  onClick: (t) => {
1200
- var s, n;
1201
- (n = (s = e.props).onClick) == null || n.call(s, t);
1212
+ var a, s;
1213
+ (s = (a = e.props).onClick) == null || s.call(a, t);
1202
1214
  }
1203
1215
  });
1204
- De.displayName = "ConfirmationDialog.Trigger";
1205
- const Ae = ({ children: e }) => {
1206
- const { onClose: t } = fe();
1216
+ He.displayName = "ConfirmationDialog.Trigger";
1217
+ const Me = ({ children: e }) => {
1218
+ const { onClose: t } = ye();
1207
1219
  return z(e, {
1208
- onClick: (s) => {
1209
- var n, l;
1210
- t(), (l = (n = e.props).onClick) == null || l.call(n, s);
1220
+ onClick: (a) => {
1221
+ var s, r;
1222
+ t(), (r = (s = e.props).onClick) == null || r.call(s, a);
1211
1223
  }
1212
1224
  });
1213
1225
  };
1214
- Ae.displayName = "ConfirmationDialog.Close";
1215
- const Pe = ({ children: e }) => {
1216
- const { onConfirm: t } = fe();
1226
+ Me.displayName = "ConfirmationDialog.Close";
1227
+ const We = ({ children: e }) => {
1228
+ const { onConfirm: t } = ye();
1217
1229
  return z(e, {
1218
- onClick: (s) => {
1219
- var n, l;
1220
- t(), (l = (n = e.props).onClick) == null || l.call(n, s);
1230
+ onClick: (a) => {
1231
+ var s, r;
1232
+ t(), (r = (s = e.props).onClick) == null || r.call(s, a);
1221
1233
  }
1222
1234
  });
1223
1235
  };
1224
- Pe.displayName = "ConfirmationDialog.Confirm";
1225
- const ee = ({
1236
+ We.displayName = "ConfirmationDialog.Confirm";
1237
+ const K = ({
1226
1238
  isOpen: e,
1227
1239
  onClose: t,
1228
- onConfirm: s,
1229
- variant: n = "clarity-primary",
1230
- children: l
1240
+ onConfirm: a,
1241
+ variant: s = "clarity-primary",
1242
+ children: r
1231
1243
  }) => {
1232
- const [i, d] = T(!1), o = e !== void 0, r = o ? e : i, c = () => {
1244
+ const [l, d] = T(!1), o = e !== void 0, i = o ? e : l, c = () => {
1233
1245
  o || d(!0);
1234
1246
  }, p = () => {
1235
1247
  t ? t() : d(!1);
1236
1248
  }, v = () => {
1237
- s && s(), p();
1249
+ a && a(), p();
1238
1250
  };
1239
- D(() => {
1251
+ I(() => {
1240
1252
  const h = (y) => {
1241
1253
  y.key === "Escape" && p();
1242
1254
  };
1243
- return r ? (document.addEventListener("keydown", h), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
1255
+ return i ? (document.addEventListener("keydown", h), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
1244
1256
  document.removeEventListener("keydown", h), document.body.style.overflow = "unset";
1245
1257
  };
1246
- }, [r, p]);
1247
- const m = E.Children.toArray(l).find(
1248
- (h) => se(h) && h.type.displayName === "ConfirmationDialog.Trigger"
1249
- ), f = E.Children.toArray(l).filter(
1250
- (h) => se(h) && h.type.displayName !== "ConfirmationDialog.Trigger"
1251
- ), u = `clarity-confirmation-dialog clarity-confirmation-dialog--${n}`;
1252
- return /* @__PURE__ */ w(Se.Provider, { value: { variant: n, onClose: p, onConfirm: v, onOpen: c }, children: [
1258
+ }, [i, p]);
1259
+ const m = L.Children.toArray(r).find(
1260
+ (h) => ae(h) && h.type.displayName === "ConfirmationDialog.Trigger"
1261
+ ), f = L.Children.toArray(r).filter(
1262
+ (h) => ae(h) && h.type.displayName !== "ConfirmationDialog.Trigger"
1263
+ ), u = `clarity-confirmation-dialog clarity-confirmation-dialog--${s}`;
1264
+ return /* @__PURE__ */ w(De.Provider, { value: { variant: s, onClose: p, onConfirm: v, onOpen: c }, children: [
1253
1265
  m,
1254
- r && /* @__PURE__ */ a("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ a("div", { className: u, children: f }) })
1266
+ i && /* @__PURE__ */ n("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ n("div", { className: u, children: f }) })
1255
1267
  ] });
1256
1268
  };
1257
- ee.Header = Oe;
1258
- ee.Content = Ie;
1259
- ee.Footer = Re;
1260
- ee.Trigger = De;
1261
- ee.Close = Ae;
1262
- ee.Confirm = Pe;
1263
- ee.displayName = "ConfirmationDialog";
1264
- const Mt = ({
1269
+ K.Header = Ae;
1270
+ K.Content = Pe;
1271
+ K.Footer = Ve;
1272
+ K.Trigger = He;
1273
+ K.Close = Me;
1274
+ K.Confirm = We;
1275
+ K.displayName = "ConfirmationDialog";
1276
+ const qt = ({
1265
1277
  variant: e = "primary",
1266
1278
  size: t = "medium",
1267
- disabled: s = !1,
1268
- loading: n = !1,
1269
- children: l,
1270
- onClick: i,
1279
+ disabled: a = !1,
1280
+ loading: s = !1,
1281
+ children: r,
1282
+ onClick: l,
1271
1283
  type: d = "button",
1272
1284
  className: o = "",
1273
- "aria-label": r,
1285
+ "aria-label": i,
1274
1286
  title: c,
1275
1287
  customColor: p,
1276
1288
  customColorHover: v,
@@ -1280,229 +1292,229 @@ const Mt = ({
1280
1292
  f,
1281
1293
  !p && `${f}--${e}`,
1282
1294
  `${f}--${t}`,
1283
- n && `${f}--loading`,
1284
- s && `${f}--disabled`,
1295
+ s && `${f}--loading`,
1296
+ a && `${f}--disabled`,
1285
1297
  o
1286
1298
  ].filter(Boolean).join(" "), h = {};
1287
1299
  return p && (h["--button-icon-bg"] = p, h["--button-icon-hover-bg"] = v || `${p}E6`), /* @__PURE__ */ w(
1288
1300
  "button",
1289
1301
  {
1290
1302
  className: u,
1291
- disabled: s || n,
1292
- onClick: i,
1303
+ disabled: a || s,
1304
+ onClick: l,
1293
1305
  type: d,
1294
- "aria-label": r,
1306
+ "aria-label": i,
1295
1307
  title: c,
1296
1308
  style: h,
1297
1309
  ...m,
1298
1310
  children: [
1299
- n && /* @__PURE__ */ a("div", { className: `${f}__spinner` }),
1300
- !n && l
1311
+ s && /* @__PURE__ */ n("div", { className: `${f}__spinner` }),
1312
+ !s && r
1301
1313
  ]
1302
1314
  }
1303
1315
  );
1304
- }, Wt = ({
1316
+ }, Jt = ({
1305
1317
  variant: e = "primary",
1306
1318
  product: t,
1307
- tone: s,
1308
- hoverTone: n,
1309
- size: l = "medium",
1310
- disabled: i = !1,
1319
+ tone: a,
1320
+ hoverTone: s,
1321
+ size: r = "medium",
1322
+ disabled: l = !1,
1311
1323
  children: d,
1312
1324
  onClick: o,
1313
- href: r,
1325
+ href: i,
1314
1326
  target: c,
1315
1327
  rel: p,
1316
1328
  className: v = "",
1317
1329
  ...m
1318
1330
  }) => {
1319
- const f = "clarity-button-link", u = t && s, h = u ? `${f}--custom` : `${f}--${e}`, y = [
1331
+ const f = "clarity-button-link", u = t && a, h = u ? `${f}--custom` : `${f}--${e}`, y = [
1320
1332
  f,
1321
1333
  h,
1322
- `${f}--${l}`,
1323
- i && `${f}--disabled`,
1334
+ `${f}--${r}`,
1335
+ l && `${f}--disabled`,
1324
1336
  v
1325
1337
  ].filter(Boolean).join(" "), b = (B) => {
1326
1338
  const x = parseInt(B);
1327
1339
  return x >= 800 ? "900" : x >= 700 ? "800" : x >= 600 ? "700" : x >= 500 ? "600" : x >= 400 ? "500" : x >= 300 ? "400" : x >= 200 ? "300" : "200";
1328
1340
  }, N = u ? {
1329
- "--custom-color": `var(--clarity-${t}-${s})`,
1330
- "--custom-hover-color": `var(--clarity-${t}-${n || b(s)})`
1341
+ "--custom-color": `var(--clarity-${t}-${a})`,
1342
+ "--custom-hover-color": `var(--clarity-${t}-${s || b(a)})`
1331
1343
  } : {};
1332
- return r ? /* @__PURE__ */ a(
1344
+ return i ? /* @__PURE__ */ n(
1333
1345
  "a",
1334
1346
  {
1335
- href: r,
1347
+ href: i,
1336
1348
  target: c,
1337
1349
  rel: p || (c === "_blank" ? "noopener noreferrer" : void 0),
1338
1350
  className: y,
1339
1351
  style: N,
1340
- onClick: i ? void 0 : o,
1352
+ onClick: l ? void 0 : o,
1341
1353
  ...m,
1342
1354
  children: d
1343
1355
  }
1344
- ) : /* @__PURE__ */ a(
1356
+ ) : /* @__PURE__ */ n(
1345
1357
  "button",
1346
1358
  {
1347
1359
  className: y,
1348
1360
  style: N,
1349
- disabled: i,
1361
+ disabled: l,
1350
1362
  onClick: o,
1351
1363
  ...m,
1352
1364
  children: d
1353
1365
  }
1354
1366
  );
1355
- }, Ve = Q(void 0), He = () => {
1356
- const e = Z(Ve);
1367
+ }, Fe = Q(void 0), Ge = () => {
1368
+ const e = U(Fe);
1357
1369
  if (!e)
1358
1370
  throw new Error("Accordion components must be used within an Accordion");
1359
1371
  return e;
1360
- }, Ct = ({
1372
+ }, kt = ({
1361
1373
  variant: e = "primary",
1362
1374
  product: t,
1363
- tone: s,
1364
- hoverTone: n,
1365
- defaultActiveKey: l,
1366
- alwaysOpen: i = !1,
1375
+ tone: a,
1376
+ hoverTone: s,
1377
+ defaultActiveKey: r,
1378
+ alwaysOpen: l = !1,
1367
1379
  flush: d = !1,
1368
1380
  className: o = "",
1369
- children: r,
1381
+ children: i,
1370
1382
  onSelect: c,
1371
1383
  ...p
1372
1384
  }) => {
1373
- const [v, m] = T(() => l ? Array.isArray(l) ? l : [l] : []), f = (_) => {
1385
+ const [v, m] = T(() => r ? Array.isArray(r) ? r : [r] : []), f = (g) => {
1374
1386
  let $;
1375
- i ? $ = v.includes(_) ? v.filter((L) => L !== _) : [...v, _] : $ = v.includes(_) ? [] : [_], m($), c && c(v.includes(_) ? null : _, {});
1376
- }, u = "clarity-accordion", h = t && s, y = h ? `${u}--custom` : `${u}--${e}`, b = [
1387
+ l ? $ = v.includes(g) ? v.filter((E) => E !== g) : [...v, g] : $ = v.includes(g) ? [] : [g], m($), c && c(v.includes(g) ? null : g, {});
1388
+ }, u = "clarity-accordion", h = t && a, y = h ? `${u}--custom` : `${u}--${e}`, b = [
1377
1389
  u,
1378
1390
  y,
1379
1391
  d && `${u}--flush`,
1380
1392
  o
1381
- ].filter(Boolean).join(" "), N = (_) => {
1382
- const $ = parseInt(_);
1393
+ ].filter(Boolean).join(" "), N = (g) => {
1394
+ const $ = parseInt(g);
1383
1395
  return $ >= 800 ? "900" : $ >= 700 ? "800" : $ >= 600 ? "700" : $ >= 500 ? "600" : $ >= 400 ? "500" : $ >= 300 ? "400" : $ >= 200 ? "300" : "200";
1384
1396
  }, B = h ? {
1385
- "--custom-border-color": `var(--clarity-${t}-${s})`,
1386
- "--custom-header-color": `var(--clarity-${t}-${s})`,
1387
- "--custom-hover-color": `var(--clarity-${t}-${n || N(s)})`
1397
+ "--custom-border-color": `var(--clarity-${t}-${a})`,
1398
+ "--custom-header-color": `var(--clarity-${t}-${a})`,
1399
+ "--custom-hover-color": `var(--clarity-${t}-${s || N(a)})`
1388
1400
  } : {}, x = {
1389
1401
  activeKeys: v,
1390
1402
  toggleItem: f,
1391
- alwaysOpen: i,
1403
+ alwaysOpen: l,
1392
1404
  variant: e,
1393
1405
  product: t,
1394
- tone: s,
1395
- hoverTone: n,
1406
+ tone: a,
1407
+ hoverTone: s,
1396
1408
  flush: d
1397
1409
  };
1398
- return /* @__PURE__ */ a(Ve.Provider, { value: x, children: /* @__PURE__ */ a("div", { className: b, style: B, ...p, children: r }) });
1399
- }, Nt = ({
1410
+ return /* @__PURE__ */ n(Fe.Provider, { value: x, children: /* @__PURE__ */ n("div", { className: b, style: B, ...p, children: i }) });
1411
+ }, xt = ({
1400
1412
  eventKey: e,
1401
1413
  disabled: t = !1,
1402
- className: s = "",
1403
- children: n,
1404
- ...l
1414
+ className: a = "",
1415
+ children: s,
1416
+ ...r
1405
1417
  }) => {
1406
- const { activeKeys: i } = He(), d = "clarity-accordion", o = i.includes(e), r = [
1418
+ const { activeKeys: l } = Ge(), d = "clarity-accordion", o = l.includes(e), i = [
1407
1419
  `${d}__item`,
1408
1420
  o && `${d}__item--active`,
1409
1421
  t && `${d}__item--disabled`,
1410
- s
1422
+ a
1411
1423
  ].filter(Boolean).join(" ");
1412
- return /* @__PURE__ */ a("div", { className: r, ...l, children: E.Children.map(n, (c) => E.isValidElement(c) ? E.cloneElement(c, {
1424
+ return /* @__PURE__ */ n("div", { className: i, ...r, children: L.Children.map(s, (c) => L.isValidElement(c) ? L.cloneElement(c, {
1413
1425
  ...c.props,
1414
1426
  eventKey: e,
1415
1427
  disabled: t,
1416
1428
  isActive: o
1417
1429
  }) : c) });
1418
- }, wt = ({
1430
+ }, Tt = ({
1419
1431
  className: e = "",
1420
1432
  children: t,
1421
- onClick: s,
1422
- eventKey: n,
1423
- disabled: l = !1,
1424
- isActive: i = !1,
1433
+ onClick: a,
1434
+ eventKey: s,
1435
+ disabled: r = !1,
1436
+ isActive: l = !1,
1425
1437
  ...d
1426
1438
  }) => {
1427
- const { toggleItem: o } = He(), r = "clarity-accordion", c = (p) => {
1428
- !l && n && o(n), s == null || s(p);
1439
+ const { toggleItem: o } = Ge(), i = "clarity-accordion", c = (p) => {
1440
+ !r && s && o(s), a == null || a(p);
1429
1441
  };
1430
1442
  return /* @__PURE__ */ w(
1431
1443
  "button",
1432
1444
  {
1433
- className: [`${r}__header`, e].filter(Boolean).join(" "),
1445
+ className: [`${i}__header`, e].filter(Boolean).join(" "),
1434
1446
  onClick: c,
1435
- disabled: l,
1436
- "aria-expanded": i,
1437
- "aria-controls": n ? `${r}-collapse-${n}` : void 0,
1447
+ disabled: r,
1448
+ "aria-expanded": l,
1449
+ "aria-controls": s ? `${i}-collapse-${s}` : void 0,
1438
1450
  ...d,
1439
1451
  children: [
1440
- /* @__PURE__ */ a("span", { className: `${r}__title`, children: t }),
1441
- /* @__PURE__ */ a("span", { className: `${r}__icon`, children: /* @__PURE__ */ a(
1452
+ /* @__PURE__ */ n("span", { className: `${i}__title`, children: t }),
1453
+ /* @__PURE__ */ n("span", { className: `${i}__icon`, children: /* @__PURE__ */ n(
1442
1454
  "svg",
1443
1455
  {
1444
1456
  width: "16",
1445
1457
  height: "16",
1446
1458
  viewBox: "0 0 16 16",
1447
1459
  fill: "currentColor",
1448
- className: i ? `${r}__icon--rotated` : "",
1449
- children: /* @__PURE__ */ a("path", { d: "M4.646 6.646a.5.5 0 0 1 .708 0L8 9.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z" })
1460
+ className: l ? `${i}__icon--rotated` : "",
1461
+ children: /* @__PURE__ */ n("path", { d: "M4.646 6.646a.5.5 0 0 1 .708 0L8 9.293l2.646-2.647a.5.5 0 0 1 .708.708l-3 3a.5.5 0 0 1-.708 0l-3-3a.5.5 0 0 1 0-.708z" })
1450
1462
  }
1451
1463
  ) })
1452
1464
  ]
1453
1465
  }
1454
1466
  );
1455
- }, _t = ({
1467
+ }, Bt = ({
1456
1468
  className: e = "",
1457
1469
  children: t,
1458
- eventKey: s,
1459
- isActive: n = !1,
1460
- ...l
1470
+ eventKey: a,
1471
+ isActive: s = !1,
1472
+ ...r
1461
1473
  }) => {
1462
- const i = "clarity-accordion";
1463
- return /* @__PURE__ */ a(
1474
+ const l = "clarity-accordion";
1475
+ return /* @__PURE__ */ n(
1464
1476
  "div",
1465
1477
  {
1466
- id: s ? `${i}-collapse-${s}` : void 0,
1478
+ id: a ? `${l}-collapse-${a}` : void 0,
1467
1479
  className: [
1468
- `${i}__collapse`,
1469
- n && `${i}__collapse--show`
1480
+ `${l}__collapse`,
1481
+ s && `${l}__collapse--show`
1470
1482
  ].filter(Boolean).join(" "),
1471
- children: /* @__PURE__ */ a("div", { className: [`${i}__body`, e].filter(Boolean).join(" "), ...l, children: t })
1483
+ children: /* @__PURE__ */ n("div", { className: [`${l}__body`, e].filter(Boolean).join(" "), ...r, children: t })
1472
1484
  }
1473
1485
  );
1474
- }, Ft = Object.assign(Ct, {
1475
- Item: Nt,
1476
- Header: wt,
1477
- Body: _t
1478
- }), Me = Q(
1486
+ }, Qt = Object.assign(kt, {
1487
+ Item: xt,
1488
+ Header: Tt,
1489
+ Body: Bt
1490
+ }), ze = Q(
1479
1491
  void 0
1480
- ), We = () => {
1481
- const e = Z(Me);
1492
+ ), Ue = () => {
1493
+ const e = U(ze);
1482
1494
  if (!e)
1483
1495
  throw new Error("useDropdown must be used within a DropdownProvider");
1484
1496
  return e;
1485
- }, gt = ({ children: e }) => {
1486
- const { setIsOpen: t, triggerRef: s } = We();
1487
- return /* @__PURE__ */ a(
1497
+ }, jt = ({ children: e }) => {
1498
+ const { setIsOpen: t, triggerRef: a } = Ue();
1499
+ return /* @__PURE__ */ n(
1488
1500
  "button",
1489
1501
  {
1490
1502
  type: "button",
1491
- ref: s,
1503
+ ref: a,
1492
1504
  className: "dropdown__trigger",
1493
- onClick: () => t((n) => !n),
1505
+ onClick: () => t((s) => !s),
1494
1506
  "aria-haspopup": "true",
1495
1507
  children: e
1496
1508
  }
1497
1509
  );
1498
- }, $t = ({ children: e }) => {
1499
- const { isOpen: t, contentRef: s, styles: n } = We();
1500
- return t ? /* @__PURE__ */ a("div", { ref: s, className: "dropdown__content", style: n, children: e }) : null;
1501
- }, kt = ({ children: e }) => /* @__PURE__ */ a("div", { className: "dropdown__menu", children: e }), xt = ({ as: e, children: t, ...s }) => /* @__PURE__ */ a(e || "a", { ...s, className: "dropdown__item", children: t }), Tt = () => /* @__PURE__ */ a("hr", { className: "dropdown__separator" }), oe = ({ title: e, position: t = "bottom", children: s }) => {
1502
- const [n, l] = T(!1), [i, d] = T({}), o = M(null), r = M(null), c = M(null);
1503
- return dt(() => {
1504
- if (n) {
1505
- const p = r.current, v = c.current;
1510
+ }, Lt = ({ children: e }) => {
1511
+ const { isOpen: t, contentRef: a, styles: s } = Ue();
1512
+ return t ? /* @__PURE__ */ n("div", { ref: a, className: "dropdown__content", style: s, children: e }) : null;
1513
+ }, Et = ({ children: e }) => /* @__PURE__ */ n("div", { className: "dropdown__menu", children: e }), St = ({ as: e, children: t, ...a }) => /* @__PURE__ */ n(e || "a", { ...a, className: "dropdown__item", children: t }), Rt = () => /* @__PURE__ */ n("hr", { className: "dropdown__separator" }), ce = ({ title: e, position: t = "bottom", children: a }) => {
1514
+ const [s, r] = T(!1), [l, d] = T({}), o = F(null), i = F(null), c = F(null);
1515
+ return yt(() => {
1516
+ if (s) {
1517
+ const p = i.current, v = c.current;
1506
1518
  if (!p || !v) return;
1507
1519
  const m = p.getBoundingClientRect(), f = v.getBoundingClientRect(), u = window.innerHeight, h = window.innerWidth;
1508
1520
  let y = t;
@@ -1525,108 +1537,108 @@ const Mt = ({
1525
1537
  }
1526
1538
  d(b);
1527
1539
  }
1528
- }, [n, t]), D(() => {
1540
+ }, [s, t]), I(() => {
1529
1541
  const p = (v) => {
1530
- o.current && !o.current.contains(v.target) && l(!1);
1542
+ o.current && !o.current.contains(v.target) && r(!1);
1531
1543
  };
1532
1544
  return document.addEventListener("mousedown", p), () => {
1533
1545
  document.removeEventListener("mousedown", p);
1534
1546
  };
1535
- }, []), /* @__PURE__ */ a(Me.Provider, { value: { isOpen: n, setIsOpen: l, triggerRef: r, contentRef: c, styles: i }, children: /* @__PURE__ */ a(
1547
+ }, []), /* @__PURE__ */ n(ze.Provider, { value: { isOpen: s, setIsOpen: r, triggerRef: i, contentRef: c, styles: l }, children: /* @__PURE__ */ n(
1536
1548
  "div",
1537
1549
  {
1538
1550
  ref: o,
1539
1551
  className: "dropdown",
1540
1552
  title: e,
1541
- children: s
1553
+ children: a
1542
1554
  }
1543
1555
  ) });
1544
1556
  };
1545
- oe.Trigger = gt;
1546
- oe.Content = $t;
1547
- oe.Menu = kt;
1548
- oe.Item = xt;
1549
- oe.Separator = Tt;
1550
- const Fe = Q(null), Ge = () => {
1551
- const e = Z(Fe);
1557
+ ce.Trigger = jt;
1558
+ ce.Content = Lt;
1559
+ ce.Menu = Et;
1560
+ ce.Item = St;
1561
+ ce.Separator = Rt;
1562
+ const qe = Q(null), Je = () => {
1563
+ const e = U(qe);
1552
1564
  if (!e)
1553
1565
  throw new Error("useTabs must be used within a Tabs provider");
1554
1566
  return e;
1555
- }, ze = ({ id: e, label: t, className: s = "" }) => {
1556
- const { activeTab: n, setActiveTab: l, variant: i, orientation: d } = Ge(), o = n === e, r = [
1567
+ }, Qe = ({ id: e, label: t, className: a = "" }) => {
1568
+ const { activeTab: s, setActiveTab: r, variant: l, orientation: d } = Je(), o = s === e, i = [
1557
1569
  "clarity-tab",
1558
- s,
1570
+ a,
1559
1571
  o ? "active" : "",
1560
- o ? `variant-${i}` : "",
1572
+ o ? `variant-${l}` : "",
1561
1573
  `orientation-${d}`
1562
1574
  ].filter(Boolean).join(" ");
1563
- return /* @__PURE__ */ a(
1575
+ return /* @__PURE__ */ n(
1564
1576
  "button",
1565
1577
  {
1566
- className: r,
1567
- onClick: () => l(e),
1578
+ className: i,
1579
+ onClick: () => r(e),
1568
1580
  role: "tab",
1569
1581
  "aria-selected": o,
1570
- children: /* @__PURE__ */ a("span", { className: "clarity-tab-label", children: t })
1582
+ children: /* @__PURE__ */ n("span", { className: "clarity-tab-label", children: t })
1571
1583
  }
1572
1584
  );
1573
1585
  };
1574
- ze.displayName = "Tabs.Tab";
1575
- const Ue = ({ id: e, children: t, className: s = "" }) => {
1576
- const { activeTab: n } = Ge(), l = n === e, i = {
1577
- visibility: l ? "visible" : "hidden",
1586
+ Qe.displayName = "Tabs.Tab";
1587
+ const Ze = ({ id: e, children: t, className: a = "" }) => {
1588
+ const { activeTab: s } = Je(), r = s === e, l = {
1589
+ visibility: r ? "visible" : "hidden",
1578
1590
  gridArea: "1 / 1"
1579
1591
  };
1580
- return l || (i.pointerEvents = "none"), /* @__PURE__ */ a("div", { className: `clarity-tab-content ${s}`, role: "tabpanel", style: i, children: t });
1592
+ return r || (l.pointerEvents = "none"), /* @__PURE__ */ n("div", { className: `clarity-tab-content ${a}`, role: "tabpanel", style: l, children: t });
1581
1593
  };
1582
- Ue.displayName = "Tabs.Content";
1583
- const he = ({
1594
+ Ze.displayName = "Tabs.Content";
1595
+ const ve = ({
1584
1596
  children: e,
1585
1597
  defaultTab: t,
1586
- variant: s = "primary",
1587
- orientation: n = "horizontal",
1588
- className: l = "",
1589
- useUrl: i = !1
1598
+ variant: a = "primary",
1599
+ orientation: s = "horizontal",
1600
+ className: r = "",
1601
+ useUrl: l = !1
1590
1602
  }) => {
1591
- const d = () => window.location.hash.replace("#", ""), [o, r] = T(() => i && d() || t);
1592
- D(() => {
1593
- if (i) {
1603
+ const d = () => window.location.hash.replace("#", ""), [o, i] = T(() => l && d() || t);
1604
+ I(() => {
1605
+ if (l) {
1594
1606
  const m = () => {
1595
1607
  const f = d();
1596
- f && r(f);
1608
+ f && i(f);
1597
1609
  };
1598
1610
  return window.addEventListener("hashchange", m), () => {
1599
1611
  window.removeEventListener("hashchange", m);
1600
1612
  };
1601
1613
  }
1602
- }, [i]);
1614
+ }, [l]);
1603
1615
  const c = (m) => {
1604
- i && (window.location.hash = String(m)), r(m);
1616
+ l && (window.location.hash = String(m)), i(m);
1605
1617
  }, p = te(() => ({
1606
1618
  activeTab: o,
1607
1619
  setActiveTab: c,
1608
- variant: s,
1609
- orientation: n
1610
- }), [o, s, n]), v = [
1620
+ variant: a,
1621
+ orientation: s
1622
+ }), [o, a, s]), v = [
1611
1623
  "clarity-tabs-container",
1612
- l,
1613
- `orientation-${n}`
1624
+ r,
1625
+ `orientation-${s}`
1614
1626
  ].filter(Boolean).join(" ");
1615
- return /* @__PURE__ */ a(Fe.Provider, { value: p, children: /* @__PURE__ */ a("div", { className: v, children: e }) });
1627
+ return /* @__PURE__ */ n(qe.Provider, { value: p, children: /* @__PURE__ */ n("div", { className: v, children: e }) });
1616
1628
  };
1617
- he.Tab = ze;
1618
- he.Content = Ue;
1619
- he.displayName = "Tabs";
1620
- const Gt = ({
1629
+ ve.Tab = Qe;
1630
+ ve.Content = Ze;
1631
+ ve.displayName = "Tabs";
1632
+ const Zt = ({
1621
1633
  content: e,
1622
1634
  position: t = "top",
1623
- variant: s = "primary",
1624
- product: n,
1625
- tone: l,
1626
- bgColor: i,
1635
+ variant: a = "primary",
1636
+ product: s,
1637
+ tone: r,
1638
+ bgColor: l,
1627
1639
  textColor: d,
1628
1640
  children: o,
1629
- className: r = "",
1641
+ className: i = "",
1630
1642
  disabled: c = !1,
1631
1643
  delay: p = 200,
1632
1644
  hideDelay: v = 100,
@@ -1634,242 +1646,242 @@ const Gt = ({
1634
1646
  arrow: f = !0,
1635
1647
  ...u
1636
1648
  }) => {
1637
- const [h, y] = T(!1), [b, N] = T(null), B = M(null), x = M(null), _ = "clarity-tooltip", $ = !!i, L = n && l && !$;
1649
+ const [h, y] = T(!1), [b, N] = T(null), B = F(null), x = F(null), g = "clarity-tooltip", $ = !!l, E = s && r && !$;
1638
1650
  let k = "";
1639
- $ ? k = `${_}__content--custom-bg` : L ? k = `${_}__content--custom` : k = `${_}__content--${s}`;
1651
+ $ ? k = `${g}__content--custom-bg` : E ? k = `${g}__content--custom` : k = `${g}__content--${a}`;
1640
1652
  const j = [
1641
- _,
1642
- `${_}--${t}`,
1643
- r
1644
- ].filter(Boolean).join(" "), I = [
1645
- `${_}__content`,
1653
+ g,
1654
+ `${g}--${t}`,
1655
+ i
1656
+ ].filter(Boolean).join(" "), S = [
1657
+ `${g}__content`,
1646
1658
  k,
1647
- f && `${_}__content--arrow`
1648
- ].filter(Boolean).join(" "), A = {}, O = {};
1649
- $ && i && (O["--tooltip-bg-color"] = i), d && (O["--tooltip-text-color"] = d), L && n && l && (O["--tooltip-product"] = n, O["--tooltip-tone"] = l);
1650
- const g = {
1659
+ f && `${g}__content--arrow`
1660
+ ].filter(Boolean).join(" "), A = {}, R = {};
1661
+ $ && l && (R["--tooltip-bg-color"] = l), d && (R["--tooltip-text-color"] = d), E && s && r && (R["--tooltip-product"] = s, R["--tooltip-tone"] = r);
1662
+ const _ = {
1651
1663
  ...A,
1652
- ...Object.keys(O).length > 0 ? O : {}
1664
+ ...Object.keys(R).length > 0 ? R : {}
1653
1665
  }, V = () => {
1654
1666
  if (c) return;
1655
1667
  b && clearTimeout(b);
1656
- const P = setTimeout(() => {
1668
+ const H = setTimeout(() => {
1657
1669
  y(!0);
1658
1670
  }, p);
1659
- N(P);
1660
- }, H = () => {
1671
+ N(H);
1672
+ }, P = () => {
1661
1673
  b && clearTimeout(b);
1662
- const P = setTimeout(() => {
1674
+ const H = setTimeout(() => {
1663
1675
  y(!1);
1664
1676
  }, v);
1665
- N(P);
1666
- }, W = () => {
1677
+ N(H);
1678
+ }, M = () => {
1667
1679
  c || y(!h);
1668
1680
  }, q = () => {
1669
1681
  c || V();
1670
- }, X = () => {
1671
- H();
1682
+ }, Z = () => {
1683
+ P();
1672
1684
  };
1673
- D(() => () => {
1685
+ I(() => () => {
1674
1686
  b && clearTimeout(b);
1675
1687
  }, [b]);
1676
- const F = {};
1677
- return m === "hover" ? (F.onMouseEnter = V, F.onMouseLeave = H) : m === "click" ? F.onClick = W : m === "focus" && (F.onFocus = q, F.onBlur = X), /* @__PURE__ */ w(
1688
+ const W = {};
1689
+ return m === "hover" ? (W.onMouseEnter = V, W.onMouseLeave = P) : m === "click" ? W.onClick = M : m === "focus" && (W.onFocus = q, W.onBlur = Z), /* @__PURE__ */ w(
1678
1690
  "div",
1679
1691
  {
1680
1692
  ref: x,
1681
- className: `${_}__trigger`,
1682
- ...F,
1693
+ className: `${g}__trigger`,
1694
+ ...W,
1683
1695
  ...u,
1684
1696
  children: [
1685
1697
  o,
1686
- h && /* @__PURE__ */ a(
1698
+ h && /* @__PURE__ */ n(
1687
1699
  "div",
1688
1700
  {
1689
1701
  ref: B,
1690
1702
  className: j,
1691
- style: g,
1703
+ style: _,
1692
1704
  role: "tooltip",
1693
1705
  "aria-hidden": !h,
1694
- children: /* @__PURE__ */ a("div", { className: I, children: e })
1706
+ children: /* @__PURE__ */ n("div", { className: S, children: e })
1695
1707
  }
1696
1708
  )
1697
1709
  ]
1698
1710
  }
1699
1711
  );
1700
- }, qe = Q(null), ne = () => {
1701
- const e = Z(qe);
1712
+ }, Xe = Q(null), ne = () => {
1713
+ const e = U(Xe);
1702
1714
  if (!e)
1703
1715
  throw new Error("useCommand must be used within a Command provider");
1704
1716
  return e;
1705
- }, Je = ({
1717
+ }, Ye = ({
1706
1718
  children: e,
1707
1719
  className: t = "",
1708
- variant: s = "secondary",
1709
- emptyText: n = "No results found.",
1710
- inputPlaceholder: l = "Search...",
1711
- ...i
1720
+ variant: a = "secondary",
1721
+ emptyText: s = "No results found.",
1722
+ inputPlaceholder: r = "Search...",
1723
+ ...l
1712
1724
  }) => {
1713
- const [d, o] = T(""), [r, c] = T(null), [p, v] = T(!1), m = [
1725
+ const [d, o] = T(""), [i, c] = T(null), [p, v] = T(!1), m = [
1714
1726
  "clarity-command",
1715
- `clarity-command--${s}`,
1727
+ `clarity-command--${a}`,
1716
1728
  t
1717
1729
  ].filter(Boolean).join(" "), f = te(() => ({
1718
1730
  searchTerm: d,
1719
1731
  setSearchTerm: o,
1720
- value: r,
1732
+ value: i,
1721
1733
  setValue: c,
1722
- variant: s,
1734
+ variant: a,
1723
1735
  texts: {
1724
- empty: n,
1725
- inputPlaceholder: l
1736
+ empty: s,
1737
+ inputPlaceholder: r
1726
1738
  },
1727
1739
  isOpen: p,
1728
1740
  setIsOpen: v
1729
- }), [d, r, s, n, l, p]);
1730
- return /* @__PURE__ */ a(qe.Provider, { value: f, children: /* @__PURE__ */ a("div", { className: m, ...i, children: e }) });
1741
+ }), [d, i, a, s, r, p]);
1742
+ return /* @__PURE__ */ n(Xe.Provider, { value: f, children: /* @__PURE__ */ n("div", { className: m, ...l, children: e }) });
1731
1743
  };
1732
- Je.displayName = "Command";
1733
- const Qe = ({ placeholder: e = "Search...", variant: t, onClick: s }) => {
1734
- const { setIsOpen: n, variant: l } = ne(), [i, d] = T(!1);
1735
- D(() => {
1744
+ Ye.displayName = "Command";
1745
+ const Ke = ({ placeholder: e = "Search...", variant: t, onClick: a }) => {
1746
+ const { setIsOpen: s, variant: r } = ne(), [l, d] = T(!1);
1747
+ I(() => {
1736
1748
  d(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
1737
1749
  }, []);
1738
- const r = [
1750
+ const i = [
1739
1751
  "clarity-command-button",
1740
- `clarity-command-button--${t || l}`
1752
+ `clarity-command-button--${t || r}`
1741
1753
  ].filter(Boolean).join(" ");
1742
- return /* @__PURE__ */ w("button", { className: r, onClick: (p) => {
1743
- n(!0), s == null || s(p);
1754
+ return /* @__PURE__ */ w("button", { className: i, onClick: (p) => {
1755
+ s(!0), a == null || a(p);
1744
1756
  }, children: [
1745
- /* @__PURE__ */ a("span", { children: e }),
1757
+ /* @__PURE__ */ n("span", { children: e }),
1746
1758
  /* @__PURE__ */ w("kbd", { className: "clarity-command-shortcut", children: [
1747
- i ? "⌘" : "Ctrl+",
1759
+ l ? "⌘" : "Ctrl+",
1748
1760
  "K"
1749
1761
  ] })
1750
1762
  ] });
1751
1763
  };
1752
- Qe.displayName = "Command.Button";
1753
- const Ze = ({ children: e, ...t }) => {
1754
- const { isOpen: s, setIsOpen: n, variant: l } = ne();
1755
- return D(() => {
1756
- const i = (d) => {
1757
- d.key === "k" && (d.metaKey || d.ctrlKey) && (d.preventDefault(), n(!s));
1764
+ Ke.displayName = "Command.Button";
1765
+ const et = ({ children: e, ...t }) => {
1766
+ const { isOpen: a, setIsOpen: s, variant: r } = ne();
1767
+ return I(() => {
1768
+ const l = (d) => {
1769
+ d.key === "k" && (d.metaKey || d.ctrlKey) && (d.preventDefault(), s(!a));
1758
1770
  };
1759
- return document.addEventListener("keydown", i), () => document.removeEventListener("keydown", i);
1760
- }, [s, n]), /* @__PURE__ */ a(K, { isOpen: s, onClose: () => n(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ a("div", { className: `clarity-command--${l}`, children: e }) });
1771
+ return document.addEventListener("keydown", l), () => document.removeEventListener("keydown", l);
1772
+ }, [a, s]), /* @__PURE__ */ n(Y, { isOpen: a, onClose: () => s(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ n("div", { className: `clarity-command--${r}`, children: e }) });
1761
1773
  };
1762
- Ze.displayName = "Command.Dialog";
1763
- const Xe = ({ className: e = "", ...t }) => {
1764
- const { searchTerm: s, setSearchTerm: n, variant: l, texts: i, isOpen: d } = ne(), o = M(null);
1765
- D(() => {
1774
+ et.displayName = "Command.Dialog";
1775
+ const tt = ({ className: e = "", ...t }) => {
1776
+ const { searchTerm: a, setSearchTerm: s, variant: r, texts: l, isOpen: d } = ne(), o = F(null);
1777
+ I(() => {
1766
1778
  var c;
1767
1779
  d && ((c = o.current) == null || c.focus());
1768
1780
  }, [d]);
1769
- const r = [
1781
+ const i = [
1770
1782
  "clarity-command-input",
1771
- `clarity-command-input--${l}`,
1783
+ `clarity-command-input--${r}`,
1772
1784
  e
1773
1785
  ].filter(Boolean).join(" ");
1774
- return /* @__PURE__ */ a("div", { className: "clarity-command-input__wrapper", children: /* @__PURE__ */ a(
1786
+ return /* @__PURE__ */ n("div", { className: "clarity-command-input__wrapper", children: /* @__PURE__ */ n(
1775
1787
  "input",
1776
1788
  {
1777
1789
  ref: o,
1778
- className: r,
1779
- value: s,
1780
- onChange: (c) => n(c.target.value),
1781
- placeholder: t.placeholder || i.inputPlaceholder,
1790
+ className: i,
1791
+ value: a,
1792
+ onChange: (c) => s(c.target.value),
1793
+ placeholder: t.placeholder || l.inputPlaceholder,
1782
1794
  ...t
1783
1795
  }
1784
1796
  ) });
1785
1797
  };
1786
- Xe.displayName = "Command.Input";
1787
- const Ye = ({ children: e, className: t = "", ...s }) => {
1788
- const { searchTerm: n } = ne();
1789
- let l = !1;
1790
- const i = (r) => E.Children.toArray(r).map((c) => {
1798
+ tt.displayName = "Command.Input";
1799
+ const at = ({ children: e, className: t = "", ...a }) => {
1800
+ const { searchTerm: s } = ne();
1801
+ let r = !1;
1802
+ const l = (i) => L.Children.toArray(i).map((c) => {
1791
1803
  var v;
1792
- if (!E.isValidElement(c)) return c;
1804
+ if (!L.isValidElement(c)) return c;
1793
1805
  const p = c.type.displayName;
1794
1806
  if (p === "Command.Empty")
1795
1807
  return null;
1796
1808
  if (p === "Command.Item")
1797
- return (((v = c.props.children) == null ? void 0 : v.toString().toLowerCase()) || "").includes(n.toLowerCase()) ? (l = !0, c) : null;
1809
+ return (((v = c.props.children) == null ? void 0 : v.toString().toLowerCase()) || "").includes(s.toLowerCase()) ? (r = !0, c) : null;
1798
1810
  if (p === "Command.Group") {
1799
- const m = i(c.props.children);
1800
- return E.Children.toArray(m).some((u) => E.isValidElement(u) && u.type.displayName === "Command.Item") ? E.cloneElement(c, { ...c.props, children: m }) : null;
1811
+ const m = l(c.props.children);
1812
+ return L.Children.toArray(m).some((u) => L.isValidElement(u) && u.type.displayName === "Command.Item") ? L.cloneElement(c, { ...c.props, children: m }) : null;
1801
1813
  }
1802
1814
  return c;
1803
- }).filter(Boolean), d = i(e), o = ["clarity-command-list", t].filter(Boolean).join(" ");
1804
- return /* @__PURE__ */ w("div", { className: o, ...s, children: [
1815
+ }).filter(Boolean), d = l(e), o = ["clarity-command-list", t].filter(Boolean).join(" ");
1816
+ return /* @__PURE__ */ w("div", { className: o, ...a, children: [
1805
1817
  d,
1806
- !l && /* @__PURE__ */ a(ye, {})
1818
+ !r && /* @__PURE__ */ n(be, {})
1807
1819
  ] });
1808
1820
  };
1809
- Ye.displayName = "Command.List";
1810
- const ye = ({ children: e, className: t = "", ...s }) => {
1811
- const { texts: n } = ne(), l = ["clarity-command-empty", t].filter(Boolean).join(" ");
1812
- return /* @__PURE__ */ a("div", { className: l, ...s, children: e || s.emptyText || n.empty });
1821
+ at.displayName = "Command.List";
1822
+ const be = ({ children: e, className: t = "", ...a }) => {
1823
+ const { texts: s } = ne(), r = ["clarity-command-empty", t].filter(Boolean).join(" ");
1824
+ return /* @__PURE__ */ n("div", { className: r, ...a, children: e || a.emptyText || s.empty });
1813
1825
  };
1814
- ye.displayName = "Command.Empty";
1815
- const Ke = ({ children: e, className: t = "", ...s }) => {
1816
- const n = ["clarity-command-group", t].filter(Boolean).join(" ");
1817
- return /* @__PURE__ */ a("div", { className: n, ...s, children: e });
1826
+ be.displayName = "Command.Empty";
1827
+ const st = ({ children: e, className: t = "", ...a }) => {
1828
+ const s = ["clarity-command-group", t].filter(Boolean).join(" ");
1829
+ return /* @__PURE__ */ n("div", { className: s, ...a, children: e });
1818
1830
  };
1819
- Ke.displayName = "Command.Group";
1820
- const et = ({ children: e, className: t = "", ...s }) => {
1821
- const { setValue: n, variant: l } = ne(), i = ["clarity-command-item", `clarity-command-item--${l}`, t].filter(Boolean).join(" ");
1822
- return /* @__PURE__ */ a("div", { className: i, onClick: () => n((e == null ? void 0 : e.toString()) || ""), ...s, children: e });
1831
+ st.displayName = "Command.Group";
1832
+ const nt = ({ children: e, className: t = "", ...a }) => {
1833
+ const { setValue: s, variant: r } = ne(), l = ["clarity-command-item", `clarity-command-item--${r}`, t].filter(Boolean).join(" ");
1834
+ return /* @__PURE__ */ n("div", { className: l, onClick: () => s((e == null ? void 0 : e.toString()) || ""), ...a, children: e });
1823
1835
  };
1824
- et.displayName = "Command.Item";
1825
- const tt = ({ className: e = "", ...t }) => {
1826
- const s = ["clarity-command-separator", e].filter(Boolean).join(" ");
1827
- return /* @__PURE__ */ a("hr", { className: s, ...t });
1836
+ nt.displayName = "Command.Item";
1837
+ const rt = ({ className: e = "", ...t }) => {
1838
+ const a = ["clarity-command-separator", e].filter(Boolean).join(" ");
1839
+ return /* @__PURE__ */ n("hr", { className: a, ...t });
1828
1840
  };
1829
- tt.displayName = "Command.Separator";
1830
- const st = ({ children: e, className: t = "", ...s }) => {
1831
- const n = ["clarity-command-shortcut", t].filter(Boolean).join(" ");
1832
- return /* @__PURE__ */ a("span", { className: n, ...s, children: e });
1841
+ rt.displayName = "Command.Separator";
1842
+ const lt = ({ children: e, className: t = "", ...a }) => {
1843
+ const s = ["clarity-command-shortcut", t].filter(Boolean).join(" ");
1844
+ return /* @__PURE__ */ n("span", { className: s, ...a, children: e });
1833
1845
  };
1834
- st.displayName = "Command.Shortcut";
1835
- const zt = Object.assign(Je, {
1836
- Button: Qe,
1837
- Dialog: Ze,
1838
- Input: Xe,
1839
- List: Ye,
1840
- Empty: ye,
1841
- Group: Ke,
1842
- Item: et,
1843
- Separator: tt,
1844
- Shortcut: st
1845
- }), Bt = ({ columns: e, viewMode: t }) => {
1846
- const s = Array.from({ length: 5 }, (n, l) => l);
1846
+ lt.displayName = "Command.Shortcut";
1847
+ const Xt = Object.assign(Ye, {
1848
+ Button: Ke,
1849
+ Dialog: et,
1850
+ Input: tt,
1851
+ List: at,
1852
+ Empty: be,
1853
+ Group: st,
1854
+ Item: nt,
1855
+ Separator: rt,
1856
+ Shortcut: lt
1857
+ }), Ot = ({ columns: e, viewMode: t }) => {
1858
+ const a = Array.from({ length: 5 }, (s, r) => r);
1847
1859
  return t === "card" ? /* @__PURE__ */ w("div", { className: "card-view-wrapper is-loading", children: [
1848
- /* @__PURE__ */ a("div", { className: "skeleton card-view-header" }),
1849
- /* @__PURE__ */ a("div", { className: "card-view-body", children: s.map((n) => /* @__PURE__ */ a("div", { className: "skeleton card-view-row" }, n)) })
1850
- ] }) : /* @__PURE__ */ a("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ w("table", { children: [
1851
- /* @__PURE__ */ a("thead", { children: /* @__PURE__ */ a("tr", { className: "table-row", children: e.map((n) => /* @__PURE__ */ a("th", { className: "table-header-cell", children: /* @__PURE__ */ a("div", { className: "skeleton skeleton-text" }) }, n.key)) }) }),
1852
- /* @__PURE__ */ a("tbody", { children: s.map((n) => /* @__PURE__ */ a("tr", { className: "table-row", children: e.map((l) => /* @__PURE__ */ a("td", { className: "table-cell", children: /* @__PURE__ */ a("div", { className: "skeleton skeleton-text" }) }, l.key)) }, n)) })
1860
+ /* @__PURE__ */ n("div", { className: "skeleton card-view-header" }),
1861
+ /* @__PURE__ */ n("div", { className: "card-view-body", children: a.map((s) => /* @__PURE__ */ n("div", { className: "skeleton card-view-row" }, s)) })
1862
+ ] }) : /* @__PURE__ */ n("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ w("table", { children: [
1863
+ /* @__PURE__ */ n("thead", { children: /* @__PURE__ */ n("tr", { className: "table-row", children: e.map((s) => /* @__PURE__ */ n("th", { className: "table-header-cell", children: /* @__PURE__ */ n("div", { className: "skeleton skeleton-text" }) }, s.key)) }) }),
1864
+ /* @__PURE__ */ n("tbody", { children: a.map((s) => /* @__PURE__ */ n("tr", { className: "table-row", children: e.map((r) => /* @__PURE__ */ n("td", { className: "table-cell", children: /* @__PURE__ */ n("div", { className: "skeleton skeleton-text" }) }, r.key)) }, s)) })
1853
1865
  ] }) });
1854
- }, Ut = ({
1866
+ }, Yt = ({
1855
1867
  variant: e = "secondary",
1856
1868
  columns: t,
1857
- data: s,
1858
- viewMode: n = "table",
1859
- isScrollable: l = !1,
1860
- isLoading: i = !1
1869
+ data: a,
1870
+ viewMode: s = "table",
1871
+ isScrollable: r = !1,
1872
+ isLoading: l = !1
1861
1873
  }) => {
1862
- const [d, o] = T(null), [r, c] = T("none"), p = (u) => {
1874
+ const [d, o] = T(null), [i, c] = T("none"), p = (u) => {
1863
1875
  u.sortable && (d === u.key ? c((h) => h === "asc" ? "desc" : h === "desc" ? "none" : "asc") : (o(u.key), c("asc")));
1864
- }, v = te(() => r === "none" || !d ? s : [...s].sort((u, h) => {
1876
+ }, v = te(() => i === "none" || !d ? a : [...a].sort((u, h) => {
1865
1877
  const y = u[d], b = h[d];
1866
- return y < b ? r === "asc" ? -1 : 1 : y > b ? r === "asc" ? 1 : -1 : 0;
1867
- }), [s, d, r]), m = (u) => u.sortable ? d !== u.key || r === "none" ? /* @__PURE__ */ a("span", { className: "sort-icon", children: "↕" }) : r === "asc" ? /* @__PURE__ */ a("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ a("span", { className: "sort-icon", children: "↓" }) : null;
1868
- if (i)
1869
- return /* @__PURE__ */ a(Bt, { columns: t, viewMode: n });
1870
- const f = `table-variant-${e} ${l ? "is-scrollable" : ""}`;
1871
- return n === "card" ? /* @__PURE__ */ w("div", { className: `card-view-wrapper ${f}`, children: [
1872
- /* @__PURE__ */ a("div", { className: `card-view-header table-header-cell-${e}`, children: t.map((u) => /* @__PURE__ */ w(
1878
+ return y < b ? i === "asc" ? -1 : 1 : y > b ? i === "asc" ? 1 : -1 : 0;
1879
+ }), [a, d, i]), m = (u) => u.sortable ? d !== u.key || i === "none" ? /* @__PURE__ */ n("span", { className: "sort-icon", children: "↕" }) : i === "asc" ? /* @__PURE__ */ n("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ n("span", { className: "sort-icon", children: "↓" }) : null;
1880
+ if (l)
1881
+ return /* @__PURE__ */ n(Ot, { columns: t, viewMode: s });
1882
+ const f = `table-variant-${e} ${r ? "is-scrollable" : ""}`;
1883
+ return s === "card" ? /* @__PURE__ */ w("div", { className: `card-view-wrapper ${f}`, children: [
1884
+ /* @__PURE__ */ n("div", { className: `card-view-header table-header-cell-${e}`, children: t.map((u) => /* @__PURE__ */ w(
1873
1885
  "div",
1874
1886
  {
1875
1887
  className: `card-view-header-cell ${u.sortable ? "sortable" : ""}`,
@@ -1882,9 +1894,9 @@ const zt = Object.assign(Je, {
1882
1894
  },
1883
1895
  u.key
1884
1896
  )) }),
1885
- /* @__PURE__ */ a("div", { className: "card-view-body", children: v.map((u, h) => /* @__PURE__ */ a("div", { className: `card-view-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ a("div", { className: `card-view-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(u) : u[y.key] }, y.key)) }, h)) })
1886
- ] }) : /* @__PURE__ */ a("div", { className: `table-wrapper ${f}`, children: /* @__PURE__ */ w("table", { children: [
1887
- /* @__PURE__ */ a("thead", { className: "table-header", children: /* @__PURE__ */ a("tr", { className: "table-row", children: t.map((u) => /* @__PURE__ */ w(
1897
+ /* @__PURE__ */ n("div", { className: "card-view-body", children: v.map((u, h) => /* @__PURE__ */ n("div", { className: `card-view-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ n("div", { className: `card-view-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(u) : u[y.key] }, y.key)) }, h)) })
1898
+ ] }) : /* @__PURE__ */ n("div", { className: `table-wrapper ${f}`, children: /* @__PURE__ */ w("table", { children: [
1899
+ /* @__PURE__ */ n("thead", { className: "table-header", children: /* @__PURE__ */ n("tr", { className: "table-row", children: t.map((u) => /* @__PURE__ */ w(
1888
1900
  "th",
1889
1901
  {
1890
1902
  className: `table-header-cell ${u.sortable ? "sortable" : ""} table-header-cell-${e}`,
@@ -1897,25 +1909,25 @@ const zt = Object.assign(Je, {
1897
1909
  },
1898
1910
  u.key
1899
1911
  )) }) }),
1900
- /* @__PURE__ */ a("tbody", { children: v.map((u, h) => /* @__PURE__ */ a("tr", { className: `table-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ a("td", { className: `table-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(u) : u[y.key] }, y.key)) }, h)) })
1912
+ /* @__PURE__ */ n("tbody", { children: v.map((u, h) => /* @__PURE__ */ n("tr", { className: `table-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ n("td", { className: `table-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(u) : u[y.key] }, y.key)) }, h)) })
1901
1913
  ] }) });
1902
- }, qt = ({
1914
+ }, Kt = ({
1903
1915
  variant: e = "primary",
1904
1916
  product: t,
1905
- tone: s,
1906
- size: n = "medium",
1907
- color: l,
1908
- className: i = "",
1917
+ tone: a,
1918
+ size: s = "medium",
1919
+ color: r,
1920
+ className: l = "",
1909
1921
  "aria-label": d = "Carregando...",
1910
1922
  ...o
1911
1923
  }) => {
1912
- const r = "clarity-spinner", v = l ? `${r}--custom` : t && s ? `${r}--custom` : `${r}--${e}`, m = [
1913
- r,
1914
- `${r}--${n}`,
1924
+ const i = "clarity-spinner", v = r ? `${i}--custom` : t && a ? `${i}--custom` : `${i}--${e}`, m = [
1925
+ i,
1926
+ `${i}--${s}`,
1915
1927
  v,
1916
- i
1928
+ l
1917
1929
  ].filter(Boolean).join(" "), f = {};
1918
- return l ? f["--spinner-color"] = l : t && s && (f["--spinner-color"] = `var(--clarity-${t}-${s})`), /* @__PURE__ */ a(
1930
+ return r ? f["--spinner-color"] = r : t && a && (f["--spinner-color"] = `var(--clarity-${t}-${a})`), /* @__PURE__ */ n(
1919
1931
  "div",
1920
1932
  {
1921
1933
  className: m,
@@ -1923,16 +1935,16 @@ const zt = Object.assign(Je, {
1923
1935
  role: "status",
1924
1936
  "aria-label": d,
1925
1937
  ...o,
1926
- children: /* @__PURE__ */ a("div", { className: `${r}__container`, children: /* @__PURE__ */ a(
1938
+ children: /* @__PURE__ */ n("div", { className: `${i}__container`, children: /* @__PURE__ */ n(
1927
1939
  "svg",
1928
1940
  {
1929
- className: `${r}__svg`,
1941
+ className: `${i}__svg`,
1930
1942
  viewBox: "0 0 50 50",
1931
1943
  xmlns: "http://www.w3.org/2000/svg",
1932
- children: /* @__PURE__ */ a(
1944
+ children: /* @__PURE__ */ n(
1933
1945
  "circle",
1934
1946
  {
1935
- className: `${r}__circle`,
1947
+ className: `${i}__circle`,
1936
1948
  cx: "25",
1937
1949
  cy: "25",
1938
1950
  r: "20",
@@ -1944,35 +1956,35 @@ const zt = Object.assign(Je, {
1944
1956
  ) })
1945
1957
  }
1946
1958
  );
1947
- }, jt = ({
1959
+ }, It = ({
1948
1960
  className: e = "",
1949
1961
  noGutters: t,
1950
- justify: s,
1951
- align: n,
1952
- children: l,
1953
- as: i = "div",
1962
+ justify: a,
1963
+ align: s,
1964
+ children: r,
1965
+ as: l = "div",
1954
1966
  ...d
1955
1967
  }) => {
1956
1968
  const o = [
1957
1969
  "clarity-row",
1958
1970
  t ? "clarity-row--no-gutters" : "",
1959
- s ? `clarity-row--justify-${s}` : "",
1960
- n ? `clarity-row--align-${n}` : "",
1971
+ a ? `clarity-row--justify-${a}` : "",
1972
+ s ? `clarity-row--align-${s}` : "",
1961
1973
  e
1962
1974
  ].filter(Boolean).join(" ");
1963
- return E.createElement(i, { className: o, ...d }, l);
1975
+ return L.createElement(l, { className: o, ...d }, r);
1964
1976
  };
1965
- jt.displayName = "Row";
1966
- const Et = (e) => `${e / 12 * 100}%`, Lt = (e) => `${e / 12 * 100}%`, St = ({
1977
+ It.displayName = "Row";
1978
+ const Dt = (e) => `${e / 12 * 100}%`, At = (e) => `${e / 12 * 100}%`, Pt = ({
1967
1979
  className: e = "",
1968
1980
  xs: t,
1969
- sm: s,
1970
- md: n,
1971
- lg: l,
1972
- xl: i,
1981
+ sm: a,
1982
+ md: s,
1983
+ lg: r,
1984
+ xl: l,
1973
1985
  xxl: d,
1974
1986
  offset: o,
1975
- children: r,
1987
+ children: i,
1976
1988
  as: c = "div",
1977
1989
  style: p,
1978
1990
  ...v
@@ -1980,39 +1992,74 @@ const Et = (e) => `${e / 12 * 100}%`, Lt = (e) => `${e / 12 * 100}%`, St = ({
1980
1992
  const m = { ...p }, f = (y, b) => {
1981
1993
  if (b === void 0) return;
1982
1994
  const N = `--clarity-col-width-${y}`;
1983
- m[N] = typeof b == "number" ? Et(b) : "auto";
1995
+ m[N] = typeof b == "number" ? Dt(b) : "auto";
1984
1996
  }, u = (y, b) => {
1985
1997
  if (b === void 0) return;
1986
1998
  const N = `--clarity-col-offset-${y}`;
1987
- m[N] = Lt(b);
1999
+ m[N] = At(b);
1988
2000
  };
1989
- f("xs", t), f("sm", s), f("md", n), f("lg", l), f("xl", i), f("xxl", d), u("xs", o == null ? void 0 : o.xs), u("sm", o == null ? void 0 : o.sm), u("md", o == null ? void 0 : o.md), u("lg", o == null ? void 0 : o.lg), u("xl", o == null ? void 0 : o.xl), u("xxl", o == null ? void 0 : o.xxl);
2001
+ f("xs", t), f("sm", a), f("md", s), f("lg", r), f("xl", l), f("xxl", d), u("xs", o == null ? void 0 : o.xs), u("sm", o == null ? void 0 : o.sm), u("md", o == null ? void 0 : o.md), u("lg", o == null ? void 0 : o.lg), u("xl", o == null ? void 0 : o.xl), u("xxl", o == null ? void 0 : o.xxl);
1990
2002
  const h = ["clarity-col", e].filter(Boolean).join(" ");
1991
- return E.createElement(c, { className: h, style: m, ...v }, r);
2003
+ return L.createElement(c, { className: h, style: m, ...v }, i);
2004
+ };
2005
+ Pt.displayName = "Col";
2006
+ const Ce = Q({}), it = ({ children: e, className: t, ...a }) => {
2007
+ const { borderRadius: s } = U(Ce);
2008
+ return /* @__PURE__ */ n(
2009
+ me,
2010
+ {
2011
+ as: "header",
2012
+ p: 4,
2013
+ borderBottomWidth: 1,
2014
+ borderColor: "gray.200",
2015
+ className: t,
2016
+ borderTopLeftRadius: s,
2017
+ borderTopRightRadius: s,
2018
+ ...a,
2019
+ children: e
2020
+ }
2021
+ );
2022
+ };
2023
+ it.displayName = "Card.Header";
2024
+ const ot = ({ children: e, className: t, ...a }) => /* @__PURE__ */ n(me, { p: 4, className: t, ...a, children: e });
2025
+ ot.displayName = "Card.Content";
2026
+ const ct = ({ children: e, className: t, ...a }) => {
2027
+ const { borderRadius: s } = U(Ce);
2028
+ return /* @__PURE__ */ n(
2029
+ me,
2030
+ {
2031
+ as: "footer",
2032
+ p: 4,
2033
+ borderTopWidth: 1,
2034
+ borderColor: "gray.200",
2035
+ display: "flex",
2036
+ justifyContent: "flex-end",
2037
+ gap: 3,
2038
+ className: t,
2039
+ borderBottomLeftRadius: s,
2040
+ borderBottomRightRadius: s,
2041
+ ...a,
2042
+ children: e
2043
+ }
2044
+ );
1992
2045
  };
1993
- St.displayName = "Col";
1994
- const at = ({ children: e, className: t }) => /* @__PURE__ */ a(de, { as: "header", p: 4, borderBottomWidth: 1, borderColor: "gray.200", className: t, children: e });
1995
- at.displayName = "Card.Header";
1996
- const nt = ({ children: e, className: t }) => /* @__PURE__ */ a(de, { p: 4, className: t, children: e });
1997
- nt.displayName = "Card.Content";
1998
- const lt = ({ children: e, className: t }) => /* @__PURE__ */ a(de, { as: "footer", p: 4, borderTopWidth: 1, borderColor: "gray.200", display: "flex", justifyContent: "flex-end", gap: 3, className: t, children: e });
1999
- lt.displayName = "Card.Footer";
2000
- const me = ({ children: e, ...t }) => /* @__PURE__ */ a(
2001
- de,
2046
+ ct.displayName = "Card.Footer";
2047
+ const ue = ({ children: e, bg: t = "white", borderRadius: a = 3, ...s }) => /* @__PURE__ */ n(Ce.Provider, { value: { borderRadius: a }, children: /* @__PURE__ */ n(
2048
+ me,
2002
2049
  {
2003
- bg: "white",
2004
- borderRadius: 3,
2050
+ bg: t,
2051
+ borderRadius: a,
2005
2052
  boxShadow: 1,
2006
2053
  overflow: "hidden",
2007
- ...t,
2054
+ ...s,
2008
2055
  children: e
2009
2056
  }
2010
- );
2011
- me.Header = at;
2012
- me.Content = nt;
2013
- me.Footer = lt;
2014
- me.displayName = "Card";
2015
- const Jt = {
2057
+ ) });
2058
+ ue.Header = it;
2059
+ ue.Content = ot;
2060
+ ue.Footer = ct;
2061
+ ue.displayName = "Card";
2062
+ const ea = {
2016
2063
  primary: {
2017
2064
  50: "#f0f9ff",
2018
2065
  100: "#e0f2fe",
@@ -2061,7 +2108,7 @@ const Jt = {
2061
2108
  800: "#065f46",
2062
2109
  900: "#064e3b"
2063
2110
  }
2064
- }, Qt = {
2111
+ }, ta = {
2065
2112
  xs: "4px",
2066
2113
  sm: "8px",
2067
2114
  md: "16px",
@@ -2069,38 +2116,38 @@ const Jt = {
2069
2116
  xl: "32px",
2070
2117
  "2xl": "48px",
2071
2118
  "3xl": "64px"
2072
- }, Zt = (...e) => e.filter(Boolean).join(" "), Xt = () => Math.random().toString(36).substr(2, 9);
2119
+ }, aa = (...e) => e.filter(Boolean).join(" "), sa = () => Math.random().toString(36).substr(2, 9);
2073
2120
  export {
2074
- Ft as Accordion,
2075
- Dt as Badge,
2076
- de as Box,
2077
- At as Button,
2078
- Pt as ButtonGroup,
2079
- Mt as ButtonIcon,
2080
- Wt as ButtonLink,
2081
- me as Card,
2082
- vt as CheckInput,
2083
- St as Col,
2084
- zt as Command,
2085
- ee as ConfirmationDialog,
2086
- oe as Dropdown,
2087
- ut as Input,
2088
- bt as InputSwitch,
2089
- K as Modal,
2090
- ht as MultiSelect,
2091
- ae as Offcanvas,
2092
- jt as Row,
2093
- ft as Select,
2094
- qt as Spinner,
2095
- Ut as Table,
2096
- he as Tabs,
2097
- pt as Textarea,
2098
- Ht as ToastProvider,
2099
- Gt as Tooltip,
2100
- Zt as cn,
2101
- Jt as colors,
2102
- Xt as generateId,
2103
- Qt as spacing,
2104
- ve as typography,
2105
- Vt as useToast
2121
+ Qt as Accordion,
2122
+ Wt as Badge,
2123
+ me as Box,
2124
+ Ft as Button,
2125
+ Gt as ButtonGroup,
2126
+ qt as ButtonIcon,
2127
+ Jt as ButtonLink,
2128
+ ue as Card,
2129
+ _t as CheckInput,
2130
+ Pt as Col,
2131
+ Xt as Command,
2132
+ K as ConfirmationDialog,
2133
+ ce as Dropdown,
2134
+ bt as Input,
2135
+ $t as InputSwitch,
2136
+ Y as Modal,
2137
+ wt as MultiSelect,
2138
+ se as Offcanvas,
2139
+ It as Row,
2140
+ Nt as Select,
2141
+ Kt as Spinner,
2142
+ Yt as Table,
2143
+ ve as Tabs,
2144
+ Ct as Textarea,
2145
+ Ut as ToastProvider,
2146
+ Zt as Tooltip,
2147
+ aa as cn,
2148
+ ea as colors,
2149
+ sa as generateId,
2150
+ ta as spacing,
2151
+ we as typography,
2152
+ zt as useToast
2106
2153
  };