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