@patternfly/patternfly 6.0.0-alpha.99 → 6.0.0-prerelease.2

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 (501) hide show
  1. package/README.md +1 -2
  2. package/assets/fontawesome/_animated.scss +1 -0
  3. package/assets/fontawesome/_bordered-pulled.scss +1 -0
  4. package/assets/fontawesome/_core.scss +2 -0
  5. package/assets/fontawesome/_fixed-width.scss +2 -0
  6. package/assets/fontawesome/_icons.scss +1 -0
  7. package/assets/fontawesome/_index.scss +12 -0
  8. package/assets/fontawesome/_larger.scss +4 -2
  9. package/assets/fontawesome/_list.scss +4 -2
  10. package/assets/fontawesome/_rotated-flipped.scss +2 -0
  11. package/assets/fontawesome/_screen-reader.scss +1 -0
  12. package/assets/fontawesome/_stacked.scss +3 -1
  13. package/assets/fontawesome/_variables.scss +3 -2
  14. package/assets/fontawesome/fontawesome.scss +12 -12
  15. package/assets/icons/iconUnicodes.json +6 -0
  16. package/assets/images/img_avatar-dark.svg +22 -16
  17. package/assets/images/img_avatar-light.svg +25 -18
  18. package/assets/images/pf-background.svg +21 -21
  19. package/assets/images/pf_logo.svg +11 -11
  20. package/assets/images/pf_logo_white.svg +16 -17
  21. package/assets/pficon/pf-v6-pficon.woff2 +0 -0
  22. package/assets/pficon/pficon.scss +310 -271
  23. package/base/_index.scss +10 -0
  24. package/base/{_globals.scss → normalize.scss} +15 -48
  25. package/base/patternfly-common.css +14 -0
  26. package/base/patternfly-common.scss +68 -2
  27. package/base/patternfly-fa-icons.css +1 -1
  28. package/base/patternfly-fa-icons.scss +35 -2
  29. package/base/patternfly-fonts.css +10 -80
  30. package/base/patternfly-fonts.scss +49 -2
  31. package/base/patternfly-pf-icons.css +158 -134
  32. package/base/patternfly-pf-icons.scss +1 -2
  33. package/base/patternfly-svg-icons.css +5 -0
  34. package/base/{_svg-icons.scss → patternfly-svg-icons.scss} +2 -0
  35. package/base/patternfly-variables.css +1082 -1206
  36. package/base/patternfly-variables.scss +20 -2
  37. package/base/reset.scss +33 -0
  38. package/base/tokens/_index.scss +6 -0
  39. package/base/tokens/tokens-charts-dark.scss +173 -0
  40. package/base/tokens/{_tokens-charts.scss → tokens-charts.scss} +162 -148
  41. package/base/tokens/{_tokens-dark.scss → tokens-dark.scss} +307 -294
  42. package/base/tokens/{_tokens-default.scss → tokens-default.scss} +574 -447
  43. package/base/tokens/{_tokens-font.scss → tokens-local.scss} +13 -34
  44. package/base/tokens/{_tokens-palette.scss → tokens-palette.scss} +69 -70
  45. package/components/AboutModalBox/about-modal-box.css +86 -81
  46. package/components/AboutModalBox/about-modal-box.scss +80 -82
  47. package/components/Accordion/accordion.css +44 -43
  48. package/components/Accordion/accordion.scss +52 -52
  49. package/components/ActionList/action-list.css +6 -5
  50. package/components/ActionList/action-list.scss +7 -5
  51. package/components/Alert/alert-group.css +72 -19
  52. package/components/Alert/alert-group.scss +105 -18
  53. package/components/Alert/alert.css +52 -59
  54. package/components/Alert/alert.scss +56 -65
  55. package/components/Avatar/avatar.css +42 -41
  56. package/components/Avatar/avatar.scss +8 -7
  57. package/components/BackToTop/back-to-top.css +19 -17
  58. package/components/BackToTop/back-to-top.scss +17 -17
  59. package/components/Backdrop/backdrop.css +1 -1
  60. package/components/Backdrop/backdrop.scss +3 -4
  61. package/components/BackgroundImage/background-image.scss +3 -4
  62. package/components/Badge/badge.css +29 -7
  63. package/components/Badge/badge.scss +33 -9
  64. package/components/Banner/banner.css +30 -37
  65. package/components/Banner/banner.scss +30 -43
  66. package/components/Brand/brand.css +14 -10
  67. package/components/Brand/brand.scss +8 -5
  68. package/components/Breadcrumb/breadcrumb.css +23 -24
  69. package/components/Breadcrumb/breadcrumb.scss +25 -28
  70. package/components/Button/button.css +150 -128
  71. package/components/Button/button.scss +155 -130
  72. package/components/CalendarMonth/calendar-month.css +46 -46
  73. package/components/CalendarMonth/calendar-month.scss +49 -50
  74. package/components/Card/card.css +110 -93
  75. package/components/Card/card.scss +118 -92
  76. package/components/Check/check.css +5 -5
  77. package/components/Check/check.scss +7 -8
  78. package/components/ClipboardCopy/clipboard-copy.css +33 -41
  79. package/components/ClipboardCopy/clipboard-copy.scss +35 -44
  80. package/components/CodeBlock/code-block.css +21 -20
  81. package/components/CodeBlock/code-block.scss +21 -21
  82. package/components/CodeEditor/code-editor.css +35 -34
  83. package/components/CodeEditor/code-editor.scss +35 -35
  84. package/components/Content/content.css +167 -153
  85. package/components/Content/content.scss +204 -145
  86. package/components/DataList/data-list-grid.css +117 -117
  87. package/components/DataList/data-list-grid.scss +22 -20
  88. package/components/DataList/data-list.css +308 -312
  89. package/components/DataList/data-list.scss +145 -152
  90. package/components/DatePicker/date-picker.css +17 -17
  91. package/components/DatePicker/date-picker.scss +17 -18
  92. package/components/DescriptionList/description-list-order.css +5 -5
  93. package/components/DescriptionList/description-list-order.scss +3 -1
  94. package/components/DescriptionList/description-list.css +46 -44
  95. package/components/DescriptionList/description-list.scss +26 -31
  96. package/components/Divider/divider.css +104 -107
  97. package/components/Divider/divider.scss +19 -19
  98. package/components/DragDrop/drag-drop.css +4 -2
  99. package/components/DragDrop/drag-drop.scss +3 -3
  100. package/components/Drawer/drawer.css +115 -114
  101. package/components/Drawer/drawer.scss +136 -134
  102. package/components/DualListSelector/dual-list-selector.css +64 -61
  103. package/components/DualListSelector/dual-list-selector.scss +54 -51
  104. package/components/EmptyState/empty-state.css +38 -37
  105. package/components/EmptyState/empty-state.scss +39 -39
  106. package/components/ExpandableSection/expandable-section.css +27 -86
  107. package/components/ExpandableSection/expandable-section.scss +32 -101
  108. package/components/FileUpload/file-upload.css +2 -2
  109. package/components/FileUpload/file-upload.scss +2 -3
  110. package/components/Form/form.css +173 -115
  111. package/components/Form/form.scss +117 -103
  112. package/components/FormControl/form-control.css +57 -57
  113. package/components/FormControl/form-control.scss +69 -67
  114. package/components/HelperText/helper-text.css +5 -4
  115. package/components/HelperText/helper-text.scss +8 -6
  116. package/components/Hint/hint.css +25 -25
  117. package/components/Hint/hint.scss +25 -27
  118. package/components/Icon/icon.css +10 -10
  119. package/components/Icon/icon.scss +11 -12
  120. package/components/InlineEdit/inline-edit.css +12 -12
  121. package/components/InlineEdit/inline-edit.scss +12 -13
  122. package/components/InputGroup/input-group.css +16 -16
  123. package/components/InputGroup/input-group.scss +18 -19
  124. package/components/JumpLinks/jump-links.css +80 -96
  125. package/components/JumpLinks/jump-links.scss +80 -100
  126. package/components/Label/label-group.css +28 -28
  127. package/components/Label/label-group.scss +29 -30
  128. package/components/Label/label.css +102 -87
  129. package/components/Label/label.scss +113 -94
  130. package/components/List/list.css +44 -47
  131. package/components/List/list.scss +51 -58
  132. package/components/Login/login.css +122 -118
  133. package/components/Login/login.scss +105 -112
  134. package/components/Masthead/masthead.css +273 -175
  135. package/components/Masthead/masthead.scss +102 -68
  136. package/components/Menu/menu.css +151 -95
  137. package/components/Menu/menu.scss +59 -40
  138. package/components/MenuToggle/menu-toggle.css +129 -108
  139. package/components/MenuToggle/menu-toggle.scss +150 -128
  140. package/components/ModalBox/modal-box.css +53 -45
  141. package/components/ModalBox/modal-box.scss +52 -46
  142. package/components/MultipleFileUpload/multiple-file-upload.css +37 -37
  143. package/components/MultipleFileUpload/multiple-file-upload.scss +38 -39
  144. package/components/Nav/nav.css +33 -9
  145. package/components/Nav/nav.scss +46 -13
  146. package/components/NotificationDrawer/notification-drawer.css +50 -51
  147. package/components/NotificationDrawer/notification-drawer.scss +58 -57
  148. package/components/NumberInput/number-input.css +7 -11
  149. package/components/NumberInput/number-input.scss +5 -7
  150. package/components/OverflowMenu/overflow-menu.css +2 -1
  151. package/components/OverflowMenu/overflow-menu.scss +3 -1
  152. package/components/Page/page.css +175 -519
  153. package/components/Page/page.scss +155 -386
  154. package/components/Pagination/pagination.css +82 -79
  155. package/components/Pagination/pagination.scss +43 -40
  156. package/components/Panel/panel.css +33 -30
  157. package/components/Panel/panel.scss +35 -33
  158. package/components/Popover/popover.css +54 -52
  159. package/components/Popover/popover.scss +55 -54
  160. package/components/Progress/progress.css +8 -4
  161. package/components/Progress/progress.scss +14 -11
  162. package/components/ProgressStepper/progress-stepper.css +246 -245
  163. package/components/ProgressStepper/progress-stepper.scss +118 -118
  164. package/components/Radio/radio.css +7 -7
  165. package/components/Radio/radio.scss +9 -10
  166. package/components/Sidebar/sidebar.css +139 -139
  167. package/components/Sidebar/sidebar.scss +61 -61
  168. package/components/SimpleList/simple-list.css +21 -20
  169. package/components/SimpleList/simple-list.scss +22 -23
  170. package/components/Skeleton/skeleton.css +4 -4
  171. package/components/Skeleton/skeleton.scss +7 -8
  172. package/components/SkipToContent/skip-to-content.css +7 -6
  173. package/components/SkipToContent/skip-to-content.scss +7 -7
  174. package/components/Slider/slider.css +31 -31
  175. package/components/Slider/slider.scss +54 -55
  176. package/components/Spinner/spinner.scss +4 -5
  177. package/components/Switch/switch.css +4 -10
  178. package/components/Switch/switch.scss +8 -17
  179. package/components/TabContent/tab-content.css +25 -25
  180. package/components/TabContent/tab-content.scss +28 -28
  181. package/components/Table/table-grid.css +434 -508
  182. package/components/Table/table-grid.scss +131 -150
  183. package/components/Table/table-scrollable.css +31 -34
  184. package/components/Table/table-scrollable.scss +44 -41
  185. package/components/Table/table-tree-view.css +287 -279
  186. package/components/Table/table-tree-view.scss +84 -84
  187. package/components/Table/table.css +316 -279
  188. package/components/Table/table.scss +346 -301
  189. package/components/Tabs/tabs.css +215 -240
  190. package/components/Tabs/tabs.scss +130 -162
  191. package/components/TextInputGroup/text-input-group.css +122 -64
  192. package/components/TextInputGroup/text-input-group.scss +144 -87
  193. package/components/Tile/tile.css +15 -15
  194. package/components/Tile/tile.scss +16 -17
  195. package/components/Timestamp/timestamp.css +13 -19
  196. package/components/Timestamp/timestamp.scss +16 -22
  197. package/components/Title/title.css +14 -13
  198. package/components/Title/title.scss +15 -15
  199. package/components/ToggleGroup/toggle-group.css +37 -37
  200. package/components/ToggleGroup/toggle-group.scss +38 -41
  201. package/components/Toolbar/toolbar.css +547 -1431
  202. package/components/Toolbar/toolbar.scss +159 -123
  203. package/components/Tooltip/tooltip.css +28 -27
  204. package/components/Tooltip/tooltip.scss +31 -30
  205. package/components/TreeView/tree-view.css +184 -184
  206. package/components/TreeView/tree-view.scss +133 -133
  207. package/components/Truncate/truncate.css +2 -2
  208. package/components/Truncate/truncate.scss +7 -8
  209. package/components/Wizard/wizard.css +190 -154
  210. package/components/Wizard/wizard.scss +211 -165
  211. package/components/_index.css +22378 -0
  212. package/components/_index.scss +82 -0
  213. package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
  214. package/docs/components/Accordion/examples/Accordion.md +1 -1
  215. package/docs/components/ActionList/examples/ActionList.md +64 -24
  216. package/docs/components/Alert/examples/Alert.md +116 -74
  217. package/docs/components/BackToTop/examples/BackToTop.md +1 -1
  218. package/docs/components/Badge/examples/Badge.md +6 -16
  219. package/docs/components/Banner/examples/Banner.md +16 -10
  220. package/docs/components/Brand/examples/Brand.md +2 -2
  221. package/docs/components/Breadcrumb/examples/Breadcrumb.md +19 -59
  222. package/docs/components/Button/examples/Button.md +537 -368
  223. package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
  224. package/docs/components/Card/examples/Card.md +372 -658
  225. package/docs/components/Check/examples/Check.md +10 -15
  226. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +92 -47
  227. package/docs/components/CodeBlock/examples/CodeBlock.md +51 -28
  228. package/docs/components/CodeEditor/examples/CodeEditor.md +41 -22
  229. package/docs/components/Content/examples/Content.md +600 -60
  230. package/docs/components/DataList/examples/DataList.md +291 -1028
  231. package/docs/components/DatePicker/examples/DatePicker.md +18 -6
  232. package/docs/components/DescriptionList/examples/DescriptionList.md +80 -55
  233. package/docs/components/Drawer/examples/Drawer.md +60 -21
  234. package/docs/components/DualListSelector/examples/DualListSelector.md +364 -996
  235. package/docs/components/EmptyState/examples/EmptyState.md +123 -53
  236. package/docs/components/ExpandableSection/examples/ExpandableSection.md +96 -91
  237. package/docs/components/FileUpload/examples/FileUpload.md +42 -14
  238. package/docs/components/Form/examples/Form.md +100 -26
  239. package/docs/components/Hint/examples/Hint.md +54 -164
  240. package/docs/components/InlineEdit/examples/InlineEdit.md +132 -45
  241. package/docs/components/InputGroup/examples/InputGroup.md +38 -62
  242. package/docs/components/JumpLinks/examples/JumpLinks.md +189 -72
  243. package/docs/components/Label/examples/Label.md +2577 -406
  244. package/docs/components/Login/examples/Login.md +372 -334
  245. package/docs/components/Masthead/examples/masthead.md +515 -484
  246. package/docs/components/Menu/examples/Menu.md +77 -138
  247. package/docs/components/MenuToggle/examples/MenuToggle.md +289 -39
  248. package/docs/components/ModalBox/examples/ModalBox.md +158 -100
  249. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +137 -97
  250. package/docs/components/Nav/examples/Navigation.css +2 -7
  251. package/docs/components/Nav/examples/Navigation.md +337 -270
  252. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +515 -2076
  253. package/docs/components/NumberInput/examples/NumberInput.md +96 -48
  254. package/docs/components/OverflowMenu/examples/overflow-menu.css +4 -28
  255. package/docs/components/OverflowMenu/examples/overflow-menu.md +104 -159
  256. package/docs/components/Page/examples/Page.css +5 -9
  257. package/docs/components/Page/examples/Page.md +254 -181
  258. package/docs/components/Pagination/examples/Pagination.md +336 -756
  259. package/docs/components/Panel/examples/Panel.md +3 -2
  260. package/docs/components/Popover/examples/Popover.md +60 -15
  261. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -15
  262. package/docs/components/Sidebar/examples/Sidebar.css +4 -2
  263. package/docs/components/Sidebar/examples/Sidebar.md +3 -3
  264. package/docs/components/Skeleton/examples/Skeleton.css +1 -1
  265. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
  266. package/docs/components/Slider/examples/Slider.md +53 -45
  267. package/docs/components/Spinner/examples/Spinner.md +1 -1
  268. package/docs/components/Switch/examples/Switch.md +33 -148
  269. package/docs/components/Table/examples/Table.css +11 -6
  270. package/docs/components/Table/examples/Table.md +5302 -2464
  271. package/docs/components/Tabs/examples/Tabs.md +1267 -607
  272. package/docs/components/TextInputGroup/examples/TextInputGroup.css +8 -3
  273. package/docs/components/TextInputGroup/examples/TextInputGroup.md +469 -278
  274. package/docs/components/Tile/examples/Tile.css +5 -5
  275. package/docs/components/Timestamp/examples/Timestamp.md +7 -1
  276. package/docs/components/ToggleGroup/examples/toggle-group.md +1 -3
  277. package/docs/components/Toolbar/examples/Toolbar.css +50 -39
  278. package/docs/components/Toolbar/examples/Toolbar.md +1562 -1200
  279. package/docs/components/Tooltip/examples/Tooltip.css +1 -1
  280. package/docs/components/TreeView/examples/TreeView.md +627 -49
  281. package/docs/components/Truncate/examples/Truncate.css +1 -2
  282. package/docs/components/Wizard/examples/Wizard.md +1595 -126
  283. package/docs/demos/AboutModal/examples/AboutModal.md +191 -198
  284. package/docs/demos/Alert/examples/Alert.md +924 -909
  285. package/docs/demos/BackToTop/examples/BackToTop.md +318 -327
  286. package/docs/demos/Banner/examples/Banner.md +641 -659
  287. package/docs/demos/Button/examples/Button.md +8 -8
  288. package/docs/demos/Card/examples/Card.css +6 -6
  289. package/docs/demos/Card/examples/Card.md +419 -606
  290. package/docs/demos/CardView/examples/CardView.md +822 -1435
  291. package/docs/demos/Dashboard/examples/Dashboard.md +1308 -1442
  292. package/docs/demos/DataList/examples/DataList.md +3210 -3424
  293. package/docs/demos/DescriptionList/examples/DescriptionList.md +899 -937
  294. package/docs/demos/Drawer/examples/Drawer.md +1165 -1176
  295. package/docs/demos/Form/examples/BasicForms.md +153 -88
  296. package/docs/demos/JumpLinks/examples/JumpLinks.md +1710 -1602
  297. package/docs/demos/Masthead/examples/Masthead.md +1719 -1583
  298. package/docs/demos/Modal/examples/Modal.md +1231 -1235
  299. package/docs/demos/Nav/examples/Nav.md +1216 -1230
  300. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1910 -4577
  301. package/docs/demos/Page/examples/Page.css +11 -0
  302. package/docs/demos/Page/examples/Page.md +3753 -2540
  303. package/docs/demos/Panel/Panel.md +88 -0
  304. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
  305. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +16 -48
  306. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +5150 -6255
  307. package/docs/demos/Skeleton/examples/Skeleton.md +297 -304
  308. package/docs/demos/Table/examples/Table.md +14272 -15154
  309. package/docs/demos/Tabs/examples/Tabs.md +2821 -2891
  310. package/docs/demos/Toolbar/examples/Toolbar.css +10 -18
  311. package/docs/demos/Toolbar/examples/Toolbar.md +2487 -2663
  312. package/docs/demos/Wizard/examples/Wizard.md +3021 -2784
  313. package/docs/layouts/Bullseye/examples/Bullseye.css +4 -4
  314. package/docs/layouts/Flex/examples/Flex.css +4 -4
  315. package/docs/layouts/Flex/examples/Flex.md +50 -50
  316. package/docs/layouts/Gallery/examples/Gallery.css +4 -4
  317. package/docs/layouts/Gallery/examples/Gallery.md +6 -6
  318. package/docs/layouts/Grid/examples/Grid.css +3 -3
  319. package/docs/layouts/Grid/examples/Grid.md +33 -33
  320. package/docs/layouts/Level/examples/Level.css +5 -5
  321. package/docs/layouts/Split/examples/Split.css +4 -4
  322. package/docs/layouts/Stack/examples/Stack.css +5 -5
  323. package/docs/utilities/Accessibility/examples/Accessibility.md +2 -2
  324. package/docs/utilities/Alignment/examples/Alignment.css +6 -6
  325. package/docs/utilities/Alignment/examples/Alignment.md +5 -5
  326. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +7 -67
  327. package/docs/utilities/BoxShadow/examples/box-shadow.css +11 -11
  328. package/docs/utilities/BoxShadow/examples/box-shadow.md +15 -38
  329. package/docs/utilities/Display/examples/Display.css +3 -10
  330. package/docs/utilities/Display/examples/Display.md +21 -12
  331. package/docs/utilities/Flex/examples/Flex.css +7 -7
  332. package/docs/utilities/Flex/examples/Flex.md +82 -40
  333. package/docs/utilities/Float/examples/Float.css +5 -5
  334. package/docs/utilities/Float/examples/Float.md +6 -6
  335. package/docs/utilities/Sizing/examples/Sizing.css +6 -6
  336. package/docs/utilities/Sizing/examples/Sizing.md +60 -60
  337. package/docs/utilities/Spacing/examples/Spacing.css +3 -3
  338. package/docs/utilities/Spacing/examples/Spacing.md +37 -37
  339. package/docs/utilities/Text/examples/Text.md +78 -77
  340. package/icons/pficons.mjs +6 -0
  341. package/layouts/Bullseye/bullseye.css +4 -0
  342. package/layouts/Bullseye/bullseye.scss +5 -1
  343. package/layouts/Flex/flex.css +241 -237
  344. package/layouts/Flex/flex.scss +48 -44
  345. package/layouts/Gallery/gallery.css +15 -11
  346. package/layouts/Gallery/gallery.scss +9 -5
  347. package/layouts/Grid/grid.css +20 -16
  348. package/layouts/Grid/grid.scss +12 -8
  349. package/layouts/Level/level.css +5 -1
  350. package/layouts/Level/level.scss +6 -2
  351. package/layouts/Split/split.css +5 -1
  352. package/layouts/Split/split.scss +6 -2
  353. package/layouts/Stack/stack.css +5 -1
  354. package/layouts/Stack/stack.scss +6 -2
  355. package/layouts/_index.css +3461 -0
  356. package/layouts/_index.scss +8 -0
  357. package/package.json +39 -39
  358. package/patternfly-addons.css +2071 -2648
  359. package/patternfly-addons.scss +2 -12
  360. package/patternfly-base-no-globals.css +1429 -1645
  361. package/patternfly-base-no-globals.scss +5 -3
  362. package/patternfly-base.css +1511 -1723
  363. package/patternfly-base.scss +2 -6
  364. package/patternfly-charts.css +579 -240
  365. package/patternfly-charts.scss +352 -337
  366. package/patternfly-no-globals.css +19895 -23410
  367. package/patternfly-no-globals.scss +5 -4
  368. package/patternfly.css +19999 -23510
  369. package/patternfly.min.css +1 -1
  370. package/patternfly.min.css.map +1 -1
  371. package/patternfly.scss +3 -4
  372. package/sass-utilities/_index.scss +6 -0
  373. package/sass-utilities/functions.scss +25 -25
  374. package/sass-utilities/{_init.scss → init.scss} +6 -6
  375. package/sass-utilities/mixins.scss +108 -72
  376. package/sass-utilities/{component-namespaces.scss → namespaces-components.scss} +3 -27
  377. package/sass-utilities/{layout-namespaces.scss → namespaces-layouts.scss} +3 -1
  378. package/sass-utilities/scss-variables.scss +49 -261
  379. package/utilities/Accessibility/accessibility.css +15 -15
  380. package/utilities/Accessibility/accessibility.scss +8 -6
  381. package/utilities/Alignment/alignment.css +29 -29
  382. package/utilities/Alignment/alignment.scss +6 -4
  383. package/utilities/BackgroundColor/background-color.css +67 -0
  384. package/utilities/BackgroundColor/background-color.scss +16 -0
  385. package/utilities/BoxShadow/box-shadow.css +15 -39
  386. package/utilities/BoxShadow/box-shadow.scss +19 -28
  387. package/utilities/Display/display.css +43 -5
  388. package/utilities/Display/display.scss +7 -4
  389. package/utilities/Flex/flex.css +50 -50
  390. package/utilities/Flex/flex.scss +21 -20
  391. package/utilities/Float/float.css +29 -29
  392. package/utilities/Float/float.scss +6 -6
  393. package/utilities/Sizing/sizing.css +58 -58
  394. package/utilities/Sizing/sizing.scss +23 -21
  395. package/utilities/Spacing/spacing.css +1372 -1372
  396. package/utilities/Spacing/spacing.scss +6 -6
  397. package/utilities/Text/text.css +419 -662
  398. package/utilities/Text/text.scss +81 -107
  399. package/utilities/_index.css +7815 -0
  400. package/utilities/_index.scss +10 -0
  401. package/assets/images/pf-logo-small.svg +0 -23
  402. package/assets/images/pf_logo_white.hbs +0 -35
  403. package/assets/images/pfbg-icon.svg +0 -1
  404. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  405. package/base/_base.scss +0 -2
  406. package/base/_chart-globals.scss +0 -415
  407. package/base/_common.scss +0 -50
  408. package/base/_fa-icons.scss +0 -33
  409. package/base/_fonts.scss +0 -136
  410. package/base/_icons.scss +0 -3
  411. package/base/_pficons.scss +0 -2
  412. package/base/_themes.scss +0 -43
  413. package/base/_variables.scss +0 -299
  414. package/base/patternfly-globals.css +0 -120
  415. package/base/patternfly-globals.scss +0 -2
  416. package/base/patternfly-icons.css +0 -4728
  417. package/base/patternfly-icons.scss +0 -2
  418. package/base/patternfly-themes.css +0 -82
  419. package/base/patternfly-themes.scss +0 -2
  420. package/base/themes/dark/_chart-globals.scss +0 -42
  421. package/base/themes/dark/_globals.scss +0 -5
  422. package/base/tokens/_workspace-overrides.scss +0 -7
  423. package/components/AppLauncher/app-launcher.css +0 -244
  424. package/components/AppLauncher/app-launcher.scss +0 -308
  425. package/components/AppLauncher/themes/dark/app-launcher.scss +0 -13
  426. package/components/Chip/chip-group.css +0 -93
  427. package/components/Chip/chip-group.scss +0 -98
  428. package/components/Chip/chip.css +0 -122
  429. package/components/Chip/chip.scss +0 -140
  430. package/components/Chip/themes/dark/chip.scss +0 -9
  431. package/components/ContextSelector/context-selector.css +0 -336
  432. package/components/ContextSelector/context-selector.scss +0 -384
  433. package/components/ContextSelector/themes/dark/context-selector.scss +0 -24
  434. package/components/Dropdown/dropdown.css +0 -686
  435. package/components/Dropdown/dropdown.scss +0 -820
  436. package/components/Dropdown/themes/dark/dropdown.scss +0 -32
  437. package/components/LogViewer/log-viewer.css +0 -197
  438. package/components/LogViewer/log-viewer.scss +0 -226
  439. package/components/LogViewer/themes/dark/log-viewer.scss +0 -7
  440. package/components/NotificationBadge/notification-badge.css +0 -87
  441. package/components/NotificationBadge/notification-badge.scss +0 -108
  442. package/components/OptionsMenu/options-menu.css +0 -279
  443. package/components/OptionsMenu/options-menu.scss +0 -332
  444. package/components/OptionsMenu/themes/dark/options-menu.scss +0 -21
  445. package/components/Select/select.css +0 -599
  446. package/components/Select/select.scss +0 -713
  447. package/components/Select/themes/dark/select.scss +0 -23
  448. package/components/_all.scss +0 -91
  449. package/docs/components/AppLauncher/deprecated/application-launcher.css +0 -25
  450. package/docs/components/AppLauncher/deprecated/application-launcher.md +0 -792
  451. package/docs/components/Breadcrumb/examples/Breadcrumb.css +0 -3
  452. package/docs/components/Chip/examples/Chip.md +0 -846
  453. package/docs/components/ContextSelector/deprecated/context-selector.css +0 -7
  454. package/docs/components/ContextSelector/deprecated/context-selector.md +0 -909
  455. package/docs/components/Dropdown/deprecated/Dropdown.css +0 -64
  456. package/docs/components/Dropdown/deprecated/Dropdown.md +0 -2920
  457. package/docs/components/LogViewer/examples/LogViewer.css +0 -17
  458. package/docs/components/LogViewer/examples/LogViewer.md +0 -5936
  459. package/docs/components/NotificationBadge/examples/NotificationBadge.md +0 -222
  460. package/docs/components/OptionsMenu/deprecated/options-menu.css +0 -25
  461. package/docs/components/OptionsMenu/deprecated/options-menu.md +0 -1014
  462. package/docs/components/Page/deprecated/PageHeader.css +0 -17
  463. package/docs/components/Page/deprecated/PageHeader.md +0 -261
  464. package/docs/components/Pagination/examples/Pagination.css +0 -3
  465. package/docs/components/Select/deprecated/Select.css +0 -56
  466. package/docs/components/Select/deprecated/Select.md +0 -3525
  467. package/docs/components/Tabs/examples/Tabs.css +0 -10
  468. package/docs/components/ToggleGroup/examples/toggle-group.css +0 -4
  469. package/docs/demos/ContextSelector/examples/ContextSelector.md +0 -1712
  470. package/docs/demos/Page/examples/Penta.md +0 -821
  471. package/docs/utilities/Text/examples/Text.css +0 -0
  472. package/layouts/_all.scss +0 -7
  473. package/patternfly-base-no-globals-theme-dark-unversioned.css +0 -6276
  474. package/patternfly-base-no-globals-theme-dark-unversioned.scss +0 -11
  475. package/patternfly-base-theme-dark-unversioned.css +0 -6393
  476. package/patternfly-base-theme-dark-unversioned.scss +0 -5
  477. package/patternfly-charts-theme-dark-unversioned.css +0 -70
  478. package/patternfly-charts-theme-dark-unversioned.scss +0 -8
  479. package/patternfly-charts-theme-dark.css +0 -70
  480. package/patternfly-charts-theme-dark.scss +0 -8
  481. package/patternfly-theme-dark-unversioned.css +0 -35533
  482. package/patternfly-theme-dark-unversioned.scss +0 -6
  483. package/patternfly-theme-dark.css +0 -0
  484. package/patternfly-theme-dark.scss +0 -1
  485. package/sass-utilities/_all.scss +0 -9
  486. package/sass-utilities/colors.scss +0 -82
  487. package/sass-utilities/div.import.scss +0 -3
  488. package/sass-utilities/div.scss +0 -4
  489. package/sass-utilities/placeholders.scss +0 -72
  490. package/sass-utilities/themes/dark/_all.scss +0 -4
  491. package/sass-utilities/themes/dark/colors.scss +0 -16
  492. package/sass-utilities/themes/dark/mixins.scss +0 -7
  493. package/sass-utilities/themes/dark/placeholders.scss +0 -5
  494. package/sass-utilities/themes/dark/scss-variables.scss +0 -92
  495. package/themes/dark/_patternfly-charts-theme-dark.scss +0 -98
  496. package/utilities/BackgroundColor/BackgroundColor.css +0 -414
  497. package/utilities/BackgroundColor/BackgroundColor.scss +0 -64
  498. package/utilities/BackgroundColor/themes/dark/BackgroundColor.css +0 -0
  499. package/utilities/BackgroundColor/themes/dark/BackgroundColor.scss +0 -25
  500. package/utilities/Text/themes/dark/text.css +0 -0
  501. package/utilities/Text/themes/dark/text.scss +0 -33
@@ -38,68 +38,24 @@ cssPrefix: pf-v6-c-dual-list-selector
38
38
  type="button"
39
39
  aria-label="Sort"
40
40
  >
41
- <i
42
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
43
- aria-hidden="true"
44
- ></i>
41
+ <span class="pf-v6-c-button__icon pf-m-start">
42
+ <i
43
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
44
+ aria-hidden="true"
45
+ ></i>
46
+ </span>
45
47
  </button>
46
- <div class="pf-v6-c-dropdown">
47
- <button
48
- class="pf-v6-c-dropdown__toggle pf-m-plain"
49
- id="dropdown-kebab-basic-available-button"
50
- aria-expanded="false"
51
- type="button"
52
- aria-label="Actions"
53
- >
48
+ <button
49
+ class="pf-v6-c-menu-toggle pf-m-plain"
50
+ type="button"
51
+ aria-expanded="false"
52
+ aria-label="Menu toggle"
53
+ id="basic-available-menu-toggle"
54
+ >
55
+ <span class="pf-v6-c-menu-toggle__icon">
54
56
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
55
- </button>
56
- <ul
57
- class="pf-v6-c-dropdown__menu"
58
- aria-labelledby="dropdown-kebab-basic-available-button"
59
- hidden
60
- role="menu"
61
- >
62
- <li role="none">
63
- <a
64
- class="pf-v6-c-dropdown__menu-item"
65
- role="menuitem"
66
- href="#"
67
- >Link</a>
68
- </li>
69
- <li role="none">
70
- <button
71
- class="pf-v6-c-dropdown__menu-item"
72
- role="menuitem"
73
- type="button"
74
- >Action</button>
75
- </li>
76
- <li role="none">
77
- <a
78
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
79
- role="menuitem"
80
- href="#"
81
- aria-disabled="true"
82
- tabindex="-1"
83
- >Disabled link</a>
84
- </li>
85
- <li role="none">
86
- <button
87
- class="pf-v6-c-dropdown__menu-item"
88
- role="menuitem"
89
- type="button"
90
- disabled
91
- >Disabled action</button>
92
- </li>
93
- <li class="pf-v6-c-divider" role="separator"></li>
94
- <li role="none">
95
- <a
96
- class="pf-v6-c-dropdown__menu-item"
97
- role="menuitem"
98
- href="#"
99
- >Separated link</a>
100
- </li>
101
- </ul>
102
- </div>
57
+ </span>
58
+ </button>
103
59
  </div>
104
60
  </div>
105
61
  <div class="pf-v6-c-dual-list-selector__status">
@@ -192,7 +148,9 @@ cssPrefix: pf-v6-c-dual-list-selector
192
148
  disabled
193
149
  aria-label="Add selected"
194
150
  >
195
- <i class="fas fa-fw fa-angle-right"></i>
151
+ <span class="pf-v6-c-button__icon">
152
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
153
+ </span>
196
154
  </button>
197
155
  </div>
198
156
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -201,7 +159,9 @@ cssPrefix: pf-v6-c-dual-list-selector
201
159
  type="button"
202
160
  aria-label="Add all"
203
161
  >
204
- <i class="fas fa-fw fa-angle-double-right"></i>
162
+ <span class="pf-v6-c-button__icon">
163
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
164
+ </span>
205
165
  </button>
206
166
  </div>
207
167
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -211,7 +171,9 @@ cssPrefix: pf-v6-c-dual-list-selector
211
171
  disabled
212
172
  aria-label="Remove all"
213
173
  >
214
- <i class="fas fa-fw fa-angle-double-left"></i>
174
+ <span class="pf-v6-c-button__icon">
175
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
176
+ </span>
215
177
  </button>
216
178
  </div>
217
179
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -221,7 +183,9 @@ cssPrefix: pf-v6-c-dual-list-selector
221
183
  disabled
222
184
  aria-label="Remove selected"
223
185
  >
224
- <i class="fas fa-fw fa-angle-left"></i>
186
+ <span class="pf-v6-c-button__icon">
187
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
188
+ </span>
225
189
  </button>
226
190
  </div>
227
191
  </div>
@@ -255,68 +219,24 @@ cssPrefix: pf-v6-c-dual-list-selector
255
219
  type="button"
256
220
  aria-label="Sort"
257
221
  >
258
- <i
259
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
260
- aria-hidden="true"
261
- ></i>
222
+ <span class="pf-v6-c-button__icon pf-m-start">
223
+ <i
224
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
225
+ aria-hidden="true"
226
+ ></i>
227
+ </span>
262
228
  </button>
263
- <div class="pf-v6-c-dropdown">
264
- <button
265
- class="pf-v6-c-dropdown__toggle pf-m-plain"
266
- id="dropdown-kebab-basic-chosen-button"
267
- aria-expanded="false"
268
- type="button"
269
- aria-label="Actions"
270
- >
229
+ <button
230
+ class="pf-v6-c-menu-toggle pf-m-plain"
231
+ type="button"
232
+ aria-expanded="false"
233
+ aria-label="Menu toggle"
234
+ id="basic-chosen-menu-toggle"
235
+ >
236
+ <span class="pf-v6-c-menu-toggle__icon">
271
237
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
272
- </button>
273
- <ul
274
- class="pf-v6-c-dropdown__menu"
275
- aria-labelledby="dropdown-kebab-basic-chosen-button"
276
- hidden
277
- role="menu"
278
- >
279
- <li role="none">
280
- <a
281
- class="pf-v6-c-dropdown__menu-item"
282
- role="menuitem"
283
- href="#"
284
- >Link</a>
285
- </li>
286
- <li role="none">
287
- <button
288
- class="pf-v6-c-dropdown__menu-item"
289
- role="menuitem"
290
- type="button"
291
- >Action</button>
292
- </li>
293
- <li role="none">
294
- <a
295
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
296
- role="menuitem"
297
- href="#"
298
- aria-disabled="true"
299
- tabindex="-1"
300
- >Disabled link</a>
301
- </li>
302
- <li role="none">
303
- <button
304
- class="pf-v6-c-dropdown__menu-item"
305
- role="menuitem"
306
- type="button"
307
- disabled
308
- >Disabled action</button>
309
- </li>
310
- <li class="pf-v6-c-divider" role="separator"></li>
311
- <li role="none">
312
- <a
313
- class="pf-v6-c-dropdown__menu-item"
314
- role="menuitem"
315
- href="#"
316
- >Separated link</a>
317
- </li>
318
- </ul>
319
- </div>
238
+ </span>
239
+ </button>
320
240
  </div>
321
241
  </div>
322
242
  <div class="pf-v6-c-dual-list-selector__status">
@@ -373,68 +293,24 @@ cssPrefix: pf-v6-c-dual-list-selector
373
293
  type="button"
374
294
  aria-label="Sort"
375
295
  >
376
- <i
377
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
378
- aria-hidden="true"
379
- ></i>
296
+ <span class="pf-v6-c-button__icon pf-m-start">
297
+ <i
298
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
299
+ aria-hidden="true"
300
+ ></i>
301
+ </span>
380
302
  </button>
381
- <div class="pf-v6-c-dropdown">
382
- <button
383
- class="pf-v6-c-dropdown__toggle pf-m-plain"
384
- id="dropdown-kebab-available-item-selected-available-button"
385
- aria-expanded="false"
386
- type="button"
387
- aria-label="Actions"
388
- >
303
+ <button
304
+ class="pf-v6-c-menu-toggle pf-m-plain"
305
+ type="button"
306
+ aria-expanded="false"
307
+ aria-label="Menu toggle"
308
+ id="available-item-selected-available-menu-toggle"
309
+ >
310
+ <span class="pf-v6-c-menu-toggle__icon">
389
311
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
390
- </button>
391
- <ul
392
- class="pf-v6-c-dropdown__menu"
393
- aria-labelledby="dropdown-kebab-available-item-selected-available-button"
394
- hidden
395
- role="menu"
396
- >
397
- <li role="none">
398
- <a
399
- class="pf-v6-c-dropdown__menu-item"
400
- role="menuitem"
401
- href="#"
402
- >Link</a>
403
- </li>
404
- <li role="none">
405
- <button
406
- class="pf-v6-c-dropdown__menu-item"
407
- role="menuitem"
408
- type="button"
409
- >Action</button>
410
- </li>
411
- <li role="none">
412
- <a
413
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
414
- role="menuitem"
415
- href="#"
416
- aria-disabled="true"
417
- tabindex="-1"
418
- >Disabled link</a>
419
- </li>
420
- <li role="none">
421
- <button
422
- class="pf-v6-c-dropdown__menu-item"
423
- role="menuitem"
424
- type="button"
425
- disabled
426
- >Disabled action</button>
427
- </li>
428
- <li class="pf-v6-c-divider" role="separator"></li>
429
- <li role="none">
430
- <a
431
- class="pf-v6-c-dropdown__menu-item"
432
- role="menuitem"
433
- href="#"
434
- >Separated link</a>
435
- </li>
436
- </ul>
437
- </div>
312
+ </span>
313
+ </button>
438
314
  </div>
439
315
  </div>
440
316
  <div class="pf-v6-c-dual-list-selector__status">
@@ -521,7 +397,9 @@ cssPrefix: pf-v6-c-dual-list-selector
521
397
  type="button"
522
398
  aria-label="Add selected"
523
399
  >
524
- <i class="fas fa-fw fa-angle-right"></i>
400
+ <span class="pf-v6-c-button__icon">
401
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
402
+ </span>
525
403
  </button>
526
404
  </div>
527
405
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -530,7 +408,9 @@ cssPrefix: pf-v6-c-dual-list-selector
530
408
  type="button"
531
409
  aria-label="Add all"
532
410
  >
533
- <i class="fas fa-fw fa-angle-double-right"></i>
411
+ <span class="pf-v6-c-button__icon">
412
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
413
+ </span>
534
414
  </button>
535
415
  </div>
536
416
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -540,7 +420,9 @@ cssPrefix: pf-v6-c-dual-list-selector
540
420
  disabled
541
421
  aria-label="Remove all"
542
422
  >
543
- <i class="fas fa-fw fa-angle-double-left"></i>
423
+ <span class="pf-v6-c-button__icon">
424
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
425
+ </span>
544
426
  </button>
545
427
  </div>
546
428
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -550,7 +432,9 @@ cssPrefix: pf-v6-c-dual-list-selector
550
432
  disabled
551
433
  aria-label="Remove selected"
552
434
  >
553
- <i class="fas fa-fw fa-angle-left"></i>
435
+ <span class="pf-v6-c-button__icon">
436
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
437
+ </span>
554
438
  </button>
555
439
  </div>
556
440
  </div>
@@ -584,68 +468,24 @@ cssPrefix: pf-v6-c-dual-list-selector
584
468
  type="button"
585
469
  aria-label="Sort"
586
470
  >
587
- <i
588
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
589
- aria-hidden="true"
590
- ></i>
471
+ <span class="pf-v6-c-button__icon pf-m-start">
472
+ <i
473
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
474
+ aria-hidden="true"
475
+ ></i>
476
+ </span>
591
477
  </button>
592
- <div class="pf-v6-c-dropdown">
593
- <button
594
- class="pf-v6-c-dropdown__toggle pf-m-plain"
595
- id="dropdown-kebab-available-item-selected-chosen-button"
596
- aria-expanded="false"
597
- type="button"
598
- aria-label="Actions"
599
- >
478
+ <button
479
+ class="pf-v6-c-menu-toggle pf-m-plain"
480
+ type="button"
481
+ aria-expanded="false"
482
+ aria-label="Menu toggle"
483
+ id="available-item-selected-chosen-menu-toggle"
484
+ >
485
+ <span class="pf-v6-c-menu-toggle__icon">
600
486
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
601
- </button>
602
- <ul
603
- class="pf-v6-c-dropdown__menu"
604
- aria-labelledby="dropdown-kebab-available-item-selected-chosen-button"
605
- hidden
606
- role="menu"
607
- >
608
- <li role="none">
609
- <a
610
- class="pf-v6-c-dropdown__menu-item"
611
- role="menuitem"
612
- href="#"
613
- >Link</a>
614
- </li>
615
- <li role="none">
616
- <button
617
- class="pf-v6-c-dropdown__menu-item"
618
- role="menuitem"
619
- type="button"
620
- >Action</button>
621
- </li>
622
- <li role="none">
623
- <a
624
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
625
- role="menuitem"
626
- href="#"
627
- aria-disabled="true"
628
- tabindex="-1"
629
- >Disabled link</a>
630
- </li>
631
- <li role="none">
632
- <button
633
- class="pf-v6-c-dropdown__menu-item"
634
- role="menuitem"
635
- type="button"
636
- disabled
637
- >Disabled action</button>
638
- </li>
639
- <li class="pf-v6-c-divider" role="separator"></li>
640
- <li role="none">
641
- <a
642
- class="pf-v6-c-dropdown__menu-item"
643
- role="menuitem"
644
- href="#"
645
- >Separated link</a>
646
- </li>
647
- </ul>
648
- </div>
487
+ </span>
488
+ </button>
649
489
  </div>
650
490
  </div>
651
491
  <div class="pf-v6-c-dual-list-selector__status">
@@ -702,68 +542,24 @@ cssPrefix: pf-v6-c-dual-list-selector
702
542
  type="button"
703
543
  aria-label="Sort"
704
544
  >
705
- <i
706
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
707
- aria-hidden="true"
708
- ></i>
545
+ <span class="pf-v6-c-button__icon pf-m-start">
546
+ <i
547
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
548
+ aria-hidden="true"
549
+ ></i>
550
+ </span>
709
551
  </button>
710
- <div class="pf-v6-c-dropdown">
711
- <button
712
- class="pf-v6-c-dropdown__toggle pf-m-plain"
713
- id="dropdown-kebab-multiple-available-items-selected-available-button"
714
- aria-expanded="false"
715
- type="button"
716
- aria-label="Actions"
717
- >
552
+ <button
553
+ class="pf-v6-c-menu-toggle pf-m-plain"
554
+ type="button"
555
+ aria-expanded="false"
556
+ aria-label="Menu toggle"
557
+ id="multiple-available-items-selected-available-menu-toggle"
558
+ >
559
+ <span class="pf-v6-c-menu-toggle__icon">
718
560
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
719
- </button>
720
- <ul
721
- class="pf-v6-c-dropdown__menu"
722
- aria-labelledby="dropdown-kebab-multiple-available-items-selected-available-button"
723
- hidden
724
- role="menu"
725
- >
726
- <li role="none">
727
- <a
728
- class="pf-v6-c-dropdown__menu-item"
729
- role="menuitem"
730
- href="#"
731
- >Link</a>
732
- </li>
733
- <li role="none">
734
- <button
735
- class="pf-v6-c-dropdown__menu-item"
736
- role="menuitem"
737
- type="button"
738
- >Action</button>
739
- </li>
740
- <li role="none">
741
- <a
742
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
743
- role="menuitem"
744
- href="#"
745
- aria-disabled="true"
746
- tabindex="-1"
747
- >Disabled link</a>
748
- </li>
749
- <li role="none">
750
- <button
751
- class="pf-v6-c-dropdown__menu-item"
752
- role="menuitem"
753
- type="button"
754
- disabled
755
- >Disabled action</button>
756
- </li>
757
- <li class="pf-v6-c-divider" role="separator"></li>
758
- <li role="none">
759
- <a
760
- class="pf-v6-c-dropdown__menu-item"
761
- role="menuitem"
762
- href="#"
763
- >Separated link</a>
764
- </li>
765
- </ul>
766
- </div>
561
+ </span>
562
+ </button>
767
563
  </div>
768
564
  </div>
769
565
  <div class="pf-v6-c-dual-list-selector__status">
@@ -850,7 +646,9 @@ cssPrefix: pf-v6-c-dual-list-selector
850
646
  type="button"
851
647
  aria-label="Add selected"
852
648
  >
853
- <i class="fas fa-fw fa-angle-right"></i>
649
+ <span class="pf-v6-c-button__icon">
650
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
651
+ </span>
854
652
  </button>
855
653
  </div>
856
654
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -859,7 +657,9 @@ cssPrefix: pf-v6-c-dual-list-selector
859
657
  type="button"
860
658
  aria-label="Add all"
861
659
  >
862
- <i class="fas fa-fw fa-angle-double-right"></i>
660
+ <span class="pf-v6-c-button__icon">
661
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
662
+ </span>
863
663
  </button>
864
664
  </div>
865
665
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -869,7 +669,9 @@ cssPrefix: pf-v6-c-dual-list-selector
869
669
  disabled
870
670
  aria-label="Remove all"
871
671
  >
872
- <i class="fas fa-fw fa-angle-double-left"></i>
672
+ <span class="pf-v6-c-button__icon">
673
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
674
+ </span>
873
675
  </button>
874
676
  </div>
875
677
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -879,7 +681,9 @@ cssPrefix: pf-v6-c-dual-list-selector
879
681
  disabled
880
682
  aria-label="Remove selected"
881
683
  >
882
- <i class="fas fa-fw fa-angle-left"></i>
684
+ <span class="pf-v6-c-button__icon">
685
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
686
+ </span>
883
687
  </button>
884
688
  </div>
885
689
  </div>
@@ -913,68 +717,24 @@ cssPrefix: pf-v6-c-dual-list-selector
913
717
  type="button"
914
718
  aria-label="Sort"
915
719
  >
916
- <i
917
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
918
- aria-hidden="true"
919
- ></i>
720
+ <span class="pf-v6-c-button__icon pf-m-start">
721
+ <i
722
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
723
+ aria-hidden="true"
724
+ ></i>
725
+ </span>
920
726
  </button>
921
- <div class="pf-v6-c-dropdown">
922
- <button
923
- class="pf-v6-c-dropdown__toggle pf-m-plain"
924
- id="dropdown-kebab-multiple-available-items-selected-chosen-button"
925
- aria-expanded="false"
926
- type="button"
927
- aria-label="Actions"
928
- >
727
+ <button
728
+ class="pf-v6-c-menu-toggle pf-m-plain"
729
+ type="button"
730
+ aria-expanded="false"
731
+ aria-label="Menu toggle"
732
+ id="multiple-available-items-selected-chosen-menu-toggle"
733
+ >
734
+ <span class="pf-v6-c-menu-toggle__icon">
929
735
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
930
- </button>
931
- <ul
932
- class="pf-v6-c-dropdown__menu"
933
- aria-labelledby="dropdown-kebab-multiple-available-items-selected-chosen-button"
934
- hidden
935
- role="menu"
936
- >
937
- <li role="none">
938
- <a
939
- class="pf-v6-c-dropdown__menu-item"
940
- role="menuitem"
941
- href="#"
942
- >Link</a>
943
- </li>
944
- <li role="none">
945
- <button
946
- class="pf-v6-c-dropdown__menu-item"
947
- role="menuitem"
948
- type="button"
949
- >Action</button>
950
- </li>
951
- <li role="none">
952
- <a
953
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
954
- role="menuitem"
955
- href="#"
956
- aria-disabled="true"
957
- tabindex="-1"
958
- >Disabled link</a>
959
- </li>
960
- <li role="none">
961
- <button
962
- class="pf-v6-c-dropdown__menu-item"
963
- role="menuitem"
964
- type="button"
965
- disabled
966
- >Disabled action</button>
967
- </li>
968
- <li class="pf-v6-c-divider" role="separator"></li>
969
- <li role="none">
970
- <a
971
- class="pf-v6-c-dropdown__menu-item"
972
- role="menuitem"
973
- href="#"
974
- >Separated link</a>
975
- </li>
976
- </ul>
977
- </div>
736
+ </span>
737
+ </button>
978
738
  </div>
979
739
  </div>
980
740
  <div class="pf-v6-c-dual-list-selector__status">
@@ -1031,68 +791,24 @@ cssPrefix: pf-v6-c-dual-list-selector
1031
791
  type="button"
1032
792
  aria-label="Sort"
1033
793
  >
1034
- <i
1035
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1036
- aria-hidden="true"
1037
- ></i>
794
+ <span class="pf-v6-c-button__icon pf-m-start">
795
+ <i
796
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
797
+ aria-hidden="true"
798
+ ></i>
799
+ </span>
1038
800
  </button>
1039
- <div class="pf-v6-c-dropdown">
1040
- <button
1041
- class="pf-v6-c-dropdown__toggle pf-m-plain"
1042
- id="dropdown-kebab-chosen-item-available-button"
1043
- aria-expanded="false"
1044
- type="button"
1045
- aria-label="Actions"
1046
- >
801
+ <button
802
+ class="pf-v6-c-menu-toggle pf-m-plain"
803
+ type="button"
804
+ aria-expanded="false"
805
+ aria-label="Menu toggle"
806
+ id="chosen-item-available-menu-toggle"
807
+ >
808
+ <span class="pf-v6-c-menu-toggle__icon">
1047
809
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1048
- </button>
1049
- <ul
1050
- class="pf-v6-c-dropdown__menu"
1051
- aria-labelledby="dropdown-kebab-chosen-item-available-button"
1052
- hidden
1053
- role="menu"
1054
- >
1055
- <li role="none">
1056
- <a
1057
- class="pf-v6-c-dropdown__menu-item"
1058
- role="menuitem"
1059
- href="#"
1060
- >Link</a>
1061
- </li>
1062
- <li role="none">
1063
- <button
1064
- class="pf-v6-c-dropdown__menu-item"
1065
- role="menuitem"
1066
- type="button"
1067
- >Action</button>
1068
- </li>
1069
- <li role="none">
1070
- <a
1071
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
1072
- role="menuitem"
1073
- href="#"
1074
- aria-disabled="true"
1075
- tabindex="-1"
1076
- >Disabled link</a>
1077
- </li>
1078
- <li role="none">
1079
- <button
1080
- class="pf-v6-c-dropdown__menu-item"
1081
- role="menuitem"
1082
- type="button"
1083
- disabled
1084
- >Disabled action</button>
1085
- </li>
1086
- <li class="pf-v6-c-divider" role="separator"></li>
1087
- <li role="none">
1088
- <a
1089
- class="pf-v6-c-dropdown__menu-item"
1090
- role="menuitem"
1091
- href="#"
1092
- >Separated link</a>
1093
- </li>
1094
- </ul>
1095
- </div>
810
+ </span>
811
+ </button>
1096
812
  </div>
1097
813
  </div>
1098
814
  <div class="pf-v6-c-dual-list-selector__status">
@@ -1180,7 +896,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1180
896
  disabled
1181
897
  aria-label="Add selected"
1182
898
  >
1183
- <i class="fas fa-fw fa-angle-right"></i>
899
+ <span class="pf-v6-c-button__icon">
900
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
901
+ </span>
1184
902
  </button>
1185
903
  </div>
1186
904
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1189,7 +907,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1189
907
  type="button"
1190
908
  aria-label="Add all"
1191
909
  >
1192
- <i class="fas fa-fw fa-angle-double-right"></i>
910
+ <span class="pf-v6-c-button__icon">
911
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
912
+ </span>
1193
913
  </button>
1194
914
  </div>
1195
915
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1198,7 +918,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1198
918
  type="button"
1199
919
  aria-label="Remove all"
1200
920
  >
1201
- <i class="fas fa-fw fa-angle-double-left"></i>
921
+ <span class="pf-v6-c-button__icon">
922
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
923
+ </span>
1202
924
  </button>
1203
925
  </div>
1204
926
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1208,7 +930,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1208
930
  disabled
1209
931
  aria-label="Remove selected"
1210
932
  >
1211
- <i class="fas fa-fw fa-angle-left"></i>
933
+ <span class="pf-v6-c-button__icon">
934
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
935
+ </span>
1212
936
  </button>
1213
937
  </div>
1214
938
  </div>
@@ -1242,68 +966,24 @@ cssPrefix: pf-v6-c-dual-list-selector
1242
966
  type="button"
1243
967
  aria-label="Sort"
1244
968
  >
1245
- <i
1246
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1247
- aria-hidden="true"
1248
- ></i>
969
+ <span class="pf-v6-c-button__icon pf-m-start">
970
+ <i
971
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
972
+ aria-hidden="true"
973
+ ></i>
974
+ </span>
1249
975
  </button>
1250
- <div class="pf-v6-c-dropdown">
1251
- <button
1252
- class="pf-v6-c-dropdown__toggle pf-m-plain"
1253
- id="dropdown-kebab-chosen-item-chosen-button"
1254
- aria-expanded="false"
1255
- type="button"
1256
- aria-label="Actions"
1257
- >
976
+ <button
977
+ class="pf-v6-c-menu-toggle pf-m-plain"
978
+ type="button"
979
+ aria-expanded="false"
980
+ aria-label="Menu toggle"
981
+ id="chosen-item-chosen-menu-toggle"
982
+ >
983
+ <span class="pf-v6-c-menu-toggle__icon">
1258
984
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1259
- </button>
1260
- <ul
1261
- class="pf-v6-c-dropdown__menu"
1262
- aria-labelledby="dropdown-kebab-chosen-item-chosen-button"
1263
- hidden
1264
- role="menu"
1265
- >
1266
- <li role="none">
1267
- <a
1268
- class="pf-v6-c-dropdown__menu-item"
1269
- role="menuitem"
1270
- href="#"
1271
- >Link</a>
1272
- </li>
1273
- <li role="none">
1274
- <button
1275
- class="pf-v6-c-dropdown__menu-item"
1276
- role="menuitem"
1277
- type="button"
1278
- >Action</button>
1279
- </li>
1280
- <li role="none">
1281
- <a
1282
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
1283
- role="menuitem"
1284
- href="#"
1285
- aria-disabled="true"
1286
- tabindex="-1"
1287
- >Disabled link</a>
1288
- </li>
1289
- <li role="none">
1290
- <button
1291
- class="pf-v6-c-dropdown__menu-item"
1292
- role="menuitem"
1293
- type="button"
1294
- disabled
1295
- >Disabled action</button>
1296
- </li>
1297
- <li class="pf-v6-c-divider" role="separator"></li>
1298
- <li role="none">
1299
- <a
1300
- class="pf-v6-c-dropdown__menu-item"
1301
- role="menuitem"
1302
- href="#"
1303
- >Separated link</a>
1304
- </li>
1305
- </ul>
1306
- </div>
985
+ </span>
986
+ </button>
1307
987
  </div>
1308
988
  </div>
1309
989
  <div class="pf-v6-c-dual-list-selector__status">
@@ -1373,68 +1053,24 @@ cssPrefix: pf-v6-c-dual-list-selector
1373
1053
  type="button"
1374
1054
  aria-label="Sort"
1375
1055
  >
1376
- <i
1377
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1378
- aria-hidden="true"
1379
- ></i>
1056
+ <span class="pf-v6-c-button__icon pf-m-start">
1057
+ <i
1058
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1059
+ aria-hidden="true"
1060
+ ></i>
1061
+ </span>
1380
1062
  </button>
1381
- <div class="pf-v6-c-dropdown">
1382
- <button
1383
- class="pf-v6-c-dropdown__toggle pf-m-plain"
1384
- id="dropdown-kebab-chosen-item-selected-available-button"
1385
- aria-expanded="false"
1386
- type="button"
1387
- aria-label="Actions"
1388
- >
1063
+ <button
1064
+ class="pf-v6-c-menu-toggle pf-m-plain"
1065
+ type="button"
1066
+ aria-expanded="false"
1067
+ aria-label="Menu toggle"
1068
+ id="chosen-item-selected-available-menu-toggle"
1069
+ >
1070
+ <span class="pf-v6-c-menu-toggle__icon">
1389
1071
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1390
- </button>
1391
- <ul
1392
- class="pf-v6-c-dropdown__menu"
1393
- aria-labelledby="dropdown-kebab-chosen-item-selected-available-button"
1394
- hidden
1395
- role="menu"
1396
- >
1397
- <li role="none">
1398
- <a
1399
- class="pf-v6-c-dropdown__menu-item"
1400
- role="menuitem"
1401
- href="#"
1402
- >Link</a>
1403
- </li>
1404
- <li role="none">
1405
- <button
1406
- class="pf-v6-c-dropdown__menu-item"
1407
- role="menuitem"
1408
- type="button"
1409
- >Action</button>
1410
- </li>
1411
- <li role="none">
1412
- <a
1413
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
1414
- role="menuitem"
1415
- href="#"
1416
- aria-disabled="true"
1417
- tabindex="-1"
1418
- >Disabled link</a>
1419
- </li>
1420
- <li role="none">
1421
- <button
1422
- class="pf-v6-c-dropdown__menu-item"
1423
- role="menuitem"
1424
- type="button"
1425
- disabled
1426
- >Disabled action</button>
1427
- </li>
1428
- <li class="pf-v6-c-divider" role="separator"></li>
1429
- <li role="none">
1430
- <a
1431
- class="pf-v6-c-dropdown__menu-item"
1432
- role="menuitem"
1433
- href="#"
1434
- >Separated link</a>
1435
- </li>
1436
- </ul>
1437
- </div>
1072
+ </span>
1073
+ </button>
1438
1074
  </div>
1439
1075
  </div>
1440
1076
  <div class="pf-v6-c-dual-list-selector__status">
@@ -1522,7 +1158,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1522
1158
  disabled
1523
1159
  aria-label="Add selected"
1524
1160
  >
1525
- <i class="fas fa-fw fa-angle-right"></i>
1161
+ <span class="pf-v6-c-button__icon">
1162
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
1163
+ </span>
1526
1164
  </button>
1527
1165
  </div>
1528
1166
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1531,7 +1169,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1531
1169
  type="button"
1532
1170
  aria-label="Add all"
1533
1171
  >
1534
- <i class="fas fa-fw fa-angle-double-right"></i>
1172
+ <span class="pf-v6-c-button__icon">
1173
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
1174
+ </span>
1535
1175
  </button>
1536
1176
  </div>
1537
1177
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1540,7 +1180,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1540
1180
  type="button"
1541
1181
  aria-label="Remove all"
1542
1182
  >
1543
- <i class="fas fa-fw fa-angle-double-left"></i>
1183
+ <span class="pf-v6-c-button__icon">
1184
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
1185
+ </span>
1544
1186
  </button>
1545
1187
  </div>
1546
1188
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -1549,7 +1191,9 @@ cssPrefix: pf-v6-c-dual-list-selector
1549
1191
  type="button"
1550
1192
  aria-label="Remove selected"
1551
1193
  >
1552
- <i class="fas fa-fw fa-angle-left"></i>
1194
+ <span class="pf-v6-c-button__icon">
1195
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
1196
+ </span>
1553
1197
  </button>
1554
1198
  </div>
1555
1199
  </div>
@@ -1583,68 +1227,24 @@ cssPrefix: pf-v6-c-dual-list-selector
1583
1227
  type="button"
1584
1228
  aria-label="Sort"
1585
1229
  >
1586
- <i
1587
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1588
- aria-hidden="true"
1589
- ></i>
1230
+ <span class="pf-v6-c-button__icon pf-m-start">
1231
+ <i
1232
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1233
+ aria-hidden="true"
1234
+ ></i>
1235
+ </span>
1590
1236
  </button>
1591
- <div class="pf-v6-c-dropdown">
1592
- <button
1593
- class="pf-v6-c-dropdown__toggle pf-m-plain"
1594
- id="dropdown-kebab-chosen-item-selected-chosen-button"
1595
- aria-expanded="false"
1596
- type="button"
1597
- aria-label="Actions"
1598
- >
1237
+ <button
1238
+ class="pf-v6-c-menu-toggle pf-m-plain"
1239
+ type="button"
1240
+ aria-expanded="false"
1241
+ aria-label="Menu toggle"
1242
+ id="chosen-item-selected-chosen-menu-toggle"
1243
+ >
1244
+ <span class="pf-v6-c-menu-toggle__icon">
1599
1245
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1600
- </button>
1601
- <ul
1602
- class="pf-v6-c-dropdown__menu"
1603
- aria-labelledby="dropdown-kebab-chosen-item-selected-chosen-button"
1604
- hidden
1605
- role="menu"
1606
- >
1607
- <li role="none">
1608
- <a
1609
- class="pf-v6-c-dropdown__menu-item"
1610
- role="menuitem"
1611
- href="#"
1612
- >Link</a>
1613
- </li>
1614
- <li role="none">
1615
- <button
1616
- class="pf-v6-c-dropdown__menu-item"
1617
- role="menuitem"
1618
- type="button"
1619
- >Action</button>
1620
- </li>
1621
- <li role="none">
1622
- <a
1623
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
1624
- role="menuitem"
1625
- href="#"
1626
- aria-disabled="true"
1627
- tabindex="-1"
1628
- >Disabled link</a>
1629
- </li>
1630
- <li role="none">
1631
- <button
1632
- class="pf-v6-c-dropdown__menu-item"
1633
- role="menuitem"
1634
- type="button"
1635
- disabled
1636
- >Disabled action</button>
1637
- </li>
1638
- <li class="pf-v6-c-divider" role="separator"></li>
1639
- <li role="none">
1640
- <a
1641
- class="pf-v6-c-dropdown__menu-item"
1642
- role="menuitem"
1643
- href="#"
1644
- >Separated link</a>
1645
- </li>
1646
- </ul>
1647
- </div>
1246
+ </span>
1247
+ </button>
1648
1248
  </div>
1649
1249
  </div>
1650
1250
  <div class="pf-v6-c-dual-list-selector__status">
@@ -1714,68 +1314,24 @@ cssPrefix: pf-v6-c-dual-list-selector
1714
1314
  type="button"
1715
1315
  aria-label="Sort"
1716
1316
  >
1717
- <i
1718
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1719
- aria-hidden="true"
1720
- ></i>
1317
+ <span class="pf-v6-c-button__icon pf-m-start">
1318
+ <i
1319
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1320
+ aria-hidden="true"
1321
+ ></i>
1322
+ </span>
1721
1323
  </button>
1722
- <div class="pf-v6-c-dropdown">
1723
- <button
1724
- class="pf-v6-c-dropdown__toggle pf-m-plain"
1725
- id="dropdown-kebab-tree-available-button"
1726
- aria-expanded="false"
1727
- type="button"
1728
- aria-label="Actions"
1729
- >
1324
+ <button
1325
+ class="pf-v6-c-menu-toggle pf-m-plain"
1326
+ type="button"
1327
+ aria-expanded="false"
1328
+ aria-label="Menu toggle"
1329
+ id="tree-available-menu-toggle"
1330
+ >
1331
+ <span class="pf-v6-c-menu-toggle__icon">
1730
1332
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1731
- </button>
1732
- <ul
1733
- class="pf-v6-c-dropdown__menu"
1734
- aria-labelledby="dropdown-kebab-tree-available-button"
1735
- hidden
1736
- role="menu"
1737
- >
1738
- <li role="none">
1739
- <a
1740
- class="pf-v6-c-dropdown__menu-item"
1741
- role="menuitem"
1742
- href="#"
1743
- >Link</a>
1744
- </li>
1745
- <li role="none">
1746
- <button
1747
- class="pf-v6-c-dropdown__menu-item"
1748
- role="menuitem"
1749
- type="button"
1750
- >Action</button>
1751
- </li>
1752
- <li role="none">
1753
- <a
1754
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
1755
- role="menuitem"
1756
- href="#"
1757
- aria-disabled="true"
1758
- tabindex="-1"
1759
- >Disabled link</a>
1760
- </li>
1761
- <li role="none">
1762
- <button
1763
- class="pf-v6-c-dropdown__menu-item"
1764
- role="menuitem"
1765
- type="button"
1766
- disabled
1767
- >Disabled action</button>
1768
- </li>
1769
- <li class="pf-v6-c-divider" role="separator"></li>
1770
- <li role="none">
1771
- <a
1772
- class="pf-v6-c-dropdown__menu-item"
1773
- role="menuitem"
1774
- href="#"
1775
- >Separated link</a>
1776
- </li>
1777
- </ul>
1778
- </div>
1333
+ </span>
1334
+ </button>
1779
1335
  </div>
1780
1336
  </div>
1781
1337
  <div class="pf-v6-c-dual-list-selector__status">
@@ -2130,7 +1686,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2130
1686
  disabled
2131
1687
  aria-label="Add selected"
2132
1688
  >
2133
- <i class="fas fa-fw fa-angle-right"></i>
1689
+ <span class="pf-v6-c-button__icon">
1690
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
1691
+ </span>
2134
1692
  </button>
2135
1693
  </div>
2136
1694
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2139,7 +1697,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2139
1697
  type="button"
2140
1698
  aria-label="Add all"
2141
1699
  >
2142
- <i class="fas fa-fw fa-angle-double-right"></i>
1700
+ <span class="pf-v6-c-button__icon">
1701
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
1702
+ </span>
2143
1703
  </button>
2144
1704
  </div>
2145
1705
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2149,7 +1709,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2149
1709
  disabled
2150
1710
  aria-label="Remove all"
2151
1711
  >
2152
- <i class="fas fa-fw fa-angle-double-left"></i>
1712
+ <span class="pf-v6-c-button__icon">
1713
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
1714
+ </span>
2153
1715
  </button>
2154
1716
  </div>
2155
1717
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2159,7 +1721,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2159
1721
  disabled
2160
1722
  aria-label="Remove selected"
2161
1723
  >
2162
- <i class="fas fa-fw fa-angle-left"></i>
1724
+ <span class="pf-v6-c-button__icon">
1725
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
1726
+ </span>
2163
1727
  </button>
2164
1728
  </div>
2165
1729
  </div>
@@ -2193,68 +1757,24 @@ cssPrefix: pf-v6-c-dual-list-selector
2193
1757
  type="button"
2194
1758
  aria-label="Sort"
2195
1759
  >
2196
- <i
2197
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2198
- aria-hidden="true"
2199
- ></i>
1760
+ <span class="pf-v6-c-button__icon pf-m-start">
1761
+ <i
1762
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1763
+ aria-hidden="true"
1764
+ ></i>
1765
+ </span>
2200
1766
  </button>
2201
- <div class="pf-v6-c-dropdown">
2202
- <button
2203
- class="pf-v6-c-dropdown__toggle pf-m-plain"
2204
- id="dropdown-kebab-tree-chosen-button"
2205
- aria-expanded="false"
2206
- type="button"
2207
- aria-label="Actions"
2208
- >
1767
+ <button
1768
+ class="pf-v6-c-menu-toggle pf-m-plain"
1769
+ type="button"
1770
+ aria-expanded="false"
1771
+ aria-label="Menu toggle"
1772
+ id="tree-chosen-menu-toggle"
1773
+ >
1774
+ <span class="pf-v6-c-menu-toggle__icon">
2209
1775
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2210
- </button>
2211
- <ul
2212
- class="pf-v6-c-dropdown__menu"
2213
- aria-labelledby="dropdown-kebab-tree-chosen-button"
2214
- hidden
2215
- role="menu"
2216
- >
2217
- <li role="none">
2218
- <a
2219
- class="pf-v6-c-dropdown__menu-item"
2220
- role="menuitem"
2221
- href="#"
2222
- >Link</a>
2223
- </li>
2224
- <li role="none">
2225
- <button
2226
- class="pf-v6-c-dropdown__menu-item"
2227
- role="menuitem"
2228
- type="button"
2229
- >Action</button>
2230
- </li>
2231
- <li role="none">
2232
- <a
2233
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
2234
- role="menuitem"
2235
- href="#"
2236
- aria-disabled="true"
2237
- tabindex="-1"
2238
- >Disabled link</a>
2239
- </li>
2240
- <li role="none">
2241
- <button
2242
- class="pf-v6-c-dropdown__menu-item"
2243
- role="menuitem"
2244
- type="button"
2245
- disabled
2246
- >Disabled action</button>
2247
- </li>
2248
- <li class="pf-v6-c-divider" role="separator"></li>
2249
- <li role="none">
2250
- <a
2251
- class="pf-v6-c-dropdown__menu-item"
2252
- role="menuitem"
2253
- href="#"
2254
- >Separated link</a>
2255
- </li>
2256
- </ul>
2257
- </div>
1776
+ </span>
1777
+ </button>
2258
1778
  </div>
2259
1779
  </div>
2260
1780
  <div class="pf-v6-c-dual-list-selector__status">
@@ -2311,68 +1831,24 @@ cssPrefix: pf-v6-c-dual-list-selector
2311
1831
  type="button"
2312
1832
  aria-label="Sort"
2313
1833
  >
2314
- <i
2315
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2316
- aria-hidden="true"
2317
- ></i>
1834
+ <span class="pf-v6-c-button__icon pf-m-start">
1835
+ <i
1836
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
1837
+ aria-hidden="true"
1838
+ ></i>
1839
+ </span>
2318
1840
  </button>
2319
- <div class="pf-v6-c-dropdown">
2320
- <button
2321
- class="pf-v6-c-dropdown__toggle pf-m-plain"
2322
- id="dropdown-kebab-tree-options-available-button"
2323
- aria-expanded="false"
2324
- type="button"
2325
- aria-label="Actions"
2326
- >
1841
+ <button
1842
+ class="pf-v6-c-menu-toggle pf-m-plain"
1843
+ type="button"
1844
+ aria-expanded="false"
1845
+ aria-label="Menu toggle"
1846
+ id="tree-options-available-menu-toggle"
1847
+ >
1848
+ <span class="pf-v6-c-menu-toggle__icon">
2327
1849
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2328
- </button>
2329
- <ul
2330
- class="pf-v6-c-dropdown__menu"
2331
- aria-labelledby="dropdown-kebab-tree-options-available-button"
2332
- hidden
2333
- role="menu"
2334
- >
2335
- <li role="none">
2336
- <a
2337
- class="pf-v6-c-dropdown__menu-item"
2338
- role="menuitem"
2339
- href="#"
2340
- >Link</a>
2341
- </li>
2342
- <li role="none">
2343
- <button
2344
- class="pf-v6-c-dropdown__menu-item"
2345
- role="menuitem"
2346
- type="button"
2347
- >Action</button>
2348
- </li>
2349
- <li role="none">
2350
- <a
2351
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
2352
- role="menuitem"
2353
- href="#"
2354
- aria-disabled="true"
2355
- tabindex="-1"
2356
- >Disabled link</a>
2357
- </li>
2358
- <li role="none">
2359
- <button
2360
- class="pf-v6-c-dropdown__menu-item"
2361
- role="menuitem"
2362
- type="button"
2363
- disabled
2364
- >Disabled action</button>
2365
- </li>
2366
- <li class="pf-v6-c-divider" role="separator"></li>
2367
- <li role="none">
2368
- <a
2369
- class="pf-v6-c-dropdown__menu-item"
2370
- role="menuitem"
2371
- href="#"
2372
- >Separated link</a>
2373
- </li>
2374
- </ul>
2375
- </div>
1850
+ </span>
1851
+ </button>
2376
1852
  </div>
2377
1853
  </div>
2378
1854
  <div class="pf-v6-c-dual-list-selector__status">
@@ -2708,7 +2184,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2708
2184
  disabled
2709
2185
  aria-label="Add selected"
2710
2186
  >
2711
- <i class="fas fa-fw fa-angle-right"></i>
2187
+ <span class="pf-v6-c-button__icon">
2188
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
2189
+ </span>
2712
2190
  </button>
2713
2191
  </div>
2714
2192
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2717,7 +2195,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2717
2195
  type="button"
2718
2196
  aria-label="Add all"
2719
2197
  >
2720
- <i class="fas fa-fw fa-angle-double-right"></i>
2198
+ <span class="pf-v6-c-button__icon">
2199
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
2200
+ </span>
2721
2201
  </button>
2722
2202
  </div>
2723
2203
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2727,7 +2207,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2727
2207
  disabled
2728
2208
  aria-label="Remove all"
2729
2209
  >
2730
- <i class="fas fa-fw fa-angle-double-left"></i>
2210
+ <span class="pf-v6-c-button__icon">
2211
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
2212
+ </span>
2731
2213
  </button>
2732
2214
  </div>
2733
2215
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -2737,7 +2219,9 @@ cssPrefix: pf-v6-c-dual-list-selector
2737
2219
  disabled
2738
2220
  aria-label="Remove selected"
2739
2221
  >
2740
- <i class="fas fa-fw fa-angle-left"></i>
2222
+ <span class="pf-v6-c-button__icon">
2223
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
2224
+ </span>
2741
2225
  </button>
2742
2226
  </div>
2743
2227
  </div>
@@ -2771,68 +2255,24 @@ cssPrefix: pf-v6-c-dual-list-selector
2771
2255
  type="button"
2772
2256
  aria-label="Sort"
2773
2257
  >
2774
- <i
2775
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2776
- aria-hidden="true"
2777
- ></i>
2258
+ <span class="pf-v6-c-button__icon pf-m-start">
2259
+ <i
2260
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2261
+ aria-hidden="true"
2262
+ ></i>
2263
+ </span>
2778
2264
  </button>
2779
- <div class="pf-v6-c-dropdown">
2780
- <button
2781
- class="pf-v6-c-dropdown__toggle pf-m-plain"
2782
- id="dropdown-kebab-tree-options-chosen-button"
2783
- aria-expanded="false"
2784
- type="button"
2785
- aria-label="Actions"
2786
- >
2265
+ <button
2266
+ class="pf-v6-c-menu-toggle pf-m-plain"
2267
+ type="button"
2268
+ aria-expanded="false"
2269
+ aria-label="Menu toggle"
2270
+ id="tree-options-chosen-menu-toggle"
2271
+ >
2272
+ <span class="pf-v6-c-menu-toggle__icon">
2787
2273
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2788
- </button>
2789
- <ul
2790
- class="pf-v6-c-dropdown__menu"
2791
- aria-labelledby="dropdown-kebab-tree-options-chosen-button"
2792
- hidden
2793
- role="menu"
2794
- >
2795
- <li role="none">
2796
- <a
2797
- class="pf-v6-c-dropdown__menu-item"
2798
- role="menuitem"
2799
- href="#"
2800
- >Link</a>
2801
- </li>
2802
- <li role="none">
2803
- <button
2804
- class="pf-v6-c-dropdown__menu-item"
2805
- role="menuitem"
2806
- type="button"
2807
- >Action</button>
2808
- </li>
2809
- <li role="none">
2810
- <a
2811
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
2812
- role="menuitem"
2813
- href="#"
2814
- aria-disabled="true"
2815
- tabindex="-1"
2816
- >Disabled link</a>
2817
- </li>
2818
- <li role="none">
2819
- <button
2820
- class="pf-v6-c-dropdown__menu-item"
2821
- role="menuitem"
2822
- type="button"
2823
- disabled
2824
- >Disabled action</button>
2825
- </li>
2826
- <li class="pf-v6-c-divider" role="separator"></li>
2827
- <li role="none">
2828
- <a
2829
- class="pf-v6-c-dropdown__menu-item"
2830
- role="menuitem"
2831
- href="#"
2832
- >Separated link</a>
2833
- </li>
2834
- </ul>
2835
- </div>
2274
+ </span>
2275
+ </button>
2836
2276
  </div>
2837
2277
  </div>
2838
2278
  <div class="pf-v6-c-dual-list-selector__status">
@@ -2956,68 +2396,24 @@ cssPrefix: pf-v6-c-dual-list-selector
2956
2396
  type="button"
2957
2397
  aria-label="Sort"
2958
2398
  >
2959
- <i
2960
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2961
- aria-hidden="true"
2962
- ></i>
2399
+ <span class="pf-v6-c-button__icon pf-m-start">
2400
+ <i
2401
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2402
+ aria-hidden="true"
2403
+ ></i>
2404
+ </span>
2963
2405
  </button>
2964
- <div class="pf-v6-c-dropdown">
2965
- <button
2966
- class="pf-v6-c-dropdown__toggle pf-m-plain"
2967
- id="dropdown-kebab-draggable-available-button"
2968
- aria-expanded="false"
2969
- type="button"
2970
- aria-label="Actions"
2971
- >
2406
+ <button
2407
+ class="pf-v6-c-menu-toggle pf-m-plain"
2408
+ type="button"
2409
+ aria-expanded="false"
2410
+ aria-label="Menu toggle"
2411
+ id="draggable-available-menu-toggle"
2412
+ >
2413
+ <span class="pf-v6-c-menu-toggle__icon">
2972
2414
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2973
- </button>
2974
- <ul
2975
- class="pf-v6-c-dropdown__menu"
2976
- aria-labelledby="dropdown-kebab-draggable-available-button"
2977
- hidden
2978
- role="menu"
2979
- >
2980
- <li role="none">
2981
- <a
2982
- class="pf-v6-c-dropdown__menu-item"
2983
- role="menuitem"
2984
- href="#"
2985
- >Link</a>
2986
- </li>
2987
- <li role="none">
2988
- <button
2989
- class="pf-v6-c-dropdown__menu-item"
2990
- role="menuitem"
2991
- type="button"
2992
- >Action</button>
2993
- </li>
2994
- <li role="none">
2995
- <a
2996
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
2997
- role="menuitem"
2998
- href="#"
2999
- aria-disabled="true"
3000
- tabindex="-1"
3001
- >Disabled link</a>
3002
- </li>
3003
- <li role="none">
3004
- <button
3005
- class="pf-v6-c-dropdown__menu-item"
3006
- role="menuitem"
3007
- type="button"
3008
- disabled
3009
- >Disabled action</button>
3010
- </li>
3011
- <li class="pf-v6-c-divider" role="separator"></li>
3012
- <li role="none">
3013
- <a
3014
- class="pf-v6-c-dropdown__menu-item"
3015
- role="menuitem"
3016
- href="#"
3017
- >Separated link</a>
3018
- </li>
3019
- </ul>
3020
- </div>
2415
+ </span>
2416
+ </button>
3021
2417
  </div>
3022
2418
  </div>
3023
2419
  <div class="pf-v6-c-dual-list-selector__status">
@@ -3081,7 +2477,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3081
2477
  disabled
3082
2478
  aria-label="Add selected"
3083
2479
  >
3084
- <i class="fas fa-fw fa-angle-right"></i>
2480
+ <span class="pf-v6-c-button__icon">
2481
+ <i class="fas fa-angle-right fa-fw" aria-hidden="true"></i>
2482
+ </span>
3085
2483
  </button>
3086
2484
  </div>
3087
2485
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -3090,7 +2488,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3090
2488
  type="button"
3091
2489
  aria-label="Add all"
3092
2490
  >
3093
- <i class="fas fa-fw fa-angle-double-right"></i>
2491
+ <span class="pf-v6-c-button__icon">
2492
+ <i class="fas fa-angle-double-right fa-fw" aria-hidden="true"></i>
2493
+ </span>
3094
2494
  </button>
3095
2495
  </div>
3096
2496
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -3100,7 +2500,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3100
2500
  disabled
3101
2501
  aria-label="Remove all"
3102
2502
  >
3103
- <i class="fas fa-fw fa-angle-double-left"></i>
2503
+ <span class="pf-v6-c-button__icon">
2504
+ <i class="fas fa-angle-double-left fa-fw" aria-hidden="true"></i>
2505
+ </span>
3104
2506
  </button>
3105
2507
  </div>
3106
2508
  <div class="pf-v6-c-dual-list-selector__controls-item">
@@ -3110,7 +2512,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3110
2512
  disabled
3111
2513
  aria-label="Remove selected"
3112
2514
  >
3113
- <i class="fas fa-fw fa-angle-left"></i>
2515
+ <span class="pf-v6-c-button__icon">
2516
+ <i class="fas fa-angle-left fa-fw" aria-hidden="true"></i>
2517
+ </span>
3114
2518
  </button>
3115
2519
  </div>
3116
2520
  </div>
@@ -3144,68 +2548,24 @@ cssPrefix: pf-v6-c-dual-list-selector
3144
2548
  type="button"
3145
2549
  aria-label="Sort"
3146
2550
  >
3147
- <i
3148
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
3149
- aria-hidden="true"
3150
- ></i>
2551
+ <span class="pf-v6-c-button__icon pf-m-start">
2552
+ <i
2553
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2554
+ aria-hidden="true"
2555
+ ></i>
2556
+ </span>
3151
2557
  </button>
3152
- <div class="pf-v6-c-dropdown">
3153
- <button
3154
- class="pf-v6-c-dropdown__toggle pf-m-plain"
3155
- id="dropdown-kebab-draggable-chosen-button"
3156
- aria-expanded="false"
3157
- type="button"
3158
- aria-label="Actions"
3159
- >
2558
+ <button
2559
+ class="pf-v6-c-menu-toggle pf-m-plain"
2560
+ type="button"
2561
+ aria-expanded="false"
2562
+ aria-label="Menu toggle"
2563
+ id="draggable-chosen-menu-toggle"
2564
+ >
2565
+ <span class="pf-v6-c-menu-toggle__icon">
3160
2566
  <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3161
- </button>
3162
- <ul
3163
- class="pf-v6-c-dropdown__menu"
3164
- aria-labelledby="dropdown-kebab-draggable-chosen-button"
3165
- hidden
3166
- role="menu"
3167
- >
3168
- <li role="none">
3169
- <a
3170
- class="pf-v6-c-dropdown__menu-item"
3171
- role="menuitem"
3172
- href="#"
3173
- >Link</a>
3174
- </li>
3175
- <li role="none">
3176
- <button
3177
- class="pf-v6-c-dropdown__menu-item"
3178
- role="menuitem"
3179
- type="button"
3180
- >Action</button>
3181
- </li>
3182
- <li role="none">
3183
- <a
3184
- class="pf-v6-c-dropdown__menu-item pf-m-disabled"
3185
- role="menuitem"
3186
- href="#"
3187
- aria-disabled="true"
3188
- tabindex="-1"
3189
- >Disabled link</a>
3190
- </li>
3191
- <li role="none">
3192
- <button
3193
- class="pf-v6-c-dropdown__menu-item"
3194
- role="menuitem"
3195
- type="button"
3196
- disabled
3197
- >Disabled action</button>
3198
- </li>
3199
- <li class="pf-v6-c-divider" role="separator"></li>
3200
- <li role="none">
3201
- <a
3202
- class="pf-v6-c-dropdown__menu-item"
3203
- role="menuitem"
3204
- href="#"
3205
- >Separated link</a>
3206
- </li>
3207
- </ul>
3208
- </div>
2567
+ </span>
2568
+ </button>
3209
2569
  </div>
3210
2570
  </div>
3211
2571
  <div class="pf-v6-c-dual-list-selector__status">
@@ -3226,7 +2586,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3226
2586
  <div class="pf-v6-c-dual-list-selector__list-item-row">
3227
2587
  <div class="pf-v6-c-dual-list-selector__draggable">
3228
2588
  <span class="pf-v6-c-button pf-m-plain pf-m-disabled">
3229
- <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2589
+ <span class="pf-v6-c-button__icon">
2590
+ <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2591
+ </span>
3230
2592
  </span>
3231
2593
  </div>
3232
2594
  <span class="pf-v6-c-dual-list-selector__item">
@@ -3246,7 +2608,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3246
2608
  <div class="pf-v6-c-dual-list-selector__list-item-row">
3247
2609
  <div class="pf-v6-c-dual-list-selector__draggable">
3248
2610
  <span class="pf-v6-c-button pf-m-plain">
3249
- <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2611
+ <span class="pf-v6-c-button__icon">
2612
+ <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2613
+ </span>
3250
2614
  </span>
3251
2615
  </div>
3252
2616
  <span class="pf-v6-c-dual-list-selector__item">
@@ -3266,7 +2630,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3266
2630
  <div class="pf-v6-c-dual-list-selector__list-item-row pf-m-ghost-row">
3267
2631
  <div class="pf-v6-c-dual-list-selector__draggable">
3268
2632
  <span class="pf-v6-c-button pf-m-plain pf-m-disabled">
3269
- <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2633
+ <span class="pf-v6-c-button__icon">
2634
+ <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2635
+ </span>
3270
2636
  </span>
3271
2637
  </div>
3272
2638
  <span class="pf-v6-c-dual-list-selector__item">
@@ -3286,7 +2652,9 @@ cssPrefix: pf-v6-c-dual-list-selector
3286
2652
  <div class="pf-v6-c-dual-list-selector__list-item-row pf-m-selected">
3287
2653
  <div class="pf-v6-c-dual-list-selector__draggable">
3288
2654
  <span class="pf-v6-c-button pf-m-plain">
3289
- <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2655
+ <span class="pf-v6-c-button__icon">
2656
+ <i class="fas fa-grip-vertical" aria-hidden="true"></i>
2657
+ </span>
3290
2658
  </span>
3291
2659
  </div>
3292
2660
  <span class="pf-v6-c-dual-list-selector__item">