beth-clarity 1.1.17 → 1.1.19

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