@patternfly/patternfly 6.5.0-prerelease.5 → 6.5.0-prerelease.50

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 (376) hide show
  1. package/README.md +1 -1
  2. package/assets/fontawesome/_variables.scss +2 -1
  3. package/assets/images/RHAiExperienceIcon.svg +27 -0
  4. package/assets/images/RHAutomationsLogo.svg +96 -0
  5. package/assets/images/RHServerStackIcon.svg +16 -0
  6. package/assets/images/compass--hero-bg.png +0 -0
  7. package/assets/images/compass--rh-wallpaper-dark.png +0 -0
  8. package/assets/images/compass--rh-wallpaper-light.png +0 -0
  9. package/assets/images/compass--wallpaper-dark.png +0 -0
  10. package/assets/images/compass--wallpaper-light.png +0 -0
  11. package/base/normalize.scss +7 -0
  12. package/base/patternfly-common.css +50 -0
  13. package/base/patternfly-common.scss +59 -0
  14. package/base/patternfly-svg-icons.css +11 -0
  15. package/base/patternfly-svg-icons.scss +14 -0
  16. package/base/patternfly-variables.css +345 -14
  17. package/base/patternfly-variables.scss +40 -0
  18. package/base/tokens/tokens-dark.scss +51 -3
  19. package/base/tokens/tokens-default.scss +67 -13
  20. package/base/tokens/tokens-glass-dark.scss +9 -0
  21. package/base/tokens/tokens-glass.scss +9 -0
  22. package/base/tokens/tokens-local.scss +16 -0
  23. package/base/tokens/tokens-palette.scss +3 -1
  24. package/base/tokens/tokens-redhat-dark.scss +14 -0
  25. package/base/tokens/tokens-redhat-glass-dark.scss +16 -0
  26. package/base/tokens/tokens-redhat-glass.scss +15 -0
  27. package/base/tokens/tokens-redhat-highcontrast-dark.scss +47 -0
  28. package/base/tokens/tokens-redhat-highcontrast.scss +127 -0
  29. package/base/tokens/tokens-redhat.scss +15 -0
  30. package/components/AboutModalBox/about-modal-box.css +36 -26
  31. package/components/Accordion/accordion.css +17 -14
  32. package/components/Accordion/accordion.scss +1 -2
  33. package/components/ActionList/action-list.css +2 -0
  34. package/components/ActionList/action-list.scss +2 -0
  35. package/components/Alert/alert.css +7 -5
  36. package/components/Alert/alert.scss +2 -1
  37. package/components/Avatar/avatar.css +12 -4
  38. package/components/BackgroundImage/background-image.css +6 -3
  39. package/components/Banner/banner.css +8 -6
  40. package/components/Brand/brand.css +3 -1
  41. package/components/Breadcrumb/breadcrumb.css +4 -3
  42. package/components/Button/button.css +117 -14
  43. package/components/Button/button.scss +127 -10
  44. package/components/CalendarMonth/calendar-month.css +4 -3
  45. package/components/Card/card.css +20 -7
  46. package/components/Card/card.scss +16 -2
  47. package/components/ClipboardCopy/clipboard-copy.css +7 -6
  48. package/components/ClipboardCopy/clipboard-copy.scss +3 -3
  49. package/components/CodeEditor/code-editor.css +1 -1
  50. package/components/CodeEditor/code-editor.scss +1 -1
  51. package/components/Compass/compass.css +320 -0
  52. package/components/Compass/compass.scss +350 -0
  53. package/components/DataList/data-list.css +34 -23
  54. package/components/DataList/data-list.scss +7 -2
  55. package/components/DescriptionList/description-list-order.scss +5 -1
  56. package/components/DescriptionList/description-list.css +7 -5
  57. package/components/DescriptionList/description-list.scss +5 -1
  58. package/components/Divider/divider.css +7 -5
  59. package/components/Drawer/drawer.css +110 -56
  60. package/components/Drawer/drawer.scss +69 -9
  61. package/components/DualListSelector/dual-list-selector.css +18 -12
  62. package/components/DualListSelector/dual-list-selector.scss +1 -1
  63. package/components/ExpandableSection/expandable-section.css +21 -16
  64. package/components/ExpandableSection/expandable-section.scss +6 -3
  65. package/components/Form/form.css +2 -2
  66. package/components/Form/form.scss +2 -2
  67. package/components/FormControl/form-control.css +3 -3
  68. package/components/FormControl/form-control.scss +3 -3
  69. package/components/Hero/hero.css +74 -0
  70. package/components/Hero/hero.scss +86 -0
  71. package/components/JumpLinks/jump-links.css +5 -4
  72. package/components/JumpLinks/jump-links.scss +6 -2
  73. package/components/Label/label-group.css +2 -2
  74. package/components/Label/label-group.scss +2 -2
  75. package/components/Label/label.css +4 -3
  76. package/components/Login/login.css +51 -37
  77. package/components/Masthead/masthead.css +70 -16
  78. package/components/Masthead/masthead.scss +54 -1
  79. package/components/Menu/menu.css +23 -14
  80. package/components/MenuToggle/menu-toggle.css +5 -1
  81. package/components/MenuToggle/menu-toggle.scss +6 -1
  82. package/components/ModalBox/modal-box.css +9 -7
  83. package/components/ModalBox/modal-box.scss +2 -2
  84. package/components/Nav/nav.css +74 -11
  85. package/components/Nav/nav.scss +77 -5
  86. package/components/NotificationDrawer/notification-drawer.css +19 -9
  87. package/components/NotificationDrawer/notification-drawer.scss +14 -5
  88. package/components/Page/page.css +55 -29
  89. package/components/Page/page.scss +44 -5
  90. package/components/Pagination/pagination.scss +5 -1
  91. package/components/ProgressStepper/progress-stepper.scss +5 -1
  92. package/components/Sidebar/sidebar.css +1 -1
  93. package/components/Sidebar/sidebar.scss +7 -3
  94. package/components/Skeleton/skeleton.css +16 -15
  95. package/components/Slider/slider.css +32 -18
  96. package/components/Switch/switch.css +4 -2
  97. package/components/Switch/switch.scss +1 -1
  98. package/components/Table/table-grid.css +28 -36
  99. package/components/Table/table-grid.scss +4 -4
  100. package/components/Table/table-tree-view.css +4 -2
  101. package/components/Table/table.css +33 -29
  102. package/components/Table/table.scss +2 -2
  103. package/components/Tabs/tabs.css +35 -18
  104. package/components/Tabs/tabs.scss +35 -7
  105. package/components/TextInputGroup/text-input-group.css +2 -2
  106. package/components/TextInputGroup/text-input-group.scss +2 -2
  107. package/components/ToggleGroup/toggle-group.css +34 -17
  108. package/components/ToggleGroup/toggle-group.scss +36 -20
  109. package/components/Toolbar/toolbar.css +47 -15
  110. package/components/Toolbar/toolbar.scss +34 -6
  111. package/components/TreeView/tree-view.css +45 -14
  112. package/components/TreeView/tree-view.scss +32 -1
  113. package/components/Wizard/wizard.css +21 -17
  114. package/components/Wizard/wizard.scss +4 -4
  115. package/components/_index.css +1602 -676
  116. package/components/_index.scss +3 -1
  117. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -1
  118. package/docs/components/Accordion/examples/Accordion.md +390 -30
  119. package/docs/components/ActionList/examples/ActionList.md +143 -11
  120. package/docs/components/Alert/examples/Alert.md +678 -54
  121. package/docs/components/Avatar/examples/Avatar.md +4 -4
  122. package/docs/components/BackToTop/examples/BackToTop.md +13 -1
  123. package/docs/components/Banner/examples/Banner.md +65 -5
  124. package/docs/components/Brand/examples/Brand.md +2 -2
  125. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -23
  126. package/docs/components/Button/examples/Button.md +2217 -241
  127. package/docs/components/CalendarMonth/examples/CalendarMonth.md +104 -8
  128. package/docs/components/Card/examples/Card.md +206 -4
  129. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +286 -22
  130. package/docs/components/CodeBlock/examples/CodeBlock.md +104 -8
  131. package/docs/components/CodeEditor/examples/CodeEditor.md +195 -15
  132. package/docs/components/Compass/examples/Compass.css +17 -0
  133. package/docs/components/Compass/examples/Compass.md +119 -0
  134. package/docs/components/DataList/examples/DataList.md +405 -205
  135. package/docs/components/DatePicker/examples/DatePicker.md +78 -6
  136. package/docs/components/DescriptionList/examples/DescriptionList.md +327 -27
  137. package/docs/components/Divider/examples/Divider.md +2 -2
  138. package/docs/components/Drawer/examples/Drawer.md +353 -35
  139. package/docs/components/DualListSelector/examples/DualListSelector.md +1013 -143
  140. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  141. package/docs/components/Form/examples/Form.md +78 -6
  142. package/docs/components/Hero/examples/Hero.md +25 -0
  143. package/docs/components/Icon/examples/Icon.md +92 -8
  144. package/docs/components/InlineEdit/examples/InlineEdit.md +312 -24
  145. package/docs/components/InputGroup/examples/InputGroup.md +27 -3
  146. package/docs/components/JumpLinks/examples/JumpLinks.md +54 -6
  147. package/docs/components/Label/examples/Label.md +2834 -218
  148. package/docs/components/Login/examples/Login.md +26 -2
  149. package/docs/components/Masthead/examples/masthead.md +80 -1
  150. package/docs/components/Menu/examples/Menu.md +1458 -114
  151. package/docs/components/MenuToggle/examples/MenuToggle.md +53 -1
  152. package/docs/components/ModalBox/examples/ModalBox.md +287 -23
  153. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +156 -12
  154. package/docs/components/Nav/examples/Navigation.md +798 -58
  155. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +598 -46
  156. package/docs/components/OverflowMenu/examples/overflow-menu.md +78 -6
  157. package/docs/components/Page/examples/Page.md +51 -2
  158. package/docs/components/Pagination/examples/Pagination.md +627 -51
  159. package/docs/components/Popover/examples/Popover.md +286 -22
  160. package/docs/components/ProgressStepper/examples/ProgressStepper.md +275 -23
  161. package/docs/components/Sidebar/examples/Sidebar.md +1 -1
  162. package/docs/components/Slider/examples/Slider.md +52 -4
  163. package/docs/components/Table/examples/Table.md +875 -70
  164. package/docs/components/Tabs/examples/Tabs.md +4127 -320
  165. package/docs/components/TextInputGroup/examples/TextInputGroup.md +600 -48
  166. package/docs/components/ToggleGroup/examples/toggle-group.md +195 -15
  167. package/docs/components/Toolbar/examples/Toolbar.md +490 -42
  168. package/docs/components/TreeView/examples/TreeView.md +1390 -130
  169. package/docs/components/Wizard/examples/Wizard.md +492 -72
  170. package/docs/demos/AboutModal/examples/AboutModal.md +57 -9
  171. package/docs/demos/Alert/examples/Alert.md +236 -32
  172. package/docs/demos/BackToTop/examples/BackToTop.md +57 -9
  173. package/docs/demos/Banner/examples/Banner.md +88 -16
  174. package/docs/demos/Button/examples/Button.md +13 -1
  175. package/docs/demos/Card/examples/Card.md +399 -42
  176. package/docs/demos/CardView/examples/CardView.md +161 -17
  177. package/docs/demos/Compass/examples/Compass.md +6836 -0
  178. package/docs/demos/Dashboard/examples/Dashboard.md +173 -26
  179. package/docs/demos/DataList/examples/DataList.md +566 -65
  180. package/docs/demos/DescriptionList/examples/DescriptionList.md +156 -27
  181. package/docs/demos/Drawer/examples/Drawer.md +216 -45
  182. package/docs/demos/Form/examples/BasicForms.md +273 -21
  183. package/docs/demos/JumpLinks/examples/JumpLinks.md +272 -59
  184. package/docs/demos/Masthead/examples/Masthead.md +458 -89
  185. package/docs/demos/Modal/examples/Modal.md +342 -57
  186. package/docs/demos/Nav/examples/Nav.md +660 -87
  187. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1088 -140
  188. package/docs/demos/Page/examples/Page.md +618 -123
  189. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  190. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +52 -4
  191. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +691 -113
  192. package/docs/demos/Skeleton/examples/Skeleton.md +44 -8
  193. package/docs/demos/Table/examples/Table.md +3924 -256
  194. package/docs/demos/Tabs/examples/Tabs.md +407 -65
  195. package/docs/demos/Toolbar/examples/Toolbar.md +502 -52
  196. package/docs/demos/Wizard/examples/Wizard.md +796 -130
  197. package/docs/layouts/Bullseye/examples/Bullseye.css +2 -2
  198. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -1
  199. package/docs/layouts/Flex/examples/Flex.css +3 -3
  200. package/docs/layouts/Flex/examples/Flex.md +3 -2
  201. package/docs/layouts/Gallery/examples/Gallery.css +2 -2
  202. package/docs/layouts/Gallery/examples/Gallery.md +4 -3
  203. package/docs/layouts/Grid/examples/Grid.css +1 -1
  204. package/docs/layouts/Grid/examples/Grid.md +6 -5
  205. package/docs/layouts/Level/examples/Level.css +3 -3
  206. package/docs/layouts/Level/examples/Level.md +2 -1
  207. package/docs/layouts/Split/examples/Split.css +1 -1
  208. package/docs/layouts/Split/examples/Split.md +2 -1
  209. package/docs/layouts/Stack/examples/Stack.css +3 -3
  210. package/docs/layouts/Stack/examples/Stack.md +2 -1
  211. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -2
  212. package/docs/utilities/Alignment/examples/Alignment.css +4 -4
  213. package/docs/utilities/Alignment/examples/Alignment.md +3 -2
  214. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +5 -4
  215. package/docs/utilities/BoxShadow/examples/box-shadow.css +2 -2
  216. package/docs/utilities/BoxShadow/examples/box-shadow.md +2 -1
  217. package/docs/utilities/Display/examples/Display.css +1 -1
  218. package/docs/utilities/Display/examples/Display.md +3 -2
  219. package/docs/utilities/Flex/examples/Flex.css +7 -7
  220. package/docs/utilities/Flex/examples/Flex.md +3 -2
  221. package/docs/utilities/Float/examples/Float.css +2 -2
  222. package/docs/utilities/Float/examples/Float.md +3 -2
  223. package/docs/utilities/Sizing/examples/Sizing.md +8 -7
  224. package/docs/utilities/Spacing/examples/Spacing.css +2 -2
  225. package/docs/utilities/Spacing/examples/Spacing.md +3 -2
  226. package/docs/utilities/Text/examples/Text.md +5 -4
  227. package/icons/PfIcons/add-circle-o.svg +4 -0
  228. package/icons/PfIcons/ansible-tower.svg +4 -0
  229. package/icons/PfIcons/applications.svg +4 -0
  230. package/icons/PfIcons/arrow.svg +4 -0
  231. package/icons/PfIcons/asleep.svg +4 -0
  232. package/icons/PfIcons/attention-bell.svg +4 -0
  233. package/icons/PfIcons/automation.svg +4 -0
  234. package/icons/PfIcons/bell.svg +4 -0
  235. package/icons/PfIcons/blueprint.svg +4 -0
  236. package/icons/PfIcons/build.svg +4 -0
  237. package/icons/PfIcons/builder-image.svg +4 -0
  238. package/icons/PfIcons/bundle.svg +4 -0
  239. package/icons/PfIcons/catalog.svg +4 -0
  240. package/icons/PfIcons/chat.svg +4 -0
  241. package/icons/PfIcons/close.svg +4 -0
  242. package/icons/PfIcons/cloud-security.svg +4 -0
  243. package/icons/PfIcons/cloud-tenant.svg +4 -0
  244. package/icons/PfIcons/cluster.svg +4 -0
  245. package/icons/PfIcons/connected.svg +4 -0
  246. package/icons/PfIcons/container-node.svg +4 -0
  247. package/icons/PfIcons/cpu.svg +4 -0
  248. package/icons/PfIcons/critical-risk.svg +4 -0
  249. package/icons/PfIcons/data-processor.svg +4 -0
  250. package/icons/PfIcons/data-sink.svg +4 -0
  251. package/icons/PfIcons/data-source.svg +4 -0
  252. package/icons/PfIcons/degraded.svg +4 -0
  253. package/icons/PfIcons/disconnected.svg +4 -0
  254. package/icons/PfIcons/domain.svg +4 -0
  255. package/icons/PfIcons/edit.svg +4 -0
  256. package/icons/PfIcons/enhancement.svg +4 -0
  257. package/icons/PfIcons/enterprise.svg +4 -0
  258. package/icons/PfIcons/equalizer.svg +4 -0
  259. package/icons/PfIcons/error-circle-o.svg +4 -0
  260. package/icons/PfIcons/export.svg +4 -0
  261. package/icons/PfIcons/filter.svg +4 -0
  262. package/icons/PfIcons/flavor.svg +4 -0
  263. package/icons/PfIcons/folder-close.svg +4 -0
  264. package/icons/PfIcons/folder-open.svg +4 -0
  265. package/icons/PfIcons/globe-route.svg +4 -0
  266. package/icons/PfIcons/help.svg +4 -0
  267. package/icons/PfIcons/history.svg +4 -0
  268. package/icons/PfIcons/home.svg +4 -0
  269. package/icons/PfIcons/import.svg +4 -0
  270. package/icons/PfIcons/in-progress.svg +4 -0
  271. package/icons/PfIcons/info.svg +4 -0
  272. package/icons/PfIcons/infrastructure.svg +4 -0
  273. package/icons/PfIcons/integration.svg +4 -0
  274. package/icons/PfIcons/key.svg +4 -0
  275. package/icons/PfIcons/locked.svg +4 -0
  276. package/icons/PfIcons/maintenance.svg +4 -0
  277. package/icons/PfIcons/memory.svg +4 -0
  278. package/icons/PfIcons/messages.svg +4 -0
  279. package/icons/PfIcons/middleware.svg +4 -0
  280. package/icons/PfIcons/migration.svg +4 -0
  281. package/icons/PfIcons/module.svg +4 -0
  282. package/icons/PfIcons/monitoring.svg +4 -0
  283. package/icons/PfIcons/multicluster.svg +4 -0
  284. package/icons/PfIcons/namespaces.svg +4 -0
  285. package/icons/PfIcons/network.svg +4 -0
  286. package/icons/PfIcons/new-process.svg +4 -0
  287. package/icons/PfIcons/not-started.svg +4 -0
  288. package/icons/PfIcons/off.svg +4 -0
  289. package/icons/PfIcons/ok.svg +4 -0
  290. package/icons/PfIcons/on-running.svg +4 -0
  291. package/icons/PfIcons/on.svg +4 -0
  292. package/icons/PfIcons/open-drawer-right.svg +4 -0
  293. package/icons/PfIcons/openshift.svg +4 -0
  294. package/icons/PfIcons/openstack.svg +4 -0
  295. package/icons/PfIcons/optimize.svg +4 -0
  296. package/icons/PfIcons/orders.svg +4 -0
  297. package/icons/PfIcons/os-image.svg +4 -0
  298. package/icons/PfIcons/package.svg +4 -0
  299. package/icons/PfIcons/panel-close.svg +4 -0
  300. package/icons/PfIcons/panel-open.svg +4 -0
  301. package/icons/PfIcons/paused.svg +4 -0
  302. package/icons/PfIcons/pending.svg +4 -0
  303. package/icons/PfIcons/pficon-dragdrop.svg +4 -0
  304. package/icons/PfIcons/pficon-history.svg +4 -0
  305. package/icons/PfIcons/pficon-network-range.svg +4 -0
  306. package/icons/PfIcons/pficon-satellite.svg +4 -0
  307. package/icons/PfIcons/pficon-sort-common-asc.svg +4 -0
  308. package/icons/PfIcons/pficon-sort-common-desc.svg +4 -0
  309. package/icons/PfIcons/pficon-template.svg +4 -0
  310. package/icons/PfIcons/pficon-vcenter.svg +4 -0
  311. package/icons/PfIcons/plugged.svg +4 -0
  312. package/icons/PfIcons/port.svg +4 -0
  313. package/icons/PfIcons/print.svg +4 -0
  314. package/icons/PfIcons/private.svg +4 -0
  315. package/icons/PfIcons/process-automation.svg +4 -0
  316. package/icons/PfIcons/project.svg +4 -0
  317. package/icons/PfIcons/rebalance.svg +4 -0
  318. package/icons/PfIcons/rebooting.svg +4 -0
  319. package/icons/PfIcons/regions.svg +4 -0
  320. package/icons/PfIcons/registry.svg +4 -0
  321. package/icons/PfIcons/remove2.svg +4 -0
  322. package/icons/PfIcons/replicator.svg +4 -0
  323. package/icons/PfIcons/repository.svg +4 -0
  324. package/icons/PfIcons/resource-pool.svg +4 -0
  325. package/icons/PfIcons/resources-almost-empty.svg +4 -0
  326. package/icons/PfIcons/resources-almost-full.svg +4 -0
  327. package/icons/PfIcons/resources-empty.svg +4 -0
  328. package/icons/PfIcons/resources-full.svg +4 -0
  329. package/icons/PfIcons/running.svg +4 -0
  330. package/icons/PfIcons/save.svg +4 -0
  331. package/icons/PfIcons/screen.svg +4 -0
  332. package/icons/PfIcons/security.svg +4 -0
  333. package/icons/PfIcons/server-group.svg +4 -0
  334. package/icons/PfIcons/server.svg +4 -0
  335. package/icons/PfIcons/service-catalog.svg +4 -0
  336. package/icons/PfIcons/service.svg +4 -0
  337. package/icons/PfIcons/services.svg +4 -0
  338. package/icons/PfIcons/severity-critical.svg +4 -0
  339. package/icons/PfIcons/severity-important.svg +4 -0
  340. package/icons/PfIcons/severity-minor.svg +4 -0
  341. package/icons/PfIcons/severity-moderate.svg +4 -0
  342. package/icons/PfIcons/severity-none.svg +4 -0
  343. package/icons/PfIcons/severity-undefined.svg +4 -0
  344. package/icons/PfIcons/spinner.svg +4 -0
  345. package/icons/PfIcons/spinner2.svg +4 -0
  346. package/icons/PfIcons/storage-domain.svg +4 -0
  347. package/icons/PfIcons/task.svg +4 -0
  348. package/icons/PfIcons/tenant.svg +4 -0
  349. package/icons/PfIcons/thumb-tack.svg +4 -0
  350. package/icons/PfIcons/topology.svg +4 -0
  351. package/icons/PfIcons/treeview.svg +4 -0
  352. package/icons/PfIcons/trend-down.svg +4 -0
  353. package/icons/PfIcons/trend-up.svg +4 -0
  354. package/icons/PfIcons/unknown.svg +4 -0
  355. package/icons/PfIcons/unlocked.svg +4 -0
  356. package/icons/PfIcons/unplugged.svg +4 -0
  357. package/icons/PfIcons/user.svg +4 -0
  358. package/icons/PfIcons/users.svg +4 -0
  359. package/icons/PfIcons/virtual-machine.svg +4 -0
  360. package/icons/PfIcons/volume.svg +4 -0
  361. package/icons/PfIcons/warning-triangle.svg +4 -0
  362. package/icons/PfIcons/zone.svg +4 -0
  363. package/layouts/Flex/flex.scss +83 -19
  364. package/layouts/Gallery/gallery.css +6 -2
  365. package/layouts/_index.css +6 -2
  366. package/package.json +34 -16
  367. package/patternfly-base-no-globals.css +406 -14
  368. package/patternfly-base.css +413 -14
  369. package/patternfly-charts.css +3 -3
  370. package/patternfly-no-globals.css +1947 -625
  371. package/patternfly.css +1954 -625
  372. package/patternfly.min.css +1 -1
  373. package/patternfly.min.css.map +1 -1
  374. package/sass-utilities/functions.scss +32 -25
  375. package/sass-utilities/mixins.scss +36 -20
  376. package/sass-utilities/namespaces-components.scss +6 -0
package/docs/demos/Form/examples/BasicForms.md CHANGED
@@ -820,7 +820,19 @@ subsection: forms
820
820
  aria-label="Remove"
821
821
  >
822
822
  <span class="pf-v6-c-button__icon">
823
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
823
+ <svg
824
+ class="pf-v6-svg"
825
+ viewBox="0 0 512 512"
826
+ fill="currentColor"
827
+ aria-hidden="true"
828
+ role="img"
829
+ width="1em"
830
+ height="1em"
831
+ >
832
+ <path
833
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zM124 296c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h264c6.6 0 12 5.4 12 12v56c0 6.6-5.4 12-12 12H124z"
834
+ />
835
+ </svg>
824
836
  </span>
825
837
  </button>
826
838
  </div>
@@ -844,7 +856,19 @@ subsection: forms
844
856
  aria-label="Remove"
845
857
  >
846
858
  <span class="pf-v6-c-button__icon">
847
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
859
+ <svg
860
+ class="pf-v6-svg"
861
+ viewBox="0 0 512 512"
862
+ fill="currentColor"
863
+ aria-hidden="true"
864
+ role="img"
865
+ width="1em"
866
+ height="1em"
867
+ >
868
+ <path
869
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zM124 296c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h264c6.6 0 12 5.4 12 12v56c0 6.6-5.4 12-12 12H124z"
870
+ />
871
+ </svg>
848
872
  </span>
849
873
  </button>
850
874
  </div>
@@ -868,14 +892,38 @@ subsection: forms
868
892
  aria-label="Remove"
869
893
  >
870
894
  <span class="pf-v6-c-button__icon">
871
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
895
+ <svg
896
+ class="pf-v6-svg"
897
+ viewBox="0 0 512 512"
898
+ fill="currentColor"
899
+ aria-hidden="true"
900
+ role="img"
901
+ width="1em"
902
+ height="1em"
903
+ >
904
+ <path
905
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zM124 296c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h264c6.6 0 12 5.4 12 12v56c0 6.6-5.4 12-12 12H124z"
906
+ />
907
+ </svg>
872
908
  </span>
873
909
  </button>
874
910
  </div>
875
911
  </div>
876
912
  <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
877
913
  <span class="pf-v6-c-button__icon pf-m-start">
878
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
914
+ <svg
915
+ class="pf-v6-svg"
916
+ viewBox="0 0 512 512"
917
+ fill="currentColor"
918
+ aria-hidden="true"
919
+ role="img"
920
+ width="1em"
921
+ height="1em"
922
+ >
923
+ <path
924
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm144 276c0 6.6-5.4 12-12 12h-92v92c0 6.6-5.4 12-12 12h-56c-6.6 0-12-5.4-12-12v-92h-92c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h92v-92c0-6.6 5.4-12 12-12h56c6.6 0 12 5.4 12 12v92h92c6.6 0 12 5.4 12 12v56z"
925
+ />
926
+ </svg>
879
927
  </span>
880
928
  <span class="pf-v6-c-button__text">Add valid redirect URI</span>
881
929
  </button>
@@ -1039,7 +1087,19 @@ subsection: forms
1039
1087
  aria-labelledby="-label-1-button -label-1-text"
1040
1088
  >
1041
1089
  <span class="pf-v6-c-button__icon">
1042
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1090
+ <svg
1091
+ class="pf-v6-svg"
1092
+ viewBox="0 0 20 20"
1093
+ fill="currentColor"
1094
+ aria-hidden="true"
1095
+ role="img"
1096
+ width="1em"
1097
+ height="1em"
1098
+ >
1099
+ <path
1100
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
1101
+ />
1102
+ </svg>
1043
1103
  </span>
1044
1104
  </button>
1045
1105
  </span>
@@ -1062,7 +1122,19 @@ subsection: forms
1062
1122
  aria-labelledby="-label-2-button -label-2-text"
1063
1123
  >
1064
1124
  <span class="pf-v6-c-button__icon">
1065
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1125
+ <svg
1126
+ class="pf-v6-svg"
1127
+ viewBox="0 0 20 20"
1128
+ fill="currentColor"
1129
+ aria-hidden="true"
1130
+ role="img"
1131
+ width="1em"
1132
+ height="1em"
1133
+ >
1134
+ <path
1135
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
1136
+ />
1137
+ </svg>
1066
1138
  </span>
1067
1139
  </button>
1068
1140
  </span>
@@ -1108,7 +1180,19 @@ subsection: forms
1108
1180
  >
1109
1181
  <span class="pf-v6-c-button__icon">
1110
1182
  <span class="pf-v6-c-form__field-group-toggle-icon">
1111
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1183
+ <svg
1184
+ class="pf-v6-svg"
1185
+ viewBox="0 0 20 20"
1186
+ fill="currentColor"
1187
+ aria-hidden="true"
1188
+ role="img"
1189
+ width="1em"
1190
+ height="1em"
1191
+ >
1192
+ <path
1193
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1194
+ />
1195
+ </svg>
1112
1196
  </span>
1113
1197
  </span>
1114
1198
  </button>
@@ -1146,7 +1230,19 @@ subsection: forms
1146
1230
  >
1147
1231
  <span class="pf-v6-c-button__icon">
1148
1232
  <span class="pf-v6-c-form__field-group-toggle-icon">
1149
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1233
+ <svg
1234
+ class="pf-v6-svg"
1235
+ viewBox="0 0 20 20"
1236
+ fill="currentColor"
1237
+ aria-hidden="true"
1238
+ role="img"
1239
+ width="1em"
1240
+ height="1em"
1241
+ >
1242
+ <path
1243
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1244
+ />
1245
+ </svg>
1150
1246
  </span>
1151
1247
  </span>
1152
1248
  </button>
@@ -1184,7 +1280,19 @@ subsection: forms
1184
1280
  >
1185
1281
  <span class="pf-v6-c-button__icon">
1186
1282
  <span class="pf-v6-c-form__field-group-toggle-icon">
1187
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1283
+ <svg
1284
+ class="pf-v6-svg"
1285
+ viewBox="0 0 20 20"
1286
+ fill="currentColor"
1287
+ aria-hidden="true"
1288
+ role="img"
1289
+ width="1em"
1290
+ height="1em"
1291
+ >
1292
+ <path
1293
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1294
+ />
1295
+ </svg>
1188
1296
  </span>
1189
1297
  </span>
1190
1298
  </button>
@@ -1221,7 +1329,19 @@ subsection: forms
1221
1329
  >
1222
1330
  <span class="pf-v6-c-button__icon">
1223
1331
  <span class="pf-v6-c-form__field-group-toggle-icon">
1224
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1332
+ <svg
1333
+ class="pf-v6-svg"
1334
+ viewBox="0 0 20 20"
1335
+ fill="currentColor"
1336
+ aria-hidden="true"
1337
+ role="img"
1338
+ width="1em"
1339
+ height="1em"
1340
+ >
1341
+ <path
1342
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1343
+ />
1344
+ </svg>
1225
1345
  </span>
1226
1346
  </span>
1227
1347
  </button>
@@ -1258,7 +1378,19 @@ subsection: forms
1258
1378
  >
1259
1379
  <span class="pf-v6-c-button__icon">
1260
1380
  <span class="pf-v6-c-form__field-group-toggle-icon">
1261
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1381
+ <svg
1382
+ class="pf-v6-svg"
1383
+ viewBox="0 0 20 20"
1384
+ fill="currentColor"
1385
+ aria-hidden="true"
1386
+ role="img"
1387
+ width="1em"
1388
+ height="1em"
1389
+ >
1390
+ <path
1391
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1392
+ />
1393
+ </svg>
1262
1394
  </span>
1263
1395
  </span>
1264
1396
  </button>
@@ -1296,7 +1428,19 @@ subsection: forms
1296
1428
  >
1297
1429
  <span class="pf-v6-c-button__icon">
1298
1430
  <span class="pf-v6-c-form__field-group-toggle-icon">
1299
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1431
+ <svg
1432
+ class="pf-v6-svg"
1433
+ viewBox="0 0 20 20"
1434
+ fill="currentColor"
1435
+ aria-hidden="true"
1436
+ role="img"
1437
+ width="1em"
1438
+ height="1em"
1439
+ >
1440
+ <path
1441
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1442
+ />
1443
+ </svg>
1300
1444
  </span>
1301
1445
  </span>
1302
1446
  </button>
@@ -1351,7 +1495,19 @@ subsection: forms
1351
1495
  aria-label="Remove"
1352
1496
  >
1353
1497
  <span class="pf-v6-c-button__icon">
1354
- <i class="fas fa-minus-circle" aria-hidden="true"></i>
1498
+ <svg
1499
+ class="pf-v6-svg"
1500
+ viewBox="0 0 512 512"
1501
+ fill="currentColor"
1502
+ aria-hidden="true"
1503
+ role="img"
1504
+ width="1em"
1505
+ height="1em"
1506
+ >
1507
+ <path
1508
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zM124 296c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h264c6.6 0 12 5.4 12 12v56c0 6.6-5.4 12-12 12H124z"
1509
+ />
1510
+ </svg>
1355
1511
  </span>
1356
1512
  </button>
1357
1513
  </div>
@@ -1361,7 +1517,19 @@ subsection: forms
1361
1517
  type="button"
1362
1518
  >
1363
1519
  <span class="pf-v6-c-button__icon pf-m-start">
1364
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1520
+ <svg
1521
+ class="pf-v6-svg"
1522
+ viewBox="0 0 512 512"
1523
+ fill="currentColor"
1524
+ aria-hidden="true"
1525
+ role="img"
1526
+ width="1em"
1527
+ height="1em"
1528
+ >
1529
+ <path
1530
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm144 276c0 6.6-5.4 12-12 12h-92v92c0 6.6-5.4 12-12 12h-56c-6.6 0-12-5.4-12-12v-92h-92c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h92v-92c0-6.6 5.4-12 12-12h56c6.6 0 12 5.4 12 12v92h92c6.6 0 12 5.4 12 12v56z"
1531
+ />
1532
+ </svg>
1365
1533
  </span>
1366
1534
  <span class="pf-v6-c-button__text">Add valid redirect URI</span>
1367
1535
  </button>
@@ -1390,7 +1558,19 @@ subsection: forms
1390
1558
  >
1391
1559
  <span class="pf-v6-c-button__icon">
1392
1560
  <span class="pf-v6-c-form__field-group-toggle-icon">
1393
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1561
+ <svg
1562
+ class="pf-v6-svg"
1563
+ viewBox="0 0 20 20"
1564
+ fill="currentColor"
1565
+ aria-hidden="true"
1566
+ role="img"
1567
+ width="1em"
1568
+ height="1em"
1569
+ >
1570
+ <path
1571
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1572
+ />
1573
+ </svg>
1394
1574
  </span>
1395
1575
  </span>
1396
1576
  </button>
@@ -1430,7 +1610,19 @@ subsection: forms
1430
1610
  >
1431
1611
  <span class="pf-v6-c-button__icon">
1432
1612
  <span class="pf-v6-c-form__field-group-toggle-icon">
1433
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1613
+ <svg
1614
+ class="pf-v6-svg"
1615
+ viewBox="0 0 20 20"
1616
+ fill="currentColor"
1617
+ aria-hidden="true"
1618
+ role="img"
1619
+ width="1em"
1620
+ height="1em"
1621
+ >
1622
+ <path
1623
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1624
+ />
1625
+ </svg>
1434
1626
  </span>
1435
1627
  </span>
1436
1628
  </button>
@@ -1604,7 +1796,19 @@ subsection: forms
1604
1796
  >
1605
1797
  <span class="pf-v6-c-button__icon">
1606
1798
  <span class="pf-v6-c-form__field-group-toggle-icon">
1607
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1799
+ <svg
1800
+ class="pf-v6-svg"
1801
+ viewBox="0 0 20 20"
1802
+ fill="currentColor"
1803
+ aria-hidden="true"
1804
+ role="img"
1805
+ width="1em"
1806
+ height="1em"
1807
+ >
1808
+ <path
1809
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1810
+ />
1811
+ </svg>
1608
1812
  </span>
1609
1813
  </span>
1610
1814
  </button>
@@ -1647,7 +1851,19 @@ subsection: forms
1647
1851
  type="button"
1648
1852
  >
1649
1853
  <span class="pf-v6-c-button__icon pf-m-start">
1650
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1854
+ <svg
1855
+ class="pf-v6-svg"
1856
+ viewBox="0 0 512 512"
1857
+ fill="currentColor"
1858
+ aria-hidden="true"
1859
+ role="img"
1860
+ width="1em"
1861
+ height="1em"
1862
+ >
1863
+ <path
1864
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm144 276c0 6.6-5.4 12-12 12h-92v92c0 6.6-5.4 12-12 12h-56c-6.6 0-12-5.4-12-12v-92h-92c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h92v-92c0-6.6 5.4-12 12-12h56c6.6 0 12 5.4 12 12v92h92c6.6 0 12 5.4 12 12v56z"
1865
+ />
1866
+ </svg>
1651
1867
  </span>
1652
1868
  <span class="pf-v6-c-button__text">Add liveness probe</span>
1653
1869
  </button>
@@ -1681,7 +1897,19 @@ subsection: forms
1681
1897
  type="button"
1682
1898
  >
1683
1899
  <span class="pf-v6-c-button__icon pf-m-start">
1684
- <i class="fas fa-plus-circle" aria-hidden="true"></i>
1900
+ <svg
1901
+ class="pf-v6-svg"
1902
+ viewBox="0 0 512 512"
1903
+ fill="currentColor"
1904
+ aria-hidden="true"
1905
+ role="img"
1906
+ width="1em"
1907
+ height="1em"
1908
+ >
1909
+ <path
1910
+ d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm144 276c0 6.6-5.4 12-12 12h-92v92c0 6.6-5.4 12-12 12h-56c-6.6 0-12-5.4-12-12v-92h-92c-6.6 0-12-5.4-12-12v-56c0-6.6 5.4-12 12-12h92v-92c0-6.6 5.4-12 12-12h56c6.6 0 12 5.4 12 12v92h92c6.6 0 12 5.4 12 12v56z"
1911
+ />
1912
+ </svg>
1685
1913
  </span>
1686
1914
  <span class="pf-v6-c-button__text">Add startup probe</span>
1687
1915
  </button>
@@ -1709,7 +1937,19 @@ subsection: forms
1709
1937
  >
1710
1938
  <span class="pf-v6-c-button__icon">
1711
1939
  <span class="pf-v6-c-form__field-group-toggle-icon">
1712
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1940
+ <svg
1941
+ class="pf-v6-svg"
1942
+ viewBox="0 0 20 20"
1943
+ fill="currentColor"
1944
+ aria-hidden="true"
1945
+ role="img"
1946
+ width="1em"
1947
+ height="1em"
1948
+ >
1949
+ <path
1950
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1951
+ />
1952
+ </svg>
1713
1953
  </span>
1714
1954
  </span>
1715
1955
  </button>
@@ -1749,7 +1989,19 @@ subsection: forms
1749
1989
  >
1750
1990
  <span class="pf-v6-c-button__icon">
1751
1991
  <span class="pf-v6-c-form__field-group-toggle-icon">
1752
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1992
+ <svg
1993
+ class="pf-v6-svg"
1994
+ viewBox="0 0 20 20"
1995
+ fill="currentColor"
1996
+ aria-hidden="true"
1997
+ role="img"
1998
+ width="1em"
1999
+ height="1em"
2000
+ >
2001
+ <path
2002
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2003
+ />
2004
+ </svg>
1753
2005
  </span>
1754
2006
  </span>
1755
2007
  </button>