@ilo-org/twig 0.9.4 → 0.10.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 (76) hide show
  1. package/.turbo/turbo-build:lib.log +2 -2
  2. package/CHANGELOG.md +24 -0
  3. package/package.json +3 -3
  4. package/src/patterns/components/accordion/accordion.wingsuit.yml +1 -0
  5. package/src/patterns/components/breadcrumb/breadcrumb.wingsuit.yml +1 -0
  6. package/src/patterns/components/button/button.wingsuit.yml +1 -0
  7. package/src/patterns/components/callout/callout.wingsuit.yml +1 -0
  8. package/src/patterns/components/card/card.wingsuit.yml +14 -13
  9. package/src/patterns/components/card_data/card_data.wingsuit.yml +3 -7
  10. package/src/patterns/components/card_detail/card_detail.wingsuit.yml +1 -3
  11. package/src/patterns/components/card_factlist/card_factlist.wingsuit.yml +1 -4
  12. package/src/patterns/components/card_feature/card_feature.wingsuit.yml +1 -3
  13. package/src/patterns/components/card_multilink/card_multilink.wingsuit.yml +7 -9
  14. package/src/patterns/components/card_promo/card_promo.wingsuit.yml +1 -3
  15. package/src/patterns/components/card_stat/card_stat.wingsuit.yml +1 -5
  16. package/src/patterns/components/card_text/card_text.wingsuit.yml +4 -6
  17. package/src/patterns/components/cardgroup/cardgroup.wingsuit.yml +1 -4
  18. package/src/patterns/components/{searchfield/searchfield.stories.jsx → checkbox/checkbox.stories.jsx} +1 -1
  19. package/src/patterns/components/checkbox/checkbox.twig +17 -0
  20. package/src/patterns/components/checkbox/checkbox.wingsuit.yml +83 -0
  21. package/src/patterns/components/checkbox/index.js +7 -0
  22. package/src/patterns/components/contextmenu/contextmenu.wingsuit.yml +1 -0
  23. package/src/patterns/components/datepicker/datepicker.stories.jsx +9 -0
  24. package/src/patterns/components/datepicker/datepicker.twig +20 -0
  25. package/src/patterns/components/datepicker/datepicker.wingsuit.yml +71 -0
  26. package/src/patterns/components/datepicker/index.js +7 -0
  27. package/src/patterns/components/dropdown/dropdown.twig +16 -16
  28. package/src/patterns/components/dropdown/dropdown.wingsuit.yml +80 -58
  29. package/src/patterns/components/footer/footer.wingsuit.yml +1 -0
  30. package/src/patterns/components/form/fieldset.twig +62 -0
  31. package/src/patterns/components/form/form.twig +18 -96
  32. package/src/patterns/components/form/form.wingsuit.yml +138 -967
  33. package/src/patterns/components/form/formcontrol.twig +84 -0
  34. package/src/patterns/components/form/input.twig +9 -12
  35. package/src/patterns/components/hero/hero.wingsuit.yml +40 -40
  36. package/src/patterns/components/herocard/herocard.wingsuit.yml +1 -0
  37. package/src/patterns/components/image/image.wingsuit.yml +1 -0
  38. package/src/patterns/components/link/link.wingsuit.yml +1 -0
  39. package/src/patterns/components/linklist/linklist.wingsuit.yml +1 -0
  40. package/src/patterns/components/list/list-item.wingsuit.yml +1 -0
  41. package/src/patterns/components/list/list.wingsuit.yml +1 -0
  42. package/src/patterns/components/loading/loading.wingsuit.yml +1 -0
  43. package/src/patterns/components/localnav/localnav.wingsuit.yml +1 -0
  44. package/src/patterns/components/logogrid/logogrid.wingsuit.yml +1 -2
  45. package/src/patterns/components/modal/modal.wingsuit.yml +1 -0
  46. package/src/patterns/components/navigation/navigation.js +9 -5
  47. package/src/patterns/components/navigation/navigation.twig +145 -108
  48. package/src/patterns/components/notification/notification.wingsuit.yml +1 -0
  49. package/src/patterns/components/pagination/pagination.wingsuit.yml +1 -0
  50. package/src/patterns/components/profile/profile.wingsuit.yml +1 -0
  51. package/src/patterns/components/readmore/readmore.wingsuit.yml +1 -0
  52. package/src/patterns/components/richtext/richtext.wingsuit.yml +1 -0
  53. package/src/patterns/components/search/index.js +6 -0
  54. package/src/patterns/components/search/search.stories.jsx +10 -0
  55. package/src/patterns/components/search/search.twig +22 -0
  56. package/src/patterns/components/search/search.wingsuit.yml +89 -0
  57. package/src/patterns/components/socialmedia/socialmedia.wingsuit.yml +1 -0
  58. package/src/patterns/components/table/table.wingsuit.yml +1 -0
  59. package/src/patterns/components/tableofcontents/tableofcontents.wingsuit.yml +1 -0
  60. package/src/patterns/components/tabs/tabs.wingsuit.yml +1 -0
  61. package/src/patterns/components/tags/tags.wingsuit.yml +1 -0
  62. package/src/patterns/components/textinput/index.js +7 -0
  63. package/src/patterns/components/textinput/textinput.stories.jsx +10 -0
  64. package/src/patterns/components/textinput/textinput.twig +13 -0
  65. package/src/patterns/components/textinput/textinput.wingsuit.yml +87 -0
  66. package/src/patterns/components/tooltip/tooltip.twig +9 -11
  67. package/src/patterns/components/tooltip/tooltip.wingsuit.yml +7 -0
  68. package/src/patterns/components/video/video.wingsuit.yml +1 -0
  69. package/contributing.md +0 -5
  70. package/src/patterns/components/fieldset/fieldset.twig +0 -44
  71. package/src/patterns/components/form/checkbox.twig +0 -13
  72. package/src/patterns/components/form/checkboxgroup.twig +0 -5
  73. package/src/patterns/components/form/datepicker.twig +0 -41
  74. package/src/patterns/components/searchfield/index.js +0 -6
  75. package/src/patterns/components/searchfield/searchfield.twig +0 -7
  76. package/src/patterns/components/searchfield/searchfield.wingsuit.yml +0 -22
package/src/patterns/components/form/form.wingsuit.yml CHANGED
@@ -1,980 +1,151 @@
1
1
  form:
2
+ namespace: Components/Forms
2
3
  use: "@components/form/form.twig"
3
4
  label: Form
4
- description: A component for displaying a form.
5
+ description: The Form component provides users with a complete interface that combines all of the form elements in the design system together with a some configuration options for laying them out together.
6
+ visibility: storybook
5
7
  fields:
6
- action:
7
- type: string
8
- label: action
9
- description: The form's action attribute
10
- preview: "http://www.ilo.org"
11
- required: true
12
8
  headline:
13
9
  type: string
14
10
  label: Headline
15
- description: Optional form headline
16
- preview: ""
17
- formid:
11
+ description: The title of the form
12
+ required: false
13
+ preview: Request to attend the International Labour Conference
14
+ class:
18
15
  type: string
19
- label: formid
20
- description: The form's id attribute
21
- preview: "exampleform"
22
- required: true
23
- items:
16
+ label: Form class
17
+ description: The CSS class of the form
18
+ required: false
19
+ preview: my--form--class
20
+ attributes:
24
21
  type: object
25
- label: items
26
- description: The form's fields
22
+ label: Attributes
23
+ description: A list of html attributes that you can attach to the form element
24
+ required: false
27
25
  preview:
28
- - field:
29
- label: "Text Field Label"
30
- name: "text"
31
- placeholder: "Text Field"
32
- type: "text"
33
- type: "input"
34
- - field:
35
- id: "dropdown"
36
- label: "Dropdown Label"
37
- name: "dropdown"
38
- options:
39
- - label: "Option One"
40
- value: "option one"
41
- - label: "Option Two"
42
- value: "option two"
43
- - label: "Option Three"
44
- value: "option three"
45
- - label: "Option Four"
46
- value: "four"
47
- - label: "Option Five"
48
- value: "the fifth"
49
- type: "dropdown"
50
- - field:
51
- label: "Checkbox Label"
52
- name: "checkbox"
53
- type: "checkbox"
54
- type: "checkbox"
55
- - choicegroupid: "multiplecheckboxes"
56
- field:
57
- - label: "Checkbox Label 1"
58
- grouped: true
59
- name: "checkbox1"
60
- type: "checkbox"
61
- - label: "Checkbox Label 2"
62
- grouped: true
63
- name: "checkbox2"
64
- type: "checkbox"
65
- - label: "Checkbox Label 3"
66
- grouped: true
67
- name: "checkbox3"
68
- type: "checkbox"
69
- - label: "Checkbox Label 4"
70
- grouped: true
71
- name: "checkbox4"
72
- type: "checkbox"
73
- - label: "Checkbox Label 5"
74
- grouped: true
75
- name: "checkbox5"
76
- type: "checkbox"
77
- legend: "Multiple Checkboxes"
78
- type: "checkbox"
79
- - choicegroupid: "radios"
80
- field:
81
- - label: "Radio Field Label 1"
82
- name: "radio"
83
- type: "radio"
84
- value: "radio1"
85
- - label: "Radio Field Label 2"
86
- name: "radio"
87
- type: "radio"
88
- value: "radio2"
89
- - label: "Radio Field Label 3"
90
- name: "radio"
91
- type: "radio"
92
- value: "radio3"
93
- - label: "Radio Field Label 4"
94
- name: "radio"
95
- type: "radio"
96
- value: "radio4"
97
- - label: "Radio Field Label 5"
98
- name: "radio"
99
- type: "radio"
100
- value: "radio5"
101
- grouphelper: "Helper text"
102
- legend: "Radio Group"
103
- type: "radio"
104
- - field:
105
- helper: "The file upload's helper text"
106
- label: "File Upload Field Label"
107
- name: "fileupload"
108
- placeholder: "File Upload Field"
109
- type: "file"
110
- - field:
111
- label: "Date Picker Field Label"
112
- name: "datepicker"
113
- placeholder: "MM/DD/YYYY"
114
- type: "date"
115
- - field:
116
- label: "Number Picker Field Label"
117
- name: "text"
118
- placeholder: "Number Picker Field"
119
- type: "number"
120
- - field:
121
- label: "Textarea"
122
- name: "textarea"
123
- placeholder: "Textarea"
124
- type: "textarea"
125
- - field:
126
- formgroupid: "formgroup"
127
- items:
128
- - field:
129
- label: "Text Field Label"
130
- name: "text"
131
- placeholder: "Text Field"
132
- type: "text"
133
- type: "input"
134
- - field:
135
- id: "dropdown"
136
- label: "Dropdown Label"
137
- name: "dropdown"
138
- options:
139
- - label: "Option One"
140
- value: "option one"
141
- - label: "Option Two"
142
- value: "option two"
143
- - label: "Option Three"
144
- value: "option three"
145
- - label: "Option Four"
146
- value: "four"
147
- - label: "Option Five"
148
- value: "the fifth"
149
- type: "dropdown"
150
- - field:
151
- label: "Checkbox Label"
152
- name: "checkbox"
153
- type: "checkbox"
154
- type: "checkbox"
155
- - choicegroupid: "multiplecheckboxes"
156
- field:
157
- - label: "Checkbox Label 1"
158
- grouped: true
159
- name: "checkbox1"
160
- type: "checkbox"
161
- - label: "Checkbox Label 2"
162
- grouped: true
163
- name: "checkbox2"
164
- type: "checkbox"
165
- - label: "Checkbox Label 3"
166
- grouped: true
167
- name: "checkbox3"
168
- type: "checkbox"
169
- - label: "Checkbox Label 4"
170
- grouped: true
171
- name: "checkbox4"
172
- type: "checkbox"
173
- - label: "Checkbox Label 5"
174
- grouped: true
175
- name: "checkbox5"
176
- type: "checkbox"
177
- legend: "Multiple Checkboxes"
178
- type: "checkbox"
179
- - choicegroupid: "radios2"
180
- field:
181
- - label: "Radio Field Label 1"
182
- name: "radio2"
183
- type: "radio"
184
- value: "radio1"
185
- - label: "Radio Field Label 2"
186
- name: "radio2"
187
- type: "radio"
188
- value: "radio2"
189
- - label: "Radio Field Label 3"
190
- name: "radio2"
191
- type: "radio"
192
- value: "radio3"
193
- - label: "Radio Field Label 4"
194
- name: "radio2"
195
- type: "radio"
196
- value: "radio4"
197
- - label: "Radio Field Label 5"
198
- name: "radio2"
199
- type: "radio"
200
- value: "radio5"
201
- grouphelper: "Helper text"
202
- legend: "Radio Group"
203
- type: "radio"
204
- - field:
205
- helper: "The file upload's helper text"
206
- label: "File Upload Field Label"
207
- name: "fileupload"
208
- placeholder: "File Upload Field"
209
- type: "file"
210
- - field:
211
- enddata:
212
- helper: "this is an end date range"
213
- label: "Date Picker End Field Label"
214
- name: "datepickerend"
215
- placeholder: "MM/DD/YYYY"
216
- label: "Date Picker Field Label"
217
- name: "datepicker"
218
- placeholder: "MM/DD/YYYY"
219
- range: true
220
- type: "date"
221
- - field:
222
- label: "Number Picker Field Label"
223
- name: "text"
224
- placeholder: "Number Picker Field"
225
- type: "number"
226
- - field:
227
- label: "Textarea"
228
- name: "textarea"
229
- placeholder: "Textarea"
230
- type: "textarea"
231
- legend: "Example Form Group"
232
- type: "default"
233
- type: "formgroup"
234
- submitlabel:
235
- type: string
236
- label: submitlabel
237
- description: The form's submit button label
238
- preview: "Submit"
26
+ id: my--form--id
27
+ name: my--form--name
28
+ action: https://www.ilo.org
29
+ method: post
30
+ submit:
31
+ type: object
32
+ label: Submit button
33
+ description: Options to pass to the submit button if your form has one
34
+ preview:
35
+ label: Submit your info
36
+ type: primary
37
+ size: large
38
+ kind: submit
39
+ fieldsets:
40
+ type: object
41
+ label: Fieldsets
42
+ description: A group of form fields used to group related fields together. Each fieldset can have a legend and a list of form fields with a `type` property.
239
43
  required: true
240
- variants:
241
- default:
242
- label: Default
243
- description: the default settings for the Form
244
- hastooltips:
245
- label: Has Tooltips
246
- description: the Form with Tooltips on the field labels
247
- fields:
248
- formid: "tooltipform"
249
- items:
250
- - field:
251
- label: "Text Field Label"
252
- name: "text"
253
- placeholder: "Text Field"
254
- type: "text"
255
- tooltip:
256
- label: "tooltip"
257
- icon: true
258
- theme: "dark"
259
- type: "input"
260
- - field:
261
- id: "dropdown"
262
- label: "Dropdown Label"
263
- name: "dropdown"
264
- options:
265
- - label: "Option One"
266
- value: "option one"
267
- - label: "Option Two"
268
- value: "option two"
269
- - label: "Option Three"
270
- value: "option three"
271
- - label: "Option Four"
272
- value: "four"
273
- - label: "Option Five"
274
- value: "the fifth"
275
- tooltip:
276
- label: "tooltip"
277
- icon: true
278
- theme: "dark"
279
- type: "dropdown"
280
- - field:
281
- label: "Checkbox Label"
282
- name: "checkbox"
283
- type: "checkbox"
284
- tooltip:
285
- label: "tooltip"
286
- icon: true
287
- theme: "dark"
288
- type: "checkbox"
289
- - choicegroupid: "multiplecheckboxes"
290
- field:
291
- - label: "Checkbox Label 1"
292
- grouped: true
293
- name: "checkbox1"
294
- type: "checkbox"
295
- - label: "Checkbox Label 2"
296
- grouped: true
297
- name: "checkbox2"
298
- type: "checkbox"
299
- - label: "Checkbox Label 3"
300
- grouped: true
301
- name: "checkbox3"
302
- type: "checkbox"
303
- - label: "Checkbox Label 4"
304
- grouped: true
305
- name: "checkbox4"
306
- type: "checkbox"
307
- - label: "Checkbox Label 5"
308
- grouped: true
309
- name: "checkbox5"
310
- type: "checkbox"
311
- grouptooltip:
312
- label: "tooltip"
313
- icon: true
314
- theme: "dark"
315
- legend: "Multiple Checkboxes"
316
- type: "checkbox"
317
- - choicegroupid: "radios"
318
- field:
319
- - label: "Radio Field Label 1"
320
- name: "radio"
321
- type: "radio"
322
- value: "radio1"
323
- - label: "Radio Field Label 2"
324
- name: "radio"
325
- type: "radio"
326
- value: "radio2"
327
- - label: "Radio Field Label 3"
328
- name: "radio"
329
- type: "radio"
330
- value: "radio3"
331
- - label: "Radio Field Label 4"
332
- name: "radio"
333
- type: "radio"
334
- value: "radio4"
335
- - label: "Radio Field Label 5"
336
- name: "radio"
337
- type: "radio"
338
- value: "radio5"
339
- grouptooltip:
340
- label: "tooltip"
341
- icon: true
342
- theme: "dark"
343
- legend: "Radio Group"
344
- type: "radio"
345
- - field:
346
- label: "File Upload Field Label"
347
- name: "fileupload"
348
- placeholder: "File Upload Field"
349
- tooltip:
350
- label: "tooltip"
351
- icon: true
352
- theme: "dark"
353
- type: "file"
354
- - field:
355
- label: "Date Picker Field Label"
356
- name: "datepicker"
357
- placeholder: "MM/DD/YYYY"
358
- tooltip:
359
- label: "tooltip"
360
- icon: true
361
- theme: "dark"
362
- type: "date"
363
- - field:
364
- label: "Number Picker Field Label"
365
- name: "text"
366
- placeholder: "Number Picker Field"
367
- tooltip:
368
- label: "tooltip"
369
- icon: true
370
- theme: "dark"
371
- type: "number"
372
- - field:
373
- label: "Textarea"
374
- name: "textarea"
375
- placeholder: "Textarea"
376
- tooltip:
377
- label: "tooltip"
378
- icon: true
379
- theme: "dark"
380
- type: "textarea"
381
- - field:
382
- formgroupid: "formgroup"
383
- items:
384
- - field:
385
- label: "Text Field Label"
386
- name: "text"
387
- placeholder: "Text Field"
388
- type: "text"
389
- tooltip:
390
- label: "tooltip"
391
- icon: true
392
- theme: "dark"
393
- type: "input"
394
- - field:
395
- id: "dropdown"
396
- label: "Dropdown Label"
397
- name: "dropdown"
398
- options:
399
- - label: "Option One"
400
- value: "option one"
401
- - label: "Option Two"
402
- value: "option two"
403
- - label: "Option Three"
404
- value: "option three"
405
- - label: "Option Four"
406
- value: "four"
407
- - label: "Option Five"
408
- value: "the fifth"
409
- tooltip:
410
- label: "tooltip"
411
- icon: true
412
- theme: "dark"
413
- type: "dropdown"
414
- - field:
415
- label: "Checkbox Label"
416
- name: "checkbox"
417
- type: "checkbox"
418
- tooltip:
419
- label: "tooltip"
420
- icon: true
421
- theme: "dark"
422
- type: "checkbox"
423
- - choicegroupid: "multiplecheckboxes"
424
- field:
425
- - label: "Checkbox Label 1"
426
- grouped: true
427
- name: "checkbox1"
428
- type: "checkbox"
429
- - label: "Checkbox Label 2"
430
- grouped: true
431
- name: "checkbox2"
432
- type: "checkbox"
433
- - label: "Checkbox Label 3"
434
- grouped: true
435
- name: "checkbox3"
436
- type: "checkbox"
437
- - label: "Checkbox Label 4"
438
- grouped: true
439
- name: "checkbox4"
440
- type: "checkbox"
441
- - label: "Checkbox Label 5"
442
- grouped: true
443
- name: "checkbox5"
444
- type: "checkbox"
445
- grouptooltip:
446
- label: "tooltip"
447
- icon: true
448
- theme: "dark"
449
- legend: "Multiple Checkboxes"
450
- type: "checkbox"
451
- - choicegroupid: "radios"
452
- field:
453
- - label: "Radio Field Label 1"
454
- name: "radio"
455
- type: "radio"
456
- value: "radio1"
457
- - label: "Radio Field Label 2"
458
- name: "radio"
459
- type: "radio"
460
- value: "radio2"
461
- - label: "Radio Field Label 3"
462
- name: "radio"
463
- type: "radio"
464
- value: "radio3"
465
- - label: "Radio Field Label 4"
466
- name: "radio"
467
- type: "radio"
468
- value: "radio4"
469
- - label: "Radio Field Label 5"
470
- name: "radio"
471
- type: "radio"
472
- value: "radio5"
473
- grouptooltip:
474
- label: "tooltip"
475
- icon: true
476
- theme: "dark"
477
- legend: "Radio Group"
478
- type: "radio"
479
- - field:
480
- label: "File Upload Field Label"
481
- name: "fileupload"
482
- placeholder: "File Upload Field"
483
- tooltip:
484
- label: "tooltip"
485
- icon: true
486
- theme: dark
487
- type: "file"
488
- - field:
489
- enddata:
490
- label: "Date Picker End Field Label"
491
- name: "datepickerend"
492
- placeholder: "MM/DD/YYYY"
493
- tooltip:
494
- label: "tooltip"
495
- icon: true
496
- theme: dark
497
- label: "Date Picker Field Label"
498
- name: "datepicker"
499
- placeholder: "MM/DD/YYYY"
500
- tooltip:
501
- label: "tooltip"
502
- icon: true
503
- theme: "dark"
504
- range: true
505
- type: "date"
506
- - field:
507
- label: "Number Picker Field Label"
508
- name: "text"
509
- placeholder: "Number Picker Field"
510
- tooltip:
511
- label: "tooltip"
512
- icon: true
513
- theme: "dark"
514
- type: "number"
515
- - field:
516
- label: "Textarea"
517
- name: "textarea"
518
- placeholder: "Textarea"
519
- tooltip:
520
- label: "tooltip"
521
- icon: true
522
- theme: "dark"
523
- type: "textarea"
524
- legend: "Example Form Group"
525
- type: "default"
526
- type: "formgroup"
527
- haserrors:
528
- label: Has Errors
529
- description: the Form with Errors on the fields
530
- fields:
531
- formid: "errorsform"
532
- items:
533
- - field:
534
- label: "Text Field Label"
535
- name: "text"
536
- placeholder: "Text Field"
537
- type: "text"
538
- error: "this is an error message form the server"
539
- type: "input"
540
- - field:
541
- id: "dropdown"
542
- label: "Dropdown Label"
543
- name: "dropdown"
44
+ preview:
45
+ - legend: Personal information
46
+ wrap: wrap
47
+ direction: row
48
+ style: "width: 100%"
49
+ class: my--fieldset--class
50
+ tooltip: "Your data will be stored securely"
51
+ fields:
52
+ - type: textinput
53
+ name: first-name
54
+ label: First name
55
+ placeholder: Juan
56
+ labelPlacement: top
57
+ labelSize: small
58
+ style: "flex: 1 0 49%"
59
+ class: my--formfield--class
60
+ - type: textinput
61
+ name: last-name
62
+ label: Last name
63
+ placeholder: Martinez
64
+ labelPlacement: top
65
+ labelSize: small
66
+ style: "flex: 1 0 49%"
67
+ class: my--formfield--class
68
+ - legend: What world of work topics interest you?
69
+ direction: row
70
+ fields:
71
+ - type: checkbox
72
+ name: preference-1
73
+ label: Social Justice
74
+ labelPlacement: end
75
+ labelSize: small
76
+ class: my--formfield--class
77
+ value: 1
78
+ - type: checkbox
79
+ name: preference-2
80
+ label: Decent work
81
+ labelPlacement: end
82
+ labelSize: small
83
+ class: my--formfield--class
84
+ value: 2
85
+ - type: checkbox
86
+ name: preference-3
87
+ label: Ending child labour
88
+ labelPlacement: end
89
+ labelSize: small
90
+ class: my--formfield--class
91
+ value: 3
92
+ - legend: Tell us more about you
93
+ direction: row
94
+ style: "width: 100%"
95
+ fields:
96
+ - type: dropdown
97
+ name: country
98
+ label: What country are you from?
99
+ labelPlacement: top
100
+ labelSize: small
101
+ class: my--formfield--class
102
+ style: "flex: 1 1 49%"
544
103
  options:
545
- - label: "Option One"
546
- value: "option one"
547
- - label: "Option Two"
548
- value: "option two"
549
- - label: "Option Three"
550
- value: "option three"
551
- - label: "Option Four"
552
- value: "four"
553
- - label: "Option Five"
554
- value: "the fifth"
555
- error: "this is an error message form the server"
556
- type: "dropdown"
557
- - field:
558
- label: "Checkbox Label"
559
- name: "checkbox"
560
- type: "checkbox"
561
- error: "this is an error message form the server"
562
- type: "checkbox"
563
- - choicegroupid: "multiplecheckboxes"
564
- field:
565
- - label: "Checkbox Label 1"
566
- grouped: true
567
- name: "checkbox1"
568
- type: "checkbox"
569
- - label: "Checkbox Label 2"
570
- grouped: true
571
- name: "checkbox2"
572
- type: "checkbox"
573
- - label: "Checkbox Label 3"
574
- grouped: true
575
- name: "checkbox3"
576
- type: "checkbox"
577
- - label: "Checkbox Label 4"
578
- grouped: true
579
- name: "checkbox4"
580
- type: "checkbox"
581
- - label: "Checkbox Label 5"
582
- grouped: true
583
- name: "checkbox5"
584
- type: "checkbox"
585
- legend: "Multiple Checkboxes"
586
- type: "checkbox"
587
- grouperror: "this is an error message form the server"
588
- - choicegroupid: "radios"
589
- field:
590
- - label: "Radio Field Label 1"
591
- name: "radio"
592
- type: "radio"
593
- value: "radio1"
594
- - label: "Radio Field Label 2"
595
- name: "radio"
596
- type: "radio"
597
- value: "radio2"
598
- - label: "Radio Field Label 3"
599
- name: "radio"
600
- type: "radio"
601
- value: "radio3"
602
- - label: "Radio Field Label 4"
603
- name: "radio"
604
- type: "radio"
605
- value: "radio4"
606
- - label: "Radio Field Label 5"
607
- name: "radio"
608
- type: "radio"
609
- value: "radio5"
610
- grouperror: "this is an error message form the server"
611
- legend: "Radio Group"
612
- type: "radio"
613
- - field:
614
- helper: "The file upload's helper text"
615
- label: "File Upload Field Label"
616
- name: "fileupload"
617
- placeholder: "File Upload Field"
618
- error: "this is an error message form the server"
619
- type: "file"
620
- - field:
621
- label: "Date Picker Field Label"
622
- name: "datepicker"
623
- placeholder: "MM/DD/YYYY"
624
- error: "this is an error message form the server"
625
- type: "date"
626
- - field:
627
- label: "Number Picker Field Label"
628
- name: "text"
629
- placeholder: "Number Picker Field"
630
- error: "this is an error message form the server"
631
- type: "number"
632
- - field:
633
- label: "Textarea"
634
- name: "textarea"
635
- placeholder: "Textarea"
636
- error: "this is an error message form the server"
637
- type: "textarea"
638
- - field:
639
- formgroupid: "formgroup"
640
- items:
641
- - field:
642
- label: "Text Field Label"
643
- name: "text"
644
- placeholder: "Text Field"
645
- type: "text"
646
- error: "this is an error message form the server"
647
- type: "input"
648
- - field:
649
- id: "dropdown"
650
- label: "Dropdown Label"
651
- name: "dropdown"
652
- options:
653
- - label: "Option One"
654
- value: "option one"
655
- - label: "Option Two"
656
- value: "option two"
657
- - label: "Option Three"
658
- value: "option three"
659
- - label: "Option Four"
660
- value: "four"
661
- - label: "Option Five"
662
- value: "the fifth"
663
- error: "this is an error message form the server"
664
- type: "dropdown"
665
- - field:
666
- label: "Checkbox Label"
667
- name: "checkbox"
668
- type: "checkbox"
669
- error: "this is an error message form the server"
670
- type: "checkbox"
671
- - choicegroupid: "multiplecheckboxes"
672
- field:
673
- - label: "Checkbox Label 1"
674
- grouped: true
675
- name: "checkbox1"
676
- type: "checkbox"
677
- - label: "Checkbox Label 2"
678
- grouped: true
679
- name: "checkbox2"
680
- type: "checkbox"
681
- - label: "Checkbox Label 3"
682
- grouped: true
683
- name: "checkbox3"
684
- type: "checkbox"
685
- - label: "Checkbox Label 4"
686
- grouped: true
687
- name: "checkbox4"
688
- type: "checkbox"
689
- - label: "Checkbox Label 5"
690
- grouped: true
691
- name: "checkbox5"
692
- type: "checkbox"
693
- legend: "Multiple Checkboxes"
694
- type: "checkbox"
695
- grouperror: "this is an error message form the server"
696
- - choicegroupid: "radios"
697
- field:
698
- - label: "Radio Field Label 1"
699
- name: "radio"
700
- type: "radio"
701
- value: "radio1"
702
- - label: "Radio Field Label 2"
703
- name: "radio"
704
- type: "radio"
705
- value: "radio2"
706
- - label: "Radio Field Label 3"
707
- name: "radio"
708
- type: "radio"
709
- value: "radio3"
710
- - label: "Radio Field Label 4"
711
- name: "radio"
712
- type: "radio"
713
- value: "radio4"
714
- - label: "Radio Field Label 5"
715
- name: "radio"
716
- type: "radio"
717
- value: "radio5"
718
- legend: "Radio Group"
719
- type: "radio"
720
- grouperror: "this is an error message form the server"
721
- - field:
722
- label: "File Upload Field Label"
723
- name: "fileupload"
724
- placeholder: "File Upload Field"
725
- error: "this is an error message form the server"
726
- type: "file"
727
- - field:
728
- enddata:
729
- label: "Date Picker End Field Label"
730
- name: "datepickerend"
731
- placeholder: "MM/DD/YYYY"
732
- error: "this is an error message form the server"
733
- label: "Date Picker Field Label"
734
- name: "datepicker"
735
- placeholder: "MM/DD/YYYY"
736
- error: "this is an error message form the server"
737
- range: true
738
- type: "date"
739
- - field:
740
- label: "Number Picker Field Label"
741
- name: "text"
742
- placeholder: "Number Picker Field"
743
- error: "this is an error message form the server"
744
- type: "number"
745
- - field:
746
- label: "Textarea"
747
- name: "textarea"
748
- placeholder: "Textarea"
749
- error: "this is an error message form the server"
750
- type: "textarea"
751
- legend: "Example Form Group"
752
- type: "default"
753
- type: "formgroup"
754
- hashelper:
755
- label: Has Helper Text
756
- description: the Form with helper text on the fields
757
- fields:
758
- formid: "helperform"
759
- items:
760
- - field:
761
- label: "Text Field Label"
762
- name: "text"
763
- placeholder: "Text Field"
764
- type: "text"
765
- helper: "this is the helper text"
766
- type: "input"
767
- - field:
768
- id: "dropdown"
769
- label: "Dropdown Label"
770
- name: "dropdown"
104
+ - label: Switzerland
105
+ value: CH
106
+ - label: Côte d'Ivoire
107
+ value: CI
108
+ - label: Thailand
109
+ value: TH
110
+ - label: United States
111
+ value: US
112
+ - label: Zimbabwe
113
+ value: ZW
114
+ - label: Afghanistan
115
+ value: AF
116
+ - label: Åland Islands
117
+ value: AX
118
+ - type: dropdown
119
+ name: country
120
+ label: Who will you be representing?
121
+ labelPlacement: top
122
+ labelSize: small
123
+ class: my--formfield--class
124
+ style: "flex: 1 1 49%"
771
125
  options:
772
- - label: "Option One"
773
- value: "option one"
774
- - label: "Option Two"
775
- value: "option two"
776
- - label: "Option Three"
777
- value: "option three"
778
- - label: "Option Four"
779
- value: "four"
780
- - label: "Option Five"
781
- value: "the fifth"
782
- helper: "this is the helper text"
783
- type: "dropdown"
784
- - field:
785
- label: "Checkbox Label"
786
- name: "checkbox"
787
- type: "checkbox"
788
- helper: "this is the helper text"
789
- type: "checkbox"
790
- - choicegroupid: "multiplecheckboxes"
791
- field:
792
- - label: "Checkbox Label 1"
793
- grouped: true
794
- name: "checkbox1"
795
- type: "checkbox"
796
- - label: "Checkbox Label 2"
797
- grouped: true
798
- name: "checkbox2"
799
- type: "checkbox"
800
- - label: "Checkbox Label 3"
801
- grouped: true
802
- name: "checkbox3"
803
- type: "checkbox"
804
- - label: "Checkbox Label 4"
805
- grouped: true
806
- name: "checkbox4"
807
- type: "checkbox"
808
- - label: "Checkbox Label 5"
809
- grouped: true
810
- name: "checkbox5"
811
- type: "checkbox"
812
- legend: "Multiple Checkboxes"
813
- type: "checkbox"
814
- grouphelper: "this is the helper text"
815
- - choicegroupid: "radios"
816
- field:
817
- - label: "Radio Field Label 1"
818
- name: "radio"
819
- type: "radio"
820
- value: "radio1"
821
- - label: "Radio Field Label 2"
822
- name: "radio"
823
- type: "radio"
824
- value: "radio2"
825
- - label: "Radio Field Label 3"
826
- name: "radio"
827
- type: "radio"
828
- value: "radio3"
829
- - label: "Radio Field Label 4"
830
- name: "radio"
831
- type: "radio"
832
- value: "radio4"
833
- - label: "Radio Field Label 5"
834
- name: "radio"
835
- type: "radio"
836
- value: "radio5"
837
- grouphelper: "this is the helper text"
838
- legend: "Radio Group"
839
- type: "radio"
840
- - field:
841
- label: "File Upload Field Label"
842
- name: "fileupload"
843
- placeholder: "File Upload Field"
844
- helper: "this is the helper text"
845
- type: "file"
846
- - field:
847
- label: "Date Picker Field Label"
848
- name: "datepicker"
849
- placeholder: "MM/DD/YYYY"
850
- helper: "this is the helper text"
851
- type: "date"
852
- - field:
853
- label: "Number Picker Field Label"
854
- name: "text"
855
- placeholder: "Number Picker Field"
856
- helper: "this is the helper text"
857
- type: "number"
858
- - field:
859
- label: "Textarea"
860
- name: "textarea"
861
- placeholder: "Textarea"
862
- helper: "this is the helper text"
863
- type: "textarea"
864
- - field:
865
- formgroupid: "formgroup"
866
- items:
867
- - field:
868
- label: "Text Field Label"
869
- name: "text"
870
- placeholder: "Text Field"
871
- type: "text"
872
- helper: "this is the helper text"
873
- type: "input"
874
- - field:
875
- id: "dropdown"
876
- label: "Dropdown Label"
877
- name: "dropdown"
878
- options:
879
- - label: "Option One"
880
- value: "option one"
881
- - label: "Option Two"
882
- value: "option two"
883
- - label: "Option Three"
884
- value: "option three"
885
- - label: "Option Four"
886
- value: "four"
887
- - label: "Option Five"
888
- value: "the fifth"
889
- helper: "this is the helper text"
890
- type: "dropdown"
891
- - field:
892
- label: "Checkbox Label"
893
- name: "checkbox"
894
- type: "checkbox"
895
- helper: "this is the helper text"
896
- type: "checkbox"
897
- - choicegroupid: "multiplecheckboxes"
898
- field:
899
- - label: "Checkbox Label 1"
900
- grouped: true
901
- name: "checkbox1"
902
- type: "checkbox"
903
- - label: "Checkbox Label 2"
904
- grouped: true
905
- name: "checkbox2"
906
- type: "checkbox"
907
- - label: "Checkbox Label 3"
908
- grouped: true
909
- name: "checkbox3"
910
- type: "checkbox"
911
- - label: "Checkbox Label 4"
912
- grouped: true
913
- name: "checkbox4"
914
- type: "checkbox"
915
- - label: "Checkbox Label 5"
916
- grouped: true
917
- name: "checkbox5"
918
- type: "checkbox"
919
- legend: "Multiple Checkboxes"
920
- type: "checkbox"
921
- grouphelper: "this is the helper text"
922
- - choicegroupid: "radios"
923
- field:
924
- - label: "Radio Field Label 1"
925
- name: "radio"
926
- type: "radio"
927
- value: "radio1"
928
- - label: "Radio Field Label 2"
929
- name: "radio"
930
- type: "radio"
931
- value: "radio2"
932
- - label: "Radio Field Label 3"
933
- name: "radio"
934
- type: "radio"
935
- value: "radio3"
936
- - label: "Radio Field Label 4"
937
- name: "radio"
938
- type: "radio"
939
- value: "radio4"
940
- - label: "Radio Field Label 5"
941
- name: "radio"
942
- type: "radio"
943
- value: "radio5"
944
- legend: "Radio Group"
945
- type: "radio"
946
- grouphelper: "this is the helper text"
947
- - field:
948
- label: "File Upload Field Label"
949
- name: "fileupload"
950
- placeholder: "File Upload Field"
951
- helper: "this is the helper text"
952
- type: "file"
953
- - field:
954
- enddata:
955
- label: "Date Picker End Field Label"
956
- name: "datepickerend"
957
- placeholder: "MM/DD/YYYY"
958
- helper: "this is the helper text"
959
- label: "Date Picker Field Label"
960
- name: "datepicker"
961
- placeholder: "MM/DD/YYYY"
962
- helper: "this is the helper text"
963
- range: true
964
- type: "date"
965
- - field:
966
- label: "Number Picker Field Label"
967
- name: "text"
968
- placeholder: "Number Picker Field"
969
- helper: "this is the helper text"
970
- type: "number"
971
- - field:
972
- label: "Textarea"
973
- name: "textarea"
974
- placeholder: "Textarea"
975
- helper: "this is the helper text"
976
- type: "textarea"
977
- legend: "Example Form Group"
978
- type: "default"
979
- type: "formgroup"
980
- visibility: storybook
126
+ - label: Workers
127
+ value: 1
128
+ - label: Employers
129
+ value: 2
130
+ - label: Governments
131
+ value: 3
132
+ - label: Other
133
+ value: 4
134
+ - legend: When will you be coming to the ILC?
135
+ direction: row
136
+ style: "width: 100%"
137
+ fields:
138
+ - type: datepicker
139
+ name: arrival-date
140
+ label: Arrival date
141
+ labelPlacement: top
142
+ labelSize: small
143
+ class: my--formfield--class
144
+ style: "flex: 1 1 49%"
145
+ - type: datepicker
146
+ name: departure-date
147
+ label: Departure date
148
+ labelPlacement: top
149
+ labelSize: small
150
+ class: my--formfield--class
151
+ style: "flex: 1 1 49%"