@patternfly/patternfly 6.0.0-alpha.5 → 6.0.0-alpha.51

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 (362) hide show
  1. package/CODE_OF_CONDUCT.md +1 -2
  2. package/README.md +13 -3
  3. package/assets/icons/iconUnicodes.json +1 -0
  4. package/assets/images/PF-Backdrop.svg +1 -0
  5. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  6. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  7. package/assets/images/PF-IconLogo-Reverse.svg +14 -0
  8. package/assets/images/PF-IconLogo-color.svg +17 -0
  9. package/assets/images/PF-IconLogo.svg +17 -0
  10. package/assets/images/logo__pf--reverse-on-md.svg +1 -1
  11. package/assets/images/pf-background.svg +22 -0
  12. package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
  13. package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
  14. package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
  15. package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
  16. package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
  17. package/assets/images/pf_logo_white.hbs +35 -0
  18. package/assets/images/pf_logo_white.svg +38 -0
  19. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  20. package/assets/pficon/pficon.scss +6 -129
  21. package/base/_common.scss +29 -4
  22. package/base/_globals.scss +5 -7
  23. package/base/_variables.scss +8 -6
  24. package/base/patternfly-common.css +24 -6
  25. package/base/patternfly-globals.css +5 -4
  26. package/base/patternfly-icons.css +5 -1
  27. package/base/patternfly-pf-icons.css +5 -1
  28. package/base/patternfly-variables.css +889 -787
  29. package/base/tokens/_tokens-dark.scss +322 -265
  30. package/base/tokens/_tokens-default.scss +428 -306
  31. package/base/tokens/_tokens-font.scss +41 -46
  32. package/base/tokens/_tokens-palette.scss +69 -71
  33. package/base/tokens/_workspace-overrides.scss +7 -0
  34. package/components/AboutModalBox/about-modal-box.css +78 -104
  35. package/components/AboutModalBox/about-modal-box.scss +62 -74
  36. package/components/Accordion/accordion.css +96 -175
  37. package/components/Accordion/accordion.scss +106 -193
  38. package/components/ActionList/action-list.css +2 -2
  39. package/components/ActionList/action-list.scss +2 -2
  40. package/components/Alert/alert-group.css +27 -20
  41. package/components/Alert/alert-group.scss +27 -20
  42. package/components/Alert/alert.css +74 -95
  43. package/components/Alert/alert.scss +76 -89
  44. package/components/AppLauncher/app-launcher.css +32 -23
  45. package/components/AppLauncher/app-launcher.scss +32 -23
  46. package/components/Avatar/avatar.css +10 -13
  47. package/components/Avatar/avatar.scss +10 -17
  48. package/components/BackToTop/back-to-top.css +17 -15
  49. package/components/BackToTop/back-to-top.scss +14 -13
  50. package/components/Backdrop/backdrop.css +8 -4
  51. package/components/Backdrop/backdrop.scss +7 -4
  52. package/components/BackgroundImage/background-image.css +11 -4
  53. package/components/BackgroundImage/background-image.scss +13 -4
  54. package/components/Badge/badge.css +25 -17
  55. package/components/Badge/badge.scss +27 -19
  56. package/components/Banner/banner.css +95 -69
  57. package/components/Banner/banner.scss +100 -34
  58. package/components/Breadcrumb/breadcrumb.css +28 -19
  59. package/components/Breadcrumb/breadcrumb.scss +26 -19
  60. package/components/Button/button.css +401 -358
  61. package/components/Button/button.scss +459 -486
  62. package/components/CalendarMonth/calendar-month.css +25 -15
  63. package/components/CalendarMonth/calendar-month.scss +23 -15
  64. package/components/Card/card.css +28 -17
  65. package/components/Card/card.scss +32 -17
  66. package/components/Check/check.css +25 -22
  67. package/components/Check/check.scss +26 -24
  68. package/components/Chip/chip-group.css +6 -6
  69. package/components/Chip/chip-group.scss +6 -6
  70. package/components/Chip/chip.css +16 -9
  71. package/components/Chip/chip.scss +17 -9
  72. package/components/ClipboardCopy/clipboard-copy.css +19 -10
  73. package/components/ClipboardCopy/clipboard-copy.scss +16 -8
  74. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +2 -2
  75. package/components/CodeBlock/code-block.css +6 -3
  76. package/components/CodeBlock/code-block.scss +6 -3
  77. package/components/CodeEditor/code-editor.css +31 -22
  78. package/components/CodeEditor/code-editor.scss +30 -21
  79. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  80. package/components/Content/content.css +40 -37
  81. package/components/Content/content.scss +40 -37
  82. package/components/ContextSelector/context-selector.css +41 -26
  83. package/components/ContextSelector/context-selector.scss +40 -25
  84. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  85. package/components/DataList/data-list-grid.css +21 -21
  86. package/components/DataList/data-list-grid.scss +3 -3
  87. package/components/DataList/data-list.css +165 -209
  88. package/components/DataList/data-list.scss +138 -185
  89. package/components/DatePicker/date-picker.css +8 -8
  90. package/components/DatePicker/date-picker.scss +8 -8
  91. package/components/DescriptionList/description-list.css +8 -5
  92. package/components/DescriptionList/description-list.scss +8 -5
  93. package/components/Divider/divider.css +97 -177
  94. package/components/Divider/divider.scss +60 -79
  95. package/components/DragDrop/drag-drop.css +8 -8
  96. package/components/DragDrop/drag-drop.scss +8 -8
  97. package/components/Drawer/drawer.css +120 -62
  98. package/components/Drawer/drawer.scss +94 -44
  99. package/components/Dropdown/dropdown.css +76 -69
  100. package/components/Dropdown/dropdown.scss +67 -62
  101. package/components/DualListSelector/dual-list-selector.css +29 -15
  102. package/components/DualListSelector/dual-list-selector.scss +30 -15
  103. package/components/EmptyState/empty-state.css +64 -38
  104. package/components/EmptyState/empty-state.scss +70 -38
  105. package/components/ExpandableSection/expandable-section.css +75 -66
  106. package/components/ExpandableSection/expandable-section.scss +82 -80
  107. package/components/FileUpload/file-upload.css +9 -15
  108. package/components/FileUpload/file-upload.scss +9 -15
  109. package/components/Form/form.css +111 -154
  110. package/components/Form/form.scss +101 -160
  111. package/components/FormControl/form-control.css +95 -111
  112. package/components/FormControl/form-control.scss +97 -92
  113. package/components/HelperText/helper-text.css +29 -35
  114. package/components/HelperText/helper-text.scss +31 -41
  115. package/components/Hint/hint.css +37 -27
  116. package/components/Hint/hint.scss +37 -30
  117. package/components/Icon/icon.css +1 -1
  118. package/components/Icon/icon.scss +1 -1
  119. package/components/InlineEdit/inline-edit.css +9 -9
  120. package/components/InlineEdit/inline-edit.scss +9 -9
  121. package/components/InputGroup/input-group.css +12 -6
  122. package/components/InputGroup/input-group.scss +11 -5
  123. package/components/InputGroup/themes/dark/input-group.scss +1 -1
  124. package/components/JumpLinks/jump-links.css +27 -24
  125. package/components/JumpLinks/jump-links.scss +26 -24
  126. package/components/Label/label-group.css +13 -10
  127. package/components/Label/label-group.scss +13 -10
  128. package/components/Label/label.css +9 -9
  129. package/components/Label/label.scss +9 -9
  130. package/components/List/list.css +25 -25
  131. package/components/List/list.scss +26 -26
  132. package/components/LogViewer/log-viewer.css +14 -14
  133. package/components/LogViewer/log-viewer.scss +14 -14
  134. package/components/Login/login.css +104 -122
  135. package/components/Login/login.scss +92 -91
  136. package/components/Masthead/masthead.css +273 -498
  137. package/components/Masthead/masthead.scss +137 -282
  138. package/components/Menu/menu.css +82 -65
  139. package/components/Menu/menu.scss +85 -69
  140. package/components/MenuToggle/menu-toggle.css +37 -31
  141. package/components/MenuToggle/menu-toggle.scss +37 -33
  142. package/components/ModalBox/modal-box.css +76 -69
  143. package/components/ModalBox/modal-box.scss +74 -70
  144. package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
  145. package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
  146. package/components/Nav/nav.css +249 -898
  147. package/components/Nav/nav.scss +316 -1071
  148. package/components/Nav/themes/dark/nav.scss +2 -2
  149. package/components/NotificationBadge/notification-badge.css +66 -85
  150. package/components/NotificationBadge/notification-badge.scss +72 -103
  151. package/components/NotificationDrawer/notification-drawer.css +130 -128
  152. package/components/NotificationDrawer/notification-drawer.scss +130 -129
  153. package/components/NumberInput/number-input.css +2 -2
  154. package/components/NumberInput/number-input.scss +2 -2
  155. package/components/OptionsMenu/options-menu.css +43 -31
  156. package/components/OptionsMenu/options-menu.scss +43 -31
  157. package/components/OverflowMenu/overflow-menu.css +2 -2
  158. package/components/OverflowMenu/overflow-menu.scss +2 -2
  159. package/components/Page/page.css +232 -271
  160. package/components/Page/page.scss +180 -231
  161. package/components/Pagination/pagination.css +71 -121
  162. package/components/Pagination/pagination.scss +56 -127
  163. package/components/Panel/panel.css +40 -30
  164. package/components/Panel/panel.scss +42 -33
  165. package/components/Popover/popover.css +108 -87
  166. package/components/Popover/popover.scss +120 -109
  167. package/components/Progress/progress.css +40 -52
  168. package/components/Progress/progress.scss +48 -62
  169. package/components/ProgressStepper/progress-stepper.css +26 -20
  170. package/components/ProgressStepper/progress-stepper.scss +25 -19
  171. package/components/Radio/radio.css +30 -23
  172. package/components/Radio/radio.scss +31 -25
  173. package/components/Select/select.css +56 -47
  174. package/components/Select/select.scss +56 -47
  175. package/components/Sidebar/sidebar.css +11 -5
  176. package/components/Sidebar/sidebar.scss +11 -5
  177. package/components/SimpleList/simple-list.css +45 -56
  178. package/components/SimpleList/simple-list.scss +51 -55
  179. package/components/Skeleton/skeleton.css +24 -25
  180. package/components/Skeleton/skeleton.scss +21 -26
  181. package/components/SkipToContent/skip-to-content.css +9 -6
  182. package/components/SkipToContent/skip-to-content.scss +8 -6
  183. package/components/Slider/slider.css +80 -55
  184. package/components/Slider/slider.scss +96 -65
  185. package/components/Spinner/spinner.css +17 -34
  186. package/components/Spinner/spinner.scss +19 -47
  187. package/components/Switch/switch.css +49 -41
  188. package/components/Switch/switch.scss +51 -42
  189. package/components/TabContent/tab-content.css +21 -12
  190. package/components/TabContent/tab-content.scss +22 -15
  191. package/components/Table/table-grid.css +264 -203
  192. package/components/Table/table-grid.scss +61 -47
  193. package/components/Table/table-scrollable.css +4 -4
  194. package/components/Table/table-scrollable.scss +6 -4
  195. package/components/Table/table-tree-view.css +112 -105
  196. package/components/Table/table-tree-view.scss +38 -33
  197. package/components/Table/table.css +105 -89
  198. package/components/Table/table.scss +105 -89
  199. package/components/Tabs/tabs.css +76 -48
  200. package/components/Tabs/tabs.scss +74 -48
  201. package/components/TextInputGroup/text-input-group.css +15 -15
  202. package/components/TextInputGroup/text-input-group.scss +15 -15
  203. package/components/Tile/tile.css +10 -10
  204. package/components/Tile/tile.scss +10 -10
  205. package/components/Timestamp/timestamp.css +12 -9
  206. package/components/Timestamp/timestamp.scss +11 -10
  207. package/components/Title/title.css +70 -19
  208. package/components/Title/title.scss +90 -20
  209. package/components/ToggleGroup/toggle-group.css +14 -11
  210. package/components/ToggleGroup/toggle-group.scss +14 -11
  211. package/components/Toolbar/toolbar.css +57 -43
  212. package/components/Toolbar/toolbar.scss +45 -25
  213. package/components/Tooltip/tooltip.css +74 -44
  214. package/components/Tooltip/tooltip.scss +93 -77
  215. package/components/TreeView/tree-view.css +48 -27
  216. package/components/TreeView/tree-view.scss +50 -28
  217. package/components/Truncate/truncate.css +13 -0
  218. package/components/Truncate/truncate.scss +19 -3
  219. package/components/Wizard/wizard.css +57 -36
  220. package/components/Wizard/wizard.scss +57 -36
  221. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  222. package/docs/components/Accordion/examples/Accordion.md +614 -416
  223. package/docs/components/Alert/examples/Alert.md +3 -3
  224. package/docs/components/Avatar/examples/Avatar.md +5 -19
  225. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  226. package/docs/components/Badge/examples/Badge.md +21 -0
  227. package/docs/components/Banner/examples/Banner.md +48 -25
  228. package/docs/components/Brand/examples/Brand.css +12 -0
  229. package/docs/components/Brand/examples/Brand.md +51 -32
  230. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  231. package/docs/components/Button/examples/Button.css +6 -2
  232. package/docs/components/Button/examples/Button.md +1425 -87
  233. package/docs/components/Card/examples/Card.md +143 -37
  234. package/docs/components/Check/examples/Check.md +71 -58
  235. package/docs/components/Chip/examples/Chip.md +1 -1
  236. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  237. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  238. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  239. package/docs/components/Content/examples/Content.md +5 -5
  240. package/docs/components/Divider/examples/Divider.css +3 -1
  241. package/docs/components/Divider/examples/Divider.md +4 -5
  242. package/docs/components/DragDrop/examples/DragDrop.css +2 -2
  243. package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
  244. package/docs/components/DualListSelector/examples/DualListSelector.md +64 -16
  245. package/docs/components/EmptyState/examples/EmptyState.md +45 -1
  246. package/docs/components/ExpandableSection/examples/ExpandableSection.md +49 -28
  247. package/docs/components/Form/examples/Form.md +134 -89
  248. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  249. package/docs/components/Label/examples/Label.md +12 -12
  250. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  251. package/docs/components/LogViewer/examples/LogViewer.md +250 -160
  252. package/docs/components/Login/examples/Login.md +10 -5
  253. package/docs/components/Masthead/examples/masthead.md +443 -65
  254. package/docs/components/Menu/examples/Menu.css +8 -0
  255. package/docs/components/Menu/examples/Menu.md +594 -543
  256. package/docs/components/MenuToggle/examples/MenuToggle.md +109 -96
  257. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  258. package/docs/components/Nav/examples/Navigation.css +3 -47
  259. package/docs/components/Nav/examples/Navigation.md +305 -353
  260. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  261. package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
  262. package/docs/components/Page/examples/Page.css +0 -8
  263. package/docs/components/Page/examples/Page.md +22 -21
  264. package/docs/components/Pagination/examples/Pagination.md +663 -637
  265. package/docs/components/Panel/examples/Panel.md +12 -0
  266. package/docs/components/Popover/examples/Popover.css +4 -9
  267. package/docs/components/Popover/examples/Popover.md +1 -1
  268. package/docs/components/Radio/examples/Radio.md +62 -54
  269. package/docs/components/Select/deprecated/Select.md +184 -177
  270. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  271. package/docs/components/TabContent/examples/TabContent.md +10 -10
  272. package/docs/components/Table/examples/Table.css +2 -2
  273. package/docs/components/Table/examples/Table.md +10 -10
  274. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  275. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  276. package/docs/components/Tile/examples/Tile.css +1 -1
  277. package/docs/components/Title/examples/Title.md +18 -0
  278. package/docs/components/Toolbar/examples/Toolbar.md +663 -2894
  279. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  280. package/docs/components/Tooltip/examples/Tooltip.md +3 -1
  281. package/docs/components/Truncate/examples/Truncate.css +2 -2
  282. package/docs/components/Truncate/examples/Truncate.md +2 -2
  283. package/docs/demos/AboutModal/examples/AboutModal.md +103 -30
  284. package/docs/demos/Alert/examples/Alert.md +327 -84
  285. package/docs/demos/BackToTop/examples/BackToTop.md +101 -28
  286. package/docs/demos/Banner/examples/Banner.md +209 -58
  287. package/docs/demos/Card/examples/Card.css +3 -3
  288. package/docs/demos/Card/examples/Card.md +28 -12
  289. package/docs/demos/CardView/examples/CardView.md +263 -205
  290. package/docs/demos/ContextSelector/examples/ContextSelector.md +373 -90
  291. package/docs/demos/Dashboard/examples/Dashboard.md +104 -31
  292. package/docs/demos/DataList/examples/DataList.md +995 -928
  293. package/docs/demos/DescriptionList/examples/DescriptionList.md +303 -84
  294. package/docs/demos/Drawer/examples/Drawer.md +505 -140
  295. package/docs/demos/Form/examples/BasicForms.md +131 -80
  296. package/docs/demos/JumpLinks/examples/JumpLinks.md +606 -168
  297. package/docs/demos/Masthead/examples/Masthead.md +767 -323
  298. package/docs/demos/Modal/examples/Modal.md +639 -192
  299. package/docs/demos/Nav/examples/Nav.md +685 -896
  300. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +510 -140
  301. package/docs/demos/Page/examples/Page.md +933 -264
  302. package/docs/demos/Page/examples/Penta.md +569 -501
  303. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  304. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  305. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1296 -917
  306. package/docs/demos/Skeleton/examples/Skeleton.md +108 -63
  307. package/docs/demos/Table/examples/Table.md +3832 -3390
  308. package/docs/demos/Tabs/examples/Tabs.md +636 -191
  309. package/docs/demos/Toolbar/examples/Toolbar.css +15 -0
  310. package/docs/demos/Toolbar/examples/Toolbar.md +1331 -1493
  311. package/docs/demos/Wizard/examples/Wizard.md +909 -252
  312. package/docs/layouts/Flex/examples/Flex.md +16 -16
  313. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  314. package/icons/pficons.mjs +1 -0
  315. package/layouts/Flex/flex.css +115 -43
  316. package/layouts/Flex/flex.scss +20 -8
  317. package/package.json +36 -32
  318. package/patternfly-addons.css +732 -972
  319. package/patternfly-base-no-globals-theme-dark-unversioned.css +923 -799
  320. package/patternfly-base-no-globals.css +923 -799
  321. package/patternfly-base-theme-dark-unversioned.css +928 -803
  322. package/patternfly-base.css +928 -803
  323. package/patternfly-no-globals.css +6119 -6639
  324. package/patternfly-theme-dark-unversioned.css +6128 -6647
  325. package/patternfly.css +6128 -6647
  326. package/patternfly.min.css +1 -1
  327. package/patternfly.min.css.map +1 -1
  328. package/sass-utilities/functions.scss +6 -0
  329. package/sass-utilities/mixins.scss +62 -2
  330. package/sass-utilities/scss-variables.scss +8 -8
  331. package/sass-utilities/themes/dark/mixins.scss +3 -1
  332. package/utilities/Accessibility/accessibility.css +12 -12
  333. package/utilities/Spacing/spacing.css +720 -960
  334. package/utilities/Spacing/spacing.scss +4 -8
  335. package/base/themes/dark/_variables.scss +0 -102
  336. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  337. package/components/Accordion/themes/dark/accordion.scss +0 -9
  338. package/components/Alert/themes/dark/alert.scss +0 -17
  339. package/components/Badge/themes/dark/badge.scss +0 -9
  340. package/components/Banner/themes/dark/banner.scss +0 -14
  341. package/components/Button/themes/dark/button.scss +0 -51
  342. package/components/DataList/themes/dark/data-list.scss +0 -10
  343. package/components/Form/themes/dark/form.scss +0 -7
  344. package/components/FormControl/themes/dark/form-control.scss +0 -24
  345. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  346. package/components/Hint/themes/dark/hint.scss +0 -8
  347. package/components/Login/themes/dark/login.scss +0 -12
  348. package/components/Masthead/themes/dark/masthead.scss +0 -14
  349. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  350. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  351. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  352. package/components/Page/themes/dark/page.scss +0 -69
  353. package/components/Pagination/themes/dark/pagination.scss +0 -7
  354. package/components/Panel/themes/dark/panel.scss +0 -7
  355. package/components/Popover/themes/dark/popover.scss +0 -11
  356. package/components/Progress/themes/dark/progress.scss +0 -9
  357. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  358. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  359. package/components/Switch/themes/dark/switch.scss +0 -11
  360. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  361. package/docs/components/Avatar/examples/Avatar.css +0 -3
  362. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/components/SimpleList/examples/SimpleList.md CHANGED
@@ -33,21 +33,21 @@ cssPrefix: pf-v5-c-simple-list
33
33
  <ul class="pf-v5-c-simple-list__list" role="list">
34
34
  <li class="pf-v5-c-simple-list__item">
35
35
  <a
36
- class="pf-v5-c-simple-list__item-link pf-m-current"
36
+ class="pf-v5-c-simple-list__item-link pf-m-link pf-m-current"
37
37
  href="#"
38
38
  tabindex="0"
39
39
  >List item 1</a>
40
40
  </li>
41
41
  <li class="pf-v5-c-simple-list__item">
42
42
  <a
43
- class="pf-v5-c-simple-list__item-link"
43
+ class="pf-v5-c-simple-list__item-link pf-m-link"
44
44
  href="#"
45
45
  tabindex="0"
46
46
  >List item 2</a>
47
47
  </li>
48
48
  <li class="pf-v5-c-simple-list__item">
49
49
  <a
50
- class="pf-v5-c-simple-list__item-link"
50
+ class="pf-v5-c-simple-list__item-link pf-m-link"
51
51
  href="#"
52
52
  tabindex="0"
53
53
  >List item 3</a>
package/docs/components/TabContent/examples/TabContent.md CHANGED
@@ -86,20 +86,20 @@ cssPrefix: pf-v5-c-tab-content
86
86
 
87
87
  ```
88
88
 
89
- ### Light 300 background
89
+ ### Secondary
90
90
 
91
91
  ```html
92
92
  <section
93
- class="pf-v5-c-tab-content pf-m-light-300"
94
- id="light-300-tab1-panel"
93
+ class="pf-v5-c-tab-content pf-m-secondary"
94
+ id="secondary-tab1-panel"
95
95
  role="tabpanel"
96
96
  tabindex="0"
97
97
  >
98
98
  <div class="pf-v5-c-tab-content__body">Panel 1</div>
99
99
  </section>
100
100
  <section
101
- class="pf-v5-c-tab-content pf-m-light-300"
102
- id="light-300-tab2-panel"
101
+ class="pf-v5-c-tab-content pf-m-secondary"
102
+ id="secondary-tab2-panel"
103
103
  role="tabpanel"
104
104
  tabindex="0"
105
105
  hidden
@@ -107,8 +107,8 @@ cssPrefix: pf-v5-c-tab-content
107
107
  <div class="pf-v5-c-tab-content__body">Panel 2</div>
108
108
  </section>
109
109
  <section
110
- class="pf-v5-c-tab-content pf-m-light-300"
111
- id="light-300-tab3-panel"
110
+ class="pf-v5-c-tab-content pf-m-secondary"
111
+ id="secondary-tab3-panel"
112
112
  role="tabpanel"
113
113
  tabindex="0"
114
114
  hidden
@@ -116,8 +116,8 @@ cssPrefix: pf-v5-c-tab-content
116
116
  <div class="pf-v5-c-tab-content__body">Panel 3</div>
117
117
  </section>
118
118
  <section
119
- class="pf-v5-c-tab-content pf-m-light-300"
120
- id="light-300-tab4-panel"
119
+ class="pf-v5-c-tab-content pf-m-secondary"
120
+ id="secondary-tab4-panel"
121
121
  role="tabpanel"
122
122
  tabindex="0"
123
123
  hidden
@@ -150,4 +150,4 @@ Tab content should be used with the [tabs component](/components/tabs).
150
150
  | `.pf-v5-c-tab-content` | `<section>` | Initiates the tab content component. **Required** |
151
151
  | `.pf-v5-c-tab-content__body` | `<div>` | Initiates the tab content body component. |
152
152
  | `.pf-m-padding` | `.pf-v5-c-tab-content__body` | Modifies the tab content body component padding. |
153
- | `.pf-m-light-300` | `.pf-v5-c-tab-content` | Modifies the tab content component background color. |
153
+ | `.pf-m-secondary` | `.pf-v5-c-tab-content` | Modifies the tab content component for secondary styles. |
package/docs/components/Table/examples/Table.css CHANGED
@@ -5,8 +5,8 @@
5
5
 
6
6
  #ws-core-c-table-th-truncation .pf-v5-c-tooltip {
7
7
  position: absolute;
8
- left: 440px;
9
- top: -18px;
8
+ inset-inline-start: 440px;
9
+ inset-block-start: -18px;
10
10
  }
11
11
 
12
12
  #ws-core-c-table-sticky-header .ws-preview-html {
package/docs/components/Table/examples/Table.md CHANGED
@@ -24703,9 +24703,9 @@ Add a [width modifier](#width-modifiers) to `thead th` to limit string length or
24703
24703
 
24704
24704
  There are a few ways this can be handled:
24705
24705
 
24706
- * Manipulate the `z-index` of the menu and/or table headers/columns manually.
24707
- * Use the `menuAppendTo` prop in non-composable react components with menus to append the menu to an element outside of the table (e.g., the `<body>` element) so that the menu has a higher stacking context than - and can appear on top of - sticky headers/columns as well as appear outside of any scrollable content in the table.
24708
- * In the case where the menu is outside of the table (e.g., above the table in a toolbar, or below the table and the menu expands up), assign the entire table a lower `z-index` than the `z-index` of the menu. This creates a lower stacking context for the entire table compared to the menu, while preserving the stacking context of the elements inside of the table.
24706
+ * Manipulate the `z-index` of the menu and/or table headers/columns manually.
24707
+ * Use the `menuAppendTo` prop in non-composable react components with menus to append the menu to an element outside of the table (e.g., the `<body>` element) so that the menu has a higher stacking context than - and can appear on top of - sticky headers/columns as well as appear outside of any scrollable content in the table.
24708
+ * In the case where the menu is outside of the table (e.g., above the table in a toolbar, or below the table and the menu expands up), assign the entire table a lower `z-index` than the `z-index` of the menu. This creates a lower stacking context for the entire table compared to the menu, while preserving the stacking context of the elements inside of the table.
24709
24709
 
24710
24710
  ### Sticky header
24711
24711
 
@@ -27051,8 +27051,8 @@ For sticky columns to function correctly, the parent table's width must be contr
27051
27051
  | `.pf-v5-c-scroll-outer-wrapper` | `<div>` | Initiates a table container sticky columns outer wrapper. |
27052
27052
  | `.pf-v5-c-scroll-inner-wrapper` | `<div>` | Initiates a table container sticky columns inner wrapper. |
27053
27053
  | `.pf-v5-c-table__sticky-cell` | `<th>`, `<td>` | Initiates a sticky table cell. |
27054
- | `.pf-m-right` | `.pf-v5-c-table__sticky-cell` | Initiates a sticky, right-hand table cell. |
27055
- | `.pf-m-left` | `.pf-v5-c-table__sticky-cell` | Initiates a sticky, left-hand table cell. |
27054
+ | `.pf-m-right`, `.pf-m-inline-end` | `.pf-v5-c-table__sticky-cell` | Initiates a sticky, right-hand (in LTR) or left-hand (in RTL) table cell. |
27055
+ | `.pf-m-left`, `.pf-m-inline-start` | `.pf-v5-c-table__sticky-cell` | Initiates a sticky, left-hand (in LTR) or right-hand (in RTL) table cell. |
27056
27056
 
27057
27057
  ## Nested column headers
27058
27058
 
@@ -30824,8 +30824,8 @@ By default, all table header cells are set to `white-space: nowrap`. If a `<th>`
30824
30824
 
30825
30825
  ### Implementation support
30826
30826
 
30827
- * One expandable toggle button, positioned in the first cell of a non-expandable row, preceding an expandable row.
30828
- * One checkbox or radio input, positioned in the first or second cell of a non-expandable row.
30829
- * One action button, positioned in the last cell of a non-expandable row.
30830
- * Tabular data.
30831
- * Compact presentation modifier (not compatible with expandable table).
30827
+ * One expandable toggle button, positioned in the first cell of a non-expandable row, preceding an expandable row.
30828
+ * One checkbox or radio input, positioned in the first or second cell of a non-expandable row.
30829
+ * One action button, positioned in the last cell of a non-expandable row.
30830
+ * Tabular data.
30831
+ * Compact presentation modifier (not compatible with expandable table).
package/docs/components/TextInputGroup/examples/TextInputGroup.css CHANGED
@@ -5,7 +5,7 @@
5
5
  .ws-example-wrapper .pf-v5-c-menu,
6
6
  .ws-example-wrapper .pf-v5-c-panel {
7
7
  position: absolute;
8
- top: 40px;
8
+ inset-block-start: 40px;
9
9
  width: 100%;
10
10
  }
11
11
 
package/docs/components/TextInputGroup/examples/TextInputGroup.md CHANGED
@@ -1022,28 +1022,28 @@ cssPrefix: pf-v5-c-text-input-group
1022
1022
  <div class="pf-v5-c-menu">
1023
1023
  <div class="pf-v5-c-menu__content">
1024
1024
  <ul class="pf-v5-c-menu__list" role="menu">
1025
- <li class="pf-v5-c-menu__list-item" role="none">
1025
+ <li class="pf-v5-c-menu__list-item" role="group">
1026
1026
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1027
1027
  <span class="pf-v5-c-menu__item-main">
1028
1028
  <span class="pf-v5-c-menu__item-text">apple</span>
1029
1029
  </span>
1030
1030
  </button>
1031
1031
  </li>
1032
- <li class="pf-v5-c-menu__list-item" role="none">
1032
+ <li class="pf-v5-c-menu__list-item" role="group">
1033
1033
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1034
1034
  <span class="pf-v5-c-menu__item-main">
1035
1035
  <span class="pf-v5-c-menu__item-text">appleby</span>
1036
1036
  </span>
1037
1037
  </button>
1038
1038
  </li>
1039
- <li class="pf-v5-c-menu__list-item" role="none">
1039
+ <li class="pf-v5-c-menu__list-item" role="group">
1040
1040
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1041
1041
  <span class="pf-v5-c-menu__item-main">
1042
1042
  <span class="pf-v5-c-menu__item-text">appleseed</span>
1043
1043
  </span>
1044
1044
  </button>
1045
1045
  </li>
1046
- <li class="pf-v5-c-menu__list-item" role="none">
1046
+ <li class="pf-v5-c-menu__list-item" role="group">
1047
1047
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1048
1048
  <span class="pf-v5-c-menu__item-main">
1049
1049
  <span class="pf-v5-c-menu__item-text">appleton</span>
@@ -1088,7 +1088,7 @@ cssPrefix: pf-v5-c-text-input-group
1088
1088
  <div class="pf-v5-c-menu">
1089
1089
  <div class="pf-v5-c-menu__content">
1090
1090
  <ul class="pf-v5-c-menu__list" role="menu">
1091
- <li class="pf-v5-c-menu__list-item" role="none">
1091
+ <li class="pf-v5-c-menu__list-item" role="group">
1092
1092
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1093
1093
  <span class="pf-v5-c-menu__item-main">
1094
1094
  <span class="pf-v5-c-menu__item-text">appleseed</span>
@@ -1241,28 +1241,28 @@ cssPrefix: pf-v5-c-text-input-group
1241
1241
  <div class="pf-v5-c-menu">
1242
1242
  <div class="pf-v5-c-menu__content">
1243
1243
  <ul class="pf-v5-c-menu__list" role="menu">
1244
- <li class="pf-v5-c-menu__list-item" role="none">
1244
+ <li class="pf-v5-c-menu__list-item" role="group">
1245
1245
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1246
1246
  <span class="pf-v5-c-menu__item-main">
1247
1247
  <span class="pf-v5-c-menu__item-text">nancy</span>
1248
1248
  </span>
1249
1249
  </button>
1250
1250
  </li>
1251
- <li class="pf-v5-c-menu__list-item" role="none">
1251
+ <li class="pf-v5-c-menu__list-item" role="group">
1252
1252
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1253
1253
  <span class="pf-v5-c-menu__item-main">
1254
1254
  <span class="pf-v5-c-menu__item-text">ned</span>
1255
1255
  </span>
1256
1256
  </button>
1257
1257
  </li>
1258
- <li class="pf-v5-c-menu__list-item" role="none">
1258
+ <li class="pf-v5-c-menu__list-item" role="group">
1259
1259
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1260
1260
  <span class="pf-v5-c-menu__item-main">
1261
1261
  <span class="pf-v5-c-menu__item-text">neil</span>
1262
1262
  </span>
1263
1263
  </button>
1264
1264
  </li>
1265
- <li class="pf-v5-c-menu__list-item" role="none">
1265
+ <li class="pf-v5-c-menu__list-item" role="group">
1266
1266
  <button class="pf-v5-c-menu__item" type="button" role="menuitem">
1267
1267
  <span class="pf-v5-c-menu__item-main">
1268
1268
  <span class="pf-v5-c-menu__item-text">nicole</span>
package/docs/components/Tile/examples/Tile.css CHANGED
@@ -2,7 +2,7 @@
2
2
  #ws-core-c-tile-extra-content .ws-preview-html .pf-v5-c-tile,
3
3
  #ws-core-c-tile-stacked-tiles .ws-preview-html .pf-v5-c-tile,
4
4
  #ws-core-c-tile-stacked-tiles-large .ws-preview-html .pf-v5-c-tile {
5
- margin-right: 8px;
5
+ margin-inline-end: 8px;
6
6
  }
7
7
 
8
8
  #ws-core-c-tile-extra-content .ws-preview-html {
package/docs/components/Title/examples/Title.md CHANGED
@@ -16,6 +16,18 @@ cssPrefix: pf-v5-c-title
16
16
 
17
17
  ```
18
18
 
19
+ ### Heading level modifiers
20
+
21
+ ```html
22
+ <div class="pf-v5-c-title pf-m-h1">H1-styled title</div>
23
+ <div class="pf-v5-c-title pf-m-h2">H2-styled title</div>
24
+ <div class="pf-v5-c-title pf-m-h3">H3-styled title</div>
25
+ <div class="pf-v5-c-title pf-m-h4">H4-styled title</div>
26
+ <div class="pf-v5-c-title pf-m-h5">H5-styled title</div>
27
+ <div class="pf-v5-c-title pf-m-h6">H6-styled title</div>
28
+
29
+ ```
30
+
19
31
  ## Documentation
20
32
 
21
33
  ### Overview
@@ -44,3 +56,9 @@ The content component defines margin on headers. To regain the same spacing use,
44
56
  | `.pf-m-xl` | `.pf-v5-c-title` | Modifies for xl size |
45
57
  | `.pf-m-lg` | `.pf-v5-c-title` | Modifies for lg size |
46
58
  | `.pf-m-md` | `.pf-v5-c-title` | Modifies for md size |
59
+ | `.pf-m-h1` | `.pf-v5-c-title` | Modifies for default h1 size |
60
+ | `.pf-m-h2` | `.pf-v5-c-title` | Modifies for default h2 size |
61
+ | `.pf-m-h3` | `.pf-v5-c-title` | Modifies for default h3 size |
62
+ | `.pf-m-h4` | `.pf-v5-c-title` | Modifies for default h4 size |
63
+ | `.pf-m-h5` | `.pf-v5-c-title` | Modifies for default h5 size |
64
+ | `.pf-m-h6` | `.pf-v5-c-title` | Modifies for default h6 size |