@launchpad-ui/form 0.3.5 → 0.5.1-alpha.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (61) hide show
  1. package/dist/Checkbox.d.ts +0 -36
  2. package/dist/Checkbox.d.ts.map +1 -1
  3. package/dist/CompactTextField.d.ts +0 -1
  4. package/dist/CompactTextField.d.ts.map +1 -1
  5. package/dist/FieldError.d.ts +3 -4
  6. package/dist/FieldError.d.ts.map +1 -1
  7. package/dist/FieldSet.d.ts +3 -6
  8. package/dist/FieldSet.d.ts.map +1 -1
  9. package/dist/Form.d.ts +2 -11
  10. package/dist/Form.d.ts.map +1 -1
  11. package/dist/FormField.d.ts +2 -1
  12. package/dist/FormField.d.ts.map +1 -1
  13. package/dist/FormGroup.d.ts +2 -6
  14. package/dist/FormGroup.d.ts.map +1 -1
  15. package/dist/FormHint.d.ts +2 -6
  16. package/dist/FormHint.d.ts.map +1 -1
  17. package/dist/IconField.d.ts +4 -4
  18. package/dist/IconField.d.ts.map +1 -1
  19. package/dist/Label.d.ts +3 -8
  20. package/dist/Label.d.ts.map +1 -1
  21. package/dist/Radio.d.ts +4 -50
  22. package/dist/Radio.d.ts.map +1 -1
  23. package/dist/RadioGroup.d.ts +3 -3
  24. package/dist/RadioGroup.d.ts.map +1 -1
  25. package/dist/RequiredAsterisk.d.ts +2 -4
  26. package/dist/RequiredAsterisk.d.ts.map +1 -1
  27. package/dist/Select.d.ts +3 -15
  28. package/dist/Select.d.ts.map +1 -1
  29. package/dist/TextArea.d.ts.map +1 -1
  30. package/dist/TextField.d.ts +0 -2
  31. package/dist/TextField.d.ts.map +1 -1
  32. package/dist/index.d.ts +0 -2
  33. package/dist/index.d.ts.map +1 -1
  34. package/dist/index.es.js +273 -372
  35. package/dist/index.es.js.map +1 -7
  36. package/dist/index.js +301 -443
  37. package/dist/index.js.map +1 -7
  38. package/dist/style.css +402 -0
  39. package/package.json +4 -4
  40. package/dist/InputGroup.d.ts +0 -7
  41. package/dist/InputGroup.d.ts.map +0 -1
  42. package/dist/styles/CompactTextField.css +0 -2
  43. package/dist/styles/CompactTextField.css.map +0 -1
  44. package/dist/styles/FieldSet.css +0 -2
  45. package/dist/styles/FieldSet.css.map +0 -1
  46. package/dist/styles/Form.css +0 -2
  47. package/dist/styles/Form.css.map +0 -1
  48. package/dist/styles/FormField.css +0 -2
  49. package/dist/styles/FormField.css.map +0 -1
  50. package/dist/styles/FormHint.css +0 -2
  51. package/dist/styles/FormHint.css.map +0 -1
  52. package/dist/styles/FormInput.css +0 -2
  53. package/dist/styles/FormInput.css.map +0 -1
  54. package/dist/styles/IconField.css +0 -2
  55. package/dist/styles/IconField.css.map +0 -1
  56. package/dist/styles/InputGroup.css +0 -2
  57. package/dist/styles/InputGroup.css.map +0 -1
  58. package/dist/styles/RequiredAsterisk.css +0 -2
  59. package/dist/styles/RequiredAsterisk.css.map +0 -1
  60. package/dist/styles/styles.css +0 -2
  61. package/dist/styles/styles.css.map +0 -1
package/dist/index.es.js CHANGED
@@ -1,295 +1,237 @@
1
- // src/Checkbox.tsx
2
- import { forwardRef } from "react";
3
-
4
- // src/Label.tsx
5
- import { cx as cx2 } from "classix";
6
-
7
- // src/RequiredAsterisk.tsx
1
+ import './style.css';
2
+ import { forwardRef, useState, useRef, Children, isValidElement, cloneElement } from "react";
8
3
  import { cx } from "classix";
9
- import "./styles/RequiredAsterisk.css";
10
- import { jsx } from "react/jsx-runtime";
11
- var RequiredAsterisk = ({ className, testId, ...rest }) => {
12
- const classes = cx("RequiredAsterisk");
4
+ import { jsx, jsxs, Fragment } from "react/jsx-runtime";
5
+ import { IconSize } from "@launchpad-ui/icons";
6
+ import { VisuallyHidden } from "@react-aria/visually-hidden";
7
+ const RequiredAsterisk$1 = "";
8
+ const RequiredAsterisk = ({
9
+ className,
10
+ ...rest
11
+ }) => {
12
+ const classes = cx("RequiredAsterisk", className);
13
13
  return /* @__PURE__ */ jsx("span", {
14
- className: classes,
15
- "data-test-id": testId,
16
14
  ...rest,
15
+ className: classes,
17
16
  children: "*"
18
17
  });
19
18
  };
20
-
21
- // src/Label.tsx
22
- import "./styles/Form.css";
23
- import { jsx as jsx2, jsxs } from "react/jsx-runtime";
24
- var Label = ({
25
- htmlFor,
19
+ const Form$1 = "";
20
+ const Label = ({
26
21
  disabled,
27
22
  className,
28
23
  children,
29
24
  required = false,
30
25
  optional = false,
31
- ...other
26
+ ...rest
32
27
  }) => {
33
- const classes = cx2("Form-label", className, disabled && "Form-label--disabled");
28
+ const classes = cx("Form-label", className, disabled && "Form-label--disabled");
34
29
  return /* @__PURE__ */ jsxs("label", {
35
- ...other,
30
+ ...rest,
36
31
  className: classes,
37
- htmlFor,
38
- children: [
39
- children,
40
- optional && !required && /* @__PURE__ */ jsx2("small", {
41
- className: "Form-labelOptional",
42
- children: "(optional)"
43
- }),
44
- required && !optional && /* @__PURE__ */ jsx2(RequiredAsterisk, {})
45
- ]
32
+ children: [children, optional && !required && /* @__PURE__ */ jsx("small", {
33
+ className: "Form-labelOptional",
34
+ children: "(optional)"
35
+ }), required && !optional && /* @__PURE__ */ jsx(RequiredAsterisk, {})]
46
36
  });
47
37
  };
48
-
49
- // src/Checkbox.tsx
50
- import "./styles/Form.css";
51
- import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
52
- var Checkbox = forwardRef(
53
- ({
54
- "aria-label": ariaLabel,
55
- "aria-labelledby": ariaLabelledby,
56
- children,
57
- disabled,
58
- testId,
59
- checked,
60
- labelClassName,
61
- ...other
62
- }, ref) => {
63
- const hasAriaLabel = ariaLabel !== void 0 || ariaLabelledby !== void 0;
64
- if (!children && !hasAriaLabel) {
65
- console.warn(
66
- "If you do not provide children, you must specify an aria-label for accessibility"
67
- );
68
- }
69
- return /* @__PURE__ */ jsxs2(Label, {
70
- className: labelClassName,
71
- children: [
72
- /* @__PURE__ */ jsx3("input", {
73
- ...other,
74
- ref,
75
- checked,
76
- "aria-checked": checked ? "true" : "false",
77
- "aria-label": ariaLabel,
78
- "aria-labelledby": ariaLabelledby,
79
- className: "Form-checkbox",
80
- disabled,
81
- "data-test-id": testId,
82
- type: "checkbox"
83
- }),
84
- " ",
85
- disabled ? /* @__PURE__ */ jsx3("span", {
86
- className: "Form-label--disabled",
87
- children
88
- }) : children
89
- ]
90
- });
38
+ const Checkbox = forwardRef(({
39
+ "aria-label": ariaLabel,
40
+ "aria-labelledby": ariaLabelledby,
41
+ children,
42
+ disabled,
43
+ checked,
44
+ labelClassName,
45
+ ...rest
46
+ }, ref) => {
47
+ const hasAriaLabel = ariaLabel !== void 0 || ariaLabelledby !== void 0;
48
+ if (!children && !hasAriaLabel) {
49
+ console.warn("If you do not provide children, you must specify an aria-label for accessibility");
91
50
  }
92
- );
93
- Checkbox.displayName = "Checkbox";
94
-
95
- // src/CompactTextField.tsx
96
- import { cx as cx4 } from "classix";
97
- import { forwardRef as forwardRef3, useState } from "react";
98
-
99
- // src/TextField.tsx
100
- import { cx as cx3 } from "classix";
101
- import { forwardRef as forwardRef2 } from "react";
102
- import "./styles/FormInput.css";
103
-
104
- // src/utils/index.ts
105
- var createFieldErrorId = (fieldIdentifier) => fieldIdentifier ? `${[...fieldIdentifier].join("")}-err` : void 0;
106
-
107
- // src/TextField.tsx
108
- import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
109
- var TextField = forwardRef2(
110
- ({
111
- className,
112
- type = "text",
113
- tiny = false,
114
- readOnly,
115
- tabIndex = 0,
116
- testId,
117
- suffix,
118
- overrideWidth,
119
- ...rest
120
- }, ref) => {
121
- const classes = overrideWidth ? className : cx3("FormInput", `FormInput-${type}`, className, tiny && "FormInput--tiny");
122
- if (suffix) {
123
- return /* @__PURE__ */ jsxs3("div", {
124
- className: "FormInput-suffixContainer",
125
- children: [
126
- /* @__PURE__ */ jsx4("input", {
127
- ...rest,
128
- type,
129
- className: cx3(classes, "FormInput-suffix"),
130
- readOnly,
131
- ref,
132
- "data-test-id": testId,
133
- "aria-describedby": rest["aria-describedby"] || createFieldErrorId(rest.id)
134
- }),
135
- /* @__PURE__ */ jsx4("label", {
136
- className: "FormInput-suffix",
137
- htmlFor: rest.id,
138
- children: suffix
139
- })
140
- ]
141
- });
142
- }
143
- return /* @__PURE__ */ jsx4("input", {
51
+ return /* @__PURE__ */ jsxs(Label, {
52
+ className: labelClassName,
53
+ children: [/* @__PURE__ */ jsx("input", {
144
54
  ...rest,
145
- type,
146
- className: classes,
147
- readOnly,
148
- tabIndex,
149
55
  ref,
150
- "data-test-id": testId,
151
- style: overrideWidth ? {
152
- width: overrideWidth
153
- } : void 0,
154
- "aria-describedby": rest["aria-describedby"] || createFieldErrorId(rest.id)
56
+ checked,
57
+ "aria-checked": checked ? "true" : "false",
58
+ "aria-label": ariaLabel,
59
+ "aria-labelledby": ariaLabelledby,
60
+ className: "Form-checkbox",
61
+ disabled,
62
+ type: "checkbox"
63
+ }), " ", disabled ? /* @__PURE__ */ jsx("span", {
64
+ className: "Form-label--disabled",
65
+ children
66
+ }) : children]
67
+ });
68
+ });
69
+ Checkbox.displayName = "Checkbox";
70
+ const FormInput = "";
71
+ const createFieldErrorId = (fieldIdentifier) => fieldIdentifier ? `${[...fieldIdentifier].join("")}-err` : void 0;
72
+ const TextField = forwardRef(({
73
+ className,
74
+ type = "text",
75
+ tiny = false,
76
+ readOnly,
77
+ tabIndex = 0,
78
+ suffix,
79
+ overrideWidth,
80
+ ...rest
81
+ }, ref) => {
82
+ const classes = overrideWidth ? className : cx("FormInput", `FormInput-${type}`, className, tiny && "FormInput--tiny");
83
+ if (suffix) {
84
+ return /* @__PURE__ */ jsxs("div", {
85
+ className: "FormInput-suffixContainer",
86
+ children: [/* @__PURE__ */ jsx("input", {
87
+ ...rest,
88
+ type,
89
+ className: cx(classes, "FormInput-suffix"),
90
+ readOnly,
91
+ ref,
92
+ "aria-describedby": rest["aria-describedby"] || createFieldErrorId(rest.id)
93
+ }), /* @__PURE__ */ jsx("label", {
94
+ className: "FormInput-suffix",
95
+ htmlFor: rest.id,
96
+ children: suffix
97
+ })]
155
98
  });
156
99
  }
157
- );
100
+ return /* @__PURE__ */ jsx("input", {
101
+ ...rest,
102
+ type,
103
+ className: classes,
104
+ readOnly,
105
+ tabIndex,
106
+ ref,
107
+ style: overrideWidth ? {
108
+ width: overrideWidth
109
+ } : void 0,
110
+ "aria-describedby": rest["aria-describedby"] || createFieldErrorId(rest.id)
111
+ });
112
+ });
158
113
  TextField.displayName = "TextField";
159
-
160
- // src/CompactTextField.tsx
161
- import "./styles/CompactTextField.css";
162
- import "./styles/FormInput.css";
163
- import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
164
- var CompactTextField = forwardRef3(
165
- ({ className, id, name, label, type, needsErrorFeedback, value, onFocus, onBlur, ...rest }, ref) => {
166
- const [isActive, setIsActive] = useState(
167
- (typeof value === "boolean" || value ? value.toString() : "").trim().length !== 0
168
- );
169
- const isActiveState = isActive || needsErrorFeedback;
170
- const classes = cx4("CompactTextField", className, isActiveState && "is-active");
171
- const placeholder = isActiveState ? "" : label;
172
- const handleFocus = (event) => {
173
- setIsActive(true);
174
- if (onFocus) {
175
- onFocus(event);
176
- }
177
- };
178
- const handleBlur = (event) => {
179
- const value2 = event.target.value || "";
180
- setIsActive(value2.trim().length !== 0);
181
- if (onBlur) {
182
- onBlur(event);
183
- }
184
- };
185
- return /* @__PURE__ */ jsxs4("div", {
186
- className: classes,
187
- children: [
188
- /* @__PURE__ */ jsx5(Label, {
189
- htmlFor: id,
190
- children: label
191
- }),
192
- /* @__PURE__ */ jsx5(TextField, {
193
- ...rest,
194
- id,
195
- name,
196
- type,
197
- placeholder,
198
- value,
199
- ref,
200
- onFocus: handleFocus,
201
- onBlur: handleBlur
202
- })
203
- ]
204
- });
205
- }
206
- );
114
+ const CompactTextField$1 = "";
115
+ const CompactTextField = forwardRef(({
116
+ className,
117
+ id,
118
+ label,
119
+ needsErrorFeedback,
120
+ value,
121
+ onFocus,
122
+ onBlur,
123
+ ...rest
124
+ }, ref) => {
125
+ const [isActive, setIsActive] = useState((typeof value === "boolean" || value ? value.toString() : "").trim().length !== 0);
126
+ const isActiveState = isActive || needsErrorFeedback;
127
+ const classes = cx("CompactTextField", className, isActiveState && "is-active");
128
+ const placeholder = isActiveState ? "" : label;
129
+ const handleFocus = (event) => {
130
+ setIsActive(true);
131
+ if (onFocus) {
132
+ onFocus(event);
133
+ }
134
+ };
135
+ const handleBlur = (event) => {
136
+ const value2 = event.target.value || "";
137
+ setIsActive(value2.trim().length !== 0);
138
+ if (onBlur) {
139
+ onBlur(event);
140
+ }
141
+ };
142
+ return /* @__PURE__ */ jsxs("div", {
143
+ className: classes,
144
+ children: [/* @__PURE__ */ jsx(Label, {
145
+ htmlFor: id,
146
+ children: label
147
+ }), /* @__PURE__ */ jsx(TextField, {
148
+ ...rest,
149
+ id,
150
+ placeholder,
151
+ value,
152
+ ref,
153
+ onFocus: handleFocus,
154
+ onBlur: handleBlur
155
+ })]
156
+ });
157
+ });
207
158
  CompactTextField.displayName = "CompactTextField";
208
-
209
- // src/FieldError.tsx
210
- import { cx as cx5 } from "classix";
211
- import "./styles/Form.css";
212
- import { jsx as jsx6 } from "react/jsx-runtime";
213
- var FieldError = ({ name, errorMessage, className }) => {
159
+ const FieldError = ({
160
+ name,
161
+ errorMessage,
162
+ className,
163
+ ...rest
164
+ }) => {
214
165
  if (!errorMessage) {
215
166
  return null;
216
167
  }
217
- return /* @__PURE__ */ jsx6("span", {
218
- className: cx5("Form-fieldError", className),
168
+ return /* @__PURE__ */ jsx("span", {
169
+ ...rest,
170
+ className: cx("Form-fieldError", className),
219
171
  "aria-live": "polite",
220
172
  id: createFieldErrorId(name),
221
173
  children: `Error - ${errorMessage}`
222
174
  });
223
175
  };
224
-
225
- // src/FieldSet.tsx
226
- import "./styles/FieldSet.css";
227
- import { jsx as jsx7 } from "react/jsx-runtime";
228
- var FieldSet = ({ children, testId }) => {
229
- return /* @__PURE__ */ jsx7("fieldset", {
230
- className: "FieldSet",
231
- "data-test-id": testId,
176
+ const FieldSet$1 = "";
177
+ const FieldSet = ({
178
+ children,
179
+ className,
180
+ ...rest
181
+ }) => {
182
+ const classes = cx("FieldSet", className);
183
+ return /* @__PURE__ */ jsx("fieldset", {
184
+ className: classes,
185
+ ...rest,
232
186
  children
233
187
  });
234
188
  };
235
-
236
- // src/Form.tsx
237
- import { cx as cx6 } from "classix";
238
- import "./styles/Form.css";
239
- import { jsx as jsx8 } from "react/jsx-runtime";
240
- var Form = (props) => {
241
- const { id, name, className, inline, children, ariaLabel, hasIncreasedErrorMargin, ...rest } = props;
242
- const classes = cx6(
243
- "Form",
189
+ const Form = (props) => {
190
+ const {
244
191
  className,
245
- inline && "Form--inline",
246
- !!hasIncreasedErrorMargin && "Form--increasedErrorMargin"
247
- );
248
- return /* @__PURE__ */ jsx8("form", {
249
- id,
250
- name,
251
- "aria-label": ariaLabel,
192
+ inline,
193
+ children,
194
+ hasIncreasedErrorMargin,
195
+ ...rest
196
+ } = props;
197
+ const classes = cx("Form", className, inline && "Form--inline", !!hasIncreasedErrorMargin && "Form--increasedErrorMargin");
198
+ return /* @__PURE__ */ jsx("form", {
252
199
  ...rest,
253
200
  className: classes,
254
201
  children
255
202
  });
256
203
  };
257
-
258
- // src/FormField.tsx
259
- import { cx as cx9 } from "classix";
260
-
261
- // src/FormGroup.tsx
262
- import { cx as cx7 } from "classix";
263
- import "./styles/Form.css";
264
- import { jsx as jsx9 } from "react/jsx-runtime";
265
- var FormGroup = (props) => {
266
- const { className, name, ignoreValidation, isInvalid, children, testId, ...other } = props;
267
- const classes = cx7("Form-group", className, !ignoreValidation && isInvalid && "is-invalid");
268
- return /* @__PURE__ */ jsx9("div", {
204
+ const FormGroup = (props) => {
205
+ const {
206
+ className,
207
+ name,
208
+ ignoreValidation,
209
+ isInvalid,
210
+ children,
211
+ ...rest
212
+ } = props;
213
+ const classes = cx("Form-group", className, !ignoreValidation && isInvalid && "is-invalid");
214
+ return /* @__PURE__ */ jsx("div", {
269
215
  className: classes,
270
- "data-test-id": testId,
271
- ...other,
216
+ ...rest,
272
217
  children
273
218
  });
274
219
  };
275
-
276
- // src/FormHint.tsx
277
- import { cx as cx8 } from "classix";
278
- import "./styles/FormHint.css";
279
- import { jsx as jsx10 } from "react/jsx-runtime";
280
- var FormHint = ({ className, children, ...rest }) => {
281
- const classes = cx8("Form-hint", className);
282
- return /* @__PURE__ */ jsx10("div", {
220
+ const FormHint$1 = "";
221
+ const FormHint = ({
222
+ className,
223
+ children,
224
+ ...rest
225
+ }) => {
226
+ const classes = cx("Form-hint", className);
227
+ return /* @__PURE__ */ jsx("div", {
283
228
  ...rest,
284
229
  className: classes,
285
230
  children
286
231
  });
287
232
  };
288
-
289
- // src/FormField.tsx
290
- import "./styles/FormField.css";
291
- import { jsx as jsx11, jsxs as jsxs5 } from "react/jsx-runtime";
292
- var FormField = ({
233
+ const FormField$1 = "";
234
+ const FormField = ({
293
235
  isRequired,
294
236
  label,
295
237
  name,
@@ -300,74 +242,50 @@ var FormField = ({
300
242
  isInvalid,
301
243
  children,
302
244
  className,
303
- onBlur
245
+ onBlur,
246
+ "data-test-id": testId
304
247
  }) => {
305
248
  const handleBlur = () => {
306
249
  onBlur && onBlur(name);
307
250
  };
308
- return /* @__PURE__ */ jsxs5(FormGroup, {
309
- className: cx9("FormField", className),
251
+ return /* @__PURE__ */ jsxs(FormGroup, {
252
+ className: cx("FormField", className),
310
253
  name,
311
254
  ignoreValidation,
312
255
  isInvalid,
313
256
  onBlur: handleBlur,
314
- children: [
315
- label && /* @__PURE__ */ jsxs5("label", {
316
- htmlFor,
317
- children: [
318
- label,
319
- isRequired && /* @__PURE__ */ jsx11(RequiredAsterisk, {})
320
- ]
321
- }),
322
- hint && /* @__PURE__ */ jsx11(FormHint, {
323
- className: "FormField-hint",
324
- children: hint
325
- }),
326
- children,
327
- /* @__PURE__ */ jsx11(FieldError, {
328
- className: "FormField-errorMessage",
329
- name,
330
- errorMessage
331
- })
332
- ]
257
+ "data-test-id": testId,
258
+ children: [label && /* @__PURE__ */ jsxs("label", {
259
+ htmlFor,
260
+ children: [label, isRequired && /* @__PURE__ */ jsx(RequiredAsterisk, {})]
261
+ }), hint && /* @__PURE__ */ jsx(FormHint, {
262
+ className: "FormField-hint",
263
+ children: hint
264
+ }), children, /* @__PURE__ */ jsx(FieldError, {
265
+ className: "FormField-errorMessage",
266
+ name,
267
+ errorMessage
268
+ })]
333
269
  });
334
270
  };
335
-
336
- // src/IconField.tsx
337
- import { IconSize } from "@launchpad-ui/icons";
338
- import "./styles/IconField.css";
339
- import { jsx as jsx12, jsxs as jsxs6 } from "react/jsx-runtime";
340
- var IconField = ({ icon, children }) => {
271
+ const IconField$1 = "";
272
+ const IconField = ({
273
+ icon,
274
+ children,
275
+ className,
276
+ ...rest
277
+ }) => {
341
278
  const Icon = icon;
342
- return /* @__PURE__ */ jsxs6("div", {
343
- className: "IconField",
344
- children: [
345
- children,
346
- /* @__PURE__ */ jsx12(Icon, {
347
- size: IconSize.SMALL
348
- })
349
- ]
350
- });
351
- };
352
-
353
- // src/InputGroup.tsx
354
- import { cx as cx10 } from "classix";
355
- import "./styles/InputGroup.css";
356
- import { jsx as jsx13 } from "react/jsx-runtime";
357
- var InputGroup = ({ className, children, ...other }) => {
358
- const classes = cx10("InputGroup", className);
359
- return /* @__PURE__ */ jsx13("div", {
360
- ...other,
279
+ const classes = cx("IconField", className);
280
+ return /* @__PURE__ */ jsxs("div", {
361
281
  className: classes,
362
- children
282
+ ...rest,
283
+ children: [children, /* @__PURE__ */ jsx(Icon, {
284
+ size: IconSize.SMALL
285
+ })]
363
286
  });
364
287
  };
365
-
366
- // src/Radio.tsx
367
- import { cx as cx11 } from "classix";
368
- import "./styles/Form.css";
369
- import { Fragment, jsx as jsx14, jsxs as jsxs7 } from "react/jsx-runtime";
370
- var Radio = ({
288
+ const Radio = ({
371
289
  "aria-label": ariaLabel,
372
290
  "aria-labelledby": ariaLabelledby,
373
291
  checked = false,
@@ -376,76 +294,68 @@ var Radio = ({
376
294
  disabled = false,
377
295
  id,
378
296
  labelClassName,
379
- name,
380
- onChange = () => void 0,
381
297
  labelStyle,
382
- value,
383
- ...props
298
+ ...rest
384
299
  }) => {
385
300
  const hasAriaLabel = ariaLabel !== void 0 || ariaLabelledby !== void 0;
386
301
  if (!children && !hasAriaLabel) {
387
- console.warn(
388
- "If you do not provide children, you must specify an aria-label for accessibility"
389
- );
302
+ console.warn("If you do not provide children, you must specify an aria-label for accessibility");
390
303
  }
391
- return /* @__PURE__ */ jsxs7(Fragment, {
392
- children: [
393
- /* @__PURE__ */ jsx14("input", {
394
- "aria-label": ariaLabel,
395
- "aria-labelledby": ariaLabelledby,
396
- className: cx11("Form-radio", className),
397
- checked,
398
- disabled,
399
- id,
400
- name,
401
- onChange,
402
- type: "radio",
403
- value,
404
- ...props
405
- }),
406
- /* @__PURE__ */ jsx14(Label, {
407
- className: labelClassName,
408
- htmlFor: id,
409
- style: labelStyle,
410
- children: disabled ? /* @__PURE__ */ jsx14("span", {
411
- className: "Form-label--disabled",
412
- children
413
- }) : children
414
- })
415
- ]
304
+ return /* @__PURE__ */ jsxs(Fragment, {
305
+ children: [/* @__PURE__ */ jsx("input", {
306
+ ...rest,
307
+ "aria-label": ariaLabel,
308
+ "aria-labelledby": ariaLabelledby,
309
+ className: cx("Form-radio", className),
310
+ checked,
311
+ disabled,
312
+ id,
313
+ type: "radio"
314
+ }), /* @__PURE__ */ jsx(Label, {
315
+ className: labelClassName,
316
+ htmlFor: id,
317
+ style: labelStyle,
318
+ children: disabled ? /* @__PURE__ */ jsx("span", {
319
+ className: "Form-label--disabled",
320
+ children
321
+ }) : children
322
+ })]
416
323
  });
417
324
  };
418
-
419
- // src/RadioGroup.tsx
420
- import { VisuallyHidden } from "@react-aria/visually-hidden";
421
- import { Children, cloneElement, isValidElement, useRef } from "react";
422
- import "./styles/Form.css";
423
- import { jsx as jsx15, jsxs as jsxs8 } from "react/jsx-runtime";
424
- var RadioGroup = (props) => {
425
- const { name, value, onChange, children, disabled, legend, ...other } = props;
325
+ const RadioGroup = (props) => {
326
+ const {
327
+ name,
328
+ value,
329
+ onChange,
330
+ children,
331
+ disabled,
332
+ legend,
333
+ ...rest
334
+ } = props;
426
335
  const fieldsetRef = useRef(null);
427
336
  function updateRadioElems(elem) {
337
+ var _a, _b;
428
338
  if (!isValidElement(elem)) {
429
339
  return elem;
430
340
  }
431
341
  const item = elem;
432
- if (item?.type && item.type === Radio) {
342
+ if ((item == null ? void 0 : item.type) && item.type === Radio) {
433
343
  return cloneElement(item, {
434
344
  ...item.props,
435
345
  name,
436
346
  checked: item.props.value === value,
437
347
  onChange,
438
- disabled: typeof item.props?.disabled !== "undefined" ? item.props.disabled : disabled
348
+ disabled: typeof ((_a = item.props) == null ? void 0 : _a.disabled) !== "undefined" ? item.props.disabled : disabled
439
349
  });
440
350
  }
441
- if (item?.type && item.type === Label) {
351
+ if ((item == null ? void 0 : item.type) && item.type === Label) {
442
352
  return cloneElement(item, {
443
353
  ...item.props,
444
354
  onChange,
445
355
  disabled
446
356
  });
447
357
  }
448
- const elemChildren = item?.props?.children;
358
+ const elemChildren = (_b = item == null ? void 0 : item.props) == null ? void 0 : _b.children;
449
359
  if (elemChildren) {
450
360
  if (Array.isArray(elemChildren)) {
451
361
  return cloneElement(item, {
@@ -456,48 +366,40 @@ var RadioGroup = (props) => {
456
366
  children: updateRadioElems(elemChildren)
457
367
  });
458
368
  }
459
- if (item?.type && item.type !== Radio && item.type !== Label) {
369
+ if ((item == null ? void 0 : item.type) && item.type !== Radio && item.type !== Label) {
460
370
  return item;
461
371
  }
462
372
  return null;
463
373
  }
464
374
  const radios = Children.map(children, (child) => updateRadioElems(child));
465
- return /* @__PURE__ */ jsxs8("fieldset", {
375
+ return /* @__PURE__ */ jsxs("fieldset", {
466
376
  ref: fieldsetRef,
467
- children: [
468
- legend && /* @__PURE__ */ jsx15("legend", {
469
- children: /* @__PURE__ */ jsx15(VisuallyHidden, {
470
- children: legend
471
- })
472
- }),
473
- /* @__PURE__ */ jsx15("div", {
474
- ...other,
475
- children: radios
377
+ children: [legend && /* @__PURE__ */ jsx("legend", {
378
+ children: /* @__PURE__ */ jsx(VisuallyHidden, {
379
+ children: legend
476
380
  })
477
- ]
381
+ }), /* @__PURE__ */ jsx("div", {
382
+ ...rest,
383
+ children: radios
384
+ })]
478
385
  });
479
386
  };
480
-
481
- // src/Select.tsx
482
- import { cx as cx12 } from "classix";
483
- import "./styles/FormInput.css";
484
- import { jsx as jsx16 } from "react/jsx-runtime";
485
- var Select = ({ className, children, testId, ...rest }) => {
486
- const classes = cx12("FormInput", "FormInput-select", className);
487
- return /* @__PURE__ */ jsx16("select", {
387
+ const Select = ({
388
+ className,
389
+ children,
390
+ ...rest
391
+ }) => {
392
+ const classes = cx("FormInput", "FormInput-select", className);
393
+ return /* @__PURE__ */ jsx("select", {
488
394
  ...rest,
489
395
  className: classes,
490
- "data-test-id": testId,
491
396
  children
492
397
  });
493
398
  };
494
-
495
- // src/TextArea.tsx
496
- import { cx as cx13 } from "classix";
497
- import { forwardRef as forwardRef4 } from "react";
498
- import "./styles/FormInput.css";
499
- import { jsx as jsx17 } from "react/jsx-runtime";
500
- var TextArea = forwardRef4(({ className, ...props }, ref) => {
399
+ const TextArea = forwardRef(({
400
+ className,
401
+ ...props
402
+ }, ref) => {
501
403
  const onKeyDown = (e) => {
502
404
  if (e.key === "ArrowRight" || e.key === "ArrowDown" || e.key === "ArrowUp" || e.key === "ArrowLeft") {
503
405
  e.stopPropagation();
@@ -506,9 +408,9 @@ var TextArea = forwardRef4(({ className, ...props }, ref) => {
506
408
  e.nativeEvent.stopImmediatePropagation();
507
409
  }
508
410
  };
509
- return /* @__PURE__ */ jsx17("textarea", {
411
+ return /* @__PURE__ */ jsx("textarea", {
510
412
  ...props,
511
- className: cx13("FormInput", className),
413
+ className: cx("FormInput", className),
512
414
  ref,
513
415
  "aria-describedby": props["aria-describedby"] || createFieldErrorId(props.id),
514
416
  onKeyDown
@@ -525,7 +427,6 @@ export {
525
427
  FormGroup,
526
428
  FormHint,
527
429
  IconField,
528
- InputGroup,
529
430
  Label,
530
431
  Radio,
531
432
  RadioGroup,