@versaur/react 1.0.15 → 1.0.17

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/forms.js CHANGED
@@ -1,588 +1,594 @@
1
- import { jsx as s, jsxs as y } from "react/jsx-runtime";
2
- import { labelStyles as Se, helperTextStyles as ke, errorTextStyles as Be, textInputStyles as D, textAreaStyles as K, selectStyles as _, radioStyles as j, checkboxStyles as L, radioGroupStyles as J, checkboxGroupStyles as U, chipInputStyles as M, comboboxInputStyles as v } from "@versaur/core/forms";
3
- import { forwardRef as f, useId as A, createContext as Q, useContext as F, useState as $, useEffect as E, useCallback as P, useRef as Re } from "react";
4
- import { u as N, c as Ae, F as Ge } from "./helpers-D23F5WBX.js";
5
- import { c as g } from "./cx-B9vmfsc1.js";
6
- import { ChevronDownIcon as De, CheckIcon as $e } from "@versaur/icons";
7
- import { D as W } from "./drawer-BjNHPqBr.js";
1
+ import { jsx as o, jsxs as I } from "react/jsx-runtime";
2
+ import { labelStyles as Ee, helperTextStyles as je, errorTextStyles as Te, textInputStyles as T, textAreaStyles as ee, selectStyles as te, radioStyles as U, checkboxStyles as H, radioGroupStyles as ne, checkboxGroupStyles as oe, chipInputStyles as Y, comboboxInputStyles as C, selectableInputStyles as F, currencyInputStyles as L } from "@versaur/core/forms";
3
+ import { forwardRef as f, useId as D, createContext as P, useContext as Q, useState as j, useEffect as M, useCallback as K, useRef as Le, useMemo as ae } from "react";
4
+ import { u as g, I as Z, c as Fe, F as Pe } from "./helpers-D23F5WBX.js";
5
+ import { c as x } from "./cx-B9vmfsc1.js";
6
+ import { SearchIcon as Qe, MailIcon as Me, LockIcon as Ve, ChevronDownIcon as ze, CheckIcon as Ue } from "@versaur/icons";
7
+ import { D as se } from "./drawer-BjNHPqBr.js";
8
8
  const k = f(
9
- ({ required: e = !1, disabled: c = !1, children: i, className: a, ...n }, t) => {
10
- const o = N({
11
- disabled: c,
9
+ ({ required: e = !1, disabled: i = !1, children: n, className: c, ...a }, s) => {
10
+ const t = g({
11
+ disabled: i,
12
12
  required: e
13
13
  });
14
- return /* @__PURE__ */ s("label", { ref: t, className: g(Se.label, a), ...o, ...n, children: i });
14
+ return /* @__PURE__ */ o("label", { ref: s, className: x(Ee.label, c), ...t, ...a, children: n });
15
15
  }
16
16
  );
17
17
  k.displayName = "Label";
18
- const B = f(({ children: e, className: c, ...i }, a) => /* @__PURE__ */ s("p", { ref: a, className: g(ke.helper, c), ...i, children: e }));
19
- B.displayName = "HelperText";
20
- const R = f(({ children: e, className: c, ...i }, a) => /* @__PURE__ */ s("p", { ref: a, className: g(Be.error, c), role: "alert", "aria-live": "polite", ...i, children: e }));
21
- R.displayName = "ErrorText";
22
- const Ee = f(
18
+ const R = f(({ children: e, className: i, ...n }, c) => /* @__PURE__ */ o("p", { ref: c, className: x(je.helper, i), ...n, children: e }));
19
+ R.displayName = "HelperText";
20
+ const A = f(({ children: e, className: i, ...n }, c) => /* @__PURE__ */ o("p", { ref: c, className: x(Te.error, i), role: "alert", "aria-live": "polite", ...n, children: e }));
21
+ A.displayName = "ErrorText";
22
+ const _ = f(
23
23
  ({
24
24
  label: e,
25
- helper: c,
26
- error: i,
27
- required: a = !1,
28
- disabled: n = !1,
29
- readOnly: t = !1,
30
- leftIcon: o,
25
+ helper: i,
26
+ error: n,
27
+ required: c = !1,
28
+ disabled: a = !1,
29
+ readOnly: s = !1,
30
+ leftIcon: t,
31
31
  rightIcon: r,
32
32
  id: l,
33
33
  className: d,
34
34
  ...u
35
- }, h) => {
36
- const b = A(), m = l || b, p = c ? `${m}-helper` : void 0, x = i ? `${m}-error` : void 0, C = [p, x].filter(Boolean).join(" "), I = N({
37
- disabled: n,
38
- hasLeftIcon: !!o,
35
+ }, p) => {
36
+ const b = D(), m = l || b, h = i ? `${m}-helper` : void 0, v = n ? `${m}-error` : void 0, y = [h, v].filter(Boolean).join(" "), N = g({
37
+ disabled: a,
38
+ hasLeftIcon: !!t,
39
39
  hasRightIcon: !!r,
40
- invalid: !!i,
41
- readOnly: t
40
+ invalid: !!n,
41
+ readOnly: s
42
42
  });
43
- return /* @__PURE__ */ y("div", { className: g(D.field, d), children: [
44
- e && /* @__PURE__ */ s(k, { htmlFor: m, required: a, disabled: n, children: e }),
45
- /* @__PURE__ */ y("div", { className: D.wrapper, ...I, children: [
46
- o && /* @__PURE__ */ s("span", { className: D["left-icon"], children: o }),
47
- /* @__PURE__ */ s(
43
+ return /* @__PURE__ */ I("div", { className: x(T.field, d), children: [
44
+ e && /* @__PURE__ */ o(k, { htmlFor: m, required: c, disabled: a, children: e }),
45
+ /* @__PURE__ */ I("div", { className: T.wrapper, ...N, children: [
46
+ t && /* @__PURE__ */ o("span", { className: T["left-icon"], children: t }),
47
+ /* @__PURE__ */ o(
48
48
  "input",
49
49
  {
50
- ref: h,
50
+ ref: p,
51
51
  id: m,
52
52
  type: "text",
53
- className: D.input,
54
- disabled: n,
55
- readOnly: t,
56
- required: a,
57
- "aria-invalid": i ? "true" : void 0,
58
- "aria-disabled": n ? "true" : void 0,
59
- "aria-describedby": C || void 0,
53
+ className: T.input,
54
+ disabled: a,
55
+ readOnly: s,
56
+ required: c,
57
+ "aria-invalid": n ? "true" : void 0,
58
+ "aria-disabled": a ? "true" : void 0,
59
+ "aria-describedby": y || void 0,
60
60
  ...u
61
61
  }
62
62
  ),
63
- r && /* @__PURE__ */ s("span", { className: D["right-icon"], children: r })
63
+ r && /* @__PURE__ */ o("span", { className: T["right-icon"], children: r })
64
64
  ] }),
65
- i && /* @__PURE__ */ s(R, { id: x, children: i }),
66
- !i && c && /* @__PURE__ */ s(B, { id: p, children: c })
65
+ n && /* @__PURE__ */ o(A, { id: v, children: n }),
66
+ !n && i && /* @__PURE__ */ o(R, { id: h, children: i })
67
67
  ] });
68
68
  }
69
69
  );
70
- Ee.displayName = "TextInput";
71
- const Te = f(
70
+ _.displayName = "TextInput";
71
+ const He = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, inputMode: "search", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Qe }), ...i }));
72
+ He.displayName = "SearchInput";
73
+ const Ke = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, type: "email", inputMode: "email", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Me }), ...i }));
74
+ Ke.displayName = "EmailInput";
75
+ const _e = f(({ leftIcon: e, ...i }, n) => /* @__PURE__ */ o(_, { ref: n, type: "password", leftIcon: e ?? /* @__PURE__ */ o(Z, { as: Ve }), ...i }));
76
+ _e.displayName = "PasswordInput";
77
+ const Je = f(
72
78
  ({
73
79
  label: e,
74
- helper: c,
75
- error: i,
76
- required: a = !1,
77
- disabled: n = !1,
78
- readOnly: t = !1,
79
- resizable: o = !0,
80
+ helper: i,
81
+ error: n,
82
+ required: c = !1,
83
+ disabled: a = !1,
84
+ readOnly: s = !1,
85
+ resizable: t = !0,
80
86
  minRows: r = 3,
81
87
  maxRows: l,
82
88
  id: d,
83
89
  className: u,
84
- ...h
90
+ ...p
85
91
  }, b) => {
86
- const m = A(), p = d || m, x = c ? `${p}-helper` : void 0, C = i ? `${p}-error` : void 0, I = [x, C].filter(Boolean).join(" "), w = N({
87
- disabled: n,
88
- invalid: !!i,
89
- readOnly: t,
90
- resizable: o ? "true" : "false",
92
+ const m = D(), h = d || m, v = i ? `${h}-helper` : void 0, y = n ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = g({
93
+ disabled: a,
94
+ invalid: !!n,
95
+ readOnly: s,
96
+ resizable: t ? "true" : "false",
91
97
  minRows: "true",
92
98
  ...l && { maxRows: "true" }
93
- }), O = {
99
+ }), B = {
94
100
  "--_min-rows-count": r,
95
101
  ...l && { "--_max-rows-count": l }
96
102
  };
97
- return /* @__PURE__ */ y("div", { className: g(K.field, u), children: [
98
- e && /* @__PURE__ */ s(k, { htmlFor: p, required: a, disabled: n, children: e }),
99
- /* @__PURE__ */ s(
103
+ return /* @__PURE__ */ I("div", { className: x(ee.field, u), children: [
104
+ e && /* @__PURE__ */ o(k, { htmlFor: h, required: c, disabled: a, children: e }),
105
+ /* @__PURE__ */ o(
100
106
  "textarea",
101
107
  {
102
108
  ref: b,
103
- id: p,
104
- className: K.textarea,
105
- disabled: n,
106
- readOnly: t,
107
- required: a,
108
- style: O,
109
- "aria-invalid": i ? "true" : void 0,
110
- "aria-disabled": n ? "true" : void 0,
111
- "aria-describedby": I || void 0,
109
+ id: h,
110
+ className: ee.textarea,
111
+ disabled: a,
112
+ readOnly: s,
113
+ required: c,
114
+ style: B,
115
+ "aria-invalid": n ? "true" : void 0,
116
+ "aria-disabled": a ? "true" : void 0,
117
+ "aria-describedby": N || void 0,
112
118
  ...w,
113
- ...h
119
+ ...p
114
120
  }
115
121
  ),
116
- i && /* @__PURE__ */ s(R, { id: C, children: i }),
117
- !i && c && /* @__PURE__ */ s(B, { id: x, children: c })
122
+ n && /* @__PURE__ */ o(A, { id: y, children: n }),
123
+ !n && i && /* @__PURE__ */ o(R, { id: v, children: i })
118
124
  ] });
119
125
  }
120
126
  );
121
- Te.displayName = "TextArea";
122
- const X = f(({ children: e, ...c }, i) => /* @__PURE__ */ s("option", { ref: i, ...c, children: e }));
123
- X.displayName = "Select.Option";
124
- const Y = f(
125
- ({ label: e, children: c, ...i }, a) => /* @__PURE__ */ s("optgroup", { ref: a, label: e, ...i, children: c })
127
+ Je.displayName = "TextArea";
128
+ const ie = f(({ children: e, ...i }, n) => /* @__PURE__ */ o("option", { ref: n, ...i, children: e }));
129
+ ie.displayName = "Select.Option";
130
+ const ce = f(
131
+ ({ label: e, children: i, ...n }, c) => /* @__PURE__ */ o("optgroup", { ref: c, label: e, ...n, children: i })
126
132
  );
127
- Y.displayName = "Select.OptionGroup";
128
- const Z = f(
133
+ ce.displayName = "Select.OptionGroup";
134
+ const re = f(
129
135
  ({
130
136
  label: e,
131
- helper: c,
132
- error: i,
133
- required: a = !1,
134
- disabled: n = !1,
135
- placeholder: t,
136
- children: o,
137
+ helper: i,
138
+ error: n,
139
+ required: c = !1,
140
+ disabled: a = !1,
141
+ placeholder: s,
142
+ children: t,
137
143
  id: r,
138
144
  className: l,
139
145
  ...d
140
146
  }, u) => {
141
- const h = A(), b = r || h, m = c ? `${b}-helper` : void 0, p = i ? `${b}-error` : void 0, x = [m, p].filter(Boolean).join(" "), C = N({
142
- disabled: n,
143
- invalid: !!i
147
+ const p = D(), b = r || p, m = i ? `${b}-helper` : void 0, h = n ? `${b}-error` : void 0, v = [m, h].filter(Boolean).join(" "), y = g({
148
+ disabled: a,
149
+ invalid: !!n
144
150
  });
145
- return /* @__PURE__ */ y("div", { className: g(_.field, l), children: [
146
- e && /* @__PURE__ */ s(k, { htmlFor: b, required: a, disabled: n, children: e }),
147
- /* @__PURE__ */ y(
151
+ return /* @__PURE__ */ I("div", { className: x(te.field, l), children: [
152
+ e && /* @__PURE__ */ o(k, { htmlFor: b, required: c, disabled: a, children: e }),
153
+ /* @__PURE__ */ I(
148
154
  "select",
149
155
  {
150
156
  ref: u,
151
157
  id: b,
152
- className: _.select,
153
- disabled: n,
154
- required: a,
155
- "aria-invalid": i ? "true" : void 0,
156
- "aria-disabled": n ? "true" : void 0,
157
- "aria-describedby": x || void 0,
158
- ...C,
158
+ className: te.select,
159
+ disabled: a,
160
+ required: c,
161
+ "aria-invalid": n ? "true" : void 0,
162
+ "aria-disabled": a ? "true" : void 0,
163
+ "aria-describedby": v || void 0,
164
+ ...y,
159
165
  ...d,
160
166
  children: [
161
- t && /* @__PURE__ */ s("option", { value: "", disabled: !0, children: t }),
162
- o
167
+ s && /* @__PURE__ */ o("option", { value: "", disabled: !0, children: s }),
168
+ t
163
169
  ]
164
170
  }
165
171
  ),
166
- i && /* @__PURE__ */ s(R, { id: p, children: i }),
167
- !i && c && /* @__PURE__ */ s(B, { id: m, children: c })
172
+ n && /* @__PURE__ */ o(A, { id: h, children: n }),
173
+ !n && i && /* @__PURE__ */ o(R, { id: m, children: i })
168
174
  ] });
169
175
  }
170
176
  );
171
- Z.displayName = "Select";
172
- const q = Z;
173
- q.Option = X;
174
- q.OptionGroup = Y;
175
- const ee = f(
176
- ({ disabled: e = !1, children: c, className: i, ...a }, n) => {
177
- const t = N({
177
+ re.displayName = "Select";
178
+ const le = re;
179
+ le.Option = ie;
180
+ le.OptionGroup = ce;
181
+ const de = f(
182
+ ({ disabled: e = !1, children: i, className: n, ...c }, a) => {
183
+ const s = g({
178
184
  disabled: e
179
185
  });
180
- return /* @__PURE__ */ y("label", { className: g(j.radio, i), ...t, children: [
181
- /* @__PURE__ */ s("input", { ref: n, type: "radio", className: j.input, disabled: e, ...a }),
182
- /* @__PURE__ */ s("span", { className: j.indicator }),
183
- c && /* @__PURE__ */ s("span", { className: j.label, children: c })
186
+ return /* @__PURE__ */ I("label", { className: x(U.radio, n), ...s, children: [
187
+ /* @__PURE__ */ o("input", { ref: a, type: "radio", className: U.input, disabled: e, ...c }),
188
+ /* @__PURE__ */ o("span", { className: U.indicator }),
189
+ i && /* @__PURE__ */ o("span", { className: U.label, children: i })
184
190
  ] });
185
191
  }
186
192
  );
187
- ee.displayName = "Radio";
188
- const te = f(
189
- ({ disabled: e = !1, required: c = !1, children: i, className: a, ...n }, t) => {
190
- const o = N({
193
+ de.displayName = "Radio";
194
+ const pe = f(
195
+ ({ disabled: e = !1, required: i = !1, children: n, className: c, ...a }, s) => {
196
+ const t = g({
191
197
  disabled: e,
192
- required: c
198
+ required: i
193
199
  });
194
- return /* @__PURE__ */ y("label", { className: g(L.checkbox, a), ...o, children: [
195
- /* @__PURE__ */ s(
200
+ return /* @__PURE__ */ I("label", { className: x(H.checkbox, c), ...t, children: [
201
+ /* @__PURE__ */ o(
196
202
  "input",
197
203
  {
198
- ref: t,
204
+ ref: s,
199
205
  type: "checkbox",
200
- className: L.input,
206
+ className: H.input,
201
207
  disabled: e,
202
- required: c,
203
- "aria-required": c || void 0,
204
- ...n
208
+ required: i,
209
+ "aria-required": i || void 0,
210
+ ...a
205
211
  }
206
212
  ),
207
- /* @__PURE__ */ s("span", { className: L.indicator }),
208
- i && /* @__PURE__ */ s("span", { className: L.label, "data-required": c || void 0, children: i })
213
+ /* @__PURE__ */ o("span", { className: H.indicator }),
214
+ n && /* @__PURE__ */ o("span", { className: H.label, "data-required": i || void 0, children: n })
209
215
  ] });
210
216
  }
211
217
  );
212
- te.displayName = "Checkbox";
213
- const oe = Q(void 0);
214
- function je() {
215
- const e = F(oe);
218
+ pe.displayName = "Checkbox";
219
+ const ue = P(void 0);
220
+ function We() {
221
+ const e = Q(ue);
216
222
  if (!e)
217
223
  throw new Error("RadioGroup.Option must be used within RadioGroup");
218
224
  return e;
219
225
  }
220
- const ne = f(
226
+ const he = f(
221
227
  ({
222
228
  value: e,
223
- onChange: c,
224
- name: i,
225
- label: a,
226
- helper: n,
227
- error: t,
228
- required: o = !1,
229
+ onChange: i,
230
+ name: n,
231
+ label: c,
232
+ helper: a,
233
+ error: s,
234
+ required: t = !1,
229
235
  disabled: r = !1,
230
236
  direction: l = "column",
231
237
  children: d,
232
238
  className: u,
233
- ...h
239
+ ...p
234
240
  }, b) => {
235
- const m = A(), p = h.id || m, x = n ? `${p}-helper` : void 0, C = t ? `${p}-error` : void 0, I = [x, C].filter(Boolean).join(" "), w = (S) => {
236
- !r && c && c(S);
237
- }, O = N({
241
+ const m = D(), h = p.id || m, v = a ? `${h}-helper` : void 0, y = s ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = (S) => {
242
+ !r && i && i(S);
243
+ }, B = g({
238
244
  disabled: r
239
245
  });
240
- return /* @__PURE__ */ y("div", { ref: b, className: g(J.field, u), ...O, ...h, children: [
241
- a && /* @__PURE__ */ s(k, { required: o, disabled: r, children: a }),
242
- /* @__PURE__ */ s(oe.Provider, { value: { disabled: r, name: i, onChange: w, value: e }, children: /* @__PURE__ */ s(
246
+ return /* @__PURE__ */ I("div", { ref: b, className: x(ne.field, u), ...B, ...p, children: [
247
+ c && /* @__PURE__ */ o(k, { required: t, disabled: r, children: c }),
248
+ /* @__PURE__ */ o(ue.Provider, { value: { disabled: r, name: n, onChange: w, value: e }, children: /* @__PURE__ */ o(
243
249
  "div",
244
250
  {
245
- className: J.options,
251
+ className: ne.options,
246
252
  "data-direction": l,
247
253
  role: "radiogroup",
248
- "aria-describedby": I || void 0,
249
- "aria-invalid": t ? "true" : void 0,
254
+ "aria-describedby": N || void 0,
255
+ "aria-invalid": s ? "true" : void 0,
250
256
  children: d
251
257
  }
252
258
  ) }),
253
- t && /* @__PURE__ */ s(R, { id: C, children: t }),
254
- !t && n && /* @__PURE__ */ s(B, { id: x, children: n })
259
+ s && /* @__PURE__ */ o(A, { id: y, children: s }),
260
+ !s && a && /* @__PURE__ */ o(R, { id: v, children: a })
255
261
  ] });
256
262
  }
257
263
  );
258
- ne.displayName = "RadioGroup";
259
- const ie = f(
260
- ({ value: e, children: c, disabled: i, ...a }, n) => {
261
- const t = je(), o = t.value === e, r = t.disabled || i, l = () => {
262
- r || t.onChange(e);
264
+ he.displayName = "RadioGroup";
265
+ const me = f(
266
+ ({ value: e, children: i, disabled: n, ...c }, a) => {
267
+ const s = We(), t = s.value === e, r = s.disabled || n, l = () => {
268
+ r || s.onChange(e);
263
269
  };
264
- return /* @__PURE__ */ s(
265
- ee,
270
+ return /* @__PURE__ */ o(
271
+ de,
266
272
  {
267
- ref: n,
268
- name: t.name,
273
+ ref: a,
274
+ name: s.name,
269
275
  value: e,
270
- checked: o,
276
+ checked: t,
271
277
  disabled: r,
272
278
  onChange: l,
273
- ...a,
274
- children: c
279
+ ...c,
280
+ children: i
275
281
  }
276
282
  );
277
283
  }
278
284
  );
279
- ie.displayName = "RadioGroup.Option";
280
- const Ue = Object.assign(ne, {
281
- Option: ie
282
- }), se = Q(void 0);
283
- function Le() {
284
- const e = F(se);
285
+ me.displayName = "RadioGroup.Option";
286
+ const dt = Object.assign(he, {
287
+ Option: me
288
+ }), be = P(void 0);
289
+ function Xe() {
290
+ const e = Q(be);
285
291
  if (!e)
286
292
  throw new Error("CheckboxGroup.Option must be used within CheckboxGroup");
287
293
  return e;
288
294
  }
289
- const ae = f(
295
+ const fe = f(
290
296
  ({
291
297
  value: e,
292
- onChange: c,
293
- name: i,
294
- label: a,
295
- helper: n,
296
- error: t,
297
- required: o = !1,
298
+ onChange: i,
299
+ name: n,
300
+ label: c,
301
+ helper: a,
302
+ error: s,
303
+ required: t = !1,
298
304
  disabled: r = !1,
299
305
  direction: l = "column",
300
306
  children: d,
301
307
  className: u,
302
- ...h
308
+ ...p
303
309
  }, b) => {
304
- const m = A(), p = h.id || m, x = n ? `${p}-helper` : void 0, C = t ? `${p}-error` : void 0, I = [x, C].filter(Boolean).join(" "), w = (S) => {
305
- !r && c && c(S);
306
- }, O = N({
310
+ const m = D(), h = p.id || m, v = a ? `${h}-helper` : void 0, y = s ? `${h}-error` : void 0, N = [v, y].filter(Boolean).join(" "), w = (S) => {
311
+ !r && i && i(S);
312
+ }, B = g({
307
313
  disabled: r
308
314
  });
309
- return /* @__PURE__ */ y("div", { ref: b, className: g(U.field, u), ...O, ...h, children: [
310
- a && /* @__PURE__ */ s(k, { required: o, disabled: r, children: a }),
311
- /* @__PURE__ */ s(se.Provider, { value: { disabled: r, name: i, onChange: w, value: e }, children: /* @__PURE__ */ s(
315
+ return /* @__PURE__ */ I("div", { ref: b, className: x(oe.field, u), ...B, ...p, children: [
316
+ c && /* @__PURE__ */ o(k, { required: t, disabled: r, children: c }),
317
+ /* @__PURE__ */ o(be.Provider, { value: { disabled: r, name: n, onChange: w, value: e }, children: /* @__PURE__ */ o(
312
318
  "div",
313
319
  {
314
- className: U.options,
320
+ className: oe.options,
315
321
  "data-direction": l,
316
322
  role: "group",
317
- "aria-describedby": I || void 0,
318
- "aria-invalid": t ? "true" : void 0,
323
+ "aria-describedby": N || void 0,
324
+ "aria-invalid": s ? "true" : void 0,
319
325
  children: d
320
326
  }
321
327
  ) }),
322
- t && /* @__PURE__ */ s(R, { id: C, children: t }),
323
- !t && n && /* @__PURE__ */ s(B, { id: x, children: n })
328
+ s && /* @__PURE__ */ o(A, { id: y, children: s }),
329
+ !s && a && /* @__PURE__ */ o(R, { id: v, children: a })
324
330
  ] });
325
331
  }
326
332
  );
327
- ae.displayName = "CheckboxGroup";
328
- const ce = f(
329
- ({ value: e, children: c, disabled: i, ...a }, n) => {
330
- const t = Le(), o = t.value.includes(e), r = t.disabled || i, l = () => {
333
+ fe.displayName = "CheckboxGroup";
334
+ const ve = f(
335
+ ({ value: e, children: i, disabled: n, ...c }, a) => {
336
+ const s = Xe(), t = s.value.includes(e), r = s.disabled || n, l = () => {
331
337
  if (!r) {
332
- const d = o ? t.value.filter((u) => u !== e) : [...t.value, e];
333
- t.onChange(d);
338
+ const d = t ? s.value.filter((u) => u !== e) : [...s.value, e];
339
+ s.onChange(d);
334
340
  }
335
341
  };
336
- return /* @__PURE__ */ s(
337
- te,
342
+ return /* @__PURE__ */ o(
343
+ pe,
338
344
  {
339
- ref: n,
340
- name: t.name,
345
+ ref: a,
346
+ name: s.name,
341
347
  value: e,
342
- checked: o,
348
+ checked: t,
343
349
  disabled: r,
344
350
  onChange: l,
345
- ...a,
346
- children: c
351
+ ...c,
352
+ children: i
347
353
  }
348
354
  );
349
355
  }
350
356
  );
351
- ce.displayName = "CheckboxGroup.Option";
352
- const We = Object.assign(ae, {
353
- Option: ce
354
- }), re = Q(void 0);
355
- function Pe() {
356
- const e = F(re);
357
+ ve.displayName = "CheckboxGroup.Option";
358
+ const pt = Object.assign(fe, {
359
+ Option: ve
360
+ }), ye = P(void 0);
361
+ function Ye() {
362
+ const e = Q(ye);
357
363
  if (!e)
358
364
  throw new Error("ChipInput.Option must be used within ChipInput");
359
365
  return e;
360
366
  }
361
- const le = f(
367
+ const xe = f(
362
368
  ({
363
369
  value: e,
364
- onChange: c,
365
- multiple: i = !1,
366
- name: a,
367
- label: n,
368
- helper: t,
369
- error: o,
370
+ onChange: i,
371
+ multiple: n = !1,
372
+ name: c,
373
+ label: a,
374
+ helper: s,
375
+ error: t,
370
376
  required: r = !1,
371
377
  disabled: l = !1,
372
378
  gap: d = "2",
373
379
  wrap: u = !0,
374
- children: h,
380
+ children: p,
375
381
  className: b,
376
382
  ...m
377
- }, p) => {
378
- const x = A(), C = m.id || x, I = t ? `${C}-helper` : void 0, w = o ? `${C}-error` : void 0, O = [I, w].filter(Boolean).join(" "), S = (z) => {
379
- l || c(z);
380
- }, G = N({
381
- invalid: !!o
382
- }), V = i ? "group" : "radiogroup";
383
- return /* @__PURE__ */ y("div", { ref: p, className: g(M.field, b), ...G, ...m, children: [
384
- n && /* @__PURE__ */ s(k, { required: r, disabled: l, children: n }),
385
- /* @__PURE__ */ s(
386
- re.Provider,
383
+ }, h) => {
384
+ const v = D(), y = m.id || v, N = s ? `${y}-helper` : void 0, w = t ? `${y}-error` : void 0, B = [N, w].filter(Boolean).join(" "), S = (E) => {
385
+ l || i(E);
386
+ }, $ = g({
387
+ invalid: !!t
388
+ }), G = n ? "group" : "radiogroup";
389
+ return /* @__PURE__ */ I("div", { ref: h, className: x(Y.field, b), ...$, ...m, children: [
390
+ a && /* @__PURE__ */ o(k, { required: r, disabled: l, children: a }),
391
+ /* @__PURE__ */ o(
392
+ ye.Provider,
387
393
  {
388
394
  value: {
389
395
  disabled: l,
390
- multiple: i,
391
- name: a,
396
+ multiple: n,
397
+ name: c,
392
398
  onChange: S,
393
399
  value: e
394
400
  },
395
- children: /* @__PURE__ */ s(
401
+ children: /* @__PURE__ */ o(
396
402
  "div",
397
403
  {
398
- className: M.options,
404
+ className: Y.options,
399
405
  "data-gap": d,
400
406
  "data-wrap": u,
401
- role: V,
402
- "aria-describedby": O || void 0,
403
- "aria-invalid": o ? "true" : void 0,
404
- children: h
407
+ role: G,
408
+ "aria-describedby": B || void 0,
409
+ "aria-invalid": t ? "true" : void 0,
410
+ children: p
405
411
  }
406
412
  )
407
413
  }
408
414
  ),
409
- o && /* @__PURE__ */ s(R, { id: w, children: o }),
410
- !o && t && /* @__PURE__ */ s(B, { id: I, children: t })
415
+ t && /* @__PURE__ */ o(A, { id: w, children: t }),
416
+ !t && s && /* @__PURE__ */ o(R, { id: N, children: s })
411
417
  ] });
412
418
  }
413
419
  );
414
- le.displayName = "ChipInput";
415
- const de = f(
416
- ({ value: e, children: c, disabled: i, iconLeft: a, iconRight: n, ...t }, o) => {
417
- const r = Pe(), l = r.disabled || i, d = !!(a || n);
420
+ xe.displayName = "ChipInput";
421
+ const Ie = f(
422
+ ({ value: e, children: i, disabled: n, iconLeft: c, iconRight: a, ...s }, t) => {
423
+ const r = Ye(), l = r.disabled || n, d = !!(c || a);
418
424
  let u = !1;
419
425
  r.multiple ? u = Array.isArray(r.value) && r.value.includes(e) : u = r.value === e;
420
- const h = () => {
426
+ const p = () => {
421
427
  if (!l)
422
428
  if (r.multiple) {
423
- const m = Array.isArray(r.value) ? r.value : [], p = u ? m.filter((x) => x !== e) : [...m, e];
424
- r.onChange(p);
429
+ const m = Array.isArray(r.value) ? r.value : [], h = u ? m.filter((v) => v !== e) : [...m, e];
430
+ r.onChange(h);
425
431
  } else
426
432
  r.onChange(e);
427
- }, b = N({
433
+ }, b = g({
428
434
  disabled: l,
429
435
  selected: u,
430
436
  ...d && { "has-icon": !0 }
431
437
  });
432
- return /* @__PURE__ */ y(
438
+ return /* @__PURE__ */ I(
433
439
  "button",
434
440
  {
435
- ref: o,
441
+ ref: t,
436
442
  type: "button",
437
- className: M.option,
438
- onClick: h,
443
+ className: Y.option,
444
+ onClick: p,
439
445
  disabled: l,
440
446
  "aria-pressed": u,
441
447
  ...b,
442
- ...t,
448
+ ...s,
443
449
  children: [
444
- a,
445
450
  c,
446
- n
451
+ i,
452
+ a
447
453
  ]
448
454
  }
449
455
  );
450
456
  }
451
457
  );
452
- de.displayName = "ChipInput.Option";
453
- const Xe = Object.assign(le, {
454
- Option: de
455
- }), pe = Q(void 0);
456
- function T() {
457
- const e = F(pe);
458
+ Ie.displayName = "ChipInput.Option";
459
+ const ut = Object.assign(xe, {
460
+ Option: Ie
461
+ }), Ce = P(void 0);
462
+ function V() {
463
+ const e = Q(Ce);
458
464
  if (!e)
459
465
  throw new Error("ComboboxInput subcomponents must be used within ComboboxInput");
460
466
  return e;
461
467
  }
462
- const ue = f(
463
- ({ children: e, className: c, ...i }, a) => {
464
- const n = T();
465
- return /* @__PURE__ */ s(W, { open: n.isOpen, onOpenChange: (t) => !t && n.closeListbox(), placement: "right", children: /* @__PURE__ */ s(W.Body, { children: /* @__PURE__ */ y("div", { className: v["drawer-container"], children: [
466
- /* @__PURE__ */ s("div", { className: v["drawer-input-wrapper"], children: /* @__PURE__ */ s(
468
+ const ge = f(
469
+ ({ children: e, className: i, ...n }, c) => {
470
+ const a = V();
471
+ return /* @__PURE__ */ o(se, { open: a.isOpen, onOpenChange: (s) => !s && a.closeListbox(), placement: "right", children: /* @__PURE__ */ o(se.Body, { children: /* @__PURE__ */ I("div", { className: C["drawer-container"], children: [
472
+ /* @__PURE__ */ o("div", { className: C["drawer-input-wrapper"], children: /* @__PURE__ */ o(
467
473
  "input",
468
474
  {
469
475
  type: "text",
470
- className: v["drawer-input"],
476
+ className: C["drawer-input"],
471
477
  placeholder: "Search options...",
472
- value: n.searchQuery || "",
473
- onChange: (t) => {
474
- var o;
475
- return (o = n.setSearchQuery) == null ? void 0 : o.call(n, t.currentTarget.value);
478
+ value: a.searchQuery || "",
479
+ onChange: (s) => {
480
+ var t;
481
+ return (t = a.setSearchQuery) == null ? void 0 : t.call(a, s.currentTarget.value);
476
482
  },
477
483
  "aria-label": "Search options"
478
484
  }
479
485
  ) }),
480
- /* @__PURE__ */ s(
486
+ /* @__PURE__ */ o(
481
487
  "ul",
482
488
  {
483
- ref: a,
489
+ ref: c,
484
490
  role: "listbox",
485
491
  "aria-multiselectable": "true",
486
- className: g(v["drawer-listbox"], c),
487
- ...i,
492
+ className: x(C["drawer-listbox"], i),
493
+ ...n,
488
494
  children: e
489
495
  }
490
496
  )
491
497
  ] }) }) });
492
498
  }
493
499
  );
494
- ue.displayName = "ComboboxInput.Drawer";
495
- function Qe(e) {
496
- const [c, i] = $(e), [a, n] = $(!1), [t, o] = $(() => /* @__PURE__ */ new Map());
497
- E(() => {
498
- i(e);
500
+ ge.displayName = "ComboboxInput.Drawer";
501
+ function Ze(e) {
502
+ const [i, n] = j(e), [c, a] = j(!1), [s, t] = j(() => /* @__PURE__ */ new Map());
503
+ M(() => {
504
+ n(e);
499
505
  }, [e]);
500
- const r = P(() => {
501
- n((h) => !h);
502
- }, []), l = P(() => {
503
- n(!1);
504
- }, []), d = P((h, b) => {
505
- o((m) => {
506
- const p = new Map(m);
507
- return p.set(h, b), p;
506
+ const r = K(() => {
507
+ a((p) => !p);
508
+ }, []), l = K(() => {
509
+ a(!1);
510
+ }, []), d = K((p, b) => {
511
+ t((m) => {
512
+ const h = new Map(m);
513
+ return h.set(p, b), h;
508
514
  });
509
- }, []), u = P((h) => {
510
- o((b) => {
515
+ }, []), u = K((p) => {
516
+ t((b) => {
511
517
  const m = new Map(b);
512
- return m.delete(h), m;
518
+ return m.delete(p), m;
513
519
  });
514
520
  }, []);
515
521
  return {
516
- internalValue: c,
517
- setInternalValue: i,
518
- isOpen: a,
522
+ internalValue: i,
523
+ setInternalValue: n,
524
+ isOpen: c,
519
525
  toggleOpen: r,
520
526
  closeListbox: l,
521
- optionRegistry: t,
527
+ optionRegistry: s,
522
528
  registerOption: d,
523
529
  unregisterOption: u
524
530
  };
525
531
  }
526
- function Fe(e, c) {
527
- const [i, a] = $("bottom"), n = Re(null);
528
- return E(() => {
529
- if (c !== "popup" || !e) return;
530
- const t = n.current;
531
- if (!t) return;
532
- t.matches(":popover-open") || t.showPopover(), requestAnimationFrame(() => {
533
- const r = t.previousElementSibling;
532
+ function qe(e, i) {
533
+ const [n, c] = j("bottom"), a = Le(null);
534
+ return M(() => {
535
+ if (i !== "popup" || !e) return;
536
+ const s = a.current;
537
+ if (!s) return;
538
+ s.matches(":popover-open") || s.showPopover(), requestAnimationFrame(() => {
539
+ const r = s.previousElementSibling;
534
540
  if (!r) return;
535
- const l = r.getBoundingClientRect(), d = t.getBoundingClientRect(), u = {
541
+ const l = r.getBoundingClientRect(), d = s.getBoundingClientRect(), u = {
536
542
  width: d.width,
537
543
  height: d.height
538
- }, h = Ae(
544
+ }, p = Fe(
539
545
  l,
540
546
  u,
541
547
  100,
542
548
  ["top", "bottom"]
543
549
  );
544
- a(h);
550
+ c(p);
545
551
  });
546
- }, [e, c]), { internalRef: n, placement: i };
552
+ }, [e, i]), { internalRef: a, placement: n };
547
553
  }
548
- const he = f(
549
- ({ children: e, className: c, ...i }, a) => {
550
- const n = T(), { internalRef: t, placement: o } = Fe(n.isOpen, n.variant);
551
- E(() => {
552
- const l = t.current;
554
+ const Ne = f(
555
+ ({ children: e, className: i, ...n }, c) => {
556
+ const a = V(), { internalRef: s, placement: t } = qe(a.isOpen, a.variant);
557
+ M(() => {
558
+ const l = s.current;
553
559
  if (!l) return;
554
560
  const d = () => {
555
- l.matches(":popover-open") || n.closeListbox();
561
+ l.matches(":popover-open") || a.closeListbox();
556
562
  };
557
563
  return l.addEventListener("toggle", d), () => l.removeEventListener("toggle", d);
558
- }, [n, t]);
559
- const r = N({ placement: o });
560
- return /* @__PURE__ */ s(
564
+ }, [a, s]);
565
+ const r = g({ placement: t });
566
+ return /* @__PURE__ */ o(
561
567
  "ul",
562
568
  {
563
569
  ref: (l) => {
564
- t.current = l, typeof a == "function" ? a(l) : a && (a.current = l);
570
+ s.current = l, typeof c == "function" ? c(l) : c && (c.current = l);
565
571
  },
566
572
  role: "listbox",
567
573
  "aria-multiselectable": "true",
568
- className: g(v.listbox, c),
574
+ className: x(C.listbox, i),
569
575
  popover: "auto",
570
576
  ...r,
571
577
  style: {
572
- positionAnchor: n.anchorName
578
+ positionAnchor: a.anchorName
573
579
  },
574
- ...i,
575
- children: /* @__PURE__ */ y("div", { className: v["listbox-inner"], children: [
576
- /* @__PURE__ */ s("div", { className: v["drawer-input-wrapper"], children: /* @__PURE__ */ s(
580
+ ...n,
581
+ children: /* @__PURE__ */ I("div", { className: C["listbox-inner"], children: [
582
+ /* @__PURE__ */ o("div", { className: C["drawer-input-wrapper"], children: /* @__PURE__ */ o(
577
583
  "input",
578
584
  {
579
585
  type: "text",
580
- className: v["drawer-input"],
586
+ className: C["drawer-input"],
581
587
  placeholder: "Search options...",
582
- value: n.searchQuery || "",
588
+ value: a.searchQuery || "",
583
589
  onChange: (l) => {
584
590
  var d;
585
- return (d = n.setSearchQuery) == null ? void 0 : d.call(n, l.currentTarget.value);
591
+ return (d = a.setSearchQuery) == null ? void 0 : d.call(a, l.currentTarget.value);
586
592
  },
587
593
  "aria-label": "Search options"
588
594
  }
@@ -593,177 +599,356 @@ const he = f(
593
599
  );
594
600
  }
595
601
  );
596
- he.displayName = "ComboboxInput.Listbox";
597
- const me = f(
602
+ Ne.displayName = "ComboboxInput.Listbox";
603
+ const Se = f(
598
604
  ({
599
605
  value: e,
600
- onChange: c,
601
- variant: i = "popup",
602
- disabled: a = !1,
603
- invalid: n = !1,
604
- label: t,
605
- helper: o,
606
+ onChange: i,
607
+ variant: n = "popup",
608
+ disabled: c = !1,
609
+ invalid: a = !1,
610
+ label: s,
611
+ helper: t,
606
612
  error: r,
607
613
  required: l = !1,
608
614
  children: d,
609
615
  className: u,
610
- ...h
616
+ ...p
611
617
  }, b) => {
612
- const m = A(), p = h.id || m, x = `${p}-button`, C = o ? `${p}-helper` : void 0, I = r ? `${p}-error` : void 0, w = [C, I].filter(Boolean).join(" "), O = `--combobox-anchor-${p.replace(/[^a-z0-9-]/gi, "")}`, {
618
+ const m = D(), h = p.id || m, v = `${h}-button`, y = t ? `${h}-helper` : void 0, N = r ? `${h}-error` : void 0, w = [y, N].filter(Boolean).join(" "), B = `--combobox-anchor-${h.replace(/[^a-z0-9-]/gi, "")}`, {
613
619
  internalValue: S,
614
- setInternalValue: G,
615
- isOpen: V,
616
- toggleOpen: z,
617
- closeListbox: Ce,
618
- optionRegistry: ve,
619
- registerOption: ge,
620
- unregisterOption: ye
621
- } = Qe(e), [Ne, Ie] = $("");
622
- E(() => {
623
- G(e);
624
- }, [e, G]);
625
- const we = (H) => {
626
- a || (G(H), c(H));
627
- }, Oe = N({
628
- invalid: !!(r || n),
629
- disabled: a
620
+ setInternalValue: $,
621
+ isOpen: G,
622
+ toggleOpen: E,
623
+ closeListbox: z,
624
+ optionRegistry: J,
625
+ registerOption: W,
626
+ unregisterOption: X
627
+ } = Ze(e), [O, Ge] = j("");
628
+ M(() => {
629
+ $(e);
630
+ }, [e, $]);
631
+ const De = (q) => {
632
+ c || ($(q), i(q));
633
+ }, $e = g({
634
+ invalid: !!(r || a),
635
+ disabled: c
630
636
  });
631
- return /* @__PURE__ */ y("div", { ref: b, className: g(v.field, u), ...Oe, ...h, children: [
632
- t && /* @__PURE__ */ s(k, { required: l, disabled: a, htmlFor: x, children: t }),
633
- /* @__PURE__ */ s(
634
- pe.Provider,
637
+ return /* @__PURE__ */ I("div", { ref: b, className: x(C.field, u), ...$e, ...p, children: [
638
+ s && /* @__PURE__ */ o(k, { required: l, disabled: c, htmlFor: v, children: s }),
639
+ /* @__PURE__ */ o(
640
+ Ce.Provider,
635
641
  {
636
642
  value: {
637
643
  value: S,
638
- onChange: we,
639
- isOpen: V,
640
- toggleOpen: z,
641
- closeListbox: Ce,
642
- variant: i,
643
- anchorName: O,
644
- buttonId: x,
645
- optionRegistry: ve,
646
- registerOption: ge,
647
- unregisterOption: ye,
648
- disabled: a,
649
- searchQuery: Ne,
650
- setSearchQuery: Ie
644
+ onChange: De,
645
+ isOpen: G,
646
+ toggleOpen: E,
647
+ closeListbox: z,
648
+ variant: n,
649
+ anchorName: B,
650
+ buttonId: v,
651
+ optionRegistry: J,
652
+ registerOption: W,
653
+ unregisterOption: X,
654
+ disabled: c,
655
+ searchQuery: O,
656
+ setSearchQuery: Ge
651
657
  },
652
- children: /* @__PURE__ */ s("div", { className: v.root, "aria-describedby": w || void 0, children: d })
658
+ children: /* @__PURE__ */ o("div", { className: C.root, "aria-describedby": w || void 0, children: d })
653
659
  }
654
660
  ),
655
- r && /* @__PURE__ */ s(R, { id: I, children: r }),
656
- !r && o && S.length === 0 && /* @__PURE__ */ s(B, { id: C, children: o })
661
+ r && /* @__PURE__ */ o(A, { id: N, children: r }),
662
+ !r && t && S.length === 0 && /* @__PURE__ */ o(R, { id: y, children: t })
657
663
  ] });
658
664
  }
659
665
  );
660
- me.displayName = "ComboboxInput";
661
- const be = f(
662
- ({ children: e, className: c, iconLeft: i, iconRight: a, ...n }, t) => {
663
- const o = T(), r = o.value.length === 0, l = N({
664
- open: o.isOpen,
665
- disabled: o.disabled,
666
- "has-left-icon": !!i,
666
+ Se.displayName = "ComboboxInput";
667
+ const we = f(
668
+ ({ children: e, className: i, iconLeft: n, iconRight: c, ...a }, s) => {
669
+ const t = V(), r = t.value.length === 0, l = g({
670
+ open: t.isOpen,
671
+ disabled: t.disabled,
672
+ "has-left-icon": !!n,
667
673
  "has-right-icon": !0
668
674
  }), d = {
669
- anchorName: o.anchorName
670
- }, u = e || (r ? "Select" : `${o.value.length} selected`);
671
- return /* @__PURE__ */ y(
675
+ anchorName: t.anchorName
676
+ }, u = e || (r ? "Select" : `${t.value.length} selected`);
677
+ return /* @__PURE__ */ I(
672
678
  "button",
673
679
  {
674
- ref: t,
675
- id: o.buttonId,
680
+ ref: s,
681
+ id: t.buttonId,
676
682
  type: "button",
677
- className: g(v.button, c),
678
- onClick: () => !o.disabled && o.toggleOpen(),
679
- disabled: o.disabled,
680
- "aria-expanded": o.isOpen,
683
+ className: x(C.button, i),
684
+ onClick: () => !t.disabled && t.toggleOpen(),
685
+ disabled: t.disabled,
686
+ "aria-expanded": t.isOpen,
681
687
  "aria-haspopup": "listbox",
682
688
  style: d,
683
689
  ...l,
684
- ...n,
690
+ ...a,
685
691
  children: [
686
- i && /* @__PURE__ */ s("span", { className: v["left-icon"], children: i }),
687
- /* @__PURE__ */ s("span", { className: v["button-content"], ...r && { "data-placeholder": "" }, children: u }),
688
- a ? /* @__PURE__ */ s("span", { className: v["right-icon"], children: a }) : /* @__PURE__ */ s("span", { className: v["right-icon"], "data-chevron": !0, children: /* @__PURE__ */ s(De, {}) })
692
+ n && /* @__PURE__ */ o("span", { className: C["left-icon"], children: n }),
693
+ /* @__PURE__ */ o("span", { className: C["button-content"], ...r && { "data-placeholder": "" }, children: u }),
694
+ c ? /* @__PURE__ */ o("span", { className: C["right-icon"], children: c }) : /* @__PURE__ */ o("span", { className: C["right-icon"], "data-chevron": !0, children: /* @__PURE__ */ o(ze, {}) })
689
695
  ]
690
696
  }
691
697
  );
692
698
  }
693
699
  );
694
- be.displayName = "ComboboxInput.Button";
695
- const xe = f(
696
- ({ value: e, children: c, disabled: i = !1, className: a, ...n }, t) => {
697
- const o = T(), r = o.disabled || i, l = o.value.includes(e), d = typeof c == "string" ? c : String(e), u = !o.searchQuery || d.toLowerCase().includes(o.searchQuery.toLowerCase()) || e.toLowerCase().includes(o.searchQuery.toLowerCase());
698
- E(() => (o.registerOption(e, d), () => o.unregisterOption(e)), [e, d, o.registerOption, o.unregisterOption]);
699
- const h = () => {
700
+ we.displayName = "ComboboxInput.Button";
701
+ const Oe = f(
702
+ ({ value: e, children: i, disabled: n = !1, className: c, ...a }, s) => {
703
+ const t = V(), r = t.disabled || n, l = t.value.includes(e), d = typeof i == "string" ? i : String(e), u = !t.searchQuery || d.toLowerCase().includes(t.searchQuery.toLowerCase()) || e.toLowerCase().includes(t.searchQuery.toLowerCase());
704
+ M(() => (t.registerOption(e, d), () => t.unregisterOption(e)), [e, d, t.registerOption, t.unregisterOption]);
705
+ const p = () => {
700
706
  if (r) return;
701
- const p = l ? o.value.filter((x) => x !== e) : [...o.value, e];
702
- o.onChange(p);
703
- }, b = (p) => {
704
- (p.key === "Enter" || p.key === " ") && (p.preventDefault(), h());
705
- }, m = N({ active: l, disabled: r });
706
- return u ? /* @__PURE__ */ y(
707
+ const h = l ? t.value.filter((v) => v !== e) : [...t.value, e];
708
+ t.onChange(h);
709
+ }, b = (h) => {
710
+ (h.key === "Enter" || h.key === " ") && (h.preventDefault(), p());
711
+ }, m = g({ active: l, disabled: r });
712
+ return u ? /* @__PURE__ */ I(
707
713
  "li",
708
714
  {
709
- ref: t,
715
+ ref: s,
710
716
  role: "option",
711
- className: g(v.option, a),
712
- onClick: h,
717
+ className: x(C.option, c),
718
+ onClick: p,
713
719
  onKeyDown: b,
714
720
  "aria-selected": l,
715
721
  tabIndex: r ? -1 : 0,
716
722
  ...m,
717
- ...n,
723
+ ...a,
718
724
  children: [
719
- /* @__PURE__ */ s("span", { className: v["option-check"], children: /* @__PURE__ */ s($e, { width: "1em", height: "1em" }) }),
720
- /* @__PURE__ */ s("span", { children: c })
725
+ /* @__PURE__ */ o("span", { className: C["option-check"], children: /* @__PURE__ */ o(Ue, { width: "1em", height: "1em" }) }),
726
+ /* @__PURE__ */ o("span", { children: i })
721
727
  ]
722
728
  }
723
729
  ) : null;
724
730
  }
725
731
  );
726
- xe.displayName = "ComboboxInput.Option";
727
- const fe = f(
728
- ({ className: e, ...c }, i) => {
729
- const a = T();
730
- if (a.value.length === 0) return null;
731
- const n = (t) => {
732
- a.onChange(a.value.filter((o) => o !== t));
732
+ Oe.displayName = "ComboboxInput.Option";
733
+ const Be = f(
734
+ ({ className: e, ...i }, n) => {
735
+ const c = V();
736
+ if (c.value.length === 0) return null;
737
+ const a = (s) => {
738
+ c.onChange(c.value.filter((t) => t !== s));
733
739
  };
734
- return /* @__PURE__ */ s("div", { ref: i, className: g(v.chips, e), role: "group", ...c, children: a.value.map((t) => {
735
- const o = a.optionRegistry.get(t) ?? t;
736
- return /* @__PURE__ */ s(
737
- Ge,
740
+ return /* @__PURE__ */ o("div", { ref: n, className: x(C.chips, e), role: "group", ...i, children: c.value.map((s) => {
741
+ const t = c.optionRegistry.get(s) ?? s;
742
+ return /* @__PURE__ */ o(
743
+ Pe,
738
744
  {
739
- disabled: a.disabled,
740
- onClick: () => n(t),
741
- children: o
745
+ disabled: c.disabled,
746
+ onClick: () => a(s),
747
+ children: t
742
748
  },
743
- t
749
+ s
744
750
  );
745
751
  }) });
746
752
  }
747
753
  );
748
- fe.displayName = "ComboboxInput.SelectionChips";
749
- const Ye = Object.assign(me, {
750
- Button: be,
751
- Listbox: he,
752
- Drawer: ue,
753
- Option: xe,
754
- SelectionChips: fe
754
+ Be.displayName = "ComboboxInput.SelectionChips";
755
+ const ht = Object.assign(Se, {
756
+ Button: we,
757
+ Listbox: Ne,
758
+ Drawer: ge,
759
+ Option: Oe,
760
+ SelectionChips: Be
761
+ }), ke = P(void 0);
762
+ function et() {
763
+ const e = Q(ke);
764
+ if (!e)
765
+ throw new Error("SelectableInput.Option must be used within SelectableInput");
766
+ return e;
767
+ }
768
+ const Re = f(
769
+ ({
770
+ value: e,
771
+ onChange: i,
772
+ multiple: n = !1,
773
+ name: c,
774
+ disabled: a = !1,
775
+ placement: s = "top",
776
+ children: t,
777
+ className: r,
778
+ ...l
779
+ }, d) => {
780
+ const u = (m) => {
781
+ a || i(m);
782
+ }, p = g({
783
+ disabled: a
784
+ }), b = n ? "group" : "radiogroup";
785
+ return /* @__PURE__ */ o("div", { ref: d, className: x(F.field, r), ...p, ...l, children: /* @__PURE__ */ o(
786
+ ke.Provider,
787
+ {
788
+ value: {
789
+ disabled: a,
790
+ multiple: n,
791
+ name: c,
792
+ onChange: u,
793
+ value: e,
794
+ placement: s
795
+ },
796
+ children: /* @__PURE__ */ o("div", { role: b, children: t })
797
+ }
798
+ ) });
799
+ }
800
+ );
801
+ Re.displayName = "SelectableInput";
802
+ const Ae = f(
803
+ ({ value: e, children: i, disabled: n, className: c, ...a }, s) => {
804
+ const t = et(), r = t.disabled || n;
805
+ let l = !1;
806
+ t.multiple ? l = Array.isArray(t.value) && t.value.includes(e) : l = t.value === e;
807
+ const d = () => {
808
+ if (!r)
809
+ if (t.multiple) {
810
+ const p = Array.isArray(t.value) ? t.value : [], b = l ? p.filter((m) => m !== e) : [...p, e];
811
+ t.onChange(b);
812
+ } else
813
+ t.onChange(e);
814
+ }, u = g({
815
+ disabled: r,
816
+ selected: l,
817
+ placement: t.placement
818
+ });
819
+ return /* @__PURE__ */ I(
820
+ "label",
821
+ {
822
+ ref: s,
823
+ className: x(F.option, c),
824
+ ...u,
825
+ ...a,
826
+ children: [
827
+ /* @__PURE__ */ o(
828
+ "input",
829
+ {
830
+ type: "checkbox",
831
+ className: F.input,
832
+ name: t.name,
833
+ value: e,
834
+ checked: l,
835
+ onChange: d,
836
+ disabled: r,
837
+ "aria-disabled": r
838
+ }
839
+ ),
840
+ /* @__PURE__ */ o("span", { className: F.indicator }),
841
+ /* @__PURE__ */ o("div", { className: F.content, children: i })
842
+ ]
843
+ }
844
+ );
845
+ }
846
+ );
847
+ Ae.displayName = "SelectableInput.Option";
848
+ const mt = Object.assign(Re, {
849
+ Option: Ae
755
850
  });
851
+ function tt() {
852
+ try {
853
+ return Intl.supportedValuesOf("currency").map((i) => ({
854
+ code: i,
855
+ label: i
856
+ }));
857
+ } catch {
858
+ return [{ code: "USD", label: "USD" }];
859
+ }
860
+ }
861
+ const nt = f(
862
+ ({
863
+ label: e,
864
+ helper: i,
865
+ error: n,
866
+ required: c = !1,
867
+ disabled: a = !1,
868
+ readOnly: s = !1,
869
+ name: t,
870
+ amountValue: r = "",
871
+ onAmountChange: l,
872
+ currencyValue: d = "USD",
873
+ onCurrencyChange: u,
874
+ currencies: p,
875
+ currencyName: b,
876
+ id: m,
877
+ className: h,
878
+ ...v
879
+ }, y) => {
880
+ const N = ae(() => tt(), []), w = ae(() => p ? p.map((O) => ({
881
+ code: O,
882
+ label: O
883
+ })) : N, [p, N]), [B, S] = j(!1), $ = D(), G = m || $, E = i ? `${G}-helper` : void 0, z = n ? `${G}-error` : void 0, J = [E, z].filter(Boolean).join(" "), W = b || (t ? `${t}-currency` : void 0), X = g({
884
+ disabled: a,
885
+ invalid: !!n,
886
+ readOnly: s,
887
+ focused: B
888
+ });
889
+ return /* @__PURE__ */ I("div", { className: x(L.field, h), children: [
890
+ e && /* @__PURE__ */ o(k, { htmlFor: G, required: c, disabled: a, children: e }),
891
+ /* @__PURE__ */ I("div", { className: L.wrapper, ...X, children: [
892
+ /* @__PURE__ */ o(
893
+ "select",
894
+ {
895
+ className: L["currency-select"],
896
+ name: W,
897
+ value: d,
898
+ onChange: (O) => u == null ? void 0 : u(O.target.value),
899
+ onFocus: () => S(!0),
900
+ onBlur: () => S(!1),
901
+ disabled: a,
902
+ "aria-disabled": a ? "true" : void 0,
903
+ children: w.map((O) => /* @__PURE__ */ o("option", { value: O.code, children: O.label }, O.code))
904
+ }
905
+ ),
906
+ /* @__PURE__ */ o("span", { className: L.divider, "aria-hidden": !0 }),
907
+ /* @__PURE__ */ o(
908
+ "input",
909
+ {
910
+ ref: y,
911
+ id: G,
912
+ type: "text",
913
+ inputMode: "decimal",
914
+ className: L["amount-input"],
915
+ name: t,
916
+ value: r,
917
+ onChange: (O) => l == null ? void 0 : l(O.target.value),
918
+ onFocus: () => S(!0),
919
+ onBlur: () => S(!1),
920
+ disabled: a,
921
+ readOnly: s,
922
+ required: c,
923
+ "aria-invalid": n ? "true" : void 0,
924
+ "aria-disabled": a ? "true" : void 0,
925
+ "aria-describedby": J || void 0,
926
+ ...v
927
+ }
928
+ )
929
+ ] }),
930
+ n && /* @__PURE__ */ o(A, { id: z, children: n }),
931
+ !n && i && /* @__PURE__ */ o(R, { id: E, children: i })
932
+ ] });
933
+ }
934
+ );
935
+ nt.displayName = "CurrencyInput";
756
936
  export {
757
- te as Checkbox,
758
- We as CheckboxGroup,
759
- Xe as ChipInput,
760
- Ye as ComboboxInput,
761
- R as ErrorText,
762
- B as HelperText,
937
+ pe as Checkbox,
938
+ pt as CheckboxGroup,
939
+ ut as ChipInput,
940
+ ht as ComboboxInput,
941
+ nt as CurrencyInput,
942
+ Ke as EmailInput,
943
+ A as ErrorText,
944
+ R as HelperText,
763
945
  k as Label,
764
- ee as Radio,
765
- Ue as RadioGroup,
766
- q as Select,
767
- Te as TextArea,
768
- Ee as TextInput
946
+ _e as PasswordInput,
947
+ de as Radio,
948
+ dt as RadioGroup,
949
+ He as SearchInput,
950
+ le as Select,
951
+ mt as SelectableInput,
952
+ Je as TextArea,
953
+ _ as TextInput
769
954
  };