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