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

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 (260) hide show
  1. package/README.md +13 -3
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/pficon/pf-v5-pficon.woff2 +0 -0
  4. package/assets/pficon/pficon.scss +6 -129
  5. package/base/_common.scss +21 -0
  6. package/base/_globals.scss +1 -1
  7. package/base/_variables.scss +7 -0
  8. package/base/patternfly-common.css +16 -2
  9. package/base/patternfly-globals.css +1 -1
  10. package/base/patternfly-icons.css +5 -1
  11. package/base/patternfly-pf-icons.css +5 -1
  12. package/base/patternfly-variables.css +16 -0
  13. package/base/tokens/_tokens-font.scss +16 -14
  14. package/components/AboutModalBox/about-modal-box.css +23 -12
  15. package/components/AboutModalBox/about-modal-box.scss +25 -12
  16. package/components/Accordion/accordion.css +33 -20
  17. package/components/Accordion/accordion.scss +32 -20
  18. package/components/ActionList/action-list.css +2 -2
  19. package/components/ActionList/action-list.scss +2 -2
  20. package/components/Alert/alert-group.css +7 -4
  21. package/components/Alert/alert-group.scss +7 -4
  22. package/components/Alert/alert.css +19 -13
  23. package/components/Alert/alert.scss +18 -13
  24. package/components/AppLauncher/app-launcher.css +32 -23
  25. package/components/AppLauncher/app-launcher.scss +32 -23
  26. package/components/BackToTop/back-to-top.css +2 -2
  27. package/components/BackToTop/back-to-top.scss +2 -2
  28. package/components/Backdrop/backdrop.css +2 -2
  29. package/components/Backdrop/backdrop.scss +2 -2
  30. package/components/BackgroundImage/background-image.css +6 -3
  31. package/components/BackgroundImage/background-image.scss +8 -3
  32. package/components/Badge/badge.css +2 -2
  33. package/components/Badge/badge.scss +2 -2
  34. package/components/Banner/banner.css +5 -5
  35. package/components/Banner/banner.scss +5 -2
  36. package/components/Breadcrumb/breadcrumb.css +9 -3
  37. package/components/Breadcrumb/breadcrumb.scss +8 -3
  38. package/components/Button/button.css +33 -21
  39. package/components/Button/button.scss +35 -23
  40. package/components/Button/themes/dark/button.scss +1 -1
  41. package/components/CalendarMonth/calendar-month.css +25 -15
  42. package/components/CalendarMonth/calendar-month.scss +23 -15
  43. package/components/Card/card.css +25 -17
  44. package/components/Card/card.scss +24 -17
  45. package/components/Check/check.css +2 -2
  46. package/components/Check/check.scss +2 -2
  47. package/components/Chip/chip-group.css +6 -6
  48. package/components/Chip/chip-group.scss +6 -6
  49. package/components/Chip/chip.css +16 -9
  50. package/components/Chip/chip.scss +17 -9
  51. package/components/ClipboardCopy/clipboard-copy.css +19 -10
  52. package/components/ClipboardCopy/clipboard-copy.scss +16 -8
  53. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +2 -2
  54. package/components/CodeBlock/code-block.css +6 -3
  55. package/components/CodeBlock/code-block.scss +6 -3
  56. package/components/CodeEditor/code-editor.css +31 -22
  57. package/components/CodeEditor/code-editor.scss +30 -21
  58. package/components/CodeEditor/themes/dark/code-editor.scss +1 -1
  59. package/components/Content/content.css +33 -30
  60. package/components/Content/content.scss +33 -30
  61. package/components/ContextSelector/context-selector.css +41 -26
  62. package/components/ContextSelector/context-selector.scss +40 -25
  63. package/components/ContextSelector/themes/dark/context-selector.scss +1 -1
  64. package/components/DataList/data-list-grid.css +21 -21
  65. package/components/DataList/data-list-grid.scss +3 -3
  66. package/components/DataList/data-list.css +69 -56
  67. package/components/DataList/data-list.scss +47 -35
  68. package/components/DatePicker/date-picker.css +8 -8
  69. package/components/DatePicker/date-picker.scss +8 -8
  70. package/components/DescriptionList/description-list.css +8 -5
  71. package/components/DescriptionList/description-list.scss +8 -5
  72. package/components/DragDrop/drag-drop.css +8 -8
  73. package/components/DragDrop/drag-drop.scss +8 -8
  74. package/components/Drawer/drawer.css +120 -61
  75. package/components/Drawer/drawer.scss +92 -43
  76. package/components/Dropdown/dropdown.css +75 -66
  77. package/components/Dropdown/dropdown.scss +65 -56
  78. package/components/DualListSelector/dual-list-selector.css +29 -15
  79. package/components/DualListSelector/dual-list-selector.scss +30 -15
  80. package/components/EmptyState/empty-state.css +7 -4
  81. package/components/EmptyState/empty-state.scss +7 -4
  82. package/components/ExpandableSection/expandable-section.css +17 -10
  83. package/components/ExpandableSection/expandable-section.scss +15 -10
  84. package/components/FileUpload/file-upload.css +9 -15
  85. package/components/FileUpload/file-upload.scss +9 -15
  86. package/components/Form/form.css +53 -50
  87. package/components/Form/form.scss +46 -44
  88. package/components/FormControl/form-control.css +18 -9
  89. package/components/FormControl/form-control.scss +18 -9
  90. package/components/HelperText/helper-text.css +1 -1
  91. package/components/HelperText/helper-text.scss +1 -1
  92. package/components/Hint/hint.css +9 -6
  93. package/components/Hint/hint.scss +9 -6
  94. package/components/Icon/icon.css +1 -1
  95. package/components/Icon/icon.scss +1 -1
  96. package/components/InlineEdit/inline-edit.css +4 -4
  97. package/components/InlineEdit/inline-edit.scss +4 -4
  98. package/components/InputGroup/input-group.css +12 -6
  99. package/components/InputGroup/input-group.scss +11 -5
  100. package/components/InputGroup/themes/dark/input-group.scss +1 -1
  101. package/components/JumpLinks/jump-links.css +27 -24
  102. package/components/JumpLinks/jump-links.scss +26 -24
  103. package/components/Label/label-group.css +13 -10
  104. package/components/Label/label-group.scss +13 -10
  105. package/components/Label/label.css +9 -9
  106. package/components/Label/label.scss +9 -9
  107. package/components/List/list.css +9 -9
  108. package/components/List/list.scss +9 -9
  109. package/components/LogViewer/log-viewer.css +14 -14
  110. package/components/LogViewer/log-viewer.scss +14 -14
  111. package/components/Login/login.css +36 -27
  112. package/components/Login/login.scss +36 -27
  113. package/components/Masthead/masthead.css +19 -22
  114. package/components/Masthead/masthead.scss +19 -22
  115. package/components/Menu/menu.css +79 -65
  116. package/components/Menu/menu.scss +80 -68
  117. package/components/MenuToggle/menu-toggle.css +33 -27
  118. package/components/MenuToggle/menu-toggle.scss +33 -27
  119. package/components/ModalBox/modal-box.css +19 -19
  120. package/components/ModalBox/modal-box.scss +20 -20
  121. package/components/MultipleFileUpload/multiple-file-upload.css +11 -8
  122. package/components/MultipleFileUpload/multiple-file-upload.scss +11 -8
  123. package/components/Nav/nav.css +120 -93
  124. package/components/Nav/nav.scss +120 -93
  125. package/components/Nav/themes/dark/nav.scss +2 -2
  126. package/components/NotificationBadge/notification-badge.css +66 -85
  127. package/components/NotificationBadge/notification-badge.scss +72 -103
  128. package/components/NotificationDrawer/notification-drawer.css +32 -19
  129. package/components/NotificationDrawer/notification-drawer.scss +30 -19
  130. package/components/NumberInput/number-input.css +2 -2
  131. package/components/NumberInput/number-input.scss +2 -2
  132. package/components/OptionsMenu/options-menu.css +43 -31
  133. package/components/OptionsMenu/options-menu.scss +43 -31
  134. package/components/OverflowMenu/overflow-menu.css +2 -2
  135. package/components/OverflowMenu/overflow-menu.scss +2 -2
  136. package/components/Page/page.css +135 -77
  137. package/components/Page/page.scss +81 -52
  138. package/components/Page/themes/dark/page.scss +1 -1
  139. package/components/Pagination/pagination.css +27 -17
  140. package/components/Pagination/pagination.scss +25 -17
  141. package/components/Panel/panel.css +13 -7
  142. package/components/Panel/panel.scss +13 -7
  143. package/components/Popover/popover.css +72 -40
  144. package/components/Popover/popover.scss +95 -75
  145. package/components/Progress/progress.css +9 -7
  146. package/components/Progress/progress.scss +12 -7
  147. package/components/ProgressStepper/progress-stepper.css +26 -20
  148. package/components/ProgressStepper/progress-stepper.scss +25 -19
  149. package/components/Radio/radio.css +3 -3
  150. package/components/Radio/radio.scss +3 -3
  151. package/components/Select/select.css +56 -47
  152. package/components/Select/select.scss +56 -47
  153. package/components/Sidebar/sidebar.css +11 -5
  154. package/components/Sidebar/sidebar.scss +11 -5
  155. package/components/SimpleList/simple-list.css +10 -4
  156. package/components/SimpleList/simple-list.scss +10 -4
  157. package/components/Skeleton/skeleton.css +6 -5
  158. package/components/Skeleton/skeleton.scss +4 -5
  159. package/components/SkipToContent/skip-to-content.css +3 -3
  160. package/components/SkipToContent/skip-to-content.scss +3 -3
  161. package/components/Slider/slider.css +47 -26
  162. package/components/Slider/slider.scss +56 -28
  163. package/components/Switch/switch.css +9 -5
  164. package/components/Switch/switch.scss +10 -6
  165. package/components/TabContent/tab-content.css +4 -1
  166. package/components/TabContent/tab-content.scss +4 -1
  167. package/components/Table/table-grid.css +256 -195
  168. package/components/Table/table-grid.scss +53 -39
  169. package/components/Table/table-scrollable.css +4 -4
  170. package/components/Table/table-scrollable.scss +6 -4
  171. package/components/Table/table-tree-view.css +112 -105
  172. package/components/Table/table-tree-view.scss +38 -33
  173. package/components/Table/table.css +92 -70
  174. package/components/Table/table.scss +90 -70
  175. package/components/Tabs/tabs.css +76 -48
  176. package/components/Tabs/tabs.scss +74 -48
  177. package/components/TextInputGroup/text-input-group.css +15 -15
  178. package/components/TextInputGroup/text-input-group.scss +15 -15
  179. package/components/Tile/tile.css +10 -10
  180. package/components/Tile/tile.scss +10 -10
  181. package/components/ToggleGroup/toggle-group.css +14 -11
  182. package/components/ToggleGroup/toggle-group.scss +14 -11
  183. package/components/Toolbar/toolbar.css +44 -41
  184. package/components/Toolbar/toolbar.scss +26 -21
  185. package/components/Tooltip/tooltip.css +60 -28
  186. package/components/Tooltip/tooltip.scss +76 -56
  187. package/components/TreeView/tree-view.css +48 -27
  188. package/components/TreeView/tree-view.scss +50 -28
  189. package/components/Truncate/truncate.css +9 -0
  190. package/components/Truncate/truncate.scss +16 -3
  191. package/components/Wizard/wizard.css +57 -36
  192. package/components/Wizard/wizard.scss +57 -36
  193. package/docs/components/Button/examples/Button.css +2 -2
  194. package/docs/components/Button/examples/Button.md +15 -3
  195. package/docs/components/Card/examples/Card.md +15 -15
  196. package/docs/components/Check/examples/Check.md +71 -59
  197. package/docs/components/Chip/examples/Chip.md +1 -1
  198. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +106 -0
  199. package/docs/components/CodeEditor/examples/CodeEditor.md +3 -3
  200. package/docs/components/DragDrop/examples/DragDrop.css +2 -2
  201. package/docs/components/Dropdown/deprecated/Dropdown.css +1 -1
  202. package/docs/components/DualListSelector/examples/DualListSelector.md +64 -16
  203. package/docs/components/Label/examples/Label.md +1 -1
  204. package/docs/components/LogViewer/examples/LogViewer.css +2 -2
  205. package/docs/components/LogViewer/examples/LogViewer.md +120 -30
  206. package/docs/components/Menu/examples/Menu.css +8 -0
  207. package/docs/components/Menu/examples/Menu.md +90 -73
  208. package/docs/components/MenuToggle/examples/MenuToggle.md +60 -39
  209. package/docs/components/ModalBox/examples/ModalBox.css +3 -8
  210. package/docs/components/Nav/examples/Navigation.css +4 -21
  211. package/docs/components/Nav/examples/Navigation.md +99 -0
  212. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  213. package/docs/components/OptionsMenu/deprecated/options-menu.md +12 -3
  214. package/docs/components/Popover/examples/Popover.css +4 -9
  215. package/docs/components/Radio/examples/Radio.md +63 -55
  216. package/docs/components/Select/deprecated/Select.md +184 -177
  217. package/docs/components/Table/examples/Table.css +2 -2
  218. package/docs/components/Table/examples/Table.md +2 -2
  219. package/docs/components/TextInputGroup/examples/TextInputGroup.css +1 -1
  220. package/docs/components/Tile/examples/Tile.css +1 -1
  221. package/docs/components/Toolbar/examples/Toolbar.md +525 -431
  222. package/docs/components/Tooltip/examples/Tooltip.css +4 -0
  223. package/docs/components/Tooltip/examples/Tooltip.md +3 -1
  224. package/docs/components/Truncate/examples/Truncate.md +2 -2
  225. package/docs/demos/Card/examples/Card.css +3 -3
  226. package/docs/demos/Card/examples/Card.md +26 -10
  227. package/docs/demos/CardView/examples/CardView.md +24 -20
  228. package/docs/demos/Dashboard/examples/Dashboard.md +3 -3
  229. package/docs/demos/DataList/examples/DataList.md +8 -2
  230. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +160 -124
  231. package/docs/demos/Skeleton/examples/Skeleton.md +7 -35
  232. package/docs/demos/Table/examples/Table.md +336 -252
  233. package/docs/demos/Tabs/examples/Tabs.md +28 -21
  234. package/docs/demos/Toolbar/examples/Toolbar.css +5 -0
  235. package/docs/demos/Toolbar/examples/Toolbar.md +44 -44
  236. package/docs/layouts/Flex/examples/Flex.md +5 -5
  237. package/docs/utilities/BoxShadow/examples/box-shadow.css +5 -5
  238. package/icons/pficons.mjs +1 -0
  239. package/layouts/Flex/flex.css +115 -43
  240. package/layouts/Flex/flex.scss +20 -8
  241. package/package.json +9 -5
  242. package/patternfly-addons.css +732 -972
  243. package/patternfly-base-no-globals-theme-dark-unversioned.css +37 -3
  244. package/patternfly-base-no-globals.css +37 -3
  245. package/patternfly-base-theme-dark-unversioned.css +38 -4
  246. package/patternfly-base.css +38 -4
  247. package/patternfly-no-globals.css +2748 -1960
  248. package/patternfly-theme-dark-unversioned.css +2749 -1961
  249. package/patternfly.css +2749 -1961
  250. package/patternfly.min.css +1 -1
  251. package/patternfly.min.css.map +1 -1
  252. package/sass-utilities/functions.scss +6 -0
  253. package/sass-utilities/mixins.scss +62 -2
  254. package/sass-utilities/scss-variables.scss +8 -8
  255. package/sass-utilities/themes/dark/mixins.scss +3 -1
  256. package/utilities/Accessibility/accessibility.css +12 -12
  257. package/utilities/Spacing/spacing.css +720 -960
  258. package/utilities/Spacing/spacing.scss +4 -8
  259. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  260. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/components/LogViewer/examples/LogViewer.md CHANGED
@@ -365,7 +365,10 @@ cssPrefix: pf-v5-c-log-viewer
365
365
  name="log-viewer-basic-example-check-wrap-lines"
366
366
  />
367
367
 
368
- <span class="pf-v5-c-check__label">Wrap lines</span>
368
+ <span
369
+ class="pf-v5-c-check__label"
370
+ for="-input"
371
+ >Wrap lines</span>
369
372
  </label>
370
373
  </div>
371
374
  </li>
@@ -382,7 +385,10 @@ cssPrefix: pf-v5-c-log-viewer
382
385
  name="log-viewer-basic-example-check-show-timestamps"
383
386
  />
384
387
 
385
- <span class="pf-v5-c-check__label">Show timestamps</span>
388
+ <span
389
+ class="pf-v5-c-check__label"
390
+ for="-input"
391
+ >Show timestamps</span>
386
392
  </label>
387
393
  </div>
388
394
  </li>
@@ -399,7 +405,10 @@ cssPrefix: pf-v5-c-log-viewer
399
405
  name="log-viewer-basic-example-check-line-number"
400
406
  />
401
407
 
402
- <span class="pf-v5-c-check__label">Display line number</span>
408
+ <span
409
+ class="pf-v5-c-check__label"
410
+ for="-input"
411
+ >Display line number</span>
403
412
  </label>
404
413
  </div>
405
414
  </li>
@@ -926,7 +935,10 @@ cssPrefix: pf-v5-c-log-viewer
926
935
  name="log-viewer-line-number-example-check-wrap-lines"
927
936
  />
928
937
 
929
- <span class="pf-v5-c-check__label">Wrap lines</span>
938
+ <span
939
+ class="pf-v5-c-check__label"
940
+ for="-input"
941
+ >Wrap lines</span>
930
942
  </label>
931
943
  </div>
932
944
  </li>
@@ -943,7 +955,10 @@ cssPrefix: pf-v5-c-log-viewer
943
955
  name="log-viewer-line-number-example-check-show-timestamps"
944
956
  />
945
957
 
946
- <span class="pf-v5-c-check__label">Show timestamps</span>
958
+ <span
959
+ class="pf-v5-c-check__label"
960
+ for="-input"
961
+ >Show timestamps</span>
947
962
  </label>
948
963
  </div>
949
964
  </li>
@@ -960,7 +975,10 @@ cssPrefix: pf-v5-c-log-viewer
960
975
  name="log-viewer-line-number-example-check-line-number"
961
976
  />
962
977
 
963
- <span class="pf-v5-c-check__label">Display line number</span>
978
+ <span
979
+ class="pf-v5-c-check__label"
980
+ for="-input"
981
+ >Display line number</span>
964
982
  </label>
965
983
  </div>
966
984
  </li>
@@ -1487,7 +1505,10 @@ cssPrefix: pf-v5-c-log-viewer
1487
1505
  name="log-viewer-line-number-chars-example-check-wrap-lines"
1488
1506
  />
1489
1507
 
1490
- <span class="pf-v5-c-check__label">Wrap lines</span>
1508
+ <span
1509
+ class="pf-v5-c-check__label"
1510
+ for="-input"
1511
+ >Wrap lines</span>
1491
1512
  </label>
1492
1513
  </div>
1493
1514
  </li>
@@ -1504,7 +1525,10 @@ cssPrefix: pf-v5-c-log-viewer
1504
1525
  name="log-viewer-line-number-chars-example-check-show-timestamps"
1505
1526
  />
1506
1527
 
1507
- <span class="pf-v5-c-check__label">Show timestamps</span>
1528
+ <span
1529
+ class="pf-v5-c-check__label"
1530
+ for="-input"
1531
+ >Show timestamps</span>
1508
1532
  </label>
1509
1533
  </div>
1510
1534
  </li>
@@ -1521,7 +1545,10 @@ cssPrefix: pf-v5-c-log-viewer
1521
1545
  name="log-viewer-line-number-chars-example-check-line-number"
1522
1546
  />
1523
1547
 
1524
- <span class="pf-v5-c-check__label">Display line number</span>
1548
+ <span
1549
+ class="pf-v5-c-check__label"
1550
+ for="-input"
1551
+ >Display line number</span>
1525
1552
  </label>
1526
1553
  </div>
1527
1554
  </li>
@@ -2048,7 +2075,10 @@ cssPrefix: pf-v5-c-log-viewer
2048
2075
  name="log-viewer-text-wrap-example-check-wrap-lines"
2049
2076
  />
2050
2077
 
2051
- <span class="pf-v5-c-check__label">Wrap lines</span>
2078
+ <span
2079
+ class="pf-v5-c-check__label"
2080
+ for="-input"
2081
+ >Wrap lines</span>
2052
2082
  </label>
2053
2083
  </div>
2054
2084
  </li>
@@ -2065,7 +2095,10 @@ cssPrefix: pf-v5-c-log-viewer
2065
2095
  name="log-viewer-text-wrap-example-check-show-timestamps"
2066
2096
  />
2067
2097
 
2068
- <span class="pf-v5-c-check__label">Show timestamps</span>
2098
+ <span
2099
+ class="pf-v5-c-check__label"
2100
+ for="-input"
2101
+ >Show timestamps</span>
2069
2102
  </label>
2070
2103
  </div>
2071
2104
  </li>
@@ -2082,7 +2115,10 @@ cssPrefix: pf-v5-c-log-viewer
2082
2115
  name="log-viewer-text-wrap-example-check-line-number"
2083
2116
  />
2084
2117
 
2085
- <span class="pf-v5-c-check__label">Display line number</span>
2118
+ <span
2119
+ class="pf-v5-c-check__label"
2120
+ for="-input"
2121
+ >Display line number</span>
2086
2122
  </label>
2087
2123
  </div>
2088
2124
  </li>
@@ -2609,7 +2645,10 @@ cssPrefix: pf-v5-c-log-viewer
2609
2645
  name="log-viewer-text-nowrap-example-check-wrap-lines"
2610
2646
  />
2611
2647
 
2612
- <span class="pf-v5-c-check__label">Wrap lines</span>
2648
+ <span
2649
+ class="pf-v5-c-check__label"
2650
+ for="-input"
2651
+ >Wrap lines</span>
2613
2652
  </label>
2614
2653
  </div>
2615
2654
  </li>
@@ -2626,7 +2665,10 @@ cssPrefix: pf-v5-c-log-viewer
2626
2665
  name="log-viewer-text-nowrap-example-check-show-timestamps"
2627
2666
  />
2628
2667
 
2629
- <span class="pf-v5-c-check__label">Show timestamps</span>
2668
+ <span
2669
+ class="pf-v5-c-check__label"
2670
+ for="-input"
2671
+ >Show timestamps</span>
2630
2672
  </label>
2631
2673
  </div>
2632
2674
  </li>
@@ -2643,7 +2685,10 @@ cssPrefix: pf-v5-c-log-viewer
2643
2685
  name="log-viewer-text-nowrap-example-check-line-number"
2644
2686
  />
2645
2687
 
2646
- <span class="pf-v5-c-check__label">Display line number</span>
2688
+ <span
2689
+ class="pf-v5-c-check__label"
2690
+ for="-input"
2691
+ >Display line number</span>
2647
2692
  </label>
2648
2693
  </div>
2649
2694
  </li>
@@ -3197,7 +3242,10 @@ cssPrefix: pf-v5-c-log-viewer
3197
3242
  name="log-viewer-search-results-example-check-wrap-lines"
3198
3243
  />
3199
3244
 
3200
- <span class="pf-v5-c-check__label">Wrap lines</span>
3245
+ <span
3246
+ class="pf-v5-c-check__label"
3247
+ for="-input"
3248
+ >Wrap lines</span>
3201
3249
  </label>
3202
3250
  </div>
3203
3251
  </li>
@@ -3214,7 +3262,10 @@ cssPrefix: pf-v5-c-log-viewer
3214
3262
  name="log-viewer-search-results-example-check-show-timestamps"
3215
3263
  />
3216
3264
 
3217
- <span class="pf-v5-c-check__label">Show timestamps</span>
3265
+ <span
3266
+ class="pf-v5-c-check__label"
3267
+ for="-input"
3268
+ >Show timestamps</span>
3218
3269
  </label>
3219
3270
  </div>
3220
3271
  </li>
@@ -3231,7 +3282,10 @@ cssPrefix: pf-v5-c-log-viewer
3231
3282
  name="log-viewer-search-results-example-check-line-number"
3232
3283
  />
3233
3284
 
3234
- <span class="pf-v5-c-check__label">Display line number</span>
3285
+ <span
3286
+ class="pf-v5-c-check__label"
3287
+ for="-input"
3288
+ >Display line number</span>
3235
3289
  </label>
3236
3290
  </div>
3237
3291
  </li>
@@ -3801,7 +3855,10 @@ cssPrefix: pf-v5-c-log-viewer
3801
3855
  name="log-viewer-max-height-example-check-wrap-lines"
3802
3856
  />
3803
3857
 
3804
- <span class="pf-v5-c-check__label">Wrap lines</span>
3858
+ <span
3859
+ class="pf-v5-c-check__label"
3860
+ for="-input"
3861
+ >Wrap lines</span>
3805
3862
  </label>
3806
3863
  </div>
3807
3864
  </li>
@@ -3818,7 +3875,10 @@ cssPrefix: pf-v5-c-log-viewer
3818
3875
  name="log-viewer-max-height-example-check-show-timestamps"
3819
3876
  />
3820
3877
 
3821
- <span class="pf-v5-c-check__label">Show timestamps</span>
3878
+ <span
3879
+ class="pf-v5-c-check__label"
3880
+ for="-input"
3881
+ >Show timestamps</span>
3822
3882
  </label>
3823
3883
  </div>
3824
3884
  </li>
@@ -3835,7 +3895,10 @@ cssPrefix: pf-v5-c-log-viewer
3835
3895
  name="log-viewer-max-height-example-check-line-number"
3836
3896
  />
3837
3897
 
3838
- <span class="pf-v5-c-check__label">Display line number</span>
3898
+ <span
3899
+ class="pf-v5-c-check__label"
3900
+ for="-input"
3901
+ >Display line number</span>
3839
3902
  </label>
3840
3903
  </div>
3841
3904
  </li>
@@ -4360,7 +4423,10 @@ cssPrefix: pf-v5-c-log-viewer
4360
4423
  name="log-viewer-dropdowns-expanded-example-check-wrap-lines"
4361
4424
  />
4362
4425
 
4363
- <span class="pf-v5-c-check__label">Wrap lines</span>
4426
+ <span
4427
+ class="pf-v5-c-check__label"
4428
+ for="-input"
4429
+ >Wrap lines</span>
4364
4430
  </label>
4365
4431
  </div>
4366
4432
  </li>
@@ -4377,7 +4443,10 @@ cssPrefix: pf-v5-c-log-viewer
4377
4443
  name="log-viewer-dropdowns-expanded-example-check-show-timestamps"
4378
4444
  />
4379
4445
 
4380
- <span class="pf-v5-c-check__label">Show timestamps</span>
4446
+ <span
4447
+ class="pf-v5-c-check__label"
4448
+ for="-input"
4449
+ >Show timestamps</span>
4381
4450
  </label>
4382
4451
  </div>
4383
4452
  </li>
@@ -4394,7 +4463,10 @@ cssPrefix: pf-v5-c-log-viewer
4394
4463
  name="log-viewer-dropdowns-expanded-example-check-line-number"
4395
4464
  />
4396
4465
 
4397
- <span class="pf-v5-c-check__label">Display line number</span>
4466
+ <span
4467
+ class="pf-v5-c-check__label"
4468
+ for="-input"
4469
+ >Display line number</span>
4398
4470
  </label>
4399
4471
  </div>
4400
4472
  </li>
@@ -4921,7 +4993,10 @@ cssPrefix: pf-v5-c-log-viewer
4921
4993
  name="log-viewer-popover-expanded-example-check-wrap-lines"
4922
4994
  />
4923
4995
 
4924
- <span class="pf-v5-c-check__label">Wrap lines</span>
4996
+ <span
4997
+ class="pf-v5-c-check__label"
4998
+ for="-input"
4999
+ >Wrap lines</span>
4925
5000
  </label>
4926
5001
  </div>
4927
5002
  </li>
@@ -4938,7 +5013,10 @@ cssPrefix: pf-v5-c-log-viewer
4938
5013
  name="log-viewer-popover-expanded-example-check-show-timestamps"
4939
5014
  />
4940
5015
 
4941
- <span class="pf-v5-c-check__label">Show timestamps</span>
5016
+ <span
5017
+ class="pf-v5-c-check__label"
5018
+ for="-input"
5019
+ >Show timestamps</span>
4942
5020
  </label>
4943
5021
  </div>
4944
5022
  </li>
@@ -4955,7 +5033,10 @@ cssPrefix: pf-v5-c-log-viewer
4955
5033
  name="log-viewer-popover-expanded-example-check-line-number"
4956
5034
  />
4957
5035
 
4958
- <span class="pf-v5-c-check__label">Display line number</span>
5036
+ <span
5037
+ class="pf-v5-c-check__label"
5038
+ for="-input"
5039
+ >Display line number</span>
4959
5040
  </label>
4960
5041
  </div>
4961
5042
  </li>
@@ -5542,7 +5623,10 @@ cssPrefix: pf-v5-c-log-viewer
5542
5623
  name="log-viewer-dark-example-check-wrap-lines"
5543
5624
  />
5544
5625
 
5545
- <span class="pf-v5-c-check__label">Wrap lines</span>
5626
+ <span
5627
+ class="pf-v5-c-check__label"
5628
+ for="-input"
5629
+ >Wrap lines</span>
5546
5630
  </label>
5547
5631
  </div>
5548
5632
  </li>
@@ -5559,7 +5643,10 @@ cssPrefix: pf-v5-c-log-viewer
5559
5643
  name="log-viewer-dark-example-check-show-timestamps"
5560
5644
  />
5561
5645
 
5562
- <span class="pf-v5-c-check__label">Show timestamps</span>
5646
+ <span
5647
+ class="pf-v5-c-check__label"
5648
+ for="-input"
5649
+ >Show timestamps</span>
5563
5650
  </label>
5564
5651
  </div>
5565
5652
  </li>
@@ -5576,7 +5663,10 @@ cssPrefix: pf-v5-c-log-viewer
5576
5663
  name="log-viewer-dark-example-check-line-number"
5577
5664
  />
5578
5665
 
5579
- <span class="pf-v5-c-check__label">Display line number</span>
5666
+ <span
5667
+ class="pf-v5-c-check__label"
5668
+ for="-input"
5669
+ >Display line number</span>
5580
5670
  </label>
5581
5671
  </div>
5582
5672
  </li>
package/docs/components/Menu/examples/Menu.css CHANGED
@@ -16,3 +16,11 @@
16
16
  align-items: flex-end;
17
17
  justify-content: flex-end;
18
18
  }
19
+
20
+ :is([id="ws-core-c-menu-drilldown-with-breadcrumbs---level-3"], [id="ws-core-c-menu-drilldown-with-breadcrumbs---level-4"]) {
21
+ position: relative;
22
+ }
23
+
24
+ :is([id="ws-core-c-menu-drilldown-with-breadcrumbs---level-3"], [id="ws-core-c-menu-drilldown-with-breadcrumbs---level-4"]) .pf-v5-c-breadcrumb__dropdown .pf-v5-c-menu {
25
+ position: absolute;
26
+ }
package/docs/components/Menu/examples/Menu.md CHANGED
@@ -4778,37 +4778,41 @@ cssPrefix: pf-v5-c-menu
4778
4778
  <i class="fas fa-angle-right" aria-hidden="true"></i>
4779
4779
  </span>
4780
4780
  <span class="pf-v5-c-breadcrumb__dropdown">
4781
- <div class="pf-v5-c-dropdown pf-m-expanded">
4782
- <button
4783
- class="pf-v5-c-dropdown__toggle pf-m-plain"
4784
- id="drilldown-with-breadcrumbs-level-3-breadcrumb-breadcrumb-dropdown-button"
4785
- aria-expanded="true"
4786
- type="button"
4787
- >
4788
- <span class="pf-v5-c-badge pf-m-read">
4789
- 1
4790
- <span class="pf-v5-c-dropdown__toggle-icon">
4791
- <i class="fas fa-caret-down" aria-hidden="true"></i>
4792
- </span>
4793
- </span>
4794
- </button>
4795
- <ul
4796
- class="pf-v5-c-dropdown__menu"
4797
- aria-labelledby="drilldown-with-breadcrumbs-level-3-breadcrumb-breadcrumb-dropdown-button"
4798
- role="menu"
4799
- >
4800
- <li role="none">
4801
- <button
4802
- class="pf-v5-c-dropdown__menu-item"
4803
- role="menuitem"
4804
- type="button"
4805
- >
4806
- <span class="pf-v5-c-dropdown__menu-item-icon">
4807
- <i class="fas fa-angle-left" aria-hidden="true"></i>
4808
- </span>Edit
4809
- </button>
4810
- </li>
4811
- </ul>
4781
+ <button
4782
+ class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
4783
+ type="button"
4784
+ aria-expanded="true"
4785
+ >
4786
+ <span class="pf-v5-c-badge pf-m-read">
4787
+ 1
4788
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
4789
+ </span>
4790
+ </button>
4791
+ <div class="pf-v5-c-menu">
4792
+ <div class="pf-v5-c-menu__content">
4793
+ <ul class="pf-v5-c-menu__list" role="menu">
4794
+ <li class="pf-v5-c-menu__list-item" role="none">
4795
+ <button
4796
+ class="pf-v5-c-menu__item"
4797
+ type="button"
4798
+ role="menuitem"
4799
+ >
4800
+ <span class="pf-v5-c-menu__item-main">
4801
+ <span class="pf-v5-c-menu__item-icon">
4802
+ <span class="pf-v5-c-icon">
4803
+ <span
4804
+ class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
4805
+ >
4806
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
4807
+ </span>
4808
+ </span>
4809
+ </span>
4810
+ <span class="pf-v5-c-menu__item-text">Edit</span>
4811
+ </span>
4812
+ </button>
4813
+ </li>
4814
+ </ul>
4815
+ </div>
4812
4816
  </div>
4813
4817
  </span>
4814
4818
  </li>
@@ -5027,48 +5031,61 @@ cssPrefix: pf-v5-c-menu
5027
5031
  <i class="fas fa-angle-right" aria-hidden="true"></i>
5028
5032
  </span>
5029
5033
  <span class="pf-v5-c-breadcrumb__dropdown">
5030
- <div class="pf-v5-c-dropdown pf-m-expanded">
5031
- <button
5032
- class="pf-v5-c-dropdown__toggle pf-m-plain"
5033
- id="drilldown-with-breadcrumbs-level-4-breadcrumb-breadcrumb-dropdown-button"
5034
- aria-expanded="true"
5035
- type="button"
5036
- >
5037
- <span class="pf-v5-c-badge pf-m-read">
5038
- 2
5039
- <span class="pf-v5-c-dropdown__toggle-icon">
5040
- <i class="fas fa-caret-down" aria-hidden="true"></i>
5041
- </span>
5042
- </span>
5043
- </button>
5044
- <ul
5045
- class="pf-v5-c-dropdown__menu"
5046
- aria-labelledby="drilldown-with-breadcrumbs-level-4-breadcrumb-breadcrumb-dropdown-button"
5047
- role="menu"
5048
- >
5049
- <li role="none">
5050
- <button
5051
- class="pf-v5-c-dropdown__menu-item"
5052
- role="menuitem"
5053
- type="button"
5054
- >
5055
- <span class="pf-v5-c-dropdown__menu-item-icon">
5056
- <i class="fas fa-angle-left" aria-hidden="true"></i>
5057
- </span>Edit
5058
- </button>
5059
- </li>
5060
- <li role="none">
5061
- <button
5062
- class="pf-v5-c-dropdown__menu-item"
5063
- role="menuitem"
5064
- type="button"
5065
- >
5066
- <span class="pf-v5-c-dropdown__menu-item-icon">
5067
- <i class="fas fa-angle-left" aria-hidden="true"></i>
5068
- </span>Deployment
5069
- </button>
5070
- </li>
5071
- </ul>
5034
+ <button
5035
+ class="pf-v5-c-menu-toggle pf-m-plain pf-m-expanded"
5036
+ type="button"
5037
+ aria-expanded="true"
5038
+ >
5039
+ <span class="pf-v5-c-badge pf-m-read">
5040
+ 2
5041
+ <i class="fas fa-caret-down" aria-hidden="true"></i>
5042
+ </span>
5043
+ </button>
5044
+ <div class="pf-v5-c-menu">
5045
+ <div class="pf-v5-c-menu__content">
5046
+ <ul class="pf-v5-c-menu__list" role="menu">
5047
+ <li class="pf-v5-c-menu__list-item" role="none">
5048
+ <button
5049
+ class="pf-v5-c-menu__item"
5050
+ type="button"
5051
+ role="menuitem"
5052
+ >
5053
+ <span class="pf-v5-c-menu__item-main">
5054
+ <span class="pf-v5-c-menu__item-icon">
5055
+ <span class="pf-v5-c-icon">
5056
+ <span
5057
+ class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
5058
+ >
5059
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
5060
+ </span>
5061
+ </span>
5062
+ </span>
5063
+ <span class="pf-v5-c-menu__item-text">Edit</span>
5064
+ </span>
5065
+ </button>
5066
+ </li>
5067
+ <li class="pf-v5-c-menu__list-item" role="none">
5068
+ <button
5069
+ class="pf-v5-c-menu__item"
5070
+ type="button"
5071
+ role="menuitem"
5072
+ >
5073
+ <span class="pf-v5-c-menu__item-main">
5074
+ <span class="pf-v5-c-menu__item-icon">
5075
+ <span class="pf-v5-c-icon">
5076
+ <span
5077
+ class="pf-v5-c-icon__content pf-v5-m-mirror-inline-rtl"
5078
+ >
5079
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
5080
+ </span>
5081
+ </span>
5082
+ </span>
5083
+ <span class="pf-v5-c-menu__item-text">Deployment</span>
5084
+ </span>
5085
+ </button>
5086
+ </li>
5087
+ </ul>
5088
+ </div>
5072
5089
  </div>
5073
5090
  </span>
5074
5091
  </li>