@blakesteve/roster 5.2.0 → 5.2.1
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/components/atoms/Combobox/Combobox.cjs +1 -1
- package/dist/components/atoms/Combobox/Combobox.js +63 -62
- package/dist/components/atoms/Input/Input.cjs +1 -1
- package/dist/components/atoms/Input/Input.js +49 -52
- package/dist/components/atoms/MultiSelect/MultiSelect.cjs +1 -1
- package/dist/components/atoms/MultiSelect/MultiSelect.js +69 -68
- package/dist/components/atoms/Select/Select.cjs +1 -1
- package/dist/components/atoms/Select/Select.js +52 -51
- package/dist/components/atoms/Textarea/Textarea.cjs +1 -1
- package/dist/components/atoms/Textarea/Textarea.js +36 -34
- package/dist/components/molecules/CheckboxGroup/CheckboxGroup.cjs +1 -1
- package/dist/components/molecules/CheckboxGroup/CheckboxGroup.d.ts +5 -3
- package/dist/components/molecules/CheckboxGroup/CheckboxGroup.js +61 -59
- package/dist/components/molecules/RadioGroup/RadioGroup.cjs +1 -1
- package/dist/components/molecules/RadioGroup/RadioGroup.d.ts +4 -3
- package/dist/components/molecules/RadioGroup/RadioGroup.js +48 -47
- package/dist/internal/field-invalid.cjs +1 -0
- package/dist/internal/field-invalid.d.ts +37 -0
- package/dist/internal/field-invalid.js +13 -0
- package/dist/meta.json +3 -3
- package/package.json +1 -1
|
@@ -1,30 +1,31 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as c, jsx as r } from "react/jsx-runtime";
|
|
3
|
-
import
|
|
4
|
-
import { Description as
|
|
5
|
-
import { Field as
|
|
6
|
-
import { Label as
|
|
7
|
-
import { Listbox as
|
|
8
|
-
import { Transition as
|
|
9
|
-
import { FontAwesomeIcon as
|
|
10
|
-
import { faChevronDown as
|
|
3
|
+
import H, { Fragment as V } from "react";
|
|
4
|
+
import { Description as W } from "../../../node_modules/@headlessui/react/dist/components/description/description.js";
|
|
5
|
+
import { Field as Y } from "../../../node_modules/@headlessui/react/dist/components/field/field.js";
|
|
6
|
+
import { Label as C } from "../../../node_modules/@headlessui/react/dist/components/label/label.js";
|
|
7
|
+
import { Listbox as K, ListboxButton as X, ListboxOptions as Z, ListboxOption as q } from "../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js";
|
|
8
|
+
import { Transition as G } from "../../../node_modules/@headlessui/react/dist/components/transition/transition.js";
|
|
9
|
+
import { FontAwesomeIcon as _ } from "../../../node_modules/@fortawesome/react-fontawesome/dist/index.js";
|
|
10
|
+
import { faChevronDown as J, faXmark as Q } from "../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";
|
|
11
11
|
import { cn as s } from "../../../lib/utils.js";
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
import {
|
|
16
|
-
|
|
12
|
+
import { isFieldInvalid as z, withoutInvalidProps as tt } from "../../../internal/field-invalid.js";
|
|
13
|
+
import { selectTriggerVariants as rt } from "../Select/select-variants.js";
|
|
14
|
+
import { Chip as T } from "../Chip/Chip.js";
|
|
15
|
+
import { PopupOption as et } from "../../../internal/PopupOption.js";
|
|
16
|
+
import { useDarkScope as st, POPUP_ANCHOR as nt, POPUP_WIDTH_OF_BUTTON as ot, POPUP_PANEL as it, popupInDarkPalette as at } from "../../../internal/popup.js";
|
|
17
|
+
const It = ({
|
|
17
18
|
options: u,
|
|
18
19
|
value: n,
|
|
19
20
|
onChange: p,
|
|
20
21
|
placeholder: f = "Select options",
|
|
21
|
-
disabled:
|
|
22
|
+
disabled: a = !1,
|
|
22
23
|
variant: v,
|
|
23
24
|
size: o,
|
|
24
|
-
error:
|
|
25
|
-
className:
|
|
26
|
-
triggerClassName:
|
|
27
|
-
optionsClassName:
|
|
25
|
+
error: F,
|
|
26
|
+
className: L,
|
|
27
|
+
triggerClassName: R,
|
|
28
|
+
optionsClassName: D,
|
|
28
29
|
helperText: x,
|
|
29
30
|
errorMessage: h,
|
|
30
31
|
label: b,
|
|
@@ -33,52 +34,52 @@ const bt = ({
|
|
|
33
34
|
clearable: N = !1,
|
|
34
35
|
chipColorScheme: k = "neutral",
|
|
35
36
|
chipVariant: w = "outline",
|
|
36
|
-
clearLabel:
|
|
37
|
-
removeLabel:
|
|
38
|
-
...
|
|
37
|
+
clearLabel: j = "Clear selection",
|
|
38
|
+
removeLabel: E = (l) => `Remove ${l}`,
|
|
39
|
+
...I
|
|
39
40
|
}) => {
|
|
40
|
-
const l = !!h ||
|
|
41
|
+
const l = !!h || F, U = z(l, I), $ = tt(I), i = n.length > 0, P = new Map(u.map((t, e) => [t.value, e])), d = n.map((t) => ({
|
|
41
42
|
value: t,
|
|
42
43
|
label: u.find((e) => e.value === t)?.label ?? String(t)
|
|
43
44
|
})).sort(
|
|
44
|
-
(t, e) => (
|
|
45
|
-
),
|
|
45
|
+
(t, e) => (P.get(t.value) ?? Number.POSITIVE_INFINITY) - (P.get(e.value) ?? Number.POSITIVE_INFINITY)
|
|
46
|
+
), y = g === void 0 ? d : d.slice(0, g), O = d.length - y.length, { ref: A, inDarkScope: B } = st(), S = H.useRef(null);
|
|
46
47
|
return /* @__PURE__ */ c(
|
|
47
|
-
|
|
48
|
+
Y,
|
|
48
49
|
{
|
|
49
|
-
disabled:
|
|
50
|
-
className: s("rst:flex rst:flex-col rst:gap-1.5",
|
|
51
|
-
|
|
50
|
+
disabled: a,
|
|
51
|
+
className: s("rst:flex rst:flex-col rst:gap-1.5", L),
|
|
52
|
+
...$,
|
|
52
53
|
children: [
|
|
53
|
-
b && /* @__PURE__ */ r(
|
|
54
|
-
/* @__PURE__ */ r(
|
|
54
|
+
b && /* @__PURE__ */ r(C, { className: "rst:block rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)] rst:text-left", children: b }),
|
|
55
|
+
/* @__PURE__ */ r(K, { value: n, onChange: p, disabled: a, multiple: !0, children: /* @__PURE__ */ c("div", { ref: A, className: "rst:relative", children: [
|
|
55
56
|
/* @__PURE__ */ c(
|
|
56
57
|
"div",
|
|
57
58
|
{
|
|
58
59
|
className: s(
|
|
59
|
-
|
|
60
|
+
rt({ variant: v, size: o, error: l }),
|
|
60
61
|
"rst:h-auto rst:flex-wrap rst:items-center rst:gap-1.5 rst:py-1.5",
|
|
61
62
|
o === "sm" ? "rst:min-h-9" : o === "lg" ? "rst:min-h-11" : "rst:min-h-10",
|
|
62
|
-
N &&
|
|
63
|
+
N && i && "rst:pr-16",
|
|
63
64
|
/* The ring is on the shell and fires from `focus-within`, because
|
|
64
65
|
the element that actually takes focus is the invisible button
|
|
65
66
|
stretched across it — and, deliberately, from a dismiss
|
|
66
67
|
control too: those are inside the field and should light it. */
|
|
67
68
|
"rst:focus-within:ring-2 rst:focus-within:ring-ring",
|
|
68
|
-
|
|
69
|
-
|
|
69
|
+
a && "rst:opacity-50 rst:cursor-not-allowed",
|
|
70
|
+
R
|
|
70
71
|
),
|
|
71
72
|
children: [
|
|
72
73
|
/* @__PURE__ */ r(
|
|
73
|
-
|
|
74
|
+
X,
|
|
74
75
|
{
|
|
75
|
-
ref:
|
|
76
|
-
"aria-invalid":
|
|
76
|
+
ref: S,
|
|
77
|
+
"aria-invalid": U || void 0,
|
|
77
78
|
className: "rst:absolute rst:inset-0 rst:h-full rst:w-full rst:cursor-pointer rst:rounded-md rst:focus:outline-hidden rst:disabled:cursor-not-allowed",
|
|
78
|
-
children: /* @__PURE__ */ r("span", { className: "rst:sr-only", children:
|
|
79
|
+
children: /* @__PURE__ */ r("span", { className: "rst:sr-only", children: i ? m === "count" ? `${n.length} selected` : d.map((t) => t.label).join(", ") : f })
|
|
79
80
|
}
|
|
80
81
|
),
|
|
81
|
-
!
|
|
82
|
+
!i && /* @__PURE__ */ r(
|
|
82
83
|
"span",
|
|
83
84
|
{
|
|
84
85
|
"aria-hidden": "true",
|
|
@@ -86,7 +87,7 @@ const bt = ({
|
|
|
86
87
|
children: f
|
|
87
88
|
}
|
|
88
89
|
),
|
|
89
|
-
|
|
90
|
+
i && m === "count" && /* @__PURE__ */ c(
|
|
90
91
|
"span",
|
|
91
92
|
{
|
|
92
93
|
"aria-hidden": "true",
|
|
@@ -97,15 +98,15 @@ const bt = ({
|
|
|
97
98
|
]
|
|
98
99
|
}
|
|
99
100
|
),
|
|
100
|
-
|
|
101
|
-
|
|
101
|
+
i && m === "chips" && y.map((t, e) => /* @__PURE__ */ r(
|
|
102
|
+
T,
|
|
102
103
|
{
|
|
103
104
|
size: "sm",
|
|
104
105
|
variant: w,
|
|
105
106
|
colorScheme: k,
|
|
106
|
-
disabled:
|
|
107
|
-
onRemove: () => p(n.filter((
|
|
108
|
-
removeLabel:
|
|
107
|
+
disabled: a,
|
|
108
|
+
onRemove: () => p(n.filter((M) => M !== t.value)),
|
|
109
|
+
removeLabel: E(t.label),
|
|
109
110
|
className: s(
|
|
110
111
|
"rst:relative rst:max-w-[12rem] rst:pointer-events-none",
|
|
111
112
|
"rst:[&_button]:pointer-events-auto",
|
|
@@ -115,8 +116,8 @@ const bt = ({
|
|
|
115
116
|
},
|
|
116
117
|
`${e}-${String(t.value)}`
|
|
117
118
|
)),
|
|
118
|
-
|
|
119
|
-
|
|
119
|
+
O > 0 && m === "chips" && /* @__PURE__ */ c(
|
|
120
|
+
T,
|
|
120
121
|
{
|
|
121
122
|
size: "sm",
|
|
122
123
|
variant: w,
|
|
@@ -125,7 +126,7 @@ const bt = ({
|
|
|
125
126
|
className: "rst:pointer-events-none rst:relative rst:text-inherit rst:border-current/70 rst:dark:text-inherit rst:dark:border-current/70",
|
|
126
127
|
children: [
|
|
127
128
|
"+",
|
|
128
|
-
|
|
129
|
+
O
|
|
129
130
|
]
|
|
130
131
|
}
|
|
131
132
|
),
|
|
@@ -137,24 +138,24 @@ const bt = ({
|
|
|
137
138
|
o === "sm" ? "rst:pr-2.5" : "rst:pr-3"
|
|
138
139
|
),
|
|
139
140
|
children: /* @__PURE__ */ r(
|
|
140
|
-
|
|
141
|
+
_,
|
|
141
142
|
{
|
|
142
|
-
icon:
|
|
143
|
+
icon: J,
|
|
143
144
|
className: "rst:h-3.5 rst:w-3.5 rst:text-gray-400 rst:dark:text-gray-500",
|
|
144
145
|
"aria-hidden": "true"
|
|
145
146
|
}
|
|
146
147
|
)
|
|
147
148
|
}
|
|
148
149
|
),
|
|
149
|
-
N &&
|
|
150
|
+
N && i && /* @__PURE__ */ r(
|
|
150
151
|
"button",
|
|
151
152
|
{
|
|
152
153
|
type: "button",
|
|
153
|
-
disabled:
|
|
154
|
+
disabled: a,
|
|
154
155
|
onClick: () => {
|
|
155
|
-
p([]),
|
|
156
|
+
p([]), S.current?.focus();
|
|
156
157
|
},
|
|
157
|
-
"aria-label":
|
|
158
|
+
"aria-label": j,
|
|
158
159
|
className: s(
|
|
159
160
|
/* `w-6` is not decoration: WCAG 2.5.8 asks 24x24 CSS px and
|
|
160
161
|
a bare 14px icon measured 20px wide. The spacing exception
|
|
@@ -167,9 +168,9 @@ const bt = ({
|
|
|
167
168
|
o === "sm" ? "rst:right-7" : "rst:right-8"
|
|
168
169
|
),
|
|
169
170
|
children: /* @__PURE__ */ r(
|
|
170
|
-
|
|
171
|
+
_,
|
|
171
172
|
{
|
|
172
|
-
icon:
|
|
173
|
+
icon: Q,
|
|
173
174
|
className: "rst:h-3.5 rst:w-3.5",
|
|
174
175
|
"aria-hidden": "true"
|
|
175
176
|
}
|
|
@@ -180,26 +181,26 @@ const bt = ({
|
|
|
180
181
|
}
|
|
181
182
|
),
|
|
182
183
|
/* @__PURE__ */ r(
|
|
183
|
-
|
|
184
|
+
G,
|
|
184
185
|
{
|
|
185
|
-
as:
|
|
186
|
+
as: V,
|
|
186
187
|
leave: "rst:transition rst:ease-in rst:duration-100",
|
|
187
188
|
leaveFrom: "rst:opacity-100",
|
|
188
189
|
leaveTo: "rst:opacity-0",
|
|
189
190
|
children: /* @__PURE__ */ r(
|
|
190
|
-
|
|
191
|
+
Z,
|
|
191
192
|
{
|
|
192
|
-
anchor:
|
|
193
|
+
anchor: nt,
|
|
193
194
|
className: s(
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
195
|
+
at(B, v) && "dark",
|
|
196
|
+
it,
|
|
197
|
+
ot,
|
|
198
|
+
D
|
|
198
199
|
),
|
|
199
200
|
children: u.map((t) => /* @__PURE__ */ r(
|
|
200
|
-
|
|
201
|
+
et,
|
|
201
202
|
{
|
|
202
|
-
as:
|
|
203
|
+
as: q,
|
|
203
204
|
value: t.value,
|
|
204
205
|
disabled: t.disabled,
|
|
205
206
|
size: o,
|
|
@@ -213,7 +214,7 @@ const bt = ({
|
|
|
213
214
|
)
|
|
214
215
|
] }) }),
|
|
215
216
|
(x || h) && /* @__PURE__ */ r(
|
|
216
|
-
|
|
217
|
+
W,
|
|
217
218
|
{
|
|
218
219
|
className: s(
|
|
219
220
|
"rst:text-xs rst:text-left",
|
|
@@ -227,5 +228,5 @@ const bt = ({
|
|
|
227
228
|
);
|
|
228
229
|
};
|
|
229
230
|
export {
|
|
230
|
-
|
|
231
|
+
It as MultiSelect
|
|
231
232
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),S=require("react"),D=require("../../../node_modules/@headlessui/react/dist/components/description/description.cjs"),F=require("../../../node_modules/@headlessui/react/dist/components/field/field.cjs"),I=require("../../../node_modules/@headlessui/react/dist/components/label/label.cjs"),n=require("../../../node_modules/@headlessui/react/dist/components/listbox/listbox.cjs"),L=require("../../../node_modules/@headlessui/react/dist/components/transition/transition.cjs"),T=require("../../../node_modules/@fortawesome/react-fontawesome/dist/index.cjs"),_=require("../../../node_modules/@fortawesome/free-solid-svg-icons/index.cjs"),r=require("../../../lib/utils.cjs"),f=require("../../../internal/field-invalid.cjs"),w=require("./select-variants.cjs"),R=require("../../../internal/PopupOption.cjs"),s=require("../../../internal/popup.cjs"),U=({options:o,value:d,onChange:h,placeholder:P="Select an option",disabled:u=!1,variant:x,size:i,error:b,className:j,triggerClassName:q,optionsClassName:N,helperText:p,errorMessage:a,label:m,...v})=>{const c=o.find(e=>e.value===d),l=!!a||b,O=f.isFieldInvalid(l,v),g=f.withoutInvalidProps(v),{ref:y,inDarkScope:k}=s.useDarkScope();return t.jsxs(F.Field,{disabled:u,className:r.cn("rst:flex rst:flex-col rst:gap-1.5",j),...g,children:[m&&t.jsx(I.Label,{className:"rst:block rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)] rst:text-left",children:m}),t.jsx(n.Listbox,{value:d??void 0,onChange:h,disabled:u,children:t.jsxs("div",{ref:y,className:"rst:relative",children:[t.jsxs(n.ListboxButton,{"aria-invalid":O||void 0,className:r.cn(w.selectTriggerVariants({variant:x,size:i,error:l}),q),children:[t.jsx("span",{className:r.cn("rst:block rst:truncate",!c&&"rst:text-gray-500 rst:dark:text-gray-400"),children:c?c.label:P}),t.jsx("span",{className:r.cn("rst:pointer-events-none rst:absolute rst:inset-y-0 rst:right-0 rst:flex rst:items-center",i==="sm"?"rst:pr-2.5":"rst:pr-3"),children:t.jsx(T.FontAwesomeIcon,{icon:_.faChevronDown,className:"rst:h-3.5 rst:w-3.5 rst:text-gray-400 rst:dark:text-gray-500","aria-hidden":"true"})})]}),t.jsx(L.Transition,{as:S.Fragment,leave:"rst:transition rst:ease-in rst:duration-100",leaveFrom:"rst:opacity-100",leaveTo:"rst:opacity-0",children:t.jsx(n.ListboxOptions,{anchor:s.POPUP_ANCHOR,className:r.cn(s.popupInDarkPalette(k,x)&&"dark",s.POPUP_PANEL,s.POPUP_WIDTH_OF_BUTTON,N),children:o.map(e=>t.jsx(R.PopupOption,{as:n.ListboxOption,value:e.value,disabled:e.disabled,size:i,children:e.label},e.value))})})]})}),(p||a)&&t.jsx(D.Description,{className:r.cn("rst:text-xs rst:text-left",l?"rst:text-error-600 rst:dark:text-error-400 rst:font-medium":"rst:text-gray-500 rst:dark:text-gray-400"),children:a||p})]})};exports.Select=U;
|
|
@@ -1,35 +1,36 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsxs as n, jsx as t } from "react/jsx-runtime";
|
|
3
|
-
import { Fragment as
|
|
4
|
-
import { Description as
|
|
5
|
-
import { Field as
|
|
3
|
+
import { Fragment as D } from "react";
|
|
4
|
+
import { Description as F } from "../../../node_modules/@headlessui/react/dist/components/description/description.js";
|
|
5
|
+
import { Field as I } from "../../../node_modules/@headlessui/react/dist/components/field/field.js";
|
|
6
6
|
import { Label as L } from "../../../node_modules/@headlessui/react/dist/components/label/label.js";
|
|
7
|
-
import { Listbox as
|
|
8
|
-
import { Transition as
|
|
9
|
-
import { FontAwesomeIcon as
|
|
10
|
-
import { faChevronDown as
|
|
11
|
-
import { cn as
|
|
12
|
-
import {
|
|
13
|
-
import {
|
|
14
|
-
import {
|
|
15
|
-
|
|
7
|
+
import { Listbox as T, ListboxButton as _, ListboxOptions as w, ListboxOption as S } from "../../../node_modules/@headlessui/react/dist/components/listbox/listbox.js";
|
|
8
|
+
import { Transition as U } from "../../../node_modules/@headlessui/react/dist/components/transition/transition.js";
|
|
9
|
+
import { FontAwesomeIcon as A } from "../../../node_modules/@fortawesome/react-fontawesome/dist/index.js";
|
|
10
|
+
import { faChevronDown as B } from "../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";
|
|
11
|
+
import { cn as s } from "../../../lib/utils.js";
|
|
12
|
+
import { isFieldInvalid as j, withoutInvalidProps as C } from "../../../internal/field-invalid.js";
|
|
13
|
+
import { selectTriggerVariants as E } from "./select-variants.js";
|
|
14
|
+
import { PopupOption as H } from "../../../internal/PopupOption.js";
|
|
15
|
+
import { useDarkScope as R, POPUP_ANCHOR as W, POPUP_WIDTH_OF_BUTTON as K, POPUP_PANEL as M, popupInDarkPalette as V } from "../../../internal/popup.js";
|
|
16
|
+
const ot = ({
|
|
16
17
|
options: l,
|
|
17
18
|
value: m,
|
|
18
|
-
onChange:
|
|
19
|
-
placeholder:
|
|
19
|
+
onChange: h,
|
|
20
|
+
placeholder: u = "Select an option",
|
|
20
21
|
disabled: c = !1,
|
|
21
22
|
variant: d,
|
|
22
|
-
size:
|
|
23
|
-
error:
|
|
24
|
-
className:
|
|
23
|
+
size: e,
|
|
24
|
+
error: v,
|
|
25
|
+
className: P,
|
|
25
26
|
triggerClassName: N,
|
|
26
|
-
optionsClassName:
|
|
27
|
+
optionsClassName: b,
|
|
27
28
|
helperText: p,
|
|
28
29
|
errorMessage: a,
|
|
29
30
|
label: f,
|
|
30
|
-
...
|
|
31
|
+
...x
|
|
31
32
|
}) => {
|
|
32
|
-
const o = l.find((r) => r.value === m), i = !!a ||
|
|
33
|
+
const o = l.find((r) => r.value === m), i = !!a || v, k = j(i, x), O = C(x), { ref: g, inDarkScope: y } = R();
|
|
33
34
|
return (
|
|
34
35
|
/* `...props` is spread here, and was not before. The prop type has always
|
|
35
36
|
extended `HTMLAttributes<HTMLDivElement>`, so `id`, `data-*` and the
|
|
@@ -42,52 +43,52 @@ const tt = ({
|
|
|
42
43
|
which is the one path assistive tech actually follows. Before those
|
|
43
44
|
existed there was no way to describe this trigger at all. */
|
|
44
45
|
/* @__PURE__ */ n(
|
|
45
|
-
|
|
46
|
+
I,
|
|
46
47
|
{
|
|
47
48
|
disabled: c,
|
|
48
|
-
className:
|
|
49
|
-
...
|
|
49
|
+
className: s("rst:flex rst:flex-col rst:gap-1.5", P),
|
|
50
|
+
...O,
|
|
50
51
|
children: [
|
|
51
52
|
f && /* @__PURE__ */ t(L, { className: "rst:block rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)] rst:text-left", children: f }),
|
|
52
53
|
/* @__PURE__ */ t(
|
|
53
|
-
|
|
54
|
+
T,
|
|
54
55
|
{
|
|
55
56
|
value: m ?? void 0,
|
|
56
|
-
onChange:
|
|
57
|
+
onChange: h,
|
|
57
58
|
disabled: c,
|
|
58
|
-
children: /* @__PURE__ */ n("div", { ref:
|
|
59
|
+
children: /* @__PURE__ */ n("div", { ref: g, className: "rst:relative", children: [
|
|
59
60
|
/* @__PURE__ */ n(
|
|
60
|
-
|
|
61
|
+
_,
|
|
61
62
|
{
|
|
62
|
-
"aria-invalid":
|
|
63
|
-
className:
|
|
64
|
-
|
|
63
|
+
"aria-invalid": k || void 0,
|
|
64
|
+
className: s(
|
|
65
|
+
E({ variant: d, size: e, error: i }),
|
|
65
66
|
N
|
|
66
67
|
),
|
|
67
68
|
children: [
|
|
68
69
|
/* @__PURE__ */ t(
|
|
69
70
|
"span",
|
|
70
71
|
{
|
|
71
|
-
className:
|
|
72
|
+
className: s(
|
|
72
73
|
"rst:block rst:truncate",
|
|
73
74
|
!o && "rst:text-gray-500 rst:dark:text-gray-400"
|
|
74
75
|
),
|
|
75
|
-
children: o ? o.label :
|
|
76
|
+
children: o ? o.label : u
|
|
76
77
|
}
|
|
77
78
|
),
|
|
78
79
|
/* @__PURE__ */ t(
|
|
79
80
|
"span",
|
|
80
81
|
{
|
|
81
|
-
className:
|
|
82
|
+
className: s(
|
|
82
83
|
"rst:pointer-events-none rst:absolute rst:inset-y-0 rst:right-0 rst:flex rst:items-center",
|
|
83
84
|
/* Clearance tracks the size's own right padding, the way
|
|
84
85
|
Input's icon inset tracks its horizontal padding. */
|
|
85
|
-
|
|
86
|
+
e === "sm" ? "rst:pr-2.5" : "rst:pr-3"
|
|
86
87
|
),
|
|
87
88
|
children: /* @__PURE__ */ t(
|
|
88
|
-
|
|
89
|
+
A,
|
|
89
90
|
{
|
|
90
|
-
icon:
|
|
91
|
+
icon: B,
|
|
91
92
|
className: "rst:h-3.5 rst:w-3.5 rst:text-gray-400 rst:dark:text-gray-500",
|
|
92
93
|
"aria-hidden": "true"
|
|
93
94
|
}
|
|
@@ -98,29 +99,29 @@ const tt = ({
|
|
|
98
99
|
}
|
|
99
100
|
),
|
|
100
101
|
/* @__PURE__ */ t(
|
|
101
|
-
|
|
102
|
+
U,
|
|
102
103
|
{
|
|
103
|
-
as:
|
|
104
|
+
as: D,
|
|
104
105
|
leave: "rst:transition rst:ease-in rst:duration-100",
|
|
105
106
|
leaveFrom: "rst:opacity-100",
|
|
106
107
|
leaveTo: "rst:opacity-0",
|
|
107
108
|
children: /* @__PURE__ */ t(
|
|
108
|
-
|
|
109
|
+
w,
|
|
109
110
|
{
|
|
110
|
-
anchor:
|
|
111
|
-
className:
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
111
|
+
anchor: W,
|
|
112
|
+
className: s(
|
|
113
|
+
V(y, d) && "dark",
|
|
114
|
+
M,
|
|
115
|
+
K,
|
|
116
|
+
b
|
|
116
117
|
),
|
|
117
118
|
children: l.map((r) => /* @__PURE__ */ t(
|
|
118
|
-
|
|
119
|
+
H,
|
|
119
120
|
{
|
|
120
|
-
as:
|
|
121
|
+
as: S,
|
|
121
122
|
value: r.value,
|
|
122
123
|
disabled: r.disabled,
|
|
123
|
-
size:
|
|
124
|
+
size: e,
|
|
124
125
|
children: r.label
|
|
125
126
|
},
|
|
126
127
|
r.value
|
|
@@ -133,9 +134,9 @@ const tt = ({
|
|
|
133
134
|
}
|
|
134
135
|
),
|
|
135
136
|
(p || a) && /* @__PURE__ */ t(
|
|
136
|
-
|
|
137
|
+
F,
|
|
137
138
|
{
|
|
138
|
-
className:
|
|
139
|
+
className: s(
|
|
139
140
|
"rst:text-xs rst:text-left",
|
|
140
141
|
i ? "rst:text-error-600 rst:dark:text-error-400 rst:font-medium" : "rst:text-gray-500 rst:dark:text-gray-400"
|
|
141
142
|
),
|
|
@@ -148,5 +149,5 @@ const tt = ({
|
|
|
148
149
|
);
|
|
149
150
|
};
|
|
150
151
|
export {
|
|
151
|
-
|
|
152
|
+
ot as Select
|
|
152
153
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("react/jsx-runtime"),p=require("react"),v=require("../../../node_modules/@headlessui/react/dist/components/description/description.cjs"),y=require("../../../node_modules/@headlessui/react/dist/components/field/field.cjs"),N=require("../../../node_modules/@headlessui/react/dist/components/label/label.cjs"),h=require("../../../node_modules/@headlessui/react/dist/components/textarea/textarea.cjs"),s=require("../../../lib/utils.cjs"),w=require("./textarea-variants.cjs"),o=require("../../../internal/field-invalid.cjs"),l=p.forwardRef(({className:c,label:a,helperText:i,errorMessage:e,variant:d,error:x,resize:u,disabled:m,textareaClassName:f,...n},q)=>{const r=!!e||x,b=o.isFieldInvalid(r,n),j=o.withoutInvalidProps(n);return t.jsxs(y.Field,{className:s.cn("rst:w-full",c),children:[a&&t.jsx(N.Label,{className:"rst:block rst:text-sm rst:font-medium rst:leading-none rst:text-[var(--roster-control-text)] rst:peer-disabled:cursor-not-allowed rst:peer-disabled:opacity-70 rst:text-left rst:mb-1.5",children:a}),t.jsx(h.Textarea,{ref:q,disabled:m,className:s.cn(w.textareaVariants({variant:d,resize:u,error:r}),f),...j,invalid:b}),(i||e)&&t.jsx(v.Description,{className:s.cn("rst:text-xs rst:text-left rst:mt-1.5",r?"rst:text-error-600 rst:dark:text-error-400 rst:font-medium":"rst:text-gray-500 rst:dark:text-gray-400"),children:e||i})]})});l.displayName="Textarea";exports.Textarea=l;
|
|
@@ -1,26 +1,27 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { jsxs as
|
|
3
|
-
import
|
|
4
|
-
import { Description as
|
|
5
|
-
import { Field as
|
|
6
|
-
import { Label as
|
|
7
|
-
import { Textarea as
|
|
8
|
-
import { cn as
|
|
2
|
+
import { jsxs as N, jsx as e } from "react/jsx-runtime";
|
|
3
|
+
import b from "react";
|
|
4
|
+
import { Description as h } from "../../../node_modules/@headlessui/react/dist/components/description/description.js";
|
|
5
|
+
import { Field as v } from "../../../node_modules/@headlessui/react/dist/components/field/field.js";
|
|
6
|
+
import { Label as w } from "../../../node_modules/@headlessui/react/dist/components/label/label.js";
|
|
7
|
+
import { Textarea as y } from "../../../node_modules/@headlessui/react/dist/components/textarea/textarea.js";
|
|
8
|
+
import { cn as s } from "../../../lib/utils.js";
|
|
9
9
|
import { textareaVariants as k } from "./textarea-variants.js";
|
|
10
|
-
|
|
10
|
+
import { isFieldInvalid as j, withoutInvalidProps as F } from "../../../internal/field-invalid.js";
|
|
11
|
+
const I = b.forwardRef(
|
|
11
12
|
({
|
|
12
13
|
className: m,
|
|
13
|
-
label:
|
|
14
|
-
helperText:
|
|
14
|
+
label: a,
|
|
15
|
+
helperText: o,
|
|
15
16
|
errorMessage: t,
|
|
16
|
-
variant:
|
|
17
|
-
error:
|
|
18
|
-
resize:
|
|
19
|
-
disabled:
|
|
20
|
-
textareaClassName:
|
|
21
|
-
...
|
|
17
|
+
variant: l,
|
|
18
|
+
error: n,
|
|
19
|
+
resize: d,
|
|
20
|
+
disabled: c,
|
|
21
|
+
textareaClassName: x,
|
|
22
|
+
...i
|
|
22
23
|
}, f) => {
|
|
23
|
-
const
|
|
24
|
+
const r = !!t || n, p = j(r, i), u = F(i);
|
|
24
25
|
return (
|
|
25
26
|
/* No `space-y-*` here, for the reason documented on Input: Headless UI's
|
|
26
27
|
Field always renders a trailing hidden element, and Tailwind v4
|
|
@@ -30,37 +31,38 @@ const w = u.forwardRef(
|
|
|
30
31
|
the label and description instead. Select is immune to the same trap
|
|
31
32
|
only because it spaces with `gap`, and the hidden element is
|
|
32
33
|
`display: none` so it is not a flex item. */
|
|
33
|
-
/* @__PURE__ */
|
|
34
|
-
|
|
34
|
+
/* @__PURE__ */ N(v, { className: s("rst:w-full", m), children: [
|
|
35
|
+
a && /* `--roster-control-text`, matching Input's label — see the comment
|
|
35
36
|
there for why not `text-inherit`. */
|
|
36
|
-
/* @__PURE__ */
|
|
37
|
-
/* @__PURE__ */
|
|
38
|
-
|
|
37
|
+
/* @__PURE__ */ e(w, { className: "rst:block rst:text-sm rst:font-medium rst:leading-none rst:text-[var(--roster-control-text)] rst:peer-disabled:cursor-not-allowed rst:peer-disabled:opacity-70 rst:text-left rst:mb-1.5", children: a }),
|
|
38
|
+
/* @__PURE__ */ e(
|
|
39
|
+
y,
|
|
39
40
|
{
|
|
40
41
|
ref: f,
|
|
41
|
-
disabled:
|
|
42
|
-
className:
|
|
43
|
-
k({ variant:
|
|
44
|
-
|
|
42
|
+
disabled: c,
|
|
43
|
+
className: s(
|
|
44
|
+
k({ variant: l, resize: d, error: r }),
|
|
45
|
+
x
|
|
45
46
|
),
|
|
46
|
-
...
|
|
47
|
+
...u,
|
|
48
|
+
invalid: p
|
|
47
49
|
}
|
|
48
50
|
),
|
|
49
|
-
(
|
|
50
|
-
|
|
51
|
+
(o || t) && /* @__PURE__ */ e(
|
|
52
|
+
h,
|
|
51
53
|
{
|
|
52
|
-
className:
|
|
54
|
+
className: s(
|
|
53
55
|
"rst:text-xs rst:text-left rst:mt-1.5",
|
|
54
|
-
|
|
56
|
+
r ? "rst:text-error-600 rst:dark:text-error-400 rst:font-medium" : "rst:text-gray-500 rst:dark:text-gray-400"
|
|
55
57
|
),
|
|
56
|
-
children: t ||
|
|
58
|
+
children: t || o
|
|
57
59
|
}
|
|
58
60
|
)
|
|
59
61
|
] })
|
|
60
62
|
);
|
|
61
63
|
}
|
|
62
64
|
);
|
|
63
|
-
|
|
65
|
+
I.displayName = "Textarea";
|
|
64
66
|
export {
|
|
65
|
-
|
|
67
|
+
I as Textarea
|
|
66
68
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
1
|
+
"use client";"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react/jsx-runtime"),B=require("react"),D=require("../../../node_modules/@headlessui/react/dist/components/description/description.cjs"),R=require("../../../node_modules/@headlessui/react/dist/components/field/field.cjs"),g=require("../../../node_modules/@headlessui/react/dist/components/fieldset/fieldset.cjs"),V=require("../../../node_modules/@headlessui/react/dist/components/label/label.cjs"),h=require("../../../node_modules/@headlessui/react/dist/components/legend/legend.cjs"),e=require("../../../lib/utils.cjs"),p=require("../../../internal/field-invalid.cjs"),Z=require("../../atoms/Checkbox/Checkbox.cjs"),_=require("../../atoms/Eyebrow/Eyebrow.cjs"),j=require("./checkbox-group-variants.cjs"),J=t=>t.length>0&&Array.isArray(t[0].options),K={sm:"rst:text-xs",md:"rst:text-sm",lg:"rst:text-base"},Q=({options:t,value:c,onChange:k,label:u,helperText:o,errorMessage:i,maxHeight:b,disabled:n=!1,variant:q,size:a="md",columns:N,colorScheme:w,className:I,optionsClassName:G,panelClassName:C,"aria-describedby":E,"aria-invalid":L,...m})=>{const l=!!i,f=p.isFieldInvalid(l,{...m,"aria-invalid":L}),F=p.withoutInvalidProps(m),d=b!==void 0,v=B.useId(),O=[E,o||i?v:void 0].filter(Boolean).join(" ")||void 0,P=(r,x)=>{k(x?[...c,r]:c.filter(A=>A!==r))},S=r=>s.jsxs(R.Field,{disabled:n||r.disabled,className:"rst:flex rst:items-start rst:gap-2",children:[s.jsx(Z.Checkbox,{size:a??"md",colorScheme:w,checked:c.includes(r.value),onChange:x=>P(r.value,x),"aria-invalid":f||void 0,className:"rst:mt-0.5 rst:shrink-0"}),s.jsxs("div",{className:"rst:flex rst:min-w-0 rst:flex-col",children:[s.jsx(V.Label,{className:e.cn("rst:cursor-pointer rst:select-none rst:px-1 rst:py-0.5","rst:text-[var(--roster-control-text)]","rst:data-disabled:cursor-not-allowed rst:data-disabled:opacity-50",K[a??"md"]),children:r.label}),r.description&&s.jsx(D.Description,{className:"rst:px-1 rst:text-xs rst:text-gray-500 rst:dark:text-gray-400 rst:data-disabled:opacity-50",children:r.description})]})]},r.value),y=r=>s.jsx("div",{className:e.cn(j.checkboxGroupOptionsVariants({columns:N,size:a})),children:r.map(S)});return s.jsxs(g.Fieldset,{disabled:n,className:e.cn("rst:font-ui rst:flex rst:flex-col rst:gap-1.5 rst:min-w-0",I),...F,"aria-invalid":f||void 0,"aria-describedby":O,children:[u&&s.jsx(h.Legend,{className:"rst:block rst:text-sm rst:font-medium rst:text-[var(--roster-control-text)] rst:text-left rst:data-disabled:opacity-50",children:u}),s.jsx("div",{className:e.cn(j.checkboxGroupPanelVariants({variant:q,size:a,error:l}),d&&"rst:overflow-y-auto rst:custom-scrollbar rst:focus-visible:outline-hidden rst:focus-visible:ring-2 rst:focus-visible:ring-ring rst:focus-visible:ring-offset-2 rst:ring-offset-background",C,G),style:d?{maxHeight:b}:void 0,tabIndex:d?0:void 0,children:J(t)?t.map(r=>s.jsxs(g.Fieldset,{className:"rst:flex rst:flex-col rst:gap-2",children:[s.jsx(h.Legend,{as:_.Eyebrow,weight:"semibold",tone:"default",className:"rst:border-b rst:border-gray-200 rst:pb-1 rst:dark:border-gray-800",children:r.category}),y(r.options)]},r.category)):y(t)}),(o||i)&&s.jsx("p",{id:v,className:e.cn("rst:text-xs rst:text-left",l?"rst:text-error-600 rst:dark:text-error-400 rst:font-medium":"rst:text-gray-500 rst:dark:text-gray-400",n&&"rst:opacity-50"),children:i||o})]})};exports.CheckboxGroup=Q;
|