@uipath/apollo-wind 2.50.0 → 2.51.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 (43) hide show
  1. package/dist/components/forms/field-renderer.cjs +80 -6
  2. package/dist/components/forms/field-renderer.js +80 -6
  3. package/dist/components/forms/form-designer.cjs +10 -10
  4. package/dist/components/forms/form-designer.js +10 -10
  5. package/dist/components/forms/form-schema.d.ts +38 -2
  6. package/dist/components/forms/index.cjs +15 -5
  7. package/dist/components/forms/index.d.ts +7 -6
  8. package/dist/components/forms/index.js +6 -5
  9. package/dist/components/forms/metadata-form.cjs +97 -37
  10. package/dist/components/forms/metadata-form.d.ts +11 -3
  11. package/dist/components/forms/metadata-form.js +94 -37
  12. package/dist/components/forms/rules-engine.cjs +14 -3
  13. package/dist/components/forms/rules-engine.d.ts +16 -0
  14. package/dist/components/forms/rules-engine.js +14 -3
  15. package/dist/components/forms/schema-serializer.cjs +10 -0
  16. package/dist/components/forms/schema-serializer.js +10 -0
  17. package/dist/components/forms/string-list-field.cjs +154 -0
  18. package/dist/components/forms/string-list-field.d.ts +29 -0
  19. package/dist/components/forms/string-list-field.js +117 -0
  20. package/dist/components/forms/validation-converter.cjs +68 -23
  21. package/dist/components/forms/validation-converter.d.ts +23 -2
  22. package/dist/components/forms/validation-converter.js +64 -22
  23. package/dist/components/ui/datetime-picker.cjs +3 -1
  24. package/dist/components/ui/datetime-picker.d.ts +4 -0
  25. package/dist/components/ui/datetime-picker.js +3 -1
  26. package/dist/components/ui/form-field.cjs +17 -2
  27. package/dist/components/ui/form-field.d.ts +7 -0
  28. package/dist/components/ui/form-field.js +17 -2
  29. package/dist/components/ui/index.cjs +127 -117
  30. package/dist/components/ui/index.d.ts +3 -2
  31. package/dist/components/ui/index.js +2 -1
  32. package/dist/components/ui/info-tooltip.cjs +61 -0
  33. package/dist/components/ui/info-tooltip.d.ts +10 -0
  34. package/dist/components/ui/info-tooltip.js +27 -0
  35. package/dist/components/ui/select.cjs +1 -1
  36. package/dist/components/ui/select.js +1 -1
  37. package/dist/components/ui/textarea.cjs +1 -1
  38. package/dist/components/ui/textarea.js +1 -1
  39. package/dist/index.cjs +14 -0
  40. package/dist/index.d.ts +7 -2
  41. package/dist/index.js +4 -2
  42. package/dist/styles.css +13 -0
  43. package/package.json +1 -1
package/dist/components/forms/field-renderer.cjs CHANGED
@@ -46,6 +46,7 @@ const index_cjs_namespaceObject = require("../../lib/index.cjs");
46
46
  const external_data_fetcher_cjs_namespaceObject = require("./data-fetcher.cjs");
47
47
  const external_form_schema_cjs_namespaceObject = require("./form-schema.cjs");
48
48
  const external_rules_engine_cjs_namespaceObject = require("./rules-engine.cjs");
49
+ const external_string_list_field_cjs_namespaceObject = require("./string-list-field.cjs");
49
50
  function FormFieldRenderer({ field, context, customComponents, disabled: formDisabled = false }) {
50
51
  const { control, watch, getValues } = (0, external_react_hook_form_namespaceObject.useFormContext)();
51
52
  const contextRef = (0, external_react_namespaceObject.useRef)(context);
@@ -187,7 +188,7 @@ function FormFieldRenderer({ field, context, customComponents, disabled: formDis
187
188
  name: field.name,
188
189
  control: control,
189
190
  defaultValue: field.defaultValue,
190
- render: ({ field: formField, fieldState: { error } })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CustomComponent, {
191
+ render: ({ field: { ref: _ref, ...formField }, fieldState: { error } })=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(CustomComponent, {
191
192
  ...formField,
192
193
  ...field.componentProps,
193
194
  field: field,
@@ -222,10 +223,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
222
223
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
223
224
  children: [
224
225
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
226
+ htmlFor: field.name,
225
227
  required: required,
228
+ tooltip: field.tooltip,
229
+ tooltipAriaLabel: field.tooltipAriaLabel,
226
230
  children: field.label
227
231
  }),
228
232
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_cjs_namespaceObject.Input, {
233
+ id: field.name,
229
234
  value: formField.value,
230
235
  onChange: (e)=>formField.onChange(e.target.value),
231
236
  onBlur: formField.onBlur,
@@ -234,6 +239,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
234
239
  type: field.type,
235
240
  placeholder: field.placeholder,
236
241
  disabled: disabled,
242
+ "aria-invalid": error ? true : void 0,
237
243
  "aria-label": field.ariaLabel
238
244
  }),
239
245
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
@@ -248,10 +254,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
248
254
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
249
255
  children: [
250
256
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
257
+ htmlFor: field.name,
251
258
  required: required,
259
+ tooltip: field.tooltip,
260
+ tooltipAriaLabel: field.tooltipAriaLabel,
252
261
  children: field.label
253
262
  }),
254
263
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(input_cjs_namespaceObject.Input, {
264
+ id: field.name,
255
265
  value: formField.value,
256
266
  onBlur: formField.onBlur,
257
267
  name: formField.name,
@@ -262,6 +272,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
262
272
  step: field.step,
263
273
  placeholder: field.placeholder,
264
274
  disabled: disabled,
275
+ "aria-invalid": error ? true : void 0,
265
276
  onChange: (e)=>formField.onChange(parseFloat(e.target.value))
266
277
  }),
267
278
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
@@ -276,10 +287,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
276
287
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
277
288
  children: [
278
289
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
290
+ htmlFor: field.name,
279
291
  required: required,
292
+ tooltip: field.tooltip,
293
+ tooltipAriaLabel: field.tooltipAriaLabel,
280
294
  children: field.label
281
295
  }),
282
296
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(textarea_cjs_namespaceObject.Textarea, {
297
+ id: field.name,
283
298
  value: formField.value,
284
299
  onChange: (e)=>formField.onChange(e.target.value),
285
300
  onBlur: formField.onBlur,
@@ -287,7 +302,13 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
287
302
  ref: formField.ref,
288
303
  placeholder: field.placeholder,
289
304
  disabled: disabled,
290
- rows: field.rows || 4
305
+ maxLength: field.maxLength,
306
+ "aria-invalid": error ? true : void 0,
307
+ ...null != field.minRows ? {
308
+ minRows: field.minRows
309
+ } : {
310
+ rows: field.rows || 4
311
+ }
291
312
  }),
292
313
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
293
314
  children: field.description
@@ -301,7 +322,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
301
322
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
302
323
  children: [
303
324
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
325
+ htmlFor: field.name,
304
326
  required: required,
327
+ tooltip: field.tooltip,
328
+ tooltipAriaLabel: field.tooltipAriaLabel,
305
329
  children: field.label
306
330
  }),
307
331
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(select_cjs_namespaceObject.Select, {
@@ -310,7 +334,9 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
310
334
  disabled: disabled,
311
335
  children: [
312
336
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectTrigger, {
337
+ id: field.name,
313
338
  "aria-label": field.label,
339
+ "aria-invalid": error ? true : void 0,
314
340
  children: /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(select_cjs_namespaceObject.SelectValue, {
315
341
  placeholder: field.placeholder || 'Select...'
316
342
  })
@@ -336,10 +362,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
336
362
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
337
363
  children: [
338
364
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
365
+ htmlFor: field.name,
339
366
  required: required,
367
+ tooltip: field.tooltip,
368
+ tooltipAriaLabel: field.tooltipAriaLabel,
340
369
  children: field.label
341
370
  }),
342
371
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(multi_select_cjs_namespaceObject.MultiSelect, {
372
+ id: field.name,
343
373
  selected: formField.value || [],
344
374
  onChange: formField.onChange,
345
375
  options: options.map((opt)=>({
@@ -348,9 +378,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
348
378
  })),
349
379
  disabled: disabled,
350
380
  placeholder: field.placeholder || 'Select items...',
351
- emptyMessage: "No items found.",
352
- searchPlaceholder: "Search...",
353
- maxSelected: field.maxSelected
381
+ emptyMessage: field.emptyMessage ?? 'No items found.',
382
+ searchPlaceholder: field.searchPlaceholder ?? 'Search...',
383
+ maxSelected: field.maxSelected,
384
+ "aria-invalid": error ? true : void 0
354
385
  }),
355
386
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
356
387
  children: field.description
@@ -370,6 +401,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
370
401
  checked: true === formField.value,
371
402
  onCheckedChange: (checked)=>formField.onChange(true === checked),
372
403
  disabled: disabled,
404
+ "aria-invalid": error ? true : void 0,
373
405
  id: field.name
374
406
  }),
375
407
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
@@ -377,6 +409,8 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
377
409
  children: [
378
410
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
379
411
  htmlFor: field.name,
412
+ tooltip: field.tooltip,
413
+ tooltipAriaLabel: field.tooltipAriaLabel,
380
414
  className: "font-normal",
381
415
  children: field.label
382
416
  }),
@@ -402,6 +436,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
402
436
  className: "space-y-0.5",
403
437
  children: [
404
438
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
439
+ htmlFor: field.name,
440
+ required: required,
441
+ tooltip: field.tooltip,
442
+ tooltipAriaLabel: field.tooltipAriaLabel,
405
443
  children: field.label
406
444
  }),
407
445
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldDescription, {
@@ -410,9 +448,11 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
410
448
  ]
411
449
  }),
412
450
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(switch_cjs_namespaceObject.Switch, {
451
+ id: field.name,
413
452
  checked: true === formField.value,
414
453
  onCheckedChange: (checked)=>formField.onChange(true === checked),
415
- disabled: disabled
454
+ disabled: disabled,
455
+ "aria-invalid": error ? true : void 0
416
456
  })
417
457
  ]
418
458
  }),
@@ -425,13 +465,18 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
425
465
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
426
466
  children: [
427
467
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
468
+ id: `${field.name}-label`,
428
469
  required: required,
470
+ tooltip: field.tooltip,
471
+ tooltipAriaLabel: field.tooltipAriaLabel,
429
472
  children: field.label
430
473
  }),
431
474
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(radio_group_cjs_namespaceObject.RadioGroup, {
475
+ "aria-labelledby": `${field.name}-label`,
432
476
  value: formField.value,
433
477
  onValueChange: formField.onChange,
434
478
  disabled: disabled,
479
+ "aria-invalid": error ? true : void 0,
435
480
  children: options.map((option)=>/*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
436
481
  className: "flex items-center space-x-2",
437
482
  children: [
@@ -469,6 +514,8 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
469
514
  children: [
470
515
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
471
516
  required: required,
517
+ tooltip: field.tooltip,
518
+ tooltipAriaLabel: field.tooltipAriaLabel,
472
519
  children: field.label
473
520
  }),
474
521
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(date_picker_cjs_namespaceObject.DatePicker, {
@@ -489,10 +536,15 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
489
536
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
490
537
  children: [
491
538
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
539
+ id: `${field.name}-label`,
492
540
  required: required,
541
+ tooltip: field.tooltip,
542
+ tooltipAriaLabel: field.tooltipAriaLabel,
493
543
  children: field.label
494
544
  }),
495
545
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(datetime_picker_cjs_namespaceObject.DateTimePicker, {
546
+ "aria-labelledby": `${field.name}-label`,
547
+ "aria-invalid": error ? true : void 0,
496
548
  value: formField.value,
497
549
  onValueChange: formField.onChange,
498
550
  disabled: disabled,
@@ -511,10 +563,16 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
511
563
  return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(form_field_cjs_namespaceObject.FormField, {
512
564
  children: [
513
565
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
566
+ htmlFor: field.name,
514
567
  required: required,
568
+ tooltip: field.tooltip,
569
+ tooltipAriaLabel: field.tooltipAriaLabel,
515
570
  children: field.label
516
571
  }),
517
572
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(file_upload_cjs_namespaceObject.FileUpload, {
573
+ id: field.name,
574
+ ariaLabel: field.ariaLabel ?? field.label,
575
+ "aria-invalid": error ? true : void 0,
518
576
  accept: field.accept,
519
577
  multiple: field.multiple,
520
578
  disabled: disabled,
@@ -532,6 +590,17 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
532
590
  })
533
591
  ]
534
592
  });
593
+ case 'string-list':
594
+ return /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_string_list_field_cjs_namespaceObject.StringListField, {
595
+ field: field,
596
+ inputRef: formField.ref,
597
+ value: formField.value,
598
+ onChange: formField.onChange,
599
+ onBlur: formField.onBlur,
600
+ error: error,
601
+ disabled: disabled,
602
+ required: required
603
+ });
535
604
  default:
536
605
  return null;
537
606
  }
@@ -562,7 +631,10 @@ function SliderField({ field, formField, error, disabled, required }) {
562
631
  className: "flex justify-between",
563
632
  children: [
564
633
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(form_field_cjs_namespaceObject.FormFieldLabel, {
634
+ id: `${field.name}-label`,
565
635
  required: required,
636
+ tooltip: field.tooltip,
637
+ tooltipAriaLabel: field.tooltipAriaLabel,
566
638
  children: field.label
567
639
  }),
568
640
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("span", {
@@ -572,6 +644,8 @@ function SliderField({ field, formField, error, disabled, required }) {
572
644
  ]
573
645
  }),
574
646
  /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(slider_cjs_namespaceObject.Slider, {
647
+ "aria-labelledby": `${field.name}-label`,
648
+ "aria-invalid": error ? true : void 0,
575
649
  value: [
576
650
  displayValue ?? field.min ?? 0
577
651
  ],
package/dist/components/forms/field-renderer.js CHANGED
@@ -18,6 +18,7 @@ import { deepEqual } from "../../lib/index.js";
18
18
  import { DataFetcher } from "./data-fetcher.js";
19
19
  import { hasOptions, isCustomField } from "./form-schema.js";
20
20
  import { RulesEngine } from "./rules-engine.js";
21
+ import { StringListField } from "./string-list-field.js";
21
22
  function FormFieldRenderer({ field, context, customComponents, disabled: formDisabled = false }) {
22
23
  const { control, watch, getValues } = useFormContext();
23
24
  const contextRef = useRef(context);
@@ -159,7 +160,7 @@ function FormFieldRenderer({ field, context, customComponents, disabled: formDis
159
160
  name: field.name,
160
161
  control: control,
161
162
  defaultValue: field.defaultValue,
162
- render: ({ field: formField, fieldState: { error } })=>/*#__PURE__*/ jsx(CustomComponent, {
163
+ render: ({ field: { ref: _ref, ...formField }, fieldState: { error } })=>/*#__PURE__*/ jsx(CustomComponent, {
163
164
  ...formField,
164
165
  ...field.componentProps,
165
166
  field: field,
@@ -194,10 +195,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
194
195
  return /*#__PURE__*/ jsxs(FormField, {
195
196
  children: [
196
197
  /*#__PURE__*/ jsx(FormFieldLabel, {
198
+ htmlFor: field.name,
197
199
  required: required,
200
+ tooltip: field.tooltip,
201
+ tooltipAriaLabel: field.tooltipAriaLabel,
198
202
  children: field.label
199
203
  }),
200
204
  /*#__PURE__*/ jsx(Input, {
205
+ id: field.name,
201
206
  value: formField.value,
202
207
  onChange: (e)=>formField.onChange(e.target.value),
203
208
  onBlur: formField.onBlur,
@@ -206,6 +211,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
206
211
  type: field.type,
207
212
  placeholder: field.placeholder,
208
213
  disabled: disabled,
214
+ "aria-invalid": error ? true : void 0,
209
215
  "aria-label": field.ariaLabel
210
216
  }),
211
217
  /*#__PURE__*/ jsx(FormFieldDescription, {
@@ -220,10 +226,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
220
226
  return /*#__PURE__*/ jsxs(FormField, {
221
227
  children: [
222
228
  /*#__PURE__*/ jsx(FormFieldLabel, {
229
+ htmlFor: field.name,
223
230
  required: required,
231
+ tooltip: field.tooltip,
232
+ tooltipAriaLabel: field.tooltipAriaLabel,
224
233
  children: field.label
225
234
  }),
226
235
  /*#__PURE__*/ jsx(Input, {
236
+ id: field.name,
227
237
  value: formField.value,
228
238
  onBlur: formField.onBlur,
229
239
  name: formField.name,
@@ -234,6 +244,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
234
244
  step: field.step,
235
245
  placeholder: field.placeholder,
236
246
  disabled: disabled,
247
+ "aria-invalid": error ? true : void 0,
237
248
  onChange: (e)=>formField.onChange(parseFloat(e.target.value))
238
249
  }),
239
250
  /*#__PURE__*/ jsx(FormFieldDescription, {
@@ -248,10 +259,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
248
259
  return /*#__PURE__*/ jsxs(FormField, {
249
260
  children: [
250
261
  /*#__PURE__*/ jsx(FormFieldLabel, {
262
+ htmlFor: field.name,
251
263
  required: required,
264
+ tooltip: field.tooltip,
265
+ tooltipAriaLabel: field.tooltipAriaLabel,
252
266
  children: field.label
253
267
  }),
254
268
  /*#__PURE__*/ jsx(Textarea, {
269
+ id: field.name,
255
270
  value: formField.value,
256
271
  onChange: (e)=>formField.onChange(e.target.value),
257
272
  onBlur: formField.onBlur,
@@ -259,7 +274,13 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
259
274
  ref: formField.ref,
260
275
  placeholder: field.placeholder,
261
276
  disabled: disabled,
262
- rows: field.rows || 4
277
+ maxLength: field.maxLength,
278
+ "aria-invalid": error ? true : void 0,
279
+ ...null != field.minRows ? {
280
+ minRows: field.minRows
281
+ } : {
282
+ rows: field.rows || 4
283
+ }
263
284
  }),
264
285
  /*#__PURE__*/ jsx(FormFieldDescription, {
265
286
  children: field.description
@@ -273,7 +294,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
273
294
  return /*#__PURE__*/ jsxs(FormField, {
274
295
  children: [
275
296
  /*#__PURE__*/ jsx(FormFieldLabel, {
297
+ htmlFor: field.name,
276
298
  required: required,
299
+ tooltip: field.tooltip,
300
+ tooltipAriaLabel: field.tooltipAriaLabel,
277
301
  children: field.label
278
302
  }),
279
303
  /*#__PURE__*/ jsxs(Select, {
@@ -282,7 +306,9 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
282
306
  disabled: disabled,
283
307
  children: [
284
308
  /*#__PURE__*/ jsx(SelectTrigger, {
309
+ id: field.name,
285
310
  "aria-label": field.label,
311
+ "aria-invalid": error ? true : void 0,
286
312
  children: /*#__PURE__*/ jsx(SelectValue, {
287
313
  placeholder: field.placeholder || 'Select...'
288
314
  })
@@ -308,10 +334,14 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
308
334
  return /*#__PURE__*/ jsxs(FormField, {
309
335
  children: [
310
336
  /*#__PURE__*/ jsx(FormFieldLabel, {
337
+ htmlFor: field.name,
311
338
  required: required,
339
+ tooltip: field.tooltip,
340
+ tooltipAriaLabel: field.tooltipAriaLabel,
312
341
  children: field.label
313
342
  }),
314
343
  /*#__PURE__*/ jsx(MultiSelect, {
344
+ id: field.name,
315
345
  selected: formField.value || [],
316
346
  onChange: formField.onChange,
317
347
  options: options.map((opt)=>({
@@ -320,9 +350,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
320
350
  })),
321
351
  disabled: disabled,
322
352
  placeholder: field.placeholder || 'Select items...',
323
- emptyMessage: "No items found.",
324
- searchPlaceholder: "Search...",
325
- maxSelected: field.maxSelected
353
+ emptyMessage: field.emptyMessage ?? 'No items found.',
354
+ searchPlaceholder: field.searchPlaceholder ?? 'Search...',
355
+ maxSelected: field.maxSelected,
356
+ "aria-invalid": error ? true : void 0
326
357
  }),
327
358
  /*#__PURE__*/ jsx(FormFieldDescription, {
328
359
  children: field.description
@@ -342,6 +373,7 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
342
373
  checked: true === formField.value,
343
374
  onCheckedChange: (checked)=>formField.onChange(true === checked),
344
375
  disabled: disabled,
376
+ "aria-invalid": error ? true : void 0,
345
377
  id: field.name
346
378
  }),
347
379
  /*#__PURE__*/ jsxs("div", {
@@ -349,6 +381,8 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
349
381
  children: [
350
382
  /*#__PURE__*/ jsx(FormFieldLabel, {
351
383
  htmlFor: field.name,
384
+ tooltip: field.tooltip,
385
+ tooltipAriaLabel: field.tooltipAriaLabel,
352
386
  className: "font-normal",
353
387
  children: field.label
354
388
  }),
@@ -374,6 +408,10 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
374
408
  className: "space-y-0.5",
375
409
  children: [
376
410
  /*#__PURE__*/ jsx(FormFieldLabel, {
411
+ htmlFor: field.name,
412
+ required: required,
413
+ tooltip: field.tooltip,
414
+ tooltipAriaLabel: field.tooltipAriaLabel,
377
415
  children: field.label
378
416
  }),
379
417
  /*#__PURE__*/ jsx(FormFieldDescription, {
@@ -382,9 +420,11 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
382
420
  ]
383
421
  }),
384
422
  /*#__PURE__*/ jsx(Switch, {
423
+ id: field.name,
385
424
  checked: true === formField.value,
386
425
  onCheckedChange: (checked)=>formField.onChange(true === checked),
387
- disabled: disabled
426
+ disabled: disabled,
427
+ "aria-invalid": error ? true : void 0
388
428
  })
389
429
  ]
390
430
  }),
@@ -397,13 +437,18 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
397
437
  return /*#__PURE__*/ jsxs(FormField, {
398
438
  children: [
399
439
  /*#__PURE__*/ jsx(FormFieldLabel, {
440
+ id: `${field.name}-label`,
400
441
  required: required,
442
+ tooltip: field.tooltip,
443
+ tooltipAriaLabel: field.tooltipAriaLabel,
401
444
  children: field.label
402
445
  }),
403
446
  /*#__PURE__*/ jsx(RadioGroup, {
447
+ "aria-labelledby": `${field.name}-label`,
404
448
  value: formField.value,
405
449
  onValueChange: formField.onChange,
406
450
  disabled: disabled,
451
+ "aria-invalid": error ? true : void 0,
407
452
  children: options.map((option)=>/*#__PURE__*/ jsxs("div", {
408
453
  className: "flex items-center space-x-2",
409
454
  children: [
@@ -441,6 +486,8 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
441
486
  children: [
442
487
  /*#__PURE__*/ jsx(FormFieldLabel, {
443
488
  required: required,
489
+ tooltip: field.tooltip,
490
+ tooltipAriaLabel: field.tooltipAriaLabel,
444
491
  children: field.label
445
492
  }),
446
493
  /*#__PURE__*/ jsx(DatePicker, {
@@ -461,10 +508,15 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
461
508
  return /*#__PURE__*/ jsxs(FormField, {
462
509
  children: [
463
510
  /*#__PURE__*/ jsx(FormFieldLabel, {
511
+ id: `${field.name}-label`,
464
512
  required: required,
513
+ tooltip: field.tooltip,
514
+ tooltipAriaLabel: field.tooltipAriaLabel,
465
515
  children: field.label
466
516
  }),
467
517
  /*#__PURE__*/ jsx(DateTimePicker, {
518
+ "aria-labelledby": `${field.name}-label`,
519
+ "aria-invalid": error ? true : void 0,
468
520
  value: formField.value,
469
521
  onValueChange: formField.onChange,
470
522
  disabled: disabled,
@@ -483,10 +535,16 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
483
535
  return /*#__PURE__*/ jsxs(FormField, {
484
536
  children: [
485
537
  /*#__PURE__*/ jsx(FormFieldLabel, {
538
+ htmlFor: field.name,
486
539
  required: required,
540
+ tooltip: field.tooltip,
541
+ tooltipAriaLabel: field.tooltipAriaLabel,
487
542
  children: field.label
488
543
  }),
489
544
  /*#__PURE__*/ jsx(FileUpload, {
545
+ id: field.name,
546
+ ariaLabel: field.ariaLabel ?? field.label,
547
+ "aria-invalid": error ? true : void 0,
490
548
  accept: field.accept,
491
549
  multiple: field.multiple,
492
550
  disabled: disabled,
@@ -504,6 +562,17 @@ function FieldByType({ field, formField, error, disabled, required, options }) {
504
562
  })
505
563
  ]
506
564
  });
565
+ case 'string-list':
566
+ return /*#__PURE__*/ jsx(StringListField, {
567
+ field: field,
568
+ inputRef: formField.ref,
569
+ value: formField.value,
570
+ onChange: formField.onChange,
571
+ onBlur: formField.onBlur,
572
+ error: error,
573
+ disabled: disabled,
574
+ required: required
575
+ });
507
576
  default:
508
577
  return null;
509
578
  }
@@ -534,7 +603,10 @@ function SliderField({ field, formField, error, disabled, required }) {
534
603
  className: "flex justify-between",
535
604
  children: [
536
605
  /*#__PURE__*/ jsx(FormFieldLabel, {
606
+ id: `${field.name}-label`,
537
607
  required: required,
608
+ tooltip: field.tooltip,
609
+ tooltipAriaLabel: field.tooltipAriaLabel,
538
610
  children: field.label
539
611
  }),
540
612
  /*#__PURE__*/ jsx("span", {
@@ -544,6 +616,8 @@ function SliderField({ field, formField, error, disabled, required }) {
544
616
  ]
545
617
  }),
546
618
  /*#__PURE__*/ jsx(Slider, {
619
+ "aria-labelledby": `${field.name}-label`,
620
+ "aria-invalid": error ? true : void 0,
547
621
  value: [
548
622
  displayValue ?? field.min ?? 0
549
623
  ],
package/dist/components/forms/form-designer.cjs CHANGED
@@ -27,22 +27,22 @@ __webpack_require__.d(__webpack_exports__, {
27
27
  FormDesigner: ()=>FormDesigner
28
28
  });
29
29
  const jsx_runtime_namespaceObject = require("react/jsx-runtime");
30
+ const external_lucide_react_namespaceObject = require("lucide-react");
30
31
  const external_react_namespaceObject = require("react");
31
- const external_schema_serializer_cjs_namespaceObject = require("./schema-serializer.cjs");
32
- const external_metadata_form_cjs_namespaceObject = require("./metadata-form.cjs");
32
+ const accordion_cjs_namespaceObject = require("../ui/accordion.cjs");
33
33
  const button_cjs_namespaceObject = require("../ui/button.cjs");
34
+ const card_cjs_namespaceObject = require("../ui/card.cjs");
35
+ const checkbox_cjs_namespaceObject = require("../ui/checkbox.cjs");
34
36
  const input_cjs_namespaceObject = require("../ui/input.cjs");
35
37
  const label_cjs_namespaceObject = require("../ui/label.cjs");
36
- const textarea_cjs_namespaceObject = require("../ui/textarea.cjs");
38
+ const grid_cjs_namespaceObject = require("../ui/layout/grid.cjs");
37
39
  const select_cjs_namespaceObject = require("../ui/select.cjs");
38
- const card_cjs_namespaceObject = require("../ui/card.cjs");
39
- const tabs_cjs_namespaceObject = require("../ui/tabs.cjs");
40
- const checkbox_cjs_namespaceObject = require("../ui/checkbox.cjs");
41
- const switch_cjs_namespaceObject = require("../ui/switch.cjs");
42
- const external_lucide_react_namespaceObject = require("lucide-react");
43
40
  const separator_cjs_namespaceObject = require("../ui/separator.cjs");
44
- const accordion_cjs_namespaceObject = require("../ui/accordion.cjs");
45
- const grid_cjs_namespaceObject = require("../ui/layout/grid.cjs");
41
+ const switch_cjs_namespaceObject = require("../ui/switch.cjs");
42
+ const tabs_cjs_namespaceObject = require("../ui/tabs.cjs");
43
+ const textarea_cjs_namespaceObject = require("../ui/textarea.cjs");
44
+ const external_metadata_form_cjs_namespaceObject = require("./metadata-form.cjs");
45
+ const external_schema_serializer_cjs_namespaceObject = require("./schema-serializer.cjs");
46
46
  const FIELD_TYPE_METADATA = [
47
47
  {
48
48
  value: 'text',
package/dist/components/forms/form-designer.js CHANGED
@@ -1,20 +1,20 @@
1
1
  import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { AlertTriangle, Asterisk, Ban, ChevronRight, Code, Database, Eye, EyeOff, GitBranch, GripVertical, Layers, MoveDown, MoveUp, Plus, Settings, Trash2, View } from "lucide-react";
2
3
  import { useEffect, useMemo, useState } from "react";
3
- import { schemaToJson } from "./schema-serializer.js";
4
- import { MetadataForm } from "./metadata-form.js";
4
+ import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../ui/accordion.js";
5
5
  import { Button } from "../ui/button.js";
6
+ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../ui/card.js";
7
+ import { Checkbox } from "../ui/checkbox.js";
6
8
  import { Input } from "../ui/input.js";
7
9
  import { Label, RequiredIndicator } from "../ui/label.js";
8
- import { Textarea } from "../ui/textarea.js";
10
+ import { Grid } from "../ui/layout/grid.js";
9
11
  import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../ui/select.js";
10
- import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "../ui/card.js";
11
- import { Tabs, TabsContent, TabsList, TabsTrigger } from "../ui/tabs.js";
12
- import { Checkbox } from "../ui/checkbox.js";
13
- import { Switch } from "../ui/switch.js";
14
- import { AlertTriangle, Asterisk, Ban, ChevronRight, Code, Database, Eye, EyeOff, GitBranch, GripVertical, Layers, MoveDown, MoveUp, Plus, Settings, Trash2, View } from "lucide-react";
15
12
  import { Separator } from "../ui/separator.js";
16
- import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "../ui/accordion.js";
17
- import { Grid } from "../ui/layout/grid.js";
13
+ import { Switch } from "../ui/switch.js";
14
+ import { Tabs, TabsContent, TabsList, TabsTrigger } from "../ui/tabs.js";
15
+ import { Textarea } from "../ui/textarea.js";
16
+ import { MetadataForm } from "./metadata-form.js";
17
+ import { schemaToJson } from "./schema-serializer.js";
18
18
  const FIELD_TYPE_METADATA = [
19
19
  {
20
20
  value: 'text',