@tpc-mare/mare-ui-components-react 0.1.26 → 0.1.29
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/avatar/index.js +1 -1
- package/dist/badge/index.js +1 -1
- package/dist/banner/index.js +1 -1
- package/dist/button/index.js +1 -1
- package/dist/checkbox/index.js +1 -1
- package/dist/combobox/index.js +1 -1
- package/dist/confirm-dialog/index.js +1 -1
- package/dist/counter/index.js +1 -1
- package/dist/date-picker/index.js +1 -1
- package/dist/dialog/index.js +2 -2
- package/dist/divider/index.js +1 -1
- package/dist/drawer/index.js +1 -1
- package/dist/expandable-counter/index.js +1 -1
- package/dist/filter-chip/index.js +1 -1
- package/dist/filter-chip-dropdown-multiple/index.js +1 -1
- package/dist/filter-chip-dropdown-single/index.js +1 -1
- package/dist/floating-action-button/index.js +1 -1
- package/dist/image-item/index.js +1 -1
- package/dist/index/index.js +41 -41
- package/dist/input-number/index.js +1 -1
- package/dist/input-otp/index.js +1 -1
- package/dist/input-text/IconField.d.ts +3 -1
- package/dist/input-text/index.js +2 -2
- package/dist/keyboard-commands/index.d.ts +5 -0
- package/dist/keyboard-commands/index.js +825 -0
- package/dist/keyboard-commands/useKeyboardCommands.d.ts +27 -0
- package/dist/keyboard-commands/useKeyboardNavGrid.d.ts +19 -0
- package/dist/keyboard-commands/useKeyboardNavList.d.ts +17 -0
- package/dist/keyboard-commands/useKeyboardScope.d.ts +20 -0
- package/dist/message/index.js +1 -1
- package/dist/multi-select/index.js +1 -1
- package/dist/overlay-badge/index.js +1 -1
- package/dist/paginator/index.js +1 -1
- package/dist/password/index.js +1 -1
- package/dist/radio-group/index.js +1 -1
- package/dist/search-field/index.js +1 -1
- package/dist/segmented-control/index.js +1 -1
- package/dist/select-field/index.js +1 -1
- package/dist/shared/{Avatar-D3QlO3Tz.js → Avatar-BpJDY1wm.js} +24 -22
- package/dist/shared/{Badge-WC6my4Aw.js → Badge-CGotZzok.js} +16 -9
- package/dist/shared/Banner-D4na_bM8.js +60 -0
- package/dist/shared/{Button-DwJ5RTfQ.js → Button-C2ULmKj3.js} +64 -57
- package/dist/shared/{Checkbox-BXnSN2vK.js → Checkbox-DCq3_MWz.js} +35 -33
- package/dist/shared/{Combobox-CcmWgRYZ.js → Combobox-DrkeDMW0.js} +48 -47
- package/dist/shared/{ConfirmDialog-DLHY-c70.js → ConfirmDialog-CjrWhDx8.js} +33 -27
- package/dist/shared/{Counter-DjIoe4h3.js → Counter-0siKQRKc.js} +42 -41
- package/dist/shared/{DatePicker-CwAISvNc.js → DatePicker-DhIWE0V_.js} +246 -240
- package/dist/shared/{DialogFooter-DyltZzK-.js → DialogFooter-CDlh11Gy.js} +34 -32
- package/dist/shared/{DialogHeader-M5Bfyxos.js → DialogHeader-PMBgMjsb.js} +2 -2
- package/dist/shared/{Divider-UgKI7dtK.js → Divider-CSQOHeMo.js} +16 -14
- package/dist/shared/{DrawerFooter-B9-Vrgd3.js → DrawerFooter-Bb-X7keE.js} +62 -54
- package/dist/shared/{ExpandableCounter-DZxbdqRa.js → ExpandableCounter-pPJIrd6L.js} +2 -2
- package/dist/shared/{FilterChip-eECL3oO7.js → FilterChip-TpKF-4vP.js} +21 -20
- package/dist/shared/{FilterChipDropdownMultiple-D2eMYXyS.js → FilterChipDropdownMultiple-2mr_Z57i.js} +43 -42
- package/dist/shared/{FilterChipDropdownSingle-C7ahD-_3.js → FilterChipDropdownSingle-CLmWzX9q.js} +39 -38
- package/dist/shared/FloatingActionButton-BWB5Taeg.js +28 -0
- package/dist/shared/{HelperText-CVWWvLCI.js → HelperText-zmUym82m.js} +1 -1
- package/dist/shared/IconField-CqKydKep.js +81 -0
- package/dist/shared/ImageItem-CL2VGEha.js +19 -0
- package/dist/shared/InputNumber-nxus9h5s.js +64 -0
- package/dist/shared/{InputOtp-CUXXVP2E.js → InputOtp-BxBc6Vhs.js} +16 -15
- package/dist/shared/InputText.types-KhlkzHMw-BtRY371_.js +4 -0
- package/dist/shared/Message-CQUdM9rR.js +81 -0
- package/dist/shared/{MultiSelect-Dowp0_FX.js → MultiSelect-DlaYWcPo.js} +60 -59
- package/dist/shared/{OverlayBadge-DLskqll7.js → OverlayBadge-Dkosm3Il.js} +1 -1
- package/dist/shared/{Paginator-DxZdCXSC.js → Paginator-QTDpAJ-N.js} +2 -2
- package/dist/shared/Password-D4PRaleH.js +97 -0
- package/dist/shared/{RadioGroup-lw27DCoV.js → RadioGroup-B8CXU8-l.js} +44 -38
- package/dist/shared/{SearchField-DjJHDaR4.js → SearchField-DIsFhJ22.js} +1 -1
- package/dist/shared/{SegmentedControl-Ct5ZLXpN.js → SegmentedControl-BfE3jNM6.js} +35 -33
- package/dist/shared/{SelectField-B-g52vHx.js → SelectField-CcnbnPEi.js} +30 -29
- package/dist/shared/Skeleton-DpWtYSz4.js +30 -0
- package/dist/shared/{Slider-CXFkperZ.js → Slider-Cl9PyH2q.js} +28 -22
- package/dist/shared/Snackbar-3BxmqK8x.js +105 -0
- package/dist/shared/{Stepper-By8M5bs0.js → Stepper-DrKKSn_j.js} +42 -37
- package/dist/shared/{Switch-DNCn0xjb.js → Switch-B5DSQLFL.js} +31 -29
- package/dist/shared/{Tabs-BqIorZYD.js → Tabs-DuufYBV2.js} +19 -17
- package/dist/shared/{Tag-BtbmgIwL.js → Tag-uIK_GPrs.js} +24 -15
- package/dist/shared/{TagChip-Bs7srjIL.js → TagChip-CP3aX2_G.js} +28 -26
- package/dist/shared/Textarea-DHJIWBRM.js +42 -0
- package/dist/shared/{field-layout-D34MpDMB.js → field-layout-o6bDLvVU.js} +6 -6
- package/dist/shared/index-ByQ37VXf.js +6 -0
- package/dist/skeleton/index.js +1 -1
- package/dist/slider/index.js +1 -1
- package/dist/snackbar/index.js +1 -1
- package/dist/stepper/index.js +1 -1
- package/dist/styles.css +1 -1
- package/dist/switch/index.js +1 -1
- package/dist/tabs/index.js +1 -1
- package/dist/tag/index.js +1 -1
- package/dist/tag-chip/index.js +1 -1
- package/dist/textarea/index.js +1 -1
- package/dist/utilities-standalone.css +1 -1
- package/package.json +1 -1
- package/dist/shared/Banner-C4wLe6N0.js +0 -52
- package/dist/shared/FloatingActionButton-D4FK6uSs.js +0 -19
- package/dist/shared/IconField-Dh6j6SL1.js +0 -78
- package/dist/shared/ImageItem-BBy5fOl3.js +0 -17
- package/dist/shared/InputNumber-D48wsE-o.js +0 -62
- package/dist/shared/Message-BNsFuQU1.js +0 -70
- package/dist/shared/Password-BMKy8dAy.js +0 -95
- package/dist/shared/Skeleton-CAjoF-T2.js +0 -29
- package/dist/shared/Snackbar-CjTqCOaV.js +0 -100
- package/dist/shared/Textarea-iJhYTZos.js +0 -40
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
import { jsxs as s, jsx as t } from "react/jsx-runtime";
|
|
2
|
+
import { o as p } from "./index-ByQ37VXf.js";
|
|
3
|
+
import { B as g } from "./Button-C2ULmKj3.js";
|
|
4
|
+
import { I as c } from "./IconX-CpPADKjZ.js";
|
|
5
|
+
const f = [
|
|
6
|
+
"neutral",
|
|
7
|
+
"brand",
|
|
8
|
+
"positive",
|
|
9
|
+
"warning",
|
|
10
|
+
"danger"
|
|
11
|
+
], x = (e) => e === "filled" ? `mare:w-full mare:max-w-md mare:rounded-tpc-container-s mare:p-4
|
|
12
|
+
mare:flex mare:items-start mare:justify-between mare:gap-4
|
|
13
|
+
mare:data-severity-neutral:bg-alternative
|
|
14
|
+
mare:data-severity-brand:bg-accent-weak
|
|
15
|
+
mare:data-severity-positive:bg-positive-weak
|
|
16
|
+
mare:data-severity-warning:bg-warning-weak
|
|
17
|
+
mare:data-severity-danger:bg-danger-weak` : "mare:w-full mare:flex mare:items-start mare:justify-between mare:gap-4", y = "mare:flex mare:grow mare:items-start mare:gap-4", u = "mare:shrink-0 mare:text-default mare:[&>svg]:size-3.5", v = "mare:flex mare:grow mare:flex-col mare:gap-2", w = "mare:tpc-typography-label-m mare:text-default", b = {
|
|
18
|
+
neutral: "mare:text-weak",
|
|
19
|
+
brand: "mare:text-accent",
|
|
20
|
+
positive: "mare:text-positive",
|
|
21
|
+
warning: "mare:text-warning",
|
|
22
|
+
danger: "mare:text-danger"
|
|
23
|
+
}, h = (e, a, m) => {
|
|
24
|
+
const r = e === "simple" ? "mare:tpc-typography-body-xs" : "mare:tpc-typography-body-s";
|
|
25
|
+
return m ? `${r} mare:text-disabled` : e === "simple" ? `${r} ${b[a]}` : `${r} mare:text-default`;
|
|
26
|
+
}, k = (e, a) => a ? "disabled" : e;
|
|
27
|
+
function B({
|
|
28
|
+
severity: e = "neutral",
|
|
29
|
+
variant: a = "simple",
|
|
30
|
+
title: m,
|
|
31
|
+
icon: r,
|
|
32
|
+
disabled: i = !1,
|
|
33
|
+
closable: o = !1,
|
|
34
|
+
onClose: d,
|
|
35
|
+
children: n
|
|
36
|
+
}) {
|
|
37
|
+
const l = p(e, f, "neutral");
|
|
38
|
+
return /* @__PURE__ */ s(
|
|
39
|
+
"div",
|
|
40
|
+
{
|
|
41
|
+
className: x(a),
|
|
42
|
+
"data-severity": k(
|
|
43
|
+
l,
|
|
44
|
+
i
|
|
45
|
+
),
|
|
46
|
+
children: [
|
|
47
|
+
/* @__PURE__ */ s("div", { className: y, children: [
|
|
48
|
+
r && /* @__PURE__ */ t("span", { className: u, children: r }),
|
|
49
|
+
/* @__PURE__ */ s("div", { className: v, children: [
|
|
50
|
+
m && /* @__PURE__ */ t("p", { className: w, children: m }),
|
|
51
|
+
n && /* @__PURE__ */ t(
|
|
52
|
+
"div",
|
|
53
|
+
{
|
|
54
|
+
className: h(
|
|
55
|
+
a,
|
|
56
|
+
l,
|
|
57
|
+
i
|
|
58
|
+
),
|
|
59
|
+
children: n
|
|
60
|
+
}
|
|
61
|
+
)
|
|
62
|
+
] })
|
|
63
|
+
] }),
|
|
64
|
+
o && /* @__PURE__ */ t(
|
|
65
|
+
g,
|
|
66
|
+
{
|
|
67
|
+
severity: "ghost",
|
|
68
|
+
iconOnly: !0,
|
|
69
|
+
size: "xsmall",
|
|
70
|
+
icon: /* @__PURE__ */ t(c, {}),
|
|
71
|
+
onClick: d,
|
|
72
|
+
"aria-label": "Close"
|
|
73
|
+
}
|
|
74
|
+
)
|
|
75
|
+
]
|
|
76
|
+
}
|
|
77
|
+
);
|
|
78
|
+
}
|
|
79
|
+
export {
|
|
80
|
+
B as M
|
|
81
|
+
};
|
|
@@ -1,41 +1,42 @@
|
|
|
1
1
|
import { jsxs as n, jsx as r } from "react/jsx-runtime";
|
|
2
|
-
import { useState as
|
|
3
|
-
import { createListCollection as
|
|
4
|
-
import { T as
|
|
5
|
-
import { P as
|
|
6
|
-
import {
|
|
7
|
-
import { I as
|
|
8
|
-
import { I as
|
|
2
|
+
import { useState as Q, useMemo as x } from "react";
|
|
3
|
+
import { createListCollection as X, SelectRoot as B, SelectLabel as F, SelectControl as G, SelectTrigger as H, SelectClearTrigger as J, SelectIndicator as O, SelectPositioner as U, SelectContent as V, SelectItem as W, SelectItemText as Y } from "@ark-ui/react/select";
|
|
4
|
+
import { T as Z } from "./TagChip-CP3aX2_G.js";
|
|
5
|
+
import { P as ee } from "./ProgressSpinner-B-lrS-tu.js";
|
|
6
|
+
import { o as ae } from "./index-ByQ37VXf.js";
|
|
7
|
+
import { I as re } from "./IconX-CpPADKjZ.js";
|
|
8
|
+
import { I as te } from "./IconChevronDown-ev2ML7Ex.js";
|
|
9
|
+
import { I as me } from "./IconSearch-CgM6jEUh.js";
|
|
9
10
|
import { I as p } from "./IconCheck-DzZA6b2U.js";
|
|
10
|
-
import { I as
|
|
11
|
-
const
|
|
11
|
+
import { I as le } from "./IconMinus-fS_GL0Et.js";
|
|
12
|
+
const ne = ["small", "medium"], se = {
|
|
12
13
|
small: "mare:min-h-10",
|
|
13
14
|
medium: "mare:min-h-14"
|
|
14
|
-
},
|
|
15
|
+
}, oe = "mare:relative mare:flex mare:items-center mare:w-full", ie = (a, t) => `
|
|
15
16
|
mare:w-full mare:flex mare:items-center mare:gap-2 mare:min-w-0 mare:cursor-pointer mare:text-left
|
|
16
|
-
${
|
|
17
|
+
${se[a]}
|
|
17
18
|
mare:pl-3 mare:py-2 ${t ? "mare:pr-14" : "mare:pr-8"}
|
|
18
19
|
mare:rounded-input mare:border mare:border-strong mare:bg-default
|
|
19
20
|
mare:text-default mare:tpc-typography-body-s
|
|
20
21
|
mare:ark-open:outline-solid mare:ark-open:outline-2 mare:ark-open:outline-accent mare:ark-open:-outline-offset-2
|
|
21
22
|
mare:ark-disabled:text-disabled mare:ark-disabled:border-disabled-default mare:ark-disabled:cursor-not-allowed
|
|
22
23
|
mare:data-[invalid]:outline-solid mare:data-[invalid]:outline-2 mare:data-[invalid]:outline-danger mare:data-[invalid]:-outline-offset-2
|
|
23
|
-
`,
|
|
24
|
+
`, ce = "mare:absolute mare:right-3 mare:top-1/2 mare:-translate-y-1/2 mare:flex mare:items-center mare:gap-1 mare:pointer-events-none", de = "mare:flex mare:flex-1 mare:flex-wrap mare:items-center mare:gap-1 mare:overflow-hidden mare:min-w-0", pe = "mare:flex-1 mare:truncate mare:text-left mare:data-[empty]:text-weak", ue = "mare:flex mare:items-center mare:shrink-0 mare:text-lg mare:transition-transform mare:ark-open:rotate-180 mare:text-default", fe = "mare:pointer-events-auto mare:flex mare:items-center mare:shrink-0 mare:text-base mare:cursor-pointer mare:text-default mare:hover:text-weak", he = "mare:tpc-typography-label-s mare:text-default mare:mb-1.5 mare:block", xe = `
|
|
24
25
|
mare:flex mare:flex-col mare:gap-1 mare:p-2
|
|
25
26
|
mare:rounded-input mare:border mare:border-default mare:bg-raised
|
|
26
27
|
mare:shadow-[0_2px_6px_0_rgba(0,0,0,0.16)]
|
|
27
28
|
mare:max-h-72 mare:overflow-y-auto
|
|
28
29
|
mare:min-w-[var(--reference-width)]
|
|
29
30
|
mare:z-50
|
|
30
|
-
`,
|
|
31
|
+
`, ge = `
|
|
31
32
|
mare:flex mare:items-center mare:gap-2 mare:mb-1 mare:px-3 mare:h-10 mare:shrink-0
|
|
32
33
|
mare:rounded-input mare:border mare:border-strong mare:bg-default
|
|
33
34
|
mare:focus-within:outline-solid mare:focus-within:outline-2 mare:focus-within:outline-accent mare:focus-within:-outline-offset-2
|
|
34
|
-
`,
|
|
35
|
+
`, be = "mare:flex-auto mare:bg-transparent mare:outline-none mare:text-default mare:tpc-typography-body-s mare:placeholder:text-weak", we = "mare:flex mare:items-center mare:text-weak", ye = "mare:flex mare:items-center mare:gap-2 mare:w-full mare:py-2 mare:px-2 mare:mb-1 mare:shrink-0 mare:rounded-menu-item mare:cursor-pointer mare:hover:bg-hover mare:tpc-typography-body-s mare:text-default", ke = "mare:flex-auto mare:text-left", N = (a, t = !1) => `
|
|
35
36
|
mare:relative mare:flex mare:items-center mare:justify-center mare:shrink-0
|
|
36
37
|
mare:w-4.5 mare:h-4.5 mare:border-[1.5px] mare:rounded-checkbox mare:transition-colors mare:duration-150
|
|
37
38
|
${a || t ? "mare:bg-accent mare:border-accent" : "mare:border-strong mare:bg-transparent"}
|
|
38
|
-
`, g = "mare:w-3 mare:h-3 mare:text-on-accent", S = "mare:flex mare:items-center mare:text-accent",
|
|
39
|
+
`, g = "mare:w-3 mare:h-3 mare:text-on-accent", S = "mare:flex mare:items-center mare:text-accent", ve = (a) => `
|
|
39
40
|
mare:group/option mare:flex mare:items-center mare:gap-2 mare:w-full
|
|
40
41
|
${a === "small" ? "mare:min-h-8 mare:py-1.5" : "mare:min-h-10 mare:py-2"}
|
|
41
42
|
mare:px-3 mare:cursor-pointer mare:rounded-menu-item
|
|
@@ -43,33 +44,33 @@ const me = {
|
|
|
43
44
|
mare:ark-highlighted:bg-hover
|
|
44
45
|
mare:ark-selected:bg-accent-weak mare:ark-selected:text-accent
|
|
45
46
|
mare:ark-disabled:text-disabled mare:ark-disabled:cursor-not-allowed
|
|
46
|
-
`,
|
|
47
|
+
`, Ne = "mare:flex-auto mare:truncate mare:text-left", Se = "mare:py-2 mare:px-3 mare:tpc-typography-body-s mare:text-weak", I = (a) => a.filter((t) => !t.disabled).map((t) => t.value), C = (a, t) => {
|
|
47
48
|
const m = I(a);
|
|
48
49
|
if (m.length === 0) return "none";
|
|
49
50
|
const l = m.filter((o) => t.includes(o)).length;
|
|
50
51
|
return l === 0 ? "none" : l === m.length ? "all" : "some";
|
|
51
|
-
},
|
|
52
|
+
}, Ie = (a, t) => {
|
|
52
53
|
const m = I(a), l = t.filter((o) => !m.includes(o));
|
|
53
54
|
return C(a, t) === "all" ? l : [...l, ...m];
|
|
54
|
-
},
|
|
55
|
+
}, Ce = (a, t) => {
|
|
55
56
|
const m = t.trim().toLowerCase();
|
|
56
57
|
return m ? a.filter((l) => l.label.toLowerCase().includes(m)) : a;
|
|
57
|
-
},
|
|
58
|
-
function
|
|
58
|
+
}, ze = (a, t) => a.length === 0 ? "" : a.length <= t ? a.join(", ") : `${a.length} items selected`;
|
|
59
|
+
function qe({
|
|
59
60
|
value: a = [],
|
|
60
61
|
onValueChange: t,
|
|
61
62
|
options: m,
|
|
62
63
|
placeholder: l = "Select…",
|
|
63
64
|
searchPlaceholder: o = "",
|
|
64
|
-
size:
|
|
65
|
-
itemSize:
|
|
65
|
+
size: z = "medium",
|
|
66
|
+
itemSize: T = "medium",
|
|
66
67
|
disabled: b = !1,
|
|
67
|
-
invalid:
|
|
68
|
-
loading:
|
|
68
|
+
invalid: $ = !1,
|
|
69
|
+
loading: P = !1,
|
|
69
70
|
clearable: w = !1,
|
|
70
71
|
filterable: u = !1,
|
|
71
72
|
hasCheckbox: f = !0,
|
|
72
|
-
showToggleAll:
|
|
73
|
+
showToggleAll: _ = !1,
|
|
73
74
|
headerLabel: y,
|
|
74
75
|
display: j = "text",
|
|
75
76
|
maxSelectedLabels: D = 3,
|
|
@@ -77,14 +78,14 @@ function Me({
|
|
|
77
78
|
emptyText: L = "Sin resultados",
|
|
78
79
|
indicator: M,
|
|
79
80
|
clearIcon: E,
|
|
80
|
-
filterIcon:
|
|
81
|
+
filterIcon: R,
|
|
81
82
|
renderOption: v
|
|
82
83
|
}) {
|
|
83
|
-
const [h,
|
|
84
|
-
() => u ?
|
|
84
|
+
const A = ae(z, ne, "medium"), [h, q] = Q(""), s = x(
|
|
85
|
+
() => u ? Ce(m, h) : m,
|
|
85
86
|
[u, m, h]
|
|
86
|
-
),
|
|
87
|
-
() =>
|
|
87
|
+
), K = x(
|
|
88
|
+
() => X({
|
|
88
89
|
items: s,
|
|
89
90
|
itemToValue: (e) => e.value,
|
|
90
91
|
itemToString: (e) => e.label,
|
|
@@ -96,27 +97,27 @@ function Me({
|
|
|
96
97
|
[m, a]
|
|
97
98
|
), c = C(s, a);
|
|
98
99
|
return /* @__PURE__ */ n(
|
|
99
|
-
|
|
100
|
+
B,
|
|
100
101
|
{
|
|
101
|
-
collection:
|
|
102
|
+
collection: K,
|
|
102
103
|
multiple: !0,
|
|
103
104
|
closeOnSelect: !1,
|
|
104
105
|
value: a,
|
|
105
106
|
disabled: b,
|
|
106
|
-
invalid:
|
|
107
|
+
invalid: $,
|
|
107
108
|
onValueChange: (e) => t?.(e.value),
|
|
108
109
|
children: [
|
|
109
|
-
k && /* @__PURE__ */ r(
|
|
110
|
-
/* @__PURE__ */ n(
|
|
111
|
-
/* @__PURE__ */ r(
|
|
110
|
+
k && /* @__PURE__ */ r(F, { className: he, children: k }),
|
|
111
|
+
/* @__PURE__ */ n(G, { className: oe, children: [
|
|
112
|
+
/* @__PURE__ */ r(H, { asChild: !0, children: /* @__PURE__ */ r("div", { className: ie(A, w), children: j === "chip" ? i.length === 0 ? /* @__PURE__ */ r("span", { className: "mare:text-weak", children: l }) : /* @__PURE__ */ r(
|
|
112
113
|
"span",
|
|
113
114
|
{
|
|
114
|
-
className:
|
|
115
|
+
className: de,
|
|
115
116
|
onClick: (e) => {
|
|
116
117
|
e.stopPropagation();
|
|
117
118
|
},
|
|
118
119
|
children: i.map((e) => /* @__PURE__ */ r(
|
|
119
|
-
|
|
120
|
+
Z,
|
|
120
121
|
{
|
|
121
122
|
size: "small",
|
|
122
123
|
disabled: b,
|
|
@@ -134,9 +135,9 @@ function Me({
|
|
|
134
135
|
) : /* @__PURE__ */ r(
|
|
135
136
|
"span",
|
|
136
137
|
{
|
|
137
|
-
className:
|
|
138
|
+
className: pe,
|
|
138
139
|
"data-empty": i.length === 0 ? "" : void 0,
|
|
139
|
-
children: i.length === 0 ? l :
|
|
140
|
+
children: i.length === 0 ? l : ze(
|
|
140
141
|
i.map(
|
|
141
142
|
(e) => e.label
|
|
142
143
|
),
|
|
@@ -144,35 +145,35 @@ function Me({
|
|
|
144
145
|
)
|
|
145
146
|
}
|
|
146
147
|
) }) }),
|
|
147
|
-
/* @__PURE__ */ n("div", { className:
|
|
148
|
-
w && /* @__PURE__ */ r(
|
|
149
|
-
/* @__PURE__ */ r(
|
|
148
|
+
/* @__PURE__ */ n("div", { className: ce, children: [
|
|
149
|
+
w && /* @__PURE__ */ r(J, { className: fe, children: E ?? /* @__PURE__ */ r(re, { size: "1em" }) }),
|
|
150
|
+
/* @__PURE__ */ r(O, { className: ue, children: P ? /* @__PURE__ */ r(ee, { className: "mare:w-4 mare:h-4" }) : M ?? /* @__PURE__ */ r(te, { size: "1em" }) })
|
|
150
151
|
] })
|
|
151
152
|
] }),
|
|
152
|
-
/* @__PURE__ */ r(
|
|
153
|
-
u && /* @__PURE__ */ n("div", { className:
|
|
153
|
+
/* @__PURE__ */ r(U, { children: /* @__PURE__ */ n(V, { className: xe, children: [
|
|
154
|
+
u && /* @__PURE__ */ n("div", { className: ge, children: [
|
|
154
155
|
/* @__PURE__ */ r(
|
|
155
156
|
"input",
|
|
156
157
|
{
|
|
157
158
|
value: h,
|
|
158
159
|
onChange: (e) => {
|
|
159
|
-
|
|
160
|
+
q(e.target.value);
|
|
160
161
|
},
|
|
161
162
|
onKeyDown: (e) => {
|
|
162
163
|
e.key === "Enter" && e.preventDefault(), e.key !== "Escape" && e.stopPropagation();
|
|
163
164
|
},
|
|
164
165
|
placeholder: o,
|
|
165
|
-
className:
|
|
166
|
+
className: be
|
|
166
167
|
}
|
|
167
168
|
),
|
|
168
|
-
/* @__PURE__ */ r("span", { className:
|
|
169
|
+
/* @__PURE__ */ r("span", { className: we, children: R ?? /* @__PURE__ */ r(me, { size: "1em" }) })
|
|
169
170
|
] }),
|
|
170
|
-
|
|
171
|
+
_ && /* @__PURE__ */ n(
|
|
171
172
|
"div",
|
|
172
173
|
{
|
|
173
|
-
className:
|
|
174
|
+
className: ye,
|
|
174
175
|
onClick: () => t?.(
|
|
175
|
-
|
|
176
|
+
Ie(s, a)
|
|
176
177
|
),
|
|
177
178
|
children: [
|
|
178
179
|
f ? /* @__PURE__ */ n(
|
|
@@ -190,7 +191,7 @@ function Me({
|
|
|
190
191
|
}
|
|
191
192
|
),
|
|
192
193
|
c === "some" && /* @__PURE__ */ r(
|
|
193
|
-
|
|
194
|
+
le,
|
|
194
195
|
{
|
|
195
196
|
className: g
|
|
196
197
|
}
|
|
@@ -198,17 +199,17 @@ function Me({
|
|
|
198
199
|
]
|
|
199
200
|
}
|
|
200
201
|
) : c === "all" && /* @__PURE__ */ r("span", { className: S, children: /* @__PURE__ */ r(p, { size: "1em" }) }),
|
|
201
|
-
y && /* @__PURE__ */ r("span", { className:
|
|
202
|
+
y && /* @__PURE__ */ r("span", { className: ke, children: y })
|
|
202
203
|
]
|
|
203
204
|
}
|
|
204
205
|
),
|
|
205
|
-
s.length === 0 ? /* @__PURE__ */ r("div", { className:
|
|
206
|
+
s.length === 0 ? /* @__PURE__ */ r("div", { className: Se, children: L }) : s.map((e) => {
|
|
206
207
|
const d = a.includes(e.value);
|
|
207
208
|
return /* @__PURE__ */ n(
|
|
208
|
-
|
|
209
|
+
W,
|
|
209
210
|
{
|
|
210
211
|
item: e,
|
|
211
|
-
className:
|
|
212
|
+
className: ve(T),
|
|
212
213
|
children: [
|
|
213
214
|
f && /* @__PURE__ */ r(
|
|
214
215
|
"span",
|
|
@@ -225,9 +226,9 @@ function Me({
|
|
|
225
226
|
}
|
|
226
227
|
),
|
|
227
228
|
/* @__PURE__ */ r(
|
|
228
|
-
|
|
229
|
+
Y,
|
|
229
230
|
{
|
|
230
|
-
className:
|
|
231
|
+
className: Ne,
|
|
231
232
|
children: v ? v(e) : e.label
|
|
232
233
|
}
|
|
233
234
|
),
|
|
@@ -243,5 +244,5 @@ function Me({
|
|
|
243
244
|
);
|
|
244
245
|
}
|
|
245
246
|
export {
|
|
246
|
-
|
|
247
|
+
qe as M
|
|
247
248
|
};
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs as R, jsx as p } from "react/jsx-runtime";
|
|
2
2
|
import { useRef as x, useState as w, useLayoutEffect as M } from "react";
|
|
3
|
-
import { B as v } from "./Badge-
|
|
3
|
+
import { B as v } from "./Badge-CGotZzok.js";
|
|
4
4
|
const B = "mare:relative mare:inline-flex mare:w-fit", N = `
|
|
5
5
|
mare:absolute mare:top-0 mare:end-0 mare:origin-[100%_0] mare:rounded-full mare:inline-flex
|
|
6
6
|
mare:m-0 mare:outline mare:outline-tpc-bg-default
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsxs as u, jsx as e } from "react/jsx-runtime";
|
|
2
2
|
import { useRef as P, useState as R, useEffect as k } from "react";
|
|
3
3
|
import { Pagination as c } from "@ark-ui/react/pagination";
|
|
4
|
-
import { B as h } from "./Button-
|
|
5
|
-
import { S as N } from "./SelectField-
|
|
4
|
+
import { B as h } from "./Button-C2ULmKj3.js";
|
|
5
|
+
import { S as N } from "./SelectField-CcnbnPEi.js";
|
|
6
6
|
import { c as b } from "./createReactComponent-Cb6Pzf10.js";
|
|
7
7
|
import { I as M, a as j } from "./IconChevronRight-DEIDRsvg.js";
|
|
8
8
|
const I = [["path", { d: "M11 7l-5 5l5 5", key: "svg-0" }], ["path", { d: "M17 7l-5 5l5 5", key: "svg-1" }]], W = b("outline", "chevrons-left", "ChevronsLeft", I);
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { jsxs as r, jsx as e, Fragment as M } from "react/jsx-runtime";
|
|
2
|
+
import { PasswordInput as l } from "@ark-ui/react/password-input";
|
|
3
|
+
import { useFieldContext as R } from "@ark-ui/react/field";
|
|
4
|
+
import { m as A } from "./InputText.types-KhlkzHMw-BtRY371_.js";
|
|
5
|
+
import { u as Z, m as j, d as O, f as D } from "./field-layout-o6bDLvVU.js";
|
|
6
|
+
import { o as T } from "./index-ByQ37VXf.js";
|
|
7
|
+
import { c as h } from "./createReactComponent-Cb6Pzf10.js";
|
|
8
|
+
const V = [["path", { d: "M10.585 10.587a2 2 0 0 0 2.829 2.828", key: "svg-0" }], ["path", { d: "M16.681 16.673a8.717 8.717 0 0 1 -4.681 1.327c-3.6 0 -6.6 -2 -9 -6c1.272 -2.12 2.712 -3.678 4.32 -4.674m2.86 -1.146a9.055 9.055 0 0 1 1.82 -.18c3.6 0 6.6 2 9 6c-.666 1.11 -1.379 2.067 -2.138 2.87", key: "svg-1" }], ["path", { d: "M3 3l18 18", key: "svg-2" }]], W = h("outline", "eye-off", "EyeOff", V);
|
|
9
|
+
const q = [["path", { d: "M10 12a2 2 0 1 0 4 0a2 2 0 0 0 -4 0", key: "svg-0" }], ["path", { d: "M21 12c-2.4 4 -5.4 6 -9 6c-3.6 0 -6.6 -2 -9 -6c2.4 -4 5.4 -6 9 -6c3.6 0 6.6 2 9 6", key: "svg-1" }]], B = h("outline", "eye", "Eye", q), G = "mare:relative mare:w-full mare:group", H = "mare:relative mare:w-full", J = `
|
|
10
|
+
mare:hidden mare:group-focus-within:flex mare:flex-col mare:gap-2
|
|
11
|
+
mare:absolute mare:top-full mare:left-0 mare:mt-2 mare:z-50 mare:w-full
|
|
12
|
+
mare:p-4 mare:rounded-input mare:border mare:border-default mare:bg-raised
|
|
13
|
+
mare:shadow-[0_2px_6px_0_rgba(0,0,0,0.16)]
|
|
14
|
+
`, K = "mare:tpc-typography-label-s mare:text-default", Q = "mare:border-t mare:border-default", U = "mare:flex mare:flex-col mare:gap-2", X = "mare:h-1 mare:w-full mare:bg-neutral-weak mare:rounded-md mare:overflow-hidden", Y = {
|
|
15
|
+
weak: "mare:w-1/3 mare:bg-danger",
|
|
16
|
+
medium: "mare:w-2/3 mare:bg-warning",
|
|
17
|
+
strong: "mare:w-full mare:bg-positive"
|
|
18
|
+
}, ee = (a) => `mare:h-full mare:rounded-md mare:transition-[width] mare:duration-500 mare:ease-in-out ${a ? Y[a] : "mare:w-0"}`, ae = "mare:tpc-typography-body-s mare:text-default", re = "mare:flex mare:flex-col mare:gap-1 mare:my-0 mare:pl-0 mare:list-none", le = "mare:tpc-typography-body-s mare:text-default", te = "^(((?=.*[a-z])(?=.*[A-Z]))|((?=.*[a-z])(?=.*[0-9]))|((?=.*[A-Z])(?=.*[0-9])))(?=.{6,})", se = "^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.{8,})", me = (a, s = te, m = se) => a ? new RegExp(m).test(a) ? "strong" : new RegExp(s).test(a) ? "medium" : "weak" : null;
|
|
19
|
+
function pe({
|
|
20
|
+
value: a = "",
|
|
21
|
+
onValueChange: s,
|
|
22
|
+
size: m = "medium",
|
|
23
|
+
rounded: g = !1,
|
|
24
|
+
invalid: b = !1,
|
|
25
|
+
disabled: v = !1,
|
|
26
|
+
toggleMask: o = !0,
|
|
27
|
+
showIcon: w = /* @__PURE__ */ e(B, {}),
|
|
28
|
+
hideIcon: y = /* @__PURE__ */ e(W, {}),
|
|
29
|
+
feedback: n = !0,
|
|
30
|
+
header: d,
|
|
31
|
+
footer: c,
|
|
32
|
+
promptLabel: x = "Please enter a password",
|
|
33
|
+
weakLabel: N = "Weak",
|
|
34
|
+
mediumLabel: _ = "Medium",
|
|
35
|
+
strongLabel: k = "Strong",
|
|
36
|
+
mediumRegex: I,
|
|
37
|
+
strongRegex: E,
|
|
38
|
+
...f
|
|
39
|
+
}) {
|
|
40
|
+
const t = Z(), u = R(), F = T(m, A, "medium"), S = b || (u?.invalid ?? !1), p = v || (u?.disabled ?? !1), z = o ? j(t?.iconSide ?? null, "right") : t?.iconSide ?? null, P = O({
|
|
41
|
+
size: F,
|
|
42
|
+
rounded: g,
|
|
43
|
+
hasFloatLabel: t?.hasFloatLabel ?? !1,
|
|
44
|
+
iconSide: z
|
|
45
|
+
}), $ = t?.hasFloatLabel ? " " : f.placeholder, i = n ? me(a, I, E) : null, C = i ? { weak: N, medium: _, strong: k }[i] : x;
|
|
46
|
+
return /* @__PURE__ */ r(
|
|
47
|
+
l.Root,
|
|
48
|
+
{
|
|
49
|
+
className: G,
|
|
50
|
+
invalid: S,
|
|
51
|
+
disabled: p,
|
|
52
|
+
visible: o ? void 0 : !1,
|
|
53
|
+
children: [
|
|
54
|
+
/* @__PURE__ */ r(l.Control, { className: H, children: [
|
|
55
|
+
/* @__PURE__ */ e(
|
|
56
|
+
l.Input,
|
|
57
|
+
{
|
|
58
|
+
...f,
|
|
59
|
+
placeholder: $,
|
|
60
|
+
value: a,
|
|
61
|
+
onChange: (L) => s?.(L.target.value),
|
|
62
|
+
className: P
|
|
63
|
+
}
|
|
64
|
+
),
|
|
65
|
+
o && /* @__PURE__ */ e(
|
|
66
|
+
l.VisibilityTrigger,
|
|
67
|
+
{
|
|
68
|
+
className: D("right", {
|
|
69
|
+
disabled: p,
|
|
70
|
+
interactive: !0
|
|
71
|
+
}),
|
|
72
|
+
children: /* @__PURE__ */ e(l.Indicator, { fallback: w, children: y })
|
|
73
|
+
}
|
|
74
|
+
)
|
|
75
|
+
] }),
|
|
76
|
+
n && /* @__PURE__ */ r("div", { className: J, children: [
|
|
77
|
+
d && /* @__PURE__ */ e("div", { className: K, children: d }),
|
|
78
|
+
/* @__PURE__ */ r("div", { className: U, children: [
|
|
79
|
+
/* @__PURE__ */ e("div", { className: X, children: /* @__PURE__ */ e("div", { className: ee(i) }) }),
|
|
80
|
+
/* @__PURE__ */ e("span", { className: ae, children: C })
|
|
81
|
+
] }),
|
|
82
|
+
c && /* @__PURE__ */ r(M, { children: [
|
|
83
|
+
/* @__PURE__ */ e("div", { className: Q }),
|
|
84
|
+
/* @__PURE__ */ e("ul", { className: re, children: c })
|
|
85
|
+
] })
|
|
86
|
+
] })
|
|
87
|
+
]
|
|
88
|
+
}
|
|
89
|
+
);
|
|
90
|
+
}
|
|
91
|
+
function he({ children: a }) {
|
|
92
|
+
return /* @__PURE__ */ e("li", { className: le, children: a });
|
|
93
|
+
}
|
|
94
|
+
export {
|
|
95
|
+
pe as P,
|
|
96
|
+
he as a
|
|
97
|
+
};
|
|
@@ -1,18 +1,19 @@
|
|
|
1
|
-
import { jsx as e, jsxs as
|
|
1
|
+
import { jsx as e, jsxs as f } from "react/jsx-runtime";
|
|
2
2
|
import { RadioGroup as r } from "@ark-ui/react/radio-group";
|
|
3
|
-
|
|
3
|
+
import { o as m } from "./index-ByQ37VXf.js";
|
|
4
|
+
const v = ["small", "medium", "large"], x = ["horizontal", "vertical"], y = `
|
|
4
5
|
mare:flex mare:gap-4
|
|
5
6
|
mare:ark-vertical:flex-col
|
|
6
7
|
mare:ark-horizontal:flex-row
|
|
7
8
|
mare:ark-disabled:cursor-default
|
|
8
|
-
`,
|
|
9
|
+
`, w = `
|
|
9
10
|
mare:relative mare:inline-flex mare:items-center mare:gap-2
|
|
10
11
|
mare:select-none mare:cursor-pointer
|
|
11
12
|
mare:ark-disabled:cursor-default
|
|
12
13
|
mare:data-size-small:gap-1.5
|
|
13
14
|
mare:data-size-medium:gap-2
|
|
14
15
|
mare:data-size-large:gap-2.5
|
|
15
|
-
`,
|
|
16
|
+
`, N = `
|
|
16
17
|
mare:relative mare:inline-flex mare:items-center mare:justify-center mare:shrink-0
|
|
17
18
|
mare:rounded-full mare:border mare:border-strong mare:bg-transparent
|
|
18
19
|
mare:shadow-[0_1px_2px_0_rgba(18,18,23,0.05)]
|
|
@@ -34,7 +35,7 @@ const g = `
|
|
|
34
35
|
mare:ark-disabled:border-disabled!
|
|
35
36
|
|
|
36
37
|
mare:ark-invalid:border-danger!
|
|
37
|
-
`,
|
|
38
|
+
`, I = `
|
|
38
39
|
mare:invisible mare:rounded-full mare:bg-[var(--color-fg-on-accent)]
|
|
39
40
|
|
|
40
41
|
mare:data-size-small:w-2 mare:data-size-small:h-2
|
|
@@ -44,64 +45,69 @@ const g = `
|
|
|
44
45
|
mare:ark-checked:visible
|
|
45
46
|
mare:ark-disabled:ark-checked:bg-disabled!
|
|
46
47
|
mare:ark-invalid:ark-checked:bg-[var(--color-fg-on-danger)]!
|
|
47
|
-
`,
|
|
48
|
+
`, R = `
|
|
48
49
|
mare:text-default
|
|
49
50
|
mare:data-size-small:tpc-typography-body-s
|
|
50
51
|
mare:data-size-medium:tpc-typography-body-m
|
|
51
52
|
mare:data-size-large:tpc-typography-body-l
|
|
52
53
|
mare:ark-disabled:text-disabled
|
|
53
|
-
`,
|
|
54
|
+
`, _ = `
|
|
54
55
|
mare:sr-only
|
|
55
56
|
`;
|
|
56
|
-
function
|
|
57
|
-
items:
|
|
58
|
-
value:
|
|
57
|
+
function H({
|
|
58
|
+
items: l,
|
|
59
|
+
value: i,
|
|
59
60
|
defaultValue: s,
|
|
60
|
-
onValueChange:
|
|
61
|
-
size:
|
|
62
|
-
orientation:
|
|
63
|
-
disabled:
|
|
64
|
-
invalid:
|
|
65
|
-
readOnly:
|
|
66
|
-
required:
|
|
67
|
-
name:
|
|
68
|
-
form:
|
|
69
|
-
id:
|
|
61
|
+
onValueChange: t,
|
|
62
|
+
size: o = "small",
|
|
63
|
+
orientation: c = "vertical",
|
|
64
|
+
disabled: n = !1,
|
|
65
|
+
invalid: b = !1,
|
|
66
|
+
readOnly: u = !1,
|
|
67
|
+
required: h = !1,
|
|
68
|
+
name: p,
|
|
69
|
+
form: k,
|
|
70
|
+
id: z
|
|
70
71
|
}) {
|
|
72
|
+
const d = m(o, v, "small"), g = m(
|
|
73
|
+
c,
|
|
74
|
+
x,
|
|
75
|
+
"vertical"
|
|
76
|
+
);
|
|
71
77
|
return /* @__PURE__ */ e(
|
|
72
78
|
r.Root,
|
|
73
79
|
{
|
|
74
|
-
value:
|
|
80
|
+
value: i,
|
|
75
81
|
defaultValue: s,
|
|
76
82
|
onValueChange: (a) => {
|
|
77
|
-
a.value &&
|
|
83
|
+
a.value && t?.(a.value);
|
|
78
84
|
},
|
|
79
|
-
orientation:
|
|
80
|
-
disabled:
|
|
81
|
-
invalid:
|
|
82
|
-
readOnly:
|
|
83
|
-
required:
|
|
84
|
-
name:
|
|
85
|
-
form:
|
|
86
|
-
id:
|
|
87
|
-
className:
|
|
88
|
-
children:
|
|
85
|
+
orientation: g,
|
|
86
|
+
disabled: n,
|
|
87
|
+
invalid: b,
|
|
88
|
+
readOnly: u,
|
|
89
|
+
required: h,
|
|
90
|
+
name: p,
|
|
91
|
+
form: k,
|
|
92
|
+
id: z,
|
|
93
|
+
className: y,
|
|
94
|
+
children: l.map((a) => /* @__PURE__ */ f(
|
|
89
95
|
r.Item,
|
|
90
96
|
{
|
|
91
97
|
value: a.value,
|
|
92
98
|
disabled: a.disabled,
|
|
93
|
-
className:
|
|
99
|
+
className: w,
|
|
94
100
|
"data-size": d,
|
|
95
101
|
children: [
|
|
96
102
|
/* @__PURE__ */ e(
|
|
97
103
|
r.ItemControl,
|
|
98
104
|
{
|
|
99
|
-
className:
|
|
105
|
+
className: N,
|
|
100
106
|
"data-size": d,
|
|
101
107
|
children: /* @__PURE__ */ e(
|
|
102
108
|
"span",
|
|
103
109
|
{
|
|
104
|
-
className:
|
|
110
|
+
className: I,
|
|
105
111
|
"data-size": d
|
|
106
112
|
}
|
|
107
113
|
)
|
|
@@ -110,7 +116,7 @@ function I({
|
|
|
110
116
|
/* @__PURE__ */ e(
|
|
111
117
|
r.ItemText,
|
|
112
118
|
{
|
|
113
|
-
className:
|
|
119
|
+
className: R,
|
|
114
120
|
"data-size": d,
|
|
115
121
|
children: a.label
|
|
116
122
|
}
|
|
@@ -118,7 +124,7 @@ function I({
|
|
|
118
124
|
/* @__PURE__ */ e(
|
|
119
125
|
r.ItemHiddenInput,
|
|
120
126
|
{
|
|
121
|
-
className:
|
|
127
|
+
className: _
|
|
122
128
|
}
|
|
123
129
|
)
|
|
124
130
|
]
|
|
@@ -129,5 +135,5 @@ function I({
|
|
|
129
135
|
);
|
|
130
136
|
}
|
|
131
137
|
export {
|
|
132
|
-
|
|
138
|
+
H as R
|
|
133
139
|
};
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { jsx as i } from "react/jsx-runtime";
|
|
2
|
-
import { a as C, I as t } from "./IconField-
|
|
2
|
+
import { a as C, I as t } from "./IconField-CqKydKep.js";
|
|
3
3
|
import { P as x } from "./ProgressSpinner-B-lrS-tu.js";
|
|
4
4
|
import { I as v } from "./IconSearch-CgM6jEUh.js";
|
|
5
5
|
import { I as F } from "./IconX-CpPADKjZ.js";
|