beth-clarity 1.1.16 → 1.1.17

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