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