@patternfly/patternfly 5.0.0-alpha.53 → 5.0.0-alpha.54

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 (39) hide show
  1. package/components/FormControl/form-control.css +164 -214
  2. package/components/FormControl/form-control.scss +175 -281
  3. package/components/FormControl/themes/dark/form-control.scss +1 -2
  4. package/components/NumberInput/number-input.css +0 -1
  5. package/components/NumberInput/number-input.scss +0 -1
  6. package/docs/components/CalendarMonth/examples/CalendarMonth.md +32 -28
  7. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +52 -46
  8. package/docs/components/DatePicker/examples/DatePicker.md +55 -49
  9. package/docs/components/FileUpload/examples/FileUpload.md +105 -93
  10. package/docs/components/Form/examples/Form.md +165 -145
  11. package/docs/components/FormControl/examples/FormControl.md +439 -475
  12. package/docs/components/InlineEdit/examples/InlineEdit.md +87 -76
  13. package/docs/components/InputGroup/examples/InputGroup.md +84 -74
  14. package/docs/components/Login/examples/Login.md +92 -82
  15. package/docs/components/NumberInput/examples/NumberInput.md +99 -87
  16. package/docs/components/Pagination/examples/Pagination.md +100 -89
  17. package/docs/components/Select/examples/Select.md +77 -68
  18. package/docs/components/Slider/examples/Slider.md +31 -44
  19. package/docs/components/TextInputGroup/examples/TextInputGroup.md +60 -52
  20. package/docs/components/Toolbar/examples/Toolbar.md +18 -16
  21. package/docs/components/Wizard/examples/Wizard.md +280 -245
  22. package/docs/demos/Alert/examples/Alert.md +69 -57
  23. package/docs/demos/Button/examples/Button.md +54 -48
  24. package/docs/demos/CardView/examples/CardView.md +9 -8
  25. package/docs/demos/DataList/examples/DataList.md +36 -32
  26. package/docs/demos/Form/examples/BasicForms.md +247 -227
  27. package/docs/demos/HelperText/examples/HelperText.md +37 -33
  28. package/docs/demos/Modal/examples/Modal.md +14 -21
  29. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +11 -10
  30. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -40
  31. package/docs/demos/Table/examples/Table.md +99 -88
  32. package/docs/demos/Toolbar/examples/Toolbar.md +28 -25
  33. package/docs/demos/Wizard/examples/Wizard.md +448 -392
  34. package/package.json +3 -3
  35. package/patternfly-no-globals.css +161 -212
  36. package/patternfly.css +161 -212
  37. package/patternfly.min.css +1 -1
  38. package/patternfly.min.css.map +1 -1
  39. package/docs/components/FormControl/examples/FormControl.css +0 -5
@@ -1071,13 +1071,14 @@ wrapperTag: div
1071
1071
  >&#42;</span></label>
1072
1072
  </div>
1073
1073
  <div class="pf-v5-c-form__group-control">
1074
- <input
1075
- class="pf-v5-c-form-control"
1076
- required
1077
- type="text"
1078
- id="-wizard-form-field1"
1079
- name="-wizard-form-field1"
1080
- />
1074
+ <div class="pf-v5-c-form-control">
1075
+ <input
1076
+ required
1077
+ type="text"
1078
+ id="-wizard-form-field1"
1079
+ name="-wizard-form-field1"
1080
+ />
1081
+ </div>
1081
1082
  </div>
1082
1083
  </div>
1083
1084
  <div class="pf-v5-c-form__group">
@@ -1091,13 +1092,14 @@ wrapperTag: div
1091
1092
  >&#42;</span></label>
1092
1093
  </div>
1093
1094
  <div class="pf-v5-c-form__group-control">
1094
- <input
1095
- class="pf-v5-c-form-control"
1096
- required
1097
- type="text"
1098
- id="-wizard-form-field2"
1099
- name="-wizard-form-field2"
1100
- />
1095
+ <div class="pf-v5-c-form-control">
1096
+ <input
1097
+ required
1098
+ type="text"
1099
+ id="-wizard-form-field2"
1100
+ name="-wizard-form-field2"
1101
+ />
1102
+ </div>
1101
1103
  </div>
1102
1104
  </div>
1103
1105
  <div class="pf-v5-c-form__group">
@@ -1111,13 +1113,14 @@ wrapperTag: div
1111
1113
  >&#42;</span></label>
1112
1114
  </div>
1113
1115
  <div class="pf-v5-c-form__group-control">
1114
- <input
1115
- class="pf-v5-c-form-control"
1116
- required
1117
- type="text"
1118
- id="-wizard-form-field3"
1119
- name="-wizard-form-field3"
1120
- />
1116
+ <div class="pf-v5-c-form-control">
1117
+ <input
1118
+ required
1119
+ type="text"
1120
+ id="-wizard-form-field3"
1121
+ name="-wizard-form-field3"
1122
+ />
1123
+ </div>
1121
1124
  </div>
1122
1125
  </div>
1123
1126
  <div class="pf-v5-c-form__group">
@@ -1131,13 +1134,14 @@ wrapperTag: div
1131
1134
  >&#42;</span></label>
1132
1135
  </div>
1133
1136
  <div class="pf-v5-c-form__group-control">
1134
- <input
1135
- class="pf-v5-c-form-control"
1136
- required
1137
- type="text"
1138
- id="-wizard-form-field4"
1139
- name="-wizard-form-field4"
1140
- />
1137
+ <div class="pf-v5-c-form-control">
1138
+ <input
1139
+ required
1140
+ type="text"
1141
+ id="-wizard-form-field4"
1142
+ name="-wizard-form-field4"
1143
+ />
1144
+ </div>
1141
1145
  </div>
1142
1146
  </div>
1143
1147
  <div class="pf-v5-c-form__group">
@@ -1151,13 +1155,14 @@ wrapperTag: div
1151
1155
  >&#42;</span></label>
1152
1156
  </div>
1153
1157
  <div class="pf-v5-c-form__group-control">
1154
- <input
1155
- class="pf-v5-c-form-control"
1156
- required
1157
- type="text"
1158
- id="-wizard-form-field5"
1159
- name="-wizard-form-field5"
1160
- />
1158
+ <div class="pf-v5-c-form-control">
1159
+ <input
1160
+ required
1161
+ type="text"
1162
+ id="-wizard-form-field5"
1163
+ name="-wizard-form-field5"
1164
+ />
1165
+ </div>
1161
1166
  </div>
1162
1167
  </div>
1163
1168
  <div class="pf-v5-c-form__group">
@@ -1171,13 +1176,14 @@ wrapperTag: div
1171
1176
  >&#42;</span></label>
1172
1177
  </div>
1173
1178
  <div class="pf-v5-c-form__group-control">
1174
- <input
1175
- class="pf-v5-c-form-control"
1176
- required
1177
- type="text"
1178
- id="-wizard-form-field6"
1179
- name="-wizard-form-field6"
1180
- />
1179
+ <div class="pf-v5-c-form-control">
1180
+ <input
1181
+ required
1182
+ type="text"
1183
+ id="-wizard-form-field6"
1184
+ name="-wizard-form-field6"
1185
+ />
1186
+ </div>
1181
1187
  </div>
1182
1188
  </div>
1183
1189
  <div class="pf-v5-c-form__group">
@@ -1191,13 +1197,14 @@ wrapperTag: div
1191
1197
  >&#42;</span></label>
1192
1198
  </div>
1193
1199
  <div class="pf-v5-c-form__group-control">
1194
- <input
1195
- class="pf-v5-c-form-control"
1196
- required
1197
- type="text"
1198
- id="-wizard-form-field7"
1199
- name="-wizard-form-field7"
1200
- />
1200
+ <div class="pf-v5-c-form-control">
1201
+ <input
1202
+ required
1203
+ type="text"
1204
+ id="-wizard-form-field7"
1205
+ name="-wizard-form-field7"
1206
+ />
1207
+ </div>
1201
1208
  </div>
1202
1209
  </div>
1203
1210
  </form>
@@ -2283,13 +2290,14 @@ wrapperTag: div
2283
2290
  >&#42;</span></label>
2284
2291
  </div>
2285
2292
  <div class="pf-v5-c-form__group-control">
2286
- <input
2287
- class="pf-v5-c-form-control"
2288
- required
2289
- type="text"
2290
- id="-form-field1"
2291
- name="-form-field1"
2292
- />
2293
+ <div class="pf-v5-c-form-control">
2294
+ <input
2295
+ required
2296
+ type="text"
2297
+ id="-form-field1"
2298
+ name="-form-field1"
2299
+ />
2300
+ </div>
2293
2301
  </div>
2294
2302
  </div>
2295
2303
  <div class="pf-v5-c-form__group">
@@ -2300,13 +2308,14 @@ wrapperTag: div
2300
2308
  >&#42;</span></label>
2301
2309
  </div>
2302
2310
  <div class="pf-v5-c-form__group-control">
2303
- <input
2304
- class="pf-v5-c-form-control"
2305
- required
2306
- type="text"
2307
- id="-form-field2"
2308
- name="-form-field2"
2309
- />
2311
+ <div class="pf-v5-c-form-control">
2312
+ <input
2313
+ required
2314
+ type="text"
2315
+ id="-form-field2"
2316
+ name="-form-field2"
2317
+ />
2318
+ </div>
2310
2319
  </div>
2311
2320
  </div>
2312
2321
  <div class="pf-v5-c-form__group">
@@ -2317,13 +2326,14 @@ wrapperTag: div
2317
2326
  >&#42;</span></label>
2318
2327
  </div>
2319
2328
  <div class="pf-v5-c-form__group-control">
2320
- <input
2321
- class="pf-v5-c-form-control"
2322
- required
2323
- type="text"
2324
- id="-form-field3"
2325
- name="-form-field3"
2326
- />
2329
+ <div class="pf-v5-c-form-control">
2330
+ <input
2331
+ required
2332
+ type="text"
2333
+ id="-form-field3"
2334
+ name="-form-field3"
2335
+ />
2336
+ </div>
2327
2337
  </div>
2328
2338
  </div>
2329
2339
  <div class="pf-v5-c-form__group">
@@ -2334,13 +2344,14 @@ wrapperTag: div
2334
2344
  >&#42;</span></label>
2335
2345
  </div>
2336
2346
  <div class="pf-v5-c-form__group-control">
2337
- <input
2338
- class="pf-v5-c-form-control"
2339
- required
2340
- type="text"
2341
- id="-form-field4"
2342
- name="-form-field4"
2343
- />
2347
+ <div class="pf-v5-c-form-control">
2348
+ <input
2349
+ required
2350
+ type="text"
2351
+ id="-form-field4"
2352
+ name="-form-field4"
2353
+ />
2354
+ </div>
2344
2355
  </div>
2345
2356
  </div>
2346
2357
  <div class="pf-v5-c-form__group">
@@ -2351,13 +2362,14 @@ wrapperTag: div
2351
2362
  >&#42;</span></label>
2352
2363
  </div>
2353
2364
  <div class="pf-v5-c-form__group-control">
2354
- <input
2355
- class="pf-v5-c-form-control"
2356
- required
2357
- type="text"
2358
- id="-form-field5"
2359
- name="-form-field5"
2360
- />
2365
+ <div class="pf-v5-c-form-control">
2366
+ <input
2367
+ required
2368
+ type="text"
2369
+ id="-form-field5"
2370
+ name="-form-field5"
2371
+ />
2372
+ </div>
2361
2373
  </div>
2362
2374
  </div>
2363
2375
  <div class="pf-v5-c-form__group">
@@ -2368,13 +2380,14 @@ wrapperTag: div
2368
2380
  >&#42;</span></label>
2369
2381
  </div>
2370
2382
  <div class="pf-v5-c-form__group-control">
2371
- <input
2372
- class="pf-v5-c-form-control"
2373
- required
2374
- type="text"
2375
- id="-form-field6"
2376
- name="-form-field6"
2377
- />
2383
+ <div class="pf-v5-c-form-control">
2384
+ <input
2385
+ required
2386
+ type="text"
2387
+ id="-form-field6"
2388
+ name="-form-field6"
2389
+ />
2390
+ </div>
2378
2391
  </div>
2379
2392
  </div>
2380
2393
  <div class="pf-v5-c-form__group">
@@ -2385,13 +2398,14 @@ wrapperTag: div
2385
2398
  >&#42;</span></label>
2386
2399
  </div>
2387
2400
  <div class="pf-v5-c-form__group-control">
2388
- <input
2389
- class="pf-v5-c-form-control"
2390
- required
2391
- type="text"
2392
- id="-form-field7"
2393
- name="-form-field7"
2394
- />
2401
+ <div class="pf-v5-c-form-control">
2402
+ <input
2403
+ required
2404
+ type="text"
2405
+ id="-form-field7"
2406
+ name="-form-field7"
2407
+ />
2408
+ </div>
2395
2409
  </div>
2396
2410
  </div>
2397
2411
  </form>
@@ -3486,13 +3500,14 @@ wrapperTag: div
3486
3500
  >&#42;</span></label>
3487
3501
  </div>
3488
3502
  <div class="pf-v5-c-form__group-control">
3489
- <input
3490
- class="pf-v5-c-form-control"
3491
- required
3492
- type="text"
3493
- id="-wizard-form-field1"
3494
- name="-wizard-form-field1"
3495
- />
3503
+ <div class="pf-v5-c-form-control">
3504
+ <input
3505
+ required
3506
+ type="text"
3507
+ id="-wizard-form-field1"
3508
+ name="-wizard-form-field1"
3509
+ />
3510
+ </div>
3496
3511
  </div>
3497
3512
  </div>
3498
3513
  <div class="pf-v5-c-form__group">
@@ -3506,13 +3521,14 @@ wrapperTag: div
3506
3521
  >&#42;</span></label>
3507
3522
  </div>
3508
3523
  <div class="pf-v5-c-form__group-control">
3509
- <input
3510
- class="pf-v5-c-form-control"
3511
- required
3512
- type="text"
3513
- id="-wizard-form-field2"
3514
- name="-wizard-form-field2"
3515
- />
3524
+ <div class="pf-v5-c-form-control">
3525
+ <input
3526
+ required
3527
+ type="text"
3528
+ id="-wizard-form-field2"
3529
+ name="-wizard-form-field2"
3530
+ />
3531
+ </div>
3516
3532
  </div>
3517
3533
  </div>
3518
3534
  <div class="pf-v5-c-form__group">
@@ -3526,13 +3542,14 @@ wrapperTag: div
3526
3542
  >&#42;</span></label>
3527
3543
  </div>
3528
3544
  <div class="pf-v5-c-form__group-control">
3529
- <input
3530
- class="pf-v5-c-form-control"
3531
- required
3532
- type="text"
3533
- id="-wizard-form-field3"
3534
- name="-wizard-form-field3"
3535
- />
3545
+ <div class="pf-v5-c-form-control">
3546
+ <input
3547
+ required
3548
+ type="text"
3549
+ id="-wizard-form-field3"
3550
+ name="-wizard-form-field3"
3551
+ />
3552
+ </div>
3536
3553
  </div>
3537
3554
  </div>
3538
3555
  <div class="pf-v5-c-form__group">
@@ -3546,13 +3563,14 @@ wrapperTag: div
3546
3563
  >&#42;</span></label>
3547
3564
  </div>
3548
3565
  <div class="pf-v5-c-form__group-control">
3549
- <input
3550
- class="pf-v5-c-form-control"
3551
- required
3552
- type="text"
3553
- id="-wizard-form-field4"
3554
- name="-wizard-form-field4"
3555
- />
3566
+ <div class="pf-v5-c-form-control">
3567
+ <input
3568
+ required
3569
+ type="text"
3570
+ id="-wizard-form-field4"
3571
+ name="-wizard-form-field4"
3572
+ />
3573
+ </div>
3556
3574
  </div>
3557
3575
  </div>
3558
3576
  <div class="pf-v5-c-form__group">
@@ -3566,13 +3584,14 @@ wrapperTag: div
3566
3584
  >&#42;</span></label>
3567
3585
  </div>
3568
3586
  <div class="pf-v5-c-form__group-control">
3569
- <input
3570
- class="pf-v5-c-form-control"
3571
- required
3572
- type="text"
3573
- id="-wizard-form-field5"
3574
- name="-wizard-form-field5"
3575
- />
3587
+ <div class="pf-v5-c-form-control">
3588
+ <input
3589
+ required
3590
+ type="text"
3591
+ id="-wizard-form-field5"
3592
+ name="-wizard-form-field5"
3593
+ />
3594
+ </div>
3576
3595
  </div>
3577
3596
  </div>
3578
3597
  <div class="pf-v5-c-form__group">
@@ -3586,13 +3605,14 @@ wrapperTag: div
3586
3605
  >&#42;</span></label>
3587
3606
  </div>
3588
3607
  <div class="pf-v5-c-form__group-control">
3589
- <input
3590
- class="pf-v5-c-form-control"
3591
- required
3592
- type="text"
3593
- id="-wizard-form-field6"
3594
- name="-wizard-form-field6"
3595
- />
3608
+ <div class="pf-v5-c-form-control">
3609
+ <input
3610
+ required
3611
+ type="text"
3612
+ id="-wizard-form-field6"
3613
+ name="-wizard-form-field6"
3614
+ />
3615
+ </div>
3596
3616
  </div>
3597
3617
  </div>
3598
3618
  <div class="pf-v5-c-form__group">
@@ -3606,13 +3626,14 @@ wrapperTag: div
3606
3626
  >&#42;</span></label>
3607
3627
  </div>
3608
3628
  <div class="pf-v5-c-form__group-control">
3609
- <input
3610
- class="pf-v5-c-form-control"
3611
- required
3612
- type="text"
3613
- id="-wizard-form-field7"
3614
- name="-wizard-form-field7"
3615
- />
3629
+ <div class="pf-v5-c-form-control">
3630
+ <input
3631
+ required
3632
+ type="text"
3633
+ id="-wizard-form-field7"
3634
+ name="-wizard-form-field7"
3635
+ />
3636
+ </div>
3616
3637
  </div>
3617
3638
  </div>
3618
3639
  </form>
@@ -4764,13 +4785,14 @@ wrapperTag: div
4764
4785
  >&#42;</span></label>
4765
4786
  </div>
4766
4787
  <div class="pf-v5-c-form__group-control">
4767
- <input
4768
- class="pf-v5-c-form-control"
4769
- required
4770
- type="text"
4771
- id="-wizard-form-field1"
4772
- name="-wizard-form-field1"
4773
- />
4788
+ <div class="pf-v5-c-form-control">
4789
+ <input
4790
+ required
4791
+ type="text"
4792
+ id="-wizard-form-field1"
4793
+ name="-wizard-form-field1"
4794
+ />
4795
+ </div>
4774
4796
  </div>
4775
4797
  </div>
4776
4798
  <div class="pf-v5-c-form__group">
@@ -4784,13 +4806,14 @@ wrapperTag: div
4784
4806
  >&#42;</span></label>
4785
4807
  </div>
4786
4808
  <div class="pf-v5-c-form__group-control">
4787
- <input
4788
- class="pf-v5-c-form-control"
4789
- required
4790
- type="text"
4791
- id="-wizard-form-field2"
4792
- name="-wizard-form-field2"
4793
- />
4809
+ <div class="pf-v5-c-form-control">
4810
+ <input
4811
+ required
4812
+ type="text"
4813
+ id="-wizard-form-field2"
4814
+ name="-wizard-form-field2"
4815
+ />
4816
+ </div>
4794
4817
  </div>
4795
4818
  </div>
4796
4819
  <div class="pf-v5-c-form__group">
@@ -4804,13 +4827,14 @@ wrapperTag: div
4804
4827
  >&#42;</span></label>
4805
4828
  </div>
4806
4829
  <div class="pf-v5-c-form__group-control">
4807
- <input
4808
- class="pf-v5-c-form-control"
4809
- required
4810
- type="text"
4811
- id="-wizard-form-field3"
4812
- name="-wizard-form-field3"
4813
- />
4830
+ <div class="pf-v5-c-form-control">
4831
+ <input
4832
+ required
4833
+ type="text"
4834
+ id="-wizard-form-field3"
4835
+ name="-wizard-form-field3"
4836
+ />
4837
+ </div>
4814
4838
  </div>
4815
4839
  </div>
4816
4840
  <div class="pf-v5-c-form__group">
@@ -4824,13 +4848,14 @@ wrapperTag: div
4824
4848
  >&#42;</span></label>
4825
4849
  </div>
4826
4850
  <div class="pf-v5-c-form__group-control">
4827
- <input
4828
- class="pf-v5-c-form-control"
4829
- required
4830
- type="text"
4831
- id="-wizard-form-field4"
4832
- name="-wizard-form-field4"
4833
- />
4851
+ <div class="pf-v5-c-form-control">
4852
+ <input
4853
+ required
4854
+ type="text"
4855
+ id="-wizard-form-field4"
4856
+ name="-wizard-form-field4"
4857
+ />
4858
+ </div>
4834
4859
  </div>
4835
4860
  </div>
4836
4861
  <div class="pf-v5-c-form__group">
@@ -4844,13 +4869,14 @@ wrapperTag: div
4844
4869
  >&#42;</span></label>
4845
4870
  </div>
4846
4871
  <div class="pf-v5-c-form__group-control">
4847
- <input
4848
- class="pf-v5-c-form-control"
4849
- required
4850
- type="text"
4851
- id="-wizard-form-field5"
4852
- name="-wizard-form-field5"
4853
- />
4872
+ <div class="pf-v5-c-form-control">
4873
+ <input
4874
+ required
4875
+ type="text"
4876
+ id="-wizard-form-field5"
4877
+ name="-wizard-form-field5"
4878
+ />
4879
+ </div>
4854
4880
  </div>
4855
4881
  </div>
4856
4882
  <div class="pf-v5-c-form__group">
@@ -4864,13 +4890,14 @@ wrapperTag: div
4864
4890
  >&#42;</span></label>
4865
4891
  </div>
4866
4892
  <div class="pf-v5-c-form__group-control">
4867
- <input
4868
- class="pf-v5-c-form-control"
4869
- required
4870
- type="text"
4871
- id="-wizard-form-field6"
4872
- name="-wizard-form-field6"
4873
- />
4893
+ <div class="pf-v5-c-form-control">
4894
+ <input
4895
+ required
4896
+ type="text"
4897
+ id="-wizard-form-field6"
4898
+ name="-wizard-form-field6"
4899
+ />
4900
+ </div>
4874
4901
  </div>
4875
4902
  </div>
4876
4903
  <div class="pf-v5-c-form__group">
@@ -4884,13 +4911,14 @@ wrapperTag: div
4884
4911
  >&#42;</span></label>
4885
4912
  </div>
4886
4913
  <div class="pf-v5-c-form__group-control">
4887
- <input
4888
- class="pf-v5-c-form-control"
4889
- required
4890
- type="text"
4891
- id="-wizard-form-field7"
4892
- name="-wizard-form-field7"
4893
- />
4914
+ <div class="pf-v5-c-form-control">
4915
+ <input
4916
+ required
4917
+ type="text"
4918
+ id="-wizard-form-field7"
4919
+ name="-wizard-form-field7"
4920
+ />
4921
+ </div>
4894
4922
  </div>
4895
4923
  </div>
4896
4924
  </form>
@@ -7121,13 +7149,14 @@ wrapperTag: div
7121
7149
  >&#42;</span></label>
7122
7150
  </div>
7123
7151
  <div class="pf-v5-c-form__group-control">
7124
- <input
7125
- class="pf-v5-c-form-control"
7126
- required
7127
- type="text"
7128
- id="wizard-in-page-example-wizard-form-field1"
7129
- name="wizard-in-page-example-wizard-form-field1"
7130
- />
7152
+ <div class="pf-v5-c-form-control">
7153
+ <input
7154
+ required
7155
+ type="text"
7156
+ id="wizard-in-page-example-wizard-form-field1"
7157
+ name="wizard-in-page-example-wizard-form-field1"
7158
+ />
7159
+ </div>
7131
7160
  </div>
7132
7161
  </div>
7133
7162
  <div class="pf-v5-c-form__group">
@@ -7141,13 +7170,14 @@ wrapperTag: div
7141
7170
  >&#42;</span></label>
7142
7171
  </div>
7143
7172
  <div class="pf-v5-c-form__group-control">
7144
- <input
7145
- class="pf-v5-c-form-control"
7146
- required
7147
- type="text"
7148
- id="wizard-in-page-example-wizard-form-field2"
7149
- name="wizard-in-page-example-wizard-form-field2"
7150
- />
7173
+ <div class="pf-v5-c-form-control">
7174
+ <input
7175
+ required
7176
+ type="text"
7177
+ id="wizard-in-page-example-wizard-form-field2"
7178
+ name="wizard-in-page-example-wizard-form-field2"
7179
+ />
7180
+ </div>
7151
7181
  </div>
7152
7182
  </div>
7153
7183
  <div class="pf-v5-c-form__group">
@@ -7161,13 +7191,14 @@ wrapperTag: div
7161
7191
  >&#42;</span></label>
7162
7192
  </div>
7163
7193
  <div class="pf-v5-c-form__group-control">
7164
- <input
7165
- class="pf-v5-c-form-control"
7166
- required
7167
- type="text"
7168
- id="wizard-in-page-example-wizard-form-field3"
7169
- name="wizard-in-page-example-wizard-form-field3"
7170
- />
7194
+ <div class="pf-v5-c-form-control">
7195
+ <input
7196
+ required
7197
+ type="text"
7198
+ id="wizard-in-page-example-wizard-form-field3"
7199
+ name="wizard-in-page-example-wizard-form-field3"
7200
+ />
7201
+ </div>
7171
7202
  </div>
7172
7203
  </div>
7173
7204
  <div class="pf-v5-c-form__group">
@@ -7181,13 +7212,14 @@ wrapperTag: div
7181
7212
  >&#42;</span></label>
7182
7213
  </div>
7183
7214
  <div class="pf-v5-c-form__group-control">
7184
- <input
7185
- class="pf-v5-c-form-control"
7186
- required
7187
- type="text"
7188
- id="wizard-in-page-example-wizard-form-field4"
7189
- name="wizard-in-page-example-wizard-form-field4"
7190
- />
7215
+ <div class="pf-v5-c-form-control">
7216
+ <input
7217
+ required
7218
+ type="text"
7219
+ id="wizard-in-page-example-wizard-form-field4"
7220
+ name="wizard-in-page-example-wizard-form-field4"
7221
+ />
7222
+ </div>
7191
7223
  </div>
7192
7224
  </div>
7193
7225
  <div class="pf-v5-c-form__group">
@@ -7201,13 +7233,14 @@ wrapperTag: div
7201
7233
  >&#42;</span></label>
7202
7234
  </div>
7203
7235
  <div class="pf-v5-c-form__group-control">
7204
- <input
7205
- class="pf-v5-c-form-control"
7206
- required
7207
- type="text"
7208
- id="wizard-in-page-example-wizard-form-field5"
7209
- name="wizard-in-page-example-wizard-form-field5"
7210
- />
7236
+ <div class="pf-v5-c-form-control">
7237
+ <input
7238
+ required
7239
+ type="text"
7240
+ id="wizard-in-page-example-wizard-form-field5"
7241
+ name="wizard-in-page-example-wizard-form-field5"
7242
+ />
7243
+ </div>
7211
7244
  </div>
7212
7245
  </div>
7213
7246
  <div class="pf-v5-c-form__group">
@@ -7221,13 +7254,14 @@ wrapperTag: div
7221
7254
  >&#42;</span></label>
7222
7255
  </div>
7223
7256
  <div class="pf-v5-c-form__group-control">
7224
- <input
7225
- class="pf-v5-c-form-control"
7226
- required
7227
- type="text"
7228
- id="wizard-in-page-example-wizard-form-field6"
7229
- name="wizard-in-page-example-wizard-form-field6"
7230
- />
7257
+ <div class="pf-v5-c-form-control">
7258
+ <input
7259
+ required
7260
+ type="text"
7261
+ id="wizard-in-page-example-wizard-form-field6"
7262
+ name="wizard-in-page-example-wizard-form-field6"
7263
+ />
7264
+ </div>
7231
7265
  </div>
7232
7266
  </div>
7233
7267
  <div class="pf-v5-c-form__group">
@@ -7241,13 +7275,14 @@ wrapperTag: div
7241
7275
  >&#42;</span></label>
7242
7276
  </div>
7243
7277
  <div class="pf-v5-c-form__group-control">
7244
- <input
7245
- class="pf-v5-c-form-control"
7246
- required
7247
- type="text"
7248
- id="wizard-in-page-example-wizard-form-field7"
7249
- name="wizard-in-page-example-wizard-form-field7"
7250
- />
7278
+ <div class="pf-v5-c-form-control">
7279
+ <input
7280
+ required
7281
+ type="text"
7282
+ id="wizard-in-page-example-wizard-form-field7"
7283
+ name="wizard-in-page-example-wizard-form-field7"
7284
+ />
7285
+ </div>
7251
7286
  </div>
7252
7287
  </div>
7253
7288
  </form>
@@ -8271,13 +8306,14 @@ wrapperTag: div
8271
8306
  >&#42;</span></label>
8272
8307
  </div>
8273
8308
  <div class="pf-v5-c-form__group-control">
8274
- <input
8275
- class="pf-v5-c-form-control"
8276
- required
8277
- type="text"
8278
- id="-form-field1"
8279
- name="-form-field1"
8280
- />
8309
+ <div class="pf-v5-c-form-control">
8310
+ <input
8311
+ required
8312
+ type="text"
8313
+ id="-form-field1"
8314
+ name="-form-field1"
8315
+ />
8316
+ </div>
8281
8317
  </div>
8282
8318
  </div>
8283
8319
  <div class="pf-v5-c-form__group">
@@ -8288,13 +8324,14 @@ wrapperTag: div
8288
8324
  >&#42;</span></label>
8289
8325
  </div>
8290
8326
  <div class="pf-v5-c-form__group-control">
8291
- <input
8292
- class="pf-v5-c-form-control"
8293
- required
8294
- type="text"
8295
- id="-form-field2"
8296
- name="-form-field2"
8297
- />
8327
+ <div class="pf-v5-c-form-control">
8328
+ <input
8329
+ required
8330
+ type="text"
8331
+ id="-form-field2"
8332
+ name="-form-field2"
8333
+ />
8334
+ </div>
8298
8335
  </div>
8299
8336
  </div>
8300
8337
  <div class="pf-v5-c-form__group">
@@ -8305,13 +8342,14 @@ wrapperTag: div
8305
8342
  >&#42;</span></label>
8306
8343
  </div>
8307
8344
  <div class="pf-v5-c-form__group-control">
8308
- <input
8309
- class="pf-v5-c-form-control"
8310
- required
8311
- type="text"
8312
- id="-form-field3"
8313
- name="-form-field3"
8314
- />
8345
+ <div class="pf-v5-c-form-control">
8346
+ <input
8347
+ required
8348
+ type="text"
8349
+ id="-form-field3"
8350
+ name="-form-field3"
8351
+ />
8352
+ </div>
8315
8353
  </div>
8316
8354
  </div>
8317
8355
  <div class="pf-v5-c-form__group">
@@ -8322,13 +8360,14 @@ wrapperTag: div
8322
8360
  >&#42;</span></label>
8323
8361
  </div>
8324
8362
  <div class="pf-v5-c-form__group-control">
8325
- <input
8326
- class="pf-v5-c-form-control"
8327
- required
8328
- type="text"
8329
- id="-form-field4"
8330
- name="-form-field4"
8331
- />
8363
+ <div class="pf-v5-c-form-control">
8364
+ <input
8365
+ required
8366
+ type="text"
8367
+ id="-form-field4"
8368
+ name="-form-field4"
8369
+ />
8370
+ </div>
8332
8371
  </div>
8333
8372
  </div>
8334
8373
  <div class="pf-v5-c-form__group">
@@ -8339,13 +8378,14 @@ wrapperTag: div
8339
8378
  >&#42;</span></label>
8340
8379
  </div>
8341
8380
  <div class="pf-v5-c-form__group-control">
8342
- <input
8343
- class="pf-v5-c-form-control"
8344
- required
8345
- type="text"
8346
- id="-form-field5"
8347
- name="-form-field5"
8348
- />
8381
+ <div class="pf-v5-c-form-control">
8382
+ <input
8383
+ required
8384
+ type="text"
8385
+ id="-form-field5"
8386
+ name="-form-field5"
8387
+ />
8388
+ </div>
8349
8389
  </div>
8350
8390
  </div>
8351
8391
  <div class="pf-v5-c-form__group">
@@ -8356,13 +8396,14 @@ wrapperTag: div
8356
8396
  >&#42;</span></label>
8357
8397
  </div>
8358
8398
  <div class="pf-v5-c-form__group-control">
8359
- <input
8360
- class="pf-v5-c-form-control"
8361
- required
8362
- type="text"
8363
- id="-form-field6"
8364
- name="-form-field6"
8365
- />
8399
+ <div class="pf-v5-c-form-control">
8400
+ <input
8401
+ required
8402
+ type="text"
8403
+ id="-form-field6"
8404
+ name="-form-field6"
8405
+ />
8406
+ </div>
8366
8407
  </div>
8367
8408
  </div>
8368
8409
  <div class="pf-v5-c-form__group">
@@ -8373,13 +8414,14 @@ wrapperTag: div
8373
8414
  >&#42;</span></label>
8374
8415
  </div>
8375
8416
  <div class="pf-v5-c-form__group-control">
8376
- <input
8377
- class="pf-v5-c-form-control"
8378
- required
8379
- type="text"
8380
- id="-form-field7"
8381
- name="-form-field7"
8382
- />
8417
+ <div class="pf-v5-c-form-control">
8418
+ <input
8419
+ required
8420
+ type="text"
8421
+ id="-form-field7"
8422
+ name="-form-field7"
8423
+ />
8424
+ </div>
8383
8425
  </div>
8384
8426
  </div>
8385
8427
  </form>
@@ -9408,13 +9450,14 @@ wrapperTag: div
9408
9450
  >&#42;</span></label>
9409
9451
  </div>
9410
9452
  <div class="pf-v5-c-form__group-control">
9411
- <input
9412
- class="pf-v5-c-form-control"
9413
- required
9414
- type="text"
9415
- id="wizard-with-drawer-in-page-example-wizard-form-field1"
9416
- name="wizard-with-drawer-in-page-example-wizard-form-field1"
9417
- />
9453
+ <div class="pf-v5-c-form-control">
9454
+ <input
9455
+ required
9456
+ type="text"
9457
+ id="wizard-with-drawer-in-page-example-wizard-form-field1"
9458
+ name="wizard-with-drawer-in-page-example-wizard-form-field1"
9459
+ />
9460
+ </div>
9418
9461
  </div>
9419
9462
  </div>
9420
9463
  <div class="pf-v5-c-form__group">
@@ -9428,13 +9471,14 @@ wrapperTag: div
9428
9471
  >&#42;</span></label>
9429
9472
  </div>
9430
9473
  <div class="pf-v5-c-form__group-control">
9431
- <input
9432
- class="pf-v5-c-form-control"
9433
- required
9434
- type="text"
9435
- id="wizard-with-drawer-in-page-example-wizard-form-field2"
9436
- name="wizard-with-drawer-in-page-example-wizard-form-field2"
9437
- />
9474
+ <div class="pf-v5-c-form-control">
9475
+ <input
9476
+ required
9477
+ type="text"
9478
+ id="wizard-with-drawer-in-page-example-wizard-form-field2"
9479
+ name="wizard-with-drawer-in-page-example-wizard-form-field2"
9480
+ />
9481
+ </div>
9438
9482
  </div>
9439
9483
  </div>
9440
9484
  <div class="pf-v5-c-form__group">
@@ -9448,13 +9492,14 @@ wrapperTag: div
9448
9492
  >&#42;</span></label>
9449
9493
  </div>
9450
9494
  <div class="pf-v5-c-form__group-control">
9451
- <input
9452
- class="pf-v5-c-form-control"
9453
- required
9454
- type="text"
9455
- id="wizard-with-drawer-in-page-example-wizard-form-field3"
9456
- name="wizard-with-drawer-in-page-example-wizard-form-field3"
9457
- />
9495
+ <div class="pf-v5-c-form-control">
9496
+ <input
9497
+ required
9498
+ type="text"
9499
+ id="wizard-with-drawer-in-page-example-wizard-form-field3"
9500
+ name="wizard-with-drawer-in-page-example-wizard-form-field3"
9501
+ />
9502
+ </div>
9458
9503
  </div>
9459
9504
  </div>
9460
9505
  <div class="pf-v5-c-form__group">
@@ -9468,13 +9513,14 @@ wrapperTag: div
9468
9513
  >&#42;</span></label>
9469
9514
  </div>
9470
9515
  <div class="pf-v5-c-form__group-control">
9471
- <input
9472
- class="pf-v5-c-form-control"
9473
- required
9474
- type="text"
9475
- id="wizard-with-drawer-in-page-example-wizard-form-field4"
9476
- name="wizard-with-drawer-in-page-example-wizard-form-field4"
9477
- />
9516
+ <div class="pf-v5-c-form-control">
9517
+ <input
9518
+ required
9519
+ type="text"
9520
+ id="wizard-with-drawer-in-page-example-wizard-form-field4"
9521
+ name="wizard-with-drawer-in-page-example-wizard-form-field4"
9522
+ />
9523
+ </div>
9478
9524
  </div>
9479
9525
  </div>
9480
9526
  <div class="pf-v5-c-form__group">
@@ -9488,13 +9534,14 @@ wrapperTag: div
9488
9534
  >&#42;</span></label>
9489
9535
  </div>
9490
9536
  <div class="pf-v5-c-form__group-control">
9491
- <input
9492
- class="pf-v5-c-form-control"
9493
- required
9494
- type="text"
9495
- id="wizard-with-drawer-in-page-example-wizard-form-field5"
9496
- name="wizard-with-drawer-in-page-example-wizard-form-field5"
9497
- />
9537
+ <div class="pf-v5-c-form-control">
9538
+ <input
9539
+ required
9540
+ type="text"
9541
+ id="wizard-with-drawer-in-page-example-wizard-form-field5"
9542
+ name="wizard-with-drawer-in-page-example-wizard-form-field5"
9543
+ />
9544
+ </div>
9498
9545
  </div>
9499
9546
  </div>
9500
9547
  <div class="pf-v5-c-form__group">
@@ -9508,13 +9555,14 @@ wrapperTag: div
9508
9555
  >&#42;</span></label>
9509
9556
  </div>
9510
9557
  <div class="pf-v5-c-form__group-control">
9511
- <input
9512
- class="pf-v5-c-form-control"
9513
- required
9514
- type="text"
9515
- id="wizard-with-drawer-in-page-example-wizard-form-field6"
9516
- name="wizard-with-drawer-in-page-example-wizard-form-field6"
9517
- />
9558
+ <div class="pf-v5-c-form-control">
9559
+ <input
9560
+ required
9561
+ type="text"
9562
+ id="wizard-with-drawer-in-page-example-wizard-form-field6"
9563
+ name="wizard-with-drawer-in-page-example-wizard-form-field6"
9564
+ />
9565
+ </div>
9518
9566
  </div>
9519
9567
  </div>
9520
9568
  <div class="pf-v5-c-form__group">
@@ -9528,13 +9576,14 @@ wrapperTag: div
9528
9576
  >&#42;</span></label>
9529
9577
  </div>
9530
9578
  <div class="pf-v5-c-form__group-control">
9531
- <input
9532
- class="pf-v5-c-form-control"
9533
- required
9534
- type="text"
9535
- id="wizard-with-drawer-in-page-example-wizard-form-field7"
9536
- name="wizard-with-drawer-in-page-example-wizard-form-field7"
9537
- />
9579
+ <div class="pf-v5-c-form-control">
9580
+ <input
9581
+ required
9582
+ type="text"
9583
+ id="wizard-with-drawer-in-page-example-wizard-form-field7"
9584
+ name="wizard-with-drawer-in-page-example-wizard-form-field7"
9585
+ />
9586
+ </div>
9538
9587
  </div>
9539
9588
  </div>
9540
9589
  </form>
@@ -10612,13 +10661,14 @@ wrapperTag: div
10612
10661
  >&#42;</span></label>
10613
10662
  </div>
10614
10663
  <div class="pf-v5-c-form__group-control">
10615
- <input
10616
- class="pf-v5-c-form-control"
10617
- required
10618
- type="text"
10619
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field1"
10620
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field1"
10621
- />
10664
+ <div class="pf-v5-c-form-control">
10665
+ <input
10666
+ required
10667
+ type="text"
10668
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field1"
10669
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field1"
10670
+ />
10671
+ </div>
10622
10672
  </div>
10623
10673
  </div>
10624
10674
  <div class="pf-v5-c-form__group">
@@ -10632,13 +10682,14 @@ wrapperTag: div
10632
10682
  >&#42;</span></label>
10633
10683
  </div>
10634
10684
  <div class="pf-v5-c-form__group-control">
10635
- <input
10636
- class="pf-v5-c-form-control"
10637
- required
10638
- type="text"
10639
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field2"
10640
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field2"
10641
- />
10685
+ <div class="pf-v5-c-form-control">
10686
+ <input
10687
+ required
10688
+ type="text"
10689
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field2"
10690
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field2"
10691
+ />
10692
+ </div>
10642
10693
  </div>
10643
10694
  </div>
10644
10695
  <div class="pf-v5-c-form__group">
@@ -10652,13 +10703,14 @@ wrapperTag: div
10652
10703
  >&#42;</span></label>
10653
10704
  </div>
10654
10705
  <div class="pf-v5-c-form__group-control">
10655
- <input
10656
- class="pf-v5-c-form-control"
10657
- required
10658
- type="text"
10659
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field3"
10660
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field3"
10661
- />
10706
+ <div class="pf-v5-c-form-control">
10707
+ <input
10708
+ required
10709
+ type="text"
10710
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field3"
10711
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field3"
10712
+ />
10713
+ </div>
10662
10714
  </div>
10663
10715
  </div>
10664
10716
  <div class="pf-v5-c-form__group">
@@ -10672,13 +10724,14 @@ wrapperTag: div
10672
10724
  >&#42;</span></label>
10673
10725
  </div>
10674
10726
  <div class="pf-v5-c-form__group-control">
10675
- <input
10676
- class="pf-v5-c-form-control"
10677
- required
10678
- type="text"
10679
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field4"
10680
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field4"
10681
- />
10727
+ <div class="pf-v5-c-form-control">
10728
+ <input
10729
+ required
10730
+ type="text"
10731
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field4"
10732
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field4"
10733
+ />
10734
+ </div>
10682
10735
  </div>
10683
10736
  </div>
10684
10737
  <div class="pf-v5-c-form__group">
@@ -10692,13 +10745,14 @@ wrapperTag: div
10692
10745
  >&#42;</span></label>
10693
10746
  </div>
10694
10747
  <div class="pf-v5-c-form__group-control">
10695
- <input
10696
- class="pf-v5-c-form-control"
10697
- required
10698
- type="text"
10699
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field5"
10700
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field5"
10701
- />
10748
+ <div class="pf-v5-c-form-control">
10749
+ <input
10750
+ required
10751
+ type="text"
10752
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field5"
10753
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field5"
10754
+ />
10755
+ </div>
10702
10756
  </div>
10703
10757
  </div>
10704
10758
  <div class="pf-v5-c-form__group">
@@ -10712,13 +10766,14 @@ wrapperTag: div
10712
10766
  >&#42;</span></label>
10713
10767
  </div>
10714
10768
  <div class="pf-v5-c-form__group-control">
10715
- <input
10716
- class="pf-v5-c-form-control"
10717
- required
10718
- type="text"
10719
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field6"
10720
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field6"
10721
- />
10769
+ <div class="pf-v5-c-form-control">
10770
+ <input
10771
+ required
10772
+ type="text"
10773
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field6"
10774
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field6"
10775
+ />
10776
+ </div>
10722
10777
  </div>
10723
10778
  </div>
10724
10779
  <div class="pf-v5-c-form__group">
@@ -10732,13 +10787,14 @@ wrapperTag: div
10732
10787
  >&#42;</span></label>
10733
10788
  </div>
10734
10789
  <div class="pf-v5-c-form__group-control">
10735
- <input
10736
- class="pf-v5-c-form-control"
10737
- required
10738
- type="text"
10739
- id="wizard-with-drawer-in-page-expanded-example-wizard-form-field7"
10740
- name="wizard-with-drawer-in-page-expanded-example-wizard-form-field7"
10741
- />
10790
+ <div class="pf-v5-c-form-control">
10791
+ <input
10792
+ required
10793
+ type="text"
10794
+ id="wizard-with-drawer-in-page-expanded-example-wizard-form-field7"
10795
+ name="wizard-with-drawer-in-page-expanded-example-wizard-form-field7"
10796
+ />
10797
+ </div>
10742
10798
  </div>
10743
10799
  </div>
10744
10800
  </form>