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

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 (274) hide show
  1. package/README.md +13 -3
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  4. package/assets/pficon/pficon.scss +6 -129
  5. package/base/_common.scss +21 -0
  6. package/base/_globals.scss +1 -1
  7. package/base/_variables.scss +7 -0
  8. package/base/patternfly-common.css +16 -2
  9. package/base/patternfly-globals.css +1 -1
  10. package/base/patternfly-icons.css +5 -1
  11. package/base/patternfly-pf-icons.css +5 -1
  12. package/base/patternfly-variables.css +5 -0
  13. package/components/AboutModalBox/about-modal-box.css +23 -12
  14. package/components/AboutModalBox/about-modal-box.scss +25 -12
  15. package/components/Accordion/accordion.css +33 -20
  16. package/components/Accordion/accordion.scss +32 -20
  17. package/components/ActionList/action-list.css +2 -2
  18. package/components/ActionList/action-list.scss +2 -2
  19. package/components/Alert/alert-group.css +7 -4
  20. package/components/Alert/alert-group.scss +7 -4
  21. package/components/Alert/alert.css +19 -13
  22. package/components/Alert/alert.scss +18 -13
  23. package/components/AppLauncher/app-launcher.css +32 -23
  24. package/components/AppLauncher/app-launcher.scss +32 -23
  25. package/components/BackToTop/back-to-top.css +2 -2
  26. package/components/BackToTop/back-to-top.scss +2 -2
  27. package/components/Backdrop/backdrop.css +2 -2
  28. package/components/Backdrop/backdrop.scss +2 -2
  29. package/components/BackgroundImage/background-image.css +6 -3
  30. package/components/BackgroundImage/background-image.scss +8 -3
  31. package/components/Badge/badge.css +2 -2
  32. package/components/Badge/badge.scss +2 -2
  33. package/components/Banner/banner.css +5 -5
  34. package/components/Banner/banner.scss +5 -2
  35. package/components/Breadcrumb/breadcrumb.css +9 -3
  36. package/components/Breadcrumb/breadcrumb.scss +8 -3
  37. package/components/Button/button.css +26 -17
  38. package/components/Button/button.scss +26 -16
  39. package/components/Button/themes/dark/button.scss +1 -1
  40. package/components/CalendarMonth/calendar-month.css +25 -15
  41. package/components/CalendarMonth/calendar-month.scss +23 -15
  42. package/components/Card/card.css +25 -17
  43. package/components/Card/card.scss +24 -17
  44. package/components/Check/check.css +2 -2
  45. package/components/Check/check.scss +2 -2
  46. package/components/Chip/chip-group.css +6 -6
  47. package/components/Chip/chip-group.scss +6 -6
  48. package/components/Chip/chip.css +16 -9
  49. package/components/Chip/chip.scss +17 -9
  50. package/components/ClipboardCopy/clipboard-copy.css +19 -10
  51. package/components/ClipboardCopy/clipboard-copy.scss +16 -8
  52. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +2 -2
  53. package/components/CodeBlock/code-block.css +6 -3
  54. package/components/CodeBlock/code-block.scss +6 -3
  55. package/components/CodeEditor/code-editor.css +31 -22
  56. package/components/CodeEditor/code-editor.scss +30 -21
  57. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  58. package/components/Content/content.css +33 -30
  59. package/components/Content/content.scss +33 -30
  60. package/components/ContextSelector/context-selector.css +41 -26
  61. package/components/ContextSelector/context-selector.scss +40 -25
  62. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  63. package/components/DataList/data-list-grid.css +21 -49
  64. package/components/DataList/data-list-grid.scss +3 -3
  65. package/components/DataList/data-list.css +69 -84
  66. package/components/DataList/data-list.scss +47 -35
  67. package/components/DatePicker/date-picker.css +8 -8
  68. package/components/DatePicker/date-picker.scss +8 -8
  69. package/components/DescriptionList/description-list.css +8 -5
  70. package/components/DescriptionList/description-list.scss +8 -5
  71. package/components/DragDrop/drag-drop.css +8 -8
  72. package/components/DragDrop/drag-drop.scss +8 -8
  73. package/components/Drawer/drawer.css +120 -61
  74. package/components/Drawer/drawer.scss +92 -43
  75. package/components/Dropdown/dropdown.css +75 -66
  76. package/components/Dropdown/dropdown.scss +65 -56
  77. package/components/DualListSelector/dual-list-selector.css +29 -15
  78. package/components/DualListSelector/dual-list-selector.scss +30 -15
  79. package/components/EmptyState/empty-state.css +7 -4
  80. package/components/EmptyState/empty-state.scss +7 -4
  81. package/components/ExpandableSection/expandable-section.css +17 -10
  82. package/components/ExpandableSection/expandable-section.scss +15 -10
  83. package/components/FileUpload/file-upload.css +9 -15
  84. package/components/FileUpload/file-upload.scss +9 -15
  85. package/components/Form/form.css +53 -50
  86. package/components/Form/form.scss +46 -44
  87. package/components/FormControl/form-control.css +21 -11
  88. package/components/FormControl/form-control.scss +21 -11
  89. package/components/HelperText/helper-text.css +1 -1
  90. package/components/HelperText/helper-text.scss +1 -1
  91. package/components/Hint/hint.css +9 -6
  92. package/components/Hint/hint.scss +9 -6
  93. package/components/Icon/icon.css +1 -1
  94. package/components/Icon/icon.scss +1 -1
  95. package/components/InlineEdit/inline-edit.css +4 -4
  96. package/components/InlineEdit/inline-edit.scss +4 -4
  97. package/components/InputGroup/input-group.css +12 -6
  98. package/components/InputGroup/input-group.scss +11 -5
  99. package/components/InputGroup/themes/dark/input-group.scss +1 -1
  100. package/components/JumpLinks/jump-links.css +27 -24
  101. package/components/JumpLinks/jump-links.scss +26 -24
  102. package/components/Label/label-group.css +13 -10
  103. package/components/Label/label-group.scss +13 -10
  104. package/components/Label/label.css +9 -9
  105. package/components/Label/label.scss +9 -9
  106. package/components/List/list.css +9 -9
  107. package/components/List/list.scss +9 -9
  108. package/components/LogViewer/log-viewer.css +14 -14
  109. package/components/LogViewer/log-viewer.scss +14 -14
  110. package/components/Login/login.css +36 -27
  111. package/components/Login/login.scss +36 -27
  112. package/components/Masthead/masthead.css +19 -22
  113. package/components/Masthead/masthead.scss +19 -22
  114. package/components/Menu/menu.css +80 -66
  115. package/components/Menu/menu.scss +81 -69
  116. package/components/MenuToggle/menu-toggle.css +41 -29
  117. package/components/MenuToggle/menu-toggle.scss +41 -29
  118. package/components/ModalBox/modal-box.css +19 -19
  119. package/components/ModalBox/modal-box.scss +20 -20
  120. package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
  121. package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
  122. package/components/Nav/nav.css +120 -93
  123. package/components/Nav/nav.scss +120 -93
  124. package/components/Nav/themes/dark/nav.scss +2 -2
  125. package/components/NotificationBadge/notification-badge.css +13 -7
  126. package/components/NotificationBadge/notification-badge.scss +13 -7
  127. package/components/NotificationDrawer/notification-drawer.css +32 -19
  128. package/components/NotificationDrawer/notification-drawer.scss +30 -19
  129. package/components/NumberInput/number-input.css +3 -3
  130. package/components/NumberInput/number-input.scss +2 -2
  131. package/components/OptionsMenu/options-menu.css +43 -31
  132. package/components/OptionsMenu/options-menu.scss +43 -31
  133. package/components/OverflowMenu/overflow-menu.css +2 -2
  134. package/components/OverflowMenu/overflow-menu.scss +2 -2
  135. package/components/Page/page.css +123 -65
  136. package/components/Page/page.scss +69 -40
  137. package/components/Page/themes/dark/page.scss +1 -1
  138. package/components/Pagination/pagination.css +28 -18
  139. package/components/Pagination/pagination.scss +25 -17
  140. package/components/Panel/panel.css +13 -7
  141. package/components/Panel/panel.scss +13 -7
  142. package/components/Popover/popover.css +82 -31
  143. package/components/Popover/popover.scss +104 -45
  144. package/components/Progress/progress.css +9 -7
  145. package/components/Progress/progress.scss +12 -7
  146. package/components/ProgressStepper/progress-stepper.css +26 -20
  147. package/components/ProgressStepper/progress-stepper.scss +25 -19
  148. package/components/Radio/radio.css +4 -5
  149. package/components/Radio/radio.scss +4 -5
  150. package/components/Select/select.css +56 -47
  151. package/components/Select/select.scss +56 -47
  152. package/components/Sidebar/sidebar.css +11 -5
  153. package/components/Sidebar/sidebar.scss +11 -5
  154. package/components/SimpleList/simple-list.css +10 -4
  155. package/components/SimpleList/simple-list.scss +10 -4
  156. package/components/Skeleton/skeleton.css +6 -5
  157. package/components/Skeleton/skeleton.scss +4 -5
  158. package/components/SkipToContent/skip-to-content.css +3 -3
  159. package/components/SkipToContent/skip-to-content.scss +3 -3
  160. package/components/Slider/slider.css +47 -26
  161. package/components/Slider/slider.scss +56 -28
  162. package/components/Switch/switch.css +9 -5
  163. package/components/Switch/switch.scss +10 -6
  164. package/components/TabContent/tab-content.css +4 -1
  165. package/components/TabContent/tab-content.scss +4 -1
  166. package/components/Table/table-grid.css +256 -219
  167. package/components/Table/table-grid.scss +53 -39
  168. package/components/Table/table-scrollable.css +4 -4
  169. package/components/Table/table-scrollable.scss +6 -4
  170. package/components/Table/table-tree-view.css +112 -105
  171. package/components/Table/table-tree-view.scss +38 -33
  172. package/components/Table/table.css +91 -69
  173. package/components/Table/table.scss +89 -69
  174. package/components/Tabs/tabs.css +76 -48
  175. package/components/Tabs/tabs.scss +74 -48
  176. package/components/TextInputGroup/text-input-group.css +15 -15
  177. package/components/TextInputGroup/text-input-group.scss +15 -15
  178. package/components/Tile/tile.css +10 -10
  179. package/components/Tile/tile.scss +10 -10
  180. package/components/ToggleGroup/toggle-group.css +14 -11
  181. package/components/ToggleGroup/toggle-group.scss +14 -11
  182. package/components/Toolbar/toolbar.css +44 -41
  183. package/components/Toolbar/toolbar.scss +26 -21
  184. package/components/Tooltip/tooltip.css +76 -25
  185. package/components/Tooltip/tooltip.scss +100 -41
  186. package/components/TreeView/tree-view.css +48 -27
  187. package/components/TreeView/tree-view.scss +50 -28
  188. package/components/Truncate/truncate.css +9 -0
  189. package/components/Truncate/truncate.scss +16 -3
  190. package/components/Wizard/wizard.css +57 -36
  191. package/components/Wizard/wizard.scss +57 -36
  192. package/docs/components/AppLauncher/deprecated/application-launcher.md +155 -70
  193. package/docs/components/Breadcrumb/examples/Breadcrumb.md +11 -5
  194. package/docs/components/Button/examples/Button.css +2 -2
  195. package/docs/components/Button/examples/Button.md +16 -3
  196. package/docs/components/Card/examples/Card.md +154 -66
  197. package/docs/components/Chip/examples/Chip.md +1 -1
  198. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  199. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  200. package/docs/components/ContextSelector/deprecated/context-selector.md +198 -96
  201. package/docs/components/DataList/examples/DataList.md +391 -136
  202. package/docs/components/DragDrop/examples/DragDrop.css +2 -2
  203. package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
  204. package/docs/components/Dropdown/deprecated/Dropdown.md +881 -367
  205. package/docs/components/DualListSelector/examples/DualListSelector.md +432 -144
  206. package/docs/components/FormControl/examples/FormControl.md +2 -1
  207. package/docs/components/Hint/examples/Hint.md +57 -24
  208. package/docs/components/InlineEdit/examples/InlineEdit.md +46 -16
  209. package/docs/components/Label/examples/Label.md +1 -1
  210. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  211. package/docs/components/LogViewer/examples/LogViewer.md +40 -30
  212. package/docs/components/Menu/examples/Menu.css +8 -0
  213. package/docs/components/Menu/examples/Menu.md +111 -73
  214. package/docs/components/MenuToggle/examples/MenuToggle.md +1 -1
  215. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  216. package/docs/components/Nav/examples/Navigation.css +3 -26
  217. package/docs/components/Nav/examples/Navigation.md +99 -0
  218. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +619 -240
  219. package/docs/components/OptionsMenu/deprecated/options-menu.md +415 -163
  220. package/docs/components/OverflowMenu/examples/overflow-menu.md +45 -34
  221. package/docs/components/Pagination/examples/Pagination.md +195 -65
  222. package/docs/components/Popover/examples/Popover.css +4 -9
  223. package/docs/components/Popover/examples/Popover.md +4 -4
  224. package/docs/components/ProgressStepper/examples/ProgressStepper.md +50 -0
  225. package/docs/components/Select/deprecated/Select.css +3 -3
  226. package/docs/components/Select/deprecated/Select.md +40 -52
  227. package/docs/components/Table/examples/Table.css +2 -2
  228. package/docs/components/Table/examples/Table.md +4548 -1670
  229. package/docs/components/Tabs/examples/Tabs.md +1094 -438
  230. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  231. package/docs/components/Tile/examples/Tile.css +1 -1
  232. package/docs/components/Toolbar/examples/Toolbar.md +218 -128
  233. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  234. package/docs/components/Tooltip/examples/Tooltip.md +8 -6
  235. package/docs/components/TreeView/examples/TreeView.md +23 -8
  236. package/docs/components/Truncate/examples/Truncate.md +2 -2
  237. package/docs/demos/Card/examples/Card.css +3 -3
  238. package/docs/demos/Card/examples/Card.md +72 -31
  239. package/docs/demos/CardView/examples/CardView.md +182 -74
  240. package/docs/demos/ContextSelector/examples/ContextSelector.md +95 -47
  241. package/docs/demos/Dashboard/examples/Dashboard.md +18 -9
  242. package/docs/demos/DataList/examples/DataList.md +171 -72
  243. package/docs/demos/DescriptionList/examples/DescriptionList.md +20 -9
  244. package/docs/demos/Drawer/examples/Drawer.md +20 -9
  245. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +803 -338
  246. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +257 -105
  247. package/docs/demos/Skeleton/examples/Skeleton.md +7 -35
  248. package/docs/demos/Table/examples/Table.md +1470 -619
  249. package/docs/demos/Tabs/examples/Tabs.md +117 -49
  250. package/docs/demos/Toolbar/examples/Toolbar.md +318 -123
  251. package/docs/layouts/Flex/examples/Flex.md +5 -5
  252. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  253. package/icons/pficons.mjs +1 -0
  254. package/layouts/Flex/flex.css +115 -43
  255. package/layouts/Flex/flex.scss +20 -8
  256. package/package.json +41 -37
  257. package/patternfly-addons.css +732 -972
  258. package/patternfly-base-no-globals-theme-dark-unversioned.css +26 -3
  259. package/patternfly-base-no-globals.css +26 -3
  260. package/patternfly-base-theme-dark-unversioned.css +27 -4
  261. package/patternfly-base.css +27 -4
  262. package/patternfly-no-globals.css +2695 -1897
  263. package/patternfly-theme-dark-unversioned.css +2696 -1898
  264. package/patternfly.css +2696 -1898
  265. package/patternfly.min.css +1 -1
  266. package/patternfly.min.css.map +1 -1
  267. package/sass-utilities/functions.scss +6 -0
  268. package/sass-utilities/mixins.scss +62 -2
  269. package/sass-utilities/placeholders.scss +1 -1
  270. package/sass-utilities/scss-variables.scss +8 -8
  271. package/sass-utilities/themes/dark/mixins.scss +3 -1
  272. package/utilities/Accessibility/accessibility.css +12 -12
  273. package/utilities/Spacing/spacing.css +720 -960
  274. package/utilities/Spacing/spacing.scss +4 -8
package/docs/components/DualListSelector/examples/DualListSelector.md CHANGED
@@ -38,7 +38,10 @@ cssPrefix: pf-v5-c-dual-list-selector
38
38
  type="button"
39
39
  aria-label="Sort"
40
40
  >
41
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
41
+ <i
42
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
43
+ aria-hidden="true"
44
+ ></i>
42
45
  </button>
43
46
  <div class="pf-v5-c-dropdown">
44
47
  <button
@@ -54,31 +57,46 @@ cssPrefix: pf-v5-c-dual-list-selector
54
57
  class="pf-v5-c-dropdown__menu"
55
58
  aria-labelledby="dropdown-kebab-basic-available-button"
56
59
  hidden
60
+ role="menu"
57
61
  >
58
- <li>
59
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
62
+ <li role="none">
63
+ <a
64
+ class="pf-v5-c-dropdown__menu-item"
65
+ role="menuitem"
66
+ href="#"
67
+ >Link</a>
60
68
  </li>
61
- <li>
62
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
69
+ <li role="none">
70
+ <button
71
+ class="pf-v5-c-dropdown__menu-item"
72
+ role="menuitem"
73
+ type="button"
74
+ >Action</button>
63
75
  </li>
64
- <li>
76
+ <li role="none">
65
77
  <a
66
78
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
79
+ role="menuitem"
67
80
  href="#"
68
81
  aria-disabled="true"
69
82
  tabindex="-1"
70
83
  >Disabled link</a>
71
84
  </li>
72
- <li>
85
+ <li role="none">
73
86
  <button
74
87
  class="pf-v5-c-dropdown__menu-item"
88
+ role="menuitem"
75
89
  type="button"
76
90
  disabled
77
91
  >Disabled action</button>
78
92
  </li>
79
93
  <li class="pf-v5-c-divider" role="separator"></li>
80
- <li>
81
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
94
+ <li role="none">
95
+ <a
96
+ class="pf-v5-c-dropdown__menu-item"
97
+ role="menuitem"
98
+ href="#"
99
+ >Separated link</a>
82
100
  </li>
83
101
  </ul>
84
102
  </div>
@@ -237,7 +255,10 @@ cssPrefix: pf-v5-c-dual-list-selector
237
255
  type="button"
238
256
  aria-label="Sort"
239
257
  >
240
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
258
+ <i
259
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
260
+ aria-hidden="true"
261
+ ></i>
241
262
  </button>
242
263
  <div class="pf-v5-c-dropdown">
243
264
  <button
@@ -253,31 +274,46 @@ cssPrefix: pf-v5-c-dual-list-selector
253
274
  class="pf-v5-c-dropdown__menu"
254
275
  aria-labelledby="dropdown-kebab-basic-chosen-button"
255
276
  hidden
277
+ role="menu"
256
278
  >
257
- <li>
258
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
279
+ <li role="none">
280
+ <a
281
+ class="pf-v5-c-dropdown__menu-item"
282
+ role="menuitem"
283
+ href="#"
284
+ >Link</a>
259
285
  </li>
260
- <li>
261
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
286
+ <li role="none">
287
+ <button
288
+ class="pf-v5-c-dropdown__menu-item"
289
+ role="menuitem"
290
+ type="button"
291
+ >Action</button>
262
292
  </li>
263
- <li>
293
+ <li role="none">
264
294
  <a
265
295
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
296
+ role="menuitem"
266
297
  href="#"
267
298
  aria-disabled="true"
268
299
  tabindex="-1"
269
300
  >Disabled link</a>
270
301
  </li>
271
- <li>
302
+ <li role="none">
272
303
  <button
273
304
  class="pf-v5-c-dropdown__menu-item"
305
+ role="menuitem"
274
306
  type="button"
275
307
  disabled
276
308
  >Disabled action</button>
277
309
  </li>
278
310
  <li class="pf-v5-c-divider" role="separator"></li>
279
- <li>
280
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
311
+ <li role="none">
312
+ <a
313
+ class="pf-v5-c-dropdown__menu-item"
314
+ role="menuitem"
315
+ href="#"
316
+ >Separated link</a>
281
317
  </li>
282
318
  </ul>
283
319
  </div>
@@ -337,7 +373,10 @@ cssPrefix: pf-v5-c-dual-list-selector
337
373
  type="button"
338
374
  aria-label="Sort"
339
375
  >
340
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
376
+ <i
377
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
378
+ aria-hidden="true"
379
+ ></i>
341
380
  </button>
342
381
  <div class="pf-v5-c-dropdown">
343
382
  <button
@@ -353,31 +392,46 @@ cssPrefix: pf-v5-c-dual-list-selector
353
392
  class="pf-v5-c-dropdown__menu"
354
393
  aria-labelledby="dropdown-kebab-available-item-selected-available-button"
355
394
  hidden
395
+ role="menu"
356
396
  >
357
- <li>
358
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
397
+ <li role="none">
398
+ <a
399
+ class="pf-v5-c-dropdown__menu-item"
400
+ role="menuitem"
401
+ href="#"
402
+ >Link</a>
359
403
  </li>
360
- <li>
361
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
404
+ <li role="none">
405
+ <button
406
+ class="pf-v5-c-dropdown__menu-item"
407
+ role="menuitem"
408
+ type="button"
409
+ >Action</button>
362
410
  </li>
363
- <li>
411
+ <li role="none">
364
412
  <a
365
413
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
414
+ role="menuitem"
366
415
  href="#"
367
416
  aria-disabled="true"
368
417
  tabindex="-1"
369
418
  >Disabled link</a>
370
419
  </li>
371
- <li>
420
+ <li role="none">
372
421
  <button
373
422
  class="pf-v5-c-dropdown__menu-item"
423
+ role="menuitem"
374
424
  type="button"
375
425
  disabled
376
426
  >Disabled action</button>
377
427
  </li>
378
428
  <li class="pf-v5-c-divider" role="separator"></li>
379
- <li>
380
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
429
+ <li role="none">
430
+ <a
431
+ class="pf-v5-c-dropdown__menu-item"
432
+ role="menuitem"
433
+ href="#"
434
+ >Separated link</a>
381
435
  </li>
382
436
  </ul>
383
437
  </div>
@@ -530,7 +584,10 @@ cssPrefix: pf-v5-c-dual-list-selector
530
584
  type="button"
531
585
  aria-label="Sort"
532
586
  >
533
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
587
+ <i
588
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
589
+ aria-hidden="true"
590
+ ></i>
534
591
  </button>
535
592
  <div class="pf-v5-c-dropdown">
536
593
  <button
@@ -546,31 +603,46 @@ cssPrefix: pf-v5-c-dual-list-selector
546
603
  class="pf-v5-c-dropdown__menu"
547
604
  aria-labelledby="dropdown-kebab-available-item-selected-chosen-button"
548
605
  hidden
606
+ role="menu"
549
607
  >
550
- <li>
551
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
608
+ <li role="none">
609
+ <a
610
+ class="pf-v5-c-dropdown__menu-item"
611
+ role="menuitem"
612
+ href="#"
613
+ >Link</a>
552
614
  </li>
553
- <li>
554
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
615
+ <li role="none">
616
+ <button
617
+ class="pf-v5-c-dropdown__menu-item"
618
+ role="menuitem"
619
+ type="button"
620
+ >Action</button>
555
621
  </li>
556
- <li>
622
+ <li role="none">
557
623
  <a
558
624
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
625
+ role="menuitem"
559
626
  href="#"
560
627
  aria-disabled="true"
561
628
  tabindex="-1"
562
629
  >Disabled link</a>
563
630
  </li>
564
- <li>
631
+ <li role="none">
565
632
  <button
566
633
  class="pf-v5-c-dropdown__menu-item"
634
+ role="menuitem"
567
635
  type="button"
568
636
  disabled
569
637
  >Disabled action</button>
570
638
  </li>
571
639
  <li class="pf-v5-c-divider" role="separator"></li>
572
- <li>
573
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
640
+ <li role="none">
641
+ <a
642
+ class="pf-v5-c-dropdown__menu-item"
643
+ role="menuitem"
644
+ href="#"
645
+ >Separated link</a>
574
646
  </li>
575
647
  </ul>
576
648
  </div>
@@ -630,7 +702,10 @@ cssPrefix: pf-v5-c-dual-list-selector
630
702
  type="button"
631
703
  aria-label="Sort"
632
704
  >
633
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
705
+ <i
706
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
707
+ aria-hidden="true"
708
+ ></i>
634
709
  </button>
635
710
  <div class="pf-v5-c-dropdown">
636
711
  <button
@@ -646,31 +721,46 @@ cssPrefix: pf-v5-c-dual-list-selector
646
721
  class="pf-v5-c-dropdown__menu"
647
722
  aria-labelledby="dropdown-kebab-multiple-available-items-selected-available-button"
648
723
  hidden
724
+ role="menu"
649
725
  >
650
- <li>
651
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
726
+ <li role="none">
727
+ <a
728
+ class="pf-v5-c-dropdown__menu-item"
729
+ role="menuitem"
730
+ href="#"
731
+ >Link</a>
652
732
  </li>
653
- <li>
654
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
733
+ <li role="none">
734
+ <button
735
+ class="pf-v5-c-dropdown__menu-item"
736
+ role="menuitem"
737
+ type="button"
738
+ >Action</button>
655
739
  </li>
656
- <li>
740
+ <li role="none">
657
741
  <a
658
742
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
743
+ role="menuitem"
659
744
  href="#"
660
745
  aria-disabled="true"
661
746
  tabindex="-1"
662
747
  >Disabled link</a>
663
748
  </li>
664
- <li>
749
+ <li role="none">
665
750
  <button
666
751
  class="pf-v5-c-dropdown__menu-item"
752
+ role="menuitem"
667
753
  type="button"
668
754
  disabled
669
755
  >Disabled action</button>
670
756
  </li>
671
757
  <li class="pf-v5-c-divider" role="separator"></li>
672
- <li>
673
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
758
+ <li role="none">
759
+ <a
760
+ class="pf-v5-c-dropdown__menu-item"
761
+ role="menuitem"
762
+ href="#"
763
+ >Separated link</a>
674
764
  </li>
675
765
  </ul>
676
766
  </div>
@@ -823,7 +913,10 @@ cssPrefix: pf-v5-c-dual-list-selector
823
913
  type="button"
824
914
  aria-label="Sort"
825
915
  >
826
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
916
+ <i
917
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
918
+ aria-hidden="true"
919
+ ></i>
827
920
  </button>
828
921
  <div class="pf-v5-c-dropdown">
829
922
  <button
@@ -839,31 +932,46 @@ cssPrefix: pf-v5-c-dual-list-selector
839
932
  class="pf-v5-c-dropdown__menu"
840
933
  aria-labelledby="dropdown-kebab-multiple-available-items-selected-chosen-button"
841
934
  hidden
935
+ role="menu"
842
936
  >
843
- <li>
844
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
937
+ <li role="none">
938
+ <a
939
+ class="pf-v5-c-dropdown__menu-item"
940
+ role="menuitem"
941
+ href="#"
942
+ >Link</a>
845
943
  </li>
846
- <li>
847
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
944
+ <li role="none">
945
+ <button
946
+ class="pf-v5-c-dropdown__menu-item"
947
+ role="menuitem"
948
+ type="button"
949
+ >Action</button>
848
950
  </li>
849
- <li>
951
+ <li role="none">
850
952
  <a
851
953
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
954
+ role="menuitem"
852
955
  href="#"
853
956
  aria-disabled="true"
854
957
  tabindex="-1"
855
958
  >Disabled link</a>
856
959
  </li>
857
- <li>
960
+ <li role="none">
858
961
  <button
859
962
  class="pf-v5-c-dropdown__menu-item"
963
+ role="menuitem"
860
964
  type="button"
861
965
  disabled
862
966
  >Disabled action</button>
863
967
  </li>
864
968
  <li class="pf-v5-c-divider" role="separator"></li>
865
- <li>
866
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
969
+ <li role="none">
970
+ <a
971
+ class="pf-v5-c-dropdown__menu-item"
972
+ role="menuitem"
973
+ href="#"
974
+ >Separated link</a>
867
975
  </li>
868
976
  </ul>
869
977
  </div>
@@ -923,7 +1031,10 @@ cssPrefix: pf-v5-c-dual-list-selector
923
1031
  type="button"
924
1032
  aria-label="Sort"
925
1033
  >
926
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1034
+ <i
1035
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1036
+ aria-hidden="true"
1037
+ ></i>
927
1038
  </button>
928
1039
  <div class="pf-v5-c-dropdown">
929
1040
  <button
@@ -939,31 +1050,46 @@ cssPrefix: pf-v5-c-dual-list-selector
939
1050
  class="pf-v5-c-dropdown__menu"
940
1051
  aria-labelledby="dropdown-kebab-chosen-item-available-button"
941
1052
  hidden
1053
+ role="menu"
942
1054
  >
943
- <li>
944
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1055
+ <li role="none">
1056
+ <a
1057
+ class="pf-v5-c-dropdown__menu-item"
1058
+ role="menuitem"
1059
+ href="#"
1060
+ >Link</a>
945
1061
  </li>
946
- <li>
947
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
1062
+ <li role="none">
1063
+ <button
1064
+ class="pf-v5-c-dropdown__menu-item"
1065
+ role="menuitem"
1066
+ type="button"
1067
+ >Action</button>
948
1068
  </li>
949
- <li>
1069
+ <li role="none">
950
1070
  <a
951
1071
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1072
+ role="menuitem"
952
1073
  href="#"
953
1074
  aria-disabled="true"
954
1075
  tabindex="-1"
955
1076
  >Disabled link</a>
956
1077
  </li>
957
- <li>
1078
+ <li role="none">
958
1079
  <button
959
1080
  class="pf-v5-c-dropdown__menu-item"
1081
+ role="menuitem"
960
1082
  type="button"
961
1083
  disabled
962
1084
  >Disabled action</button>
963
1085
  </li>
964
1086
  <li class="pf-v5-c-divider" role="separator"></li>
965
- <li>
966
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
1087
+ <li role="none">
1088
+ <a
1089
+ class="pf-v5-c-dropdown__menu-item"
1090
+ role="menuitem"
1091
+ href="#"
1092
+ >Separated link</a>
967
1093
  </li>
968
1094
  </ul>
969
1095
  </div>
@@ -1116,7 +1242,10 @@ cssPrefix: pf-v5-c-dual-list-selector
1116
1242
  type="button"
1117
1243
  aria-label="Sort"
1118
1244
  >
1119
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1245
+ <i
1246
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1247
+ aria-hidden="true"
1248
+ ></i>
1120
1249
  </button>
1121
1250
  <div class="pf-v5-c-dropdown">
1122
1251
  <button
@@ -1132,31 +1261,46 @@ cssPrefix: pf-v5-c-dual-list-selector
1132
1261
  class="pf-v5-c-dropdown__menu"
1133
1262
  aria-labelledby="dropdown-kebab-chosen-item-chosen-button"
1134
1263
  hidden
1264
+ role="menu"
1135
1265
  >
1136
- <li>
1137
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1266
+ <li role="none">
1267
+ <a
1268
+ class="pf-v5-c-dropdown__menu-item"
1269
+ role="menuitem"
1270
+ href="#"
1271
+ >Link</a>
1138
1272
  </li>
1139
- <li>
1140
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
1273
+ <li role="none">
1274
+ <button
1275
+ class="pf-v5-c-dropdown__menu-item"
1276
+ role="menuitem"
1277
+ type="button"
1278
+ >Action</button>
1141
1279
  </li>
1142
- <li>
1280
+ <li role="none">
1143
1281
  <a
1144
1282
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1283
+ role="menuitem"
1145
1284
  href="#"
1146
1285
  aria-disabled="true"
1147
1286
  tabindex="-1"
1148
1287
  >Disabled link</a>
1149
1288
  </li>
1150
- <li>
1289
+ <li role="none">
1151
1290
  <button
1152
1291
  class="pf-v5-c-dropdown__menu-item"
1292
+ role="menuitem"
1153
1293
  type="button"
1154
1294
  disabled
1155
1295
  >Disabled action</button>
1156
1296
  </li>
1157
1297
  <li class="pf-v5-c-divider" role="separator"></li>
1158
- <li>
1159
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
1298
+ <li role="none">
1299
+ <a
1300
+ class="pf-v5-c-dropdown__menu-item"
1301
+ role="menuitem"
1302
+ href="#"
1303
+ >Separated link</a>
1160
1304
  </li>
1161
1305
  </ul>
1162
1306
  </div>
@@ -1229,7 +1373,10 @@ cssPrefix: pf-v5-c-dual-list-selector
1229
1373
  type="button"
1230
1374
  aria-label="Sort"
1231
1375
  >
1232
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1376
+ <i
1377
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1378
+ aria-hidden="true"
1379
+ ></i>
1233
1380
  </button>
1234
1381
  <div class="pf-v5-c-dropdown">
1235
1382
  <button
@@ -1245,31 +1392,46 @@ cssPrefix: pf-v5-c-dual-list-selector
1245
1392
  class="pf-v5-c-dropdown__menu"
1246
1393
  aria-labelledby="dropdown-kebab-chosen-item-selected-available-button"
1247
1394
  hidden
1395
+ role="menu"
1248
1396
  >
1249
- <li>
1250
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1397
+ <li role="none">
1398
+ <a
1399
+ class="pf-v5-c-dropdown__menu-item"
1400
+ role="menuitem"
1401
+ href="#"
1402
+ >Link</a>
1251
1403
  </li>
1252
- <li>
1253
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
1404
+ <li role="none">
1405
+ <button
1406
+ class="pf-v5-c-dropdown__menu-item"
1407
+ role="menuitem"
1408
+ type="button"
1409
+ >Action</button>
1254
1410
  </li>
1255
- <li>
1411
+ <li role="none">
1256
1412
  <a
1257
1413
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1414
+ role="menuitem"
1258
1415
  href="#"
1259
1416
  aria-disabled="true"
1260
1417
  tabindex="-1"
1261
1418
  >Disabled link</a>
1262
1419
  </li>
1263
- <li>
1420
+ <li role="none">
1264
1421
  <button
1265
1422
  class="pf-v5-c-dropdown__menu-item"
1423
+ role="menuitem"
1266
1424
  type="button"
1267
1425
  disabled
1268
1426
  >Disabled action</button>
1269
1427
  </li>
1270
1428
  <li class="pf-v5-c-divider" role="separator"></li>
1271
- <li>
1272
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
1429
+ <li role="none">
1430
+ <a
1431
+ class="pf-v5-c-dropdown__menu-item"
1432
+ role="menuitem"
1433
+ href="#"
1434
+ >Separated link</a>
1273
1435
  </li>
1274
1436
  </ul>
1275
1437
  </div>
@@ -1421,7 +1583,10 @@ cssPrefix: pf-v5-c-dual-list-selector
1421
1583
  type="button"
1422
1584
  aria-label="Sort"
1423
1585
  >
1424
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1586
+ <i
1587
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1588
+ aria-hidden="true"
1589
+ ></i>
1425
1590
  </button>
1426
1591
  <div class="pf-v5-c-dropdown">
1427
1592
  <button
@@ -1437,31 +1602,46 @@ cssPrefix: pf-v5-c-dual-list-selector
1437
1602
  class="pf-v5-c-dropdown__menu"
1438
1603
  aria-labelledby="dropdown-kebab-chosen-item-selected-chosen-button"
1439
1604
  hidden
1605
+ role="menu"
1440
1606
  >
1441
- <li>
1442
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1607
+ <li role="none">
1608
+ <a
1609
+ class="pf-v5-c-dropdown__menu-item"
1610
+ role="menuitem"
1611
+ href="#"
1612
+ >Link</a>
1443
1613
  </li>
1444
- <li>
1445
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
1614
+ <li role="none">
1615
+ <button
1616
+ class="pf-v5-c-dropdown__menu-item"
1617
+ role="menuitem"
1618
+ type="button"
1619
+ >Action</button>
1446
1620
  </li>
1447
- <li>
1621
+ <li role="none">
1448
1622
  <a
1449
1623
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1624
+ role="menuitem"
1450
1625
  href="#"
1451
1626
  aria-disabled="true"
1452
1627
  tabindex="-1"
1453
1628
  >Disabled link</a>
1454
1629
  </li>
1455
- <li>
1630
+ <li role="none">
1456
1631
  <button
1457
1632
  class="pf-v5-c-dropdown__menu-item"
1633
+ role="menuitem"
1458
1634
  type="button"
1459
1635
  disabled
1460
1636
  >Disabled action</button>
1461
1637
  </li>
1462
1638
  <li class="pf-v5-c-divider" role="separator"></li>
1463
- <li>
1464
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
1639
+ <li role="none">
1640
+ <a
1641
+ class="pf-v5-c-dropdown__menu-item"
1642
+ role="menuitem"
1643
+ href="#"
1644
+ >Separated link</a>
1465
1645
  </li>
1466
1646
  </ul>
1467
1647
  </div>
@@ -1534,7 +1714,10 @@ cssPrefix: pf-v5-c-dual-list-selector
1534
1714
  type="button"
1535
1715
  aria-label="Sort"
1536
1716
  >
1537
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1717
+ <i
1718
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1719
+ aria-hidden="true"
1720
+ ></i>
1538
1721
  </button>
1539
1722
  <div class="pf-v5-c-dropdown">
1540
1723
  <button
@@ -1550,31 +1733,46 @@ cssPrefix: pf-v5-c-dual-list-selector
1550
1733
  class="pf-v5-c-dropdown__menu"
1551
1734
  aria-labelledby="dropdown-kebab-tree-available-button"
1552
1735
  hidden
1736
+ role="menu"
1553
1737
  >
1554
- <li>
1555
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
1738
+ <li role="none">
1739
+ <a
1740
+ class="pf-v5-c-dropdown__menu-item"
1741
+ role="menuitem"
1742
+ href="#"
1743
+ >Link</a>
1556
1744
  </li>
1557
- <li>
1558
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
1745
+ <li role="none">
1746
+ <button
1747
+ class="pf-v5-c-dropdown__menu-item"
1748
+ role="menuitem"
1749
+ type="button"
1750
+ >Action</button>
1559
1751
  </li>
1560
- <li>
1752
+ <li role="none">
1561
1753
  <a
1562
1754
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
1755
+ role="menuitem"
1563
1756
  href="#"
1564
1757
  aria-disabled="true"
1565
1758
  tabindex="-1"
1566
1759
  >Disabled link</a>
1567
1760
  </li>
1568
- <li>
1761
+ <li role="none">
1569
1762
  <button
1570
1763
  class="pf-v5-c-dropdown__menu-item"
1764
+ role="menuitem"
1571
1765
  type="button"
1572
1766
  disabled
1573
1767
  >Disabled action</button>
1574
1768
  </li>
1575
1769
  <li class="pf-v5-c-divider" role="separator"></li>
1576
- <li>
1577
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
1770
+ <li role="none">
1771
+ <a
1772
+ class="pf-v5-c-dropdown__menu-item"
1773
+ role="menuitem"
1774
+ href="#"
1775
+ >Separated link</a>
1578
1776
  </li>
1579
1777
  </ul>
1580
1778
  </div>
@@ -1995,7 +2193,10 @@ cssPrefix: pf-v5-c-dual-list-selector
1995
2193
  type="button"
1996
2194
  aria-label="Sort"
1997
2195
  >
1998
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
2196
+ <i
2197
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
2198
+ aria-hidden="true"
2199
+ ></i>
1999
2200
  </button>
2000
2201
  <div class="pf-v5-c-dropdown">
2001
2202
  <button
@@ -2011,31 +2212,46 @@ cssPrefix: pf-v5-c-dual-list-selector
2011
2212
  class="pf-v5-c-dropdown__menu"
2012
2213
  aria-labelledby="dropdown-kebab-tree-chosen-button"
2013
2214
  hidden
2215
+ role="menu"
2014
2216
  >
2015
- <li>
2016
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
2217
+ <li role="none">
2218
+ <a
2219
+ class="pf-v5-c-dropdown__menu-item"
2220
+ role="menuitem"
2221
+ href="#"
2222
+ >Link</a>
2017
2223
  </li>
2018
- <li>
2019
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
2224
+ <li role="none">
2225
+ <button
2226
+ class="pf-v5-c-dropdown__menu-item"
2227
+ role="menuitem"
2228
+ type="button"
2229
+ >Action</button>
2020
2230
  </li>
2021
- <li>
2231
+ <li role="none">
2022
2232
  <a
2023
2233
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
2234
+ role="menuitem"
2024
2235
  href="#"
2025
2236
  aria-disabled="true"
2026
2237
  tabindex="-1"
2027
2238
  >Disabled link</a>
2028
2239
  </li>
2029
- <li>
2240
+ <li role="none">
2030
2241
  <button
2031
2242
  class="pf-v5-c-dropdown__menu-item"
2243
+ role="menuitem"
2032
2244
  type="button"
2033
2245
  disabled
2034
2246
  >Disabled action</button>
2035
2247
  </li>
2036
2248
  <li class="pf-v5-c-divider" role="separator"></li>
2037
- <li>
2038
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
2249
+ <li role="none">
2250
+ <a
2251
+ class="pf-v5-c-dropdown__menu-item"
2252
+ role="menuitem"
2253
+ href="#"
2254
+ >Separated link</a>
2039
2255
  </li>
2040
2256
  </ul>
2041
2257
  </div>
@@ -2095,7 +2311,10 @@ cssPrefix: pf-v5-c-dual-list-selector
2095
2311
  type="button"
2096
2312
  aria-label="Sort"
2097
2313
  >
2098
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
2314
+ <i
2315
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
2316
+ aria-hidden="true"
2317
+ ></i>
2099
2318
  </button>
2100
2319
  <div class="pf-v5-c-dropdown">
2101
2320
  <button
@@ -2111,31 +2330,46 @@ cssPrefix: pf-v5-c-dual-list-selector
2111
2330
  class="pf-v5-c-dropdown__menu"
2112
2331
  aria-labelledby="dropdown-kebab-tree-options-available-button"
2113
2332
  hidden
2333
+ role="menu"
2114
2334
  >
2115
- <li>
2116
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
2335
+ <li role="none">
2336
+ <a
2337
+ class="pf-v5-c-dropdown__menu-item"
2338
+ role="menuitem"
2339
+ href="#"
2340
+ >Link</a>
2117
2341
  </li>
2118
- <li>
2119
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
2342
+ <li role="none">
2343
+ <button
2344
+ class="pf-v5-c-dropdown__menu-item"
2345
+ role="menuitem"
2346
+ type="button"
2347
+ >Action</button>
2120
2348
  </li>
2121
- <li>
2349
+ <li role="none">
2122
2350
  <a
2123
2351
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
2352
+ role="menuitem"
2124
2353
  href="#"
2125
2354
  aria-disabled="true"
2126
2355
  tabindex="-1"
2127
2356
  >Disabled link</a>
2128
2357
  </li>
2129
- <li>
2358
+ <li role="none">
2130
2359
  <button
2131
2360
  class="pf-v5-c-dropdown__menu-item"
2361
+ role="menuitem"
2132
2362
  type="button"
2133
2363
  disabled
2134
2364
  >Disabled action</button>
2135
2365
  </li>
2136
2366
  <li class="pf-v5-c-divider" role="separator"></li>
2137
- <li>
2138
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
2367
+ <li role="none">
2368
+ <a
2369
+ class="pf-v5-c-dropdown__menu-item"
2370
+ role="menuitem"
2371
+ href="#"
2372
+ >Separated link</a>
2139
2373
  </li>
2140
2374
  </ul>
2141
2375
  </div>
@@ -2537,7 +2771,10 @@ cssPrefix: pf-v5-c-dual-list-selector
2537
2771
  type="button"
2538
2772
  aria-label="Sort"
2539
2773
  >
2540
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
2774
+ <i
2775
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
2776
+ aria-hidden="true"
2777
+ ></i>
2541
2778
  </button>
2542
2779
  <div class="pf-v5-c-dropdown">
2543
2780
  <button
@@ -2553,31 +2790,46 @@ cssPrefix: pf-v5-c-dual-list-selector
2553
2790
  class="pf-v5-c-dropdown__menu"
2554
2791
  aria-labelledby="dropdown-kebab-tree-options-chosen-button"
2555
2792
  hidden
2793
+ role="menu"
2556
2794
  >
2557
- <li>
2558
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
2795
+ <li role="none">
2796
+ <a
2797
+ class="pf-v5-c-dropdown__menu-item"
2798
+ role="menuitem"
2799
+ href="#"
2800
+ >Link</a>
2559
2801
  </li>
2560
- <li>
2561
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
2802
+ <li role="none">
2803
+ <button
2804
+ class="pf-v5-c-dropdown__menu-item"
2805
+ role="menuitem"
2806
+ type="button"
2807
+ >Action</button>
2562
2808
  </li>
2563
- <li>
2809
+ <li role="none">
2564
2810
  <a
2565
2811
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
2812
+ role="menuitem"
2566
2813
  href="#"
2567
2814
  aria-disabled="true"
2568
2815
  tabindex="-1"
2569
2816
  >Disabled link</a>
2570
2817
  </li>
2571
- <li>
2818
+ <li role="none">
2572
2819
  <button
2573
2820
  class="pf-v5-c-dropdown__menu-item"
2821
+ role="menuitem"
2574
2822
  type="button"
2575
2823
  disabled
2576
2824
  >Disabled action</button>
2577
2825
  </li>
2578
2826
  <li class="pf-v5-c-divider" role="separator"></li>
2579
- <li>
2580
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
2827
+ <li role="none">
2828
+ <a
2829
+ class="pf-v5-c-dropdown__menu-item"
2830
+ role="menuitem"
2831
+ href="#"
2832
+ >Separated link</a>
2581
2833
  </li>
2582
2834
  </ul>
2583
2835
  </div>
@@ -2704,7 +2956,10 @@ cssPrefix: pf-v5-c-dual-list-selector
2704
2956
  type="button"
2705
2957
  aria-label="Sort"
2706
2958
  >
2707
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
2959
+ <i
2960
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
2961
+ aria-hidden="true"
2962
+ ></i>
2708
2963
  </button>
2709
2964
  <div class="pf-v5-c-dropdown">
2710
2965
  <button
@@ -2720,31 +2975,46 @@ cssPrefix: pf-v5-c-dual-list-selector
2720
2975
  class="pf-v5-c-dropdown__menu"
2721
2976
  aria-labelledby="dropdown-kebab-draggable-available-button"
2722
2977
  hidden
2978
+ role="menu"
2723
2979
  >
2724
- <li>
2725
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
2980
+ <li role="none">
2981
+ <a
2982
+ class="pf-v5-c-dropdown__menu-item"
2983
+ role="menuitem"
2984
+ href="#"
2985
+ >Link</a>
2726
2986
  </li>
2727
- <li>
2728
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
2987
+ <li role="none">
2988
+ <button
2989
+ class="pf-v5-c-dropdown__menu-item"
2990
+ role="menuitem"
2991
+ type="button"
2992
+ >Action</button>
2729
2993
  </li>
2730
- <li>
2994
+ <li role="none">
2731
2995
  <a
2732
2996
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
2997
+ role="menuitem"
2733
2998
  href="#"
2734
2999
  aria-disabled="true"
2735
3000
  tabindex="-1"
2736
3001
  >Disabled link</a>
2737
3002
  </li>
2738
- <li>
3003
+ <li role="none">
2739
3004
  <button
2740
3005
  class="pf-v5-c-dropdown__menu-item"
3006
+ role="menuitem"
2741
3007
  type="button"
2742
3008
  disabled
2743
3009
  >Disabled action</button>
2744
3010
  </li>
2745
3011
  <li class="pf-v5-c-divider" role="separator"></li>
2746
- <li>
2747
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
3012
+ <li role="none">
3013
+ <a
3014
+ class="pf-v5-c-dropdown__menu-item"
3015
+ role="menuitem"
3016
+ href="#"
3017
+ >Separated link</a>
2748
3018
  </li>
2749
3019
  </ul>
2750
3020
  </div>
@@ -2874,7 +3144,10 @@ cssPrefix: pf-v5-c-dual-list-selector
2874
3144
  type="button"
2875
3145
  aria-label="Sort"
2876
3146
  >
2877
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
3147
+ <i
3148
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
3149
+ aria-hidden="true"
3150
+ ></i>
2878
3151
  </button>
2879
3152
  <div class="pf-v5-c-dropdown">
2880
3153
  <button
@@ -2890,31 +3163,46 @@ cssPrefix: pf-v5-c-dual-list-selector
2890
3163
  class="pf-v5-c-dropdown__menu"
2891
3164
  aria-labelledby="dropdown-kebab-draggable-chosen-button"
2892
3165
  hidden
3166
+ role="menu"
2893
3167
  >
2894
- <li>
2895
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
3168
+ <li role="none">
3169
+ <a
3170
+ class="pf-v5-c-dropdown__menu-item"
3171
+ role="menuitem"
3172
+ href="#"
3173
+ >Link</a>
2896
3174
  </li>
2897
- <li>
2898
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
3175
+ <li role="none">
3176
+ <button
3177
+ class="pf-v5-c-dropdown__menu-item"
3178
+ role="menuitem"
3179
+ type="button"
3180
+ >Action</button>
2899
3181
  </li>
2900
- <li>
3182
+ <li role="none">
2901
3183
  <a
2902
3184
  class="pf-v5-c-dropdown__menu-item pf-m-disabled"
3185
+ role="menuitem"
2903
3186
  href="#"
2904
3187
  aria-disabled="true"
2905
3188
  tabindex="-1"
2906
3189
  >Disabled link</a>
2907
3190
  </li>
2908
- <li>
3191
+ <li role="none">
2909
3192
  <button
2910
3193
  class="pf-v5-c-dropdown__menu-item"
3194
+ role="menuitem"
2911
3195
  type="button"
2912
3196
  disabled
2913
3197
  >Disabled action</button>
2914
3198
  </li>
2915
3199
  <li class="pf-v5-c-divider" role="separator"></li>
2916
- <li>
2917
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
3200
+ <li role="none">
3201
+ <a
3202
+ class="pf-v5-c-dropdown__menu-item"
3203
+ role="menuitem"
3204
+ href="#"
3205
+ >Separated link</a>
2918
3206
  </li>
2919
3207
  </ul>
2920
3208
  </div>