beth-clarity 1.1.12 → 1.1.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/clarity-design-system.es.js +655 -662
  2. package/dist/clarity-design-system.umd.js +2 -2
  3. package/dist/styles/index.css +1 -1
  4. package/package.json +1 -1
package/dist/clarity-design-system.es.js CHANGED
@@ -1,31 +1,31 @@
1
- import { jsx as s, jsxs as _, Fragment as Ze } from "react/jsx-runtime";
2
- import E, { useState as B, useRef as P, useEffect as S, forwardRef as Ke, isValidElement as Z, createContext as z, cloneElement as W, useContext as q, useMemo as Y, useCallback as le, useLayoutEffect as et } from "react";
1
+ import { jsx as s, jsxs as C, Fragment as Ze } from "react/jsx-runtime";
2
+ import E, { useState as x, useRef as P, useEffect as S, forwardRef as Ke, isValidElement as Z, createContext as z, cloneElement as W, useContext as q, useMemo as Y, useCallback as ne, useLayoutEffect as et } from "react";
3
3
  import tt from "react-dom";
4
4
  const wt = ({
5
5
  variant: e = "primary",
6
6
  product: t,
7
7
  tone: a,
8
- size: n = "medium",
9
- bgColor: l,
10
- textColor: r,
11
- children: o,
8
+ size: l = "medium",
9
+ bgColor: n,
10
+ textColor: i,
11
+ children: c,
12
12
  className: f = "",
13
- rounded: i = !1,
14
- outlined: c = !1,
13
+ rounded: r = !1,
14
+ outlined: o = !1,
15
15
  ...d
16
16
  }) => {
17
- const v = "clarity-badge", m = !!l, p = t && a && !m;
18
- let h = "";
19
- m ? h = `${v}--custom-bg` : p ? h = `${v}--custom` : h = `${v}--${e}`;
20
- const u = [
17
+ const v = "clarity-badge", m = !!n, p = t && a && !m;
18
+ let u = "";
19
+ m ? u = `${v}--custom-bg` : p ? u = `${v}--custom` : u = `${v}--${e}`;
20
+ const h = [
21
21
  v,
22
- h,
23
- `${v}--${n}`,
24
- i ? `${v}--rounded` : "",
25
- c ? `${v}--outlined` : "",
22
+ u,
23
+ `${v}--${l}`,
24
+ r ? `${v}--rounded` : "",
25
+ o ? `${v}--outlined` : "",
26
26
  f
27
27
  ].filter(Boolean).join(" "), y = {};
28
- m && (y.backgroundColor = l, r && (y.color = r));
28
+ m && (y.backgroundColor = n, i && (y.color = i));
29
29
  const b = p && t && a ? {
30
30
  "--custom-bg-color": `var(--clarity-${t}-${a})`,
31
31
  "--custom-text-color": a && parseInt(a) >= 500 ? "white" : `var(--clarity-${t}-800)`
@@ -33,57 +33,50 @@ const wt = ({
33
33
  return /* @__PURE__ */ s(
34
34
  "span",
35
35
  {
36
- className: u,
36
+ className: h,
37
37
  style: {
38
38
  ...y,
39
39
  ...b
40
40
  },
41
41
  ...d,
42
- children: o
42
+ children: c
43
43
  }
44
44
  );
45
45
  }, gt = ({
46
46
  variant: e = "primary",
47
- product: t,
48
- tone: a,
49
- hoverTone: n,
50
- size: l = "medium",
51
- disabled: r = !1,
52
- loading: o = !1,
53
- children: f,
47
+ size: t = "medium",
48
+ disabled: a = !1,
49
+ loading: l = !1,
50
+ children: n,
54
51
  onClick: i,
55
52
  type: c = "button",
56
- className: d = "",
57
- title: v,
58
- customColor: m,
59
- customColorHover: p,
60
- ...h
53
+ className: f = "",
54
+ title: r,
55
+ customColor: o,
56
+ customColorHover: d,
57
+ ...v
61
58
  }) => {
62
- const u = "clarity-button", y = t && a && !m, b = [
63
- u,
64
- !y && !m && `${u}--${e}`,
65
- y && `${u}--custom`,
66
- `${u}--${l}`,
67
- o && `${u}--loading`,
68
- r && `${u}--disabled`,
69
- d
70
- ].filter(Boolean).join(" "), w = (T) => {
71
- const C = parseInt(T);
72
- return C >= 800 ? "900" : C >= 700 ? "800" : C >= 600 ? "700" : C >= 500 ? "600" : C >= 400 ? "500" : C >= 300 ? "400" : C >= 200 ? "300" : "200";
73
- }, $ = {};
74
- return m ? ($["--button-bg"] = m, $["--button-hover-bg"] = p || `${m}E6`, $["--button-border"] = m, $["--button-hover-border"] = p || `${m}E6`, $["--button-fg"] = "#fff") : y && ($["--custom-bg-color"] = `var(--clarity-${t}-${a})`, $["--custom-hover-color"] = `var(--clarity-${t}-${n || w(a)})`), /* @__PURE__ */ _(
59
+ const m = "clarity-button", p = [
60
+ m,
61
+ !o && `${m}--${e}`,
62
+ `${m}--${t}`,
63
+ l && `${m}--loading`,
64
+ a && `${m}--disabled`,
65
+ f
66
+ ].filter(Boolean).join(" "), u = {};
67
+ return o && (u["--button-bg"] = o, u["--button-hover-bg"] = d || `${o}E6`, u["--button-border"] = o, u["--button-hover-border"] = d || `${o}E6`, u["--button-fg"] = "#fff"), /* @__PURE__ */ C(
75
68
  "button",
76
69
  {
77
- className: b,
78
- style: $,
79
- disabled: r || o,
70
+ className: p,
71
+ style: u,
72
+ disabled: a || l,
80
73
  onClick: i,
81
74
  type: c,
82
- title: v,
83
- ...h,
75
+ title: r,
76
+ ...v,
84
77
  children: [
85
- o && /* @__PURE__ */ s("div", { className: `${u}__spinner` }),
86
- f
78
+ l && /* @__PURE__ */ s("div", { className: `${m}__spinner` }),
79
+ n
87
80
  ]
88
81
  }
89
82
  );
@@ -91,59 +84,59 @@ const wt = ({
91
84
  variant: e = "primary",
92
85
  size: t = "medium",
93
86
  filled: a = !0,
94
- items: n,
95
- value: l,
96
- multiple: r = !1,
97
- disabled: o = !1,
87
+ items: l,
88
+ value: n,
89
+ multiple: i = !1,
90
+ disabled: c = !1,
98
91
  onChange: f,
99
- className: i = "",
100
- ...c
92
+ className: r = "",
93
+ ...o
101
94
  }) => {
102
95
  const d = "clarity-button-group", v = `${d}--${e}`, m = [
103
96
  d,
104
97
  v,
105
98
  `${d}--${t}`,
106
99
  !a && `${d}--outline`,
107
- o && `${d}--disabled`,
108
- i
109
- ].filter(Boolean).join(" "), p = (u) => {
110
- if (o || !f) return;
111
- const y = n.find((b) => b.id === u);
100
+ c && `${d}--disabled`,
101
+ r
102
+ ].filter(Boolean).join(" "), p = (h) => {
103
+ if (c || !f) return;
104
+ const y = l.find((b) => b.id === h);
112
105
  if (!(y != null && y.disabled))
113
- if (r) {
114
- const b = Array.isArray(l) ? l : [], w = b.includes(u) ? b.filter(($) => $ !== u) : [...b, u];
115
- f(w);
106
+ if (i) {
107
+ const b = Array.isArray(n) ? n : [], _ = b.includes(h) ? b.filter((B) => B !== h) : [...b, h];
108
+ f(_);
116
109
  } else
117
- f(u);
118
- }, h = (u) => r ? Array.isArray(l) && l.includes(u) : l === u;
110
+ f(h);
111
+ }, u = (h) => i ? Array.isArray(n) && n.includes(h) : n === h;
119
112
  return /* @__PURE__ */ s(
120
113
  "div",
121
114
  {
122
115
  className: m,
123
116
  role: "group",
124
- ...c,
125
- children: n.map((u, y) => {
126
- const b = h(u.id), w = [
117
+ ...o,
118
+ children: l.map((h, y) => {
119
+ const b = u(h.id), _ = [
127
120
  `${d}__item`,
128
121
  b && `${d}__item--selected`,
129
- u.disabled && `${d}__item--disabled`,
122
+ h.disabled && `${d}__item--disabled`,
130
123
  y === 0 && `${d}__item--first`,
131
- y === n.length - 1 && `${d}__item--last`
124
+ y === l.length - 1 && `${d}__item--last`
132
125
  ].filter(Boolean).join(" ");
133
- return /* @__PURE__ */ _(
126
+ return /* @__PURE__ */ C(
134
127
  "button",
135
128
  {
136
- className: w,
137
- onClick: () => p(u.id),
138
- disabled: o || u.disabled,
129
+ className: _,
130
+ onClick: () => p(h.id),
131
+ disabled: c || h.disabled,
139
132
  type: "button",
140
133
  "aria-pressed": b,
141
134
  children: [
142
- u.icon && /* @__PURE__ */ s("span", { className: `${d}__item-icon`, children: u.icon }),
143
- /* @__PURE__ */ s("span", { className: `${d}__item-label`, children: u.label })
135
+ h.icon && /* @__PURE__ */ s("span", { className: `${d}__item-icon`, children: h.icon }),
136
+ /* @__PURE__ */ s("span", { className: `${d}__item-label`, children: h.label })
144
137
  ]
145
138
  },
146
- u.id
139
+ h.id
147
140
  );
148
141
  })
149
142
  }
@@ -152,63 +145,63 @@ const wt = ({
152
145
  variant: e,
153
146
  size: t = "medium",
154
147
  label: a,
155
- helperText: n,
156
- error: l = !1,
157
- errorMessage: r,
158
- startIcon: o,
148
+ helperText: l,
149
+ error: n = !1,
150
+ errorMessage: i,
151
+ startIcon: c,
159
152
  endIcon: f,
160
- className: i = "",
161
- disabled: c = !1,
153
+ className: r = "",
154
+ disabled: o = !1,
162
155
  value: d,
163
156
  defaultValue: v,
164
157
  onFocus: m,
165
158
  onBlur: p,
166
- ...h
167
- }, u) => {
168
- const [y, b] = B(!1), [w, $] = B(!1), T = P(null);
169
- E.useImperativeHandle(u, () => T.current), S(() => {
170
- const x = T.current;
171
- x && $(x.value.length > 0);
159
+ ...u
160
+ }, h) => {
161
+ const [y, b] = x(!1), [_, B] = x(!1), T = P(null);
162
+ E.useImperativeHandle(h, () => T.current), S(() => {
163
+ const k = T.current;
164
+ k && B(k.value.length > 0);
172
165
  }, [d, v]);
173
- const C = (x) => {
174
- b(!0), m == null || m(x);
175
- }, k = (x) => {
176
- b(!1), $(x.target.value.length > 0), p == null || p(x);
166
+ const w = (k) => {
167
+ b(!0), m == null || m(k);
168
+ }, $ = (k) => {
169
+ b(!1), B(k.target.value.length > 0), p == null || p(k);
177
170
  }, L = [
178
171
  "clarity-input",
179
172
  "clarity-input--outlined",
180
173
  `clarity-input--${t}`,
181
174
  e && `clarity-input--${e}`,
182
- l && "clarity-input--error",
183
- c && "clarity-input--disabled",
175
+ n && "clarity-input--error",
176
+ o && "clarity-input--disabled",
184
177
  y && "clarity-input--focused",
185
- w && "clarity-input--has-value",
186
- o && "clarity-input--with-start-icon",
178
+ _ && "clarity-input--has-value",
179
+ c && "clarity-input--with-start-icon",
187
180
  f && "clarity-input--with-end-icon",
188
- i
181
+ r
189
182
  ].filter(Boolean).join(" ");
190
- return /* @__PURE__ */ _("div", { className: "clarity-input-wrapper", children: [
191
- /* @__PURE__ */ _("div", { className: L, children: [
192
- o && /* @__PURE__ */ s("div", { className: "clarity-input__start-icon", children: o }),
193
- /* @__PURE__ */ _("div", { className: "clarity-input__field", children: [
183
+ return /* @__PURE__ */ C("div", { className: "clarity-input-wrapper", children: [
184
+ /* @__PURE__ */ C("div", { className: L, children: [
185
+ c && /* @__PURE__ */ s("div", { className: "clarity-input__start-icon", children: c }),
186
+ /* @__PURE__ */ C("div", { className: "clarity-input__field", children: [
194
187
  /* @__PURE__ */ s(
195
188
  "input",
196
189
  {
197
190
  ref: T,
198
191
  className: "clarity-input__element",
199
- disabled: c,
192
+ disabled: o,
200
193
  value: d,
201
194
  defaultValue: v,
202
- onFocus: C,
203
- onBlur: k,
204
- ...h
195
+ onFocus: w,
196
+ onBlur: $,
197
+ ...u
205
198
  }
206
199
  ),
207
200
  a && /* @__PURE__ */ s("label", { className: "clarity-input__label", children: a })
208
201
  ] }),
209
202
  f && /* @__PURE__ */ s("div", { className: "clarity-input__end-icon", children: f })
210
203
  ] }),
211
- (n || l && r) && /* @__PURE__ */ s("div", { className: "clarity-input__helper-text", children: l && r ? r : n })
204
+ (l || n && i) && /* @__PURE__ */ s("div", { className: "clarity-input__helper-text", children: n && i ? i : l })
212
205
  ] });
213
206
  });
214
207
  st.displayName = "Input";
@@ -216,177 +209,177 @@ const at = E.forwardRef(({
216
209
  variant: e,
217
210
  size: t = "medium",
218
211
  label: a,
219
- helperText: n,
220
- error: l = !1,
221
- errorMessage: r,
222
- startIcon: o,
212
+ helperText: l,
213
+ error: n = !1,
214
+ errorMessage: i,
215
+ startIcon: c,
223
216
  endIcon: f,
224
- className: i = "",
225
- disabled: c = !1,
217
+ className: r = "",
218
+ disabled: o = !1,
226
219
  value: d,
227
220
  defaultValue: v,
228
221
  onFocus: m,
229
222
  onBlur: p,
230
- rows: h = 3,
231
- minHeight: u,
223
+ rows: u = 3,
224
+ minHeight: h,
232
225
  maxHeight: y,
233
226
  resizable: b = !0,
234
- ...w
235
- }, $) => {
236
- const [T, C] = B(!1), [k, L] = B(!1), x = P(null);
237
- E.useImperativeHandle($, () => x.current), S(() => {
238
- const g = x.current;
227
+ ..._
228
+ }, B) => {
229
+ const [T, w] = x(!1), [$, L] = x(!1), k = P(null);
230
+ E.useImperativeHandle(B, () => k.current), S(() => {
231
+ const g = k.current;
239
232
  g && L(g.value.length > 0);
240
233
  }, [d, v]);
241
234
  const j = (g) => {
242
- C(!0), m == null || m(g);
235
+ w(!0), m == null || m(g);
243
236
  }, I = (g) => {
244
- C(!1), L(g.target.value.length > 0), p == null || p(g);
237
+ w(!1), L(g.target.value.length > 0), p == null || p(g);
245
238
  }, A = [
246
239
  "clarity-textarea",
247
240
  "clarity-textarea--outlined",
248
241
  `clarity-textarea--${t}`,
249
242
  e && `clarity-textarea--${e}`,
250
- l && "clarity-textarea--error",
251
- c && "clarity-textarea--disabled",
243
+ n && "clarity-textarea--error",
244
+ o && "clarity-textarea--disabled",
252
245
  T && "clarity-textarea--focused",
253
- k && "clarity-textarea--has-value",
254
- o && "clarity-textarea--with-start-icon",
246
+ $ && "clarity-textarea--has-value",
247
+ c && "clarity-textarea--with-start-icon",
255
248
  f && "clarity-textarea--with-end-icon",
256
- i
249
+ r
257
250
  ].filter(Boolean).join(" "), O = {
258
251
  resize: b ? "vertical" : "none",
259
- minHeight: u ? `${u}px` : void 0,
252
+ minHeight: h ? `${h}px` : void 0,
260
253
  maxHeight: y ? `${y}px` : void 0
261
254
  };
262
- return /* @__PURE__ */ _("div", { className: "clarity-textarea-wrapper", children: [
263
- /* @__PURE__ */ _("div", { className: A, children: [
264
- o && /* @__PURE__ */ s("div", { className: "clarity-textarea__start-icon", children: o }),
265
- /* @__PURE__ */ _("div", { className: "clarity-textarea__field", children: [
255
+ return /* @__PURE__ */ C("div", { className: "clarity-textarea-wrapper", children: [
256
+ /* @__PURE__ */ C("div", { className: A, children: [
257
+ c && /* @__PURE__ */ s("div", { className: "clarity-textarea__start-icon", children: c }),
258
+ /* @__PURE__ */ C("div", { className: "clarity-textarea__field", children: [
266
259
  /* @__PURE__ */ s(
267
260
  "textarea",
268
261
  {
269
- ref: x,
262
+ ref: k,
270
263
  className: "clarity-textarea__element",
271
- disabled: c,
264
+ disabled: o,
272
265
  value: d,
273
266
  defaultValue: v,
274
267
  onFocus: j,
275
268
  onBlur: I,
276
- rows: h,
269
+ rows: u,
277
270
  style: O,
278
- ...w
271
+ ..._
279
272
  }
280
273
  ),
281
274
  a && /* @__PURE__ */ s("label", { className: "clarity-textarea__label", children: a })
282
275
  ] }),
283
276
  f && /* @__PURE__ */ s("div", { className: "clarity-textarea__end-icon", children: f })
284
277
  ] }),
285
- (n || l && r) && /* @__PURE__ */ s("div", { className: "clarity-textarea__helper-text", children: l && r ? r : n })
278
+ (l || n && i) && /* @__PURE__ */ s("div", { className: "clarity-textarea__helper-text", children: n && i ? i : l })
286
279
  ] });
287
280
  });
288
281
  at.displayName = "Textarea";
289
- const nt = E.forwardRef(({
282
+ const lt = E.forwardRef(({
290
283
  variant: e,
291
284
  size: t = "medium",
292
285
  label: a,
293
- helperText: n,
294
- error: l = !1,
295
- errorMessage: r,
296
- startIcon: o,
286
+ helperText: l,
287
+ error: n = !1,
288
+ errorMessage: i,
289
+ startIcon: c,
297
290
  endIcon: f,
298
- className: i = "",
299
- disabled: c = !1,
291
+ className: r = "",
292
+ disabled: o = !1,
300
293
  value: d,
301
294
  defaultValue: v,
302
295
  onFocus: m,
303
296
  onBlur: p,
304
- onChange: h,
305
- options: u,
297
+ onChange: u,
298
+ options: h,
306
299
  placeholder: y = "Selecione uma opção",
307
300
  isClearable: b = !1,
308
- isSearchable: w = !1,
309
- ...$
301
+ isSearchable: _ = !1,
302
+ ...B
310
303
  }, T) => {
311
- const [C, k] = B(!1), [L, x] = B(!1), [j, I] = B(d || v || ""), [A, O] = B(""), g = P(null), H = P(null);
304
+ const [w, $] = x(!1), [L, k] = x(!1), [j, I] = x(d || v || ""), [A, O] = x(""), g = P(null), H = P(null);
312
305
  E.useImperativeHandle(T, () => g.current), S(() => {
313
306
  d !== void 0 && I(d);
314
307
  }, [d]), S(() => {
315
308
  const N = (D) => {
316
- g.current && !g.current.contains(D.target) && (k(!1), x(!1), p == null || p());
309
+ g.current && !g.current.contains(D.target) && ($(!1), k(!1), p == null || p());
317
310
  };
318
311
  return document.addEventListener("mousedown", N), () => document.removeEventListener("mousedown", N);
319
312
  }, [p]);
320
- const V = w && A ? u.filter(
313
+ const V = _ && A ? h.filter(
321
314
  (N) => N.label.toLowerCase().includes(A.toLowerCase())
322
- ) : u, F = () => {
323
- c || (k(!C), x(!C), C ? (p == null || p(), w && O("")) : (m == null || m(), w && setTimeout(() => {
315
+ ) : h, F = () => {
316
+ o || ($(!w), k(!w), w ? (p == null || p(), _ && O("")) : (m == null || m(), _ && setTimeout(() => {
324
317
  var N;
325
318
  (N = H.current) == null || N.focus();
326
319
  }, 0)));
327
320
  }, X = (N) => {
328
- N.disabled || (I(N.value), k(!1), x(!1), O(""), h == null || h(N.value), p == null || p());
321
+ N.disabled || (I(N.value), $(!1), k(!1), O(""), u == null || u(N.value), p == null || p());
329
322
  }, te = (N) => {
330
323
  O(N.target.value);
331
324
  }, G = (N) => {
332
- N.key === "Escape" ? (k(!1), x(!1), O("")) : N.key === "Enter" && V.length > 0 && V[0] && X(V[0]);
333
- }, M = u.find((N) => N.value === j), ne = j !== "" && j !== void 0, re = (N) => {
334
- N.stopPropagation(), I(""), h == null || h("");
335
- }, ie = ne || L || y || w && A, oe = [
325
+ N.key === "Escape" ? ($(!1), k(!1), O("")) : N.key === "Enter" && V.length > 0 && V[0] && X(V[0]);
326
+ }, M = h.find((N) => N.value === j), le = j !== "" && j !== void 0, ie = (N) => {
327
+ N.stopPropagation(), I(""), u == null || u("");
328
+ }, re = le || L || y || _ && A, oe = [
336
329
  "clarity-select",
337
330
  "clarity-select--outlined",
338
331
  `clarity-select--${t}`,
339
332
  e && `clarity-select--${e}`,
340
- l && "clarity-select--error",
341
- c && "clarity-select--disabled",
342
- (L || C) && "clarity-select--focused",
343
- ie && "clarity-select--label-up",
344
- C && "clarity-select--open",
345
- w && "clarity-select--searchable",
346
- o && "clarity-select--with-start-icon",
333
+ n && "clarity-select--error",
334
+ o && "clarity-select--disabled",
335
+ (L || w) && "clarity-select--focused",
336
+ re && "clarity-select--label-up",
337
+ w && "clarity-select--open",
338
+ _ && "clarity-select--searchable",
339
+ c && "clarity-select--with-start-icon",
347
340
  (f || b) && "clarity-select--with-end-icon",
348
- i
341
+ r
349
342
  ].filter(Boolean).join(" ");
350
- return /* @__PURE__ */ _("div", { className: "clarity-select-wrapper", children: [
351
- /* @__PURE__ */ _(
343
+ return /* @__PURE__ */ C("div", { className: "clarity-select-wrapper", children: [
344
+ /* @__PURE__ */ C(
352
345
  "div",
353
346
  {
354
347
  ref: g,
355
348
  className: oe,
356
- onClick: w ? void 0 : F,
349
+ onClick: _ ? void 0 : F,
357
350
  role: "combobox",
358
- "aria-expanded": C,
351
+ "aria-expanded": w,
359
352
  "aria-haspopup": "listbox",
360
- tabIndex: c || w ? -1 : 0,
361
- ...$,
353
+ tabIndex: o || _ ? -1 : 0,
354
+ ...B,
362
355
  children: [
363
- o && /* @__PURE__ */ s("div", { className: "clarity-select__start-icon", children: o }),
364
- /* @__PURE__ */ _("div", { className: "clarity-select__field", children: [
365
- w ? /* @__PURE__ */ s(
356
+ c && /* @__PURE__ */ s("div", { className: "clarity-select__start-icon", children: c }),
357
+ /* @__PURE__ */ C("div", { className: "clarity-select__field", children: [
358
+ _ ? /* @__PURE__ */ s(
366
359
  "input",
367
360
  {
368
361
  ref: H,
369
362
  type: "text",
370
363
  className: "clarity-select__search-input",
371
- value: C ? A : M ? M.label : "",
364
+ value: w ? A : M ? M.label : "",
372
365
  onChange: te,
373
366
  onKeyDown: G,
374
367
  onFocus: () => {
375
- C || (k(!0), x(!0), m == null || m());
368
+ w || ($(!0), k(!0), m == null || m());
376
369
  },
377
370
  placeholder: M ? M.label : y,
378
- disabled: c,
379
- readOnly: !C
371
+ disabled: o,
372
+ readOnly: !w
380
373
  }
381
374
  ) : /* @__PURE__ */ s("div", { className: "clarity-select__display", children: M ? M.label : y }),
382
375
  a && /* @__PURE__ */ s("label", { className: "clarity-select__label", children: a })
383
376
  ] }),
384
- b && ne && /* @__PURE__ */ s(
377
+ b && le && /* @__PURE__ */ s(
385
378
  "button",
386
379
  {
387
380
  type: "button",
388
381
  className: "clarity-select__clear-button",
389
- onClick: re,
382
+ onClick: ie,
390
383
  "aria-label": "Limpar seleção",
391
384
  children: /* @__PURE__ */ s(
392
385
  "svg",
@@ -413,7 +406,7 @@ const nt = E.forwardRef(({
413
406
  "div",
414
407
  {
415
408
  className: "clarity-select__end-icon",
416
- onClick: w ? F : void 0,
409
+ onClick: _ ? F : void 0,
417
410
  children: f || /* @__PURE__ */ s(
418
411
  "svg",
419
412
  {
@@ -436,7 +429,7 @@ const nt = E.forwardRef(({
436
429
  )
437
430
  }
438
431
  ),
439
- C && /* @__PURE__ */ s("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ s("ul", { className: "clarity-select__options", role: "listbox", children: V.length > 0 ? V.map((N) => /* @__PURE__ */ s(
432
+ w && /* @__PURE__ */ s("div", { className: "clarity-select__dropdown", children: /* @__PURE__ */ s("ul", { className: "clarity-select__options", role: "listbox", children: V.length > 0 ? V.map((N) => /* @__PURE__ */ s(
440
433
  "li",
441
434
  {
442
435
  className: [
@@ -454,73 +447,73 @@ const nt = E.forwardRef(({
454
447
  ]
455
448
  }
456
449
  ),
457
- (n || l && r) && /* @__PURE__ */ s("div", { className: "clarity-select__helper-text", children: l && r ? r : n })
450
+ (l || n && i) && /* @__PURE__ */ s("div", { className: "clarity-select__helper-text", children: n && i ? i : l })
458
451
  ] });
459
452
  });
460
- nt.displayName = "Select";
461
- const lt = Ke(({
453
+ lt.displayName = "Select";
454
+ const nt = Ke(({
462
455
  options: e = [],
463
456
  value: t = [],
464
457
  onChange: a,
465
- placeholder: n = "Selecione opções",
466
- label: l,
467
- helperText: r,
468
- error: o = !1,
458
+ placeholder: l = "Selecione opções",
459
+ label: n,
460
+ helperText: i,
461
+ error: c = !1,
469
462
  errorMessage: f,
470
- disabled: i = !1,
471
- variant: c = "primary",
463
+ disabled: r = !1,
464
+ variant: o = "primary",
472
465
  size: d = "medium",
473
466
  maxSelectedLabels: v = 3,
474
467
  selectionLimit: m,
475
468
  className: p = "",
476
- id: h,
477
- name: u,
469
+ id: u,
470
+ name: h,
478
471
  required: y = !1,
479
472
  "data-testid": b,
480
- ...w
481
- }, $) => {
482
- const [T, C] = B(!1), [k, L] = B(""), [x, j] = B(!1), I = P(null), A = P(null), O = P(null), g = (N) => {
483
- I.current = N, $ && (typeof $ == "function" ? $(N) : $.current = N);
473
+ ..._
474
+ }, B) => {
475
+ const [T, w] = x(!1), [$, L] = x(""), [k, j] = x(!1), I = P(null), A = P(null), O = P(null), g = (N) => {
476
+ I.current = N, B && (typeof B == "function" ? B(N) : B.current = N);
484
477
  };
485
478
  S(() => {
486
479
  const N = (D) => {
487
- I.current && !I.current.contains(D.target) && (C(!1), j(!1), L(""));
480
+ I.current && !I.current.contains(D.target) && (w(!1), j(!1), L(""));
488
481
  };
489
482
  return document.addEventListener("click", N), () => document.removeEventListener("click", N);
490
483
  }, []);
491
484
  const H = e.filter(
492
- (N) => N.label.toLowerCase().includes(k.toLowerCase())
485
+ (N) => N.label.toLowerCase().includes($.toLowerCase())
493
486
  ), V = () => {
494
- i || (C(!T), j(!T), T ? L("") : setTimeout(() => {
487
+ r || (w(!T), j(!T), T ? L("") : setTimeout(() => {
495
488
  var N;
496
489
  (N = A.current) == null || N.focus();
497
490
  }, 100));
498
491
  }, F = (N, D) => {
499
- if (i)
492
+ if (r)
500
493
  return;
501
494
  D && (D.stopPropagation(), D.preventDefault());
502
495
  const U = t.includes(N);
503
496
  let R;
504
497
  U ? R = t.filter((se) => se !== N) : R = [...t, N], a && a(R);
505
498
  }, X = (N, D) => {
506
- if (D.stopPropagation(), i) return;
499
+ if (D.stopPropagation(), r) return;
507
500
  const U = t.filter((R) => R !== N);
508
501
  a == null || a(U);
509
502
  }, te = (N) => {
510
- N.stopPropagation(), !i && (a == null || a([]));
503
+ N.stopPropagation(), !r && (a == null || a([]));
511
504
  }, G = (N) => {
512
505
  L(N.target.value);
513
506
  }, M = (N) => {
514
- N.key === "Escape" && (C(!1), j(!1), L(""));
515
- }, ne = x || T || t.length > 0, re = () => {
507
+ N.key === "Escape" && (w(!1), j(!1), L(""));
508
+ }, le = k || T || t.length > 0, ie = () => {
516
509
  if (t.length === 0) return null;
517
510
  const N = t.map(
518
511
  (R) => e.find((se) => se.value === R)
519
512
  ).filter(Boolean), D = N.slice(0, v), U = N.length - v;
520
- return /* @__PURE__ */ _("div", { className: "clarity-multiselect__chips", children: [
521
- D.map((R) => /* @__PURE__ */ _("div", { className: "clarity-multiselect__chip", children: [
513
+ return /* @__PURE__ */ C("div", { className: "clarity-multiselect__chips", children: [
514
+ D.map((R) => /* @__PURE__ */ C("div", { className: "clarity-multiselect__chip", children: [
522
515
  /* @__PURE__ */ s("span", { className: "clarity-multiselect__chip-label", children: R.label }),
523
- !i && /* @__PURE__ */ s(
516
+ !r && /* @__PURE__ */ s(
524
517
  "button",
525
518
  {
526
519
  type: "button",
@@ -531,48 +524,48 @@ const lt = Ke(({
531
524
  }
532
525
  )
533
526
  ] }, R.value)),
534
- U > 0 && /* @__PURE__ */ _("div", { className: "clarity-multiselect__chip clarity-multiselect__chip--count", children: [
527
+ U > 0 && /* @__PURE__ */ C("div", { className: "clarity-multiselect__chip clarity-multiselect__chip--count", children: [
535
528
  "+",
536
529
  U,
537
530
  " mais"
538
531
  ] })
539
532
  ] });
540
- }, ie = [
533
+ }, re = [
541
534
  "clarity-multiselect-wrapper",
542
535
  p
543
536
  ].filter(Boolean).join(" "), oe = [
544
537
  "clarity-multiselect",
545
- `clarity-multiselect--${c}`,
538
+ `clarity-multiselect--${o}`,
546
539
  `clarity-multiselect--${d}`,
547
540
  T && "clarity-multiselect--open",
548
- x && "clarity-multiselect--focused",
549
- ne && "clarity-multiselect--label-up",
550
- o && "clarity-multiselect--error",
551
- i && "clarity-multiselect--disabled",
541
+ k && "clarity-multiselect--focused",
542
+ le && "clarity-multiselect--label-up",
543
+ c && "clarity-multiselect--error",
544
+ r && "clarity-multiselect--disabled",
552
545
  t.length > 0 && "clarity-multiselect--has-value"
553
546
  ].filter(Boolean).join(" ");
554
- return /* @__PURE__ */ _("div", { className: ie, children: [
555
- /* @__PURE__ */ _(
547
+ return /* @__PURE__ */ C("div", { className: re, children: [
548
+ /* @__PURE__ */ C(
556
549
  "div",
557
550
  {
558
551
  ref: g,
559
552
  className: oe,
560
553
  "data-testid": b,
561
- ...w,
554
+ ..._,
562
555
  children: [
563
- /* @__PURE__ */ _(
556
+ /* @__PURE__ */ C(
564
557
  "div",
565
558
  {
566
559
  className: "clarity-multiselect__field",
567
560
  onClick: V,
568
561
  children: [
569
- l && /* @__PURE__ */ _("label", { className: "clarity-multiselect__label", children: [
570
- l,
562
+ n && /* @__PURE__ */ C("label", { className: "clarity-multiselect__label", children: [
563
+ n,
571
564
  y && /* @__PURE__ */ s("span", { className: "clarity-multiselect__required", children: "*" })
572
565
  ] }),
573
- /* @__PURE__ */ s("div", { className: "clarity-multiselect__content", children: t.length > 0 ? re() : /* @__PURE__ */ s("span", { className: "clarity-multiselect__placeholder", children: n }) }),
574
- /* @__PURE__ */ _("div", { className: "clarity-multiselect__icons", children: [
575
- t.length > 0 && !i && /* @__PURE__ */ s(
566
+ /* @__PURE__ */ s("div", { className: "clarity-multiselect__content", children: t.length > 0 ? ie() : /* @__PURE__ */ s("span", { className: "clarity-multiselect__placeholder", children: l }) }),
567
+ /* @__PURE__ */ C("div", { className: "clarity-multiselect__icons", children: [
568
+ t.length > 0 && !r && /* @__PURE__ */ s(
576
569
  "button",
577
570
  {
578
571
  type: "button",
@@ -596,7 +589,7 @@ const lt = Ke(({
596
589
  ]
597
590
  }
598
591
  ),
599
- T && /* @__PURE__ */ _("div", { ref: O, className: "clarity-multiselect__dropdown", children: [
592
+ T && /* @__PURE__ */ C("div", { ref: O, className: "clarity-multiselect__dropdown", children: [
600
593
  /* @__PURE__ */ s("div", { className: "clarity-multiselect__search", children: /* @__PURE__ */ s(
601
594
  "input",
602
595
  {
@@ -604,14 +597,14 @@ const lt = Ke(({
604
597
  type: "text",
605
598
  className: "clarity-multiselect__search-input",
606
599
  placeholder: "Buscar opções...",
607
- value: k,
600
+ value: $,
608
601
  onChange: G,
609
602
  onKeyDown: M
610
603
  }
611
604
  ) }),
612
605
  /* @__PURE__ */ s("ul", { className: "clarity-multiselect__options", children: H.length > 0 ? H.map((N) => {
613
- const D = t.includes(N.value), U = N.disabled || i;
614
- return /* @__PURE__ */ _(
606
+ const D = t.includes(N.value), U = N.disabled || r;
607
+ return /* @__PURE__ */ C(
615
608
  "li",
616
609
  {
617
610
  className: [
@@ -644,10 +637,10 @@ const lt = Ke(({
644
637
  ]
645
638
  }
646
639
  ),
647
- (r || o && f) && /* @__PURE__ */ s("div", { className: "clarity-multiselect__helper", children: o && f ? /* @__PURE__ */ s("span", { className: "clarity-multiselect__error-message", children: f }) : r && /* @__PURE__ */ s("span", { className: "clarity-multiselect__helper-text", children: r }) })
640
+ (i || c && f) && /* @__PURE__ */ s("div", { className: "clarity-multiselect__helper", children: c && f ? /* @__PURE__ */ s("span", { className: "clarity-multiselect__error-message", children: f }) : i && /* @__PURE__ */ s("span", { className: "clarity-multiselect__helper-text", children: i }) })
648
641
  ] });
649
642
  });
650
- lt.displayName = "MultiSelect";
643
+ nt.displayName = "MultiSelect";
651
644
  const fe = z(null), pe = () => {
652
645
  const e = q(fe);
653
646
  if (!e)
@@ -658,34 +651,34 @@ const fe = z(null), pe = () => {
658
651
  className: t = "",
659
652
  title: a
660
653
  }) => {
661
- const { onClose: n, variant: l, showCloseButton: r } = pe(), o = [
654
+ const { onClose: l, variant: n, showCloseButton: i } = pe(), c = [
662
655
  "clarity-modal-header",
663
656
  t,
664
- l && `clarity-modal-header--${l}`
657
+ n && `clarity-modal-header--${n}`
665
658
  ].filter(Boolean).join(" "), f = [
666
659
  "clarity-modal-close",
667
- l && `clarity-modal-close--${l}`
660
+ n && `clarity-modal-close--${n}`
668
661
  ].filter(Boolean).join(" ");
669
- return /* @__PURE__ */ _("div", { className: o, children: [
662
+ return /* @__PURE__ */ C("div", { className: c, children: [
670
663
  a && /* @__PURE__ */ s("h2", { className: "clarity-modal-title", children: a }),
671
664
  e,
672
- r && /* @__PURE__ */ s("button", { className: f, onClick: (i) => {
673
- i.stopPropagation(), n();
665
+ i && /* @__PURE__ */ s("button", { className: f, onClick: (r) => {
666
+ r.stopPropagation(), l();
674
667
  }, children: "×" })
675
668
  ] });
676
669
  };
677
670
  he.displayName = "Modal.Header";
678
671
  const ye = ({ children: e, className: t = "" }) => /* @__PURE__ */ s("div", { className: `clarity-modal-content ${t}`, children: e });
679
672
  ye.displayName = "Modal.Content";
680
- const ve = ({ children: e, className: t = "" }) => /* @__PURE__ */ _("div", { className: `clarity-modal-footer ${t}`, children: [
673
+ const ve = ({ children: e, className: t = "" }) => /* @__PURE__ */ C("div", { className: `clarity-modal-footer ${t}`, children: [
681
674
  /* @__PURE__ */ s("div", { className: "clarity-modal-scroll-indicator" }),
682
675
  e
683
676
  ] });
684
677
  ve.displayName = "Modal.Footer";
685
678
  const Ne = ({ children: e, onClick: t, variant: a }) => W(e, {
686
- onClick: (n) => {
687
- var l, r;
688
- t == null || t(), (r = (l = e.props).onClick) == null || r.call(l, n);
679
+ onClick: (l) => {
680
+ var n, i;
681
+ t == null || t(), (i = (n = e.props).onClick) == null || i.call(n, l);
689
682
  },
690
683
  variant: a
691
684
  });
@@ -694,8 +687,8 @@ const be = ({ children: e }) => {
694
687
  const { onClose: t } = pe();
695
688
  return W(e, {
696
689
  onClick: (a) => {
697
- var n, l;
698
- t(), (l = (n = e.props).onClick) == null || l.call(n, a);
690
+ var l, n;
691
+ t(), (n = (l = e.props).onClick) == null || n.call(l, a);
699
692
  }
700
693
  });
701
694
  };
@@ -704,36 +697,36 @@ const J = ({
704
697
  isOpen: e,
705
698
  onClose: t,
706
699
  onOpen: a,
707
- children: n,
708
- className: l = "",
709
- variant: r,
710
- size: o = "medium",
700
+ children: l,
701
+ className: n = "",
702
+ variant: i,
703
+ size: c = "medium",
711
704
  showCloseButton: f = !0,
712
- closeOnOverlayClick: i = !0
705
+ closeOnOverlayClick: r = !0
713
706
  }) => {
714
- const [c, d] = B(!1), m = e !== void 0 ? e : c, p = t || (() => {
707
+ const [o, d] = x(!1), m = e !== void 0 ? e : o, p = t || (() => {
715
708
  d(!1);
716
709
  });
717
710
  S(() => {
718
711
  m && (a == null || a());
719
712
  }, [m, a]), S(() => {
720
- const w = ($) => {
721
- $.key === "Escape" && p();
713
+ const _ = (B) => {
714
+ B.key === "Escape" && p();
722
715
  };
723
- return m ? (document.addEventListener("keydown", w), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
724
- document.removeEventListener("keydown", w), document.body.style.overflow = "unset";
716
+ return m ? (document.addEventListener("keydown", _), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
717
+ document.removeEventListener("keydown", _), document.body.style.overflow = "unset";
725
718
  };
726
719
  }, [m, p]);
727
- const h = (w) => {
728
- i && w.target === w.currentTarget && p();
729
- }, u = E.Children.toArray(n).find(
730
- (w) => Z(w) && w.type.displayName === "Modal.Trigger"
731
- ), y = E.Children.toArray(n).filter(
732
- (w) => Z(w) && w.type.displayName !== "Modal.Trigger"
733
- ), b = ["clarity-modal", l, `clarity-modal--${o}`].filter(Boolean).join(" ");
734
- return /* @__PURE__ */ _(fe.Provider, { value: { onClose: p, variant: r, showCloseButton: f }, children: [
735
- u && W(u, { onClick: () => d(!0), variant: r }),
736
- m && /* @__PURE__ */ s("div", { className: "clarity-modal-overlay", onClick: h, children: /* @__PURE__ */ s("div", { className: b, children: y }) })
720
+ const u = (_) => {
721
+ r && _.target === _.currentTarget && p();
722
+ }, h = E.Children.toArray(l).find(
723
+ (_) => Z(_) && _.type.displayName === "Modal.Trigger"
724
+ ), y = E.Children.toArray(l).filter(
725
+ (_) => Z(_) && _.type.displayName !== "Modal.Trigger"
726
+ ), b = ["clarity-modal", n, `clarity-modal--${c}`].filter(Boolean).join(" ");
727
+ return /* @__PURE__ */ C(fe.Provider, { value: { onClose: p, variant: i, showCloseButton: f }, children: [
728
+ h && W(h, { onClick: () => d(!0), variant: i }),
729
+ m && /* @__PURE__ */ s("div", { className: "clarity-modal-overlay", onClick: u, children: /* @__PURE__ */ s("div", { className: b, children: y }) })
737
730
  ] });
738
731
  };
739
732
  J.Header = he;
@@ -747,70 +740,70 @@ const Ce = z(void 0), kt = () => {
747
740
  if (!e)
748
741
  throw new Error("useToast must be used within a ToastProvider");
749
742
  return e;
750
- }, rt = ({ id: e, message: t, variant: a, duration: n, onClose: l, invertColors: r }) => {
751
- const [o, f] = B("entering");
743
+ }, it = ({ id: e, message: t, variant: a, duration: l, onClose: n, invertColors: i }) => {
744
+ const [c, f] = x("entering");
752
745
  S(() => {
753
- const c = setTimeout(() => {
746
+ const o = setTimeout(() => {
754
747
  f("visible");
755
748
  }, 10), d = setTimeout(() => {
756
749
  f("exiting");
757
- }, n * 1e3 - 300), v = setTimeout(() => {
758
- l(e);
759
- }, n * 1e3);
750
+ }, l * 1e3 - 300), v = setTimeout(() => {
751
+ n(e);
752
+ }, l * 1e3);
760
753
  return () => {
761
- clearTimeout(c), clearTimeout(d), clearTimeout(v);
754
+ clearTimeout(o), clearTimeout(d), clearTimeout(v);
762
755
  };
763
- }, [e, n, l]);
764
- const i = [
756
+ }, [e, l, n]);
757
+ const r = [
765
758
  "cl-toast",
766
759
  a,
767
- r ? "colored-background" : "",
768
- `cl-toast-${o}`
760
+ i ? "colored-background" : "",
761
+ `cl-toast-${c}`
769
762
  ].filter(Boolean).join(" ");
770
- return /* @__PURE__ */ _("div", { className: i, children: [
763
+ return /* @__PURE__ */ C("div", { className: r, children: [
771
764
  /* @__PURE__ */ s("div", { className: "cl-toast-message", children: t }),
772
765
  /* @__PURE__ */ s("button", { onClick: () => f("exiting"), className: "cl-toast-close-button", children: "×" }),
773
766
  /* @__PURE__ */ s(
774
767
  "div",
775
768
  {
776
769
  className: "cl-toast-progress-bar",
777
- style: { animationDuration: `${n}s` }
770
+ style: { animationDuration: `${l}s` }
778
771
  }
779
772
  )
780
773
  ] });
781
774
  }, xt = ({ children: e }) => {
782
- const [t, a] = B([]), n = Y(() => {
775
+ const [t, a] = x([]), l = Y(() => {
783
776
  if (typeof document < "u") {
784
- const i = document.createElement("div");
785
- return i.id = "toast-portal-root", i;
777
+ const r = document.createElement("div");
778
+ return r.id = "toast-portal-root", r;
786
779
  }
787
780
  return null;
788
781
  }, []);
789
782
  S(() => {
790
- if (n)
791
- return document.body.appendChild(n), () => {
792
- document.body.removeChild(n);
783
+ if (l)
784
+ return document.body.appendChild(l), () => {
785
+ document.body.removeChild(l);
793
786
  };
794
- }, [n]);
795
- const l = le((i) => {
787
+ }, [l]);
788
+ const n = ne((r) => {
796
789
  const d = {
797
790
  id: (/* @__PURE__ */ new Date()).toISOString() + Math.random(),
798
791
  // duration: 5,
799
792
  // position: 'right-top',
800
- ...i
793
+ ...r
801
794
  };
802
795
  a((v) => {
803
796
  const m = [d, ...v];
804
797
  return m.length > 4 ? m.slice(0, 4) : m;
805
798
  });
806
- }, []), r = le((i) => {
807
- a((c) => c.filter((d) => d.id !== i));
808
- }, []), o = Y(() => t.reduce((i, c) => (i[c.position] || (i[c.position] = []), i[c.position].push(c), i), {}), [t]), f = Y(() => ({ show: l }), [l]);
809
- return /* @__PURE__ */ _(Ce.Provider, { value: f, children: [
799
+ }, []), i = ne((r) => {
800
+ a((o) => o.filter((d) => d.id !== r));
801
+ }, []), c = Y(() => t.reduce((r, o) => (r[o.position] || (r[o.position] = []), r[o.position].push(o), r), {}), [t]), f = Y(() => ({ show: n }), [n]);
802
+ return /* @__PURE__ */ C(Ce.Provider, { value: f, children: [
810
803
  e,
811
- n && tt.createPortal(
812
- Object.entries(o).map(([i, c]) => /* @__PURE__ */ s("div", { className: `cl-toast-container ${i}`, children: c.map((d) => /* @__PURE__ */ s(rt, { ...d, onClose: r }, d.id)) }, i)),
813
- n
804
+ l && tt.createPortal(
805
+ Object.entries(c).map(([r, o]) => /* @__PURE__ */ s("div", { className: `cl-toast-container ${r}`, children: o.map((d) => /* @__PURE__ */ s(it, { ...d, onClose: i }, d.id)) }, r)),
806
+ l
814
807
  )
815
808
  ] });
816
809
  }, _e = z(null), we = () => {
@@ -822,21 +815,21 @@ const Ce = z(void 0), kt = () => {
822
815
  children: e,
823
816
  className: t = ""
824
817
  }) => {
825
- const { onClose: a, variant: n, showCloseButton: l, title: r } = we(), o = [
818
+ const { onClose: a, variant: l, showCloseButton: n, title: i } = we(), c = [
826
819
  "clarity-offcanvas-header",
827
820
  t
828
821
  ].filter(Boolean).join(" "), f = [
829
822
  "clarity-offcanvas-close",
830
- n && `clarity-offcanvas-close--${n}`
831
- ].filter(Boolean).join(" "), i = [
823
+ l && `clarity-offcanvas-close--${l}`
824
+ ].filter(Boolean).join(" "), r = [
832
825
  "clarity-offcanvas-title",
833
- n && `clarity-offcanvas-title--${n}`
826
+ l && `clarity-offcanvas-title--${l}`
834
827
  ].filter(Boolean).join(" ");
835
- return /* @__PURE__ */ _("div", { className: o, children: [
836
- r && /* @__PURE__ */ s("h2", { className: i, children: r }),
828
+ return /* @__PURE__ */ C("div", { className: c, children: [
829
+ i && /* @__PURE__ */ s("h2", { className: r, children: i }),
837
830
  e,
838
- l && /* @__PURE__ */ s("button", { className: f, onClick: (c) => {
839
- c.stopPropagation(), a();
831
+ n && /* @__PURE__ */ s("button", { className: f, onClick: (o) => {
832
+ o.stopPropagation(), a();
840
833
  }, children: "×" })
841
834
  ] });
842
835
  };
@@ -844,9 +837,9 @@ ge.displayName = "Offcanvas.Header";
844
837
  const $e = ({ children: e, className: t = "" }) => /* @__PURE__ */ s("div", { className: `clarity-offcanvas-content ${t}`, children: e });
845
838
  $e.displayName = "Offcanvas.Content";
846
839
  const ke = ({ children: e, onClick: t, variant: a }) => W(e, {
847
- onClick: (n) => {
848
- var l, r;
849
- t == null || t(), (r = (l = e.props).onClick) == null || r.call(l, n);
840
+ onClick: (l) => {
841
+ var n, i;
842
+ t == null || t(), (i = (n = e.props).onClick) == null || i.call(n, l);
850
843
  },
851
844
  variant: a
852
845
  });
@@ -857,8 +850,8 @@ const xe = ({ children: e }) => {
857
850
  const { onClose: t } = we();
858
851
  return W(e, {
859
852
  onClick: (a) => {
860
- var n, l;
861
- t(), (l = (n = e.props).onClick) == null || l.call(n, a);
853
+ var l, n;
854
+ t(), (n = (l = e.props).onClick) == null || n.call(l, a);
862
855
  }
863
856
  });
864
857
  };
@@ -867,22 +860,22 @@ const K = ({
867
860
  isOpen: e,
868
861
  onClose: t,
869
862
  onOpen: a,
870
- children: n,
871
- className: l = "",
872
- variant: r,
873
- placement: o = "right",
863
+ children: l,
864
+ className: n = "",
865
+ variant: i,
866
+ placement: c = "right",
874
867
  closeOnOverlayClick: f = !0,
875
- showCloseButton: i = !0,
876
- title: c
868
+ showCloseButton: r = !0,
869
+ title: o
877
870
  }) => {
878
- const [d, v] = B(!1), [m, p] = B(!1), [h, u] = B(!1), y = e !== void 0, b = y ? e : d, w = le(() => {
871
+ const [d, v] = x(!1), [m, p] = x(!1), [u, h] = x(!1), y = e !== void 0, b = y ? e : d, _ = ne(() => {
879
872
  t ? t() : v(!1);
880
- }, [t]), $ = le(() => {
873
+ }, [t]), B = ne(() => {
881
874
  y || v(!0), a == null || a();
882
875
  }, [y, a]);
883
876
  S(() => {
884
877
  if (b) {
885
- u(!0);
878
+ h(!0);
886
879
  const g = setTimeout(() => {
887
880
  p(!0);
888
881
  }, 50);
@@ -890,55 +883,55 @@ const K = ({
890
883
  } else {
891
884
  p(!1);
892
885
  const g = setTimeout(() => {
893
- u(!1);
886
+ h(!1);
894
887
  }, 300);
895
888
  return () => clearTimeout(g);
896
889
  }
897
890
  }, [b]), S(() => {
898
891
  const g = (H) => {
899
- H.key === "Escape" && w();
892
+ H.key === "Escape" && _();
900
893
  };
901
894
  return b ? (document.addEventListener("keydown", g), document.body.style.overflow = "hidden") : (document.removeEventListener("keydown", g), document.body.style.overflow = "unset"), () => {
902
895
  document.removeEventListener("keydown", g), document.body.style.overflow = "unset";
903
896
  };
904
- }, [b, w]);
897
+ }, [b, _]);
905
898
  const T = (g) => {
906
- f && g.target === g.currentTarget && w();
907
- }, C = E.Children.toArray(n);
908
- let k, L, x, j, I;
909
- C.forEach((g) => {
899
+ f && g.target === g.currentTarget && _();
900
+ }, w = E.Children.toArray(l);
901
+ let $, L, k, j, I;
902
+ w.forEach((g) => {
910
903
  if (Z(g))
911
904
  if (g.type.displayName === "Offcanvas.Trigger")
912
- k = g;
905
+ $ = g;
913
906
  else if (g.type.displayName === "Offcanvas.Header")
914
907
  L = g;
915
908
  else if (g.type.displayName === "Offcanvas.Content") {
916
- x = g;
917
- const V = E.Children.toArray(x.props.children).filter((F) => Z(F) && F.type.displayName === "Offcanvas.Close" ? (I = F, !1) : !0);
918
- x = W(x, { children: V });
909
+ k = g;
910
+ const V = E.Children.toArray(k.props.children).filter((F) => Z(F) && F.type.displayName === "Offcanvas.Close" ? (I = F, !1) : !0);
911
+ k = W(k, { children: V });
919
912
  } else g.type.displayName === "Offcanvas.Footer" && (j = g);
920
913
  }), I && (j ? j = W(j, {
921
- children: /* @__PURE__ */ _(Ze, { children: [
914
+ children: /* @__PURE__ */ C(Ze, { children: [
922
915
  j.props.children,
923
916
  I
924
917
  ] })
925
918
  }) : j = /* @__PURE__ */ s(ce, { children: I }));
926
919
  const A = [
927
920
  "clarity-offcanvas",
928
- l,
929
- `clarity-offcanvas--${o}`,
930
- r && `clarity-offcanvas--${r}`,
921
+ n,
922
+ `clarity-offcanvas--${c}`,
923
+ i && `clarity-offcanvas--${i}`,
931
924
  m ? "clarity-offcanvas--open" : "clarity-offcanvas--closed"
932
925
  ].filter(Boolean).join(" "), O = [
933
926
  "clarity-offcanvas-overlay",
934
927
  m ? "clarity-offcanvas-overlay--visible" : ""
935
928
  ].filter(Boolean).join(" ");
936
- return /* @__PURE__ */ _(_e.Provider, { value: { onClose: w, variant: r, showCloseButton: i, placement: o, title: c }, children: [
937
- k && W(k, { onClick: $, variant: r }),
938
- h && // Only render if shouldRender is true
939
- /* @__PURE__ */ s("div", { className: O, onClick: T, children: /* @__PURE__ */ _("div", { className: A, children: [
929
+ return /* @__PURE__ */ C(_e.Provider, { value: { onClose: _, variant: i, showCloseButton: r, placement: c, title: o }, children: [
930
+ $ && W($, { onClick: B, variant: i }),
931
+ u && // Only render if shouldRender is true
932
+ /* @__PURE__ */ s("div", { className: O, onClick: T, children: /* @__PURE__ */ C("div", { className: A, children: [
940
933
  L,
941
- x,
934
+ k,
942
935
  j && /* @__PURE__ */ s("div", { className: "clarity-offcanvas-scroll-indicator" }),
943
936
  " ",
944
937
  j
@@ -951,54 +944,54 @@ K.Footer = ce;
951
944
  K.Trigger = ke;
952
945
  K.Close = xe;
953
946
  K.displayName = "Offcanvas";
954
- const it = E.forwardRef(({
947
+ const rt = E.forwardRef(({
955
948
  type: e,
956
949
  variant: t = "primary",
957
950
  size: a = "medium",
958
- label: n,
959
- helperText: l,
960
- error: r = !1,
961
- errorMessage: o,
951
+ label: l,
952
+ helperText: n,
953
+ error: i = !1,
954
+ errorMessage: c,
962
955
  labelPosition: f = "right",
963
- className: i = "",
964
- disabled: c = !1,
956
+ className: r = "",
957
+ disabled: o = !1,
965
958
  checked: d,
966
959
  id: v,
967
960
  ...m
968
961
  }, p) => {
969
- const h = v || `check-input-${Math.random().toString(36).substr(2, 9)}`, u = [
962
+ const u = v || `check-input-${Math.random().toString(36).substr(2, 9)}`, h = [
970
963
  "clarity-check-input-wrapper",
971
964
  `clarity-check-input-wrapper--${f}`,
972
- c && "clarity-check-input-wrapper--disabled",
973
- r && "clarity-check-input-wrapper--error"
965
+ o && "clarity-check-input-wrapper--disabled",
966
+ i && "clarity-check-input-wrapper--error"
974
967
  ].filter(Boolean).join(" "), y = [
975
968
  "clarity-check-input",
976
969
  `clarity-check-input--${e}`,
977
970
  `clarity-check-input--${a}`,
978
971
  t && `clarity-check-input--${t}`,
979
- r && "clarity-check-input--error",
980
- c && "clarity-check-input--disabled",
981
- i
972
+ i && "clarity-check-input--error",
973
+ o && "clarity-check-input--disabled",
974
+ r
982
975
  ].filter(Boolean).join(" "), b = [
983
976
  "clarity-check-input__label",
984
977
  `clarity-check-input__label--${a}`,
985
- c && "clarity-check-input__label--disabled"
978
+ o && "clarity-check-input__label--disabled"
986
979
  ].filter(Boolean).join(" ");
987
- return /* @__PURE__ */ _("div", { className: "clarity-check-input-container", children: [
988
- /* @__PURE__ */ _("label", { className: u, htmlFor: h, children: [
980
+ return /* @__PURE__ */ C("div", { className: "clarity-check-input-container", children: [
981
+ /* @__PURE__ */ C("label", { className: h, htmlFor: u, children: [
989
982
  /* @__PURE__ */ s(
990
983
  "input",
991
984
  {
992
985
  ref: p,
993
- id: h,
986
+ id: u,
994
987
  type: e,
995
988
  className: y,
996
- disabled: c,
989
+ disabled: o,
997
990
  checked: d,
998
991
  ...m
999
992
  }
1000
993
  ),
1001
- /* @__PURE__ */ _("div", { className: "clarity-check-input__custom", children: [
994
+ /* @__PURE__ */ C("div", { className: "clarity-check-input__custom", children: [
1002
995
  e === "checkbox" && /* @__PURE__ */ s(
1003
996
  "svg",
1004
997
  {
@@ -1020,61 +1013,61 @@ const it = E.forwardRef(({
1020
1013
  ),
1021
1014
  e === "radio" && /* @__PURE__ */ s("div", { className: "clarity-check-input__radio-dot" })
1022
1015
  ] }),
1023
- n && /* @__PURE__ */ s("span", { className: b, children: n })
1016
+ l && /* @__PURE__ */ s("span", { className: b, children: l })
1024
1017
  ] }),
1025
- (l || r && o) && /* @__PURE__ */ s("div", { className: "clarity-check-input__helper-text", children: r && o ? o : l })
1018
+ (n || i && c) && /* @__PURE__ */ s("div", { className: "clarity-check-input__helper-text", children: i && c ? c : n })
1026
1019
  ] });
1027
1020
  });
1028
- it.displayName = "CheckInput";
1021
+ rt.displayName = "CheckInput";
1029
1022
  const ot = E.forwardRef(({
1030
1023
  variant: e = "primary",
1031
1024
  size: t = "medium",
1032
1025
  label: a,
1033
- helperText: n,
1034
- error: l = !1,
1035
- errorMessage: r,
1036
- labelPosition: o = "right",
1026
+ helperText: l,
1027
+ error: n = !1,
1028
+ errorMessage: i,
1029
+ labelPosition: c = "right",
1037
1030
  className: f = "",
1038
- disabled: i = !1,
1039
- checked: c,
1031
+ disabled: r = !1,
1032
+ checked: o,
1040
1033
  id: d,
1041
1034
  ...v
1042
1035
  }, m) => {
1043
- const p = d || `input-switch-${Math.random().toString(36).substr(2, 9)}`, h = [
1036
+ const p = d || `input-switch-${Math.random().toString(36).substr(2, 9)}`, u = [
1044
1037
  "clarity-input-switch-wrapper",
1045
- `clarity-input-switch-wrapper--${o}`,
1046
- i && "clarity-input-switch-wrapper--disabled",
1047
- l && "clarity-input-switch-wrapper--error"
1048
- ].filter(Boolean).join(" "), u = [
1038
+ `clarity-input-switch-wrapper--${c}`,
1039
+ r && "clarity-input-switch-wrapper--disabled",
1040
+ n && "clarity-input-switch-wrapper--error"
1041
+ ].filter(Boolean).join(" "), h = [
1049
1042
  "clarity-input-switch",
1050
1043
  `clarity-input-switch--${t}`,
1051
1044
  e && `clarity-input-switch--${e}`,
1052
- l && "clarity-input-switch--error",
1053
- i && "clarity-input-switch--disabled",
1045
+ n && "clarity-input-switch--error",
1046
+ r && "clarity-input-switch--disabled",
1054
1047
  f
1055
1048
  ].filter(Boolean).join(" "), y = [
1056
1049
  "clarity-input-switch__label",
1057
1050
  `clarity-input-switch__label--${t}`,
1058
- i && "clarity-input-switch__label--disabled"
1051
+ r && "clarity-input-switch__label--disabled"
1059
1052
  ].filter(Boolean).join(" ");
1060
- return /* @__PURE__ */ _("div", { className: "clarity-input-switch-container", children: [
1061
- /* @__PURE__ */ _("label", { className: h, htmlFor: p, children: [
1053
+ return /* @__PURE__ */ C("div", { className: "clarity-input-switch-container", children: [
1054
+ /* @__PURE__ */ C("label", { className: u, htmlFor: p, children: [
1062
1055
  /* @__PURE__ */ s(
1063
1056
  "input",
1064
1057
  {
1065
1058
  ref: m,
1066
1059
  id: p,
1067
1060
  type: "checkbox",
1068
- className: u,
1069
- disabled: i,
1070
- checked: c,
1061
+ className: h,
1062
+ disabled: r,
1063
+ checked: o,
1071
1064
  ...v
1072
1065
  }
1073
1066
  ),
1074
1067
  /* @__PURE__ */ s("div", { className: "clarity-input-switch__track", children: /* @__PURE__ */ s("div", { className: "clarity-input-switch__thumb" }) }),
1075
1068
  a && /* @__PURE__ */ s("span", { className: y, children: a })
1076
1069
  ] }),
1077
- (n || l && r) && /* @__PURE__ */ s("div", { className: "clarity-input-switch__helper-text", children: l && r ? r : n })
1070
+ (l || n && i) && /* @__PURE__ */ s("div", { className: "clarity-input-switch__helper-text", children: n && i ? i : l })
1078
1071
  ] });
1079
1072
  });
1080
1073
  ot.displayName = "InputSwitch";
@@ -1084,8 +1077,8 @@ const Te = z(null), de = () => {
1084
1077
  throw new Error("useConfirmationDialog must be used within a ConfirmationDialog provider");
1085
1078
  return e;
1086
1079
  }, Be = ({ children: e, className: t = "" }) => {
1087
- const { variant: a } = de(), n = `clarity-confirmation-dialog-header ${t} clarity-confirmation-dialog-header--${a}`;
1088
- return /* @__PURE__ */ s("div", { className: n, children: e });
1080
+ const { variant: a } = de(), l = `clarity-confirmation-dialog-header ${t} clarity-confirmation-dialog-header--${a}`;
1081
+ return /* @__PURE__ */ s("div", { className: l, children: e });
1089
1082
  };
1090
1083
  Be.displayName = "ConfirmationDialog.Header";
1091
1084
  const je = ({ children: e, className: t = "" }) => /* @__PURE__ */ s("div", { className: `clarity-confirmation-dialog-content ${t}`, children: e });
@@ -1094,8 +1087,8 @@ const Ee = ({ children: e, className: t = "" }) => /* @__PURE__ */ s("div", { cl
1094
1087
  Ee.displayName = "ConfirmationDialog.Footer";
1095
1088
  const Le = ({ children: e }) => W(e, {
1096
1089
  onClick: (t) => {
1097
- var a, n;
1098
- (n = (a = e.props).onClick) == null || n.call(a, t);
1090
+ var a, l;
1091
+ (l = (a = e.props).onClick) == null || l.call(a, t);
1099
1092
  }
1100
1093
  });
1101
1094
  Le.displayName = "ConfirmationDialog.Trigger";
@@ -1103,8 +1096,8 @@ const Oe = ({ children: e }) => {
1103
1096
  const { onClose: t } = de();
1104
1097
  return W(e, {
1105
1098
  onClick: (a) => {
1106
- var n, l;
1107
- t(), (l = (n = e.props).onClick) == null || l.call(n, a);
1099
+ var l, n;
1100
+ t(), (n = (l = e.props).onClick) == null || n.call(l, a);
1108
1101
  }
1109
1102
  });
1110
1103
  };
@@ -1113,8 +1106,8 @@ const Se = ({ children: e }) => {
1113
1106
  const { onConfirm: t } = de();
1114
1107
  return W(e, {
1115
1108
  onClick: (a) => {
1116
- var n, l;
1117
- t(), (l = (n = e.props).onClick) == null || l.call(n, a);
1109
+ var l, n;
1110
+ t(), (n = (l = e.props).onClick) == null || n.call(l, a);
1118
1111
  }
1119
1112
  });
1120
1113
  };
@@ -1123,32 +1116,32 @@ const Q = ({
1123
1116
  isOpen: e,
1124
1117
  onClose: t,
1125
1118
  onConfirm: a,
1126
- variant: n = "clarity-primary",
1127
- children: l
1119
+ variant: l = "clarity-primary",
1120
+ children: n
1128
1121
  }) => {
1129
- const [r, o] = B(!1), f = e !== void 0, i = f ? e : r, c = () => {
1130
- f || o(!0);
1122
+ const [i, c] = x(!1), f = e !== void 0, r = f ? e : i, o = () => {
1123
+ f || c(!0);
1131
1124
  }, d = () => {
1132
- t ? t() : o(!1);
1125
+ t ? t() : c(!1);
1133
1126
  }, v = () => {
1134
1127
  a && a(), d();
1135
1128
  };
1136
1129
  S(() => {
1137
- const u = (y) => {
1130
+ const h = (y) => {
1138
1131
  y.key === "Escape" && d();
1139
1132
  };
1140
- return i ? (document.addEventListener("keydown", u), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
1141
- document.removeEventListener("keydown", u), document.body.style.overflow = "unset";
1133
+ return r ? (document.addEventListener("keydown", h), document.body.style.overflow = "hidden") : document.body.style.overflow = "unset", () => {
1134
+ document.removeEventListener("keydown", h), document.body.style.overflow = "unset";
1142
1135
  };
1143
- }, [i, d]);
1144
- const m = E.Children.toArray(l).find(
1145
- (u) => Z(u) && u.type.displayName === "ConfirmationDialog.Trigger"
1146
- ), p = E.Children.toArray(l).filter(
1147
- (u) => Z(u) && u.type.displayName !== "ConfirmationDialog.Trigger"
1148
- ), h = `clarity-confirmation-dialog clarity-confirmation-dialog--${n}`;
1149
- return /* @__PURE__ */ _(Te.Provider, { value: { variant: n, onClose: d, onConfirm: v, onOpen: c }, children: [
1136
+ }, [r, d]);
1137
+ const m = E.Children.toArray(n).find(
1138
+ (h) => Z(h) && h.type.displayName === "ConfirmationDialog.Trigger"
1139
+ ), p = E.Children.toArray(n).filter(
1140
+ (h) => Z(h) && h.type.displayName !== "ConfirmationDialog.Trigger"
1141
+ ), u = `clarity-confirmation-dialog clarity-confirmation-dialog--${l}`;
1142
+ return /* @__PURE__ */ C(Te.Provider, { value: { variant: l, onClose: d, onConfirm: v, onOpen: o }, children: [
1150
1143
  m,
1151
- i && /* @__PURE__ */ s("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ s("div", { className: h, children: p }) })
1144
+ r && /* @__PURE__ */ s("div", { className: "clarity-modal-overlay", children: /* @__PURE__ */ s("div", { className: u, children: p }) })
1152
1145
  ] });
1153
1146
  };
1154
1147
  Q.Header = Be;
@@ -1162,39 +1155,39 @@ const Tt = ({
1162
1155
  variant: e = "primary",
1163
1156
  size: t = "medium",
1164
1157
  disabled: a = !1,
1165
- loading: n = !1,
1166
- children: l,
1167
- onClick: r,
1168
- type: o = "button",
1158
+ loading: l = !1,
1159
+ children: n,
1160
+ onClick: i,
1161
+ type: c = "button",
1169
1162
  className: f = "",
1170
- "aria-label": i,
1171
- title: c,
1163
+ "aria-label": r,
1164
+ title: o,
1172
1165
  customColor: d,
1173
1166
  customColorHover: v,
1174
1167
  ...m
1175
1168
  }) => {
1176
- const p = "clarity-button-icon", h = [
1169
+ const p = "clarity-button-icon", u = [
1177
1170
  p,
1178
1171
  !d && `${p}--${e}`,
1179
1172
  `${p}--${t}`,
1180
- n && `${p}--loading`,
1173
+ l && `${p}--loading`,
1181
1174
  a && `${p}--disabled`,
1182
1175
  f
1183
- ].filter(Boolean).join(" "), u = {};
1184
- return d && (u["--button-icon-bg"] = d, u["--button-icon-hover-bg"] = v || `${d}E6`), /* @__PURE__ */ _(
1176
+ ].filter(Boolean).join(" "), h = {};
1177
+ return d && (h["--button-icon-bg"] = d, h["--button-icon-hover-bg"] = v || `${d}E6`), /* @__PURE__ */ C(
1185
1178
  "button",
1186
1179
  {
1187
- className: h,
1188
- disabled: a || n,
1189
- onClick: r,
1190
- type: o,
1191
- "aria-label": i,
1192
- title: c,
1193
- style: u,
1180
+ className: u,
1181
+ disabled: a || l,
1182
+ onClick: i,
1183
+ type: c,
1184
+ "aria-label": r,
1185
+ title: o,
1186
+ style: h,
1194
1187
  ...m,
1195
1188
  children: [
1196
- n && /* @__PURE__ */ s("div", { className: `${p}__spinner` }),
1197
- !n && l
1189
+ l && /* @__PURE__ */ s("div", { className: `${p}__spinner` }),
1190
+ !l && n
1198
1191
  ]
1199
1192
  }
1200
1193
  );
@@ -1202,51 +1195,51 @@ const Tt = ({
1202
1195
  variant: e = "primary",
1203
1196
  product: t,
1204
1197
  tone: a,
1205
- hoverTone: n,
1206
- size: l = "medium",
1207
- disabled: r = !1,
1208
- children: o,
1198
+ hoverTone: l,
1199
+ size: n = "medium",
1200
+ disabled: i = !1,
1201
+ children: c,
1209
1202
  onClick: f,
1210
- href: i,
1211
- target: c,
1203
+ href: r,
1204
+ target: o,
1212
1205
  rel: d,
1213
1206
  className: v = "",
1214
1207
  ...m
1215
1208
  }) => {
1216
- const p = "clarity-button-link", h = t && a, u = h ? `${p}--custom` : `${p}--${e}`, y = [
1209
+ const p = "clarity-button-link", u = t && a, h = u ? `${p}--custom` : `${p}--${e}`, y = [
1217
1210
  p,
1218
- u,
1219
- `${p}--${l}`,
1220
- r && `${p}--disabled`,
1211
+ h,
1212
+ `${p}--${n}`,
1213
+ i && `${p}--disabled`,
1221
1214
  v
1222
- ].filter(Boolean).join(" "), b = ($) => {
1223
- const T = parseInt($);
1215
+ ].filter(Boolean).join(" "), b = (B) => {
1216
+ const T = parseInt(B);
1224
1217
  return T >= 800 ? "900" : T >= 700 ? "800" : T >= 600 ? "700" : T >= 500 ? "600" : T >= 400 ? "500" : T >= 300 ? "400" : T >= 200 ? "300" : "200";
1225
- }, w = h ? {
1218
+ }, _ = u ? {
1226
1219
  "--custom-color": `var(--clarity-${t}-${a})`,
1227
- "--custom-hover-color": `var(--clarity-${t}-${n || b(a)})`
1220
+ "--custom-hover-color": `var(--clarity-${t}-${l || b(a)})`
1228
1221
  } : {};
1229
- return i ? /* @__PURE__ */ s(
1222
+ return r ? /* @__PURE__ */ s(
1230
1223
  "a",
1231
1224
  {
1232
- href: i,
1233
- target: c,
1234
- rel: d || (c === "_blank" ? "noopener noreferrer" : void 0),
1225
+ href: r,
1226
+ target: o,
1227
+ rel: d || (o === "_blank" ? "noopener noreferrer" : void 0),
1235
1228
  className: y,
1236
- style: w,
1237
- onClick: r ? void 0 : f,
1229
+ style: _,
1230
+ onClick: i ? void 0 : f,
1238
1231
  ...m,
1239
- children: o
1232
+ children: c
1240
1233
  }
1241
1234
  ) : /* @__PURE__ */ s(
1242
1235
  "button",
1243
1236
  {
1244
1237
  className: y,
1245
- style: w,
1246
- disabled: r,
1238
+ style: _,
1239
+ disabled: i,
1247
1240
  onClick: f,
1248
1241
  ...m,
1249
- children: o
1242
+ children: c
1250
1243
  }
1251
1244
  );
1252
1245
  }, Ie = z(void 0), De = () => {
@@ -1258,91 +1251,91 @@ const Tt = ({
1258
1251
  variant: e = "primary",
1259
1252
  product: t,
1260
1253
  tone: a,
1261
- hoverTone: n,
1262
- defaultActiveKey: l,
1263
- alwaysOpen: r = !1,
1264
- flush: o = !1,
1254
+ hoverTone: l,
1255
+ defaultActiveKey: n,
1256
+ alwaysOpen: i = !1,
1257
+ flush: c = !1,
1265
1258
  className: f = "",
1266
- children: i,
1267
- onSelect: c,
1259
+ children: r,
1260
+ onSelect: o,
1268
1261
  ...d
1269
1262
  }) => {
1270
- const [v, m] = B(() => l ? Array.isArray(l) ? l : [l] : []), p = (C) => {
1271
- let k;
1272
- r ? k = v.includes(C) ? v.filter((L) => L !== C) : [...v, C] : k = v.includes(C) ? [] : [C], m(k), c && c(v.includes(C) ? null : C, {});
1273
- }, h = "clarity-accordion", u = t && a, y = u ? `${h}--custom` : `${h}--${e}`, b = [
1274
- h,
1263
+ const [v, m] = x(() => n ? Array.isArray(n) ? n : [n] : []), p = (w) => {
1264
+ let $;
1265
+ i ? $ = v.includes(w) ? v.filter((L) => L !== w) : [...v, w] : $ = v.includes(w) ? [] : [w], m($), o && o(v.includes(w) ? null : w, {});
1266
+ }, u = "clarity-accordion", h = t && a, y = h ? `${u}--custom` : `${u}--${e}`, b = [
1267
+ u,
1275
1268
  y,
1276
- o && `${h}--flush`,
1269
+ c && `${u}--flush`,
1277
1270
  f
1278
- ].filter(Boolean).join(" "), w = (C) => {
1279
- const k = parseInt(C);
1280
- return k >= 800 ? "900" : k >= 700 ? "800" : k >= 600 ? "700" : k >= 500 ? "600" : k >= 400 ? "500" : k >= 300 ? "400" : k >= 200 ? "300" : "200";
1281
- }, $ = u ? {
1271
+ ].filter(Boolean).join(" "), _ = (w) => {
1272
+ const $ = parseInt(w);
1273
+ return $ >= 800 ? "900" : $ >= 700 ? "800" : $ >= 600 ? "700" : $ >= 500 ? "600" : $ >= 400 ? "500" : $ >= 300 ? "400" : $ >= 200 ? "300" : "200";
1274
+ }, B = h ? {
1282
1275
  "--custom-border-color": `var(--clarity-${t}-${a})`,
1283
1276
  "--custom-header-color": `var(--clarity-${t}-${a})`,
1284
- "--custom-hover-color": `var(--clarity-${t}-${n || w(a)})`
1277
+ "--custom-hover-color": `var(--clarity-${t}-${l || _(a)})`
1285
1278
  } : {}, T = {
1286
1279
  activeKeys: v,
1287
1280
  toggleItem: p,
1288
- alwaysOpen: r,
1281
+ alwaysOpen: i,
1289
1282
  variant: e,
1290
1283
  product: t,
1291
1284
  tone: a,
1292
- hoverTone: n,
1293
- flush: o
1285
+ hoverTone: l,
1286
+ flush: c
1294
1287
  };
1295
- return /* @__PURE__ */ s(Ie.Provider, { value: T, children: /* @__PURE__ */ s("div", { className: b, style: $, ...d, children: i }) });
1288
+ return /* @__PURE__ */ s(Ie.Provider, { value: T, children: /* @__PURE__ */ s("div", { className: b, style: B, ...d, children: r }) });
1296
1289
  }, dt = ({
1297
1290
  eventKey: e,
1298
1291
  disabled: t = !1,
1299
1292
  className: a = "",
1300
- children: n,
1301
- ...l
1293
+ children: l,
1294
+ ...n
1302
1295
  }) => {
1303
- const { activeKeys: r } = De(), o = "clarity-accordion", f = r.includes(e), i = [
1304
- `${o}__item`,
1305
- f && `${o}__item--active`,
1306
- t && `${o}__item--disabled`,
1296
+ const { activeKeys: i } = De(), c = "clarity-accordion", f = i.includes(e), r = [
1297
+ `${c}__item`,
1298
+ f && `${c}__item--active`,
1299
+ t && `${c}__item--disabled`,
1307
1300
  a
1308
1301
  ].filter(Boolean).join(" ");
1309
- return /* @__PURE__ */ s("div", { className: i, ...l, children: E.Children.map(n, (c) => E.isValidElement(c) ? E.cloneElement(c, {
1310
- ...c.props,
1302
+ return /* @__PURE__ */ s("div", { className: r, ...n, children: E.Children.map(l, (o) => E.isValidElement(o) ? E.cloneElement(o, {
1303
+ ...o.props,
1311
1304
  eventKey: e,
1312
1305
  disabled: t,
1313
1306
  isActive: f
1314
- }) : c) });
1307
+ }) : o) });
1315
1308
  }, mt = ({
1316
1309
  className: e = "",
1317
1310
  children: t,
1318
1311
  onClick: a,
1319
- eventKey: n,
1320
- disabled: l = !1,
1321
- isActive: r = !1,
1322
- ...o
1312
+ eventKey: l,
1313
+ disabled: n = !1,
1314
+ isActive: i = !1,
1315
+ ...c
1323
1316
  }) => {
1324
- const { toggleItem: f } = De(), i = "clarity-accordion", c = (d) => {
1325
- !l && n && f(n), a == null || a(d);
1317
+ const { toggleItem: f } = De(), r = "clarity-accordion", o = (d) => {
1318
+ !n && l && f(l), a == null || a(d);
1326
1319
  };
1327
- return /* @__PURE__ */ _(
1320
+ return /* @__PURE__ */ C(
1328
1321
  "button",
1329
1322
  {
1330
- className: [`${i}__header`, e].filter(Boolean).join(" "),
1331
- onClick: c,
1332
- disabled: l,
1333
- "aria-expanded": r,
1334
- "aria-controls": n ? `${i}-collapse-${n}` : void 0,
1335
- ...o,
1323
+ className: [`${r}__header`, e].filter(Boolean).join(" "),
1324
+ onClick: o,
1325
+ disabled: n,
1326
+ "aria-expanded": i,
1327
+ "aria-controls": l ? `${r}-collapse-${l}` : void 0,
1328
+ ...c,
1336
1329
  children: [
1337
- /* @__PURE__ */ s("span", { className: `${i}__title`, children: t }),
1338
- /* @__PURE__ */ s("span", { className: `${i}__icon`, children: /* @__PURE__ */ s(
1330
+ /* @__PURE__ */ s("span", { className: `${r}__title`, children: t }),
1331
+ /* @__PURE__ */ s("span", { className: `${r}__icon`, children: /* @__PURE__ */ s(
1339
1332
  "svg",
1340
1333
  {
1341
1334
  width: "16",
1342
1335
  height: "16",
1343
1336
  viewBox: "0 0 16 16",
1344
1337
  fill: "currentColor",
1345
- className: r ? `${i}__icon--rotated` : "",
1338
+ className: i ? `${r}__icon--rotated` : "",
1346
1339
  children: /* @__PURE__ */ s("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" })
1347
1340
  }
1348
1341
  ) })
@@ -1353,19 +1346,19 @@ const Tt = ({
1353
1346
  className: e = "",
1354
1347
  children: t,
1355
1348
  eventKey: a,
1356
- isActive: n = !1,
1357
- ...l
1349
+ isActive: l = !1,
1350
+ ...n
1358
1351
  }) => {
1359
- const r = "clarity-accordion";
1352
+ const i = "clarity-accordion";
1360
1353
  return /* @__PURE__ */ s(
1361
1354
  "div",
1362
1355
  {
1363
- id: a ? `${r}-collapse-${a}` : void 0,
1356
+ id: a ? `${i}-collapse-${a}` : void 0,
1364
1357
  className: [
1365
- `${r}__collapse`,
1366
- n && `${r}__collapse--show`
1358
+ `${i}__collapse`,
1359
+ l && `${i}__collapse--show`
1367
1360
  ].filter(Boolean).join(" "),
1368
- children: /* @__PURE__ */ s("div", { className: [`${r}__body`, e].filter(Boolean).join(" "), ...l, children: t })
1361
+ children: /* @__PURE__ */ s("div", { className: [`${i}__body`, e].filter(Boolean).join(" "), ...n, children: t })
1369
1362
  }
1370
1363
  );
1371
1364
  }, jt = Object.assign(ct, {
@@ -1387,23 +1380,23 @@ const Tt = ({
1387
1380
  type: "button",
1388
1381
  ref: a,
1389
1382
  className: "dropdown__trigger",
1390
- onClick: () => t((n) => !n),
1383
+ onClick: () => t((l) => !l),
1391
1384
  "aria-haspopup": "true",
1392
1385
  children: e
1393
1386
  }
1394
1387
  );
1395
1388
  }, pt = ({ children: e }) => {
1396
- const { isOpen: t, contentRef: a, styles: n } = Ae();
1397
- return t ? /* @__PURE__ */ s("div", { ref: a, className: "dropdown__content", style: n, children: e }) : null;
1389
+ const { isOpen: t, contentRef: a, styles: l } = Ae();
1390
+ return t ? /* @__PURE__ */ s("div", { ref: a, className: "dropdown__content", style: l, children: e }) : null;
1398
1391
  }, ht = ({ children: e }) => /* @__PURE__ */ s("div", { className: "dropdown__menu", children: e }), yt = ({ as: e, children: t, ...a }) => /* @__PURE__ */ s(e || "a", { ...a, className: "dropdown__item", children: t }), vt = () => /* @__PURE__ */ s("hr", { className: "dropdown__separator" }), ae = ({ title: e, position: t = "bottom", children: a }) => {
1399
- const [n, l] = B(!1), [r, o] = B({}), f = P(null), i = P(null), c = P(null);
1392
+ const [l, n] = x(!1), [i, c] = x({}), f = P(null), r = P(null), o = P(null);
1400
1393
  return et(() => {
1401
- if (n) {
1402
- const d = i.current, v = c.current;
1394
+ if (l) {
1395
+ const d = r.current, v = o.current;
1403
1396
  if (!d || !v) return;
1404
- const m = d.getBoundingClientRect(), p = v.getBoundingClientRect(), h = window.innerHeight, u = window.innerWidth;
1397
+ const m = d.getBoundingClientRect(), p = v.getBoundingClientRect(), u = window.innerHeight, h = window.innerWidth;
1405
1398
  let y = t;
1406
- t === "bottom" && m.bottom + p.height > h && (y = "top"), t === "top" && m.top - p.height < 0 && (y = "bottom"), t === "right" && m.right + p.width > u && (y = "left"), t === "left" && m.left - p.width < 0 && (y = "right");
1399
+ t === "bottom" && m.bottom + p.height > u && (y = "top"), t === "top" && m.top - p.height < 0 && (y = "bottom"), t === "right" && m.right + p.width > h && (y = "left"), t === "left" && m.left - p.width < 0 && (y = "right");
1407
1400
  const b = {};
1408
1401
  switch (y) {
1409
1402
  case "top":
@@ -1420,16 +1413,16 @@ const Tt = ({
1420
1413
  b.top = m.height + 4, b.left = m.width / 2 - p.width / 2;
1421
1414
  break;
1422
1415
  }
1423
- o(b);
1416
+ c(b);
1424
1417
  }
1425
- }, [n, t]), S(() => {
1418
+ }, [l, t]), S(() => {
1426
1419
  const d = (v) => {
1427
- f.current && !f.current.contains(v.target) && l(!1);
1420
+ f.current && !f.current.contains(v.target) && n(!1);
1428
1421
  };
1429
1422
  return document.addEventListener("mousedown", d), () => {
1430
1423
  document.removeEventListener("mousedown", d);
1431
1424
  };
1432
- }, []), /* @__PURE__ */ s(Re.Provider, { value: { isOpen: n, setIsOpen: l, triggerRef: i, contentRef: c, styles: r }, children: /* @__PURE__ */ s(
1425
+ }, []), /* @__PURE__ */ s(Re.Provider, { value: { isOpen: l, setIsOpen: n, triggerRef: r, contentRef: o, styles: i }, children: /* @__PURE__ */ s(
1433
1426
  "div",
1434
1427
  {
1435
1428
  ref: f,
@@ -1450,18 +1443,18 @@ const Pe = z(null), Ve = () => {
1450
1443
  throw new Error("useTabs must be used within a Tabs provider");
1451
1444
  return e;
1452
1445
  }, Me = ({ id: e, label: t, className: a = "" }) => {
1453
- const { activeTab: n, setActiveTab: l, variant: r, orientation: o } = Ve(), f = n === e, i = [
1446
+ const { activeTab: l, setActiveTab: n, variant: i, orientation: c } = Ve(), f = l === e, r = [
1454
1447
  "clarity-tab",
1455
1448
  a,
1456
1449
  f ? "active" : "",
1457
- f ? `variant-${r}` : "",
1458
- `orientation-${o}`
1450
+ f ? `variant-${i}` : "",
1451
+ `orientation-${c}`
1459
1452
  ].filter(Boolean).join(" ");
1460
1453
  return /* @__PURE__ */ s(
1461
1454
  "button",
1462
1455
  {
1463
- className: i,
1464
- onClick: () => l(e),
1456
+ className: r,
1457
+ onClick: () => n(e),
1465
1458
  role: "tab",
1466
1459
  "aria-selected": f,
1467
1460
  children: /* @__PURE__ */ s("span", { className: "clarity-tab-label", children: t })
@@ -1470,31 +1463,31 @@ const Pe = z(null), Ve = () => {
1470
1463
  };
1471
1464
  Me.displayName = "Tabs.Tab";
1472
1465
  const He = ({ id: e, children: t, className: a = "" }) => {
1473
- const { activeTab: n } = Ve(), l = n === e, r = {
1474
- visibility: l ? "visible" : "hidden",
1466
+ const { activeTab: l } = Ve(), n = l === e, i = {
1467
+ visibility: n ? "visible" : "hidden",
1475
1468
  gridArea: "1 / 1"
1476
1469
  };
1477
- return l || (r.pointerEvents = "none"), /* @__PURE__ */ s("div", { className: `clarity-tab-content ${a}`, role: "tabpanel", style: r, children: t });
1470
+ return n || (i.pointerEvents = "none"), /* @__PURE__ */ s("div", { className: `clarity-tab-content ${a}`, role: "tabpanel", style: i, children: t });
1478
1471
  };
1479
1472
  He.displayName = "Tabs.Content";
1480
1473
  const me = ({
1481
1474
  children: e,
1482
1475
  defaultTab: t,
1483
1476
  variant: a = "primary",
1484
- orientation: n = "horizontal",
1485
- className: l = ""
1477
+ orientation: l = "horizontal",
1478
+ className: n = ""
1486
1479
  }) => {
1487
- const [r, o] = B(t), f = Y(() => ({
1488
- activeTab: r,
1489
- setActiveTab: o,
1480
+ const [i, c] = x(t), f = Y(() => ({
1481
+ activeTab: i,
1482
+ setActiveTab: c,
1490
1483
  variant: a,
1491
- orientation: n
1492
- }), [r, a, n]), i = [
1484
+ orientation: l
1485
+ }), [i, a, l]), r = [
1493
1486
  "clarity-tabs-container",
1494
- l,
1495
- `orientation-${n}`
1487
+ n,
1488
+ `orientation-${l}`
1496
1489
  ].filter(Boolean).join(" ");
1497
- return /* @__PURE__ */ s(Pe.Provider, { value: f, children: /* @__PURE__ */ s("div", { className: i, children: e }) });
1490
+ return /* @__PURE__ */ s(Pe.Provider, { value: f, children: /* @__PURE__ */ s("div", { className: r, children: e }) });
1498
1491
  };
1499
1492
  me.Tab = Me;
1500
1493
  me.Content = He;
@@ -1503,52 +1496,52 @@ const Et = ({
1503
1496
  content: e,
1504
1497
  position: t = "top",
1505
1498
  variant: a = "primary",
1506
- product: n,
1507
- tone: l,
1508
- bgColor: r,
1509
- textColor: o,
1499
+ product: l,
1500
+ tone: n,
1501
+ bgColor: i,
1502
+ textColor: c,
1510
1503
  children: f,
1511
- className: i = "",
1512
- disabled: c = !1,
1504
+ className: r = "",
1505
+ disabled: o = !1,
1513
1506
  delay: d = 200,
1514
1507
  hideDelay: v = 100,
1515
1508
  trigger: m = "hover",
1516
1509
  arrow: p = !0,
1517
- ...h
1510
+ ...u
1518
1511
  }) => {
1519
- const [u, y] = B(!1), [b, w] = B(null), $ = P(null), T = P(null), C = "clarity-tooltip", k = !!r, L = n && l && !k;
1520
- let x = "";
1521
- k ? x = `${C}__content--custom-bg` : L ? x = `${C}__content--custom` : x = `${C}__content--${a}`;
1512
+ const [h, y] = x(!1), [b, _] = x(null), B = P(null), T = P(null), w = "clarity-tooltip", $ = !!i, L = l && n && !$;
1513
+ let k = "";
1514
+ $ ? k = `${w}__content--custom-bg` : L ? k = `${w}__content--custom` : k = `${w}__content--${a}`;
1522
1515
  const j = [
1523
- C,
1524
- `${C}--${t}`,
1525
- i
1516
+ w,
1517
+ `${w}--${t}`,
1518
+ r
1526
1519
  ].filter(Boolean).join(" "), I = [
1527
- `${C}__content`,
1528
- x,
1529
- p && `${C}__content--arrow`
1520
+ `${w}__content`,
1521
+ k,
1522
+ p && `${w}__content--arrow`
1530
1523
  ].filter(Boolean).join(" "), A = {}, O = {};
1531
- k && r && (O["--tooltip-bg-color"] = r), o && (O["--tooltip-text-color"] = o), L && n && l && (O["--tooltip-product"] = n, O["--tooltip-tone"] = l);
1524
+ $ && i && (O["--tooltip-bg-color"] = i), c && (O["--tooltip-text-color"] = c), L && l && n && (O["--tooltip-product"] = l, O["--tooltip-tone"] = n);
1532
1525
  const g = {
1533
1526
  ...A,
1534
1527
  ...Object.keys(O).length > 0 ? O : {}
1535
1528
  }, H = () => {
1536
- if (c) return;
1529
+ if (o) return;
1537
1530
  b && clearTimeout(b);
1538
1531
  const M = setTimeout(() => {
1539
1532
  y(!0);
1540
1533
  }, d);
1541
- w(M);
1534
+ _(M);
1542
1535
  }, V = () => {
1543
1536
  b && clearTimeout(b);
1544
1537
  const M = setTimeout(() => {
1545
1538
  y(!1);
1546
1539
  }, v);
1547
- w(M);
1540
+ _(M);
1548
1541
  }, F = () => {
1549
- c || y(!u);
1542
+ o || y(!h);
1550
1543
  }, X = () => {
1551
- c || H();
1544
+ o || H();
1552
1545
  }, te = () => {
1553
1546
  V();
1554
1547
  };
@@ -1556,23 +1549,23 @@ const Et = ({
1556
1549
  b && clearTimeout(b);
1557
1550
  }, [b]);
1558
1551
  const G = {};
1559
- return m === "hover" ? (G.onMouseEnter = H, G.onMouseLeave = V) : m === "click" ? G.onClick = F : m === "focus" && (G.onFocus = X, G.onBlur = te), /* @__PURE__ */ _(
1552
+ return m === "hover" ? (G.onMouseEnter = H, G.onMouseLeave = V) : m === "click" ? G.onClick = F : m === "focus" && (G.onFocus = X, G.onBlur = te), /* @__PURE__ */ C(
1560
1553
  "div",
1561
1554
  {
1562
1555
  ref: T,
1563
- className: `${C}__trigger`,
1556
+ className: `${w}__trigger`,
1564
1557
  ...G,
1565
- ...h,
1558
+ ...u,
1566
1559
  children: [
1567
1560
  f,
1568
- u && /* @__PURE__ */ s(
1561
+ h && /* @__PURE__ */ s(
1569
1562
  "div",
1570
1563
  {
1571
- ref: $,
1564
+ ref: B,
1572
1565
  className: j,
1573
1566
  style: g,
1574
1567
  role: "tooltip",
1575
- "aria-hidden": !u,
1568
+ "aria-hidden": !h,
1576
1569
  children: /* @__PURE__ */ s("div", { className: I, children: e })
1577
1570
  }
1578
1571
  )
@@ -1588,120 +1581,120 @@ const Et = ({
1588
1581
  children: e,
1589
1582
  className: t = "",
1590
1583
  variant: a = "secondary",
1591
- emptyText: n = "No results found.",
1592
- inputPlaceholder: l = "Search...",
1593
- ...r
1584
+ emptyText: l = "No results found.",
1585
+ inputPlaceholder: n = "Search...",
1586
+ ...i
1594
1587
  }) => {
1595
- const [o, f] = B(""), [i, c] = B(null), [d, v] = B(!1), m = [
1588
+ const [c, f] = x(""), [r, o] = x(null), [d, v] = x(!1), m = [
1596
1589
  "clarity-command",
1597
1590
  `clarity-command--${a}`,
1598
1591
  t
1599
1592
  ].filter(Boolean).join(" "), p = Y(() => ({
1600
- searchTerm: o,
1593
+ searchTerm: c,
1601
1594
  setSearchTerm: f,
1602
- value: i,
1603
- setValue: c,
1595
+ value: r,
1596
+ setValue: o,
1604
1597
  variant: a,
1605
1598
  texts: {
1606
- empty: n,
1607
- inputPlaceholder: l
1599
+ empty: l,
1600
+ inputPlaceholder: n
1608
1601
  },
1609
1602
  isOpen: d,
1610
1603
  setIsOpen: v
1611
- }), [o, i, a, n, l, d]);
1612
- return /* @__PURE__ */ s(We.Provider, { value: p, children: /* @__PURE__ */ s("div", { className: m, ...r, children: e }) });
1604
+ }), [c, r, a, l, n, d]);
1605
+ return /* @__PURE__ */ s(We.Provider, { value: p, children: /* @__PURE__ */ s("div", { className: m, ...i, children: e }) });
1613
1606
  };
1614
1607
  Fe.displayName = "Command";
1615
1608
  const Ge = ({ placeholder: e = "Search...", variant: t, onClick: a }) => {
1616
- const { setIsOpen: n, variant: l } = ee(), [r, o] = B(!1);
1609
+ const { setIsOpen: l, variant: n } = ee(), [i, c] = x(!1);
1617
1610
  S(() => {
1618
- o(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
1611
+ c(/Mac|iPod|iPhone|iPad/.test(navigator.platform));
1619
1612
  }, []);
1620
- const i = [
1613
+ const r = [
1621
1614
  "clarity-command-button",
1622
- `clarity-command-button--${t || l}`
1615
+ `clarity-command-button--${t || n}`
1623
1616
  ].filter(Boolean).join(" ");
1624
- return /* @__PURE__ */ _("button", { className: i, onClick: (d) => {
1625
- n(!0), a == null || a(d);
1617
+ return /* @__PURE__ */ C("button", { className: r, onClick: (d) => {
1618
+ l(!0), a == null || a(d);
1626
1619
  }, children: [
1627
1620
  /* @__PURE__ */ s("span", { children: e }),
1628
- /* @__PURE__ */ _("kbd", { className: "clarity-command-shortcut", children: [
1629
- r ? "⌘" : "Ctrl+",
1621
+ /* @__PURE__ */ C("kbd", { className: "clarity-command-shortcut", children: [
1622
+ i ? "⌘" : "Ctrl+",
1630
1623
  "K"
1631
1624
  ] })
1632
1625
  ] });
1633
1626
  };
1634
1627
  Ge.displayName = "Command.Button";
1635
1628
  const Ue = ({ children: e, ...t }) => {
1636
- const { isOpen: a, setIsOpen: n, variant: l } = ee();
1629
+ const { isOpen: a, setIsOpen: l, variant: n } = ee();
1637
1630
  return S(() => {
1638
- const r = (o) => {
1639
- o.key === "k" && (o.metaKey || o.ctrlKey) && (o.preventDefault(), n(!a));
1631
+ const i = (c) => {
1632
+ c.key === "k" && (c.metaKey || c.ctrlKey) && (c.preventDefault(), l(!a));
1640
1633
  };
1641
- return document.addEventListener("keydown", r), () => document.removeEventListener("keydown", r);
1642
- }, [a, n]), /* @__PURE__ */ s(J, { isOpen: a, onClose: () => n(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ s("div", { className: `clarity-command--${l}`, children: e }) });
1634
+ return document.addEventListener("keydown", i), () => document.removeEventListener("keydown", i);
1635
+ }, [a, l]), /* @__PURE__ */ s(J, { isOpen: a, onClose: () => l(!1), size: "large", closeOnOverlayClick: !0, children: /* @__PURE__ */ s("div", { className: `clarity-command--${n}`, children: e }) });
1643
1636
  };
1644
1637
  Ue.displayName = "Command.Dialog";
1645
1638
  const ze = ({ className: e = "", ...t }) => {
1646
- const { searchTerm: a, setSearchTerm: n, variant: l, texts: r, isOpen: o } = ee(), f = P(null);
1639
+ const { searchTerm: a, setSearchTerm: l, variant: n, texts: i, isOpen: c } = ee(), f = P(null);
1647
1640
  S(() => {
1648
- var c;
1649
- o && ((c = f.current) == null || c.focus());
1650
- }, [o]);
1651
- const i = [
1641
+ var o;
1642
+ c && ((o = f.current) == null || o.focus());
1643
+ }, [c]);
1644
+ const r = [
1652
1645
  "clarity-command-input",
1653
- `clarity-command-input--${l}`,
1646
+ `clarity-command-input--${n}`,
1654
1647
  e
1655
1648
  ].filter(Boolean).join(" ");
1656
1649
  return /* @__PURE__ */ s("div", { className: "clarity-command-input__wrapper", children: /* @__PURE__ */ s(
1657
1650
  "input",
1658
1651
  {
1659
1652
  ref: f,
1660
- className: i,
1653
+ className: r,
1661
1654
  value: a,
1662
- onChange: (c) => n(c.target.value),
1663
- placeholder: t.placeholder || r.inputPlaceholder,
1655
+ onChange: (o) => l(o.target.value),
1656
+ placeholder: t.placeholder || i.inputPlaceholder,
1664
1657
  ...t
1665
1658
  }
1666
1659
  ) });
1667
1660
  };
1668
1661
  ze.displayName = "Command.Input";
1669
1662
  const qe = ({ children: e, className: t = "", ...a }) => {
1670
- const { searchTerm: n } = ee();
1671
- let l = !1;
1672
- const r = (i) => E.Children.toArray(i).map((c) => {
1663
+ const { searchTerm: l } = ee();
1664
+ let n = !1;
1665
+ const i = (r) => E.Children.toArray(r).map((o) => {
1673
1666
  var v;
1674
- if (!E.isValidElement(c)) return c;
1675
- const d = c.type.displayName;
1667
+ if (!E.isValidElement(o)) return o;
1668
+ const d = o.type.displayName;
1676
1669
  if (d === "Command.Empty")
1677
1670
  return null;
1678
1671
  if (d === "Command.Item")
1679
- return (((v = c.props.children) == null ? void 0 : v.toString().toLowerCase()) || "").includes(n.toLowerCase()) ? (l = !0, c) : null;
1672
+ return (((v = o.props.children) == null ? void 0 : v.toString().toLowerCase()) || "").includes(l.toLowerCase()) ? (n = !0, o) : null;
1680
1673
  if (d === "Command.Group") {
1681
- const m = r(c.props.children);
1682
- return E.Children.toArray(m).some((h) => E.isValidElement(h) && h.type.displayName === "Command.Item") ? E.cloneElement(c, { ...c.props, children: m }) : null;
1674
+ const m = i(o.props.children);
1675
+ return E.Children.toArray(m).some((u) => E.isValidElement(u) && u.type.displayName === "Command.Item") ? E.cloneElement(o, { ...o.props, children: m }) : null;
1683
1676
  }
1684
- return c;
1685
- }).filter(Boolean), o = r(e), f = ["clarity-command-list", t].filter(Boolean).join(" ");
1686
- return /* @__PURE__ */ _("div", { className: f, ...a, children: [
1687
- o,
1688
- !l && /* @__PURE__ */ s(ue, {})
1677
+ return o;
1678
+ }).filter(Boolean), c = i(e), f = ["clarity-command-list", t].filter(Boolean).join(" ");
1679
+ return /* @__PURE__ */ C("div", { className: f, ...a, children: [
1680
+ c,
1681
+ !n && /* @__PURE__ */ s(ue, {})
1689
1682
  ] });
1690
1683
  };
1691
1684
  qe.displayName = "Command.List";
1692
1685
  const ue = ({ children: e, className: t = "", ...a }) => {
1693
- const { texts: n } = ee(), l = ["clarity-command-empty", t].filter(Boolean).join(" ");
1694
- return /* @__PURE__ */ s("div", { className: l, ...a, children: e || a.emptyText || n.empty });
1686
+ const { texts: l } = ee(), n = ["clarity-command-empty", t].filter(Boolean).join(" ");
1687
+ return /* @__PURE__ */ s("div", { className: n, ...a, children: e || a.emptyText || l.empty });
1695
1688
  };
1696
1689
  ue.displayName = "Command.Empty";
1697
1690
  const Je = ({ children: e, className: t = "", ...a }) => {
1698
- const n = ["clarity-command-group", t].filter(Boolean).join(" ");
1699
- return /* @__PURE__ */ s("div", { className: n, ...a, children: e });
1691
+ const l = ["clarity-command-group", t].filter(Boolean).join(" ");
1692
+ return /* @__PURE__ */ s("div", { className: l, ...a, children: e });
1700
1693
  };
1701
1694
  Je.displayName = "Command.Group";
1702
1695
  const Qe = ({ children: e, className: t = "", ...a }) => {
1703
- const { setValue: n, variant: l } = ee(), r = ["clarity-command-item", `clarity-command-item--${l}`, t].filter(Boolean).join(" ");
1704
- return /* @__PURE__ */ s("div", { className: r, onClick: () => n((e == null ? void 0 : e.toString()) || ""), ...a, children: e });
1696
+ const { setValue: l, variant: n } = ee(), i = ["clarity-command-item", `clarity-command-item--${n}`, t].filter(Boolean).join(" ");
1697
+ return /* @__PURE__ */ s("div", { className: i, onClick: () => l((e == null ? void 0 : e.toString()) || ""), ...a, children: e });
1705
1698
  };
1706
1699
  Qe.displayName = "Command.Item";
1707
1700
  const Xe = ({ className: e = "", ...t }) => {
@@ -1710,8 +1703,8 @@ const Xe = ({ className: e = "", ...t }) => {
1710
1703
  };
1711
1704
  Xe.displayName = "Command.Separator";
1712
1705
  const Ye = ({ children: e, className: t = "", ...a }) => {
1713
- const n = ["clarity-command-shortcut", t].filter(Boolean).join(" ");
1714
- return /* @__PURE__ */ s("span", { className: n, ...a, children: e });
1706
+ const l = ["clarity-command-shortcut", t].filter(Boolean).join(" ");
1707
+ return /* @__PURE__ */ s("span", { className: l, ...a, children: e });
1715
1708
  };
1716
1709
  Ye.displayName = "Command.Shortcut";
1717
1710
  const Lt = Object.assign(Fe, {
@@ -1725,96 +1718,96 @@ const Lt = Object.assign(Fe, {
1725
1718
  Separator: Xe,
1726
1719
  Shortcut: Ye
1727
1720
  }), Nt = ({ columns: e, viewMode: t }) => {
1728
- const a = Array.from({ length: 5 }, (n, l) => l);
1729
- return t === "card" ? /* @__PURE__ */ _("div", { className: "card-view-wrapper is-loading", children: [
1721
+ const a = Array.from({ length: 5 }, (l, n) => n);
1722
+ return t === "card" ? /* @__PURE__ */ C("div", { className: "card-view-wrapper is-loading", children: [
1730
1723
  /* @__PURE__ */ s("div", { className: "skeleton card-view-header" }),
1731
- /* @__PURE__ */ s("div", { className: "card-view-body", children: a.map((n) => /* @__PURE__ */ s("div", { className: "skeleton card-view-row" }, n)) })
1732
- ] }) : /* @__PURE__ */ s("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ _("table", { children: [
1733
- /* @__PURE__ */ s("thead", { children: /* @__PURE__ */ s("tr", { className: "table-row", children: e.map((n) => /* @__PURE__ */ s("th", { className: "table-header-cell", children: /* @__PURE__ */ s("div", { className: "skeleton skeleton-text" }) }, n.key)) }) }),
1734
- /* @__PURE__ */ s("tbody", { children: a.map((n) => /* @__PURE__ */ s("tr", { className: "table-row", children: e.map((l) => /* @__PURE__ */ s("td", { className: "table-cell", children: /* @__PURE__ */ s("div", { className: "skeleton skeleton-text" }) }, l.key)) }, n)) })
1724
+ /* @__PURE__ */ s("div", { className: "card-view-body", children: a.map((l) => /* @__PURE__ */ s("div", { className: "skeleton card-view-row" }, l)) })
1725
+ ] }) : /* @__PURE__ */ s("div", { className: "table-wrapper is-loading", children: /* @__PURE__ */ C("table", { children: [
1726
+ /* @__PURE__ */ s("thead", { children: /* @__PURE__ */ s("tr", { className: "table-row", children: e.map((l) => /* @__PURE__ */ s("th", { className: "table-header-cell", children: /* @__PURE__ */ s("div", { className: "skeleton skeleton-text" }) }, l.key)) }) }),
1727
+ /* @__PURE__ */ s("tbody", { children: a.map((l) => /* @__PURE__ */ s("tr", { className: "table-row", children: e.map((n) => /* @__PURE__ */ s("td", { className: "table-cell", children: /* @__PURE__ */ s("div", { className: "skeleton skeleton-text" }) }, n.key)) }, l)) })
1735
1728
  ] }) });
1736
1729
  }, Ot = ({
1737
1730
  variant: e = "secondary",
1738
1731
  columns: t,
1739
1732
  data: a,
1740
- viewMode: n = "table",
1741
- isScrollable: l = !1,
1742
- isLoading: r = !1
1733
+ viewMode: l = "table",
1734
+ isScrollable: n = !1,
1735
+ isLoading: i = !1
1743
1736
  }) => {
1744
- const [o, f] = B(null), [i, c] = B("none"), d = (h) => {
1745
- h.sortable && (o === h.key ? c((u) => u === "asc" ? "desc" : u === "desc" ? "none" : "asc") : (f(h.key), c("asc")));
1746
- }, v = Y(() => i === "none" || !o ? a : [...a].sort((h, u) => {
1747
- const y = h[o], b = u[o];
1748
- return y < b ? i === "asc" ? -1 : 1 : y > b ? i === "asc" ? 1 : -1 : 0;
1749
- }), [a, o, i]), m = (h) => h.sortable ? o !== h.key || i === "none" ? /* @__PURE__ */ s("span", { className: "sort-icon", children: "↕" }) : i === "asc" ? /* @__PURE__ */ s("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ s("span", { className: "sort-icon", children: "↓" }) : null;
1750
- if (r)
1751
- return /* @__PURE__ */ s(Nt, { columns: t, viewMode: n });
1752
- const p = `table-variant-${e} ${l ? "is-scrollable" : ""}`;
1753
- return n === "card" ? /* @__PURE__ */ _("div", { className: `card-view-wrapper ${p}`, children: [
1754
- /* @__PURE__ */ s("div", { className: `card-view-header table-header-cell-${e}`, children: t.map((h) => /* @__PURE__ */ _(
1737
+ const [c, f] = x(null), [r, o] = x("none"), d = (u) => {
1738
+ u.sortable && (c === u.key ? o((h) => h === "asc" ? "desc" : h === "desc" ? "none" : "asc") : (f(u.key), o("asc")));
1739
+ }, v = Y(() => r === "none" || !c ? a : [...a].sort((u, h) => {
1740
+ const y = u[c], b = h[c];
1741
+ return y < b ? r === "asc" ? -1 : 1 : y > b ? r === "asc" ? 1 : -1 : 0;
1742
+ }), [a, c, r]), m = (u) => u.sortable ? c !== u.key || r === "none" ? /* @__PURE__ */ s("span", { className: "sort-icon", children: "↕" }) : r === "asc" ? /* @__PURE__ */ s("span", { className: "sort-icon", children: "↑" }) : /* @__PURE__ */ s("span", { className: "sort-icon", children: "↓" }) : null;
1743
+ if (i)
1744
+ return /* @__PURE__ */ s(Nt, { columns: t, viewMode: l });
1745
+ const p = `table-variant-${e} ${n ? "is-scrollable" : ""}`;
1746
+ return l === "card" ? /* @__PURE__ */ C("div", { className: `card-view-wrapper ${p}`, children: [
1747
+ /* @__PURE__ */ s("div", { className: `card-view-header table-header-cell-${e}`, children: t.map((u) => /* @__PURE__ */ C(
1755
1748
  "div",
1756
1749
  {
1757
- className: `card-view-header-cell ${h.sortable ? "sortable" : ""}`,
1758
- onClick: () => d(h),
1759
- style: { minWidth: h.minWidth },
1750
+ className: `card-view-header-cell ${u.sortable ? "sortable" : ""}`,
1751
+ onClick: () => d(u),
1752
+ style: { minWidth: u.minWidth },
1760
1753
  children: [
1761
- h.header,
1762
- m(h)
1754
+ u.header,
1755
+ m(u)
1763
1756
  ]
1764
1757
  },
1765
- h.key
1758
+ u.key
1766
1759
  )) }),
1767
- /* @__PURE__ */ s("div", { className: "card-view-body", children: v.map((h, u) => /* @__PURE__ */ s("div", { className: `card-view-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ s("div", { className: `card-view-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(h) : h[y.key] }, y.key)) }, u)) })
1768
- ] }) : /* @__PURE__ */ s("div", { className: `table-wrapper ${p}`, children: /* @__PURE__ */ _("table", { children: [
1769
- /* @__PURE__ */ s("thead", { className: "table-header", children: /* @__PURE__ */ s("tr", { className: "table-row", children: t.map((h) => /* @__PURE__ */ _(
1760
+ /* @__PURE__ */ s("div", { className: "card-view-body", children: v.map((u, h) => /* @__PURE__ */ s("div", { className: `card-view-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ s("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)) })
1761
+ ] }) : /* @__PURE__ */ s("div", { className: `table-wrapper ${p}`, children: /* @__PURE__ */ C("table", { children: [
1762
+ /* @__PURE__ */ s("thead", { className: "table-header", children: /* @__PURE__ */ s("tr", { className: "table-row", children: t.map((u) => /* @__PURE__ */ C(
1770
1763
  "th",
1771
1764
  {
1772
- className: `table-header-cell ${h.sortable ? "sortable" : ""} table-header-cell-${e}`,
1773
- onClick: () => d(h),
1774
- style: { minWidth: h.minWidth },
1765
+ className: `table-header-cell ${u.sortable ? "sortable" : ""} table-header-cell-${e}`,
1766
+ onClick: () => d(u),
1767
+ style: { minWidth: u.minWidth },
1775
1768
  children: [
1776
- h.header,
1777
- m(h)
1769
+ u.header,
1770
+ m(u)
1778
1771
  ]
1779
1772
  },
1780
- h.key
1773
+ u.key
1781
1774
  )) }) }),
1782
- /* @__PURE__ */ s("tbody", { children: v.map((h, u) => /* @__PURE__ */ s("tr", { className: `table-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ s("td", { className: `table-cell ${y.align ? `table-cell-align-${y.align}` : ""}`, style: { minWidth: y.minWidth }, children: y.render ? y.render(h) : h[y.key] }, y.key)) }, u)) })
1775
+ /* @__PURE__ */ s("tbody", { children: v.map((u, h) => /* @__PURE__ */ s("tr", { className: `table-row table-row-${e}`, children: t.map((y) => /* @__PURE__ */ s("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)) })
1783
1776
  ] }) });
1784
1777
  }, St = ({
1785
1778
  variant: e = "primary",
1786
1779
  product: t,
1787
1780
  tone: a,
1788
- size: n = "medium",
1789
- color: l,
1790
- className: r = "",
1791
- "aria-label": o = "Carregando...",
1781
+ size: l = "medium",
1782
+ color: n,
1783
+ className: i = "",
1784
+ "aria-label": c = "Carregando...",
1792
1785
  ...f
1793
1786
  }) => {
1794
- const i = "clarity-spinner", v = l ? `${i}--custom` : t && a ? `${i}--custom` : `${i}--${e}`, m = [
1795
- i,
1796
- `${i}--${n}`,
1787
+ const r = "clarity-spinner", v = n ? `${r}--custom` : t && a ? `${r}--custom` : `${r}--${e}`, m = [
1788
+ r,
1789
+ `${r}--${l}`,
1797
1790
  v,
1798
- r
1791
+ i
1799
1792
  ].filter(Boolean).join(" "), p = {};
1800
- return l ? p["--spinner-color"] = l : t && a && (p["--spinner-color"] = `var(--clarity-${t}-${a})`), /* @__PURE__ */ s(
1793
+ return n ? p["--spinner-color"] = n : t && a && (p["--spinner-color"] = `var(--clarity-${t}-${a})`), /* @__PURE__ */ s(
1801
1794
  "div",
1802
1795
  {
1803
1796
  className: m,
1804
1797
  style: p,
1805
1798
  role: "status",
1806
- "aria-label": o,
1799
+ "aria-label": c,
1807
1800
  ...f,
1808
- children: /* @__PURE__ */ s("div", { className: `${i}__container`, children: /* @__PURE__ */ s(
1801
+ children: /* @__PURE__ */ s("div", { className: `${r}__container`, children: /* @__PURE__ */ s(
1809
1802
  "svg",
1810
1803
  {
1811
- className: `${i}__svg`,
1804
+ className: `${r}__svg`,
1812
1805
  viewBox: "0 0 50 50",
1813
1806
  xmlns: "http://www.w3.org/2000/svg",
1814
1807
  children: /* @__PURE__ */ s(
1815
1808
  "circle",
1816
1809
  {
1817
- className: `${i}__circle`,
1810
+ className: `${r}__circle`,
1818
1811
  cx: "25",
1819
1812
  cy: "25",
1820
1813
  r: "20",
@@ -1911,16 +1904,16 @@ export {
1911
1904
  $t as ButtonGroup,
1912
1905
  Tt as ButtonIcon,
1913
1906
  Bt as ButtonLink,
1914
- it as CheckInput,
1907
+ rt as CheckInput,
1915
1908
  Lt as Command,
1916
1909
  Q as ConfirmationDialog,
1917
1910
  ae as Dropdown,
1918
1911
  st as Input,
1919
1912
  ot as InputSwitch,
1920
1913
  J as Modal,
1921
- lt as MultiSelect,
1914
+ nt as MultiSelect,
1922
1915
  K as Offcanvas,
1923
- nt as Select,
1916
+ lt as Select,
1924
1917
  St as Spinner,
1925
1918
  Ot as Table,
1926
1919
  me as Tabs,