@patternfly/patternfly 5.0.0-alpha.13 → 5.0.0-alpha.14

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 (48) hide show
  1. package/components/DataList/data-list.css +0 -1
  2. package/components/DataList/data-list.scss +0 -1
  3. package/docs/components/AlertGroup/examples/AlertGroup.md +2 -2
  4. package/docs/components/AppLauncher/examples/application-launcher.md +17 -12
  5. package/docs/components/Breadcrumb/examples/Breadcrumb.md +5 -5
  6. package/docs/components/ContextSelector/examples/context-selector.md +6 -6
  7. package/docs/components/Divider/examples/Divider.md +1 -1
  8. package/docs/components/HelperText/examples/HelperText.md +1 -1
  9. package/docs/components/JumpLinks/examples/JumpLinks.md +14 -14
  10. package/docs/components/List/examples/List.md +12 -12
  11. package/docs/components/Login/examples/Login.md +10 -10
  12. package/docs/components/Menu/examples/Menu.md +3 -3
  13. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +3 -3
  14. package/docs/components/Nav/examples/Navigation.md +33 -33
  15. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +5 -5
  16. package/docs/components/ProgressStepper/examples/ProgressStepper.md +21 -14
  17. package/docs/components/SimpleList/examples/SimpleList.md +4 -4
  18. package/docs/components/Wizard/examples/Wizard.md +12 -12
  19. package/docs/demos/AboutModal/examples/AboutModal.md +4 -4
  20. package/docs/demos/Alert/examples/Alert.md +13 -13
  21. package/docs/demos/BackToTop/examples/BackToTop.md +4 -4
  22. package/docs/demos/Banner/examples/Banner.md +8 -8
  23. package/docs/demos/Card/examples/Card.md +7 -7
  24. package/docs/demos/CardView/examples/CardView.md +7 -7
  25. package/docs/demos/ContextSelector/examples/ContextSelector.md +18 -18
  26. package/docs/demos/Dashboard/examples/Dashboard.md +9 -5
  27. package/docs/demos/DataList/examples/DataList.md +18 -18
  28. package/docs/demos/DescriptionList/examples/DescriptionList.md +12 -12
  29. package/docs/demos/Drawer/examples/Drawer.md +20 -20
  30. package/docs/demos/HelperText/examples/HelperText.md +8 -8
  31. package/docs/demos/JumpLinks/examples/JumpLinks.md +28 -28
  32. package/docs/demos/Masthead/examples/Masthead.md +23 -23
  33. package/docs/demos/Modal/examples/Modal.md +24 -24
  34. package/docs/demos/Nav/examples/Nav.md +47 -47
  35. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +40 -28
  36. package/docs/demos/Page/examples/Page.md +36 -36
  37. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +32 -32
  38. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +30 -30
  39. package/docs/demos/Skeleton/examples/Skeleton.md +4 -4
  40. package/docs/demos/Table/examples/Table.md +56 -56
  41. package/docs/demos/Tabs/examples/Tabs.md +25 -25
  42. package/docs/demos/Toolbar/examples/Toolbar.md +8 -8
  43. package/docs/demos/Wizard/examples/Wizard.md +54 -54
  44. package/package.json +1 -1
  45. package/patternfly-no-reset.css +0 -1
  46. package/patternfly.css +0 -1
  47. package/patternfly.min.css +1 -1
  48. package/patternfly.min.css.map +1 -1
package/docs/components/Nav/examples/Navigation.md CHANGED
@@ -10,7 +10,7 @@ cssPrefix: pf-c-nav
10
10
 
11
11
  ```html
12
12
  <nav class="pf-c-nav" aria-label="Global">
13
- <ul class="pf-c-nav__list">
13
+ <ul class="pf-c-nav__list" role="list">
14
14
  <li class="pf-c-nav__item">
15
15
  <a href="#" class="pf-c-nav__link">Link 1</a>
16
16
  </li>
@@ -38,7 +38,7 @@ cssPrefix: pf-c-nav
38
38
  <nav class="pf-c-nav" aria-label="Global">
39
39
  <section class="pf-c-nav__section" aria-labelledby="grouped-title1">
40
40
  <h2 class="pf-c-nav__section-title" id="grouped-title1">Section title 1</h2>
41
- <ul class="pf-c-nav__list">
41
+ <ul class="pf-c-nav__list" role="list">
42
42
  <li class="pf-c-nav__item">
43
43
  <a href="#" class="pf-c-nav__link">Link 1</a>
44
44
  </li>
@@ -52,7 +52,7 @@ cssPrefix: pf-c-nav
52
52
  </section>
53
53
  <section class="pf-c-nav__section" aria-labelledby="grouped-title2">
54
54
  <h2 class="pf-c-nav__section-title" id="grouped-title2">Section title 2</h2>
55
- <ul class="pf-c-nav__list">
55
+ <ul class="pf-c-nav__list" role="list">
56
56
  <li class="pf-c-nav__item">
57
57
  <a href="#" class="pf-c-nav__link">Link 1</a>
58
58
  </li>
@@ -77,7 +77,7 @@ cssPrefix: pf-c-nav
77
77
  ```html
78
78
  <nav class="pf-c-nav" aria-label="Global">
79
79
  <section class="pf-c-nav__section pf-m-no-title" aria-label="Section one">
80
- <ul class="pf-c-nav__list">
80
+ <ul class="pf-c-nav__list" role="list">
81
81
  <li class="pf-c-nav__item">
82
82
  <a href="#" class="pf-c-nav__link">Link 1</a>
83
83
  </li>
@@ -91,7 +91,7 @@ cssPrefix: pf-c-nav
91
91
  </section>
92
92
  <hr class="pf-c-divider" />
93
93
  <section class="pf-c-nav__section pf-m-no-title" aria-label="Section two">
94
- <ul class="pf-c-nav__list">
94
+ <ul class="pf-c-nav__list" role="list">
95
95
  <li class="pf-c-nav__item">
96
96
  <a href="#" class="pf-c-nav__link">Section 2, link 1</a>
97
97
  </li>
@@ -116,7 +116,7 @@ cssPrefix: pf-c-nav
116
116
  ```html
117
117
  <nav class="pf-c-nav" aria-label="Global">
118
118
  <section class="pf-c-nav__section pf-m-no-title" aria-label="Section one">
119
- <ul class="pf-c-nav__list">
119
+ <ul class="pf-c-nav__list" role="list">
120
120
  <li class="pf-c-nav__item">
121
121
  <a href="#" class="pf-c-nav__link">Link 1</a>
122
122
  </li>
@@ -129,7 +129,7 @@ cssPrefix: pf-c-nav
129
129
  </ul>
130
130
  </section>
131
131
  <section class="pf-c-nav__section pf-m-no-title" aria-label="Section two">
132
- <ul class="pf-c-nav__list">
132
+ <ul class="pf-c-nav__list" role="list">
133
133
  <li class="pf-c-nav__item">
134
134
  <a href="#" class="pf-c-nav__link">Section 2, link 1</a>
135
135
  </li>
@@ -153,7 +153,7 @@ cssPrefix: pf-c-nav
153
153
 
154
154
  ```html
155
155
  <nav class="pf-c-nav" aria-label="Global">
156
- <ul class="pf-c-nav__list">
156
+ <ul class="pf-c-nav__list" role="list">
157
157
  <li class="pf-c-nav__item pf-m-expandable pf-m-expanded pf-m-current">
158
158
  <button
159
159
  class="pf-c-nav__link"
@@ -168,7 +168,7 @@ cssPrefix: pf-c-nav
168
168
  </span>
169
169
  </button>
170
170
  <section class="pf-c-nav__subnav" aria-labelledby="expandable-example1">
171
- <ul class="pf-c-nav__list">
171
+ <ul class="pf-c-nav__list" role="list">
172
172
  <li class="pf-c-nav__item">
173
173
  <a href="#" class="pf-c-nav__link">Current link</a>
174
174
  </li>
@@ -202,7 +202,7 @@ cssPrefix: pf-c-nav
202
202
  </span>
203
203
  </button>
204
204
  <section class="pf-c-nav__subnav" aria-labelledby="expandable-example2">
205
- <ul class="pf-c-nav__list">
205
+ <ul class="pf-c-nav__list" role="list">
206
206
  <li class="pf-c-nav__item">
207
207
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
208
208
  </li>
@@ -230,7 +230,7 @@ cssPrefix: pf-c-nav
230
230
  aria-labelledby="expandable-example3"
231
231
  hidden
232
232
  >
233
- <ul class="pf-c-nav__list">
233
+ <ul class="pf-c-nav__list" role="list">
234
234
  <li class="pf-c-nav__item">
235
235
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
236
236
  </li>
@@ -249,7 +249,7 @@ cssPrefix: pf-c-nav
249
249
 
250
250
  ```html
251
251
  <nav class="pf-c-nav" aria-label="Global">
252
- <ul class="pf-c-nav__list">
252
+ <ul class="pf-c-nav__list" role="list">
253
253
  <li class="pf-c-nav__item pf-m-expandable pf-m-expanded pf-m-current">
254
254
  <button class="pf-c-nav__link" aria-expanded="true">
255
255
  Link 1
@@ -264,7 +264,7 @@ cssPrefix: pf-c-nav
264
264
  class="pf-c-nav__subnav-title pf-screen-reader"
265
265
  id="subnav-title1"
266
266
  >Current and expanded example sub-navigation</h2>
267
- <ul class="pf-c-nav__list">
267
+ <ul class="pf-c-nav__list" role="list">
268
268
  <li class="pf-c-nav__item">
269
269
  <a href="#" class="pf-c-nav__link">Current link</a>
270
270
  </li>
@@ -295,7 +295,7 @@ cssPrefix: pf-c-nav
295
295
  class="pf-c-nav__subnav-title pf-screen-reader"
296
296
  id="subnav-title2"
297
297
  >Expanded, but not current example sub-navigation</h2>
298
- <ul class="pf-c-nav__list">
298
+ <ul class="pf-c-nav__list" role="list">
299
299
  <li class="pf-c-nav__item">
300
300
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
301
301
  </li>
@@ -314,7 +314,7 @@ cssPrefix: pf-c-nav
314
314
 
315
315
  ```html
316
316
  <nav class="pf-c-nav" aria-label="Global">
317
- <ul class="pf-c-nav__list">
317
+ <ul class="pf-c-nav__list" role="list">
318
318
  <li class="pf-c-nav__item">
319
319
  <a href="#" class="pf-c-nav__link">Link 1 (not expandable)</a>
320
320
  </li>
@@ -330,7 +330,7 @@ cssPrefix: pf-c-nav
330
330
  </span>
331
331
  </button>
332
332
  <section class="pf-c-nav__subnav" aria-labelledby="nav-mixed-link2">
333
- <ul class="pf-c-nav__list">
333
+ <ul class="pf-c-nav__list" role="list">
334
334
  <li class="pf-c-nav__item">
335
335
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
336
336
  </li>
@@ -356,7 +356,7 @@ cssPrefix: pf-c-nav
356
356
  aria-labelledby="nav-mixed-link4"
357
357
  hidden
358
358
  >
359
- <ul class="pf-c-nav__list">
359
+ <ul class="pf-c-nav__list" role="list">
360
360
  <li class="pf-c-nav__item">
361
361
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
362
362
  </li>
@@ -382,7 +382,7 @@ cssPrefix: pf-c-nav
382
382
 
383
383
  ```html
384
384
  <nav class="pf-c-nav" aria-label="Global">
385
- <ul class="pf-c-nav__list">
385
+ <ul class="pf-c-nav__list" role="list">
386
386
  <li class="pf-c-nav__item">
387
387
  <a href="#" class="pf-c-nav__link">Clusters</a>
388
388
  </li>
@@ -410,7 +410,7 @@ cssPrefix: pf-c-nav
410
410
  aria-labelledby="expandable-third-level-example-example-1"
411
411
  hidden
412
412
  >
413
- <ul class="pf-c-nav__list">
413
+ <ul class="pf-c-nav__list" role="list">
414
414
  <li class="pf-c-nav__item">
415
415
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
416
416
  </li>
@@ -437,7 +437,7 @@ cssPrefix: pf-c-nav
437
437
  class="pf-c-nav__subnav"
438
438
  aria-labelledby="expandable-third-level-example-example-2"
439
439
  >
440
- <ul class="pf-c-nav__list">
440
+ <ul class="pf-c-nav__list" role="list">
441
441
  <li class="pf-c-nav__item">
442
442
  <a href="#" class="pf-c-nav__link">Overview</a>
443
443
  </li>
@@ -461,7 +461,7 @@ cssPrefix: pf-c-nav
461
461
  class="pf-c-nav__subnav"
462
462
  aria-labelledby="expandable-third-level-example-sub-example-1"
463
463
  >
464
- <ul class="pf-c-nav__list">
464
+ <ul class="pf-c-nav__list" role="list">
465
465
  <li class="pf-c-nav__item">
466
466
  <a href="#" class="pf-c-nav__link">Amazon Web Services</a>
467
467
  </li>
@@ -498,7 +498,7 @@ cssPrefix: pf-c-nav
498
498
  <button class="pf-c-nav__scroll-button" disabled aria-label="Scroll left">
499
499
  <i class="fas fa-angle-left" aria-hidden="true"></i>
500
500
  </button>
501
- <ul class="pf-c-nav__list">
501
+ <ul class="pf-c-nav__list" role="list">
502
502
  <li class="pf-c-nav__item">
503
503
  <a href="#" class="pf-c-nav__link pf-m-current" aria-current="page">Item 1</a>
504
504
  </li>
@@ -523,7 +523,7 @@ cssPrefix: pf-c-nav
523
523
  <button class="pf-c-nav__scroll-button" disabled aria-label="Scroll left">
524
524
  <i class="fas fa-angle-left" aria-hidden="true"></i>
525
525
  </button>
526
- <ul class="pf-c-nav__list">
526
+ <ul class="pf-c-nav__list" role="list">
527
527
  <li class="pf-c-nav__item">
528
528
  <a href="#" class="pf-c-nav__link">Horizontal nav item 1</a>
529
529
  </li>
@@ -555,7 +555,7 @@ cssPrefix: pf-c-nav
555
555
 
556
556
  ```html
557
557
  <nav class="pf-c-nav pf-m-horizontal-subnav" aria-label="Local">
558
- <ul class="pf-c-nav__list">
558
+ <ul class="pf-c-nav__list" role="list">
559
559
  <li class="pf-c-nav__item">
560
560
  <a href="#" class="pf-c-nav__link pf-m-current" aria-current="page">Item 1</a>
561
561
  </li>
@@ -580,7 +580,7 @@ cssPrefix: pf-c-nav
580
580
  <button class="pf-c-nav__scroll-button" disabled aria-label="Scroll left">
581
581
  <i class="fas fa-angle-left" aria-hidden="true"></i>
582
582
  </button>
583
- <ul class="pf-c-nav__list">
583
+ <ul class="pf-c-nav__list" role="list">
584
584
  <li class="pf-c-nav__item">
585
585
  <a href="#" class="pf-c-nav__link">Horizontal nav item 1</a>
586
586
  </li>
@@ -615,7 +615,7 @@ cssPrefix: pf-c-nav
615
615
  <button class="pf-c-nav__scroll-button" disabled aria-label="Scroll left">
616
616
  <i class="fas fa-angle-left" aria-hidden="true"></i>
617
617
  </button>
618
- <ul class="pf-c-nav__list">
618
+ <ul class="pf-c-nav__list" role="list">
619
619
  <li class="pf-c-nav__item">
620
620
  <a href="#" class="pf-c-nav__link pf-m-current" aria-current="page">Item 1</a>
621
621
  </li>
@@ -640,7 +640,7 @@ cssPrefix: pf-c-nav
640
640
  <button class="pf-c-nav__scroll-button" disabled aria-label="Scroll left">
641
641
  <i class="fas fa-angle-left" aria-hidden="true"></i>
642
642
  </button>
643
- <ul class="pf-c-nav__list">
643
+ <ul class="pf-c-nav__list" role="list">
644
644
  <li class="pf-c-nav__item">
645
645
  <a
646
646
  href="#"
@@ -672,7 +672,7 @@ cssPrefix: pf-c-nav
672
672
 
673
673
  ```html
674
674
  <nav class="pf-c-nav pf-m-light" aria-label="Global">
675
- <ul class="pf-c-nav__list">
675
+ <ul class="pf-c-nav__list" role="list">
676
676
  <li class="pf-c-nav__item">
677
677
  <a href="#" class="pf-c-nav__link">Current link</a>
678
678
  </li>
@@ -694,7 +694,7 @@ cssPrefix: pf-c-nav
694
694
 
695
695
  ```html
696
696
  <nav class="pf-c-nav pf-m-light" aria-label="Global">
697
- <ul class="pf-c-nav__list">
697
+ <ul class="pf-c-nav__list" role="list">
698
698
  <li class="pf-c-nav__item pf-m-expandable pf-m-expanded pf-m-current">
699
699
  <button
700
700
  class="pf-c-nav__link"
@@ -712,7 +712,7 @@ cssPrefix: pf-c-nav
712
712
  class="pf-c-nav__subnav"
713
713
  aria-labelledby="expandable-light-example1"
714
714
  >
715
- <ul class="pf-c-nav__list">
715
+ <ul class="pf-c-nav__list" role="list">
716
716
  <li class="pf-c-nav__item">
717
717
  <a href="#" class="pf-c-nav__link">Current link</a>
718
718
  </li>
@@ -749,7 +749,7 @@ cssPrefix: pf-c-nav
749
749
  class="pf-c-nav__subnav"
750
750
  aria-labelledby="expandable-light-example2"
751
751
  >
752
- <ul class="pf-c-nav__list">
752
+ <ul class="pf-c-nav__list" role="list">
753
753
  <li class="pf-c-nav__item">
754
754
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
755
755
  </li>
@@ -777,7 +777,7 @@ cssPrefix: pf-c-nav
777
777
  aria-labelledby="expandable-light-example3"
778
778
  hidden
779
779
  >
780
- <ul class="pf-c-nav__list">
780
+ <ul class="pf-c-nav__list" role="list">
781
781
  <li class="pf-c-nav__item">
782
782
  <a href="#" class="pf-c-nav__link">Subnav link 1</a>
783
783
  </li>
@@ -796,7 +796,7 @@ cssPrefix: pf-c-nav
796
796
 
797
797
  ```html isBeta
798
798
  <nav class="pf-c-nav" aria-label="Global">
799
- <ul class="pf-c-nav__list">
799
+ <ul class="pf-c-nav__list" role="list">
800
800
  <li class="pf-c-nav__item">
801
801
  <a href="#" class="pf-c-nav__link">Clusters</a>
802
802
  </li>
package/docs/components/NotificationDrawer/examples/NotificationDrawer.md CHANGED
@@ -62,7 +62,7 @@ cssPrefix: pf-c-notification-drawer
62
62
  </div>
63
63
  </div>
64
64
  <div class="pf-c-notification-drawer__body">
65
- <ul class="pf-c-notification-drawer__list">
65
+ <ul class="pf-c-notification-drawer__list" role="list">
66
66
  <li
67
67
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
68
68
  tabindex="0"
@@ -597,7 +597,7 @@ cssPrefix: pf-c-notification-drawer
597
597
  </span>
598
598
  </button>
599
599
  </h1>
600
- <ul class="pf-c-notification-drawer__list" hidden>
600
+ <ul class="pf-c-notification-drawer__list" role="list" hidden>
601
601
  <li
602
602
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
603
603
  tabindex="0"
@@ -1092,7 +1092,7 @@ cssPrefix: pf-c-notification-drawer
1092
1092
  </span>
1093
1093
  </button>
1094
1094
  </h1>
1095
- <ul class="pf-c-notification-drawer__list">
1095
+ <ul class="pf-c-notification-drawer__list" role="list">
1096
1096
  <li
1097
1097
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
1098
1098
  tabindex="0"
@@ -1587,7 +1587,7 @@ cssPrefix: pf-c-notification-drawer
1587
1587
  </span>
1588
1588
  </button>
1589
1589
  </h1>
1590
- <ul class="pf-c-notification-drawer__list" hidden>
1590
+ <ul class="pf-c-notification-drawer__list" role="list" hidden>
1591
1591
  <li
1592
1592
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
1593
1593
  tabindex="0"
@@ -2082,7 +2082,7 @@ cssPrefix: pf-c-notification-drawer
2082
2082
  </span>
2083
2083
  </button>
2084
2084
  </h1>
2085
- <ul class="pf-c-notification-drawer__list" hidden>
2085
+ <ul class="pf-c-notification-drawer__list" role="list" hidden>
2086
2086
  <li
2087
2087
  class="pf-c-notification-drawer__list-item pf-m-hoverable pf-m-info"
2088
2088
  tabindex="0"
package/docs/components/ProgressStepper/examples/ProgressStepper.md CHANGED
@@ -8,7 +8,7 @@ cssPrefix: pf-c-progress-stepper
8
8
  ### Basic
9
9
 
10
10
  ```html
11
- <ol class="pf-c-progress-stepper">
11
+ <ol class="pf-c-progress-stepper" role="list">
12
12
  <li
13
13
  class="pf-c-progress-stepper__step pf-m-success"
14
14
  aria-label="completed step,"
@@ -53,7 +53,7 @@ cssPrefix: pf-c-progress-stepper
53
53
  ### Basic with descriptions
54
54
 
55
55
  ```html
56
- <ol class="pf-c-progress-stepper">
56
+ <ol class="pf-c-progress-stepper" role="list">
57
57
  <li
58
58
  class="pf-c-progress-stepper__step pf-m-success"
59
59
  aria-label="completed step,"
@@ -107,7 +107,10 @@ cssPrefix: pf-c-progress-stepper
107
107
  ### Vertical, horizontal responsive
108
108
 
109
109
  ```html
110
- <ol class="pf-c-progress-stepper pf-m-vertical-on-lg pf-m-horizontal-on-2xl">
110
+ <ol
111
+ class="pf-c-progress-stepper pf-m-vertical-on-lg pf-m-horizontal-on-2xl"
112
+ role="list"
113
+ >
111
114
  <li
112
115
  class="pf-c-progress-stepper__step pf-m-success"
113
116
  aria-label="completed step,"
@@ -161,7 +164,7 @@ cssPrefix: pf-c-progress-stepper
161
164
  ### Center aligned with descriptions
162
165
 
163
166
  ```html
164
- <ol class="pf-c-progress-stepper pf-m-center">
167
+ <ol class="pf-c-progress-stepper pf-m-center" role="list">
165
168
  <li
166
169
  class="pf-c-progress-stepper__step pf-m-success"
167
170
  aria-label="completed step,"
@@ -215,7 +218,7 @@ cssPrefix: pf-c-progress-stepper
215
218
  ### Center aligned, vertical
216
219
 
217
220
  ```html
218
- <ol class="pf-c-progress-stepper pf-m-center pf-m-vertical">
221
+ <ol class="pf-c-progress-stepper pf-m-center pf-m-vertical" role="list">
219
222
  <li
220
223
  class="pf-c-progress-stepper__step pf-m-success"
221
224
  aria-label="completed step,"
@@ -269,7 +272,7 @@ cssPrefix: pf-c-progress-stepper
269
272
  ### Vertical with descriptions
270
273
 
271
274
  ```html
272
- <ol class="pf-c-progress-stepper pf-m-vertical">
275
+ <ol class="pf-c-progress-stepper pf-m-vertical" role="list">
273
276
  <li
274
277
  class="pf-c-progress-stepper__step pf-m-success"
275
278
  aria-label="completed step,"
@@ -323,7 +326,7 @@ cssPrefix: pf-c-progress-stepper
323
326
  ### Compact
324
327
 
325
328
  ```html
326
- <ol class="pf-c-progress-stepper pf-m-compact">
329
+ <ol class="pf-c-progress-stepper pf-m-compact" role="list">
327
330
  <li
328
331
  class="pf-c-progress-stepper__step pf-m-success"
329
332
  aria-label="completed step,"
@@ -377,7 +380,7 @@ cssPrefix: pf-c-progress-stepper
377
380
  ### Compact, vertical
378
381
 
379
382
  ```html
380
- <ol class="pf-c-progress-stepper pf-m-vertical pf-m-compact">
383
+ <ol class="pf-c-progress-stepper pf-m-vertical pf-m-compact" role="list">
381
384
  <li
382
385
  class="pf-c-progress-stepper__step pf-m-success"
383
386
  aria-label="completed step,"
@@ -433,6 +436,7 @@ cssPrefix: pf-c-progress-stepper
433
436
  ```html
434
437
  <ol
435
438
  class="pf-c-progress-stepper pf-m-vertical-on-lg pf-m-horizontal-on-xl pf-m-compact"
439
+ role="list"
436
440
  >
437
441
  <li
438
442
  class="pf-c-progress-stepper__step pf-m-success"
@@ -487,7 +491,10 @@ cssPrefix: pf-c-progress-stepper
487
491
  ### Compact, vertical, centered
488
492
 
489
493
  ```html
490
- <ol class="pf-c-progress-stepper pf-m-center pf-m-vertical pf-m-compact">
494
+ <ol
495
+ class="pf-c-progress-stepper pf-m-center pf-m-vertical pf-m-compact"
496
+ role="list"
497
+ >
491
498
  <li
492
499
  class="pf-c-progress-stepper__step pf-m-success"
493
500
  aria-label="completed step,"
@@ -541,7 +548,7 @@ cssPrefix: pf-c-progress-stepper
541
548
  ### Compact, centered
542
549
 
543
550
  ```html
544
- <ol class="pf-c-progress-stepper pf-m-center pf-m-compact">
551
+ <ol class="pf-c-progress-stepper pf-m-center pf-m-compact" role="list">
545
552
  <li
546
553
  class="pf-c-progress-stepper__step pf-m-success"
547
554
  aria-label="completed step,"
@@ -595,7 +602,7 @@ cssPrefix: pf-c-progress-stepper
595
602
  ### Basic with an issue
596
603
 
597
604
  ```html
598
- <ol class="pf-c-progress-stepper">
605
+ <ol class="pf-c-progress-stepper" role="list">
599
606
  <li
600
607
  class="pf-c-progress-stepper__step pf-m-success"
601
608
  aria-label="completed step,"
@@ -666,7 +673,7 @@ cssPrefix: pf-c-progress-stepper
666
673
  ### Basic with a failure
667
674
 
668
675
  ```html
669
- <ol class="pf-c-progress-stepper">
676
+ <ol class="pf-c-progress-stepper" role="list">
670
677
  <li
671
678
  class="pf-c-progress-stepper__step pf-m-success"
672
679
  aria-label="completed step,"
@@ -737,7 +744,7 @@ cssPrefix: pf-c-progress-stepper
737
744
  ### Basic with Patternfly icons
738
745
 
739
746
  ```html
740
- <ol class="pf-c-progress-stepper">
747
+ <ol class="pf-c-progress-stepper" role="list">
741
748
  <li
742
749
  class="pf-c-progress-stepper__step pf-m-success"
743
750
  aria-label="completed step,"
@@ -784,7 +791,7 @@ cssPrefix: pf-c-progress-stepper
784
791
  ### With help text
785
792
 
786
793
  ```html
787
- <ol class="pf-c-progress-stepper">
794
+ <ol class="pf-c-progress-stepper" role="list">
788
795
  <li
789
796
  class="pf-c-progress-stepper__step pf-m-success"
790
797
  aria-label="completed step,"
package/docs/components/SimpleList/examples/SimpleList.md CHANGED
@@ -8,7 +8,7 @@ cssPrefix: pf-c-simple-list
8
8
 
9
9
  ```html
10
10
  <div class="pf-c-simple-list">
11
- <ul class="pf-c-simple-list__list">
11
+ <ul class="pf-c-simple-list__list" role="list">
12
12
  <li class="pf-c-simple-list__item">
13
13
  <button
14
14
  class="pf-c-simple-list__item-link pf-m-current"
@@ -30,7 +30,7 @@ cssPrefix: pf-c-simple-list
30
30
 
31
31
  ```html
32
32
  <div class="pf-c-simple-list">
33
- <ul class="pf-c-simple-list__list">
33
+ <ul class="pf-c-simple-list__list" role="list">
34
34
  <li class="pf-c-simple-list__item">
35
35
  <a
36
36
  class="pf-c-simple-list__item-link pf-m-current"
@@ -55,7 +55,7 @@ cssPrefix: pf-c-simple-list
55
55
  <div class="pf-c-simple-list">
56
56
  <section class="pf-c-simple-list__section">
57
57
  <h2 class="pf-c-simple-list__title">Title</h2>
58
- <ul class="pf-c-simple-list__list">
58
+ <ul class="pf-c-simple-list__list" role="list">
59
59
  <li class="pf-c-simple-list__item">
60
60
  <button
61
61
  class="pf-c-simple-list__item-link pf-m-current"
@@ -75,7 +75,7 @@ cssPrefix: pf-c-simple-list
75
75
  </section>
76
76
  <section class="pf-c-simple-list__section">
77
77
  <h2 class="pf-c-simple-list__title">Title</h2>
78
- <ul class="pf-c-simple-list__list">
78
+ <ul class="pf-c-simple-list__list" role="list">
79
79
  <li class="pf-c-simple-list__item">
80
80
  <button class="pf-c-simple-list__item-link" type="button">List item 1</button>
81
81
  </li>
package/docs/components/Wizard/examples/Wizard.md CHANGED
@@ -46,13 +46,13 @@ wrapperTag: div
46
46
  <div class="pf-c-wizard__outer-wrap">
47
47
  <div class="pf-c-wizard__inner-wrap">
48
48
  <nav class="pf-c-wizard__nav" aria-label="Steps">
49
- <ol class="pf-c-wizard__nav-list">
49
+ <ol class="pf-c-wizard__nav-list" role="list">
50
50
  <li class="pf-c-wizard__nav-item">
51
51
  <button class="pf-c-wizard__nav-link">Information</button>
52
52
  </li>
53
53
  <li class="pf-c-wizard__nav-item">
54
54
  <button class="pf-c-wizard__nav-link pf-m-current">Configuration</button>
55
- <ol class="pf-c-wizard__nav-list">
55
+ <ol class="pf-c-wizard__nav-list" role="list">
56
56
  <li class="pf-c-wizard__nav-item">
57
57
  <button class="pf-c-wizard__nav-link">Substep A</button>
58
58
  </li>
@@ -252,13 +252,13 @@ wrapperTag: div
252
252
  <div class="pf-c-wizard__outer-wrap">
253
253
  <div class="pf-c-wizard__inner-wrap">
254
254
  <nav class="pf-c-wizard__nav pf-m-expanded" aria-label="Steps">
255
- <ol class="pf-c-wizard__nav-list">
255
+ <ol class="pf-c-wizard__nav-list" role="list">
256
256
  <li class="pf-c-wizard__nav-item">
257
257
  <button class="pf-c-wizard__nav-link">Information</button>
258
258
  </li>
259
259
  <li class="pf-c-wizard__nav-item">
260
260
  <button class="pf-c-wizard__nav-link pf-m-current">Configuration</button>
261
- <ol class="pf-c-wizard__nav-list">
261
+ <ol class="pf-c-wizard__nav-list" role="list">
262
262
  <li class="pf-c-wizard__nav-item">
263
263
  <button class="pf-c-wizard__nav-link">Substep A</button>
264
264
  </li>
@@ -458,13 +458,13 @@ wrapperTag: div
458
458
  <div class="pf-c-wizard__outer-wrap">
459
459
  <div class="pf-c-wizard__inner-wrap">
460
460
  <nav class="pf-c-wizard__nav" aria-label="Steps">
461
- <ol class="pf-c-wizard__nav-list">
461
+ <ol class="pf-c-wizard__nav-list" role="list">
462
462
  <li class="pf-c-wizard__nav-item">
463
463
  <button class="pf-c-wizard__nav-link">Information</button>
464
464
  </li>
465
465
  <li class="pf-c-wizard__nav-item">
466
466
  <button class="pf-c-wizard__nav-link pf-m-current">Configuration</button>
467
- <ol class="pf-c-wizard__nav-list">
467
+ <ol class="pf-c-wizard__nav-list" role="list">
468
468
  <li class="pf-c-wizard__nav-item">
469
469
  <button class="pf-c-wizard__nav-link">Substep A</button>
470
470
  </li>
@@ -712,7 +712,7 @@ wrapperTag: div
712
712
  <div class="pf-c-wizard__outer-wrap">
713
713
  <div class="pf-c-wizard__inner-wrap">
714
714
  <nav class="pf-c-wizard__nav" aria-label="Steps">
715
- <ol class="pf-c-wizard__nav-list">
715
+ <ol class="pf-c-wizard__nav-list" role="list">
716
716
  <li class="pf-c-wizard__nav-item">
717
717
  <button
718
718
  class="pf-c-wizard__nav-link pf-m-current"
@@ -728,7 +728,7 @@ wrapperTag: div
728
728
  </span>
729
729
  </span>
730
730
  </button>
731
- <ol class="pf-c-wizard__nav-list">
731
+ <ol class="pf-c-wizard__nav-list" role="list">
732
732
  <li class="pf-c-wizard__nav-item">
733
733
  <button class="pf-c-wizard__nav-link">Substep A</button>
734
734
  </li>
@@ -946,7 +946,7 @@ wrapperTag: div
946
946
  <div class="pf-c-wizard__outer-wrap">
947
947
  <div class="pf-c-wizard__inner-wrap">
948
948
  <nav class="pf-c-wizard__nav" aria-label="Steps">
949
- <ol class="pf-c-wizard__nav-list">
949
+ <ol class="pf-c-wizard__nav-list" role="list">
950
950
  <li class="pf-c-wizard__nav-item">
951
951
  <button class="pf-c-wizard__nav-link">Information</button>
952
952
  </li>
@@ -962,7 +962,7 @@ wrapperTag: div
962
962
  </span>
963
963
  </span>
964
964
  </button>
965
- <ol class="pf-c-wizard__nav-list">
965
+ <ol class="pf-c-wizard__nav-list" role="list">
966
966
  <li class="pf-c-wizard__nav-item">
967
967
  <button class="pf-c-wizard__nav-link">Substep A</button>
968
968
  </li>
@@ -1183,13 +1183,13 @@ wrapperTag: div
1183
1183
  <div class="pf-c-wizard__outer-wrap">
1184
1184
  <div class="pf-c-wizard__inner-wrap">
1185
1185
  <nav class="pf-c-wizard__nav" aria-label="Steps">
1186
- <ol class="pf-c-wizard__nav-list">
1186
+ <ol class="pf-c-wizard__nav-list" role="list">
1187
1187
  <li class="pf-c-wizard__nav-item">
1188
1188
  <button class="pf-c-wizard__nav-link">Information</button>
1189
1189
  </li>
1190
1190
  <li class="pf-c-wizard__nav-item">
1191
1191
  <button class="pf-c-wizard__nav-link">Configuration</button>
1192
- <ol class="pf-c-wizard__nav-list">
1192
+ <ol class="pf-c-wizard__nav-list" role="list">
1193
1193
  <li class="pf-c-wizard__nav-item">
1194
1194
  <button class="pf-c-wizard__nav-link">Substep A</button>
1195
1195
  </li>
package/docs/demos/AboutModal/examples/AboutModal.md CHANGED
@@ -97,7 +97,7 @@ This demo implements the about modal, including the backdrop.
97
97
  </div>
98
98
  <section class="pf-c-app-launcher__group">
99
99
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
100
- <ul>
100
+ <ul role="list">
101
101
  <li
102
102
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
103
103
  >
@@ -149,7 +149,7 @@ This demo implements the about modal, including the backdrop.
149
149
  <hr class="pf-c-divider" />
150
150
  <section class="pf-c-app-launcher__group">
151
151
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
152
- <ul>
152
+ <ul role="list">
153
153
  <li
154
154
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
155
155
  >
@@ -804,7 +804,7 @@ This demo implements the about modal, including the backdrop.
804
804
  id="modal-basic-example-primary-nav"
805
805
  aria-label="Global"
806
806
  >
807
- <ul class="pf-c-nav__list">
807
+ <ul class="pf-c-nav__list" role="list">
808
808
  <li class="pf-c-nav__item">
809
809
  <a href="#" class="pf-c-nav__link">System panel</a>
810
810
  </li>
@@ -836,7 +836,7 @@ This demo implements the about modal, including the backdrop.
836
836
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
837
837
  <div class="pf-c-page__main-body">
838
838
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
839
- <ol class="pf-c-breadcrumb__list">
839
+ <ol class="pf-c-breadcrumb__list" role="list">
840
840
  <li class="pf-c-breadcrumb__item">
841
841
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
842
842
  </li>