@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
@@ -199,63 +199,70 @@ section: components
199
199
  <div class="pf-v5-c-page__main-body">
200
200
  <div
201
201
  class="pf-v5-c-tabs pf-m-page-insets"
202
+ role="region"
202
203
  id="tabs-tables-and-tabs-example-tabs"
203
204
  >
204
- <ul class="pf-v5-c-tabs__list">
205
- <li class="pf-v5-c-tabs__item pf-m-current">
205
+ <ul class="pf-v5-c-tabs__list" role="tablist">
206
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
206
207
  <button
207
208
  type="button"
208
209
  class="pf-v5-c-tabs__link"
210
+ role="tab"
209
211
  aria-controls="tabs-tables-and-tabs-example-tabs-details-panel"
210
212
  id="tabs-tables-and-tabs-example-tabs-details-link"
211
213
  >
212
214
  <span class="pf-v5-c-tabs__item-text">Details</span>
213
215
  </button>
214
216
  </li>
215
- <li class="pf-v5-c-tabs__item">
217
+ <li class="pf-v5-c-tabs__item" role="presentation">
216
218
  <button
217
219
  type="button"
218
220
  class="pf-v5-c-tabs__link"
221
+ role="tab"
219
222
  aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
220
223
  id="tabs-tables-and-tabs-example-tabs-yaml-link"
221
224
  >
222
225
  <span class="pf-v5-c-tabs__item-text">YAML</span>
223
226
  </button>
224
227
  </li>
225
- <li class="pf-v5-c-tabs__item">
228
+ <li class="pf-v5-c-tabs__item" role="presentation">
226
229
  <button
227
230
  type="button"
228
231
  class="pf-v5-c-tabs__link"
232
+ role="tab"
229
233
  aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
230
234
  id="tabs-tables-and-tabs-example-tabs-environment-link"
231
235
  >
232
236
  <span class="pf-v5-c-tabs__item-text">Environment</span>
233
237
  </button>
234
238
  </li>
235
- <li class="pf-v5-c-tabs__item">
239
+ <li class="pf-v5-c-tabs__item" role="presentation">
236
240
  <button
237
241
  type="button"
238
242
  class="pf-v5-c-tabs__link"
243
+ role="tab"
239
244
  aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
240
245
  id="tabs-tables-and-tabs-example-tabs-logs-link"
241
246
  >
242
247
  <span class="pf-v5-c-tabs__item-text">Logs</span>
243
248
  </button>
244
249
  </li>
245
- <li class="pf-v5-c-tabs__item">
250
+ <li class="pf-v5-c-tabs__item" role="presentation">
246
251
  <button
247
252
  type="button"
248
253
  class="pf-v5-c-tabs__link"
254
+ role="tab"
249
255
  aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
250
256
  id="tabs-tables-and-tabs-example-tabs-events-link"
251
257
  >
252
258
  <span class="pf-v5-c-tabs__item-text">Events</span>
253
259
  </button>
254
260
  </li>
255
- <li class="pf-v5-c-tabs__item">
261
+ <li class="pf-v5-c-tabs__item" role="presentation">
256
262
  <button
257
263
  type="button"
258
264
  class="pf-v5-c-tabs__link"
265
+ role="tab"
259
266
  aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
260
267
  id="tabs-tables-and-tabs-example-tabs-terminal-link"
261
268
  >
@@ -683,63 +690,70 @@ section: components
683
690
  <div class="pf-v5-c-page__main-body">
684
691
  <div
685
692
  class="pf-v5-c-tabs pf-m-page-insets"
693
+ role="region"
686
694
  id="tabs-tables-and-tabs-example-tabs"
687
695
  >
688
- <ul class="pf-v5-c-tabs__list">
689
- <li class="pf-v5-c-tabs__item pf-m-current">
696
+ <ul class="pf-v5-c-tabs__list" role="tablist">
697
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
690
698
  <button
691
699
  type="button"
692
700
  class="pf-v5-c-tabs__link"
701
+ role="tab"
693
702
  aria-controls="tabs-tables-and-tabs-example-tabs-details-panel"
694
703
  id="tabs-tables-and-tabs-example-tabs-details-link"
695
704
  >
696
705
  <span class="pf-v5-c-tabs__item-text">Details</span>
697
706
  </button>
698
707
  </li>
699
- <li class="pf-v5-c-tabs__item">
708
+ <li class="pf-v5-c-tabs__item" role="presentation">
700
709
  <button
701
710
  type="button"
702
711
  class="pf-v5-c-tabs__link"
712
+ role="tab"
703
713
  aria-controls="tabs-tables-and-tabs-example-tabs-yaml-panel"
704
714
  id="tabs-tables-and-tabs-example-tabs-yaml-link"
705
715
  >
706
716
  <span class="pf-v5-c-tabs__item-text">YAML</span>
707
717
  </button>
708
718
  </li>
709
- <li class="pf-v5-c-tabs__item">
719
+ <li class="pf-v5-c-tabs__item" role="presentation">
710
720
  <button
711
721
  type="button"
712
722
  class="pf-v5-c-tabs__link"
723
+ role="tab"
713
724
  aria-controls="tabs-tables-and-tabs-example-tabs-environment-panel"
714
725
  id="tabs-tables-and-tabs-example-tabs-environment-link"
715
726
  >
716
727
  <span class="pf-v5-c-tabs__item-text">Environment</span>
717
728
  </button>
718
729
  </li>
719
- <li class="pf-v5-c-tabs__item">
730
+ <li class="pf-v5-c-tabs__item" role="presentation">
720
731
  <button
721
732
  type="button"
722
733
  class="pf-v5-c-tabs__link"
734
+ role="tab"
723
735
  aria-controls="tabs-tables-and-tabs-example-tabs-logs-panel"
724
736
  id="tabs-tables-and-tabs-example-tabs-logs-link"
725
737
  >
726
738
  <span class="pf-v5-c-tabs__item-text">Logs</span>
727
739
  </button>
728
740
  </li>
729
- <li class="pf-v5-c-tabs__item">
741
+ <li class="pf-v5-c-tabs__item" role="presentation">
730
742
  <button
731
743
  type="button"
732
744
  class="pf-v5-c-tabs__link"
745
+ role="tab"
733
746
  aria-controls="tabs-tables-and-tabs-example-tabs-events-panel"
734
747
  id="tabs-tables-and-tabs-example-tabs-events-link"
735
748
  >
736
749
  <span class="pf-v5-c-tabs__item-text">Events</span>
737
750
  </button>
738
751
  </li>
739
- <li class="pf-v5-c-tabs__item">
752
+ <li class="pf-v5-c-tabs__item" role="presentation">
740
753
  <button
741
754
  type="button"
742
755
  class="pf-v5-c-tabs__link"
756
+ role="tab"
743
757
  aria-controls="tabs-tables-and-tabs-example-tabs-terminal-panel"
744
758
  id="tabs-tables-and-tabs-example-tabs-terminal-link"
745
759
  >
@@ -756,23 +770,26 @@ section: components
756
770
  <div class="pf-v5-c-page__main-body">
757
771
  <div
758
772
  class="pf-v5-c-tabs pf-m-secondary pf-m-page-insets"
773
+ role="region"
759
774
  id="tabs-tables-and-tabs-example-tabs-secondary"
760
775
  >
761
- <ul class="pf-v5-c-tabs__list">
762
- <li class="pf-v5-c-tabs__item pf-m-current">
776
+ <ul class="pf-v5-c-tabs__list" role="tablist">
777
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
763
778
  <button
764
779
  type="button"
765
780
  class="pf-v5-c-tabs__link"
781
+ role="tab"
766
782
  aria-controls="tabs-tables-and-tabs-example-tabs-secondary-pod-info-panel"
767
783
  id="tabs-tables-and-tabs-example-tabs-secondary-pod-info-link"
768
784
  >
769
785
  <span class="pf-v5-c-tabs__item-text">Pod information</span>
770
786
  </button>
771
787
  </li>
772
- <li class="pf-v5-c-tabs__item">
788
+ <li class="pf-v5-c-tabs__item" role="presentation">
773
789
  <button
774
790
  type="button"
775
791
  class="pf-v5-c-tabs__link"
792
+ role="tab"
776
793
  aria-controls="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-panel"
777
794
  id="tabs-tables-and-tabs-example-tabs-secondary-editable-aspects-link"
778
795
  >
@@ -1170,23 +1187,26 @@ section: components
1170
1187
  <div class="pf-v5-c-page__main-body">
1171
1188
  <div
1172
1189
  class="pf-v5-c-tabs pf-m-page-insets"
1190
+ role="region"
1173
1191
  id="nested-tabs-example-tabs-tabs"
1174
1192
  >
1175
- <ul class="pf-v5-c-tabs__list">
1176
- <li class="pf-v5-c-tabs__item pf-m-current">
1193
+ <ul class="pf-v5-c-tabs__list" role="tablist">
1194
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
1177
1195
  <button
1178
1196
  type="button"
1179
1197
  class="pf-v5-c-tabs__link"
1198
+ role="tab"
1180
1199
  aria-controls="nested-tabs-example-tabs-tabs-cluster-1-panel"
1181
1200
  id="nested-tabs-example-tabs-tabs-cluster-1-link"
1182
1201
  >
1183
1202
  <span class="pf-v5-c-tabs__item-text">Cluster 1</span>
1184
1203
  </button>
1185
1204
  </li>
1186
- <li class="pf-v5-c-tabs__item">
1205
+ <li class="pf-v5-c-tabs__item" role="presentation">
1187
1206
  <button
1188
1207
  type="button"
1189
1208
  class="pf-v5-c-tabs__link"
1209
+ role="tab"
1190
1210
  aria-controls="nested-tabs-example-tabs-tabs-cluster-2-panel"
1191
1211
  id="nested-tabs-example-tabs-tabs-cluster-2-link"
1192
1212
  >
@@ -1218,23 +1238,29 @@ section: components
1218
1238
  <div class="pf-v5-l-flex__item">
1219
1239
  <div
1220
1240
  class="pf-v5-c-tabs pf-m-secondary"
1241
+ role="region"
1221
1242
  id="nested-tabs-example-tabs-tabs-subtabs"
1222
1243
  >
1223
- <ul class="pf-v5-c-tabs__list">
1224
- <li class="pf-v5-c-tabs__item pf-m-current">
1244
+ <ul class="pf-v5-c-tabs__list" role="tablist">
1245
+ <li
1246
+ class="pf-v5-c-tabs__item pf-m-current"
1247
+ role="presentation"
1248
+ >
1225
1249
  <button
1226
1250
  type="button"
1227
1251
  class="pf-v5-c-tabs__link"
1252
+ role="tab"
1228
1253
  aria-controls="nested-tabs-example-tabs-tabs-subtabs-cluster-panel"
1229
1254
  id="nested-tabs-example-tabs-tabs-subtabs-cluster-link"
1230
1255
  >
1231
1256
  <span class="pf-v5-c-tabs__item-text">Cluster</span>
1232
1257
  </button>
1233
1258
  </li>
1234
- <li class="pf-v5-c-tabs__item">
1259
+ <li class="pf-v5-c-tabs__item" role="presentation">
1235
1260
  <button
1236
1261
  type="button"
1237
1262
  class="pf-v5-c-tabs__link"
1263
+ role="tab"
1238
1264
  aria-controls="nested-tabs-example-tabs-tabs-subtabs-control-plane-panel"
1239
1265
  id="nested-tabs-example-tabs-tabs-subtabs-control-plane-link"
1240
1266
  >
@@ -1243,20 +1269,22 @@ section: components
1243
1269
  >Control plane</span>
1244
1270
  </button>
1245
1271
  </li>
1246
- <li class="pf-v5-c-tabs__item">
1272
+ <li class="pf-v5-c-tabs__item" role="presentation">
1247
1273
  <button
1248
1274
  type="button"
1249
1275
  class="pf-v5-c-tabs__link"
1276
+ role="tab"
1250
1277
  aria-controls="nested-tabs-example-tabs-tabs-subtabs-operators-panel"
1251
1278
  id="nested-tabs-example-tabs-tabs-subtabs-operators-link"
1252
1279
  >
1253
1280
  <span class="pf-v5-c-tabs__item-text">Operators</span>
1254
1281
  </button>
1255
1282
  </li>
1256
- <li class="pf-v5-c-tabs__item">
1283
+ <li class="pf-v5-c-tabs__item" role="presentation">
1257
1284
  <button
1258
1285
  type="button"
1259
1286
  class="pf-v5-c-tabs__link"
1287
+ role="tab"
1260
1288
  aria-controls="nested-tabs-example-tabs-tabs-subtabs-virtualization-panel"
1261
1289
  id="nested-tabs-example-tabs-tabs-subtabs-virtualization-link"
1262
1290
  >
@@ -1583,7 +1611,7 @@ section: components
1583
1611
  <span
1584
1612
  id="table-tabs-example-tabs-toolbar-select-checkbox-status-label"
1585
1613
  hidden
1586
- >Choose one</span>
1614
+ >Choose many</span>
1587
1615
 
1588
1616
  <button
1589
1617
  class="pf-v5-c-select__toggle"
@@ -1689,7 +1717,10 @@ section: components
1689
1717
  type="button"
1690
1718
  aria-label="Sort"
1691
1719
  >
1692
- <i class="fas fa-sort-amount-down" aria-hidden="true"></i>
1720
+ <i
1721
+ class="fas fa-sort-amount-down pf-v5-m-mirror-inline-rtl"
1722
+ aria-hidden="true"
1723
+ ></i>
1693
1724
  </button>
1694
1725
  </div>
1695
1726
 
@@ -1729,11 +1760,15 @@ section: components
1729
1760
  </button>
1730
1761
  <ul
1731
1762
  class="pf-v5-c-dropdown__menu"
1763
+ role="menu"
1732
1764
  aria-labelledby="table-tabs-example-tabs-toolbar-overflow-menu-dropdown-toggle"
1733
1765
  hidden
1734
1766
  >
1735
- <li>
1736
- <button class="pf-v5-c-dropdown__menu-item">Action 7</button>
1767
+ <li role="none">
1768
+ <button
1769
+ role="menuitem"
1770
+ class="pf-v5-c-dropdown__menu-item"
1771
+ >Action 7</button>
1737
1772
  </li>
1738
1773
  </ul>
1739
1774
  </div>
@@ -1891,11 +1926,13 @@ section: components
1891
1926
  </button>
1892
1927
  <ul
1893
1928
  class="pf-v5-c-dropdown__menu pf-m-align-right"
1929
+ role="menu"
1894
1930
  aria-labelledby="table-tabs-example-table-dropdown-kebab-1-dropdown-toggle"
1895
1931
  hidden
1896
1932
  >
1897
- <li>
1933
+ <li role="none">
1898
1934
  <button
1935
+ role="menuitem"
1899
1936
  class="pf-v5-c-dropdown__menu-item"
1900
1937
  >Action Link</button>
1901
1938
  </li>
@@ -1992,11 +2029,13 @@ section: components
1992
2029
  </button>
1993
2030
  <ul
1994
2031
  class="pf-v5-c-dropdown__menu pf-m-align-right"
2032
+ role="menu"
1995
2033
  aria-labelledby="table-tabs-example-table-dropdown-kebab-2-dropdown-toggle"
1996
2034
  hidden
1997
2035
  >
1998
- <li>
2036
+ <li role="none">
1999
2037
  <button
2038
+ role="menuitem"
2000
2039
  class="pf-v5-c-dropdown__menu-item"
2001
2040
  >Action Link</button>
2002
2041
  </li>
@@ -2093,11 +2132,13 @@ section: components
2093
2132
  </button>
2094
2133
  <ul
2095
2134
  class="pf-v5-c-dropdown__menu pf-m-align-right"
2135
+ role="menu"
2096
2136
  aria-labelledby="table-tabs-example-table-dropdown-kebab-3-dropdown-toggle"
2097
2137
  hidden
2098
2138
  >
2099
- <li>
2139
+ <li role="none">
2100
2140
  <button
2141
+ role="menuitem"
2101
2142
  class="pf-v5-c-dropdown__menu-item"
2102
2143
  >Action Link</button>
2103
2144
  </li>
@@ -2194,11 +2235,13 @@ section: components
2194
2235
  </button>
2195
2236
  <ul
2196
2237
  class="pf-v5-c-dropdown__menu pf-m-align-right"
2238
+ role="menu"
2197
2239
  aria-labelledby="table-tabs-example-table-dropdown-kebab-4-dropdown-toggle"
2198
2240
  hidden
2199
2241
  >
2200
- <li>
2242
+ <li role="none">
2201
2243
  <button
2244
+ role="menuitem"
2202
2245
  class="pf-v5-c-dropdown__menu-item"
2203
2246
  >Action Link</button>
2204
2247
  </li>
@@ -2295,11 +2338,13 @@ section: components
2295
2338
  </button>
2296
2339
  <ul
2297
2340
  class="pf-v5-c-dropdown__menu pf-m-align-right"
2341
+ role="menu"
2298
2342
  aria-labelledby="table-tabs-example-table-dropdown-kebab-5-dropdown-toggle"
2299
2343
  hidden
2300
2344
  >
2301
- <li>
2345
+ <li role="none">
2302
2346
  <button
2347
+ role="menuitem"
2303
2348
  class="pf-v5-c-dropdown__menu-item"
2304
2349
  >Action Link</button>
2305
2350
  </li>
@@ -2340,7 +2385,11 @@ section: components
2340
2385
  </div>
2341
2386
  </div>
2342
2387
  <div class="pf-v5-c-drawer__body pf-m-no-padding">
2343
- <div class="pf-v5-c-tabs pf-m-box pf-m-fill" id="-tabs">
2388
+ <div
2389
+ class="pf-v5-c-tabs pf-m-box pf-m-fill"
2390
+ role="region"
2391
+ id="-tabs"
2392
+ >
2344
2393
  <button
2345
2394
  class="pf-v5-c-tabs__scroll-button"
2346
2395
  type="button"
@@ -2348,21 +2397,26 @@ section: components
2348
2397
  >
2349
2398
  <i class="fas fa-angle-left" aria-hidden="true"></i>
2350
2399
  </button>
2351
- <ul class="pf-v5-c-tabs__list">
2352
- <li class="pf-v5-c-tabs__item pf-m-current">
2400
+ <ul class="pf-v5-c-tabs__list" role="tablist">
2401
+ <li
2402
+ class="pf-v5-c-tabs__item pf-m-current"
2403
+ role="presentation"
2404
+ >
2353
2405
  <button
2354
2406
  type="button"
2355
2407
  class="pf-v5-c-tabs__link"
2408
+ role="tab"
2356
2409
  aria-controls="-tabs-tab1-panel"
2357
2410
  id="-tabs-tab1-link"
2358
2411
  >
2359
2412
  <span class="pf-v5-c-tabs__item-text">Overview</span>
2360
2413
  </button>
2361
2414
  </li>
2362
- <li class="pf-v5-c-tabs__item">
2415
+ <li class="pf-v5-c-tabs__item" role="presentation">
2363
2416
  <button
2364
2417
  type="button"
2365
2418
  class="pf-v5-c-tabs__link"
2419
+ role="tab"
2366
2420
  aria-controls="-tabs-tab2-panel"
2367
2421
  id="-tabs-tab2-link"
2368
2422
  >
@@ -2560,23 +2614,26 @@ section: components
2560
2614
  <div class="pf-v5-l-grid__item">
2561
2615
  <div
2562
2616
  class="pf-v5-c-tabs pf-m-secondary pf-m-inset-none"
2617
+ role="region"
2563
2618
  id="modal-tabs-example-tabs"
2564
2619
  >
2565
- <ul class="pf-v5-c-tabs__list">
2566
- <li class="pf-v5-c-tabs__item pf-m-current">
2620
+ <ul class="pf-v5-c-tabs__list" role="tablist">
2621
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
2567
2622
  <button
2568
2623
  type="button"
2569
2624
  class="pf-v5-c-tabs__link"
2625
+ role="tab"
2570
2626
  aria-controls="modal-tabs-example-tabs-details-panel"
2571
2627
  id="modal-tabs-example-tabs-details-link"
2572
2628
  >
2573
2629
  <span class="pf-v5-c-tabs__item-text">Details</span>
2574
2630
  </button>
2575
2631
  </li>
2576
- <li class="pf-v5-c-tabs__item">
2632
+ <li class="pf-v5-c-tabs__item" role="presentation">
2577
2633
  <button
2578
2634
  type="button"
2579
2635
  class="pf-v5-c-tabs__link"
2636
+ role="tab"
2580
2637
  aria-controls="modal-tabs-example-tabs-documentation-panel"
2581
2638
  id="modal-tabs-example-tabs-documentation-link"
2582
2639
  >
@@ -3052,43 +3109,48 @@ section: components
3052
3109
  <div class="pf-v5-c-page__main-body">
3053
3110
  <div
3054
3111
  class="pf-v5-c-tabs pf-m-page-insets"
3112
+ role="region"
3055
3113
  id="gray-tabs-example-tabs-tabs"
3056
3114
  >
3057
- <ul class="pf-v5-c-tabs__list">
3058
- <li class="pf-v5-c-tabs__item">
3115
+ <ul class="pf-v5-c-tabs__list" role="tablist">
3116
+ <li class="pf-v5-c-tabs__item" role="presentation">
3059
3117
  <button
3060
3118
  type="button"
3061
3119
  class="pf-v5-c-tabs__link"
3120
+ role="tab"
3062
3121
  aria-controls="gray-tabs-example-tabs-tabs-new-panel"
3063
3122
  id="gray-tabs-example-tabs-tabs-new-link"
3064
3123
  >
3065
3124
  <span class="pf-v5-c-tabs__item-text">What's new</span>
3066
3125
  </button>
3067
3126
  </li>
3068
- <li class="pf-v5-c-tabs__item pf-m-current">
3127
+ <li class="pf-v5-c-tabs__item pf-m-current" role="presentation">
3069
3128
  <button
3070
3129
  type="button"
3071
3130
  class="pf-v5-c-tabs__link"
3131
+ role="tab"
3072
3132
  aria-controls="gray-tabs-example-tabs-tabs-get-started-panel"
3073
3133
  id="gray-tabs-example-tabs-tabs-get-started-link"
3074
3134
  >
3075
3135
  <span class="pf-v5-c-tabs__item-text">Get started</span>
3076
3136
  </button>
3077
3137
  </li>
3078
- <li class="pf-v5-c-tabs__item">
3138
+ <li class="pf-v5-c-tabs__item" role="presentation">
3079
3139
  <button
3080
3140
  type="button"
3081
3141
  class="pf-v5-c-tabs__link"
3142
+ role="tab"
3082
3143
  aria-controls="gray-tabs-example-tabs-tabs-knowledge-panel"
3083
3144
  id="gray-tabs-example-tabs-tabs-knowledge-link"
3084
3145
  >
3085
3146
  <span class="pf-v5-c-tabs__item-text">Knowledge</span>
3086
3147
  </button>
3087
3148
  </li>
3088
- <li class="pf-v5-c-tabs__item">
3149
+ <li class="pf-v5-c-tabs__item" role="presentation">
3089
3150
  <button
3090
3151
  type="button"
3091
3152
  class="pf-v5-c-tabs__link"
3153
+ role="tab"
3092
3154
  aria-controls="gray-tabs-example-tabs-tabs-support-panel"
3093
3155
  id="gray-tabs-example-tabs-tabs-support-link"
3094
3156
  >
@@ -3128,23 +3190,29 @@ section: components
3128
3190
  <div class="pf-v5-l-grid__item">
3129
3191
  <div
3130
3192
  class="pf-v5-c-tabs pf-m-secondary pf-m-inset-none"
3193
+ role="region"
3131
3194
  id="gray-tabs-example-tabs-subtabs"
3132
3195
  >
3133
- <ul class="pf-v5-c-tabs__list">
3134
- <li class="pf-v5-c-tabs__item pf-m-current">
3196
+ <ul class="pf-v5-c-tabs__list" role="tablist">
3197
+ <li
3198
+ class="pf-v5-c-tabs__item pf-m-current"
3199
+ role="presentation"
3200
+ >
3135
3201
  <button
3136
3202
  type="button"
3137
3203
  class="pf-v5-c-tabs__link"
3204
+ role="tab"
3138
3205
  aria-controls="gray-tabs-example-tabs-subtabs-x86-panel"
3139
3206
  id="gray-tabs-example-tabs-subtabs-x86-link"
3140
3207
  >
3141
3208
  <span class="pf-v5-c-tabs__item-text">x86 architecture</span>
3142
3209
  </button>
3143
3210
  </li>
3144
- <li class="pf-v5-c-tabs__item">
3211
+ <li class="pf-v5-c-tabs__item" role="presentation">
3145
3212
  <button
3146
3213
  type="button"
3147
3214
  class="pf-v5-c-tabs__link"
3215
+ role="tab"
3148
3216
  aria-controls="gray-tabs-example-tabs-subtabs-additional-architectures-panel"
3149
3217
  id="gray-tabs-example-tabs-subtabs-additional-architectures-link"
3150
3218
  >