@patternfly/patternfly 5.1.0-prerelease.4 → 6.0.0-alpha.1

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 (51) hide show
  1. package/CODE_OF_CONDUCT.md +2 -1
  2. package/components/DataList/data-list-grid.css +0 -28
  3. package/components/DataList/data-list.css +0 -28
  4. package/components/FormControl/form-control.css +3 -2
  5. package/components/FormControl/form-control.scss +3 -2
  6. package/components/NumberInput/number-input.css +1 -1
  7. package/components/Pagination/pagination.css +1 -1
  8. package/components/Table/table-grid.css +0 -24
  9. package/docs/components/AppLauncher/deprecated/application-launcher.md +155 -70
  10. package/docs/components/Breadcrumb/examples/Breadcrumb.md +11 -5
  11. package/docs/components/Card/examples/Card.md +152 -64
  12. package/docs/components/ContextSelector/deprecated/context-selector.md +198 -96
  13. package/docs/components/DataList/examples/DataList.md +391 -136
  14. package/docs/components/Dropdown/deprecated/Dropdown.md +881 -367
  15. package/docs/components/DualListSelector/examples/DualListSelector.md +368 -128
  16. package/docs/components/FormControl/examples/FormControl.md +2 -1
  17. package/docs/components/Hint/examples/Hint.md +57 -24
  18. package/docs/components/InlineEdit/examples/InlineEdit.md +46 -16
  19. package/docs/components/LogViewer/examples/LogViewer.md +40 -30
  20. package/docs/components/Menu/examples/Menu.md +41 -20
  21. package/docs/components/MenuToggle/examples/MenuToggle.md +1 -1
  22. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +619 -240
  23. package/docs/components/OptionsMenu/deprecated/options-menu.md +403 -160
  24. package/docs/components/OverflowMenu/examples/overflow-menu.md +45 -34
  25. package/docs/components/Pagination/examples/Pagination.md +195 -65
  26. package/docs/components/ProgressStepper/examples/ProgressStepper.md +50 -0
  27. package/docs/components/Select/deprecated/Select.css +3 -3
  28. package/docs/components/Select/deprecated/Select.md +40 -52
  29. package/docs/components/Table/examples/Table.md +4546 -1668
  30. package/docs/components/Tabs/examples/Tabs.md +1094 -438
  31. package/docs/components/Toolbar/examples/Toolbar.md +142 -68
  32. package/docs/components/TreeView/examples/TreeView.md +23 -8
  33. package/docs/demos/Card/examples/Card.md +46 -21
  34. package/docs/demos/CardView/examples/CardView.md +182 -74
  35. package/docs/demos/ContextSelector/examples/ContextSelector.md +95 -47
  36. package/docs/demos/Dashboard/examples/Dashboard.md +15 -6
  37. package/docs/demos/DataList/examples/DataList.md +163 -70
  38. package/docs/demos/DescriptionList/examples/DescriptionList.md +20 -9
  39. package/docs/demos/Drawer/examples/Drawer.md +20 -9
  40. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +803 -338
  41. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +241 -101
  42. package/docs/demos/Table/examples/Table.md +1422 -607
  43. package/docs/demos/Tabs/examples/Tabs.md +113 -48
  44. package/docs/demos/Toolbar/examples/Toolbar.md +318 -123
  45. package/package.json +39 -38
  46. package/patternfly-no-globals.css +4 -55
  47. package/patternfly-theme-dark-unversioned.css +4 -55
  48. package/patternfly.css +4 -55
  49. package/patternfly.min.css +1 -1
  50. package/patternfly.min.css.map +1 -1
  51. package/sass-utilities/placeholders.scss +1 -1
package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md CHANGED
@@ -341,7 +341,7 @@ wrapperTag: div
341
341
  <span
342
342
  id="primary-detail-expanded-example-drawer-toolbar-select-checkbox-status-label"
343
343
  hidden
344
- >Choose one</span>
344
+ >Choose many</span>
345
345
 
346
346
  <button
347
347
  class="pf-v5-c-select__toggle"
@@ -444,7 +444,7 @@ wrapperTag: div
444
444
  <span
445
445
  id="primary-detail-expanded-example-drawer-toolbar-select-checkbox-risk-label"
446
446
  hidden
447
- >Choose one</span>
447
+ >Choose many</span>
448
448
 
449
449
  <button
450
450
  class="pf-v5-c-select__toggle"
@@ -586,11 +586,13 @@ wrapperTag: div
586
586
  </button>
587
587
  <ul
588
588
  class="pf-v5-c-dropdown__menu"
589
+ role="menu"
589
590
  aria-labelledby="primary-detail-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
590
591
  hidden
591
592
  >
592
- <li>
593
+ <li role="none">
593
594
  <button
595
+ role="menuitem"
594
596
  class="pf-v5-c-dropdown__menu-item"
595
597
  >Action 7</button>
596
598
  </li>
@@ -619,19 +621,22 @@ wrapperTag: div
619
621
  </button>
620
622
  <ul
621
623
  class="pf-v5-c-options-menu__menu"
624
+ role="menu"
622
625
  aria-labelledby="primary-detail-expanded-example-drawer-toolbar-top-pagination-toggle"
623
626
  hidden
624
627
  >
625
- <li>
628
+ <li role="none">
626
629
  <button
627
630
  class="pf-v5-c-options-menu__menu-item"
628
631
  type="button"
632
+ role="menuitem"
629
633
  >5 per page</button>
630
634
  </li>
631
- <li>
635
+ <li role="none">
632
636
  <button
633
637
  class="pf-v5-c-options-menu__menu-item"
634
638
  type="button"
639
+ role="menuitem"
635
640
  >
636
641
  10 per page
637
642
  <div
@@ -641,10 +646,11 @@ wrapperTag: div
641
646
  </div>
642
647
  </button>
643
648
  </li>
644
- <li>
649
+ <li role="none">
645
650
  <button
646
651
  class="pf-v5-c-options-menu__menu-item"
647
652
  type="button"
653
+ role="menuitem"
648
654
  >20 per page</button>
649
655
  </li>
650
656
  </ul>
@@ -1110,6 +1116,7 @@ wrapperTag: div
1110
1116
  <div class="pf-v5-c-drawer__body pf-m-no-padding">
1111
1117
  <div
1112
1118
  class="pf-v5-c-tabs pf-m-box pf-m-fill"
1119
+ role="region"
1113
1120
  id="primary-detail-expanded-example-drawer-tabs"
1114
1121
  >
1115
1122
  <button
@@ -1119,21 +1126,26 @@ wrapperTag: div
1119
1126
  >
1120
1127
  <i class="fas fa-angle-left" aria-hidden="true"></i>
1121
1128
  </button>
1122
- <ul class="pf-v5-c-tabs__list">
1123
- <li class="pf-v5-c-tabs__item pf-m-current">
1129
+ <ul class="pf-v5-c-tabs__list" role="tablist">
1130
+ <li
1131
+ class="pf-v5-c-tabs__item pf-m-current"
1132
+ role="presentation"
1133
+ >
1124
1134
  <button
1125
1135
  type="button"
1126
1136
  class="pf-v5-c-tabs__link"
1137
+ role="tab"
1127
1138
  aria-controls="primary-detail-expanded-example-drawer-tabs-tab1-panel"
1128
1139
  id="primary-detail-expanded-example-drawer-tabs-tab1-link"
1129
1140
  >
1130
1141
  <span class="pf-v5-c-tabs__item-text">Overview</span>
1131
1142
  </button>
1132
1143
  </li>
1133
- <li class="pf-v5-c-tabs__item">
1144
+ <li class="pf-v5-c-tabs__item" role="presentation">
1134
1145
  <button
1135
1146
  type="button"
1136
1147
  class="pf-v5-c-tabs__link"
1148
+ role="tab"
1137
1149
  aria-controls="primary-detail-expanded-example-drawer-tabs-tab2-panel"
1138
1150
  id="primary-detail-expanded-example-drawer-tabs-tab2-link"
1139
1151
  >
@@ -1587,7 +1599,7 @@ wrapperTag: div
1587
1599
  <span
1588
1600
  id="primary-detail-collapsed-example-drawer-toolbar-select-checkbox-status-label"
1589
1601
  hidden
1590
- >Choose one</span>
1602
+ >Choose many</span>
1591
1603
 
1592
1604
  <button
1593
1605
  class="pf-v5-c-select__toggle"
@@ -1690,7 +1702,7 @@ wrapperTag: div
1690
1702
  <span
1691
1703
  id="primary-detail-collapsed-example-drawer-toolbar-select-checkbox-risk-label"
1692
1704
  hidden
1693
- >Choose one</span>
1705
+ >Choose many</span>
1694
1706
 
1695
1707
  <button
1696
1708
  class="pf-v5-c-select__toggle"
@@ -1832,11 +1844,13 @@ wrapperTag: div
1832
1844
  </button>
1833
1845
  <ul
1834
1846
  class="pf-v5-c-dropdown__menu"
1847
+ role="menu"
1835
1848
  aria-labelledby="primary-detail-collapsed-example-drawer-toolbar-overflow-menu-dropdown-toggle"
1836
1849
  hidden
1837
1850
  >
1838
- <li>
1851
+ <li role="none">
1839
1852
  <button
1853
+ role="menuitem"
1840
1854
  class="pf-v5-c-dropdown__menu-item"
1841
1855
  >Action 7</button>
1842
1856
  </li>
@@ -1865,19 +1879,22 @@ wrapperTag: div
1865
1879
  </button>
1866
1880
  <ul
1867
1881
  class="pf-v5-c-options-menu__menu"
1882
+ role="menu"
1868
1883
  aria-labelledby="primary-detail-collapsed-example-drawer-toolbar-top-pagination-toggle"
1869
1884
  hidden
1870
1885
  >
1871
- <li>
1886
+ <li role="none">
1872
1887
  <button
1873
1888
  class="pf-v5-c-options-menu__menu-item"
1874
1889
  type="button"
1890
+ role="menuitem"
1875
1891
  >5 per page</button>
1876
1892
  </li>
1877
- <li>
1893
+ <li role="none">
1878
1894
  <button
1879
1895
  class="pf-v5-c-options-menu__menu-item"
1880
1896
  type="button"
1897
+ role="menuitem"
1881
1898
  >
1882
1899
  10 per page
1883
1900
  <div
@@ -1887,10 +1904,11 @@ wrapperTag: div
1887
1904
  </div>
1888
1905
  </button>
1889
1906
  </li>
1890
- <li>
1907
+ <li role="none">
1891
1908
  <button
1892
1909
  class="pf-v5-c-options-menu__menu-item"
1893
1910
  type="button"
1911
+ role="menuitem"
1894
1912
  >20 per page</button>
1895
1913
  </li>
1896
1914
  </ul>
@@ -2652,7 +2670,7 @@ wrapperTag: div
2652
2670
  <span
2653
2671
  id="primary-detail-content-body-padding-example-drawer-toolbar-select-checkbox-status-label"
2654
2672
  hidden
2655
- >Choose one</span>
2673
+ >Choose many</span>
2656
2674
 
2657
2675
  <button
2658
2676
  class="pf-v5-c-select__toggle"
@@ -2755,7 +2773,7 @@ wrapperTag: div
2755
2773
  <span
2756
2774
  id="primary-detail-content-body-padding-example-drawer-toolbar-select-checkbox-risk-label"
2757
2775
  hidden
2758
- >Choose one</span>
2776
+ >Choose many</span>
2759
2777
 
2760
2778
  <button
2761
2779
  class="pf-v5-c-select__toggle"
@@ -2897,11 +2915,13 @@ wrapperTag: div
2897
2915
  </button>
2898
2916
  <ul
2899
2917
  class="pf-v5-c-dropdown__menu"
2918
+ role="menu"
2900
2919
  aria-labelledby="primary-detail-content-body-padding-example-drawer-toolbar-overflow-menu-dropdown-toggle"
2901
2920
  hidden
2902
2921
  >
2903
- <li>
2922
+ <li role="none">
2904
2923
  <button
2924
+ role="menuitem"
2905
2925
  class="pf-v5-c-dropdown__menu-item"
2906
2926
  >Action 7</button>
2907
2927
  </li>
@@ -2930,19 +2950,22 @@ wrapperTag: div
2930
2950
  </button>
2931
2951
  <ul
2932
2952
  class="pf-v5-c-options-menu__menu"
2953
+ role="menu"
2933
2954
  aria-labelledby="primary-detail-content-body-padding-example-drawer-toolbar-top-pagination-toggle"
2934
2955
  hidden
2935
2956
  >
2936
- <li>
2957
+ <li role="none">
2937
2958
  <button
2938
2959
  class="pf-v5-c-options-menu__menu-item"
2939
2960
  type="button"
2961
+ role="menuitem"
2940
2962
  >5 per page</button>
2941
2963
  </li>
2942
- <li>
2964
+ <li role="none">
2943
2965
  <button
2944
2966
  class="pf-v5-c-options-menu__menu-item"
2945
2967
  type="button"
2968
+ role="menuitem"
2946
2969
  >
2947
2970
  10 per page
2948
2971
  <div
@@ -2952,10 +2975,11 @@ wrapperTag: div
2952
2975
  </div>
2953
2976
  </button>
2954
2977
  </li>
2955
- <li>
2978
+ <li role="none">
2956
2979
  <button
2957
2980
  class="pf-v5-c-options-menu__menu-item"
2958
2981
  type="button"
2982
+ role="menuitem"
2959
2983
  >20 per page</button>
2960
2984
  </li>
2961
2985
  </ul>
@@ -3733,22 +3757,25 @@ wrapperTag: div
3733
3757
  <i class="fas fa-caret-down" aria-hidden="true"></i>
3734
3758
  </button>
3735
3759
  </div>
3736
- <ul class="pf-v5-c-dropdown__menu" hidden>
3737
- <li>
3760
+ <ul class="pf-v5-c-dropdown__menu" hidden role="menu">
3761
+ <li role="none">
3738
3762
  <button
3739
3763
  class="pf-v5-c-dropdown__menu-item"
3764
+ role="menuitem"
3740
3765
  type="button"
3741
3766
  >Select all</button>
3742
3767
  </li>
3743
- <li>
3768
+ <li role="none">
3744
3769
  <button
3745
3770
  class="pf-v5-c-dropdown__menu-item"
3771
+ role="menuitem"
3746
3772
  type="button"
3747
3773
  >Select none</button>
3748
3774
  </li>
3749
- <li>
3775
+ <li role="none">
3750
3776
  <button
3751
3777
  class="pf-v5-c-dropdown__menu-item"
3778
+ role="menuitem"
3752
3779
  type="button"
3753
3780
  >Other action</button>
3754
3781
  </li>
@@ -3901,11 +3928,15 @@ wrapperTag: div
3901
3928
  </button>
3902
3929
  <ul
3903
3930
  class="pf-v5-c-dropdown__menu"
3931
+ role="menu"
3904
3932
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-toolbar-overflow-menu-dropdown-toggle"
3905
3933
  hidden
3906
3934
  >
3907
- <li>
3908
- <button class="pf-v5-c-dropdown__menu-item">Action 7</button>
3935
+ <li role="none">
3936
+ <button
3937
+ role="menuitem"
3938
+ class="pf-v5-c-dropdown__menu-item"
3939
+ >Action 7</button>
3909
3940
  </li>
3910
3941
  </ul>
3911
3942
  </div>
@@ -3955,19 +3986,22 @@ wrapperTag: div
3955
3986
  </button>
3956
3987
  <ul
3957
3988
  class="pf-v5-c-options-menu__menu"
3989
+ role="menu"
3958
3990
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-toolbar-top-pagination-toggle"
3959
3991
  hidden
3960
3992
  >
3961
- <li>
3993
+ <li role="none">
3962
3994
  <button
3963
3995
  class="pf-v5-c-options-menu__menu-item"
3964
3996
  type="button"
3997
+ role="menuitem"
3965
3998
  >5 per page</button>
3966
3999
  </li>
3967
- <li>
4000
+ <li role="none">
3968
4001
  <button
3969
4002
  class="pf-v5-c-options-menu__menu-item"
3970
4003
  type="button"
4004
+ role="menuitem"
3971
4005
  >
3972
4006
  10 per page
3973
4007
  <div class="pf-v5-c-options-menu__menu-item-icon">
@@ -3975,10 +4009,11 @@ wrapperTag: div
3975
4009
  </div>
3976
4010
  </button>
3977
4011
  </li>
3978
- <li>
4012
+ <li role="none">
3979
4013
  <button
3980
4014
  class="pf-v5-c-options-menu__menu-item"
3981
4015
  type="button"
4016
+ role="menuitem"
3982
4017
  >20 per page</button>
3983
4018
  </li>
3984
4019
  </ul>
@@ -4050,35 +4085,44 @@ wrapperTag: div
4050
4085
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4051
4086
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-1-dropdown-kebab-button"
4052
4087
  hidden
4088
+ role="menu"
4053
4089
  >
4054
- <li>
4055
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4090
+ <li role="none">
4091
+ <a
4092
+ class="pf-v5-c-dropdown__menu-item"
4093
+ role="menuitem"
4094
+ href="#"
4095
+ >Link</a>
4056
4096
  </li>
4057
- <li>
4097
+ <li role="none">
4058
4098
  <button
4059
4099
  class="pf-v5-c-dropdown__menu-item"
4100
+ role="menuitem"
4060
4101
  type="button"
4061
4102
  >Action</button>
4062
4103
  </li>
4063
- <li>
4104
+ <li role="none">
4064
4105
  <a
4065
4106
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4107
+ role="menuitem"
4066
4108
  href="#"
4067
4109
  aria-disabled="true"
4068
4110
  tabindex="-1"
4069
4111
  >Disabled link</a>
4070
4112
  </li>
4071
- <li>
4113
+ <li role="none">
4072
4114
  <button
4073
4115
  class="pf-v5-c-dropdown__menu-item"
4116
+ role="menuitem"
4074
4117
  type="button"
4075
4118
  disabled
4076
4119
  >Disabled action</button>
4077
4120
  </li>
4078
4121
  <li class="pf-v5-c-divider" role="separator"></li>
4079
- <li>
4122
+ <li role="none">
4080
4123
  <a
4081
4124
  class="pf-v5-c-dropdown__menu-item"
4125
+ role="menuitem"
4082
4126
  href="#"
4083
4127
  >Separated link</a>
4084
4128
  </li>
@@ -4133,35 +4177,44 @@ wrapperTag: div
4133
4177
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4134
4178
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-2-dropdown-kebab-button"
4135
4179
  hidden
4180
+ role="menu"
4136
4181
  >
4137
- <li>
4138
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4182
+ <li role="none">
4183
+ <a
4184
+ class="pf-v5-c-dropdown__menu-item"
4185
+ role="menuitem"
4186
+ href="#"
4187
+ >Link</a>
4139
4188
  </li>
4140
- <li>
4189
+ <li role="none">
4141
4190
  <button
4142
4191
  class="pf-v5-c-dropdown__menu-item"
4192
+ role="menuitem"
4143
4193
  type="button"
4144
4194
  >Action</button>
4145
4195
  </li>
4146
- <li>
4196
+ <li role="none">
4147
4197
  <a
4148
4198
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4199
+ role="menuitem"
4149
4200
  href="#"
4150
4201
  aria-disabled="true"
4151
4202
  tabindex="-1"
4152
4203
  >Disabled link</a>
4153
4204
  </li>
4154
- <li>
4205
+ <li role="none">
4155
4206
  <button
4156
4207
  class="pf-v5-c-dropdown__menu-item"
4208
+ role="menuitem"
4157
4209
  type="button"
4158
4210
  disabled
4159
4211
  >Disabled action</button>
4160
4212
  </li>
4161
4213
  <li class="pf-v5-c-divider" role="separator"></li>
4162
- <li>
4214
+ <li role="none">
4163
4215
  <a
4164
4216
  class="pf-v5-c-dropdown__menu-item"
4217
+ role="menuitem"
4165
4218
  href="#"
4166
4219
  >Separated link</a>
4167
4220
  </li>
@@ -4216,35 +4269,44 @@ wrapperTag: div
4216
4269
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4217
4270
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-3-dropdown-kebab-button"
4218
4271
  hidden
4272
+ role="menu"
4219
4273
  >
4220
- <li>
4221
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4274
+ <li role="none">
4275
+ <a
4276
+ class="pf-v5-c-dropdown__menu-item"
4277
+ role="menuitem"
4278
+ href="#"
4279
+ >Link</a>
4222
4280
  </li>
4223
- <li>
4281
+ <li role="none">
4224
4282
  <button
4225
4283
  class="pf-v5-c-dropdown__menu-item"
4284
+ role="menuitem"
4226
4285
  type="button"
4227
4286
  >Action</button>
4228
4287
  </li>
4229
- <li>
4288
+ <li role="none">
4230
4289
  <a
4231
4290
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4291
+ role="menuitem"
4232
4292
  href="#"
4233
4293
  aria-disabled="true"
4234
4294
  tabindex="-1"
4235
4295
  >Disabled link</a>
4236
4296
  </li>
4237
- <li>
4297
+ <li role="none">
4238
4298
  <button
4239
4299
  class="pf-v5-c-dropdown__menu-item"
4300
+ role="menuitem"
4240
4301
  type="button"
4241
4302
  disabled
4242
4303
  >Disabled action</button>
4243
4304
  </li>
4244
4305
  <li class="pf-v5-c-divider" role="separator"></li>
4245
- <li>
4306
+ <li role="none">
4246
4307
  <a
4247
4308
  class="pf-v5-c-dropdown__menu-item"
4309
+ role="menuitem"
4248
4310
  href="#"
4249
4311
  >Separated link</a>
4250
4312
  </li>
@@ -4299,35 +4361,44 @@ wrapperTag: div
4299
4361
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4300
4362
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-4-dropdown-kebab-button"
4301
4363
  hidden
4364
+ role="menu"
4302
4365
  >
4303
- <li>
4304
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4366
+ <li role="none">
4367
+ <a
4368
+ class="pf-v5-c-dropdown__menu-item"
4369
+ role="menuitem"
4370
+ href="#"
4371
+ >Link</a>
4305
4372
  </li>
4306
- <li>
4373
+ <li role="none">
4307
4374
  <button
4308
4375
  class="pf-v5-c-dropdown__menu-item"
4376
+ role="menuitem"
4309
4377
  type="button"
4310
4378
  >Action</button>
4311
4379
  </li>
4312
- <li>
4380
+ <li role="none">
4313
4381
  <a
4314
4382
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4383
+ role="menuitem"
4315
4384
  href="#"
4316
4385
  aria-disabled="true"
4317
4386
  tabindex="-1"
4318
4387
  >Disabled link</a>
4319
4388
  </li>
4320
- <li>
4389
+ <li role="none">
4321
4390
  <button
4322
4391
  class="pf-v5-c-dropdown__menu-item"
4392
+ role="menuitem"
4323
4393
  type="button"
4324
4394
  disabled
4325
4395
  >Disabled action</button>
4326
4396
  </li>
4327
4397
  <li class="pf-v5-c-divider" role="separator"></li>
4328
- <li>
4398
+ <li role="none">
4329
4399
  <a
4330
4400
  class="pf-v5-c-dropdown__menu-item"
4401
+ role="menuitem"
4331
4402
  href="#"
4332
4403
  >Separated link</a>
4333
4404
  </li>
@@ -4382,35 +4453,44 @@ wrapperTag: div
4382
4453
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4383
4454
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-5-dropdown-kebab-button"
4384
4455
  hidden
4456
+ role="menu"
4385
4457
  >
4386
- <li>
4387
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4458
+ <li role="none">
4459
+ <a
4460
+ class="pf-v5-c-dropdown__menu-item"
4461
+ role="menuitem"
4462
+ href="#"
4463
+ >Link</a>
4388
4464
  </li>
4389
- <li>
4465
+ <li role="none">
4390
4466
  <button
4391
4467
  class="pf-v5-c-dropdown__menu-item"
4468
+ role="menuitem"
4392
4469
  type="button"
4393
4470
  >Action</button>
4394
4471
  </li>
4395
- <li>
4472
+ <li role="none">
4396
4473
  <a
4397
4474
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4475
+ role="menuitem"
4398
4476
  href="#"
4399
4477
  aria-disabled="true"
4400
4478
  tabindex="-1"
4401
4479
  >Disabled link</a>
4402
4480
  </li>
4403
- <li>
4481
+ <li role="none">
4404
4482
  <button
4405
4483
  class="pf-v5-c-dropdown__menu-item"
4484
+ role="menuitem"
4406
4485
  type="button"
4407
4486
  disabled
4408
4487
  >Disabled action</button>
4409
4488
  </li>
4410
4489
  <li class="pf-v5-c-divider" role="separator"></li>
4411
- <li>
4490
+ <li role="none">
4412
4491
  <a
4413
4492
  class="pf-v5-c-dropdown__menu-item"
4493
+ role="menuitem"
4414
4494
  href="#"
4415
4495
  >Separated link</a>
4416
4496
  </li>
@@ -4465,35 +4545,44 @@ wrapperTag: div
4465
4545
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4466
4546
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-6-dropdown-kebab-button"
4467
4547
  hidden
4548
+ role="menu"
4468
4549
  >
4469
- <li>
4470
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4550
+ <li role="none">
4551
+ <a
4552
+ class="pf-v5-c-dropdown__menu-item"
4553
+ role="menuitem"
4554
+ href="#"
4555
+ >Link</a>
4471
4556
  </li>
4472
- <li>
4557
+ <li role="none">
4473
4558
  <button
4474
4559
  class="pf-v5-c-dropdown__menu-item"
4560
+ role="menuitem"
4475
4561
  type="button"
4476
4562
  >Action</button>
4477
4563
  </li>
4478
- <li>
4564
+ <li role="none">
4479
4565
  <a
4480
4566
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4567
+ role="menuitem"
4481
4568
  href="#"
4482
4569
  aria-disabled="true"
4483
4570
  tabindex="-1"
4484
4571
  >Disabled link</a>
4485
4572
  </li>
4486
- <li>
4573
+ <li role="none">
4487
4574
  <button
4488
4575
  class="pf-v5-c-dropdown__menu-item"
4576
+ role="menuitem"
4489
4577
  type="button"
4490
4578
  disabled
4491
4579
  >Disabled action</button>
4492
4580
  </li>
4493
4581
  <li class="pf-v5-c-divider" role="separator"></li>
4494
- <li>
4582
+ <li role="none">
4495
4583
  <a
4496
4584
  class="pf-v5-c-dropdown__menu-item"
4585
+ role="menuitem"
4497
4586
  href="#"
4498
4587
  >Separated link</a>
4499
4588
  </li>
@@ -4547,35 +4636,44 @@ wrapperTag: div
4547
4636
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4548
4637
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-7-dropdown-kebab-button"
4549
4638
  hidden
4639
+ role="menu"
4550
4640
  >
4551
- <li>
4552
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4641
+ <li role="none">
4642
+ <a
4643
+ class="pf-v5-c-dropdown__menu-item"
4644
+ role="menuitem"
4645
+ href="#"
4646
+ >Link</a>
4553
4647
  </li>
4554
- <li>
4648
+ <li role="none">
4555
4649
  <button
4556
4650
  class="pf-v5-c-dropdown__menu-item"
4651
+ role="menuitem"
4557
4652
  type="button"
4558
4653
  >Action</button>
4559
4654
  </li>
4560
- <li>
4655
+ <li role="none">
4561
4656
  <a
4562
4657
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4658
+ role="menuitem"
4563
4659
  href="#"
4564
4660
  aria-disabled="true"
4565
4661
  tabindex="-1"
4566
4662
  >Disabled link</a>
4567
4663
  </li>
4568
- <li>
4664
+ <li role="none">
4569
4665
  <button
4570
4666
  class="pf-v5-c-dropdown__menu-item"
4667
+ role="menuitem"
4571
4668
  type="button"
4572
4669
  disabled
4573
4670
  >Disabled action</button>
4574
4671
  </li>
4575
4672
  <li class="pf-v5-c-divider" role="separator"></li>
4576
- <li>
4673
+ <li role="none">
4577
4674
  <a
4578
4675
  class="pf-v5-c-dropdown__menu-item"
4676
+ role="menuitem"
4579
4677
  href="#"
4580
4678
  >Separated link</a>
4581
4679
  </li>
@@ -4629,35 +4727,44 @@ wrapperTag: div
4629
4727
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4630
4728
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-8-dropdown-kebab-button"
4631
4729
  hidden
4730
+ role="menu"
4632
4731
  >
4633
- <li>
4634
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4732
+ <li role="none">
4733
+ <a
4734
+ class="pf-v5-c-dropdown__menu-item"
4735
+ role="menuitem"
4736
+ href="#"
4737
+ >Link</a>
4635
4738
  </li>
4636
- <li>
4739
+ <li role="none">
4637
4740
  <button
4638
4741
  class="pf-v5-c-dropdown__menu-item"
4742
+ role="menuitem"
4639
4743
  type="button"
4640
4744
  >Action</button>
4641
4745
  </li>
4642
- <li>
4746
+ <li role="none">
4643
4747
  <a
4644
4748
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4749
+ role="menuitem"
4645
4750
  href="#"
4646
4751
  aria-disabled="true"
4647
4752
  tabindex="-1"
4648
4753
  >Disabled link</a>
4649
4754
  </li>
4650
- <li>
4755
+ <li role="none">
4651
4756
  <button
4652
4757
  class="pf-v5-c-dropdown__menu-item"
4758
+ role="menuitem"
4653
4759
  type="button"
4654
4760
  disabled
4655
4761
  >Disabled action</button>
4656
4762
  </li>
4657
4763
  <li class="pf-v5-c-divider" role="separator"></li>
4658
- <li>
4764
+ <li role="none">
4659
4765
  <a
4660
4766
  class="pf-v5-c-dropdown__menu-item"
4767
+ role="menuitem"
4661
4768
  href="#"
4662
4769
  >Separated link</a>
4663
4770
  </li>
@@ -4711,35 +4818,44 @@ wrapperTag: div
4711
4818
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4712
4819
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-9-dropdown-kebab-button"
4713
4820
  hidden
4821
+ role="menu"
4714
4822
  >
4715
- <li>
4716
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4823
+ <li role="none">
4824
+ <a
4825
+ class="pf-v5-c-dropdown__menu-item"
4826
+ role="menuitem"
4827
+ href="#"
4828
+ >Link</a>
4717
4829
  </li>
4718
- <li>
4830
+ <li role="none">
4719
4831
  <button
4720
4832
  class="pf-v5-c-dropdown__menu-item"
4833
+ role="menuitem"
4721
4834
  type="button"
4722
4835
  >Action</button>
4723
4836
  </li>
4724
- <li>
4837
+ <li role="none">
4725
4838
  <a
4726
4839
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4840
+ role="menuitem"
4727
4841
  href="#"
4728
4842
  aria-disabled="true"
4729
4843
  tabindex="-1"
4730
4844
  >Disabled link</a>
4731
4845
  </li>
4732
- <li>
4846
+ <li role="none">
4733
4847
  <button
4734
4848
  class="pf-v5-c-dropdown__menu-item"
4849
+ role="menuitem"
4735
4850
  type="button"
4736
4851
  disabled
4737
4852
  >Disabled action</button>
4738
4853
  </li>
4739
4854
  <li class="pf-v5-c-divider" role="separator"></li>
4740
- <li>
4855
+ <li role="none">
4741
4856
  <a
4742
4857
  class="pf-v5-c-dropdown__menu-item"
4858
+ role="menuitem"
4743
4859
  href="#"
4744
4860
  >Separated link</a>
4745
4861
  </li>
@@ -4793,35 +4909,44 @@ wrapperTag: div
4793
4909
  class="pf-v5-c-dropdown__menu pf-m-align-right"
4794
4910
  aria-labelledby="primary-detail-card-view-expanded-example-drawer-card-10-dropdown-kebab-button"
4795
4911
  hidden
4912
+ role="menu"
4796
4913
  >
4797
- <li>
4798
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4914
+ <li role="none">
4915
+ <a
4916
+ class="pf-v5-c-dropdown__menu-item"
4917
+ role="menuitem"
4918
+ href="#"
4919
+ >Link</a>
4799
4920
  </li>
4800
- <li>
4921
+ <li role="none">
4801
4922
  <button
4802
4923
  class="pf-v5-c-dropdown__menu-item"
4924
+ role="menuitem"
4803
4925
  type="button"
4804
4926
  >Action</button>
4805
4927
  </li>
4806
- <li>
4928
+ <li role="none">
4807
4929
  <a
4808
4930
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4931
+ role="menuitem"
4809
4932
  href="#"
4810
4933
  aria-disabled="true"
4811
4934
  tabindex="-1"
4812
4935
  >Disabled link</a>
4813
4936
  </li>
4814
- <li>
4937
+ <li role="none">
4815
4938
  <button
4816
4939
  class="pf-v5-c-dropdown__menu-item"
4940
+ role="menuitem"
4817
4941
  type="button"
4818
4942
  disabled
4819
4943
  >Disabled action</button>
4820
4944
  </li>
4821
4945
  <li class="pf-v5-c-divider" role="separator"></li>
4822
- <li>
4946
+ <li role="none">
4823
4947
  <a
4824
4948
  class="pf-v5-c-dropdown__menu-item"
4949
+ role="menuitem"
4825
4950
  href="#"
4826
4951
  >Separated link</a>
4827
4952
  </li>
@@ -5640,19 +5765,22 @@ wrapperTag: div
5640
5765
  </button>
5641
5766
  <ul
5642
5767
  class="pf-v5-c-options-menu__menu"
5768
+ role="menu"
5643
5769
  aria-labelledby="primary-detail-card-data-list-example-drawer-toolbar-card-toolbar-pagination-options-menu-toggle"
5644
5770
  hidden
5645
5771
  >
5646
- <li>
5772
+ <li role="none">
5647
5773
  <button
5648
5774
  class="pf-v5-c-options-menu__menu-item"
5649
5775
  type="button"
5776
+ role="menuitem"
5650
5777
  >5 per page</button>
5651
5778
  </li>
5652
- <li>
5779
+ <li role="none">
5653
5780
  <button
5654
5781
  class="pf-v5-c-options-menu__menu-item"
5655
5782
  type="button"
5783
+ role="menuitem"
5656
5784
  >
5657
5785
  10 per page
5658
5786
  <div
@@ -5662,10 +5790,11 @@ wrapperTag: div
5662
5790
  </div>
5663
5791
  </button>
5664
5792
  </li>
5665
- <li>
5793
+ <li role="none">
5666
5794
  <button
5667
5795
  class="pf-v5-c-options-menu__menu-item"
5668
5796
  type="button"
5797
+ role="menuitem"
5669
5798
  >20 per page</button>
5670
5799
  </li>
5671
5800
  </ul>
@@ -6269,11 +6398,15 @@ wrapperTag: div
6269
6398
  </button>
6270
6399
  <ul
6271
6400
  class="pf-v5-c-dropdown__menu"
6401
+ role="menu"
6272
6402
  aria-labelledby="primary-detail-inline-modifier-example-drawer-toolbar-overflow-menu-dropdown-toggle"
6273
6403
  hidden
6274
6404
  >
6275
- <li>
6276
- <button class="pf-v5-c-dropdown__menu-item">Action 7</button>
6405
+ <li role="none">
6406
+ <button
6407
+ role="menuitem"
6408
+ class="pf-v5-c-dropdown__menu-item"
6409
+ >Action 7</button>
6277
6410
  </li>
6278
6411
  </ul>
6279
6412
  </div>
@@ -6300,19 +6433,22 @@ wrapperTag: div
6300
6433
  </button>
6301
6434
  <ul
6302
6435
  class="pf-v5-c-options-menu__menu"
6436
+ role="menu"
6303
6437
  aria-labelledby="primary-detail-inline-modifier-example-drawer-toolbar-top-pagination-toggle"
6304
6438
  hidden
6305
6439
  >
6306
- <li>
6440
+ <li role="none">
6307
6441
  <button
6308
6442
  class="pf-v5-c-options-menu__menu-item"
6309
6443
  type="button"
6444
+ role="menuitem"
6310
6445
  >5 per page</button>
6311
6446
  </li>
6312
- <li>
6447
+ <li role="none">
6313
6448
  <button
6314
6449
  class="pf-v5-c-options-menu__menu-item"
6315
6450
  type="button"
6451
+ role="menuitem"
6316
6452
  >
6317
6453
  10 per page
6318
6454
  <div class="pf-v5-c-options-menu__menu-item-icon">
@@ -6320,10 +6456,11 @@ wrapperTag: div
6320
6456
  </div>
6321
6457
  </button>
6322
6458
  </li>
6323
- <li>
6459
+ <li role="none">
6324
6460
  <button
6325
6461
  class="pf-v5-c-options-menu__menu-item"
6326
6462
  type="button"
6463
+ role="menuitem"
6327
6464
  >20 per page</button>
6328
6465
  </li>
6329
6466
  </ul>
@@ -6753,6 +6890,7 @@ wrapperTag: div
6753
6890
  <div class="pf-v5-c-drawer__body pf-m-no-padding">
6754
6891
  <div
6755
6892
  class="pf-v5-c-tabs pf-m-box pf-m-fill"
6893
+ role="region"
6756
6894
  id="primary-detail-inline-modifier-example-drawer-tabs"
6757
6895
  >
6758
6896
  <button
@@ -6762,21 +6900,23 @@ wrapperTag: div
6762
6900
  >
6763
6901
  <i class="fas fa-angle-left" aria-hidden="true"></i>
6764
6902
  </button>
6765
- <ul class="pf-v5-c-tabs__list">
6766
- <li class="pf-v5-c-tabs__item pf-m-current">
6903
+ <ul class="pf-v5-c-tabs__list" role="tablist">
6904
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
6767
6905
  <button
6768
6906
  type="button"
6769
6907
  class="pf-v5-c-tabs__link"
6908
+ role="tab"
6770
6909
  aria-controls="primary-detail-inline-modifier-example-drawer-tabs-tab1-panel"
6771
6910
  id="primary-detail-inline-modifier-example-drawer-tabs-tab1-link"
6772
6911
  >
6773
6912
  <span class="pf-v5-c-tabs__item-text">Overview</span>
6774
6913
  </button>
6775
6914
  </li>
6776
- <li class="pf-v5-c-tabs__item">
6915
+ <li class="pf-v5-c-tabs__item" role="presentation">
6777
6916
  <button
6778
6917
  type="button"
6779
6918
  class="pf-v5-c-tabs__link"
6919
+ role="tab"
6780
6920
  aria-controls="primary-detail-inline-modifier-example-drawer-tabs-tab2-panel"
6781
6921
  id="primary-detail-inline-modifier-example-drawer-tabs-tab2-link"
6782
6922
  >