@patternfly/patternfly 6.0.0-alpha.90 → 6.0.0-alpha.92

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 (259) hide show
  1. package/base/patternfly-common.css +10 -10
  2. package/base/patternfly-globals.css +3 -3
  3. package/base/patternfly-icons.css +1 -1
  4. package/base/patternfly-themes.css +53 -53
  5. package/base/patternfly-variables.css +236 -245
  6. package/base/tokens/_tokens-font.scss +0 -11
  7. package/components/AboutModalBox/about-modal-box.css +102 -102
  8. package/components/Accordion/accordion.css +118 -118
  9. package/components/ActionList/action-list.css +16 -16
  10. package/components/Alert/alert-group.css +50 -50
  11. package/components/Alert/alert.css +161 -161
  12. package/components/AppLauncher/app-launcher.css +167 -167
  13. package/components/Avatar/avatar.css +116 -116
  14. package/components/BackToTop/back-to-top.css +21 -21
  15. package/components/Backdrop/backdrop.css +9 -9
  16. package/components/BackgroundImage/background-image.css +15 -15
  17. package/components/Badge/badge.css +35 -35
  18. package/components/Banner/banner.css +114 -114
  19. package/components/Brand/brand.css +28 -28
  20. package/components/Breadcrumb/breadcrumb.css +62 -62
  21. package/components/Button/button.css +514 -514
  22. package/components/CalendarMonth/calendar-month.css +144 -144
  23. package/components/Card/card.css +230 -230
  24. package/components/Check/check.css +43 -43
  25. package/components/Chip/chip-group.css +60 -60
  26. package/components/Chip/chip.css +83 -83
  27. package/components/ClipboardCopy/clipboard-copy.css +71 -71
  28. package/components/CodeBlock/code-block.css +35 -35
  29. package/components/CodeEditor/code-editor.css +121 -121
  30. package/components/Content/content.css +216 -216
  31. package/components/ContextSelector/context-selector.css +251 -251
  32. package/components/DataList/data-list-grid.css +182 -182
  33. package/components/DataList/data-list.css +468 -468
  34. package/components/DatePicker/date-picker.css +35 -35
  35. package/components/DescriptionList/description-list-order.css +90 -90
  36. package/components/DescriptionList/description-list.css +193 -193
  37. package/components/Divider/divider.css +143 -143
  38. package/components/DragDrop/drag-drop.css +46 -46
  39. package/components/Drawer/drawer.css +474 -474
  40. package/components/Dropdown/dropdown.css +457 -457
  41. package/components/DualListSelector/dual-list-selector.css +199 -199
  42. package/components/EmptyState/empty-state.css +104 -104
  43. package/components/ExpandableSection/expandable-section.css +113 -113
  44. package/components/FileUpload/file-upload.css +32 -32
  45. package/components/Form/form.css +281 -281
  46. package/components/FormControl/form-control.css +197 -197
  47. package/components/HelperText/helper-text.css +51 -51
  48. package/components/Hint/hint.css +46 -46
  49. package/components/Icon/icon.css +218 -218
  50. package/components/InlineEdit/inline-edit.css +43 -43
  51. package/components/InputGroup/input-group.css +52 -52
  52. package/components/JumpLinks/jump-links.css +183 -183
  53. package/components/Label/label-group.css +86 -86
  54. package/components/Label/label.css +438 -438
  55. package/components/List/list.css +53 -53
  56. package/components/LogViewer/log-viewer.css +138 -138
  57. package/components/Login/login.css +139 -139
  58. package/components/Masthead/masthead.css +319 -319
  59. package/components/Menu/menu.css +415 -415
  60. package/components/MenuToggle/menu-toggle.css +275 -275
  61. package/components/ModalBox/modal-box.css +121 -121
  62. package/components/MultipleFileUpload/multiple-file-upload.css +163 -163
  63. package/components/Nav/nav.css +225 -225
  64. package/components/NotificationBadge/notification-badge.css +66 -66
  65. package/components/NotificationDrawer/notification-drawer.css +179 -179
  66. package/components/NumberInput/number-input.css +20 -20
  67. package/components/OptionsMenu/options-menu.css +190 -190
  68. package/components/OverflowMenu/overflow-menu.css +19 -19
  69. package/components/Page/page.css +598 -598
  70. package/components/Pagination/pagination.css +220 -220
  71. package/components/Panel/panel.css +72 -72
  72. package/components/Popover/popover.css +148 -148
  73. package/components/Progress/progress.css +80 -80
  74. package/components/ProgressStepper/progress-stepper.css +514 -514
  75. package/components/Radio/radio.css +44 -44
  76. package/components/Select/select.css +423 -423
  77. package/components/Sidebar/sidebar.css +166 -166
  78. package/components/SimpleList/simple-list.css +53 -53
  79. package/components/Skeleton/skeleton.css +112 -112
  80. package/components/SkipToContent/skip-to-content.css +8 -8
  81. package/components/Slider/slider.css +144 -144
  82. package/components/Spinner/spinner.css +36 -36
  83. package/components/Switch/switch.css +89 -89
  84. package/components/TabContent/tab-content.css +34 -34
  85. package/components/Table/table-grid.css +911 -911
  86. package/components/Table/table-scrollable.css +38 -38
  87. package/components/Table/table-tree-view.css +497 -497
  88. package/components/Table/table.css +660 -660
  89. package/components/Tabs/tabs.css +616 -616
  90. package/components/TextInputGroup/text-input-group.css +88 -88
  91. package/components/Tile/tile.css +68 -68
  92. package/components/Timestamp/timestamp.css +29 -29
  93. package/components/Title/title.css +87 -87
  94. package/components/ToggleGroup/toggle-group.css +86 -86
  95. package/components/Toolbar/toolbar.css +2279 -2279
  96. package/components/Tooltip/tooltip.css +85 -85
  97. package/components/TreeView/tree-view.css +363 -363
  98. package/components/Truncate/truncate.css +15 -15
  99. package/components/Wizard/wizard.css +272 -272
  100. package/docs/components/AboutModalBox/examples/AboutModalBox.md +11 -11
  101. package/docs/components/Accordion/examples/Accordion.md +188 -188
  102. package/docs/components/ActionList/examples/ActionList.md +55 -55
  103. package/docs/components/Alert/examples/Alert.md +222 -222
  104. package/docs/components/AppLauncher/deprecated/application-launcher.md +146 -146
  105. package/docs/components/Avatar/examples/Avatar.md +6 -6
  106. package/docs/components/BackToTop/examples/BackToTop.md +3 -3
  107. package/docs/components/Backdrop/examples/Backdrop.md +1 -1
  108. package/docs/components/BackgroundImage/examples/BackgroundImage.md +2 -2
  109. package/docs/components/Badge/examples/Badge.md +17 -17
  110. package/docs/components/Banner/examples/Banner.md +42 -42
  111. package/docs/components/Brand/examples/Brand.md +4 -4
  112. package/docs/components/Breadcrumb/examples/Breadcrumb.md +90 -90
  113. package/docs/components/Button/examples/Button.md +364 -364
  114. package/docs/components/CalendarMonth/examples/CalendarMonth.md +436 -436
  115. package/docs/components/Card/examples/Card.md +515 -515
  116. package/docs/components/Check/examples/Check.md +37 -37
  117. package/docs/components/Chip/examples/Chip.md +216 -216
  118. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +82 -82
  119. package/docs/components/CodeBlock/examples/CodeBlock.md +39 -39
  120. package/docs/components/CodeEditor/examples/CodeEditor.md +85 -85
  121. package/docs/components/Content/examples/Content.md +1 -1
  122. package/docs/components/ContextSelector/deprecated/context-selector.md +160 -160
  123. package/docs/components/DataList/examples/DataList.md +666 -666
  124. package/docs/components/DatePicker/examples/DatePicker.md +54 -54
  125. package/docs/components/DescriptionList/examples/DescriptionList.md +737 -737
  126. package/docs/components/Divider/examples/Divider.md +18 -18
  127. package/docs/components/DragDrop/examples/DragDrop.md +27 -27
  128. package/docs/components/Drawer/examples/Drawer.md +225 -225
  129. package/docs/components/Dropdown/deprecated/Dropdown.md +541 -541
  130. package/docs/components/DualListSelector/examples/DualListSelector.md +1012 -1012
  131. package/docs/components/EmptyState/examples/EmptyState.md +100 -100
  132. package/docs/components/ExpandableSection/examples/ExpandableSection.md +47 -47
  133. package/docs/components/FileUpload/examples/FileUpload.md +94 -94
  134. package/docs/components/Form/examples/Form.md +226 -226
  135. package/docs/components/FormControl/examples/FormControl.md +65 -65
  136. package/docs/components/HelperText/examples/HelperText.md +72 -72
  137. package/docs/components/Hint/examples/Hint.md +44 -44
  138. package/docs/components/Icon/examples/Icon.md +85 -85
  139. package/docs/components/InlineEdit/examples/InlineEdit.md +209 -209
  140. package/docs/components/InputGroup/examples/InputGroup.md +73 -73
  141. package/docs/components/JumpLinks/examples/JumpLinks.md +285 -285
  142. package/docs/components/Label/examples/Label.md +1717 -1717
  143. package/docs/components/List/examples/List.md +30 -30
  144. package/docs/components/LogViewer/examples/LogViewer.md +1785 -1785
  145. package/docs/components/Login/examples/Login.md +287 -287
  146. package/docs/components/Masthead/examples/masthead.md +39 -39
  147. package/docs/components/Menu/examples/Menu.md +2377 -2377
  148. package/docs/components/MenuToggle/examples/MenuToggle.md +242 -242
  149. package/docs/components/ModalBox/examples/ModalBox.md +119 -119
  150. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +192 -192
  151. package/docs/components/Nav/examples/Navigation.md +856 -856
  152. package/docs/components/NotificationBadge/examples/NotificationBadge.md +42 -42
  153. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +659 -659
  154. package/docs/components/NumberInput/examples/NumberInput.md +127 -127
  155. package/docs/components/OptionsMenu/deprecated/options-menu.md +178 -178
  156. package/docs/components/OverflowMenu/examples/overflow-menu.md +97 -97
  157. package/docs/components/Page/deprecated/PageHeader.md +85 -85
  158. package/docs/components/Page/examples/Page.md +90 -90
  159. package/docs/components/Pagination/examples/Pagination.md +285 -285
  160. package/docs/components/Panel/examples/Panel.md +38 -38
  161. package/docs/components/Popover/examples/Popover.md +169 -169
  162. package/docs/components/Progress/examples/Progress.md +145 -145
  163. package/docs/components/ProgressStepper/examples/ProgressStepper.md +295 -295
  164. package/docs/components/Radio/examples/Radio.md +33 -33
  165. package/docs/components/Select/deprecated/Select.md +736 -736
  166. package/docs/components/Sidebar/examples/Sidebar.md +65 -65
  167. package/docs/components/SimpleList/examples/SimpleList.md +39 -39
  168. package/docs/components/Skeleton/examples/Skeleton.md +29 -29
  169. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -3
  170. package/docs/components/Slider/examples/Slider.md +213 -213
  171. package/docs/components/Spinner/examples/Spinner.md +14 -14
  172. package/docs/components/Switch/examples/Switch.md +58 -58
  173. package/docs/components/TabContent/examples/TabContent.md +24 -24
  174. package/docs/components/Table/examples/Table.md +6982 -6982
  175. package/docs/components/Tabs/examples/Tabs.md +2114 -2114
  176. package/docs/components/TextInputGroup/examples/TextInputGroup.md +373 -373
  177. package/docs/components/Tile/examples/Tile.md +131 -131
  178. package/docs/components/Timestamp/examples/Timestamp.md +10 -10
  179. package/docs/components/Title/examples/Title.md +12 -12
  180. package/docs/components/ToggleGroup/examples/toggle-group.md +116 -116
  181. package/docs/components/Toolbar/examples/Toolbar.md +611 -611
  182. package/docs/components/Tooltip/examples/Tooltip.md +27 -27
  183. package/docs/components/TreeView/examples/TreeView.md +1166 -1166
  184. package/docs/components/Truncate/examples/Truncate.md +7 -7
  185. package/docs/components/Wizard/examples/Wizard.md +522 -522
  186. package/docs/demos/AboutModal/examples/AboutModal.md +106 -106
  187. package/docs/demos/Alert/examples/Alert.md +391 -391
  188. package/docs/demos/BackToTop/examples/BackToTop.md +175 -175
  189. package/docs/demos/Banner/examples/Banner.md +364 -364
  190. package/docs/demos/Button/examples/Button.md +50 -50
  191. package/docs/demos/Card/examples/Card.md +1054 -1054
  192. package/docs/demos/CardView/examples/CardView.md +378 -378
  193. package/docs/demos/ContextSelector/examples/ContextSelector.md +449 -449
  194. package/docs/demos/Dashboard/examples/Dashboard.md +541 -541
  195. package/docs/demos/DataList/examples/DataList.md +1148 -1148
  196. package/docs/demos/DescriptionList/examples/DescriptionList.md +544 -544
  197. package/docs/demos/Drawer/examples/Drawer.md +531 -531
  198. package/docs/demos/Form/examples/BasicForms.md +444 -444
  199. package/docs/demos/HelperText/examples/HelperText.md +51 -51
  200. package/docs/demos/JumpLinks/examples/JumpLinks.md +596 -596
  201. package/docs/demos/Masthead/examples/Masthead.md +763 -763
  202. package/docs/demos/Modal/examples/Modal.md +645 -645
  203. package/docs/demos/Nav/examples/Nav.md +649 -649
  204. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1570 -1570
  205. package/docs/demos/Page/examples/Page.md +1330 -1330
  206. package/docs/demos/Page/examples/Penta.md +217 -217
  207. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +23 -23
  208. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +108 -108
  209. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1890 -1890
  210. package/docs/demos/Skeleton/examples/Skeleton.md +176 -176
  211. package/docs/demos/Table/examples/Table.md +4580 -4580
  212. package/docs/demos/Tabs/examples/Tabs.md +1040 -1040
  213. package/docs/demos/Toolbar/examples/Toolbar.md +961 -961
  214. package/docs/demos/Wizard/examples/Wizard.md +1574 -1574
  215. package/docs/layouts/Bullseye/examples/Bullseye.md +2 -2
  216. package/docs/layouts/Flex/examples/Flex.md +290 -290
  217. package/docs/layouts/Gallery/examples/Gallery.md +48 -48
  218. package/docs/layouts/Grid/examples/Grid.md +121 -121
  219. package/docs/layouts/Level/examples/Level.md +11 -11
  220. package/docs/layouts/Split/examples/Split.md +23 -23
  221. package/docs/layouts/Stack/examples/Stack.md +8 -8
  222. package/docs/utilities/Accessibility/examples/Accessibility.md +3 -3
  223. package/docs/utilities/Alignment/examples/Alignment.md +4 -4
  224. package/docs/utilities/Display/examples/Display.md +16 -16
  225. package/docs/utilities/Flex/examples/Flex.md +53 -53
  226. package/docs/utilities/Float/examples/Float.md +2 -2
  227. package/docs/utilities/Spacing/examples/Spacing.md +16 -16
  228. package/layouts/Bullseye/bullseye.css +3 -3
  229. package/layouts/Flex/flex.css +1276 -1276
  230. package/layouts/Gallery/gallery.css +34 -34
  231. package/layouts/Grid/grid.css +531 -531
  232. package/layouts/Level/level.css +4 -4
  233. package/layouts/Split/split.css +6 -6
  234. package/layouts/Stack/stack.css +5 -5
  235. package/package.json +5 -5
  236. package/patternfly-addons.css +2989 -2989
  237. package/patternfly-base-no-globals-theme-dark-unversioned.css +269 -278
  238. package/patternfly-base-no-globals.css +284 -293
  239. package/patternfly-base-theme-dark-unversioned.css +271 -280
  240. package/patternfly-base.css +286 -295
  241. package/patternfly-charts-theme-dark-unversioned.css +66 -66
  242. package/patternfly-charts-theme-dark.css +66 -66
  243. package/patternfly-charts.css +320 -320
  244. package/patternfly-no-globals.css +20217 -20226
  245. package/patternfly-theme-dark-unversioned.css +20209 -20218
  246. package/patternfly.css +20219 -20228
  247. package/patternfly.min.css +1 -1
  248. package/patternfly.min.css.map +1 -1
  249. package/sass-utilities/_init.scss +1 -1
  250. package/utilities/Accessibility/accessibility.css +18 -18
  251. package/utilities/Alignment/alignment.css +24 -24
  252. package/utilities/BackgroundColor/BackgroundColor.css +252 -252
  253. package/utilities/BoxShadow/box-shadow.css +42 -42
  254. package/utilities/Display/display.css +54 -54
  255. package/utilities/Flex/flex.css +228 -228
  256. package/utilities/Float/float.css +12 -12
  257. package/utilities/Sizing/sizing.css +216 -216
  258. package/utilities/Spacing/spacing.css +1512 -1512
  259. package/utilities/Text/text.css +631 -631
package/docs/components/Spinner/examples/Spinner.md CHANGED
@@ -8,12 +8,12 @@ cssPrefix: pf-v5-c-spinner
8
8
 
9
9
  ```html
10
10
  <svg
11
- class="pf-v5-c-spinner"
11
+ class="pf-v6-c-spinner"
12
12
  role="progressbar"
13
13
  viewBox="0 0 100 100"
14
14
  aria-label="Loading..."
15
15
  >
16
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
16
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
17
17
  </svg>
18
18
 
19
19
  ```
@@ -22,39 +22,39 @@ cssPrefix: pf-v5-c-spinner
22
22
 
23
23
  ```html
24
24
  <svg
25
- class="pf-v5-c-spinner pf-m-sm"
25
+ class="pf-v6-c-spinner pf-m-sm"
26
26
  role="progressbar"
27
27
  viewBox="0 0 100 100"
28
28
  aria-label="Loading..."
29
29
  >
30
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
30
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
31
31
  </svg>
32
32
 
33
33
  <svg
34
- class="pf-v5-c-spinner pf-m-md"
34
+ class="pf-v6-c-spinner pf-m-md"
35
35
  role="progressbar"
36
36
  viewBox="0 0 100 100"
37
37
  aria-label="Loading..."
38
38
  >
39
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
39
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
40
40
  </svg>
41
41
 
42
42
  <svg
43
- class="pf-v5-c-spinner pf-m-lg"
43
+ class="pf-v6-c-spinner pf-m-lg"
44
44
  role="progressbar"
45
45
  viewBox="0 0 100 100"
46
46
  aria-label="Loading..."
47
47
  >
48
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
48
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
49
49
  </svg>
50
50
 
51
51
  <svg
52
- class="pf-v5-c-spinner pf-m-xl"
52
+ class="pf-v6-c-spinner pf-m-xl"
53
53
  role="progressbar"
54
54
  viewBox="0 0 100 100"
55
55
  aria-label="Loading..."
56
56
  >
57
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
57
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
58
58
  </svg>
59
59
 
60
60
  ```
@@ -65,12 +65,12 @@ An inline spinner inherits its font-size, so its size will match the content aro
65
65
 
66
66
  ```html isBeta
67
67
  <svg
68
- class="pf-v5-c-spinner pf-m-inline"
68
+ class="pf-v6-c-spinner pf-m-inline"
69
69
  role="progressbar"
70
70
  viewBox="0 0 100 100"
71
71
  aria-label="Loading..."
72
72
  >
73
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
73
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
74
74
  </svg>
75
75
 
76
76
  ```
@@ -79,13 +79,13 @@ An inline spinner inherits its font-size, so its size will match the content aro
79
79
 
80
80
  ```html
81
81
  <svg
82
- class="pf-v5-c-spinner"
82
+ class="pf-v6-c-spinner"
83
83
  role="progressbar"
84
84
  viewBox="0 0 100 100"
85
85
  aria-label="Loading..."
86
86
  style="--pf-v5-c-spinner--diameter: 80px;"
87
87
  >
88
- <circle class="pf-v5-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
88
+ <circle class="pf-v6-c-spinner__path" cx="50" cy="50" r="45" fill="none" />
89
89
  </svg>
90
90
 
91
91
  ```
package/docs/components/Switch/examples/Switch.md CHANGED
@@ -7,25 +7,25 @@ cssPrefix: pf-v5-c-switch
7
7
  ### Basic
8
8
 
9
9
  ```html
10
- <label class="pf-v5-c-switch" for="switch-with-label-1">
10
+ <label class="pf-v6-c-switch" for="switch-with-label-1">
11
11
  <input
12
- class="pf-v5-c-switch__input"
12
+ class="pf-v6-c-switch__input"
13
13
  type="checkbox"
14
14
  id="switch-with-label-1"
15
15
  aria-labelledby="switch-with-label-1-on"
16
16
  checked
17
17
  />
18
18
 
19
- <span class="pf-v5-c-switch__toggle"></span>
19
+ <span class="pf-v6-c-switch__toggle"></span>
20
20
 
21
21
  <span
22
- class="pf-v5-c-switch__label pf-m-on"
22
+ class="pf-v6-c-switch__label pf-m-on"
23
23
  id="switch-with-label-1-on"
24
24
  aria-hidden="true"
25
25
  >Message when on</span>
26
26
 
27
27
  <span
28
- class="pf-v5-c-switch__label pf-m-off"
28
+ class="pf-v6-c-switch__label pf-m-off"
29
29
  id="switch-with-label-1-off"
30
30
  aria-hidden="true"
31
31
  >Message when off</span>
@@ -33,23 +33,23 @@ cssPrefix: pf-v5-c-switch
33
33
 
34
34
  <br />
35
35
  <br />
36
- <label class="pf-v5-c-switch" for="switch-with-label-2">
36
+ <label class="pf-v6-c-switch" for="switch-with-label-2">
37
37
  <input
38
- class="pf-v5-c-switch__input"
38
+ class="pf-v6-c-switch__input"
39
39
  type="checkbox"
40
40
  id="switch-with-label-2"
41
41
  aria-labelledby="switch-with-label-2-on"
42
42
  />
43
- <span class="pf-v5-c-switch__toggle"></span>
43
+ <span class="pf-v6-c-switch__toggle"></span>
44
44
 
45
45
  <span
46
- class="pf-v5-c-switch__label pf-m-on"
46
+ class="pf-v6-c-switch__label pf-m-on"
47
47
  id="switch-with-label-2-on"
48
48
  aria-hidden="true"
49
49
  >Message when on</span>
50
50
 
51
51
  <span
52
- class="pf-v5-c-switch__label pf-m-off"
52
+ class="pf-v6-c-switch__label pf-m-off"
53
53
  id="switch-with-label-2-off"
54
54
  aria-hidden="true"
55
55
  >Message when off</span>
@@ -60,25 +60,25 @@ cssPrefix: pf-v5-c-switch
60
60
  ### Reverse (toggle on right)
61
61
 
62
62
  ```html
63
- <label class="pf-v5-c-switch pf-m-reverse" for="switch-reverse-1">
63
+ <label class="pf-v6-c-switch pf-m-reverse" for="switch-reverse-1">
64
64
  <input
65
- class="pf-v5-c-switch__input"
65
+ class="pf-v6-c-switch__input"
66
66
  type="checkbox"
67
67
  id="switch-reverse-1"
68
68
  aria-labelledby="switch-reverse-1-on"
69
69
  checked
70
70
  />
71
71
 
72
- <span class="pf-v5-c-switch__toggle"></span>
72
+ <span class="pf-v6-c-switch__toggle"></span>
73
73
 
74
74
  <span
75
- class="pf-v5-c-switch__label pf-m-on"
75
+ class="pf-v6-c-switch__label pf-m-on"
76
76
  id="switch-reverse-1-on"
77
77
  aria-hidden="true"
78
78
  >Message when on</span>
79
79
 
80
80
  <span
81
- class="pf-v5-c-switch__label pf-m-off"
81
+ class="pf-v6-c-switch__label pf-m-off"
82
82
  id="switch-reverse-1-off"
83
83
  aria-hidden="true"
84
84
  >Message when off</span>
@@ -86,23 +86,23 @@ cssPrefix: pf-v5-c-switch
86
86
 
87
87
  <br />
88
88
  <br />
89
- <label class="pf-v5-c-switch pf-m-reverse" for="switch-reverse-2">
89
+ <label class="pf-v6-c-switch pf-m-reverse" for="switch-reverse-2">
90
90
  <input
91
- class="pf-v5-c-switch__input"
91
+ class="pf-v6-c-switch__input"
92
92
  type="checkbox"
93
93
  id="switch-reverse-2"
94
94
  aria-labelledby="switch-reverse-2-on"
95
95
  />
96
- <span class="pf-v5-c-switch__toggle"></span>
96
+ <span class="pf-v6-c-switch__toggle"></span>
97
97
 
98
98
  <span
99
- class="pf-v5-c-switch__label pf-m-on"
99
+ class="pf-v6-c-switch__label pf-m-on"
100
100
  id="switch-reverse-2-on"
101
101
  aria-hidden="true"
102
102
  >Message when on</span>
103
103
 
104
104
  <span
105
- class="pf-v5-c-switch__label pf-m-off"
105
+ class="pf-v6-c-switch__label pf-m-off"
106
106
  id="switch-reverse-2-off"
107
107
  aria-hidden="true"
108
108
  >Message when off</span>
@@ -113,28 +113,28 @@ cssPrefix: pf-v5-c-switch
113
113
  ### Label and check
114
114
 
115
115
  ```html
116
- <label class="pf-v5-c-switch" for="switch-label-check-1">
116
+ <label class="pf-v6-c-switch" for="switch-label-check-1">
117
117
  <input
118
- class="pf-v5-c-switch__input"
118
+ class="pf-v6-c-switch__input"
119
119
  type="checkbox"
120
120
  id="switch-label-check-1"
121
121
  aria-labelledby="switch-label-check-1-on"
122
122
  checked
123
123
  />
124
124
 
125
- <span class="pf-v5-c-switch__toggle">
126
- <span class="pf-v5-c-switch__toggle-icon">
125
+ <span class="pf-v6-c-switch__toggle">
126
+ <span class="pf-v6-c-switch__toggle-icon">
127
127
  <i class="fas fa-check" aria-hidden="true"></i>
128
128
  </span>
129
129
  </span>
130
130
  <span
131
- class="pf-v5-c-switch__label pf-m-on"
131
+ class="pf-v6-c-switch__label pf-m-on"
132
132
  id="switch-label-check-1-on"
133
133
  aria-hidden="true"
134
134
  >Message when on</span>
135
135
 
136
136
  <span
137
- class="pf-v5-c-switch__label pf-m-off"
137
+ class="pf-v6-c-switch__label pf-m-off"
138
138
  id="switch-label-check-1-off"
139
139
  aria-hidden="true"
140
140
  >Message when off</span>
@@ -142,27 +142,27 @@ cssPrefix: pf-v5-c-switch
142
142
 
143
143
  <br />
144
144
  <br />
145
- <label class="pf-v5-c-switch" for="switch-label-check-2">
145
+ <label class="pf-v6-c-switch" for="switch-label-check-2">
146
146
  <input
147
- class="pf-v5-c-switch__input"
147
+ class="pf-v6-c-switch__input"
148
148
  type="checkbox"
149
149
  id="switch-label-check-2"
150
150
  aria-labelledby="switch-label-check-2-off"
151
151
  />
152
152
 
153
- <span class="pf-v5-c-switch__toggle">
154
- <span class="pf-v5-c-switch__toggle-icon">
153
+ <span class="pf-v6-c-switch__toggle">
154
+ <span class="pf-v6-c-switch__toggle-icon">
155
155
  <i class="fas fa-check" aria-hidden="true"></i>
156
156
  </span>
157
157
  </span>
158
158
  <span
159
- class="pf-v5-c-switch__label pf-m-on"
159
+ class="pf-v6-c-switch__label pf-m-on"
160
160
  id="switch-label-check-2-on"
161
161
  aria-hidden="true"
162
162
  >Message when on</span>
163
163
 
164
164
  <span
165
- class="pf-v5-c-switch__label pf-m-off"
165
+ class="pf-v6-c-switch__label pf-m-off"
166
166
  id="switch-label-check-2-off"
167
167
  aria-hidden="true"
168
168
  >Message when off</span>
@@ -173,17 +173,17 @@ cssPrefix: pf-v5-c-switch
173
173
  ### Without label
174
174
 
175
175
  ```html
176
- <label class="pf-v5-c-switch" for="switch-with-icon-1">
176
+ <label class="pf-v6-c-switch" for="switch-with-icon-1">
177
177
  <input
178
- class="pf-v5-c-switch__input"
178
+ class="pf-v6-c-switch__input"
179
179
  type="checkbox"
180
180
  id="switch-with-icon-1"
181
181
  aria-label="switch is off"
182
182
  checked
183
183
  />
184
184
 
185
- <span class="pf-v5-c-switch__toggle">
186
- <span class="pf-v5-c-switch__toggle-icon">
185
+ <span class="pf-v6-c-switch__toggle">
186
+ <span class="pf-v6-c-switch__toggle-icon">
187
187
  <i class="fas fa-check" aria-hidden="true"></i>
188
188
  </span>
189
189
  </span>
@@ -191,15 +191,15 @@ cssPrefix: pf-v5-c-switch
191
191
 
192
192
  <br />
193
193
  <br />
194
- <label class="pf-v5-c-switch" for="switch-with-icon-2">
194
+ <label class="pf-v6-c-switch" for="switch-with-icon-2">
195
195
  <input
196
- class="pf-v5-c-switch__input"
196
+ class="pf-v6-c-switch__input"
197
197
  type="checkbox"
198
198
  id="switch-with-icon-2"
199
199
  aria-label="switch is off"
200
200
  />
201
- <span class="pf-v5-c-switch__toggle">
202
- <span class="pf-v5-c-switch__toggle-icon">
201
+ <span class="pf-v6-c-switch__toggle">
202
+ <span class="pf-v6-c-switch__toggle-icon">
203
203
  <i class="fas fa-check" aria-hidden="true"></i>
204
204
  </span>
205
205
  </span>
@@ -210,9 +210,9 @@ cssPrefix: pf-v5-c-switch
210
210
  ### Disabled
211
211
 
212
212
  ```html
213
- <label class="pf-v5-c-switch" for="switch-disabled-1">
213
+ <label class="pf-v6-c-switch" for="switch-disabled-1">
214
214
  <input
215
- class="pf-v5-c-switch__input"
215
+ class="pf-v6-c-switch__input"
216
216
  type="checkbox"
217
217
  id="switch-disabled-1"
218
218
  aria-labelledby="switch-disabled-1-on"
@@ -220,16 +220,16 @@ cssPrefix: pf-v5-c-switch
220
220
  checked
221
221
  />
222
222
 
223
- <span class="pf-v5-c-switch__toggle"></span>
223
+ <span class="pf-v6-c-switch__toggle"></span>
224
224
 
225
225
  <span
226
- class="pf-v5-c-switch__label pf-m-on"
226
+ class="pf-v6-c-switch__label pf-m-on"
227
227
  id="switch-disabled-1-on"
228
228
  aria-hidden="true"
229
229
  >Message when on</span>
230
230
 
231
231
  <span
232
- class="pf-v5-c-switch__label pf-m-off"
232
+ class="pf-v6-c-switch__label pf-m-off"
233
233
  id="switch-disabled-1-off"
234
234
  aria-hidden="true"
235
235
  >Message when off</span>
@@ -237,25 +237,25 @@ cssPrefix: pf-v5-c-switch
237
237
 
238
238
  <br />
239
239
  <br />
240
- <label class="pf-v5-c-switch" for="switch-disabled-2">
240
+ <label class="pf-v6-c-switch" for="switch-disabled-2">
241
241
  <input
242
- class="pf-v5-c-switch__input"
242
+ class="pf-v6-c-switch__input"
243
243
  type="checkbox"
244
244
  id="switch-disabled-2"
245
245
  aria-labelledby="switch-disabled-2-on"
246
246
  disabled
247
247
  />
248
248
 
249
- <span class="pf-v5-c-switch__toggle"></span>
249
+ <span class="pf-v6-c-switch__toggle"></span>
250
250
 
251
251
  <span
252
- class="pf-v5-c-switch__label pf-m-on"
252
+ class="pf-v6-c-switch__label pf-m-on"
253
253
  id="switch-disabled-2-on"
254
254
  aria-hidden="true"
255
255
  >Message when on</span>
256
256
 
257
257
  <span
258
- class="pf-v5-c-switch__label pf-m-off"
258
+ class="pf-v6-c-switch__label pf-m-off"
259
259
  id="switch-disabled-2-off"
260
260
  aria-hidden="true"
261
261
  >Message when off</span>
@@ -263,9 +263,9 @@ cssPrefix: pf-v5-c-switch
263
263
 
264
264
  <br />
265
265
  <br />
266
- <label class="pf-v5-c-switch" for="switch-with-icon-disabled-1">
266
+ <label class="pf-v6-c-switch" for="switch-with-icon-disabled-1">
267
267
  <input
268
- class="pf-v5-c-switch__input"
268
+ class="pf-v6-c-switch__input"
269
269
  type="checkbox"
270
270
  id="switch-with-icon-disabled-1"
271
271
  aria-label="switch is off"
@@ -273,8 +273,8 @@ cssPrefix: pf-v5-c-switch
273
273
  checked
274
274
  />
275
275
 
276
- <span class="pf-v5-c-switch__toggle">
277
- <span class="pf-v5-c-switch__toggle-icon">
276
+ <span class="pf-v6-c-switch__toggle">
277
+ <span class="pf-v6-c-switch__toggle-icon">
278
278
  <i class="fas fa-check" aria-hidden="true"></i>
279
279
  </span>
280
280
  </span>
@@ -282,16 +282,16 @@ cssPrefix: pf-v5-c-switch
282
282
 
283
283
  <br />
284
284
  <br />
285
- <label class="pf-v5-c-switch" for="switch-with-icon-disabled-2">
285
+ <label class="pf-v6-c-switch" for="switch-with-icon-disabled-2">
286
286
  <input
287
- class="pf-v5-c-switch__input"
287
+ class="pf-v6-c-switch__input"
288
288
  type="checkbox"
289
289
  id="switch-with-icon-disabled-2"
290
290
  aria-label="switch is off"
291
291
  disabled
292
292
  />
293
- <span class="pf-v5-c-switch__toggle">
294
- <span class="pf-v5-c-switch__toggle-icon">
293
+ <span class="pf-v6-c-switch__toggle">
294
+ <span class="pf-v6-c-switch__toggle-icon">
295
295
  <i class="fas fa-check" aria-hidden="true"></i>
296
296
  </span>
297
297
  </span>
package/docs/components/TabContent/examples/TabContent.md CHANGED
@@ -8,39 +8,39 @@ cssPrefix: pf-v5-c-tab-content
8
8
 
9
9
  ```html
10
10
  <section
11
- class="pf-v5-c-tab-content"
11
+ class="pf-v6-c-tab-content"
12
12
  id="basic-tab1-panel"
13
13
  role="tabpanel"
14
14
  tabindex="0"
15
15
  >
16
- <div class="pf-v5-c-tab-content__body">Panel 1</div>
16
+ <div class="pf-v6-c-tab-content__body">Panel 1</div>
17
17
  </section>
18
18
  <section
19
- class="pf-v5-c-tab-content"
19
+ class="pf-v6-c-tab-content"
20
20
  id="basic-tab2-panel"
21
21
  role="tabpanel"
22
22
  tabindex="0"
23
23
  hidden
24
24
  >
25
- <div class="pf-v5-c-tab-content__body">Panel 2</div>
25
+ <div class="pf-v6-c-tab-content__body">Panel 2</div>
26
26
  </section>
27
27
  <section
28
- class="pf-v5-c-tab-content"
28
+ class="pf-v6-c-tab-content"
29
29
  id="basic-tab3-panel"
30
30
  role="tabpanel"
31
31
  tabindex="0"
32
32
  hidden
33
33
  >
34
- <div class="pf-v5-c-tab-content__body">Panel 3</div>
34
+ <div class="pf-v6-c-tab-content__body">Panel 3</div>
35
35
  </section>
36
36
  <section
37
- class="pf-v5-c-tab-content"
37
+ class="pf-v6-c-tab-content"
38
38
  id="basic-tab4-panel"
39
39
  role="tabpanel"
40
40
  tabindex="0"
41
41
  hidden
42
42
  >
43
- <div class="pf-v5-c-tab-content__body">Panel 4</div>
43
+ <div class="pf-v6-c-tab-content__body">Panel 4</div>
44
44
  </section>
45
45
 
46
46
  ```
@@ -49,39 +49,39 @@ cssPrefix: pf-v5-c-tab-content
49
49
 
50
50
  ```html
51
51
  <section
52
- class="pf-v5-c-tab-content"
52
+ class="pf-v6-c-tab-content"
53
53
  id="tab1-panel-with-padding"
54
54
  role="tabpanel"
55
55
  tabindex="0"
56
56
  >
57
- <div class="pf-v5-c-tab-content__body pf-m-padding">Panel 1</div>
57
+ <div class="pf-v6-c-tab-content__body pf-m-padding">Panel 1</div>
58
58
  </section>
59
59
  <section
60
- class="pf-v5-c-tab-content"
60
+ class="pf-v6-c-tab-content"
61
61
  id="tab2-panel-with-padding"
62
62
  role="tabpanel"
63
63
  tabindex="0"
64
64
  hidden
65
65
  >
66
- <div class="pf-v5-c-tab-content__body pf-m-padding">Panel 2</div>
66
+ <div class="pf-v6-c-tab-content__body pf-m-padding">Panel 2</div>
67
67
  </section>
68
68
  <section
69
- class="pf-v5-c-tab-content"
69
+ class="pf-v6-c-tab-content"
70
70
  id="tab3-panel-with-padding"
71
71
  role="tabpanel"
72
72
  tabindex="0"
73
73
  hidden
74
74
  >
75
- <div class="pf-v5-c-tab-content__body pf-m-padding">Panel 3</div>
75
+ <div class="pf-v6-c-tab-content__body pf-m-padding">Panel 3</div>
76
76
  </section>
77
77
  <section
78
- class="pf-v5-c-tab-content"
78
+ class="pf-v6-c-tab-content"
79
79
  id="tab4-panel-with-padding"
80
80
  role="tabpanel"
81
81
  tabindex="0"
82
82
  hidden
83
83
  >
84
- <div class="pf-v5-c-tab-content__body pf-m-padding">Panel 4</div>
84
+ <div class="pf-v6-c-tab-content__body pf-m-padding">Panel 4</div>
85
85
  </section>
86
86
 
87
87
  ```
@@ -90,39 +90,39 @@ cssPrefix: pf-v5-c-tab-content
90
90
 
91
91
  ```html
92
92
  <section
93
- class="pf-v5-c-tab-content pf-m-secondary"
93
+ class="pf-v6-c-tab-content pf-m-secondary"
94
94
  id="secondary-tab1-panel"
95
95
  role="tabpanel"
96
96
  tabindex="0"
97
97
  >
98
- <div class="pf-v5-c-tab-content__body">Panel 1</div>
98
+ <div class="pf-v6-c-tab-content__body">Panel 1</div>
99
99
  </section>
100
100
  <section
101
- class="pf-v5-c-tab-content pf-m-secondary"
101
+ class="pf-v6-c-tab-content pf-m-secondary"
102
102
  id="secondary-tab2-panel"
103
103
  role="tabpanel"
104
104
  tabindex="0"
105
105
  hidden
106
106
  >
107
- <div class="pf-v5-c-tab-content__body">Panel 2</div>
107
+ <div class="pf-v6-c-tab-content__body">Panel 2</div>
108
108
  </section>
109
109
  <section
110
- class="pf-v5-c-tab-content pf-m-secondary"
110
+ class="pf-v6-c-tab-content pf-m-secondary"
111
111
  id="secondary-tab3-panel"
112
112
  role="tabpanel"
113
113
  tabindex="0"
114
114
  hidden
115
115
  >
116
- <div class="pf-v5-c-tab-content__body">Panel 3</div>
116
+ <div class="pf-v6-c-tab-content__body">Panel 3</div>
117
117
  </section>
118
118
  <section
119
- class="pf-v5-c-tab-content pf-m-secondary"
119
+ class="pf-v6-c-tab-content pf-m-secondary"
120
120
  id="secondary-tab4-panel"
121
121
  role="tabpanel"
122
122
  tabindex="0"
123
123
  hidden
124
124
  >
125
- <div class="pf-v5-c-tab-content__body">Panel 4</div>
125
+ <div class="pf-v6-c-tab-content__body">Panel 4</div>
126
126
  </section>
127
127
 
128
128
  ```