@patternfly/patternfly 5.1.0-prerelease.1 → 5.1.0-prerelease.3

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 (17) hide show
  1. package/components/AboutModalBox/about-modal-box.css +2 -1
  2. package/components/AboutModalBox/about-modal-box.scss +2 -1
  3. package/components/TreeView/tree-view.scss +1 -1
  4. package/docs/components/Badge/examples/Badge.md +16 -4
  5. package/docs/components/Chip/examples/Chip.md +30 -10
  6. package/docs/components/Select/deprecated/Select.md +3 -3
  7. package/docs/components/TextInputGroup/examples/TextInputGroup.md +2 -2
  8. package/docs/components/Toolbar/examples/Toolbar.md +6 -12
  9. package/docs/components/Wizard/examples/Wizard.md +75 -36
  10. package/docs/demos/Toolbar/examples/Toolbar.md +2 -4
  11. package/docs/demos/Wizard/examples/Wizard.md +191 -41
  12. package/package.json +1 -1
  13. package/patternfly-no-globals.css +2 -1
  14. package/patternfly-theme-dark-unversioned.css +2 -1
  15. package/patternfly.css +2 -1
  16. package/patternfly.min.css +1 -1
  17. package/patternfly.min.css.map +1 -1
package/components/AboutModalBox/about-modal-box.css CHANGED
@@ -14,6 +14,7 @@
14
14
  }
15
15
 
16
16
  .pf-v5-c-about-modal-box {
17
+ --pf-v5-c-about-modal-box--BackgroundImage: none;
17
18
  --pf-v5-c-about-modal-box--BackgroundColor: var(--pf-v5-global--palette--black-1000);
18
19
  --pf-v5-c-about-modal-box--BackgroundPosition: bottom right;
19
20
  --pf-v5-c-about-modal-box--BackgroundSize--min-width: 200px;
@@ -72,7 +73,7 @@
72
73
  overflow-x: hidden;
73
74
  overflow-y: auto;
74
75
  background-color: var(--pf-v5-c-about-modal-box--BackgroundColor);
75
- background-image: var(--pf-v5-c-about-modal-box--BackgroundImage, none);
76
+ background-image: var(--pf-v5-c-about-modal-box--BackgroundImage);
76
77
  background-repeat: no-repeat;
77
78
  background-position: var(--pf-v5-c-about-modal-box--BackgroundPosition);
78
79
  background-size: var(--pf-v5-c-about-modal-box--BackgroundSize);
package/components/AboutModalBox/about-modal-box.scss CHANGED
@@ -2,6 +2,7 @@
2
2
 
3
3
  .#{$about-modal-box} {
4
4
  // Component variables
5
+ --#{$about-modal-box}--BackgroundImage: none;
5
6
  --#{$about-modal-box}--BackgroundColor: var(--#{$pf-global}--palette--black-1000); // Modal uses a non-standard background color
6
7
  --#{$about-modal-box}--BackgroundPosition: bottom right;
7
8
  --#{$about-modal-box}--BackgroundSize--min-width: 200px;
@@ -110,7 +111,7 @@
110
111
  overflow-x: hidden;
111
112
  overflow-y: auto;
112
113
  background-color: var(--#{$about-modal-box}--BackgroundColor); // Because this component is always dark, set the background color
113
- background-image: var(--#{$about-modal-box}--BackgroundImage, none);
114
+ background-image: var(--#{$about-modal-box}--BackgroundImage);
114
115
  background-repeat: no-repeat;
115
116
  background-position: var(--#{$about-modal-box}--BackgroundPosition);
116
117
  background-size: var(--#{$about-modal-box}--BackgroundSize);
package/components/TreeView/tree-view.scss CHANGED
@@ -1,5 +1,5 @@
1
1
  // @debug $tree-view; // check your variable names located in src/patternfly/sass-utilities/component-namespaces.scss
2
- $pf-v5-c-tree-view--MaxNesting: 10;
2
+ $pf-v5-c-tree-view--MaxNesting: 10 !default;
3
3
 
4
4
  .#{$tree-view} {
5
5
  --#{$tree-view}--PaddingTop: var(--#{$pf-global}--spacer--sm);
package/docs/components/Badge/examples/Badge.md CHANGED
@@ -17,10 +17,22 @@ cssPrefix: pf-v5-c-badge
17
17
  ### Unread
18
18
 
19
19
  ```html
20
- <span class="pf-v5-c-badge pf-m-unread">7</span>
21
- <span class="pf-v5-c-badge pf-m-unread">24</span>
22
- <span class="pf-v5-c-badge pf-m-unread">240</span>
23
- <span class="pf-v5-c-badge pf-m-unread">999+</span>
20
+ <span class="pf-v5-c-badge pf-m-unread">
21
+ 7
22
+ <span class="pf-v5-screen-reader">unread messages</span>
23
+ </span>
24
+ <span class="pf-v5-c-badge pf-m-unread">
25
+ 24
26
+ <span class="pf-v5-screen-reader">unread messages</span>
27
+ </span>
28
+ <span class="pf-v5-c-badge pf-m-unread">
29
+ 240
30
+ <span class="pf-v5-screen-reader">unread messages</span>
31
+ </span>
32
+ <span class="pf-v5-c-badge pf-m-unread">
33
+ 999+
34
+ <span class="pf-v5-screen-reader">unread messages</span>
35
+ </span>
24
36
 
25
37
  ```
26
38
 
package/docs/components/Chip/examples/Chip.md CHANGED
@@ -93,7 +93,11 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
93
93
  ### Simple inline chip group with overflow
94
94
 
95
95
  ```html
96
- <div class="pf-v5-c-chip-group">
96
+ <div
97
+ class="pf-v5-c-chip-group"
98
+ role="group"
99
+ aria-label="simple inline chip group with overflow"
100
+ >
97
101
  <div class="pf-v5-c-chip-group__main">
98
102
  <ul
99
103
  class="pf-v5-c-chip-group__list"
@@ -179,7 +183,11 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
179
183
  ### Simple inline chip group expanded
180
184
 
181
185
  ```html
182
- <div class="pf-v5-c-chip-group">
186
+ <div
187
+ class="pf-v5-c-chip-group"
188
+ role="group"
189
+ aria-label="simple inline chip group expanded"
190
+ >
183
191
  <div class="pf-v5-c-chip-group__main">
184
192
  <ul
185
193
  class="pf-v5-c-chip-group__list"
@@ -307,11 +315,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
307
315
  ### Chip group with categories
308
316
 
309
317
  ```html
310
- <div class="pf-v5-c-chip-group pf-m-category">
318
+ <div
319
+ class="pf-v5-c-chip-group pf-m-category"
320
+ role="group"
321
+ aria-labelledby="chip-group-with-categories-label"
322
+ >
311
323
  <div class="pf-v5-c-chip-group__main">
312
324
  <span
313
325
  class="pf-v5-c-chip-group__label"
314
- aria-hidden="true"
315
326
  id="chip-group-with-categories-label"
316
327
  >Category one</span>
317
328
  <ul
@@ -391,11 +402,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
391
402
  ### Chip group with categories and overflow
392
403
 
393
404
  ```html
394
- <div class="pf-v5-c-chip-group pf-m-category">
405
+ <div
406
+ class="pf-v5-c-chip-group pf-m-category"
407
+ role="group"
408
+ aria-labelledby="chip-group-with-categories-overflow-label"
409
+ >
395
410
  <div class="pf-v5-c-chip-group__main">
396
411
  <span
397
412
  class="pf-v5-c-chip-group__label"
398
- aria-hidden="true"
399
413
  id="chip-group-with-categories-overflow-label"
400
414
  >Category one</span>
401
415
  <ul
@@ -482,11 +496,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
482
496
  ### Chip group with categories and overflow expanded
483
497
 
484
498
  ```html
485
- <div class="pf-v5-c-chip-group pf-m-category">
499
+ <div
500
+ class="pf-v5-c-chip-group pf-m-category"
501
+ role="group"
502
+ aria-labelledby="chip-group-with-categories-overflow-expanded-label"
503
+ >
486
504
  <div class="pf-v5-c-chip-group__main">
487
505
  <span
488
506
  class="pf-v5-c-chip-group__label"
489
- aria-hidden="true"
490
507
  id="chip-group-with-categories-overflow-expanded-label"
491
508
  >Category one</span>
492
509
  <ul
@@ -615,11 +632,14 @@ cssPrefix: ['pf-v5-c-chip', 'pf-v5-c-chip-group']
615
632
  ### Chip group with removable categories
616
633
 
617
634
  ```html
618
- <div class="pf-v5-c-chip-group pf-m-category">
635
+ <div
636
+ class="pf-v5-c-chip-group pf-m-category"
637
+ role="group"
638
+ aria-labelledby="chip-group-with-categories-removable-label"
639
+ >
619
640
  <div class="pf-v5-c-chip-group__main">
620
641
  <span
621
642
  class="pf-v5-c-chip-group__label"
622
- aria-hidden="true"
623
643
  id="chip-group-with-categories-removable-label"
624
644
  >Category one</span>
625
645
  <ul
package/docs/components/Select/deprecated/Select.md CHANGED
@@ -1022,7 +1022,7 @@ The single select typeahead should be used when the user is selecting one option
1022
1022
 
1023
1023
  <div class="pf-v5-c-select__toggle pf-m-typeahead">
1024
1024
  <div class="pf-v5-c-select__toggle-wrapper">
1025
- <div class="pf-v5-c-chip-group">
1025
+ <div class="pf-v5-c-chip-group" role="group">
1026
1026
  <div class="pf-v5-c-chip-group__main">
1027
1027
  <ul
1028
1028
  class="pf-v5-c-chip-group__list"
@@ -1208,7 +1208,7 @@ The single select typeahead should be used when the user is selecting one option
1208
1208
 
1209
1209
  <div class="pf-v5-c-select__toggle pf-m-typeahead">
1210
1210
  <div class="pf-v5-c-select__toggle-wrapper">
1211
- <div class="pf-v5-c-chip-group">
1211
+ <div class="pf-v5-c-chip-group" role="group">
1212
1212
  <div class="pf-v5-c-chip-group__main">
1213
1213
  <ul
1214
1214
  class="pf-v5-c-chip-group__list"
@@ -1350,7 +1350,7 @@ The single select typeahead should be used when the user is selecting one option
1350
1350
 
1351
1351
  <div class="pf-v5-c-select__toggle pf-m-typeahead">
1352
1352
  <div class="pf-v5-c-select__toggle-wrapper">
1353
- <div class="pf-v5-c-chip-group">
1353
+ <div class="pf-v5-c-chip-group" role="group">
1354
1354
  <div class="pf-v5-c-chip-group__main">
1355
1355
  <ul
1356
1356
  class="pf-v5-c-chip-group__list"
package/docs/components/TextInputGroup/examples/TextInputGroup.md CHANGED
@@ -79,7 +79,7 @@ cssPrefix: pf-v5-c-text-input-group
79
79
  ```html
80
80
  <div class="pf-v5-c-text-input-group">
81
81
  <div class="pf-v5-c-text-input-group__main">
82
- <div class="pf-v5-c-chip-group">
82
+ <div class="pf-v5-c-chip-group" role="group">
83
83
  <div class="pf-v5-c-chip-group__main">
84
84
  <ul
85
85
  class="pf-v5-c-chip-group__list"
@@ -249,7 +249,7 @@ cssPrefix: pf-v5-c-text-input-group
249
249
  ```html
250
250
  <div class="pf-v5-c-text-input-group">
251
251
  <div class="pf-v5-c-text-input-group__main">
252
- <div class="pf-v5-c-chip-group">
252
+ <div class="pf-v5-c-chip-group" role="group">
253
253
  <div class="pf-v5-c-chip-group__main">
254
254
  <ul
255
255
  class="pf-v5-c-chip-group__list"
package/docs/components/Toolbar/examples/Toolbar.md CHANGED
@@ -1551,11 +1551,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1551
1551
  >
1552
1552
  <div class="pf-v5-c-toolbar__group pf-m-chip-container">
1553
1553
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
1554
- <div class="pf-v5-c-chip-group pf-m-category">
1554
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
1555
1555
  <div class="pf-v5-c-chip-group__main">
1556
1556
  <span
1557
1557
  class="pf-v5-c-chip-group__label"
1558
- aria-hidden="true"
1559
1558
  id="toolbar-selected-filters-toggle-group-collapsed-example-chip-group-status-chip-group-label"
1560
1559
  >Status</span>
1561
1560
  <ul
@@ -1631,11 +1630,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1631
1630
  </div>
1632
1631
  </div>
1633
1632
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
1634
- <div class="pf-v5-c-chip-group pf-m-category">
1633
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
1635
1634
  <div class="pf-v5-c-chip-group__main">
1636
1635
  <span
1637
1636
  class="pf-v5-c-chip-group__label"
1638
- aria-hidden="true"
1639
1637
  id="toolbar-selected-filters-toggle-group-collapsed-example-chip-group-risk-chip-group-label"
1640
1638
  >Risk</span>
1641
1639
  <ul
@@ -2138,11 +2136,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
2138
2136
  <div class="pf-v5-c-toolbar__group pf-m-chip-container">
2139
2137
  <div class="pf-v5-c-toolbar__group">
2140
2138
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2141
- <div class="pf-v5-c-chip-group pf-m-category">
2139
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2142
2140
  <div class="pf-v5-c-chip-group__main">
2143
2141
  <span
2144
2142
  class="pf-v5-c-chip-group__label"
2145
- aria-hidden="true"
2146
2143
  id="toolbar-selected-filters-toggle-group-expanded-example-chip-group-status-chip-group-label"
2147
2144
  >Status</span>
2148
2145
  <ul
@@ -2218,11 +2215,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
2218
2215
  </div>
2219
2216
  </div>
2220
2217
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2221
- <div class="pf-v5-c-chip-group pf-m-category">
2218
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2222
2219
  <div class="pf-v5-c-chip-group__main">
2223
2220
  <span
2224
2221
  class="pf-v5-c-chip-group__label"
2225
- aria-hidden="true"
2226
2222
  id="toolbar-selected-filters-toggle-group-expanded-example-chip-group-risk-chip-group-label"
2227
2223
  >Risk</span>
2228
2224
  <ul
@@ -2676,11 +2672,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
2676
2672
  <div class="pf-v5-c-toolbar__content pf-m-chip-container">
2677
2673
  <div class="pf-v5-c-toolbar__group">
2678
2674
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2679
- <div class="pf-v5-c-chip-group pf-m-category">
2675
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2680
2676
  <div class="pf-v5-c-chip-group__main">
2681
2677
  <span
2682
2678
  class="pf-v5-c-chip-group__label"
2683
- aria-hidden="true"
2684
2679
  id="toolbar-selected-filters-example-chip-group-status-chip-group-label"
2685
2680
  >Status</span>
2686
2681
  <ul
@@ -2756,11 +2751,10 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
2756
2751
  </div>
2757
2752
  </div>
2758
2753
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2759
- <div class="pf-v5-c-chip-group pf-m-category">
2754
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2760
2755
  <div class="pf-v5-c-chip-group__main">
2761
2756
  <span
2762
2757
  class="pf-v5-c-chip-group__label"
2763
- aria-hidden="true"
2764
2758
  id="toolbar-selected-filters-example-chip-group-risk-chip-group-label"
2765
2759
  >Risk</span>
2766
2760
  <ul
package/docs/components/Wizard/examples/Wizard.md CHANGED
@@ -51,30 +51,38 @@ wrapperTag: div
51
51
  <nav class="pf-v5-c-wizard__nav" aria-label="Steps">
52
52
  <ol class="pf-v5-c-wizard__nav-list" role="list">
53
53
  <li class="pf-v5-c-wizard__nav-item">
54
- <button class="pf-v5-c-wizard__nav-link">Information</button>
54
+ <button class="pf-v5-c-wizard__nav-link" type="button">Information</button>
55
55
  </li>
56
56
  <li class="pf-v5-c-wizard__nav-item">
57
- <button class="pf-v5-c-wizard__nav-link pf-m-current">Configuration</button>
57
+ <button
58
+ class="pf-v5-c-wizard__nav-link pf-m-current"
59
+ type="button"
60
+ >Configuration</button>
58
61
  <ol class="pf-v5-c-wizard__nav-list" role="list">
59
62
  <li class="pf-v5-c-wizard__nav-item">
60
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
63
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
61
64
  </li>
62
65
  <li class="pf-v5-c-wizard__nav-item">
63
66
  <button
64
67
  class="pf-v5-c-wizard__nav-link pf-m-current"
68
+ type="button"
65
69
  aria-current="page"
66
70
  >Substep B</button>
67
71
  </li>
68
72
  <li class="pf-v5-c-wizard__nav-item">
69
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
73
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
70
74
  </li>
71
75
  </ol>
72
76
  </li>
73
77
  <li class="pf-v5-c-wizard__nav-item">
74
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
78
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
75
79
  </li>
76
80
  <li class="pf-v5-c-wizard__nav-item">
77
- <button class="pf-v5-c-wizard__nav-link" disabled>Review</button>
81
+ <button
82
+ class="pf-v5-c-wizard__nav-link"
83
+ type="button"
84
+ disabled
85
+ >Review</button>
78
86
  </li>
79
87
  </ol>
80
88
  </nav>
@@ -281,30 +289,38 @@ wrapperTag: div
281
289
  <nav class="pf-v5-c-wizard__nav pf-m-expanded" aria-label="Steps">
282
290
  <ol class="pf-v5-c-wizard__nav-list" role="list">
283
291
  <li class="pf-v5-c-wizard__nav-item">
284
- <button class="pf-v5-c-wizard__nav-link">Information</button>
292
+ <button class="pf-v5-c-wizard__nav-link" type="button">Information</button>
285
293
  </li>
286
294
  <li class="pf-v5-c-wizard__nav-item">
287
- <button class="pf-v5-c-wizard__nav-link pf-m-current">Configuration</button>
295
+ <button
296
+ class="pf-v5-c-wizard__nav-link pf-m-current"
297
+ type="button"
298
+ >Configuration</button>
288
299
  <ol class="pf-v5-c-wizard__nav-list" role="list">
289
300
  <li class="pf-v5-c-wizard__nav-item">
290
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
301
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
291
302
  </li>
292
303
  <li class="pf-v5-c-wizard__nav-item">
293
304
  <button
294
305
  class="pf-v5-c-wizard__nav-link pf-m-current"
306
+ type="button"
295
307
  aria-current="page"
296
308
  >Substep B</button>
297
309
  </li>
298
310
  <li class="pf-v5-c-wizard__nav-item">
299
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
311
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
300
312
  </li>
301
313
  </ol>
302
314
  </li>
303
315
  <li class="pf-v5-c-wizard__nav-item">
304
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
316
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
305
317
  </li>
306
318
  <li class="pf-v5-c-wizard__nav-item">
307
- <button class="pf-v5-c-wizard__nav-link" disabled>Review</button>
319
+ <button
320
+ class="pf-v5-c-wizard__nav-link"
321
+ type="button"
322
+ disabled
323
+ >Review</button>
308
324
  </li>
309
325
  </ol>
310
326
  </nav>
@@ -462,30 +478,38 @@ wrapperTag: div
462
478
  <nav class="pf-v5-c-wizard__nav" aria-label="Steps">
463
479
  <ol class="pf-v5-c-wizard__nav-list" role="list">
464
480
  <li class="pf-v5-c-wizard__nav-item">
465
- <button class="pf-v5-c-wizard__nav-link">Information</button>
481
+ <button class="pf-v5-c-wizard__nav-link" type="button">Information</button>
466
482
  </li>
467
483
  <li class="pf-v5-c-wizard__nav-item">
468
- <button class="pf-v5-c-wizard__nav-link pf-m-current">Configuration</button>
484
+ <button
485
+ class="pf-v5-c-wizard__nav-link pf-m-current"
486
+ type="button"
487
+ >Configuration</button>
469
488
  <ol class="pf-v5-c-wizard__nav-list" role="list">
470
489
  <li class="pf-v5-c-wizard__nav-item">
471
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
490
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
472
491
  </li>
473
492
  <li class="pf-v5-c-wizard__nav-item">
474
493
  <button
475
494
  class="pf-v5-c-wizard__nav-link pf-m-current"
495
+ type="button"
476
496
  aria-current="page"
477
497
  >Substep B</button>
478
498
  </li>
479
499
  <li class="pf-v5-c-wizard__nav-item">
480
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
500
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
481
501
  </li>
482
502
  </ol>
483
503
  </li>
484
504
  <li class="pf-v5-c-wizard__nav-item">
485
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
505
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
486
506
  </li>
487
507
  <li class="pf-v5-c-wizard__nav-item">
488
- <button class="pf-v5-c-wizard__nav-link" disabled>Review</button>
508
+ <button
509
+ class="pf-v5-c-wizard__nav-link"
510
+ type="button"
511
+ disabled
512
+ >Review</button>
489
513
  </li>
490
514
  </ol>
491
515
  </nav>
@@ -721,11 +745,16 @@ wrapperTag: div
721
745
  <li class="pf-v5-c-wizard__nav-item">
722
746
  <button
723
747
  class="pf-v5-c-wizard__nav-link pf-m-current"
748
+ type="button"
724
749
  aria-current="page"
725
750
  >Information</button>
726
751
  </li>
727
752
  <li class="pf-v5-c-wizard__nav-item pf-m-expandable">
728
- <button class="pf-v5-c-wizard__nav-link" aria-expanded="false">
753
+ <button
754
+ class="pf-v5-c-wizard__nav-link"
755
+ type="button"
756
+ aria-expanded="false"
757
+ >
729
758
  <span class="pf-v5-c-wizard__nav-link-text">Configuration</span>
730
759
  <span class="pf-v5-c-wizard__nav-link-toggle">
731
760
  <span class="pf-v5-c-wizard__nav-link-toggle-icon">
@@ -735,21 +764,25 @@ wrapperTag: div
735
764
  </button>
736
765
  <ol class="pf-v5-c-wizard__nav-list" role="list">
737
766
  <li class="pf-v5-c-wizard__nav-item">
738
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
767
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
739
768
  </li>
740
769
  <li class="pf-v5-c-wizard__nav-item">
741
- <button class="pf-v5-c-wizard__nav-link">Substep B</button>
770
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep B</button>
742
771
  </li>
743
772
  <li class="pf-v5-c-wizard__nav-item">
744
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
773
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
745
774
  </li>
746
775
  </ol>
747
776
  </li>
748
777
  <li class="pf-v5-c-wizard__nav-item">
749
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
778
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
750
779
  </li>
751
780
  <li class="pf-v5-c-wizard__nav-item">
752
- <button class="pf-v5-c-wizard__nav-link" disabled>Review</button>
781
+ <button
782
+ class="pf-v5-c-wizard__nav-link"
783
+ type="button"
784
+ disabled
785
+ >Review</button>
753
786
  </li>
754
787
  </ol>
755
788
  </nav>
@@ -956,11 +989,12 @@ wrapperTag: div
956
989
  <nav class="pf-v5-c-wizard__nav" aria-label="Steps">
957
990
  <ol class="pf-v5-c-wizard__nav-list" role="list">
958
991
  <li class="pf-v5-c-wizard__nav-item">
959
- <button class="pf-v5-c-wizard__nav-link">Information</button>
992
+ <button class="pf-v5-c-wizard__nav-link" type="button">Information</button>
960
993
  </li>
961
994
  <li class="pf-v5-c-wizard__nav-item pf-m-expandable pf-m-expanded">
962
995
  <button
963
996
  class="pf-v5-c-wizard__nav-link pf-m-current"
997
+ type="button"
964
998
  aria-expanded="true"
965
999
  >
966
1000
  <span class="pf-v5-c-wizard__nav-link-text">Configuration</span>
@@ -972,24 +1006,29 @@ wrapperTag: div
972
1006
  </button>
973
1007
  <ol class="pf-v5-c-wizard__nav-list" role="list">
974
1008
  <li class="pf-v5-c-wizard__nav-item">
975
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
1009
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
976
1010
  </li>
977
1011
  <li class="pf-v5-c-wizard__nav-item">
978
1012
  <button
979
1013
  class="pf-v5-c-wizard__nav-link pf-m-current"
1014
+ type="button"
980
1015
  aria-current="page"
981
1016
  >Substep B</button>
982
1017
  </li>
983
1018
  <li class="pf-v5-c-wizard__nav-item">
984
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
1019
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
985
1020
  </li>
986
1021
  </ol>
987
1022
  </li>
988
1023
  <li class="pf-v5-c-wizard__nav-item">
989
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
1024
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
990
1025
  </li>
991
1026
  <li class="pf-v5-c-wizard__nav-item">
992
- <button class="pf-v5-c-wizard__nav-link" disabled>Review</button>
1027
+ <button
1028
+ class="pf-v5-c-wizard__nav-link"
1029
+ type="button"
1030
+ disabled
1031
+ >Review</button>
993
1032
  </li>
994
1033
  </ol>
995
1034
  </nav>
@@ -1196,27 +1235,27 @@ wrapperTag: div
1196
1235
  <nav class="pf-v5-c-wizard__nav" aria-label="Steps">
1197
1236
  <ol class="pf-v5-c-wizard__nav-list" role="list">
1198
1237
  <li class="pf-v5-c-wizard__nav-item">
1199
- <button class="pf-v5-c-wizard__nav-link">Information</button>
1238
+ <button class="pf-v5-c-wizard__nav-link" type="button">Information</button>
1200
1239
  </li>
1201
1240
  <li class="pf-v5-c-wizard__nav-item">
1202
- <button class="pf-v5-c-wizard__nav-link">Configuration</button>
1241
+ <button class="pf-v5-c-wizard__nav-link" type="button">Configuration</button>
1203
1242
  <ol class="pf-v5-c-wizard__nav-list" role="list">
1204
1243
  <li class="pf-v5-c-wizard__nav-item">
1205
- <button class="pf-v5-c-wizard__nav-link">Substep A</button>
1244
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep A</button>
1206
1245
  </li>
1207
1246
  <li class="pf-v5-c-wizard__nav-item">
1208
- <button class="pf-v5-c-wizard__nav-link">Substep B</button>
1247
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep B</button>
1209
1248
  </li>
1210
1249
  <li class="pf-v5-c-wizard__nav-item">
1211
- <button class="pf-v5-c-wizard__nav-link">Substep C</button>
1250
+ <button class="pf-v5-c-wizard__nav-link" type="button">Substep C</button>
1212
1251
  </li>
1213
1252
  </ol>
1214
1253
  </li>
1215
1254
  <li class="pf-v5-c-wizard__nav-item">
1216
- <button class="pf-v5-c-wizard__nav-link">Additional</button>
1255
+ <button class="pf-v5-c-wizard__nav-link" type="button">Additional</button>
1217
1256
  </li>
1218
1257
  <li class="pf-v5-c-wizard__nav-item">
1219
- <button class="pf-v5-c-wizard__nav-link">Review</button>
1258
+ <button class="pf-v5-c-wizard__nav-link" type="button">Review</button>
1220
1259
  </li>
1221
1260
  </ol>
1222
1261
  </nav>
package/docs/demos/Toolbar/examples/Toolbar.md CHANGED
@@ -2392,11 +2392,10 @@ section: components
2392
2392
  </div>
2393
2393
  <div class="pf-v5-c-toolbar__content pf-m-chip-container">
2394
2394
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2395
- <div class="pf-v5-c-chip-group pf-m-category">
2395
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2396
2396
  <div class="pf-v5-c-chip-group__main">
2397
2397
  <span
2398
2398
  class="pf-v5-c-chip-group__label"
2399
- aria-hidden="true"
2400
2399
  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-group-chip-group-label"
2401
2400
  >Status</span>
2402
2401
  <ul
@@ -2782,11 +2781,10 @@ section: components
2782
2781
  </div>
2783
2782
  </div>
2784
2783
  <div class="pf-v5-c-toolbar__item pf-m-chip-group">
2785
- <div class="pf-v5-c-chip-group pf-m-category">
2784
+ <div class="pf-v5-c-chip-group pf-m-category" role="group">
2786
2785
  <div class="pf-v5-c-chip-group__main">
2787
2786
  <span
2788
2787
  class="pf-v5-c-chip-group__label"
2789
- aria-hidden="true"
2790
2788
  id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-group-chip-group-label"
2791
2789
  >Status</span>
2792
2790
  <ul