@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
@@ -156,11 +156,15 @@ section: components
156
156
  </button>
157
157
  <ul
158
158
  class="pf-v5-c-dropdown__menu"
159
+ role="menu"
159
160
  aria-labelledby="toolbar-attribute-value-search-filter-desktop-example-overflow-menu-dropdown-toggle"
160
161
  hidden
161
162
  >
162
- <li>
163
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
163
+ <li role="none">
164
+ <button
165
+ role="menuitem"
166
+ class="pf-v5-c-dropdown__menu-item"
167
+ >Tertiary</button>
164
168
  </li>
165
169
  </ul>
166
170
  </div>
@@ -192,27 +196,34 @@ section: components
192
196
  </button>
193
197
  <ul
194
198
  class="pf-v5-c-options-menu__menu"
199
+ role="menu"
195
200
  aria-labelledby="toolbar-attribute-value-search-filter-desktop-example-pagination-options-menu-toggle"
196
201
  hidden
197
202
  >
198
- <li>
203
+ <li role="none">
199
204
  <button
200
205
  class="pf-v5-c-options-menu__menu-item"
201
206
  type="button"
207
+ role="menuitem"
202
208
  >5 per page</button>
203
209
  </li>
204
- <li>
205
- <button class="pf-v5-c-options-menu__menu-item" type="button">
210
+ <li role="none">
211
+ <button
212
+ class="pf-v5-c-options-menu__menu-item"
213
+ type="button"
214
+ role="menuitem"
215
+ >
206
216
  10 per page
207
217
  <div class="pf-v5-c-options-menu__menu-item-icon">
208
218
  <i class="fas fa-check" aria-hidden="true"></i>
209
219
  </div>
210
220
  </button>
211
221
  </li>
212
- <li>
222
+ <li role="none">
213
223
  <button
214
224
  class="pf-v5-c-options-menu__menu-item"
215
225
  type="button"
226
+ role="menuitem"
216
227
  >20 per page</button>
217
228
  </li>
218
229
  </ul>
@@ -836,35 +847,44 @@ section: components
836
847
  class="pf-v5-c-dropdown__menu pf-m-align-right"
837
848
  aria-labelledby="-table-table-dropdown-kebab-1-button"
838
849
  hidden
850
+ role="menu"
839
851
  >
840
- <li>
841
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
852
+ <li role="none">
853
+ <a
854
+ class="pf-v5-c-dropdown__menu-item"
855
+ role="menuitem"
856
+ href="#"
857
+ >Link</a>
842
858
  </li>
843
- <li>
859
+ <li role="none">
844
860
  <button
845
861
  class="pf-v5-c-dropdown__menu-item"
862
+ role="menuitem"
846
863
  type="button"
847
864
  >Action</button>
848
865
  </li>
849
- <li>
866
+ <li role="none">
850
867
  <a
851
868
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
869
+ role="menuitem"
852
870
  href="#"
853
871
  aria-disabled="true"
854
872
  tabindex="-1"
855
873
  >Disabled link</a>
856
874
  </li>
857
- <li>
875
+ <li role="none">
858
876
  <button
859
877
  class="pf-v5-c-dropdown__menu-item"
878
+ role="menuitem"
860
879
  type="button"
861
880
  disabled
862
881
  >Disabled action</button>
863
882
  </li>
864
883
  <li class="pf-v5-c-divider" role="separator"></li>
865
- <li>
884
+ <li role="none">
866
885
  <a
867
886
  class="pf-v5-c-dropdown__menu-item"
887
+ role="menuitem"
868
888
  href="#"
869
889
  >Separated link</a>
870
890
  </li>
@@ -936,35 +956,44 @@ section: components
936
956
  class="pf-v5-c-dropdown__menu pf-m-align-right"
937
957
  aria-labelledby="-table-table-dropdown-kebab-2-button"
938
958
  hidden
959
+ role="menu"
939
960
  >
940
- <li>
941
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
961
+ <li role="none">
962
+ <a
963
+ class="pf-v5-c-dropdown__menu-item"
964
+ role="menuitem"
965
+ href="#"
966
+ >Link</a>
942
967
  </li>
943
- <li>
968
+ <li role="none">
944
969
  <button
945
970
  class="pf-v5-c-dropdown__menu-item"
971
+ role="menuitem"
946
972
  type="button"
947
973
  >Action</button>
948
974
  </li>
949
- <li>
975
+ <li role="none">
950
976
  <a
951
977
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
978
+ role="menuitem"
952
979
  href="#"
953
980
  aria-disabled="true"
954
981
  tabindex="-1"
955
982
  >Disabled link</a>
956
983
  </li>
957
- <li>
984
+ <li role="none">
958
985
  <button
959
986
  class="pf-v5-c-dropdown__menu-item"
987
+ role="menuitem"
960
988
  type="button"
961
989
  disabled
962
990
  >Disabled action</button>
963
991
  </li>
964
992
  <li class="pf-v5-c-divider" role="separator"></li>
965
- <li>
993
+ <li role="none">
966
994
  <a
967
995
  class="pf-v5-c-dropdown__menu-item"
996
+ role="menuitem"
968
997
  href="#"
969
998
  >Separated link</a>
970
999
  </li>
@@ -1036,35 +1065,44 @@ section: components
1036
1065
  class="pf-v5-c-dropdown__menu pf-m-align-right"
1037
1066
  aria-labelledby="-table-table-dropdown-kebab-3-button"
1038
1067
  hidden
1068
+ role="menu"
1039
1069
  >
1040
- <li>
1041
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1070
+ <li role="none">
1071
+ <a
1072
+ class="pf-v5-c-dropdown__menu-item"
1073
+ role="menuitem"
1074
+ href="#"
1075
+ >Link</a>
1042
1076
  </li>
1043
- <li>
1077
+ <li role="none">
1044
1078
  <button
1045
1079
  class="pf-v5-c-dropdown__menu-item"
1080
+ role="menuitem"
1046
1081
  type="button"
1047
1082
  >Action</button>
1048
1083
  </li>
1049
- <li>
1084
+ <li role="none">
1050
1085
  <a
1051
1086
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1087
+ role="menuitem"
1052
1088
  href="#"
1053
1089
  aria-disabled="true"
1054
1090
  tabindex="-1"
1055
1091
  >Disabled link</a>
1056
1092
  </li>
1057
- <li>
1093
+ <li role="none">
1058
1094
  <button
1059
1095
  class="pf-v5-c-dropdown__menu-item"
1096
+ role="menuitem"
1060
1097
  type="button"
1061
1098
  disabled
1062
1099
  >Disabled action</button>
1063
1100
  </li>
1064
1101
  <li class="pf-v5-c-divider" role="separator"></li>
1065
- <li>
1102
+ <li role="none">
1066
1103
  <a
1067
1104
  class="pf-v5-c-dropdown__menu-item"
1105
+ role="menuitem"
1068
1106
  href="#"
1069
1107
  >Separated link</a>
1070
1108
  </li>
@@ -1136,35 +1174,44 @@ section: components
1136
1174
  class="pf-v5-c-dropdown__menu pf-m-align-right"
1137
1175
  aria-labelledby="-table-table-dropdown-kebab-4-button"
1138
1176
  hidden
1177
+ role="menu"
1139
1178
  >
1140
- <li>
1141
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1179
+ <li role="none">
1180
+ <a
1181
+ class="pf-v5-c-dropdown__menu-item"
1182
+ role="menuitem"
1183
+ href="#"
1184
+ >Link</a>
1142
1185
  </li>
1143
- <li>
1186
+ <li role="none">
1144
1187
  <button
1145
1188
  class="pf-v5-c-dropdown__menu-item"
1189
+ role="menuitem"
1146
1190
  type="button"
1147
1191
  >Action</button>
1148
1192
  </li>
1149
- <li>
1193
+ <li role="none">
1150
1194
  <a
1151
1195
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1196
+ role="menuitem"
1152
1197
  href="#"
1153
1198
  aria-disabled="true"
1154
1199
  tabindex="-1"
1155
1200
  >Disabled link</a>
1156
1201
  </li>
1157
- <li>
1202
+ <li role="none">
1158
1203
  <button
1159
1204
  class="pf-v5-c-dropdown__menu-item"
1205
+ role="menuitem"
1160
1206
  type="button"
1161
1207
  disabled
1162
1208
  >Disabled action</button>
1163
1209
  </li>
1164
1210
  <li class="pf-v5-c-divider" role="separator"></li>
1165
- <li>
1211
+ <li role="none">
1166
1212
  <a
1167
1213
  class="pf-v5-c-dropdown__menu-item"
1214
+ role="menuitem"
1168
1215
  href="#"
1169
1216
  >Separated link</a>
1170
1217
  </li>
@@ -1236,35 +1283,44 @@ section: components
1236
1283
  class="pf-v5-c-dropdown__menu pf-m-align-right"
1237
1284
  aria-labelledby="-table-table-dropdown-kebab-5-button"
1238
1285
  hidden
1286
+ role="menu"
1239
1287
  >
1240
- <li>
1241
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1288
+ <li role="none">
1289
+ <a
1290
+ class="pf-v5-c-dropdown__menu-item"
1291
+ role="menuitem"
1292
+ href="#"
1293
+ >Link</a>
1242
1294
  </li>
1243
- <li>
1295
+ <li role="none">
1244
1296
  <button
1245
1297
  class="pf-v5-c-dropdown__menu-item"
1298
+ role="menuitem"
1246
1299
  type="button"
1247
1300
  >Action</button>
1248
1301
  </li>
1249
- <li>
1302
+ <li role="none">
1250
1303
  <a
1251
1304
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1305
+ role="menuitem"
1252
1306
  href="#"
1253
1307
  aria-disabled="true"
1254
1308
  tabindex="-1"
1255
1309
  >Disabled link</a>
1256
1310
  </li>
1257
- <li>
1311
+ <li role="none">
1258
1312
  <button
1259
1313
  class="pf-v5-c-dropdown__menu-item"
1314
+ role="menuitem"
1260
1315
  type="button"
1261
1316
  disabled
1262
1317
  >Disabled action</button>
1263
1318
  </li>
1264
1319
  <li class="pf-v5-c-divider" role="separator"></li>
1265
- <li>
1320
+ <li role="none">
1266
1321
  <a
1267
1322
  class="pf-v5-c-dropdown__menu-item"
1323
+ role="menuitem"
1268
1324
  href="#"
1269
1325
  >Separated link</a>
1270
1326
  </li>
@@ -1321,17 +1377,27 @@ section: components
1321
1377
  </button>
1322
1378
  <ul
1323
1379
  class="pf-v5-c-dropdown__menu"
1380
+ role="menu"
1324
1381
  aria-labelledby="toolbar-attribute-value-search-filter-mobile-example-overflow-menu-dropdown-toggle"
1325
1382
  hidden
1326
1383
  >
1327
- <li>
1328
- <button class="pf-v5-c-dropdown__menu-item">Primary</button>
1384
+ <li role="none">
1385
+ <button
1386
+ role="menuitem"
1387
+ class="pf-v5-c-dropdown__menu-item"
1388
+ >Primary</button>
1329
1389
  </li>
1330
- <li>
1331
- <button class="pf-v5-c-dropdown__menu-item">Secondary</button>
1390
+ <li role="none">
1391
+ <button
1392
+ role="menuitem"
1393
+ class="pf-v5-c-dropdown__menu-item"
1394
+ >Secondary</button>
1332
1395
  </li>
1333
- <li>
1334
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
1396
+ <li role="none">
1397
+ <button
1398
+ role="menuitem"
1399
+ class="pf-v5-c-dropdown__menu-item"
1400
+ >Tertiary</button>
1335
1401
  </li>
1336
1402
  </ul>
1337
1403
  </div>
@@ -1363,27 +1429,34 @@ section: components
1363
1429
  </button>
1364
1430
  <ul
1365
1431
  class="pf-v5-c-options-menu__menu"
1432
+ role="menu"
1366
1433
  aria-labelledby="toolbar-attribute-value-search-filter-mobile-example-pagination-options-menu-toggle"
1367
1434
  hidden
1368
1435
  >
1369
- <li>
1436
+ <li role="none">
1370
1437
  <button
1371
1438
  class="pf-v5-c-options-menu__menu-item"
1372
1439
  type="button"
1440
+ role="menuitem"
1373
1441
  >5 per page</button>
1374
1442
  </li>
1375
- <li>
1376
- <button class="pf-v5-c-options-menu__menu-item" type="button">
1443
+ <li role="none">
1444
+ <button
1445
+ class="pf-v5-c-options-menu__menu-item"
1446
+ type="button"
1447
+ role="menuitem"
1448
+ >
1377
1449
  10 per page
1378
1450
  <div class="pf-v5-c-options-menu__menu-item-icon">
1379
1451
  <i class="fas fa-check" aria-hidden="true"></i>
1380
1452
  </div>
1381
1453
  </button>
1382
1454
  </li>
1383
- <li>
1455
+ <li role="none">
1384
1456
  <button
1385
1457
  class="pf-v5-c-options-menu__menu-item"
1386
1458
  type="button"
1459
+ role="menuitem"
1387
1460
  >20 per page</button>
1388
1461
  </li>
1389
1462
  </ul>
@@ -1710,11 +1783,15 @@ section: components
1710
1783
  </button>
1711
1784
  <ul
1712
1785
  class="pf-v5-c-dropdown__menu"
1786
+ role="menu"
1713
1787
  aria-labelledby="toolbar-attribute-value-single-select-filter-desktop-example-overflow-menu-dropdown-toggle"
1714
1788
  hidden
1715
1789
  >
1716
- <li>
1717
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
1790
+ <li role="none">
1791
+ <button
1792
+ role="menuitem"
1793
+ class="pf-v5-c-dropdown__menu-item"
1794
+ >Tertiary</button>
1718
1795
  </li>
1719
1796
  </ul>
1720
1797
  </div>
@@ -1746,27 +1823,34 @@ section: components
1746
1823
  </button>
1747
1824
  <ul
1748
1825
  class="pf-v5-c-options-menu__menu"
1826
+ role="menu"
1749
1827
  aria-labelledby="toolbar-attribute-value-single-select-filter-desktop-example-pagination-options-menu-toggle"
1750
1828
  hidden
1751
1829
  >
1752
- <li>
1830
+ <li role="none">
1753
1831
  <button
1754
1832
  class="pf-v5-c-options-menu__menu-item"
1755
1833
  type="button"
1834
+ role="menuitem"
1756
1835
  >5 per page</button>
1757
1836
  </li>
1758
- <li>
1759
- <button class="pf-v5-c-options-menu__menu-item" type="button">
1837
+ <li role="none">
1838
+ <button
1839
+ class="pf-v5-c-options-menu__menu-item"
1840
+ type="button"
1841
+ role="menuitem"
1842
+ >
1760
1843
  10 per page
1761
1844
  <div class="pf-v5-c-options-menu__menu-item-icon">
1762
1845
  <i class="fas fa-check" aria-hidden="true"></i>
1763
1846
  </div>
1764
1847
  </button>
1765
1848
  </li>
1766
- <li>
1849
+ <li role="none">
1767
1850
  <button
1768
1851
  class="pf-v5-c-options-menu__menu-item"
1769
1852
  type="button"
1853
+ role="menuitem"
1770
1854
  >20 per page</button>
1771
1855
  </li>
1772
1856
  </ul>
@@ -1846,17 +1930,27 @@ section: components
1846
1930
  </button>
1847
1931
  <ul
1848
1932
  class="pf-v5-c-dropdown__menu"
1933
+ role="menu"
1849
1934
  aria-labelledby="toolbar-attribute-value-single-select-filter-mobile-example-overflow-menu-dropdown-toggle"
1850
1935
  hidden
1851
1936
  >
1852
- <li>
1853
- <button class="pf-v5-c-dropdown__menu-item">Primary</button>
1937
+ <li role="none">
1938
+ <button
1939
+ role="menuitem"
1940
+ class="pf-v5-c-dropdown__menu-item"
1941
+ >Primary</button>
1854
1942
  </li>
1855
- <li>
1856
- <button class="pf-v5-c-dropdown__menu-item">Secondary</button>
1943
+ <li role="none">
1944
+ <button
1945
+ role="menuitem"
1946
+ class="pf-v5-c-dropdown__menu-item"
1947
+ >Secondary</button>
1857
1948
  </li>
1858
- <li>
1859
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
1949
+ <li role="none">
1950
+ <button
1951
+ role="menuitem"
1952
+ class="pf-v5-c-dropdown__menu-item"
1953
+ >Tertiary</button>
1860
1954
  </li>
1861
1955
  </ul>
1862
1956
  </div>
@@ -1888,27 +1982,34 @@ section: components
1888
1982
  </button>
1889
1983
  <ul
1890
1984
  class="pf-v5-c-options-menu__menu"
1985
+ role="menu"
1891
1986
  aria-labelledby="toolbar-attribute-value-single-select-filter-mobile-example-pagination-options-menu-toggle"
1892
1987
  hidden
1893
1988
  >
1894
- <li>
1989
+ <li role="none">
1895
1990
  <button
1896
1991
  class="pf-v5-c-options-menu__menu-item"
1897
1992
  type="button"
1993
+ role="menuitem"
1898
1994
  >5 per page</button>
1899
1995
  </li>
1900
- <li>
1901
- <button class="pf-v5-c-options-menu__menu-item" type="button">
1996
+ <li role="none">
1997
+ <button
1998
+ class="pf-v5-c-options-menu__menu-item"
1999
+ type="button"
2000
+ role="menuitem"
2001
+ >
1902
2002
  10 per page
1903
2003
  <div class="pf-v5-c-options-menu__menu-item-icon">
1904
2004
  <i class="fas fa-check" aria-hidden="true"></i>
1905
2005
  </div>
1906
2006
  </button>
1907
2007
  </li>
1908
- <li>
2008
+ <li role="none">
1909
2009
  <button
1910
2010
  class="pf-v5-c-options-menu__menu-item"
1911
2011
  type="button"
2012
+ role="menuitem"
1912
2013
  >20 per page</button>
1913
2014
  </li>
1914
2015
  </ul>
@@ -2166,7 +2267,7 @@ section: components
2166
2267
  <span
2167
2268
  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-select-filter-status-label"
2168
2269
  hidden
2169
- >Choose one</span>
2270
+ >Choose many</span>
2170
2271
 
2171
2272
  <button
2172
2273
  class="pf-v5-c-select__toggle"
@@ -2298,11 +2399,15 @@ section: components
2298
2399
  </button>
2299
2400
  <ul
2300
2401
  class="pf-v5-c-dropdown__menu"
2402
+ role="menu"
2301
2403
  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-overflow-menu-dropdown-toggle"
2302
2404
  hidden
2303
2405
  >
2304
- <li>
2305
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
2406
+ <li role="none">
2407
+ <button
2408
+ role="menuitem"
2409
+ class="pf-v5-c-dropdown__menu-item"
2410
+ >Tertiary</button>
2306
2411
  </li>
2307
2412
  </ul>
2308
2413
  </div>
@@ -2334,27 +2439,34 @@ section: components
2334
2439
  </button>
2335
2440
  <ul
2336
2441
  class="pf-v5-c-options-menu__menu"
2442
+ role="menu"
2337
2443
  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-pagination-options-menu-toggle"
2338
2444
  hidden
2339
2445
  >
2340
- <li>
2446
+ <li role="none">
2341
2447
  <button
2342
2448
  class="pf-v5-c-options-menu__menu-item"
2343
2449
  type="button"
2450
+ role="menuitem"
2344
2451
  >5 per page</button>
2345
2452
  </li>
2346
- <li>
2347
- <button class="pf-v5-c-options-menu__menu-item" type="button">
2453
+ <li role="none">
2454
+ <button
2455
+ class="pf-v5-c-options-menu__menu-item"
2456
+ type="button"
2457
+ role="menuitem"
2458
+ >
2348
2459
  10 per page
2349
2460
  <div class="pf-v5-c-options-menu__menu-item-icon">
2350
2461
  <i class="fas fa-check" aria-hidden="true"></i>
2351
2462
  </div>
2352
2463
  </button>
2353
2464
  </li>
2354
- <li>
2465
+ <li role="none">
2355
2466
  <button
2356
2467
  class="pf-v5-c-options-menu__menu-item"
2357
2468
  type="button"
2469
+ role="menuitem"
2358
2470
  >20 per page</button>
2359
2471
  </li>
2360
2472
  </ul>
@@ -2521,17 +2633,27 @@ section: components
2521
2633
  </button>
2522
2634
  <ul
2523
2635
  class="pf-v5-c-dropdown__menu"
2636
+ role="menu"
2524
2637
  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-overflow-menu-dropdown-toggle"
2525
2638
  hidden
2526
2639
  >
2527
- <li>
2528
- <button class="pf-v5-c-dropdown__menu-item">Primary</button>
2640
+ <li role="none">
2641
+ <button
2642
+ role="menuitem"
2643
+ class="pf-v5-c-dropdown__menu-item"
2644
+ >Primary</button>
2529
2645
  </li>
2530
- <li>
2531
- <button class="pf-v5-c-dropdown__menu-item">Secondary</button>
2646
+ <li role="none">
2647
+ <button
2648
+ role="menuitem"
2649
+ class="pf-v5-c-dropdown__menu-item"
2650
+ >Secondary</button>
2532
2651
  </li>
2533
- <li>
2534
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
2652
+ <li role="none">
2653
+ <button
2654
+ role="menuitem"
2655
+ class="pf-v5-c-dropdown__menu-item"
2656
+ >Tertiary</button>
2535
2657
  </li>
2536
2658
  </ul>
2537
2659
  </div>
@@ -2563,27 +2685,34 @@ section: components
2563
2685
  </button>
2564
2686
  <ul
2565
2687
  class="pf-v5-c-options-menu__menu"
2688
+ role="menu"
2566
2689
  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-pagination-options-menu-toggle"
2567
2690
  hidden
2568
2691
  >
2569
- <li>
2692
+ <li role="none">
2570
2693
  <button
2571
2694
  class="pf-v5-c-options-menu__menu-item"
2572
2695
  type="button"
2696
+ role="menuitem"
2573
2697
  >5 per page</button>
2574
2698
  </li>
2575
- <li>
2576
- <button class="pf-v5-c-options-menu__menu-item" type="button">
2699
+ <li role="none">
2700
+ <button
2701
+ class="pf-v5-c-options-menu__menu-item"
2702
+ type="button"
2703
+ role="menuitem"
2704
+ >
2577
2705
  10 per page
2578
2706
  <div class="pf-v5-c-options-menu__menu-item-icon">
2579
2707
  <i class="fas fa-check" aria-hidden="true"></i>
2580
2708
  </div>
2581
2709
  </button>
2582
2710
  </li>
2583
- <li>
2711
+ <li role="none">
2584
2712
  <button
2585
2713
  class="pf-v5-c-options-menu__menu-item"
2586
2714
  type="button"
2715
+ role="menuitem"
2587
2716
  >20 per page</button>
2588
2717
  </li>
2589
2718
  </ul>
@@ -2685,7 +2814,7 @@ section: components
2685
2814
  <span
2686
2815
  id="toolbar-attribute-value-checkbox-select-filter-mobile-example-select-filter-status-expanded-label"
2687
2816
  hidden
2688
- >Choose one</span>
2817
+ >Choose many</span>
2689
2818
 
2690
2819
  <button
2691
2820
  class="pf-v5-c-select__toggle"
@@ -3201,17 +3330,27 @@ section: components
3201
3330
  </button>
3202
3331
  <ul
3203
3332
  class="pf-v5-c-dropdown__menu"
3333
+ role="menu"
3204
3334
  aria-labelledby="toolbar-pagination-management-example-toolbar-overflow-menu-dropdown-toggle"
3205
3335
  hidden
3206
3336
  >
3207
- <li>
3208
- <button class="pf-v5-c-dropdown__menu-item">Primary</button>
3337
+ <li role="none">
3338
+ <button
3339
+ role="menuitem"
3340
+ class="pf-v5-c-dropdown__menu-item"
3341
+ >Primary</button>
3209
3342
  </li>
3210
- <li>
3211
- <button class="pf-v5-c-dropdown__menu-item">Secondary</button>
3343
+ <li role="none">
3344
+ <button
3345
+ role="menuitem"
3346
+ class="pf-v5-c-dropdown__menu-item"
3347
+ >Secondary</button>
3212
3348
  </li>
3213
- <li>
3214
- <button class="pf-v5-c-dropdown__menu-item">Tertiary</button>
3349
+ <li role="none">
3350
+ <button
3351
+ role="menuitem"
3352
+ class="pf-v5-c-dropdown__menu-item"
3353
+ >Tertiary</button>
3215
3354
  </li>
3216
3355
  </ul>
3217
3356
  </div>
@@ -3243,19 +3382,22 @@ section: components
3243
3382
  </button>
3244
3383
  <ul
3245
3384
  class="pf-v5-c-options-menu__menu"
3385
+ role="menu"
3246
3386
  aria-labelledby="toolbar-pagination-management-example-toolbar-pagination-options-menu-toggle"
3247
3387
  hidden
3248
3388
  >
3249
- <li>
3389
+ <li role="none">
3250
3390
  <button
3251
3391
  class="pf-v5-c-options-menu__menu-item"
3252
3392
  type="button"
3393
+ role="menuitem"
3253
3394
  >5 per page</button>
3254
3395
  </li>
3255
- <li>
3396
+ <li role="none">
3256
3397
  <button
3257
3398
  class="pf-v5-c-options-menu__menu-item"
3258
3399
  type="button"
3400
+ role="menuitem"
3259
3401
  >
3260
3402
  10 per page
3261
3403
  <div class="pf-v5-c-options-menu__menu-item-icon">
@@ -3263,10 +3405,11 @@ section: components
3263
3405
  </div>
3264
3406
  </button>
3265
3407
  </li>
3266
- <li>
3408
+ <li role="none">
3267
3409
  <button
3268
3410
  class="pf-v5-c-options-menu__menu-item"
3269
3411
  type="button"
3412
+ role="menuitem"
3270
3413
  >20 per page</button>
3271
3414
  </li>
3272
3415
  </ul>
@@ -3409,35 +3552,44 @@ section: components
3409
3552
  class="pf-v5-c-dropdown__menu pf-m-align-right"
3410
3553
  aria-labelledby="toolbar-and-table-static-search-overflow-menu-collapsed-table-dropdown-kebab-1-button"
3411
3554
  hidden
3555
+ role="menu"
3412
3556
  >
3413
- <li>
3414
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
3557
+ <li role="none">
3558
+ <a
3559
+ class="pf-v5-c-dropdown__menu-item"
3560
+ role="menuitem"
3561
+ href="#"
3562
+ >Link</a>
3415
3563
  </li>
3416
- <li>
3564
+ <li role="none">
3417
3565
  <button
3418
3566
  class="pf-v5-c-dropdown__menu-item"
3567
+ role="menuitem"
3419
3568
  type="button"
3420
3569
  >Action</button>
3421
3570
  </li>
3422
- <li>
3571
+ <li role="none">
3423
3572
  <a
3424
3573
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
3574
+ role="menuitem"
3425
3575
  href="#"
3426
3576
  aria-disabled="true"
3427
3577
  tabindex="-1"
3428
3578
  >Disabled link</a>
3429
3579
  </li>
3430
- <li>
3580
+ <li role="none">
3431
3581
  <button
3432
3582
  class="pf-v5-c-dropdown__menu-item"
3583
+ role="menuitem"
3433
3584
  type="button"
3434
3585
  disabled
3435
3586
  >Disabled action</button>
3436
3587
  </li>
3437
3588
  <li class="pf-v5-c-divider" role="separator"></li>
3438
- <li>
3589
+ <li role="none">
3439
3590
  <a
3440
3591
  class="pf-v5-c-dropdown__menu-item"
3592
+ role="menuitem"
3441
3593
  href="#"
3442
3594
  >Separated link</a>
3443
3595
  </li>
@@ -3511,35 +3663,44 @@ section: components
3511
3663
  class="pf-v5-c-dropdown__menu pf-m-align-right"
3512
3664
  aria-labelledby="toolbar-and-table-static-search-overflow-menu-collapsed-table-dropdown-kebab-2-button"
3513
3665
  hidden
3666
+ role="menu"
3514
3667
  >
3515
- <li>
3516
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
3668
+ <li role="none">
3669
+ <a
3670
+ class="pf-v5-c-dropdown__menu-item"
3671
+ role="menuitem"
3672
+ href="#"
3673
+ >Link</a>
3517
3674
  </li>
3518
- <li>
3675
+ <li role="none">
3519
3676
  <button
3520
3677
  class="pf-v5-c-dropdown__menu-item"
3678
+ role="menuitem"
3521
3679
  type="button"
3522
3680
  >Action</button>
3523
3681
  </li>
3524
- <li>
3682
+ <li role="none">
3525
3683
  <a
3526
3684
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
3685
+ role="menuitem"
3527
3686
  href="#"
3528
3687
  aria-disabled="true"
3529
3688
  tabindex="-1"
3530
3689
  >Disabled link</a>
3531
3690
  </li>
3532
- <li>
3691
+ <li role="none">
3533
3692
  <button
3534
3693
  class="pf-v5-c-dropdown__menu-item"
3694
+ role="menuitem"
3535
3695
  type="button"
3536
3696
  disabled
3537
3697
  >Disabled action</button>
3538
3698
  </li>
3539
3699
  <li class="pf-v5-c-divider" role="separator"></li>
3540
- <li>
3700
+ <li role="none">
3541
3701
  <a
3542
3702
  class="pf-v5-c-dropdown__menu-item"
3703
+ role="menuitem"
3543
3704
  href="#"
3544
3705
  >Separated link</a>
3545
3706
  </li>
@@ -3613,35 +3774,44 @@ section: components
3613
3774
  class="pf-v5-c-dropdown__menu pf-m-align-right"
3614
3775
  aria-labelledby="toolbar-and-table-static-search-overflow-menu-collapsed-table-dropdown-kebab-3-button"
3615
3776
  hidden
3777
+ role="menu"
3616
3778
  >
3617
- <li>
3618
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
3779
+ <li role="none">
3780
+ <a
3781
+ class="pf-v5-c-dropdown__menu-item"
3782
+ role="menuitem"
3783
+ href="#"
3784
+ >Link</a>
3619
3785
  </li>
3620
- <li>
3786
+ <li role="none">
3621
3787
  <button
3622
3788
  class="pf-v5-c-dropdown__menu-item"
3789
+ role="menuitem"
3623
3790
  type="button"
3624
3791
  >Action</button>
3625
3792
  </li>
3626
- <li>
3793
+ <li role="none">
3627
3794
  <a
3628
3795
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
3796
+ role="menuitem"
3629
3797
  href="#"
3630
3798
  aria-disabled="true"
3631
3799
  tabindex="-1"
3632
3800
  >Disabled link</a>
3633
3801
  </li>
3634
- <li>
3802
+ <li role="none">
3635
3803
  <button
3636
3804
  class="pf-v5-c-dropdown__menu-item"
3805
+ role="menuitem"
3637
3806
  type="button"
3638
3807
  disabled
3639
3808
  >Disabled action</button>
3640
3809
  </li>
3641
3810
  <li class="pf-v5-c-divider" role="separator"></li>
3642
- <li>
3811
+ <li role="none">
3643
3812
  <a
3644
3813
  class="pf-v5-c-dropdown__menu-item"
3814
+ role="menuitem"
3645
3815
  href="#"
3646
3816
  >Separated link</a>
3647
3817
  </li>
@@ -3715,35 +3885,44 @@ section: components
3715
3885
  class="pf-v5-c-dropdown__menu pf-m-align-right"
3716
3886
  aria-labelledby="toolbar-and-table-static-search-overflow-menu-collapsed-table-dropdown-kebab-4-button"
3717
3887
  hidden
3888
+ role="menu"
3718
3889
  >
3719
- <li>
3720
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
3890
+ <li role="none">
3891
+ <a
3892
+ class="pf-v5-c-dropdown__menu-item"
3893
+ role="menuitem"
3894
+ href="#"
3895
+ >Link</a>
3721
3896
  </li>
3722
- <li>
3897
+ <li role="none">
3723
3898
  <button
3724
3899
  class="pf-v5-c-dropdown__menu-item"
3900
+ role="menuitem"
3725
3901
  type="button"
3726
3902
  >Action</button>
3727
3903
  </li>
3728
- <li>
3904
+ <li role="none">
3729
3905
  <a
3730
3906
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
3907
+ role="menuitem"
3731
3908
  href="#"
3732
3909
  aria-disabled="true"
3733
3910
  tabindex="-1"
3734
3911
  >Disabled link</a>
3735
3912
  </li>
3736
- <li>
3913
+ <li role="none">
3737
3914
  <button
3738
3915
  class="pf-v5-c-dropdown__menu-item"
3916
+ role="menuitem"
3739
3917
  type="button"
3740
3918
  disabled
3741
3919
  >Disabled action</button>
3742
3920
  </li>
3743
3921
  <li class="pf-v5-c-divider" role="separator"></li>
3744
- <li>
3922
+ <li role="none">
3745
3923
  <a
3746
3924
  class="pf-v5-c-dropdown__menu-item"
3925
+ role="menuitem"
3747
3926
  href="#"
3748
3927
  >Separated link</a>
3749
3928
  </li>
@@ -3817,35 +3996,44 @@ section: components
3817
3996
  class="pf-v5-c-dropdown__menu pf-m-align-right"
3818
3997
  aria-labelledby="toolbar-and-table-static-search-overflow-menu-collapsed-table-dropdown-kebab-5-button"
3819
3998
  hidden
3999
+ role="menu"
3820
4000
  >
3821
- <li>
3822
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
4001
+ <li role="none">
4002
+ <a
4003
+ class="pf-v5-c-dropdown__menu-item"
4004
+ role="menuitem"
4005
+ href="#"
4006
+ >Link</a>
3823
4007
  </li>
3824
- <li>
4008
+ <li role="none">
3825
4009
  <button
3826
4010
  class="pf-v5-c-dropdown__menu-item"
4011
+ role="menuitem"
3827
4012
  type="button"
3828
4013
  >Action</button>
3829
4014
  </li>
3830
- <li>
4015
+ <li role="none">
3831
4016
  <a
3832
4017
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
4018
+ role="menuitem"
3833
4019
  href="#"
3834
4020
  aria-disabled="true"
3835
4021
  tabindex="-1"
3836
4022
  >Disabled link</a>
3837
4023
  </li>
3838
- <li>
4024
+ <li role="none">
3839
4025
  <button
3840
4026
  class="pf-v5-c-dropdown__menu-item"
4027
+ role="menuitem"
3841
4028
  type="button"
3842
4029
  disabled
3843
4030
  >Disabled action</button>
3844
4031
  </li>
3845
4032
  <li class="pf-v5-c-divider" role="separator"></li>
3846
- <li>
4033
+ <li role="none">
3847
4034
  <a
3848
4035
  class="pf-v5-c-dropdown__menu-item"
4036
+ role="menuitem"
3849
4037
  href="#"
3850
4038
  >Separated link</a>
3851
4039
  </li>
@@ -3874,27 +4062,34 @@ section: components
3874
4062
  </button>
3875
4063
  <ul
3876
4064
  class="pf-v5-c-options-menu__menu pf-m-top"
4065
+ role="menu"
3877
4066
  aria-labelledby="pagination-options-menu-bottom-collapsed-example-toggle"
3878
4067
  hidden
3879
4068
  >
3880
- <li>
4069
+ <li role="none">
3881
4070
  <button
3882
4071
  class="pf-v5-c-options-menu__menu-item"
3883
4072
  type="button"
4073
+ role="menuitem"
3884
4074
  >5 per page</button>
3885
4075
  </li>
3886
- <li>
3887
- <button class="pf-v5-c-options-menu__menu-item" type="button">
4076
+ <li role="none">
4077
+ <button
4078
+ class="pf-v5-c-options-menu__menu-item"
4079
+ type="button"
4080
+ role="menuitem"
4081
+ >
3888
4082
  10 per page
3889
4083
  <div class="pf-v5-c-options-menu__menu-item-icon">
3890
4084
  <i class="fas fa-check" aria-hidden="true"></i>
3891
4085
  </div>
3892
4086
  </button>
3893
4087
  </li>
3894
- <li>
4088
+ <li role="none">
3895
4089
  <button
3896
4090
  class="pf-v5-c-options-menu__menu-item"
3897
4091
  type="button"
4092
+ role="menuitem"
3898
4093
  >20 per page</button>
3899
4094
  </li>
3900
4095
  </ul>