beth-clarity 1.1.26 → 1.1.28

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