@patternfly/patternfly 6.0.0-alpha.7 → 6.0.0-alpha.70

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 (382) 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 +859 -833
  29. package/base/tokens/_tokens-dark.scss +306 -284
  30. package/base/tokens/_tokens-default.scss +415 -329
  31. package/base/tokens/_tokens-font.scss +41 -46
  32. package/base/tokens/_tokens-palette.scss +68 -68
  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 +18 -17
  39. package/components/ActionList/action-list.scss +26 -16
  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 -16
  49. package/components/BackToTop/back-to-top.scss +14 -14
  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 +417 -359
  61. package/components/Button/button.scss +472 -484
  62. package/components/CalendarMonth/calendar-month.css +25 -15
  63. package/components/CalendarMonth/calendar-month.scss +23 -15
  64. package/components/Card/card.css +117 -203
  65. package/components/Card/card.scss +137 -246
  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 +47 -41
  73. package/components/ClipboardCopy/clipboard-copy.scss +50 -34
  74. package/components/CodeBlock/code-block.css +24 -12
  75. package/components/CodeBlock/code-block.scss +24 -13
  76. package/components/CodeEditor/code-editor.css +31 -22
  77. package/components/CodeEditor/code-editor.scss +30 -21
  78. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  79. package/components/Content/content.css +40 -37
  80. package/components/Content/content.scss +40 -37
  81. package/components/ContextSelector/context-selector.css +41 -26
  82. package/components/ContextSelector/context-selector.scss +40 -25
  83. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  84. package/components/DataList/data-list-grid.css +21 -21
  85. package/components/DataList/data-list-grid.scss +3 -3
  86. package/components/DataList/data-list.css +165 -209
  87. package/components/DataList/data-list.scss +138 -185
  88. package/components/DatePicker/date-picker.css +8 -8
  89. package/components/DatePicker/date-picker.scss +8 -8
  90. package/components/DescriptionList/description-list.css +47 -39
  91. package/components/DescriptionList/description-list.scss +33 -30
  92. package/components/Divider/divider.css +97 -177
  93. package/components/Divider/divider.scss +60 -79
  94. package/components/DragDrop/drag-drop.css +26 -22
  95. package/components/DragDrop/drag-drop.scss +26 -25
  96. package/components/Drawer/drawer.css +216 -158
  97. package/components/Drawer/drawer.scss +199 -150
  98. package/components/Dropdown/dropdown.css +76 -69
  99. package/components/Dropdown/dropdown.scss +67 -62
  100. package/components/DualListSelector/dual-list-selector.css +29 -15
  101. package/components/DualListSelector/dual-list-selector.scss +30 -15
  102. package/components/EmptyState/empty-state.css +64 -38
  103. package/components/EmptyState/empty-state.scss +70 -38
  104. package/components/ExpandableSection/expandable-section.css +75 -66
  105. package/components/ExpandableSection/expandable-section.scss +82 -80
  106. package/components/FileUpload/file-upload.css +31 -43
  107. package/components/FileUpload/file-upload.scss +31 -49
  108. package/components/Form/form.css +111 -154
  109. package/components/Form/form.scss +101 -160
  110. package/components/FormControl/form-control.css +95 -111
  111. package/components/FormControl/form-control.scss +97 -92
  112. package/components/HelperText/helper-text.css +29 -35
  113. package/components/HelperText/helper-text.scss +31 -41
  114. package/components/Hint/hint.css +37 -27
  115. package/components/Hint/hint.scss +37 -30
  116. package/components/Icon/icon.css +155 -19
  117. package/components/Icon/icon.scss +188 -21
  118. package/components/InlineEdit/inline-edit.css +12 -11
  119. package/components/InlineEdit/inline-edit.scss +12 -11
  120. package/components/InputGroup/input-group.css +32 -42
  121. package/components/InputGroup/input-group.scss +31 -33
  122. package/components/JumpLinks/jump-links.css +61 -58
  123. package/components/JumpLinks/jump-links.scss +61 -60
  124. package/components/Label/label-group.css +48 -50
  125. package/components/Label/label-group.scss +48 -51
  126. package/components/Label/label.css +382 -363
  127. package/components/Label/label.scss +441 -356
  128. package/components/List/list.css +25 -25
  129. package/components/List/list.scss +26 -26
  130. package/components/LogViewer/log-viewer.css +14 -14
  131. package/components/LogViewer/log-viewer.scss +14 -14
  132. package/components/Login/login.css +104 -122
  133. package/components/Login/login.scss +92 -91
  134. package/components/Masthead/masthead.css +262 -506
  135. package/components/Masthead/masthead.scss +123 -289
  136. package/components/Menu/menu.css +82 -65
  137. package/components/Menu/menu.scss +85 -69
  138. package/components/MenuToggle/menu-toggle.css +37 -31
  139. package/components/MenuToggle/menu-toggle.scss +37 -33
  140. package/components/ModalBox/modal-box.css +76 -69
  141. package/components/ModalBox/modal-box.scss +74 -70
  142. package/components/MultipleFileUpload/multiple-file-upload.css +87 -57
  143. package/components/MultipleFileUpload/multiple-file-upload.scss +92 -60
  144. package/components/Nav/nav.css +248 -899
  145. package/components/Nav/nav.scss +304 -1059
  146. package/components/Nav/themes/dark/nav.scss +2 -2
  147. package/components/NotificationBadge/notification-badge.css +66 -85
  148. package/components/NotificationBadge/notification-badge.scss +72 -103
  149. package/components/NotificationDrawer/notification-drawer.css +130 -128
  150. package/components/NotificationDrawer/notification-drawer.scss +130 -129
  151. package/components/NumberInput/number-input.css +10 -10
  152. package/components/NumberInput/number-input.scss +9 -14
  153. package/components/OptionsMenu/options-menu.css +43 -31
  154. package/components/OptionsMenu/options-menu.scss +43 -31
  155. package/components/OverflowMenu/overflow-menu.css +17 -47
  156. package/components/OverflowMenu/overflow-menu.scss +27 -65
  157. package/components/Page/page.css +182 -232
  158. package/components/Page/page.scss +130 -195
  159. package/components/Pagination/pagination.css +74 -121
  160. package/components/Pagination/pagination.scss +55 -125
  161. package/components/Panel/panel.css +40 -30
  162. package/components/Panel/panel.scss +42 -33
  163. package/components/Popover/popover.css +108 -87
  164. package/components/Popover/popover.scss +120 -109
  165. package/components/Progress/progress.css +40 -52
  166. package/components/Progress/progress.scss +48 -62
  167. package/components/ProgressStepper/progress-stepper.css +98 -89
  168. package/components/ProgressStepper/progress-stepper.scss +90 -84
  169. package/components/Radio/radio.css +30 -23
  170. package/components/Radio/radio.scss +31 -25
  171. package/components/Select/select.css +56 -47
  172. package/components/Select/select.scss +56 -47
  173. package/components/Sidebar/sidebar.css +31 -14
  174. package/components/Sidebar/sidebar.scss +34 -16
  175. package/components/SimpleList/simple-list.css +45 -56
  176. package/components/SimpleList/simple-list.scss +51 -55
  177. package/components/Skeleton/skeleton.css +24 -25
  178. package/components/Skeleton/skeleton.scss +21 -26
  179. package/components/SkipToContent/skip-to-content.css +9 -6
  180. package/components/SkipToContent/skip-to-content.scss +8 -6
  181. package/components/Slider/slider.css +80 -55
  182. package/components/Slider/slider.scss +96 -65
  183. package/components/Spinner/spinner.css +17 -34
  184. package/components/Spinner/spinner.scss +19 -47
  185. package/components/Switch/switch.css +49 -41
  186. package/components/Switch/switch.scss +51 -42
  187. package/components/TabContent/tab-content.css +21 -12
  188. package/components/TabContent/tab-content.scss +22 -15
  189. package/components/Table/table-grid.css +256 -195
  190. package/components/Table/table-grid.scss +53 -39
  191. package/components/Table/table-scrollable.css +4 -4
  192. package/components/Table/table-scrollable.scss +6 -4
  193. package/components/Table/table-tree-view.css +112 -105
  194. package/components/Table/table-tree-view.scss +38 -33
  195. package/components/Table/table.css +105 -89
  196. package/components/Table/table.scss +105 -89
  197. package/components/Tabs/tabs.css +210 -214
  198. package/components/Tabs/tabs.scss +222 -254
  199. package/components/TextInputGroup/text-input-group.css +15 -15
  200. package/components/TextInputGroup/text-input-group.scss +15 -15
  201. package/components/Tile/tile.css +47 -88
  202. package/components/Tile/tile.scss +45 -91
  203. package/components/Timestamp/timestamp.css +12 -9
  204. package/components/Timestamp/timestamp.scss +11 -10
  205. package/components/Title/title.css +70 -19
  206. package/components/Title/title.scss +90 -20
  207. package/components/ToggleGroup/toggle-group.css +68 -59
  208. package/components/ToggleGroup/toggle-group.scss +72 -57
  209. package/components/Toolbar/toolbar.css +2553 -1054
  210. package/components/Toolbar/toolbar.scss +234 -516
  211. package/components/Tooltip/tooltip.css +74 -44
  212. package/components/Tooltip/tooltip.scss +93 -77
  213. package/components/TreeView/tree-view.css +48 -27
  214. package/components/TreeView/tree-view.scss +50 -28
  215. package/components/Truncate/truncate.css +13 -0
  216. package/components/Truncate/truncate.scss +19 -3
  217. package/components/Wizard/wizard.css +57 -36
  218. package/components/Wizard/wizard.scss +57 -36
  219. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  220. package/docs/components/Accordion/examples/Accordion.md +614 -416
  221. package/docs/components/ActionList/examples/ActionList.md +73 -22
  222. package/docs/components/Alert/examples/Alert.md +3 -3
  223. package/docs/components/Avatar/examples/Avatar.md +5 -19
  224. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  225. package/docs/components/Badge/examples/Badge.md +21 -0
  226. package/docs/components/Banner/examples/Banner.md +48 -25
  227. package/docs/components/Brand/examples/Brand.css +12 -0
  228. package/docs/components/Brand/examples/Brand.md +51 -32
  229. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  230. package/docs/components/Button/examples/Button.css +6 -2
  231. package/docs/components/Button/examples/Button.md +1425 -87
  232. package/docs/components/Card/examples/Card.md +565 -148
  233. package/docs/components/Check/examples/Check.md +71 -58
  234. package/docs/components/Chip/examples/Chip.md +1 -1
  235. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  236. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  237. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  238. package/docs/components/Content/examples/Content.md +5 -5
  239. package/docs/components/Divider/examples/Divider.css +3 -1
  240. package/docs/components/Divider/examples/Divider.md +4 -5
  241. package/docs/components/DragDrop/examples/DragDrop.css +3 -3
  242. package/docs/components/Drawer/examples/Drawer.md +294 -256
  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/FileUpload/examples/FileUpload.md +112 -53
  248. package/docs/components/Form/examples/Form.md +134 -89
  249. package/docs/components/Icon/examples/Icon.md +82 -11
  250. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  251. package/docs/components/JumpLinks/examples/JumpLinks.md +280 -168
  252. package/docs/components/Label/examples/Label.css +4 -0
  253. package/docs/components/Label/examples/Label.md +3091 -704
  254. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  255. package/docs/components/LogViewer/examples/LogViewer.md +300 -210
  256. package/docs/components/Login/examples/Login.md +10 -5
  257. package/docs/components/Masthead/examples/masthead.md +443 -65
  258. package/docs/components/Menu/examples/Menu.css +8 -0
  259. package/docs/components/Menu/examples/Menu.md +594 -543
  260. package/docs/components/MenuToggle/examples/MenuToggle.md +109 -96
  261. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  262. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  263. package/docs/components/Nav/examples/Navigation.css +3 -42
  264. package/docs/components/Nav/examples/Navigation.md +305 -353
  265. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  266. package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
  267. package/docs/components/Page/examples/Page.css +0 -8
  268. package/docs/components/Page/examples/Page.md +22 -21
  269. package/docs/components/Pagination/examples/Pagination.md +663 -637
  270. package/docs/components/Panel/examples/Panel.md +12 -0
  271. package/docs/components/Popover/examples/Popover.css +4 -9
  272. package/docs/components/Popover/examples/Popover.md +1 -1
  273. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -14
  274. package/docs/components/Radio/examples/Radio.md +62 -54
  275. package/docs/components/Select/deprecated/Select.md +184 -177
  276. package/docs/components/Sidebar/examples/Sidebar.md +19 -0
  277. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  278. package/docs/components/TabContent/examples/TabContent.md +10 -10
  279. package/docs/components/Table/examples/Table.css +2 -2
  280. package/docs/components/Table/examples/Table.md +10 -10
  281. package/docs/components/Tabs/examples/Tabs.css +1 -1
  282. package/docs/components/Tabs/examples/Tabs.md +1025 -826
  283. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  284. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  285. package/docs/components/Tile/examples/Tile.css +1 -1
  286. package/docs/components/Tile/examples/Tile.md +264 -144
  287. package/docs/components/Title/examples/Title.md +18 -0
  288. package/docs/components/Toolbar/examples/Toolbar.css +20 -15
  289. package/docs/components/Toolbar/examples/Toolbar.md +1211 -3487
  290. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  291. package/docs/components/Tooltip/examples/Tooltip.md +3 -1
  292. package/docs/components/Truncate/examples/Truncate.css +2 -2
  293. package/docs/components/Truncate/examples/Truncate.md +2 -2
  294. package/docs/demos/AboutModal/examples/AboutModal.md +104 -31
  295. package/docs/demos/Alert/examples/Alert.md +330 -87
  296. package/docs/demos/BackToTop/examples/BackToTop.md +102 -29
  297. package/docs/demos/Banner/examples/Banner.md +211 -60
  298. package/docs/demos/Card/examples/Card.css +3 -3
  299. package/docs/demos/Card/examples/Card.md +28 -12
  300. package/docs/demos/CardView/examples/CardView.md +265 -207
  301. package/docs/demos/ContextSelector/examples/ContextSelector.md +377 -94
  302. package/docs/demos/Dashboard/examples/Dashboard.md +105 -32
  303. package/docs/demos/DataList/examples/DataList.md +1002 -935
  304. package/docs/demos/DescriptionList/examples/DescriptionList.md +306 -87
  305. package/docs/demos/Drawer/examples/Drawer.md +640 -251
  306. package/docs/demos/Form/examples/BasicForms.md +138 -84
  307. package/docs/demos/JumpLinks/examples/JumpLinks.md +917 -385
  308. package/docs/demos/Masthead/examples/Masthead.md +786 -342
  309. package/docs/demos/Modal/examples/Modal.md +645 -198
  310. package/docs/demos/Nav/examples/Nav.md +691 -902
  311. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +515 -145
  312. package/docs/demos/Page/examples/Page.md +942 -273
  313. package/docs/demos/Page/examples/Penta.md +66 -26
  314. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  315. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  316. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1333 -946
  317. package/docs/demos/Skeleton/examples/Skeleton.md +109 -64
  318. package/docs/demos/Table/examples/Table.md +3857 -3418
  319. package/docs/demos/Tabs/examples/Tabs.md +664 -215
  320. package/docs/demos/Toolbar/examples/Toolbar.css +15 -0
  321. package/docs/demos/Toolbar/examples/Toolbar.md +1313 -1475
  322. package/docs/demos/Wizard/examples/Wizard.md +918 -261
  323. package/docs/layouts/Flex/examples/Flex.md +16 -16
  324. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  325. package/icons/pficons.mjs +1 -0
  326. package/layouts/Flex/flex.css +115 -43
  327. package/layouts/Flex/flex.scss +20 -8
  328. package/package.json +36 -32
  329. package/patternfly-addons.css +732 -972
  330. package/patternfly-base-no-globals-theme-dark-unversioned.css +895 -847
  331. package/patternfly-base-no-globals.css +895 -847
  332. package/patternfly-base-theme-dark-unversioned.css +899 -850
  333. package/patternfly-base.css +899 -850
  334. package/patternfly-no-globals.css +9935 -8997
  335. package/patternfly-theme-dark-unversioned.css +9940 -9001
  336. package/patternfly.css +9940 -9001
  337. package/patternfly.min.css +1 -1
  338. package/patternfly.min.css.map +1 -1
  339. package/sass-utilities/functions.scss +6 -0
  340. package/sass-utilities/mixins.scss +80 -2
  341. package/sass-utilities/scss-variables.scss +8 -8
  342. package/sass-utilities/themes/dark/mixins.scss +3 -1
  343. package/utilities/Accessibility/accessibility.css +12 -12
  344. package/utilities/Spacing/spacing.css +720 -960
  345. package/utilities/Spacing/spacing.scss +4 -8
  346. package/base/themes/dark/_variables.scss +0 -102
  347. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  348. package/components/Accordion/themes/dark/accordion.scss +0 -9
  349. package/components/Alert/themes/dark/alert.scss +0 -17
  350. package/components/Badge/themes/dark/badge.scss +0 -9
  351. package/components/Banner/themes/dark/banner.scss +0 -14
  352. package/components/Button/themes/dark/button.scss +0 -51
  353. package/components/Card/themes/dark/card.scss +0 -20
  354. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +0 -19
  355. package/components/DataList/themes/dark/data-list.scss +0 -10
  356. package/components/DragDrop/themes/dark/drag-drop.scss +0 -7
  357. package/components/Drawer/themes/dark/drawer.scss +0 -13
  358. package/components/Form/themes/dark/form.scss +0 -7
  359. package/components/FormControl/themes/dark/form-control.scss +0 -24
  360. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  361. package/components/Hint/themes/dark/hint.scss +0 -8
  362. package/components/InputGroup/themes/dark/input-group.scss +0 -22
  363. package/components/Label/themes/dark/label.scss +0 -53
  364. package/components/Login/themes/dark/login.scss +0 -12
  365. package/components/Masthead/themes/dark/masthead.scss +0 -14
  366. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  367. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  368. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  369. package/components/Page/themes/dark/page.scss +0 -69
  370. package/components/Pagination/themes/dark/pagination.scss +0 -7
  371. package/components/Panel/themes/dark/panel.scss +0 -7
  372. package/components/Popover/themes/dark/popover.scss +0 -11
  373. package/components/Progress/themes/dark/progress.scss +0 -9
  374. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  375. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  376. package/components/Switch/themes/dark/switch.scss +0 -11
  377. package/components/Tabs/themes/dark/tabs.scss +0 -10
  378. package/components/Tile/themes/dark/tile.scss +0 -10
  379. package/components/ToggleGroup/themes/dark/toggle-group.scss +0 -12
  380. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  381. package/docs/components/Avatar/examples/Avatar.css +0 -3
  382. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/demos/Form/examples/BasicForms.md CHANGED
@@ -26,6 +26,9 @@ subsection: forms
26
26
  <div class="pf-v5-c-form__helper-text" aria-live="polite">
27
27
  <div class="pf-v5-c-helper-text">
28
28
  <div class="pf-v5-c-helper-text__item" id="-name-helper">
29
+ <span class="pf-v5-c-helper-text__item-icon">
30
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
31
+ </span>
29
32
  <span
30
33
  class="pf-v5-c-helper-text__item-text"
31
34
  >Include your middle name if you have one.</span>
@@ -46,14 +49,17 @@ subsection: forms
46
49
  </div>
47
50
  <div class="pf-v5-c-form__group">
48
51
  <div class="pf-v5-c-form__group-label"><label class="pf-v5-c-form__label" for="-phone">
49
- <span class="pf-v5-c-form__label-text">Phone number</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
50
- class="pf-v5-c-form__group-label-help"
51
- aria-label="More information for phone number field"
52
- aria-describedby="-phone"
53
- role="button"
54
- type="button"
55
- tabindex="0"
56
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
52
+ <span class="pf-v5-c-form__label-text">Phone number</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
53
+ <span
54
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
55
+ type="button"
56
+ role="button"
57
+ tabindex="0"
58
+ aria-label="More information for phone number field"
59
+ aria-describedby="-phone"
60
+ >
61
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
62
+ </span></span>
57
63
  </div>
58
64
  <div class="pf-v5-c-form__group-control">
59
65
  <span class="pf-v5-c-form-control pf-m-required">
@@ -188,6 +194,9 @@ subsection: forms
188
194
  class="pf-v5-c-helper-text__item"
189
195
  id="form-demo-horizontal-name-helper"
190
196
  >
197
+ <span class="pf-v5-c-helper-text__item-icon">
198
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
199
+ </span>
191
200
  <span
192
201
  class="pf-v5-c-helper-text__item-text"
193
202
  >Include your middle name if you have one.</span>
@@ -234,14 +243,17 @@ subsection: forms
234
243
  class="pf-v5-c-form__group-label pf-m-no-padding-top"
235
244
  id="form-demo-horizontalform-demo-horizontal-contact-legend"
236
245
  ><span class="pf-v5-c-form__label">
237
- <span class="pf-v5-c-form__label-text">How can we contact you?</span></span>&nbsp;<span
238
- class="pf-v5-c-form__group-label-help"
239
- aria-label="More information for contact field"
240
- aria-describedby="form-demo-horizontal-contact-legend"
241
- role="button"
242
- type="button"
243
- tabindex="0"
244
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
246
+ <span class="pf-v5-c-form__label-text">How can we contact you?</span></span>&nbsp;<span class="pf-v5-c-form__group-label-help">
247
+ <span
248
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
249
+ type="button"
250
+ role="button"
251
+ tabindex="0"
252
+ aria-label="More information for contact field"
253
+ aria-describedby="form-demo-horizontal-contact-legend"
254
+ >
255
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
256
+ </span></span>
245
257
  </div>
246
258
  <div class="pf-v5-c-form__group-control pf-m-stack">
247
259
  <div class="pf-v5-c-check">
@@ -320,6 +332,9 @@ subsection: forms
320
332
  <div class="pf-v5-c-form__helper-text" aria-live="polite">
321
333
  <div class="pf-v5-c-helper-text">
322
334
  <div class="pf-v5-c-helper-text__item" id="-helper">
335
+ <span class="pf-v5-c-helper-text__item-icon">
336
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
337
+ </span>
323
338
  <span
324
339
  class="pf-v5-c-helper-text__item-text"
325
340
  >Include your middle name if you have one.</span>
@@ -497,14 +512,17 @@ subsection: forms
497
512
  class="pf-v5-c-form__label"
498
513
  for="form-demo-sections-repeatable-fields-clientid"
499
514
  >
500
- <span class="pf-v5-c-form__label-text">Client ID</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
501
- class="pf-v5-c-form__group-label-help"
502
- aria-label="More information for client id field"
503
- aria-describedby="form-demo-sections-repeatable-fields-clientid"
504
- role="button"
505
- type="button"
506
- tabindex="0"
507
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
515
+ <span class="pf-v5-c-form__label-text">Client ID</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
516
+ <span
517
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
518
+ type="button"
519
+ role="button"
520
+ tabindex="0"
521
+ aria-label="More information for client id field"
522
+ aria-describedby="form-demo-sections-repeatable-fields-clientid"
523
+ >
524
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
525
+ </span></span>
508
526
  </div>
509
527
  <div class="pf-v5-c-form__group-control">
510
528
  <span class="pf-v5-c-form-control pf-m-required">
@@ -522,14 +540,17 @@ subsection: forms
522
540
  class="pf-v5-c-form__label"
523
541
  for="form-demo-sections-repeatable-fields-name"
524
542
  >
525
- <span class="pf-v5-c-form__label-text">Full name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
526
- class="pf-v5-c-form__group-label-help"
527
- aria-label="More information for full name field"
528
- aria-describedby="form-demo-sections-repeatable-fields-name"
529
- role="button"
530
- type="button"
531
- tabindex="0"
532
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
543
+ <span class="pf-v5-c-form__label-text">Full name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
544
+ <span
545
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
546
+ type="button"
547
+ role="button"
548
+ tabindex="0"
549
+ aria-label="More information for full name field"
550
+ aria-describedby="form-demo-sections-repeatable-fields-name"
551
+ >
552
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
553
+ </span></span>
533
554
  </div>
534
555
  <div class="pf-v5-c-form__group-control">
535
556
  <span class="pf-v5-c-form-control pf-m-required">
@@ -547,14 +568,17 @@ subsection: forms
547
568
  class="pf-v5-c-form__label"
548
569
  for="form-demo-sections-repeatable-fields-description"
549
570
  >
550
- <span class="pf-v5-c-form__label-text">Description</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
551
- class="pf-v5-c-form__group-label-help"
552
- aria-label="More information for description field"
553
- aria-describedby="form-demo-sections-repeatable-fields-description"
554
- role="button"
555
- type="button"
556
- tabindex="0"
557
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
571
+ <span class="pf-v5-c-form__label-text">Description</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
572
+ <span
573
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
574
+ type="button"
575
+ role="button"
576
+ tabindex="0"
577
+ aria-label="More information for description field"
578
+ aria-describedby="form-demo-sections-repeatable-fields-description"
579
+ >
580
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
581
+ </span></span>
558
582
  </div>
559
583
  <div class="pf-v5-c-form__group-control">
560
584
  <span class="pf-v5-c-form-control pf-m-required">
@@ -583,14 +607,17 @@ subsection: forms
583
607
  class="pf-v5-c-form__label"
584
608
  for="form-demo-sections-repeatable-fields-section2-rooturl"
585
609
  >
586
- <span class="pf-v5-c-form__label-text">Root URL</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
587
- class="pf-v5-c-form__group-label-help"
588
- aria-label="More information for root URL field"
589
- aria-describedby="form-demo-sections-repeatable-fields-section2-rooturl"
590
- role="button"
591
- type="button"
592
- tabindex="0"
593
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
610
+ <span class="pf-v5-c-form__label-text">Root URL</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
611
+ <span
612
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
613
+ type="button"
614
+ role="button"
615
+ tabindex="0"
616
+ aria-label="More information for root URL field"
617
+ aria-describedby="form-demo-sections-repeatable-fields-section2-rooturl"
618
+ >
619
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
620
+ </span></span>
594
621
  </div>
595
622
  <div class="pf-v5-c-form__group-control">
596
623
  <span class="pf-v5-c-form-control pf-m-required">
@@ -608,14 +635,17 @@ subsection: forms
608
635
  class="pf-v5-c-form__label"
609
636
  id="form-demo-sections-repeatable-fields-section2-uris"
610
637
  >
611
- <span class="pf-v5-c-form__label-text">Valid redirect URIs</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
612
- class="pf-v5-c-form__group-label-help"
613
- aria-label="More information for valid redirect URIs field"
614
- aria-describedby="form-demo-sections-repeatable-fields-section2-uris"
615
- role="button"
616
- type="button"
617
- tabindex="0"
618
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
638
+ <span class="pf-v5-c-form__label-text">Valid redirect URIs</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
639
+ <span
640
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
641
+ type="button"
642
+ role="button"
643
+ tabindex="0"
644
+ aria-label="More information for valid redirect URIs field"
645
+ aria-describedby="form-demo-sections-repeatable-fields-section2-uris"
646
+ >
647
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
648
+ </span></span>
619
649
  </div>
620
650
  <div class="pf-v5-c-form__group-control pf-m-stack">
621
651
  <div class="pf-v5-c-input-group">
@@ -697,14 +727,17 @@ subsection: forms
697
727
  class="pf-v5-c-form__label"
698
728
  for="form-demo-sections-repeatable-fields-section2-home-url"
699
729
  >
700
- <span class="pf-v5-c-form__label-text">Home URL</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
701
- class="pf-v5-c-form__group-label-help"
702
- aria-label="More information for home URL field"
703
- aria-describedby="form-demo-sections-repeatable-fields-section2-home-url"
704
- role="button"
705
- type="button"
706
- tabindex="0"
707
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
730
+ <span class="pf-v5-c-form__label-text">Home URL</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
731
+ <span
732
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
733
+ type="button"
734
+ role="button"
735
+ tabindex="0"
736
+ aria-label="More information for home URL field"
737
+ aria-describedby="form-demo-sections-repeatable-fields-section2-home-url"
738
+ >
739
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
740
+ </span></span>
708
741
  </div>
709
742
  <div class="pf-v5-c-form__group-control">
710
743
  <span class="pf-v5-c-form-control pf-m-required">
@@ -731,14 +764,17 @@ subsection: forms
731
764
  class="pf-v5-c-form__label"
732
765
  for="form-demo-sections-complex-form-name"
733
766
  >
734
- <span class="pf-v5-c-form__label-text">Name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
735
- class="pf-v5-c-form__group-label-help"
736
- aria-label="More information for name field"
737
- aria-describedby="form-demo-sections-complex-form-name"
738
- role="button"
739
- type="button"
740
- tabindex="0"
741
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
767
+ <span class="pf-v5-c-form__label-text">Name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
768
+ <span
769
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
770
+ type="button"
771
+ role="button"
772
+ tabindex="0"
773
+ aria-label="More information for name field"
774
+ aria-describedby="form-demo-sections-complex-form-name"
775
+ >
776
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
777
+ </span></span>
742
778
  </div>
743
779
  <div class="pf-v5-c-form__group-control">
744
780
  <span class="pf-v5-c-form-control pf-m-required">
@@ -757,14 +793,17 @@ subsection: forms
757
793
  class="pf-v5-c-form__label"
758
794
  for="form-demo-sections-complex-form-labels"
759
795
  >
760
- <span class="pf-v5-c-form__label-text">Labels</span></label>&nbsp;<span
761
- class="pf-v5-c-form__group-label-help"
762
- aria-label="More information for labels field"
763
- aria-describedby="form-demo-sections-complex-form-labels"
764
- role="button"
765
- type="button"
766
- tabindex="0"
767
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
796
+ <span class="pf-v5-c-form__label-text">Labels</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
797
+ <span
798
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
799
+ type="button"
800
+ role="button"
801
+ tabindex="0"
802
+ aria-label="More information for labels field"
803
+ aria-describedby="form-demo-sections-complex-form-labels"
804
+ >
805
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
806
+ </span></span>
768
807
  </div>
769
808
  <div class="pf-v5-c-form__group-control">
770
809
  <div
@@ -785,11 +824,14 @@ subsection: forms
785
824
  <span class="pf-v5-c-label__icon">
786
825
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
787
826
  </span>
788
- <span class="pf-v5-c-label__text">prometheus=k8s</span>
827
+ <span
828
+ class="pf-v5-c-label__text"
829
+ id="-label-1-text"
830
+ >prometheus=k8s</span>
789
831
  </span>
790
832
  <span class="pf-v5-c-label__actions">
791
833
  <button
792
- class="pf-v5-c-button pf-m-plain"
834
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
793
835
  type="button"
794
836
  id="-label-1-button"
795
837
  aria-label="Remove"
@@ -806,11 +848,11 @@ subsection: forms
806
848
  <span class="pf-v5-c-label__icon">
807
849
  <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
808
850
  </span>
809
- <span class="pf-v5-c-label__text">new</span>
851
+ <span class="pf-v5-c-label__text" id="-label-2-text">new</span>
810
852
  </span>
811
853
  <span class="pf-v5-c-label__actions">
812
854
  <button
813
- class="pf-v5-c-button pf-m-plain"
855
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
814
856
  type="button"
815
857
  id="-label-2-button"
816
858
  aria-label="Remove"
@@ -1207,6 +1249,9 @@ subsection: forms
1207
1249
  class="pf-v5-c-helper-text__item"
1208
1250
  id="form-demo-sections-complex-form-routing-create-route-helper"
1209
1251
  >
1252
+ <span class="pf-v5-c-helper-text__item-icon">
1253
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1254
+ </span>
1210
1255
  <span
1211
1256
  class="pf-v5-c-helper-text__item-text"
1212
1257
  >Exposes your appplication at a public URL.</span>
@@ -1237,6 +1282,9 @@ subsection: forms
1237
1282
  class="pf-v5-c-helper-text__item"
1238
1283
  id="form-demo-sections-complex-form-routing-hostname-helper"
1239
1284
  >
1285
+ <span class="pf-v5-c-helper-text__item-icon">
1286
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1287
+ </span>
1240
1288
  <span
1241
1289
  class="pf-v5-c-helper-text__item-text"
1242
1290
  >Public hostname for the route. If not specified, a hostname is generated.</span>
@@ -1269,6 +1317,9 @@ subsection: forms
1269
1317
  class="pf-v5-c-helper-text__item"
1270
1318
  id="form-demo-sections-complex-form-routing-path-helper"
1271
1319
  >
1320
+ <span class="pf-v5-c-helper-text__item-icon">
1321
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1322
+ </span>
1272
1323
  <span
1273
1324
  class="pf-v5-c-helper-text__item-text"
1274
1325
  >Path that the router watches to route traffic to the service.</span>
@@ -1311,6 +1362,9 @@ subsection: forms
1311
1362
  class="pf-v5-c-helper-text__item"
1312
1363
  id="form-demo-sections-complex-form-routing-security-helper"
1313
1364
  >
1365
+ <span class="pf-v5-c-helper-text__item-icon">
1366
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
1367
+ </span>
1314
1368
  <span
1315
1369
  class="pf-v5-c-helper-text__item-text"
1316
1370
  >Routes can be secured using several TLS termination types for serving certificates.</span>