@vellira-ui/react 2.26.0 → 2.27.0
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/README.md +2 -2
- package/dist/index.cjs +1 -1
- package/dist/index.js +586 -514
- package/dist/styles.css +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,23 +1,23 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
3
|
-
import { createPortal as
|
|
4
|
-
import { Fragment as
|
|
5
|
-
import { FloatingPortal as
|
|
6
|
-
import { useControllableState as
|
|
7
|
-
import { Check as
|
|
8
|
-
import
|
|
1
|
+
import { cloneElement as e, createContext as t, forwardRef as n, isValidElement as r, useCallback as i, useContext as a, useEffect as o, useId as s, useMemo as c, useRef as l, useState as u } from "react";
|
|
2
|
+
import d from "clsx";
|
|
3
|
+
import { createPortal as f } from "react-dom";
|
|
4
|
+
import { Fragment as p, jsx as m, jsxs as h } from "react/jsx-runtime";
|
|
5
|
+
import { FloatingPortal as g, arrow as _, autoUpdate as v, flip as y, offset as b, shift as x, size as S, useFloating as C, useFocus as w, useHover as T, useInteractions as E } from "@floating-ui/react";
|
|
6
|
+
import { useControllableState as D, useDropdown as O, useModal as k, useSelect as A, useTabs as j, useTabsKeyboard as M } from "@vellira-ui/core";
|
|
7
|
+
import { Check as N, ChevronDown as P, Close as F } from "@vellira-ui/icons";
|
|
8
|
+
import I from "focus-trap-react";
|
|
9
9
|
//#region src/utils/cn.ts
|
|
10
|
-
var
|
|
11
|
-
let [t, n] =
|
|
12
|
-
if (
|
|
10
|
+
var L = (...e) => d(e), R = ({ children: e }) => {
|
|
11
|
+
let [t, n] = u(!1);
|
|
12
|
+
if (o(() => {
|
|
13
13
|
n(!0);
|
|
14
14
|
}, []), !t) return null;
|
|
15
15
|
let r = document.getElementById("overlay-root") ?? document.body;
|
|
16
|
-
return r ?
|
|
17
|
-
},
|
|
16
|
+
return r ? f(e, r) : null;
|
|
17
|
+
}, z = {
|
|
18
18
|
dropdown: "_dropdown_1rvx9_1",
|
|
19
19
|
"dropdown-in": "_dropdown-in_1rvx9_1"
|
|
20
|
-
},
|
|
20
|
+
}, B = n(({ children: e, floatingStyles: t, menuId: n, labelledById: r, label: i, activeDescendantId: a, onKeyDown: o, className: s }, c) => /* @__PURE__ */ m(R, { children: /* @__PURE__ */ m("ul", {
|
|
21
21
|
ref: c,
|
|
22
22
|
id: n,
|
|
23
23
|
role: "menu",
|
|
@@ -27,44 +27,44 @@ var F = (...e) => l(e), I = ({ children: e }) => {
|
|
|
27
27
|
"aria-activedescendant": a,
|
|
28
28
|
onKeyDown: o,
|
|
29
29
|
style: t,
|
|
30
|
-
className:
|
|
30
|
+
className: L(z.dropdown, s),
|
|
31
31
|
children: e
|
|
32
32
|
}) }));
|
|
33
|
-
|
|
33
|
+
B.displayName = "DropdownContent";
|
|
34
34
|
//#endregion
|
|
35
35
|
//#region src/hooks/useFloatingPosition.ts
|
|
36
|
-
var
|
|
37
|
-
let [t, n] =
|
|
38
|
-
return
|
|
36
|
+
var V = (e) => {
|
|
37
|
+
let [t, n] = u(() => typeof window > "u" || typeof window.matchMedia != "function" || !e ? !1 : window.matchMedia(`(max-width: ${e}px)`).matches);
|
|
38
|
+
return o(() => {
|
|
39
39
|
if (typeof window > "u" || typeof window.matchMedia != "function" || !e) return;
|
|
40
40
|
let t = window.matchMedia(`(max-width: ${e}px)`), r = () => n(t.matches);
|
|
41
41
|
return r(), t.addEventListener("change", r), () => {
|
|
42
42
|
t.removeEventListener("change", r);
|
|
43
43
|
};
|
|
44
44
|
}, [e]), t;
|
|
45
|
-
},
|
|
46
|
-
let l =
|
|
45
|
+
}, ee = ({ open: e, onOpenChange: t, placement: n = "bottom-start", strategy: r = "fixed", matchTriggerWidth: i = !1, mobileSheetBreakpoint: a, middleware: s = [] } = {}) => {
|
|
46
|
+
let l = V(a), { refs: u, floatingStyles: d, update: f, context: p, middlewareData: m, placement: h } = C({
|
|
47
47
|
open: e,
|
|
48
48
|
onOpenChange: t,
|
|
49
49
|
placement: n,
|
|
50
50
|
strategy: r,
|
|
51
51
|
transform: !1,
|
|
52
|
-
middleware:
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
!
|
|
52
|
+
middleware: c(() => [
|
|
53
|
+
b(2),
|
|
54
|
+
y(),
|
|
55
|
+
S({ apply({ rects: e, elements: t }) {
|
|
56
|
+
!i || l || Object.assign(t.floating.style, { width: `${e.reference.width}px` });
|
|
57
57
|
} }),
|
|
58
|
-
|
|
59
|
-
...
|
|
58
|
+
x({ padding: 8 }),
|
|
59
|
+
...s
|
|
60
60
|
], [
|
|
61
|
-
|
|
61
|
+
s,
|
|
62
62
|
l,
|
|
63
|
-
|
|
63
|
+
i
|
|
64
64
|
]),
|
|
65
|
-
whileElementsMounted:
|
|
65
|
+
whileElementsMounted: v
|
|
66
66
|
});
|
|
67
|
-
return
|
|
67
|
+
return o(() => {
|
|
68
68
|
l && u.floating.current?.style.removeProperty("width");
|
|
69
69
|
}, [l, u.floating]), {
|
|
70
70
|
context: p,
|
|
@@ -76,23 +76,23 @@ var z = (e) => {
|
|
|
76
76
|
setFloatingRef: u.setFloating,
|
|
77
77
|
updatePosition: f
|
|
78
78
|
};
|
|
79
|
-
},
|
|
80
|
-
let r =
|
|
79
|
+
}, te = (e, t, n = !0) => {
|
|
80
|
+
let r = l(e);
|
|
81
81
|
r.current = e;
|
|
82
|
-
let
|
|
83
|
-
|
|
82
|
+
let i = l(t);
|
|
83
|
+
i.current = t, o(() => {
|
|
84
84
|
if (!n) return;
|
|
85
85
|
let e = (e) => {
|
|
86
86
|
let t = e.target;
|
|
87
|
-
r.current.every((e) => e.current && !e.current.contains(t)) &&
|
|
87
|
+
r.current.every((e) => e.current && !e.current.contains(t)) && i.current();
|
|
88
88
|
};
|
|
89
89
|
return document.addEventListener("pointerdown", e), () => document.removeEventListener("pointerdown", e);
|
|
90
90
|
}, [n]);
|
|
91
|
-
},
|
|
91
|
+
}, H = { group: "_group_aviwv_1" }, ne = ({ label: e }) => /* @__PURE__ */ m("li", {
|
|
92
92
|
role: "presentation",
|
|
93
|
-
className:
|
|
93
|
+
className: H.group,
|
|
94
94
|
children: e
|
|
95
|
-
}),
|
|
95
|
+
}), U = {
|
|
96
96
|
item: "_item_re11y_1",
|
|
97
97
|
disabled: "_disabled_re11y_21",
|
|
98
98
|
active: "_active_re11y_34",
|
|
@@ -103,9 +103,9 @@ var z = (e) => {
|
|
|
103
103
|
"itemText--truncate": "_itemText--truncate_re11y_88",
|
|
104
104
|
"itemText--wrap": "_itemText--wrap_re11y_93",
|
|
105
105
|
"itemText--nowrap": "_itemText--nowrap_re11y_97"
|
|
106
|
-
},
|
|
107
|
-
let
|
|
108
|
-
return /* @__PURE__ */
|
|
106
|
+
}, re = ({ id: e, children: t, label: n, icon: r, danger: i, disabled: a, active: o, onClick: s, onMouseEnter: c, shortcut: l, textWrap: u = "truncate", className: d }) => {
|
|
107
|
+
let f = t || n;
|
|
108
|
+
return /* @__PURE__ */ h("li", {
|
|
109
109
|
id: e,
|
|
110
110
|
role: "menuitem",
|
|
111
111
|
tabIndex: -1,
|
|
@@ -114,32 +114,32 @@ var z = (e) => {
|
|
|
114
114
|
"data-danger": i || void 0,
|
|
115
115
|
onClick: a ? void 0 : s,
|
|
116
116
|
onMouseEnter: a ? void 0 : c,
|
|
117
|
-
className:
|
|
118
|
-
[
|
|
119
|
-
[
|
|
120
|
-
[
|
|
117
|
+
className: L(U.item, {
|
|
118
|
+
[U.active]: o,
|
|
119
|
+
[U.disabled]: a,
|
|
120
|
+
[U.danger]: i
|
|
121
121
|
}, d),
|
|
122
122
|
children: [
|
|
123
|
-
r && /* @__PURE__ */
|
|
123
|
+
r && /* @__PURE__ */ m("span", {
|
|
124
124
|
"aria-hidden": "true",
|
|
125
|
-
className:
|
|
125
|
+
className: U.itemIcon,
|
|
126
126
|
children: r
|
|
127
127
|
}),
|
|
128
|
-
|
|
129
|
-
className:
|
|
130
|
-
children:
|
|
128
|
+
f && /* @__PURE__ */ m("span", {
|
|
129
|
+
className: L(U.itemText, U[`itemText--${u}`]),
|
|
130
|
+
children: f
|
|
131
131
|
}),
|
|
132
|
-
l && /* @__PURE__ */
|
|
133
|
-
className:
|
|
132
|
+
l && /* @__PURE__ */ m("span", {
|
|
133
|
+
className: U.itemShortcut,
|
|
134
134
|
children: l
|
|
135
135
|
})
|
|
136
136
|
]
|
|
137
137
|
});
|
|
138
|
-
},
|
|
138
|
+
}, W = { separator: "_separator_1v11r_1" }, ie = () => /* @__PURE__ */ m("li", {
|
|
139
139
|
role: "separator",
|
|
140
|
-
className:
|
|
140
|
+
className: W.separator,
|
|
141
141
|
"aria-hidden": "true"
|
|
142
|
-
}),
|
|
142
|
+
}), G = {
|
|
143
143
|
button: "_button_18ucr_1",
|
|
144
144
|
disabled: "_disabled_18ucr_20",
|
|
145
145
|
iconLeft: "_iconLeft_18ucr_32",
|
|
@@ -149,112 +149,112 @@ var z = (e) => {
|
|
|
149
149
|
md: "_md_18ucr_72",
|
|
150
150
|
lg: "_lg_18ucr_84",
|
|
151
151
|
open: "_open_18ucr_123"
|
|
152
|
-
},
|
|
153
|
-
let
|
|
154
|
-
return /* @__PURE__ */
|
|
152
|
+
}, ae = n(({ children: e, isOpen: t, icon: n, arrowIcon: r, showArrow: i = !0, rotateAngle: a = 90, size: o = "md", label: s, ariaLabel: c, className: l, ...u }, d) => {
|
|
153
|
+
let f = !!n, p = !!e, g = f && !p, _ = i && p, v = r ?? /* @__PURE__ */ m(P, {}), y = c ?? (g ? typeof s == "string" ? s : "Open menu" : void 0);
|
|
154
|
+
return /* @__PURE__ */ h("button", {
|
|
155
155
|
...u,
|
|
156
156
|
ref: d,
|
|
157
157
|
type: "button",
|
|
158
|
-
className:
|
|
159
|
-
[
|
|
160
|
-
[
|
|
158
|
+
className: L(G.button, G[o], {
|
|
159
|
+
[G.disabled]: u.disabled,
|
|
160
|
+
[G.iconOnly]: g
|
|
161
161
|
}, l),
|
|
162
162
|
"aria-label": y,
|
|
163
163
|
"aria-expanded": t,
|
|
164
164
|
"aria-haspopup": "menu",
|
|
165
165
|
style: { "--dropdown-rotate-angle": `${a}deg` },
|
|
166
166
|
children: [
|
|
167
|
-
|
|
167
|
+
f && /* @__PURE__ */ m("span", {
|
|
168
168
|
"aria-hidden": "true",
|
|
169
|
-
className:
|
|
169
|
+
className: G.iconLeft,
|
|
170
170
|
children: n
|
|
171
171
|
}),
|
|
172
172
|
e,
|
|
173
|
-
_ && /* @__PURE__ */
|
|
173
|
+
_ && /* @__PURE__ */ m("span", {
|
|
174
174
|
"aria-hidden": "true",
|
|
175
|
-
className:
|
|
175
|
+
className: L(G.arrow, { [G.open]: t }),
|
|
176
176
|
children: v
|
|
177
177
|
})
|
|
178
178
|
]
|
|
179
179
|
});
|
|
180
180
|
});
|
|
181
|
-
|
|
181
|
+
ae.displayName = "DropdownTrigger";
|
|
182
182
|
//#endregion
|
|
183
183
|
//#region src/components/Dropdown/types.ts
|
|
184
|
-
var
|
|
185
|
-
let
|
|
184
|
+
var oe = (e) => e.type === void 0 || e.type === "item", se = (e) => e.type === "group", ce = (e) => e.type === "separator", le = { wrapper: "_wrapper_14ue8_1" }, ue = ({ label: e, ariaLabel: t, icon: n, trigger: r, items: a = [], onSelect: o, open: u, defaultOpen: d = !1, onOpenChange: f, size: p = "md", className: g, triggerClassName: _, contentClassName: v, itemClassName: y, disabled: b, rotateAngle: x = 90, placement: S, matchTriggerWidth: C, textWrap: w, showArrow: T = !0, arrowIcon: E }) => {
|
|
185
|
+
let D = l(null), k = l(null), A = s(), j = `${A}-trigger`, { floatingStyles: M, setRef: N, setFloatingRef: P } = ee({
|
|
186
186
|
placement: S,
|
|
187
187
|
matchTriggerWidth: C,
|
|
188
188
|
mobileSheetBreakpoint: 640
|
|
189
|
-
}),
|
|
189
|
+
}), F = c(() => a.flatMap((e, t) => oe(e) ? [{
|
|
190
190
|
item: e,
|
|
191
191
|
itemIndex: t
|
|
192
|
-
}] : []), [
|
|
193
|
-
items:
|
|
192
|
+
}] : []), [a]), I = c(() => F.map(({ item: e }) => e), [F]), R = c(() => new Map(F.map(({ itemIndex: e }, t) => [e, t])), [F]), { activeIndex: z, setActiveIndex: V, isOpen: H, closeDropdown: U, toggleDropdown: W, selectItem: G, onKeyDown: ue } = O({
|
|
193
|
+
items: I,
|
|
194
194
|
open: u,
|
|
195
195
|
defaultOpen: d,
|
|
196
196
|
disabled: b,
|
|
197
|
-
onOpenChange:
|
|
198
|
-
onSelect:
|
|
199
|
-
|
|
200
|
-
}, [
|
|
197
|
+
onOpenChange: f,
|
|
198
|
+
onSelect: i((e) => {
|
|
199
|
+
o?.(e), D.current?.focus();
|
|
200
|
+
}, [o]),
|
|
201
201
|
getItemValue: (e) => e.value,
|
|
202
202
|
getItemText: (e) => typeof e.label == "string" ? e.label : e.value
|
|
203
|
-
}), de =
|
|
204
|
-
|
|
205
|
-
let fe =
|
|
206
|
-
|
|
207
|
-
}, [
|
|
208
|
-
|
|
209
|
-
}, [N]), me =
|
|
203
|
+
}), de = H && z >= 0 ? `${A}-item-${z}` : void 0;
|
|
204
|
+
te([D, k], U, H);
|
|
205
|
+
let fe = i((e) => {
|
|
206
|
+
ue(e), H && e.key === "Escape" && D.current?.focus();
|
|
207
|
+
}, [H, ue]), pe = i((e) => {
|
|
208
|
+
D.current = e, N(e);
|
|
209
|
+
}, [N]), me = i((e) => {
|
|
210
210
|
k.current = e, P(e), e?.focus();
|
|
211
211
|
}, [P]);
|
|
212
|
-
return /* @__PURE__ */
|
|
213
|
-
className:
|
|
214
|
-
children: [/* @__PURE__ */
|
|
212
|
+
return /* @__PURE__ */ h("div", {
|
|
213
|
+
className: L(le.wrapper, g),
|
|
214
|
+
children: [/* @__PURE__ */ m(ae, {
|
|
215
215
|
ref: pe,
|
|
216
216
|
id: j,
|
|
217
|
-
isOpen:
|
|
217
|
+
isOpen: H,
|
|
218
218
|
disabled: b,
|
|
219
|
-
size:
|
|
220
|
-
icon:
|
|
219
|
+
size: p,
|
|
220
|
+
icon: n,
|
|
221
221
|
label: e,
|
|
222
222
|
ariaLabel: t,
|
|
223
223
|
showArrow: T,
|
|
224
|
-
arrowIcon:
|
|
224
|
+
arrowIcon: E,
|
|
225
225
|
rotateAngle: x,
|
|
226
226
|
className: _,
|
|
227
|
-
onClick:
|
|
227
|
+
onClick: W,
|
|
228
228
|
onKeyDown: fe,
|
|
229
|
-
"aria-expanded":
|
|
229
|
+
"aria-expanded": H,
|
|
230
230
|
"aria-haspopup": "menu",
|
|
231
|
-
...
|
|
232
|
-
children:
|
|
233
|
-
}),
|
|
231
|
+
...H && { "aria-controls": A },
|
|
232
|
+
children: r
|
|
233
|
+
}), H && /* @__PURE__ */ m(B, {
|
|
234
234
|
ref: me,
|
|
235
235
|
floatingStyles: M,
|
|
236
236
|
menuId: A,
|
|
237
|
-
labelledById:
|
|
238
|
-
label: t ?? (!
|
|
237
|
+
labelledById: r ? j : void 0,
|
|
238
|
+
label: t ?? (!r && typeof e == "string" ? e : void 0),
|
|
239
239
|
activeDescendantId: de,
|
|
240
240
|
onKeyDown: fe,
|
|
241
241
|
className: v,
|
|
242
|
-
children:
|
|
243
|
-
if (
|
|
244
|
-
if (
|
|
245
|
-
if (
|
|
246
|
-
let n =
|
|
247
|
-
return /* @__PURE__ */
|
|
242
|
+
children: a.map((e, t) => {
|
|
243
|
+
if (se(e)) return /* @__PURE__ */ m(ne, { label: e.label }, `group-${e.label}`);
|
|
244
|
+
if (ce(e)) return /* @__PURE__ */ m(ie, {}, `separator-${t}`);
|
|
245
|
+
if (oe(e)) {
|
|
246
|
+
let n = R.get(t) ?? -1;
|
|
247
|
+
return /* @__PURE__ */ m(re, {
|
|
248
248
|
id: `${A}-item-${n}`,
|
|
249
249
|
...e,
|
|
250
|
-
active:
|
|
250
|
+
active: z === n,
|
|
251
251
|
textWrap: e.textWrap || w,
|
|
252
252
|
className: y,
|
|
253
253
|
onClick: () => {
|
|
254
|
-
|
|
254
|
+
G(e), D.current?.focus();
|
|
255
255
|
},
|
|
256
256
|
onMouseEnter: () => {
|
|
257
|
-
n < 0 || e.disabled ||
|
|
257
|
+
n < 0 || e.disabled || V(n);
|
|
258
258
|
},
|
|
259
259
|
children: e.label
|
|
260
260
|
}, `${e.value}-${t}`);
|
|
@@ -262,94 +262,94 @@ var ae = (e) => e.type === void 0 || e.type === "item", oe = (e) => e.type === "
|
|
|
262
262
|
})
|
|
263
263
|
})]
|
|
264
264
|
});
|
|
265
|
-
},
|
|
266
|
-
let e =
|
|
265
|
+
}, de = t(void 0), fe = () => {
|
|
266
|
+
let e = a(de);
|
|
267
267
|
if (e === void 0) throw Error("Modal compound components must be used inside Modal");
|
|
268
268
|
return e;
|
|
269
269
|
};
|
|
270
|
-
|
|
271
|
-
var
|
|
272
|
-
let { descriptionId: t } =
|
|
273
|
-
return /* @__PURE__ */
|
|
270
|
+
de.displayName = "ModalContext";
|
|
271
|
+
var pe = { modalBody: "_modalBody_iv33a_1" }, me = ({ children: e }) => {
|
|
272
|
+
let { descriptionId: t } = fe();
|
|
273
|
+
return /* @__PURE__ */ m("div", {
|
|
274
274
|
id: t,
|
|
275
|
-
className:
|
|
275
|
+
className: pe.modalBody,
|
|
276
276
|
children: e
|
|
277
277
|
});
|
|
278
278
|
};
|
|
279
|
-
|
|
280
|
-
var
|
|
281
|
-
className:
|
|
279
|
+
me.displayName = "ModalBody";
|
|
280
|
+
var he = { content: "_content_k44g7_1" }, ge = ({ children: e }) => /* @__PURE__ */ m("div", {
|
|
281
|
+
className: he.content,
|
|
282
282
|
children: e
|
|
283
283
|
});
|
|
284
|
-
|
|
285
|
-
var
|
|
286
|
-
className:
|
|
284
|
+
ge.displayName = "ModalContent";
|
|
285
|
+
var _e = { modalFooter: "_modalFooter_ezys6_1" }, ve = ({ children: e }) => /* @__PURE__ */ m("div", {
|
|
286
|
+
className: _e.modalFooter,
|
|
287
287
|
children: e
|
|
288
288
|
});
|
|
289
|
-
|
|
290
|
-
var
|
|
289
|
+
ve.displayName = "ModalFooter";
|
|
290
|
+
var ye = {
|
|
291
291
|
modalHeader: "_modalHeader_p8xf1_1",
|
|
292
292
|
modalHeaderTitle: "_modalHeaderTitle_p8xf1_7",
|
|
293
293
|
modalHeaderCloseButton: "_modalHeaderCloseButton_p8xf1_14"
|
|
294
|
-
},
|
|
295
|
-
let { onClose: t, titleId: n } =
|
|
296
|
-
return /* @__PURE__ */
|
|
297
|
-
className:
|
|
298
|
-
children: [/* @__PURE__ */
|
|
294
|
+
}, be = ({ children: e }) => {
|
|
295
|
+
let { onClose: t, titleId: n } = fe();
|
|
296
|
+
return /* @__PURE__ */ h("div", {
|
|
297
|
+
className: ye.modalHeader,
|
|
298
|
+
children: [/* @__PURE__ */ m("h2", {
|
|
299
299
|
id: n,
|
|
300
|
-
className:
|
|
300
|
+
className: ye.modalHeaderTitle,
|
|
301
301
|
children: e
|
|
302
|
-
}), t && /* @__PURE__ */
|
|
302
|
+
}), t && /* @__PURE__ */ m("button", {
|
|
303
303
|
type: "button",
|
|
304
|
-
className:
|
|
304
|
+
className: ye.modalHeaderCloseButton,
|
|
305
305
|
onClick: t,
|
|
306
306
|
"aria-label": "Close modal",
|
|
307
|
-
children: /* @__PURE__ */
|
|
307
|
+
children: /* @__PURE__ */ m(F, { size: 16 })
|
|
308
308
|
})]
|
|
309
309
|
});
|
|
310
310
|
};
|
|
311
|
-
|
|
311
|
+
be.displayName = "ModalHeader";
|
|
312
312
|
//#endregion
|
|
313
313
|
//#region src/hooks/useModalKeyboard.ts
|
|
314
|
-
var
|
|
315
|
-
let
|
|
314
|
+
var xe = ({ isOpen: e, onClose: t }) => {
|
|
315
|
+
let n = i((n) => {
|
|
316
316
|
e && n.key === "Escape" && (n.preventDefault(), t?.());
|
|
317
317
|
}, [e, t]);
|
|
318
|
-
|
|
319
|
-
},
|
|
318
|
+
o(() => (document.addEventListener("keydown", n), () => document.removeEventListener("keydown", n)), [n]);
|
|
319
|
+
}, Se = {
|
|
320
320
|
overlay: "_overlay_dcudn_1",
|
|
321
321
|
"overlay--open": "_overlay--open_dcudn_14",
|
|
322
322
|
modal: "_modal_dcudn_20",
|
|
323
323
|
"overlay--animated": "_overlay--animated_dcudn_28"
|
|
324
|
-
},
|
|
325
|
-
let
|
|
326
|
-
|
|
327
|
-
}, [
|
|
328
|
-
return
|
|
329
|
-
isOpen:
|
|
330
|
-
onClose:
|
|
331
|
-
}),
|
|
332
|
-
if (
|
|
333
|
-
|
|
324
|
+
}, Ce = 0, we = "", Te = ({ children: e, onClose: t, isOpen: n, className: r, closeOnBackdrop: a, closeOnClick: s, closeOnEsc: c = !0, zIndex: u = 1e3, animated: d = !0 }) => {
|
|
325
|
+
let f = a ?? s ?? !0, p = l(null), { titleId: h, descriptionId: g } = fe(), _ = i((e) => {
|
|
326
|
+
f && e.target === e.currentTarget && t?.();
|
|
327
|
+
}, [f, t]);
|
|
328
|
+
return xe({
|
|
329
|
+
isOpen: n,
|
|
330
|
+
onClose: c ? t : void 0
|
|
331
|
+
}), o(() => {
|
|
332
|
+
if (n) return Ce === 0 && (we = document.body.style.overflow), Ce += 1, document.body.style.overflow = "hidden", () => {
|
|
333
|
+
Ce = Math.max(0, Ce - 1), Ce === 0 && (document.body.style.overflow = we);
|
|
334
334
|
};
|
|
335
|
-
}, [
|
|
336
|
-
className:
|
|
335
|
+
}, [n]), !n && !d ? null : /* @__PURE__ */ m(R, { children: /* @__PURE__ */ m("div", {
|
|
336
|
+
className: L(Se.overlay, n && Se["overlay--open"], d && Se["overlay--animated"], r),
|
|
337
337
|
onClick: _,
|
|
338
338
|
tabIndex: -1,
|
|
339
339
|
role: "presentation",
|
|
340
|
-
"aria-hidden": !
|
|
340
|
+
"aria-hidden": !n,
|
|
341
341
|
style: { zIndex: u },
|
|
342
|
-
children: /* @__PURE__ */
|
|
343
|
-
active:
|
|
342
|
+
children: /* @__PURE__ */ m(I, {
|
|
343
|
+
active: n,
|
|
344
344
|
focusTrapOptions: {
|
|
345
|
-
fallbackFocus: () =>
|
|
345
|
+
fallbackFocus: () => p.current,
|
|
346
346
|
returnFocusOnDeactivate: !0,
|
|
347
347
|
allowOutsideClick: !0
|
|
348
348
|
},
|
|
349
|
-
children: /* @__PURE__ */
|
|
350
|
-
ref:
|
|
349
|
+
children: /* @__PURE__ */ m("div", {
|
|
350
|
+
ref: p,
|
|
351
351
|
tabIndex: -1,
|
|
352
|
-
className:
|
|
352
|
+
className: Se.modal,
|
|
353
353
|
role: "dialog",
|
|
354
354
|
"aria-modal": "true",
|
|
355
355
|
"aria-labelledby": h,
|
|
@@ -359,43 +359,43 @@ var ye = ({ isOpen: e, onClose: t }) => {
|
|
|
359
359
|
})
|
|
360
360
|
}) });
|
|
361
361
|
};
|
|
362
|
-
|
|
362
|
+
Te.displayName = "ModalOverlay";
|
|
363
363
|
//#endregion
|
|
364
364
|
//#region src/components/Modal/Modal.tsx
|
|
365
|
-
var
|
|
366
|
-
let o =
|
|
365
|
+
var Ee = ({ isOpen: e, children: t, onClose: n, closeOnBackdrop: r, closeOnClick: i, closeOnEsc: a = !0 }) => {
|
|
366
|
+
let o = k({
|
|
367
367
|
isOpen: e,
|
|
368
368
|
onClose: n,
|
|
369
369
|
closeOnBackdrop: r,
|
|
370
370
|
closeOnClick: i,
|
|
371
371
|
closeOnEsc: a
|
|
372
372
|
});
|
|
373
|
-
return o.shouldRender ? /* @__PURE__ */
|
|
373
|
+
return o.shouldRender ? /* @__PURE__ */ m(de.Provider, {
|
|
374
374
|
value: {
|
|
375
375
|
onClose: o.onClose,
|
|
376
376
|
titleId: o.titleId,
|
|
377
377
|
descriptionId: o.descriptionId
|
|
378
378
|
},
|
|
379
|
-
children: /* @__PURE__ */
|
|
379
|
+
children: /* @__PURE__ */ m(Te, {
|
|
380
380
|
isOpen: o.isOpen,
|
|
381
381
|
onClose: o.onClose,
|
|
382
382
|
closeOnBackdrop: o.closeOnBackdrop,
|
|
383
383
|
closeOnEsc: o.closeOnEsc,
|
|
384
|
-
children: /* @__PURE__ */
|
|
384
|
+
children: /* @__PURE__ */ m(ge, { children: t })
|
|
385
385
|
})
|
|
386
386
|
}) : null;
|
|
387
387
|
};
|
|
388
|
-
|
|
388
|
+
Ee.displayName = "Modal";
|
|
389
389
|
//#endregion
|
|
390
390
|
//#region src/components/Modal/index.ts
|
|
391
|
-
var
|
|
392
|
-
Header:
|
|
393
|
-
Body:
|
|
394
|
-
Content:
|
|
395
|
-
Footer:
|
|
396
|
-
}),
|
|
397
|
-
function
|
|
398
|
-
return
|
|
391
|
+
var De = Object.assign(Ee, {
|
|
392
|
+
Header: be,
|
|
393
|
+
Body: me,
|
|
394
|
+
Content: ge,
|
|
395
|
+
Footer: ve
|
|
396
|
+
}), Oe = t(null), ke = Oe.Provider;
|
|
397
|
+
function Ae() {
|
|
398
|
+
return a(Oe);
|
|
399
399
|
}
|
|
400
400
|
var K = {
|
|
401
401
|
root: "_root_1n02e_1",
|
|
@@ -408,13 +408,13 @@ var K = {
|
|
|
408
408
|
error: "_error_1n02e_51",
|
|
409
409
|
disabled: "_disabled_1n02e_59",
|
|
410
410
|
invalid: "_invalid_1n02e_75"
|
|
411
|
-
},
|
|
412
|
-
let y =
|
|
411
|
+
}, je = n(({ value: e, defaultValue: t = "", onValueChange: n, disabled: r = !1, required: i = !1, size: a = "md", name: o, label: c, description: l, error: u, orientation: d = "vertical", children: f, className: p, id: g, ..._ }, v) => {
|
|
412
|
+
let y = s(), b = g ?? y, x = c ? `${b}-label` : void 0, S = l ? `${b}-description` : void 0, C = u ? `${b}-error` : void 0, w = [S, C].filter(Boolean).join(" ") || void 0, T = o ?? `${b}-radio`, [E, O] = D({
|
|
413
413
|
value: e,
|
|
414
414
|
defaultValue: t,
|
|
415
415
|
onChange: n
|
|
416
416
|
}), k = !!u;
|
|
417
|
-
return /* @__PURE__ */
|
|
417
|
+
return /* @__PURE__ */ h("div", {
|
|
418
418
|
..._,
|
|
419
419
|
ref: v,
|
|
420
420
|
id: b,
|
|
@@ -424,39 +424,39 @@ var K = {
|
|
|
424
424
|
"aria-disabled": r || void 0,
|
|
425
425
|
"aria-required": i || void 0,
|
|
426
426
|
"aria-invalid": k || void 0,
|
|
427
|
-
className:
|
|
427
|
+
className: L(K.root, k && K.invalid, r && K.disabled, p),
|
|
428
428
|
children: [
|
|
429
|
-
c && /* @__PURE__ */
|
|
429
|
+
c && /* @__PURE__ */ h("div", {
|
|
430
430
|
id: x,
|
|
431
431
|
className: K.label,
|
|
432
|
-
children: [c, i && /* @__PURE__ */
|
|
432
|
+
children: [c, i && /* @__PURE__ */ m("span", {
|
|
433
433
|
className: K.required,
|
|
434
434
|
"aria-hidden": "true",
|
|
435
435
|
children: "*"
|
|
436
436
|
})]
|
|
437
437
|
}),
|
|
438
|
-
l && /* @__PURE__ */
|
|
438
|
+
l && /* @__PURE__ */ m("div", {
|
|
439
439
|
id: S,
|
|
440
440
|
className: K.description,
|
|
441
441
|
children: l
|
|
442
442
|
}),
|
|
443
|
-
/* @__PURE__ */
|
|
443
|
+
/* @__PURE__ */ m(ke, {
|
|
444
444
|
value: {
|
|
445
|
-
name:
|
|
446
|
-
value:
|
|
445
|
+
name: T,
|
|
446
|
+
value: E,
|
|
447
447
|
disabled: r,
|
|
448
448
|
required: i,
|
|
449
449
|
invalid: k,
|
|
450
|
-
size:
|
|
450
|
+
size: a,
|
|
451
451
|
describedBy: w,
|
|
452
452
|
onValueChange: O
|
|
453
453
|
},
|
|
454
|
-
children: /* @__PURE__ */
|
|
455
|
-
className:
|
|
456
|
-
children:
|
|
454
|
+
children: /* @__PURE__ */ m("div", {
|
|
455
|
+
className: L(K.items, K[d]),
|
|
456
|
+
children: f
|
|
457
457
|
})
|
|
458
458
|
}),
|
|
459
|
-
u && /* @__PURE__ */
|
|
459
|
+
u && /* @__PURE__ */ m("div", {
|
|
460
460
|
id: C,
|
|
461
461
|
className: K.error,
|
|
462
462
|
children: u
|
|
@@ -464,7 +464,7 @@ var K = {
|
|
|
464
464
|
]
|
|
465
465
|
});
|
|
466
466
|
});
|
|
467
|
-
|
|
467
|
+
je.displayName = "RadioGroup";
|
|
468
468
|
var q = {
|
|
469
469
|
wrapper: "_wrapper_byl2d_1",
|
|
470
470
|
label: "_label_byl2d_9",
|
|
@@ -473,59 +473,59 @@ var q = {
|
|
|
473
473
|
control: "_control_byl2d_32",
|
|
474
474
|
errorText: "_errorText_byl2d_40",
|
|
475
475
|
disabled: "_disabled_byl2d_54"
|
|
476
|
-
},
|
|
477
|
-
let
|
|
478
|
-
return /* @__PURE__ */
|
|
479
|
-
...
|
|
476
|
+
}, Me = ({ id: e, label: t, description: n, error: r, required: i = !1, disabled: a = !1, children: o, className: s, controlClassName: c, labelClassName: l, descriptionClassName: u, errorClassName: d, ...f }) => {
|
|
477
|
+
let p = n && e ? `${e}-description` : void 0, g = r && e ? `${e}-error` : void 0;
|
|
478
|
+
return /* @__PURE__ */ h("div", {
|
|
479
|
+
...f,
|
|
480
480
|
"aria-disabled": a || void 0,
|
|
481
|
-
className:
|
|
481
|
+
className: L(q.wrapper, a && q.disabled, s),
|
|
482
482
|
"data-disabled": a || void 0,
|
|
483
483
|
"data-invalid": !!r || void 0,
|
|
484
484
|
children: [
|
|
485
|
-
t && /* @__PURE__ */
|
|
485
|
+
t && /* @__PURE__ */ h("label", {
|
|
486
486
|
htmlFor: e,
|
|
487
|
-
className:
|
|
488
|
-
children: [t, i && /* @__PURE__ */
|
|
487
|
+
className: L(q.label, l),
|
|
488
|
+
children: [t, i && /* @__PURE__ */ m("span", {
|
|
489
489
|
className: q.required,
|
|
490
490
|
"aria-hidden": "true",
|
|
491
491
|
children: "*"
|
|
492
492
|
})]
|
|
493
493
|
}),
|
|
494
|
-
n && /* @__PURE__ */
|
|
495
|
-
id:
|
|
496
|
-
className:
|
|
494
|
+
n && /* @__PURE__ */ m("div", {
|
|
495
|
+
id: p,
|
|
496
|
+
className: L(q.description, u),
|
|
497
497
|
children: n
|
|
498
498
|
}),
|
|
499
|
-
/* @__PURE__ */
|
|
500
|
-
className:
|
|
499
|
+
/* @__PURE__ */ m("div", {
|
|
500
|
+
className: L(q.control, c),
|
|
501
501
|
children: o
|
|
502
502
|
}),
|
|
503
|
-
r && /* @__PURE__ */
|
|
503
|
+
r && /* @__PURE__ */ m("div", {
|
|
504
504
|
id: g,
|
|
505
|
-
className:
|
|
505
|
+
className: L(q.errorText, d),
|
|
506
506
|
role: "alert",
|
|
507
507
|
children: r
|
|
508
508
|
})
|
|
509
509
|
]
|
|
510
510
|
});
|
|
511
|
-
},
|
|
511
|
+
}, Ne = {
|
|
512
512
|
option: "_option_l6qjj_1",
|
|
513
513
|
selected: "_selected_l6qjj_18",
|
|
514
514
|
disabled: "_disabled_l6qjj_18",
|
|
515
515
|
active: "_active_l6qjj_34",
|
|
516
516
|
label: "_label_l6qjj_46",
|
|
517
517
|
check: "_check_l6qjj_54"
|
|
518
|
-
},
|
|
518
|
+
}, Pe = ({ option: e, isSelected: t, isActive: n, optionId: r, onSelect: i, onMouseEnter: a }) => {
|
|
519
519
|
let o = !!e.disabled;
|
|
520
|
-
return /* @__PURE__ */
|
|
520
|
+
return /* @__PURE__ */ h("li", {
|
|
521
521
|
id: r,
|
|
522
522
|
role: "option",
|
|
523
523
|
"aria-selected": t,
|
|
524
524
|
"aria-disabled": o || void 0,
|
|
525
|
-
className:
|
|
526
|
-
[
|
|
527
|
-
[
|
|
528
|
-
[
|
|
525
|
+
className: L(Ne.option, {
|
|
526
|
+
[Ne.selected]: t,
|
|
527
|
+
[Ne.active]: n,
|
|
528
|
+
[Ne.disabled]: o
|
|
529
529
|
}),
|
|
530
530
|
onClick: () => {
|
|
531
531
|
o || i(e.value);
|
|
@@ -533,42 +533,44 @@ var q = {
|
|
|
533
533
|
onMouseEnter: () => {
|
|
534
534
|
o || a();
|
|
535
535
|
},
|
|
536
|
-
children: [/* @__PURE__ */
|
|
537
|
-
className:
|
|
536
|
+
children: [/* @__PURE__ */ m("span", {
|
|
537
|
+
className: Ne.label,
|
|
538
538
|
children: e.label
|
|
539
|
-
}), /* @__PURE__ */
|
|
540
|
-
className:
|
|
539
|
+
}), /* @__PURE__ */ m("span", {
|
|
540
|
+
className: Ne.check,
|
|
541
541
|
"aria-hidden": "true",
|
|
542
|
-
children: t && /* @__PURE__ */
|
|
542
|
+
children: t && /* @__PURE__ */ m(N, {})
|
|
543
543
|
})]
|
|
544
544
|
});
|
|
545
545
|
};
|
|
546
|
-
|
|
547
|
-
var
|
|
546
|
+
Pe.displayName = "SelectOption";
|
|
547
|
+
var Fe = {
|
|
548
548
|
dropdown: "_dropdown_qznlq_1",
|
|
549
549
|
dropdownIn: "_dropdownIn_qznlq_1",
|
|
550
550
|
empty: "_empty_qznlq_17"
|
|
551
|
-
},
|
|
551
|
+
}, Ie = ({ isOpen: e, listboxId: t, labelledById: n, setDropdownRef: r, style: i, options: a, noOptionsText: o, selectedValue: s, activeIndex: c, className: l, onSelect: u, onMouseEnter: d }) => e ? /* @__PURE__ */ m(R, { children: /* @__PURE__ */ m("ul", {
|
|
552
552
|
ref: r,
|
|
553
553
|
id: t,
|
|
554
554
|
role: "listbox",
|
|
555
555
|
"aria-labelledby": n,
|
|
556
|
-
className: [
|
|
556
|
+
className: [Fe.dropdown, l].filter(Boolean).join(" "),
|
|
557
557
|
style: i,
|
|
558
|
-
children: a.length ? a.map((e, n) => /* @__PURE__ */
|
|
558
|
+
children: a.length ? a.map((e, n) => /* @__PURE__ */ m(Pe, {
|
|
559
559
|
option: e,
|
|
560
560
|
isSelected: e.value === s,
|
|
561
561
|
isActive: n === c,
|
|
562
562
|
optionId: `${t}-option-${n}`,
|
|
563
563
|
onSelect: u,
|
|
564
564
|
onMouseEnter: () => d(n)
|
|
565
|
-
}, e.value)) : /* @__PURE__ */
|
|
566
|
-
|
|
567
|
-
|
|
565
|
+
}, e.value)) : /* @__PURE__ */ m("li", {
|
|
566
|
+
role: "option",
|
|
567
|
+
"aria-disabled": "true",
|
|
568
|
+
"aria-selected": "false",
|
|
569
|
+
className: Fe.empty,
|
|
568
570
|
children: o
|
|
569
571
|
})
|
|
570
572
|
}) }) : null;
|
|
571
|
-
|
|
573
|
+
Ie.displayName = "SelectDropdown";
|
|
572
574
|
var J = {
|
|
573
575
|
control: "_control_1xma1_1",
|
|
574
576
|
disabled: "_disabled_1xma1_18",
|
|
@@ -580,9 +582,9 @@ var J = {
|
|
|
580
582
|
placeholder: "_placeholder_1xma1_63",
|
|
581
583
|
error: "_error_1xma1_67",
|
|
582
584
|
open: "_open_1xma1_109"
|
|
583
|
-
},
|
|
585
|
+
}, Le = ({ id: e, errorId: t, isOpen: n, disabled: r, required: i, listboxId: a, activeIndex: o, ariaLabel: s, error: c, displayText: l, isPlaceholder: u, size: d = "md", className: f, buttonRef: p, onClick: g, onKeyDown: _, onBlur: v, onFocus: y }) => /* @__PURE__ */ h("button", {
|
|
584
586
|
id: e,
|
|
585
|
-
ref:
|
|
587
|
+
ref: p,
|
|
586
588
|
type: "button",
|
|
587
589
|
role: "combobox",
|
|
588
590
|
disabled: r,
|
|
@@ -595,52 +597,52 @@ var J = {
|
|
|
595
597
|
"aria-controls": n ? a : void 0,
|
|
596
598
|
"aria-describedby": t,
|
|
597
599
|
"aria-activedescendant": n && o >= 0 ? `${a}-option-${o}` : void 0,
|
|
598
|
-
className:
|
|
600
|
+
className: L(J.control, J[d], {
|
|
599
601
|
[J.error]: !!c,
|
|
600
602
|
[J.disabled]: r
|
|
601
|
-
},
|
|
603
|
+
}, f),
|
|
602
604
|
onClick: g,
|
|
603
605
|
onKeyDown: _,
|
|
604
606
|
onBlur: v,
|
|
605
607
|
onFocus: y,
|
|
606
|
-
children: [/* @__PURE__ */
|
|
607
|
-
className:
|
|
608
|
+
children: [/* @__PURE__ */ m("span", {
|
|
609
|
+
className: L(J.value, { [J.placeholder]: u }),
|
|
608
610
|
children: l
|
|
609
|
-
}), /* @__PURE__ */
|
|
610
|
-
className:
|
|
611
|
+
}), /* @__PURE__ */ m("span", {
|
|
612
|
+
className: L(J.arrow, { [J.open]: n }),
|
|
611
613
|
"aria-hidden": "true",
|
|
612
|
-
children: /* @__PURE__ */
|
|
614
|
+
children: /* @__PURE__ */ m(P, {})
|
|
613
615
|
})]
|
|
614
616
|
});
|
|
615
|
-
|
|
617
|
+
Le.displayName = "SelectTrigger";
|
|
616
618
|
//#endregion
|
|
617
619
|
//#region src/components/Select/Select.tsx
|
|
618
|
-
var
|
|
619
|
-
let j =
|
|
620
|
-
value:
|
|
621
|
-
defaultValue:
|
|
620
|
+
var Re = ({ label: e, description: t, id: n, name: r, "aria-label": a, value: o, defaultValue: c, onChange: u, options: d, placeholder: f = "Select...", noOptionsText: p = "No options available", size: g = "md", required: _ = !1, disabled: v = !1, error: y, placement: b = "bottom-start", matchTriggerWidth: x = !0, open: S, defaultOpen: C = !1, onOpenChange: w, onBlur: T, onFocus: E, className: D, triggerClassName: O, dropdownClassName: k }) => {
|
|
621
|
+
let j = s(), M = n ?? j, N = `${M}-listbox`, P = !!y, F = P ? `${M}-error` : void 0, I = l(null), L = l(null), { selectedValue: R, selectedOption: z, isOpen: B, setIsOpen: V, activeIndex: H, setActiveIndex: ne, closeDropdown: U, toggleDropdown: re, selectValue: W, onKeyDown: ie } = A({
|
|
622
|
+
value: o,
|
|
623
|
+
defaultValue: c,
|
|
622
624
|
onChange: u,
|
|
623
625
|
options: d,
|
|
624
626
|
disabled: v,
|
|
625
627
|
open: S,
|
|
626
628
|
defaultOpen: C,
|
|
627
629
|
onOpenChange: w
|
|
628
|
-
}),
|
|
629
|
-
open:
|
|
630
|
-
onOpenChange:
|
|
630
|
+
}), G = !!z, { floatingStyles: ae, setRef: oe, setFloatingRef: se } = ee({
|
|
631
|
+
open: B,
|
|
632
|
+
onOpenChange: V,
|
|
631
633
|
placement: b,
|
|
632
634
|
matchTriggerWidth: x,
|
|
633
635
|
mobileSheetBreakpoint: 640
|
|
634
|
-
}),
|
|
636
|
+
}), ce = i((e) => {
|
|
635
637
|
W(e), I.current?.focus();
|
|
636
638
|
}, [W]);
|
|
637
|
-
|
|
638
|
-
let
|
|
639
|
-
I.current = e,
|
|
640
|
-
}, [
|
|
641
|
-
L.current = e,
|
|
642
|
-
}, [
|
|
643
|
-
return /* @__PURE__ */
|
|
639
|
+
te([I, L], U, B);
|
|
640
|
+
let le = i((e) => {
|
|
641
|
+
I.current = e, oe(e);
|
|
642
|
+
}, [oe]), ue = i((e) => {
|
|
643
|
+
L.current = e, se(e);
|
|
644
|
+
}, [se]);
|
|
645
|
+
return /* @__PURE__ */ h(Me, {
|
|
644
646
|
id: M,
|
|
645
647
|
label: e,
|
|
646
648
|
description: t,
|
|
@@ -649,94 +651,94 @@ var Ie = ({ label: e, description: t, id: r, name: i, "aria-label": o, value: c,
|
|
|
649
651
|
disabled: v,
|
|
650
652
|
className: D,
|
|
651
653
|
children: [
|
|
652
|
-
/* @__PURE__ */
|
|
654
|
+
/* @__PURE__ */ m(Le, {
|
|
653
655
|
id: M,
|
|
654
656
|
errorId: F,
|
|
655
|
-
isOpen:
|
|
657
|
+
isOpen: B,
|
|
656
658
|
disabled: v,
|
|
657
659
|
required: _,
|
|
658
660
|
listboxId: N,
|
|
659
661
|
activeIndex: H,
|
|
660
|
-
ariaLabel:
|
|
662
|
+
ariaLabel: a ?? (e ? void 0 : z?.label || f),
|
|
661
663
|
error: P,
|
|
662
|
-
displayText: z?.label ??
|
|
663
|
-
isPlaceholder: !
|
|
664
|
+
displayText: z?.label ?? f,
|
|
665
|
+
isPlaceholder: !G,
|
|
664
666
|
size: g,
|
|
665
|
-
className:
|
|
666
|
-
buttonRef:
|
|
667
|
+
className: O,
|
|
668
|
+
buttonRef: le,
|
|
667
669
|
onClick: re,
|
|
668
670
|
onKeyDown: ie,
|
|
669
671
|
onBlur: T,
|
|
670
672
|
onFocus: E
|
|
671
673
|
}),
|
|
672
|
-
|
|
674
|
+
r && /* @__PURE__ */ m("input", {
|
|
673
675
|
type: "hidden",
|
|
674
|
-
name:
|
|
676
|
+
name: r,
|
|
675
677
|
value: R,
|
|
676
678
|
disabled: v
|
|
677
679
|
}),
|
|
678
|
-
/* @__PURE__ */
|
|
679
|
-
isOpen:
|
|
680
|
+
/* @__PURE__ */ m(Ie, {
|
|
681
|
+
isOpen: B,
|
|
680
682
|
listboxId: N,
|
|
681
683
|
labelledById: M,
|
|
682
|
-
style:
|
|
684
|
+
style: ae,
|
|
683
685
|
options: d,
|
|
684
|
-
noOptionsText:
|
|
686
|
+
noOptionsText: p,
|
|
685
687
|
selectedValue: R,
|
|
686
688
|
activeIndex: H,
|
|
687
|
-
className:
|
|
688
|
-
setDropdownRef:
|
|
689
|
-
onSelect:
|
|
689
|
+
className: k,
|
|
690
|
+
setDropdownRef: ue,
|
|
691
|
+
onSelect: ce,
|
|
690
692
|
onMouseEnter: ne
|
|
691
693
|
})
|
|
692
694
|
]
|
|
693
695
|
});
|
|
694
696
|
};
|
|
695
|
-
|
|
697
|
+
Re.displayName = "Select";
|
|
696
698
|
//#endregion
|
|
697
699
|
//#region src/components/Tabs/TabsContext.tsx
|
|
698
|
-
var
|
|
699
|
-
let e =
|
|
700
|
+
var ze = t(null), Be = () => {
|
|
701
|
+
let e = a(ze);
|
|
700
702
|
if (!e) throw Error("Tabs components must be used inside Tabs");
|
|
701
703
|
return e;
|
|
702
|
-
},
|
|
704
|
+
}, Ve = {
|
|
703
705
|
list: "_list_13hkl_1",
|
|
704
706
|
vertical: "_vertical_13hkl_8"
|
|
705
|
-
},
|
|
706
|
-
let { orientation: r, appearance: i } =
|
|
707
|
-
return /* @__PURE__ */
|
|
707
|
+
}, He = ({ children: e, className: t, ...n }) => {
|
|
708
|
+
let { orientation: r, appearance: i } = Be();
|
|
709
|
+
return /* @__PURE__ */ m("div", {
|
|
708
710
|
...n,
|
|
709
711
|
role: "tablist",
|
|
710
712
|
"aria-orientation": r,
|
|
711
|
-
className:
|
|
713
|
+
className: L(Ve.list, r === "vertical" && Ve.vertical, i === "underline" && Ve.underline, i === "pills" && Ve.pills, t),
|
|
712
714
|
children: e
|
|
713
715
|
});
|
|
714
716
|
};
|
|
715
|
-
|
|
716
|
-
var
|
|
717
|
+
He.displayName = "TabsList";
|
|
718
|
+
var Ue = {
|
|
717
719
|
panel: "_panel_1v1a9_1",
|
|
718
720
|
visible: "_visible_1v1a9_10",
|
|
719
721
|
vertical: "_vertical_1v1a9_14"
|
|
720
|
-
},
|
|
721
|
-
let { activeIndex: r, orientation:
|
|
722
|
-
return
|
|
723
|
-
if (!
|
|
722
|
+
}, We = ({ index: e, children: t, className: n }) => {
|
|
723
|
+
let { activeIndex: r, orientation: i } = Be(), [a, s] = u(!1), c = r === e;
|
|
724
|
+
return o(() => {
|
|
725
|
+
if (!c) {
|
|
724
726
|
s(!1);
|
|
725
727
|
return;
|
|
726
728
|
}
|
|
727
729
|
let e = setTimeout(() => s(!0), 10);
|
|
728
730
|
return () => clearTimeout(e);
|
|
729
|
-
}, [
|
|
731
|
+
}, [c]), /* @__PURE__ */ m("div", {
|
|
730
732
|
role: "tabpanel",
|
|
731
733
|
id: `tab-panel-${e}`,
|
|
732
734
|
"aria-labelledby": `tab-${e}`,
|
|
733
|
-
hidden: !
|
|
735
|
+
hidden: !c,
|
|
734
736
|
tabIndex: 0,
|
|
735
|
-
className:
|
|
737
|
+
className: L(Ue.panel, a && Ue.visible, i === "vertical" && Ue.vertical, n),
|
|
736
738
|
children: t
|
|
737
739
|
});
|
|
738
740
|
};
|
|
739
|
-
|
|
741
|
+
We.displayName = "TabsPanel";
|
|
740
742
|
var Y = {
|
|
741
743
|
tab: "_tab_qe8xc_1",
|
|
742
744
|
iconOnly: "_iconOnly_qe8xc_27",
|
|
@@ -746,11 +748,11 @@ var Y = {
|
|
|
746
748
|
underline: "_underline_qe8xc_60",
|
|
747
749
|
pills: "_pills_qe8xc_92",
|
|
748
750
|
vertical: "_vertical_qe8xc_106"
|
|
749
|
-
},
|
|
750
|
-
let { activeIndex: u, setActiveIndex: d, orientation:
|
|
751
|
-
return /* @__PURE__ */
|
|
751
|
+
}, Ge = n(({ index: e, children: t, className: n, disabled: r = !1, icon: a, onClick: o, onKeyDown: s, ...c }, l) => {
|
|
752
|
+
let { activeIndex: u, setActiveIndex: d, orientation: f, appearance: p = "default", registerTab: g, onTabKeyDown: _ } = Be(), v = u === e, y = !!a, b = y && t == null;
|
|
753
|
+
return /* @__PURE__ */ h("button", {
|
|
752
754
|
type: "button",
|
|
753
|
-
ref:
|
|
755
|
+
ref: i((t) => {
|
|
754
756
|
g(e, t), typeof l == "function" ? l(t) : l && (l.current = t);
|
|
755
757
|
}, [
|
|
756
758
|
g,
|
|
@@ -761,39 +763,39 @@ var Y = {
|
|
|
761
763
|
"aria-selected": v,
|
|
762
764
|
"aria-controls": `tab-panel-${e}`,
|
|
763
765
|
id: `tab-${e}`,
|
|
764
|
-
disabled:
|
|
766
|
+
disabled: r,
|
|
765
767
|
tabIndex: v ? 0 : -1,
|
|
766
|
-
className:
|
|
768
|
+
className: L(Y.tab, Y[p], f === "vertical" && Y.vertical, y && Y.withIcon, b && Y.iconOnly, n),
|
|
767
769
|
onClick: (t) => {
|
|
768
|
-
|
|
770
|
+
r || (d(e), o?.(t));
|
|
769
771
|
},
|
|
770
772
|
onKeyDown: (e) => {
|
|
771
773
|
_(e), s?.(e);
|
|
772
774
|
},
|
|
773
775
|
...c,
|
|
774
|
-
children: [y && /* @__PURE__ */
|
|
776
|
+
children: [y && /* @__PURE__ */ m("span", {
|
|
775
777
|
className: Y.tabIcon,
|
|
776
778
|
"aria-hidden": "true",
|
|
777
779
|
children: a
|
|
778
|
-
}), t != null && /* @__PURE__ */
|
|
780
|
+
}), t != null && /* @__PURE__ */ m("span", {
|
|
779
781
|
className: Y.label,
|
|
780
782
|
children: t
|
|
781
783
|
})]
|
|
782
784
|
});
|
|
783
785
|
});
|
|
784
|
-
|
|
785
|
-
var
|
|
786
|
+
Ge.displayName = "Tab";
|
|
787
|
+
var Ke = {
|
|
786
788
|
tabs: "_tabs_uqy7q_1",
|
|
787
789
|
vertical: "_vertical_uqy7q_5"
|
|
788
|
-
},
|
|
789
|
-
let { activeIndex:
|
|
790
|
+
}, qe = ({ children: e, activeIndex: t, defaultActiveIndex: n = 0, onChange: r, orientation: a = "horizontal", appearance: o = "default", className: s }) => {
|
|
791
|
+
let { activeIndex: c, setActiveIndex: u } = j({
|
|
790
792
|
activeIndex: t,
|
|
791
|
-
defaultActiveIndex:
|
|
792
|
-
onChange:
|
|
793
|
-
}), d =
|
|
793
|
+
defaultActiveIndex: n,
|
|
794
|
+
onChange: r
|
|
795
|
+
}), d = l([]), f = i((e, t) => {
|
|
794
796
|
d.current[e] = t;
|
|
795
|
-
}, []), { onKeyDown:
|
|
796
|
-
activeIndex:
|
|
797
|
+
}, []), { onKeyDown: p } = M({
|
|
798
|
+
activeIndex: c,
|
|
797
799
|
setActiveIndex: u,
|
|
798
800
|
tabRefs: d,
|
|
799
801
|
orientation: a,
|
|
@@ -801,32 +803,32 @@ var We = {
|
|
|
801
803
|
d.current[e]?.focus();
|
|
802
804
|
}
|
|
803
805
|
}), h = {
|
|
804
|
-
activeIndex:
|
|
806
|
+
activeIndex: c,
|
|
805
807
|
setActiveIndex: u,
|
|
806
808
|
orientation: a,
|
|
807
809
|
appearance: o,
|
|
808
|
-
registerTab:
|
|
809
|
-
onTabKeyDown:
|
|
810
|
+
registerTab: f,
|
|
811
|
+
onTabKeyDown: p
|
|
810
812
|
};
|
|
811
|
-
return /* @__PURE__ */
|
|
813
|
+
return /* @__PURE__ */ m(ze.Provider, {
|
|
812
814
|
value: h,
|
|
813
|
-
children: /* @__PURE__ */
|
|
814
|
-
className:
|
|
815
|
+
children: /* @__PURE__ */ m("div", {
|
|
816
|
+
className: L(Ke.tabs, a === "vertical" && Ke.vertical, s),
|
|
815
817
|
children: e
|
|
816
818
|
})
|
|
817
819
|
});
|
|
818
820
|
};
|
|
819
|
-
|
|
821
|
+
qe.displayName = "Tabs";
|
|
820
822
|
//#endregion
|
|
821
823
|
//#region src/components/Tabs/index.ts
|
|
822
|
-
var
|
|
823
|
-
List:
|
|
824
|
-
Tab:
|
|
825
|
-
Panel:
|
|
826
|
-
}),
|
|
824
|
+
var Je = Object.assign(qe, {
|
|
825
|
+
List: He,
|
|
826
|
+
Tab: Ge,
|
|
827
|
+
Panel: We
|
|
828
|
+
}), Ye = {
|
|
827
829
|
tooltip: "_tooltip_10opu_1",
|
|
828
830
|
arrow: "_arrow_10opu_25"
|
|
829
|
-
},
|
|
831
|
+
}, Xe = n(({ content: e, placement: t = "top", arrowRef: n, arrowX: r, arrowY: i, className: a, style: o, ...s }, c) => {
|
|
830
832
|
let l = {
|
|
831
833
|
top: "bottom",
|
|
832
834
|
right: "left",
|
|
@@ -839,45 +841,45 @@ var Ke = Object.assign(Ge, {
|
|
|
839
841
|
top: i == null ? "" : `${i}px`,
|
|
840
842
|
[l]: "-5px"
|
|
841
843
|
};
|
|
842
|
-
return /* @__PURE__ */
|
|
844
|
+
return /* @__PURE__ */ h("div", {
|
|
843
845
|
ref: c,
|
|
844
|
-
className:
|
|
846
|
+
className: L(Ye.tooltip, a),
|
|
845
847
|
"data-placement": t,
|
|
846
848
|
"data-state": "open",
|
|
847
849
|
style: o,
|
|
848
850
|
...s,
|
|
849
|
-
children: [e, /* @__PURE__ */
|
|
851
|
+
children: [e, /* @__PURE__ */ m("div", {
|
|
850
852
|
ref: n,
|
|
851
|
-
className:
|
|
853
|
+
className: Ye.arrow,
|
|
852
854
|
style: u
|
|
853
855
|
})]
|
|
854
856
|
});
|
|
855
857
|
});
|
|
856
|
-
|
|
858
|
+
Xe.displayName = "TooltipContent";
|
|
857
859
|
//#endregion
|
|
858
860
|
//#region src/components/Tooltip/Tooltip.tsx
|
|
859
|
-
var
|
|
861
|
+
var Ze = ({ children: e, placement: t = "top", content: n, disabled: r = !1, delay: i = {
|
|
860
862
|
open: 300,
|
|
861
863
|
close: 100
|
|
862
|
-
}, maxWidth:
|
|
863
|
-
let [
|
|
864
|
-
open:
|
|
864
|
+
}, maxWidth: a = 250, className: o, onOpenChange: c }) => {
|
|
865
|
+
let [d, f] = u(!1), v = l(null), y = s(), { context: b, floatingStyles: x, middlewareData: S, setRef: C, setFloatingRef: D, placement: O } = ee({
|
|
866
|
+
open: d,
|
|
865
867
|
onOpenChange: (e) => {
|
|
866
|
-
r || (
|
|
868
|
+
r || (f(e), c?.(e));
|
|
867
869
|
},
|
|
868
870
|
placement: t,
|
|
869
|
-
middleware: [
|
|
870
|
-
}), k =
|
|
871
|
+
middleware: [_({ element: v })]
|
|
872
|
+
}), k = S.arrow?.x, A = S.arrow?.y, { getReferenceProps: j, getFloatingProps: M } = E([T(b, { delay: {
|
|
871
873
|
open: i.open,
|
|
872
874
|
close: i.close
|
|
873
|
-
} }),
|
|
874
|
-
return /* @__PURE__ */ p
|
|
875
|
-
ref:
|
|
875
|
+
} }), w(b)]);
|
|
876
|
+
return /* @__PURE__ */ h(p, { children: [/* @__PURE__ */ m("div", {
|
|
877
|
+
ref: C,
|
|
876
878
|
style: { display: "inline-flex" },
|
|
877
|
-
"aria-describedby":
|
|
879
|
+
"aria-describedby": d ? y : void 0,
|
|
878
880
|
...j(),
|
|
879
881
|
children: e
|
|
880
|
-
}), /* @__PURE__ */
|
|
882
|
+
}), /* @__PURE__ */ m(g, { children: d && n && /* @__PURE__ */ m(Xe, {
|
|
881
883
|
id: y,
|
|
882
884
|
ref: D,
|
|
883
885
|
content: n,
|
|
@@ -887,166 +889,236 @@ var Ye = ({ children: e, placement: t = "top", content: n, disabled: r = !1, del
|
|
|
887
889
|
role: "tooltip",
|
|
888
890
|
style: {
|
|
889
891
|
...x,
|
|
890
|
-
maxWidth: typeof
|
|
892
|
+
maxWidth: typeof a == "number" ? `${a}px` : a
|
|
891
893
|
},
|
|
892
894
|
placement: O,
|
|
893
|
-
className:
|
|
895
|
+
className: o,
|
|
894
896
|
...M()
|
|
895
897
|
}) })] });
|
|
896
898
|
};
|
|
897
|
-
|
|
899
|
+
Ze.displayName = "Tooltip";
|
|
898
900
|
//#endregion
|
|
899
901
|
//#region src/utils/devWarning.ts
|
|
900
|
-
var
|
|
902
|
+
var Qe = (e, t) => {
|
|
901
903
|
process.env.NODE_ENV !== "production" && !e && console.warn(t);
|
|
902
904
|
}, X = {
|
|
903
|
-
button: "
|
|
904
|
-
solid: "
|
|
905
|
-
primary: "
|
|
906
|
-
loading: "
|
|
907
|
-
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
|
|
905
|
+
button: "_button_2nghu_1",
|
|
906
|
+
solid: "_solid_2nghu_22",
|
|
907
|
+
primary: "_primary_2nghu_22",
|
|
908
|
+
loading: "_loading_2nghu_22",
|
|
909
|
+
neutral: "_neutral_2nghu_48",
|
|
910
|
+
success: "_success_2nghu_74",
|
|
911
|
+
warning: "_warning_2nghu_100",
|
|
912
|
+
danger: "_danger_2nghu_126",
|
|
913
|
+
outline: "_outline_2nghu_152",
|
|
914
|
+
ghost: "_ghost_2nghu_282",
|
|
915
|
+
soft: "_soft_2nghu_412",
|
|
916
|
+
link: "_link_2nghu_542",
|
|
917
|
+
square: "_square_2nghu_685",
|
|
918
|
+
rounded: "_rounded_2nghu_689",
|
|
919
|
+
pill: "_pill_2nghu_693",
|
|
920
|
+
sm: "_sm_2nghu_697",
|
|
921
|
+
md: "_md_2nghu_703",
|
|
922
|
+
lg: "_lg_2nghu_709",
|
|
923
|
+
fullWidth: "_fullWidth_2nghu_715",
|
|
924
|
+
iconOnly: "_iconOnly_2nghu_719",
|
|
925
|
+
label: "_label_2nghu_723",
|
|
926
|
+
labelText: "_labelText_2nghu_745",
|
|
927
|
+
icon: "_icon_2nghu_719",
|
|
928
|
+
spinner: "_spinner_2nghu_764",
|
|
929
|
+
"button-spin": "_button-spin_2nghu_1",
|
|
930
|
+
badge: "_badge_2nghu_786",
|
|
931
|
+
shortcut: "_shortcut_2nghu_800"
|
|
932
|
+
}, $e = n(({ children: t, color: n = "primary", appearance: i = "solid", size: a = "md", shape: o = "pill", type: s = "button", disabled: c = !1, loading: l = !1, loadingText: u, iconStart: d, iconEnd: f, spinner: g, badge: _, shortcut: v, tooltip: y, fullWidth: b = !1, iconOnly: x = !1, asChild: S = !1, className: C, onClick: w, "aria-label": T, "aria-labelledby": E, href: D, target: O, rel: k, download: A, id: j, role: M, tabIndex: N, ...P }, F) => {
|
|
933
|
+
let I = S && r(t) ? t : void 0, R = I ? I.props.children : t, z = x || !R && !!(d || f), B = !!(T || E || I?.props["aria-label"] || I?.props["aria-labelledby"]), V = c || l, ee = l && u ? u : R, te = u && R && !z && (typeof R == "string" || typeof R == "number") && (typeof u == "string" || typeof u == "number") ? String(l ? R : u) : void 0, H = O === "_blank" && !k ? "noreferrer noopener" : k, ne = L(X.button, X[n], X[i], X[a], X[o], C, {
|
|
934
|
+
[X.disabled]: V,
|
|
935
|
+
[X.loading]: l,
|
|
936
|
+
[X.fullWidth]: b,
|
|
937
|
+
[X.iconOnly]: z
|
|
938
|
+
});
|
|
939
|
+
Qe(!S || !D, "Button: pass href to the child element when using asChild."), Qe(!S || !!I, "Button: asChild requires a single valid React element child."), Qe(!z || B, "Button: icon-only buttons must provide aria-label or aria-labelledby.");
|
|
940
|
+
let U = (e) => {
|
|
941
|
+
e.preventDefault(), e.stopPropagation();
|
|
942
|
+
}, re = (e) => {
|
|
943
|
+
if (V) {
|
|
944
|
+
U(e);
|
|
945
|
+
return;
|
|
946
|
+
}
|
|
947
|
+
I?.props.onClick?.(e), e.defaultPrevented || w?.(e);
|
|
948
|
+
}, W = /* @__PURE__ */ h(p, { children: [
|
|
949
|
+
l && (g ? /* @__PURE__ */ m("span", {
|
|
950
|
+
className: X.icon,
|
|
951
|
+
"aria-hidden": "true",
|
|
952
|
+
children: g
|
|
953
|
+
}) : /* @__PURE__ */ m("span", {
|
|
954
|
+
className: X.spinner,
|
|
955
|
+
"aria-hidden": "true"
|
|
956
|
+
})),
|
|
957
|
+
!l && d && /* @__PURE__ */ m("span", {
|
|
958
|
+
className: X.icon,
|
|
959
|
+
children: d
|
|
936
960
|
}),
|
|
937
|
-
|
|
938
|
-
|
|
939
|
-
|
|
940
|
-
|
|
941
|
-
|
|
942
|
-
|
|
943
|
-
className: X.icon,
|
|
944
|
-
children: c
|
|
945
|
-
}),
|
|
946
|
-
x && !y && /* @__PURE__ */ f("span", {
|
|
947
|
-
className: X.label,
|
|
948
|
-
children: x
|
|
949
|
-
}),
|
|
950
|
-
!o && l && /* @__PURE__ */ f("span", {
|
|
951
|
-
className: X.icon,
|
|
952
|
-
children: l
|
|
961
|
+
ee && !z && /* @__PURE__ */ m("span", {
|
|
962
|
+
className: X.label,
|
|
963
|
+
"data-measure": te,
|
|
964
|
+
children: /* @__PURE__ */ m("span", {
|
|
965
|
+
className: X.labelText,
|
|
966
|
+
children: ee
|
|
953
967
|
})
|
|
954
|
-
|
|
968
|
+
}),
|
|
969
|
+
_ && !z && /* @__PURE__ */ m("span", {
|
|
970
|
+
className: X.badge,
|
|
971
|
+
children: _
|
|
972
|
+
}),
|
|
973
|
+
v && !z && /* @__PURE__ */ m("span", {
|
|
974
|
+
className: X.shortcut,
|
|
975
|
+
children: v
|
|
976
|
+
}),
|
|
977
|
+
!l && f && /* @__PURE__ */ m("span", {
|
|
978
|
+
className: X.icon,
|
|
979
|
+
children: f
|
|
980
|
+
})
|
|
981
|
+
] });
|
|
982
|
+
return I ? e(I, {
|
|
983
|
+
...P,
|
|
984
|
+
ref: F,
|
|
985
|
+
"aria-busy": l || void 0,
|
|
986
|
+
"aria-disabled": V || void 0,
|
|
987
|
+
"aria-label": T || I.props["aria-label"] || void 0,
|
|
988
|
+
"aria-labelledby": E || I.props["aria-labelledby"] || void 0,
|
|
989
|
+
className: L(I.props.className, ne),
|
|
990
|
+
href: V ? void 0 : I.props.href,
|
|
991
|
+
onClick: re,
|
|
992
|
+
tabIndex: V ? -1 : I.props.tabIndex,
|
|
993
|
+
title: y || I.props.title,
|
|
994
|
+
children: W
|
|
995
|
+
}) : D ? /* @__PURE__ */ m("a", {
|
|
996
|
+
ref: F,
|
|
997
|
+
href: V ? void 0 : D,
|
|
998
|
+
id: j,
|
|
999
|
+
role: M,
|
|
1000
|
+
tabIndex: V ? -1 : N,
|
|
1001
|
+
target: O,
|
|
1002
|
+
rel: H,
|
|
1003
|
+
download: A,
|
|
1004
|
+
onClick: V ? U : w,
|
|
1005
|
+
"aria-disabled": V || void 0,
|
|
1006
|
+
"aria-label": T || void 0,
|
|
1007
|
+
"aria-labelledby": E || void 0,
|
|
1008
|
+
"aria-busy": l || void 0,
|
|
1009
|
+
className: ne,
|
|
1010
|
+
title: y,
|
|
1011
|
+
children: W
|
|
1012
|
+
}) : /* @__PURE__ */ m("button", {
|
|
1013
|
+
...P,
|
|
1014
|
+
ref: F,
|
|
1015
|
+
id: j,
|
|
1016
|
+
role: M,
|
|
1017
|
+
tabIndex: N,
|
|
1018
|
+
type: s,
|
|
1019
|
+
disabled: V,
|
|
1020
|
+
onClick: V ? void 0 : w,
|
|
1021
|
+
"aria-label": T || void 0,
|
|
1022
|
+
"aria-labelledby": E || void 0,
|
|
1023
|
+
"aria-busy": l || void 0,
|
|
1024
|
+
className: ne,
|
|
1025
|
+
title: y,
|
|
1026
|
+
children: W
|
|
955
1027
|
});
|
|
956
1028
|
});
|
|
957
|
-
|
|
1029
|
+
$e.displayName = "Button";
|
|
958
1030
|
var Z = {
|
|
959
|
-
wrapper: "
|
|
960
|
-
wrapperSm: "
|
|
961
|
-
wrapperMd: "
|
|
962
|
-
wrapperLg: "
|
|
963
|
-
iconOnly: "
|
|
964
|
-
container: "
|
|
965
|
-
containerSm: "
|
|
966
|
-
containerMd: "
|
|
967
|
-
containerLg: "
|
|
968
|
-
input: "
|
|
969
|
-
customCheckbox: "
|
|
970
|
-
requiredMark: "
|
|
971
|
-
error: "
|
|
972
|
-
checkmark: "
|
|
973
|
-
indeterminateMark: "
|
|
974
|
-
label: "
|
|
975
|
-
descriptionText: "
|
|
976
|
-
errorText: "
|
|
977
|
-
labelSm: "
|
|
978
|
-
labelMd: "
|
|
979
|
-
labelLg: "
|
|
980
|
-
indeterminate: "
|
|
981
|
-
disabled: "
|
|
982
|
-
},
|
|
1031
|
+
wrapper: "_wrapper_2j84j_1",
|
|
1032
|
+
wrapperSm: "_wrapperSm_2j84j_12",
|
|
1033
|
+
wrapperMd: "_wrapperMd_2j84j_18",
|
|
1034
|
+
wrapperLg: "_wrapperLg_2j84j_24",
|
|
1035
|
+
iconOnly: "_iconOnly_2j84j_30",
|
|
1036
|
+
container: "_container_2j84j_36",
|
|
1037
|
+
containerSm: "_containerSm_2j84j_43",
|
|
1038
|
+
containerMd: "_containerMd_2j84j_47",
|
|
1039
|
+
containerLg: "_containerLg_2j84j_51",
|
|
1040
|
+
input: "_input_2j84j_55",
|
|
1041
|
+
customCheckbox: "_customCheckbox_2j84j_67",
|
|
1042
|
+
requiredMark: "_requiredMark_2j84j_81",
|
|
1043
|
+
error: "_error_2j84j_92",
|
|
1044
|
+
checkmark: "_checkmark_2j84j_97",
|
|
1045
|
+
indeterminateMark: "_indeterminateMark_2j84j_113",
|
|
1046
|
+
label: "_label_2j84j_123",
|
|
1047
|
+
descriptionText: "_descriptionText_2j84j_129",
|
|
1048
|
+
errorText: "_errorText_2j84j_136",
|
|
1049
|
+
labelSm: "_labelSm_2j84j_143",
|
|
1050
|
+
labelMd: "_labelMd_2j84j_147",
|
|
1051
|
+
labelLg: "_labelLg_2j84j_151",
|
|
1052
|
+
indeterminate: "_indeterminate_2j84j_113",
|
|
1053
|
+
disabled: "_disabled_2j84j_223"
|
|
1054
|
+
}, et = {
|
|
983
1055
|
sm: Z.labelSm,
|
|
984
1056
|
md: Z.labelMd,
|
|
985
1057
|
lg: Z.labelLg
|
|
986
|
-
},
|
|
1058
|
+
}, tt = {
|
|
987
1059
|
sm: Z.wrapperSm,
|
|
988
1060
|
md: Z.wrapperMd,
|
|
989
1061
|
lg: Z.wrapperLg
|
|
990
|
-
},
|
|
1062
|
+
}, nt = {
|
|
991
1063
|
sm: Z.containerSm,
|
|
992
1064
|
md: Z.containerMd,
|
|
993
1065
|
lg: Z.containerLg
|
|
994
|
-
},
|
|
995
|
-
let w =
|
|
1066
|
+
}, rt = n(({ id: e, label: t, description: n, checked: r, size: a = "md", defaultChecked: c = !1, disabled: u = !1, required: d = !1, indeterminate: f = !1, className: p, wrapperClassName: g, onCheckedChange: _, error: v, "aria-label": y, "aria-labelledby": b, "aria-describedby": x, ...S }, C) => {
|
|
1067
|
+
let w = s(), T = e ?? w, E = l(null), O = !!v, k = n ? `${T}-description` : void 0, A = O ? `${T}-error` : void 0, j = [
|
|
996
1068
|
x,
|
|
997
1069
|
k,
|
|
998
1070
|
A
|
|
999
|
-
].filter(Boolean).join(" "), [
|
|
1000
|
-
value:
|
|
1001
|
-
defaultValue:
|
|
1071
|
+
].filter(Boolean).join(" "), [M, P] = D({
|
|
1072
|
+
value: r,
|
|
1073
|
+
defaultValue: c,
|
|
1002
1074
|
onChange: _
|
|
1003
|
-
}),
|
|
1004
|
-
if (
|
|
1075
|
+
}), F = i((e) => {
|
|
1076
|
+
if (E.current = e, typeof C == "function") {
|
|
1005
1077
|
C(e);
|
|
1006
1078
|
return;
|
|
1007
1079
|
}
|
|
1008
1080
|
C && (C.current = e);
|
|
1009
1081
|
}, [C]);
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
}, [
|
|
1013
|
-
let
|
|
1082
|
+
o(() => {
|
|
1083
|
+
E.current && (E.current.indeterminate = f);
|
|
1084
|
+
}, [f]);
|
|
1085
|
+
let I = (e) => {
|
|
1014
1086
|
P(e.target.checked);
|
|
1015
1087
|
};
|
|
1016
|
-
return
|
|
1017
|
-
className:
|
|
1088
|
+
return Qe(!!(t || y || b), "Checkbox: an accessible label must be provided through label, aria-label, or aria-labelledby."), /* @__PURE__ */ h("div", {
|
|
1089
|
+
className: L(Z.container, nt[a], p),
|
|
1018
1090
|
children: [
|
|
1019
|
-
/* @__PURE__ */
|
|
1020
|
-
htmlFor:
|
|
1021
|
-
className:
|
|
1091
|
+
/* @__PURE__ */ h("label", {
|
|
1092
|
+
htmlFor: T,
|
|
1093
|
+
className: L(Z.wrapper, tt[a], !t && Z.iconOnly, u && Z.disabled, g),
|
|
1022
1094
|
children: [
|
|
1023
|
-
/* @__PURE__ */
|
|
1095
|
+
/* @__PURE__ */ m("input", {
|
|
1024
1096
|
...S,
|
|
1025
|
-
ref:
|
|
1026
|
-
id:
|
|
1097
|
+
ref: F,
|
|
1098
|
+
id: T,
|
|
1027
1099
|
type: "checkbox",
|
|
1028
|
-
checked:
|
|
1100
|
+
checked: M,
|
|
1029
1101
|
disabled: u,
|
|
1030
1102
|
required: d,
|
|
1031
|
-
onChange:
|
|
1103
|
+
onChange: I,
|
|
1032
1104
|
className: Z.input,
|
|
1033
1105
|
"aria-label": y,
|
|
1034
1106
|
"aria-labelledby": b,
|
|
1035
|
-
"aria-checked":
|
|
1107
|
+
"aria-checked": f ? "mixed" : S["aria-checked"],
|
|
1036
1108
|
"aria-invalid": O ? !0 : S["aria-invalid"],
|
|
1037
|
-
"aria-describedby":
|
|
1109
|
+
"aria-describedby": j || void 0
|
|
1038
1110
|
}),
|
|
1039
|
-
/* @__PURE__ */
|
|
1040
|
-
className:
|
|
1111
|
+
/* @__PURE__ */ m("span", {
|
|
1112
|
+
className: L(Z.customCheckbox, O && Z.error, f && Z.indeterminate),
|
|
1041
1113
|
"aria-hidden": "true",
|
|
1042
|
-
children:
|
|
1114
|
+
children: f ? /* @__PURE__ */ m("span", { className: Z.indeterminateMark }) : M && /* @__PURE__ */ m("span", {
|
|
1043
1115
|
className: Z.checkmark,
|
|
1044
|
-
children: /* @__PURE__ */
|
|
1116
|
+
children: /* @__PURE__ */ m(N, {})
|
|
1045
1117
|
})
|
|
1046
1118
|
}),
|
|
1047
|
-
t && /* @__PURE__ */
|
|
1048
|
-
className:
|
|
1049
|
-
children: [t, d && /* @__PURE__ */
|
|
1119
|
+
t && /* @__PURE__ */ h("span", {
|
|
1120
|
+
className: L(Z.label, et[a]),
|
|
1121
|
+
children: [t, d && /* @__PURE__ */ m("span", {
|
|
1050
1122
|
className: Z.requiredMark,
|
|
1051
1123
|
"aria-hidden": "true",
|
|
1052
1124
|
children: "*"
|
|
@@ -1054,12 +1126,12 @@ var Z = {
|
|
|
1054
1126
|
})
|
|
1055
1127
|
]
|
|
1056
1128
|
}),
|
|
1057
|
-
|
|
1129
|
+
n && /* @__PURE__ */ m("span", {
|
|
1058
1130
|
id: k,
|
|
1059
1131
|
className: Z.descriptionText,
|
|
1060
|
-
children:
|
|
1132
|
+
children: n
|
|
1061
1133
|
}),
|
|
1062
|
-
O && /* @__PURE__ */
|
|
1134
|
+
O && /* @__PURE__ */ m("span", {
|
|
1063
1135
|
id: A,
|
|
1064
1136
|
className: Z.errorText,
|
|
1065
1137
|
children: v
|
|
@@ -1067,7 +1139,7 @@ var Z = {
|
|
|
1067
1139
|
]
|
|
1068
1140
|
});
|
|
1069
1141
|
});
|
|
1070
|
-
|
|
1142
|
+
rt.displayName = "Checkbox";
|
|
1071
1143
|
var Q = {
|
|
1072
1144
|
inputWrapper: "_inputWrapper_13w4m_1",
|
|
1073
1145
|
input: "_input_13w4m_1",
|
|
@@ -1087,7 +1159,7 @@ var Q = {
|
|
|
1087
1159
|
toneDanger: "_toneDanger_13w4m_205",
|
|
1088
1160
|
toneMuted: "_toneMuted_13w4m_209",
|
|
1089
1161
|
toneInverse: "_toneInverse_13w4m_213"
|
|
1090
|
-
},
|
|
1162
|
+
}, it = {
|
|
1091
1163
|
default: Q.toneDefault,
|
|
1092
1164
|
primary: Q.tonePrimary,
|
|
1093
1165
|
secondary: Q.toneSecondary,
|
|
@@ -1095,7 +1167,7 @@ var Q = {
|
|
|
1095
1167
|
danger: Q.toneDanger,
|
|
1096
1168
|
muted: Q.toneMuted,
|
|
1097
1169
|
inverse: Q.toneInverse
|
|
1098
|
-
},
|
|
1170
|
+
}, at = (e = "text", t) => {
|
|
1099
1171
|
if (t) return t;
|
|
1100
1172
|
switch (e) {
|
|
1101
1173
|
case "email": return "email";
|
|
@@ -1105,78 +1177,78 @@ var Q = {
|
|
|
1105
1177
|
case "search": return "off";
|
|
1106
1178
|
default: return;
|
|
1107
1179
|
}
|
|
1108
|
-
},
|
|
1109
|
-
let z =
|
|
1180
|
+
}, ot = n(({ id: e, label: t, name: n, description: r, placeholder: a, value: o, defaultValue: c, onChange: d, type: f = "text", size: p = "md", error: g, disabled: _ = !1, required: v = !1, className: y, autoComplete: b, readOnly: x = !1, clearable: S = !1, onClear: C, leftAdornment: w, rightAdornment: T, clearIcon: E, leftAdornmentTone: D = "default", rightAdornmentTone: O = "default", clearIconTone: k = "danger", autoFocus: A, maxLength: j, onMouseEnter: M, onMouseLeave: N, "aria-describedby": P, "aria-invalid": F, ...I }, R) => {
|
|
1181
|
+
let z = s(), B = e ?? z, V = l(null), [ee, te] = u(c ?? ""), H = o !== void 0, ne = H ? o : ee, U = ne !== "", re = at(f, b), W = S && U && !_ && !x, ie = [
|
|
1110
1182
|
P,
|
|
1111
|
-
|
|
1183
|
+
r ? `${B}-description` : void 0,
|
|
1112
1184
|
g ? `${B}-error` : void 0
|
|
1113
|
-
].filter(Boolean).join(" "),
|
|
1114
|
-
if (
|
|
1185
|
+
].filter(Boolean).join(" "), G = E ?? "×", ae = i((e) => {
|
|
1186
|
+
if (V.current = e, typeof R == "function") {
|
|
1115
1187
|
R(e);
|
|
1116
1188
|
return;
|
|
1117
1189
|
}
|
|
1118
1190
|
R && (R.current = e);
|
|
1119
|
-
}, [R]),
|
|
1191
|
+
}, [R]), oe = i((e) => {
|
|
1120
1192
|
let t = e.target.value;
|
|
1121
1193
|
H || te(t), d?.(e);
|
|
1122
|
-
}, [H, d]),
|
|
1123
|
-
H || te(""), C?.(),
|
|
1124
|
-
}, [H, C]),
|
|
1125
|
-
return /* @__PURE__ */
|
|
1194
|
+
}, [H, d]), se = i(() => {
|
|
1195
|
+
H || te(""), C?.(), V.current?.focus();
|
|
1196
|
+
}, [H, C]), ce = !W && !!T;
|
|
1197
|
+
return /* @__PURE__ */ m(Me, {
|
|
1126
1198
|
id: B,
|
|
1127
1199
|
label: t,
|
|
1128
|
-
description:
|
|
1200
|
+
description: r,
|
|
1129
1201
|
error: g,
|
|
1130
1202
|
required: v,
|
|
1131
1203
|
disabled: _,
|
|
1132
|
-
children: /* @__PURE__ */
|
|
1133
|
-
className:
|
|
1204
|
+
children: /* @__PURE__ */ h("div", {
|
|
1205
|
+
className: L(Q.inputWrapper, {
|
|
1134
1206
|
[Q.hasLeftAdornment]: !!w,
|
|
1135
1207
|
[Q.hasRightAdornment]: !!T || W
|
|
1136
1208
|
}),
|
|
1137
1209
|
children: [
|
|
1138
|
-
w && /* @__PURE__ */
|
|
1210
|
+
w && /* @__PURE__ */ m("span", {
|
|
1139
1211
|
"aria-hidden": "true",
|
|
1140
|
-
className:
|
|
1212
|
+
className: L(Q.leftAdornment, it[D]),
|
|
1141
1213
|
children: w
|
|
1142
1214
|
}),
|
|
1143
|
-
/* @__PURE__ */
|
|
1144
|
-
...
|
|
1145
|
-
ref:
|
|
1215
|
+
/* @__PURE__ */ m("input", {
|
|
1216
|
+
...I,
|
|
1217
|
+
ref: ae,
|
|
1146
1218
|
id: B,
|
|
1147
|
-
name:
|
|
1148
|
-
type:
|
|
1219
|
+
name: n,
|
|
1220
|
+
type: f,
|
|
1149
1221
|
autoComplete: re,
|
|
1150
|
-
className:
|
|
1222
|
+
className: L(Q.input, Q[p], { [Q.error]: !!g }, y),
|
|
1151
1223
|
value: ne,
|
|
1152
|
-
onChange:
|
|
1153
|
-
placeholder:
|
|
1224
|
+
onChange: oe,
|
|
1225
|
+
placeholder: a,
|
|
1154
1226
|
disabled: _,
|
|
1155
1227
|
readOnly: x,
|
|
1156
1228
|
required: v,
|
|
1157
1229
|
autoFocus: A,
|
|
1158
1230
|
maxLength: j,
|
|
1159
|
-
"aria-invalid": g ? !0 :
|
|
1231
|
+
"aria-invalid": g ? !0 : F,
|
|
1160
1232
|
"aria-describedby": ie || void 0,
|
|
1161
1233
|
onMouseEnter: M,
|
|
1162
1234
|
onMouseLeave: N
|
|
1163
1235
|
}),
|
|
1164
|
-
W && /* @__PURE__ */
|
|
1236
|
+
W && /* @__PURE__ */ m("button", {
|
|
1165
1237
|
type: "button",
|
|
1166
|
-
className:
|
|
1167
|
-
onClick:
|
|
1238
|
+
className: L(Q.clearButton, it[k]),
|
|
1239
|
+
onClick: se,
|
|
1168
1240
|
"aria-label": "Clear input",
|
|
1169
|
-
children:
|
|
1241
|
+
children: G
|
|
1170
1242
|
}),
|
|
1171
|
-
|
|
1172
|
-
className:
|
|
1243
|
+
ce && /* @__PURE__ */ m("div", {
|
|
1244
|
+
className: L(Q.rightAdornment, it[O]),
|
|
1173
1245
|
children: T
|
|
1174
1246
|
})
|
|
1175
1247
|
]
|
|
1176
1248
|
})
|
|
1177
1249
|
});
|
|
1178
1250
|
});
|
|
1179
|
-
|
|
1251
|
+
ot.displayName = "Input";
|
|
1180
1252
|
var $ = {
|
|
1181
1253
|
root: "_root_ie5a6_1",
|
|
1182
1254
|
invalid: "_invalid_ie5a6_14",
|
|
@@ -1192,32 +1264,32 @@ var $ = {
|
|
|
1192
1264
|
indicator: "_indicator_ie5a6_109",
|
|
1193
1265
|
content: "_content_ie5a6_202",
|
|
1194
1266
|
error: "_error_ie5a6_219"
|
|
1195
|
-
},
|
|
1196
|
-
let b =
|
|
1267
|
+
}, st = n(({ value: e, checked: t, defaultChecked: n = !1, disabled: r = !1, required: i = !1, size: a, error: o, onCheckedChange: c, label: l, description: u, wrapperClassName: d, className: f, id: p, name: g, "aria-describedby": _, ...v }, y) => {
|
|
1268
|
+
let b = Ae(), x = s(), S = p ?? x, C = u ? `${S}-description` : void 0, w = o ? `${S}-error` : void 0, T = [
|
|
1197
1269
|
C,
|
|
1198
1270
|
w,
|
|
1199
1271
|
b?.describedBy,
|
|
1200
1272
|
_
|
|
1201
|
-
].filter(Boolean).join(" ") || void 0,
|
|
1273
|
+
].filter(Boolean).join(" ") || void 0, E = b !== null, [O, k] = D({
|
|
1202
1274
|
value: t,
|
|
1203
1275
|
defaultValue: n,
|
|
1204
1276
|
onChange: c
|
|
1205
|
-
}), A =
|
|
1277
|
+
}), A = E ? b.value === e : O, j = !!b?.disabled || r, M = !!b?.required || i, N = b?.name ?? g, P = !!(o || b?.invalid), F = a ?? b?.size ?? "md", I = (t) => {
|
|
1206
1278
|
if (!j) {
|
|
1207
|
-
if (
|
|
1279
|
+
if (E) {
|
|
1208
1280
|
b.onValueChange(e);
|
|
1209
1281
|
return;
|
|
1210
1282
|
}
|
|
1211
1283
|
k(t.currentTarget.checked);
|
|
1212
1284
|
}
|
|
1213
1285
|
};
|
|
1214
|
-
return /* @__PURE__ */
|
|
1215
|
-
className:
|
|
1216
|
-
children: [/* @__PURE__ */
|
|
1286
|
+
return /* @__PURE__ */ h("div", {
|
|
1287
|
+
className: L($.root, $[F], P && $.invalid, j && $.disabled, f),
|
|
1288
|
+
children: [/* @__PURE__ */ h("label", {
|
|
1217
1289
|
htmlFor: S,
|
|
1218
|
-
className:
|
|
1290
|
+
className: L($.wrapper, d),
|
|
1219
1291
|
children: [
|
|
1220
|
-
/* @__PURE__ */
|
|
1292
|
+
/* @__PURE__ */ m("input", {
|
|
1221
1293
|
...v,
|
|
1222
1294
|
ref: y,
|
|
1223
1295
|
id: S,
|
|
@@ -1228,73 +1300,73 @@ var $ = {
|
|
|
1228
1300
|
disabled: j,
|
|
1229
1301
|
required: M,
|
|
1230
1302
|
"aria-invalid": P || void 0,
|
|
1231
|
-
"aria-describedby":
|
|
1303
|
+
"aria-describedby": T,
|
|
1232
1304
|
className: $.input,
|
|
1233
|
-
onChange:
|
|
1305
|
+
onChange: I
|
|
1234
1306
|
}),
|
|
1235
|
-
/* @__PURE__ */
|
|
1307
|
+
/* @__PURE__ */ m("span", {
|
|
1236
1308
|
className: $.control,
|
|
1237
1309
|
"aria-hidden": "true",
|
|
1238
|
-
children: /* @__PURE__ */
|
|
1310
|
+
children: /* @__PURE__ */ m("span", { className: $.indicator })
|
|
1239
1311
|
}),
|
|
1240
|
-
(l || u) && /* @__PURE__ */
|
|
1312
|
+
(l || u) && /* @__PURE__ */ h("span", {
|
|
1241
1313
|
className: $.content,
|
|
1242
|
-
children: [l && /* @__PURE__ */
|
|
1314
|
+
children: [l && /* @__PURE__ */ m("span", {
|
|
1243
1315
|
className: $.label,
|
|
1244
1316
|
children: l
|
|
1245
|
-
}), u && /* @__PURE__ */
|
|
1317
|
+
}), u && /* @__PURE__ */ m("span", {
|
|
1246
1318
|
id: C,
|
|
1247
1319
|
className: $.description,
|
|
1248
1320
|
children: u
|
|
1249
1321
|
})]
|
|
1250
1322
|
})
|
|
1251
1323
|
]
|
|
1252
|
-
}),
|
|
1324
|
+
}), o && /* @__PURE__ */ m("div", {
|
|
1253
1325
|
id: w,
|
|
1254
1326
|
className: $.error,
|
|
1255
|
-
children:
|
|
1327
|
+
children: o
|
|
1256
1328
|
})]
|
|
1257
1329
|
});
|
|
1258
1330
|
});
|
|
1259
|
-
|
|
1331
|
+
st.displayName = "Radio";
|
|
1260
1332
|
//#endregion
|
|
1261
1333
|
//#region src/theme/ThemeContext.ts
|
|
1262
|
-
var
|
|
1263
|
-
let [
|
|
1334
|
+
var ct = t(null), lt = (e) => e === "highContrast" ? "high-contrast" : e, ut = ({ theme: e, defaultTheme: t = "light", onThemeChange: n, children: r }) => {
|
|
1335
|
+
let [i, a] = D({
|
|
1264
1336
|
value: e,
|
|
1265
1337
|
defaultValue: t,
|
|
1266
1338
|
onChange: n
|
|
1267
|
-
}),
|
|
1268
|
-
|
|
1339
|
+
}), s = lt(i);
|
|
1340
|
+
o(() => {
|
|
1269
1341
|
if (typeof document > "u") return;
|
|
1270
1342
|
let { documentElement: e } = document, t = e.dataset.velliraTheme;
|
|
1271
|
-
return e.dataset.velliraTheme =
|
|
1343
|
+
return e.dataset.velliraTheme = s, () => {
|
|
1272
1344
|
if (t === void 0) {
|
|
1273
1345
|
delete e.dataset.velliraTheme;
|
|
1274
1346
|
return;
|
|
1275
1347
|
}
|
|
1276
1348
|
e.dataset.velliraTheme = t;
|
|
1277
1349
|
};
|
|
1278
|
-
}, [
|
|
1279
|
-
let l =
|
|
1280
|
-
theme:
|
|
1281
|
-
setTheme:
|
|
1282
|
-
}), [
|
|
1283
|
-
return /* @__PURE__ */
|
|
1350
|
+
}, [s]);
|
|
1351
|
+
let l = c(() => ({
|
|
1352
|
+
theme: i,
|
|
1353
|
+
setTheme: a
|
|
1354
|
+
}), [i, a]);
|
|
1355
|
+
return /* @__PURE__ */ m(ct.Provider, {
|
|
1284
1356
|
value: l,
|
|
1285
|
-
children: /* @__PURE__ */
|
|
1286
|
-
"data-vellira-theme":
|
|
1357
|
+
children: /* @__PURE__ */ m("div", {
|
|
1358
|
+
"data-vellira-theme": s,
|
|
1287
1359
|
children: r
|
|
1288
1360
|
})
|
|
1289
1361
|
});
|
|
1290
1362
|
};
|
|
1291
|
-
|
|
1363
|
+
ut.displayName = "ThemeProvider";
|
|
1292
1364
|
//#endregion
|
|
1293
1365
|
//#region src/theme/useTheme.ts
|
|
1294
|
-
function
|
|
1295
|
-
let e =
|
|
1366
|
+
function dt() {
|
|
1367
|
+
let e = a(ct);
|
|
1296
1368
|
if (!e) throw Error("useTheme must be used within ThemeProvider.");
|
|
1297
1369
|
return e;
|
|
1298
1370
|
}
|
|
1299
1371
|
//#endregion
|
|
1300
|
-
export {
|
|
1372
|
+
export { $e as Button, rt as Checkbox, ue as Dropdown, Me as FormField, ot as Input, De as Modal, st as Radio, je as RadioGroup, Re as Select, Je as Tabs, ut as ThemeProvider, Ze as Tooltip, dt as useTheme };
|