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

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 +1 -1
  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
@@ -6,16 +6,16 @@ section: components
6
6
  ### Provide a generated password
7
7
 
8
8
  ```html
9
- <form class="pf-v5-c-form" novalidate>
10
- <div class="pf-v5-c-form__group">
11
- <div class="pf-v5-c-form__group-label pf-m-info">
12
- <div class="pf-v5-c-form__group-label-main"><label
13
- class="pf-v5-c-form__label"
9
+ <form class="pf-v6-c-form" novalidate>
10
+ <div class="pf-v6-c-form__group">
11
+ <div class="pf-v6-c-form__group-label pf-m-info">
12
+ <div class="pf-v6-c-form__group-label-main"><label
13
+ class="pf-v6-c-form__label"
14
14
  for="password-generator-demo--initial-password"
15
15
  >
16
- <span class="pf-v5-c-form__label-text">Password</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
16
+ <span class="pf-v6-c-form__label-text">Password</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
17
17
  <span
18
- class="pf-v5-c-button pf-m-no-padding pf-m-plain"
18
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
19
19
  type="button"
20
20
  role="button"
21
21
  tabindex="0"
@@ -25,12 +25,12 @@ section: components
25
25
  <i class="fas fa-question-circle" aria-hidden="true"></i>
26
26
  </span></span>
27
27
  </div>
28
- <div class="pf-v5-c-form__group-label-info"></div>
28
+ <div class="pf-v6-c-form__group-label-info"></div>
29
29
  </div>
30
- <div class="pf-v5-c-form__group-control">
31
- <div class="pf-v5-c-input-group">
32
- <div class="pf-v5-c-input-group__item pf-m-fill">
33
- <span class="pf-v5-c-form-control pf-m-required">
30
+ <div class="pf-v6-c-form__group-control">
31
+ <div class="pf-v6-c-input-group">
32
+ <div class="pf-v6-c-input-group__item pf-m-fill">
33
+ <span class="pf-v6-c-form-control pf-m-required">
34
34
  <input
35
35
  required
36
36
  type="password"
@@ -42,9 +42,9 @@ section: components
42
42
  />
43
43
  </span>
44
44
  </div>
45
- <div class="pf-v5-c-input-group__item">
45
+ <div class="pf-v6-c-input-group__item">
46
46
  <button
47
- class="pf-v5-c-button pf-m-control"
47
+ class="pf-v6-c-button pf-m-control"
48
48
  type="button"
49
49
  aria-label="Show password"
50
50
  >
@@ -52,20 +52,20 @@ section: components
52
52
  </button>
53
53
  </div>
54
54
  </div>
55
- <div class="pf-v5-c-menu">
56
- <div class="pf-v5-c-menu__content">
57
- <ul class="pf-v5-c-menu__list" role="menu">
58
- <li class="pf-v5-c-menu__list-item" role="none">
59
- <button class="pf-v5-c-menu__item" type="button" role="menuitem">
60
- <span class="pf-v5-c-menu__item-main">
55
+ <div class="pf-v6-c-menu">
56
+ <div class="pf-v6-c-menu__content">
57
+ <ul class="pf-v6-c-menu__list" role="menu">
58
+ <li class="pf-v6-c-menu__list-item" role="none">
59
+ <button class="pf-v6-c-menu__item" type="button" role="menuitem">
60
+ <span class="pf-v6-c-menu__item-main">
61
61
  <span
62
- class="pf-v5-c-menu__item-text"
62
+ class="pf-v6-c-menu__item-text"
63
63
  >Use suggested password: fqu9kKe676JmKt2</span>
64
64
  </span>
65
65
  </button>
66
- <div class="pf-v5-c-menu__item-action">
66
+ <div class="pf-v6-c-menu__item-action">
67
67
  <button
68
- class="pf-v5-c-button pf-m-plain"
68
+ class="pf-v6-c-button pf-m-plain"
69
69
  type="button"
70
70
  role="menuitem"
71
71
  aria-label="Generate a new suggested password"
@@ -6,16 +6,16 @@ section: components
6
6
  ### Initial state
7
7
 
8
8
  ```html
9
- <form class="pf-v5-c-form" novalidate>
10
- <div class="pf-v5-c-form__group">
11
- <div class="pf-v5-c-form__group-label pf-m-info">
12
- <div class="pf-v5-c-form__group-label-main"><label
13
- class="pf-v5-c-form__label"
9
+ <form class="pf-v6-c-form" novalidate>
10
+ <div class="pf-v6-c-form__group">
11
+ <div class="pf-v6-c-form__group-label pf-m-info">
12
+ <div class="pf-v6-c-form__group-label-main"><label
13
+ class="pf-v6-c-form__label"
14
14
  for="password-strength-demo--initial-password"
15
15
  >
16
- <span class="pf-v5-c-form__label-text">Password</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
16
+ <span class="pf-v6-c-form__label-text">Password</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
17
17
  <span
18
- class="pf-v5-c-button pf-m-no-padding pf-m-plain"
18
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
19
19
  type="button"
20
20
  role="button"
21
21
  tabindex="0"
@@ -25,12 +25,12 @@ section: components
25
25
  <i class="fas fa-question-circle" aria-hidden="true"></i>
26
26
  </span></span>
27
27
  </div>
28
- <div class="pf-v5-c-form__group-label-info"></div>
28
+ <div class="pf-v6-c-form__group-label-info"></div>
29
29
  </div>
30
- <div class="pf-v5-c-form__group-control">
31
- <div class="pf-v5-c-input-group">
32
- <div class="pf-v5-c-input-group__item pf-m-fill">
33
- <span class="pf-v5-c-form-control pf-m-required">
30
+ <div class="pf-v6-c-form__group-control">
31
+ <div class="pf-v6-c-input-group">
32
+ <div class="pf-v6-c-input-group__item pf-m-fill">
33
+ <span class="pf-v6-c-form-control pf-m-required">
34
34
  <input
35
35
  required
36
36
  type="text"
@@ -42,9 +42,9 @@ section: components
42
42
  />
43
43
  </span>
44
44
  </div>
45
- <div class="pf-v5-c-input-group__item">
45
+ <div class="pf-v6-c-input-group__item">
46
46
  <button
47
- class="pf-v5-c-button pf-m-control"
47
+ class="pf-v6-c-button pf-m-control"
48
48
  type="button"
49
49
  aria-label="Show password"
50
50
  >
@@ -52,36 +52,36 @@ section: components
52
52
  </button>
53
53
  </div>
54
54
  </div>
55
- <div class="pf-v5-c-form__helper-text" aria-live="polite">
56
- <div class="pf-v5-c-helper-text">
55
+ <div class="pf-v6-c-form__helper-text" aria-live="polite">
56
+ <div class="pf-v6-c-helper-text">
57
57
  <div
58
- class="pf-v5-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
58
+ class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
59
59
  >
60
- <span class="pf-v5-c-helper-text__item-icon">
60
+ <span class="pf-v6-c-helper-text__item-icon">
61
61
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
62
62
  </span>
63
63
  <span
64
- class="pf-v5-c-helper-text__item-text"
64
+ class="pf-v6-c-helper-text__item-text"
65
65
  >Must be at least 14 characters</span>
66
66
  </div>
67
67
  <div
68
- class="pf-v5-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
68
+ class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
69
69
  >
70
- <span class="pf-v5-c-helper-text__item-icon">
70
+ <span class="pf-v6-c-helper-text__item-icon">
71
71
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
72
72
  </span>
73
73
  <span
74
- class="pf-v5-c-helper-text__item-text"
74
+ class="pf-v6-c-helper-text__item-text"
75
75
  >Cannot contain the word "redhat"</span>
76
76
  </div>
77
77
  <div
78
- class="pf-v5-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
78
+ class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
79
79
  >
80
- <span class="pf-v5-c-helper-text__item-icon">
80
+ <span class="pf-v6-c-helper-text__item-icon">
81
81
  <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
82
82
  </span>
83
83
  <span
84
- class="pf-v5-c-helper-text__item-text"
84
+ class="pf-v6-c-helper-text__item-text"
85
85
  >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
86
86
  </div>
87
87
  </div>
@@ -95,16 +95,16 @@ section: components
95
95
  ### Invalid password
96
96
 
97
97
  ```html
98
- <form class="pf-v5-c-form" novalidate>
99
- <div class="pf-v5-c-form__group">
100
- <div class="pf-v5-c-form__group-label pf-m-info">
101
- <div class="pf-v5-c-form__group-label-main"><label
102
- class="pf-v5-c-form__label"
98
+ <form class="pf-v6-c-form" novalidate>
99
+ <div class="pf-v6-c-form__group">
100
+ <div class="pf-v6-c-form__group-label pf-m-info">
101
+ <div class="pf-v6-c-form__group-label-main"><label
102
+ class="pf-v6-c-form__label"
103
103
  for="password-strength-demo--invalid-password"
104
104
  >
105
- <span class="pf-v5-c-form__label-text">Password</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
105
+ <span class="pf-v6-c-form__label-text">Password</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
106
106
  <span
107
- class="pf-v5-c-button pf-m-no-padding pf-m-plain"
107
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
108
108
  type="button"
109
109
  role="button"
110
110
  tabindex="0"
@@ -114,12 +114,12 @@ section: components
114
114
  <i class="fas fa-question-circle" aria-hidden="true"></i>
115
115
  </span></span>
116
116
  </div>
117
- <div class="pf-v5-c-form__group-label-info"></div>
117
+ <div class="pf-v6-c-form__group-label-info"></div>
118
118
  </div>
119
- <div class="pf-v5-c-form__group-control">
120
- <div class="pf-v5-c-input-group">
121
- <div class="pf-v5-c-input-group__item pf-m-fill">
122
- <span class="pf-v5-c-form-control pf-m-required">
119
+ <div class="pf-v6-c-form__group-control">
120
+ <div class="pf-v6-c-input-group">
121
+ <div class="pf-v6-c-input-group__item pf-m-fill">
122
+ <span class="pf-v6-c-form-control pf-m-required">
123
123
  <input
124
124
  required
125
125
  type="text"
@@ -131,9 +131,9 @@ section: components
131
131
  />
132
132
  </span>
133
133
  </div>
134
- <div class="pf-v5-c-input-group__item">
134
+ <div class="pf-v6-c-input-group__item">
135
135
  <button
136
- class="pf-v5-c-button pf-m-control"
136
+ class="pf-v6-c-button pf-m-control"
137
137
  type="button"
138
138
  aria-label="Show password"
139
139
  >
@@ -141,30 +141,30 @@ section: components
141
141
  </button>
142
142
  </div>
143
143
  </div>
144
- <div class="pf-v5-c-form__helper-text" aria-live="polite">
145
- <div class="pf-v5-c-helper-text">
146
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
147
- <span class="pf-v5-c-helper-text__item-icon">
144
+ <div class="pf-v6-c-form__helper-text" aria-live="polite">
145
+ <div class="pf-v6-c-helper-text">
146
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
147
+ <span class="pf-v6-c-helper-text__item-icon">
148
148
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
149
149
  </span>
150
150
  <span
151
- class="pf-v5-c-helper-text__item-text"
151
+ class="pf-v6-c-helper-text__item-text"
152
152
  >Must be at least 14 characters</span>
153
153
  </div>
154
- <div class="pf-v5-c-helper-text__item pf-m-error pf-m-dynamic">
155
- <span class="pf-v5-c-helper-text__item-icon">
154
+ <div class="pf-v6-c-helper-text__item pf-m-error pf-m-dynamic">
155
+ <span class="pf-v6-c-helper-text__item-icon">
156
156
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
157
157
  </span>
158
158
  <span
159
- class="pf-v5-c-helper-text__item-text"
159
+ class="pf-v6-c-helper-text__item-text"
160
160
  >Cannot contain the word "redhat"</span>
161
161
  </div>
162
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
163
- <span class="pf-v5-c-helper-text__item-icon">
162
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
163
+ <span class="pf-v6-c-helper-text__item-icon">
164
164
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
165
165
  </span>
166
166
  <span
167
- class="pf-v5-c-helper-text__item-text"
167
+ class="pf-v6-c-helper-text__item-text"
168
168
  >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
169
169
  </div>
170
170
  </div>
@@ -178,16 +178,16 @@ section: components
178
178
  ### Valid, weak password
179
179
 
180
180
  ```html
181
- <form class="pf-v5-c-form" novalidate>
182
- <div class="pf-v5-c-form__group">
183
- <div class="pf-v5-c-form__group-label pf-m-info">
184
- <div class="pf-v5-c-form__group-label-main"><label
185
- class="pf-v5-c-form__label"
181
+ <form class="pf-v6-c-form" novalidate>
182
+ <div class="pf-v6-c-form__group">
183
+ <div class="pf-v6-c-form__group-label pf-m-info">
184
+ <div class="pf-v6-c-form__group-label-main"><label
185
+ class="pf-v6-c-form__label"
186
186
  for="password-strength-demo--weak-password"
187
187
  >
188
- <span class="pf-v5-c-form__label-text">Password</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
188
+ <span class="pf-v6-c-form__label-text">Password</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
189
189
  <span
190
- class="pf-v5-c-button pf-m-no-padding pf-m-plain"
190
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
191
191
  type="button"
192
192
  role="button"
193
193
  tabindex="0"
@@ -197,21 +197,21 @@ section: components
197
197
  <i class="fas fa-question-circle" aria-hidden="true"></i>
198
198
  </span></span>
199
199
  </div>
200
- <div class="pf-v5-c-form__group-label-info">
201
- <div class="pf-v5-c-helper-text">
202
- <div class="pf-v5-c-helper-text__item pf-m-error">
203
- <span class="pf-v5-c-helper-text__item-icon">
200
+ <div class="pf-v6-c-form__group-label-info">
201
+ <div class="pf-v6-c-helper-text">
202
+ <div class="pf-v6-c-helper-text__item pf-m-error">
203
+ <span class="pf-v6-c-helper-text__item-icon">
204
204
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
205
205
  </span>
206
- <span class="pf-v5-c-helper-text__item-text">Weak</span>
206
+ <span class="pf-v6-c-helper-text__item-text">Weak</span>
207
207
  </div>
208
208
  </div>
209
209
  </div>
210
210
  </div>
211
- <div class="pf-v5-c-form__group-control">
212
- <div class="pf-v5-c-input-group">
213
- <div class="pf-v5-c-input-group__item pf-m-fill">
214
- <span class="pf-v5-c-form-control pf-m-required">
211
+ <div class="pf-v6-c-form__group-control">
212
+ <div class="pf-v6-c-input-group">
213
+ <div class="pf-v6-c-input-group__item pf-m-fill">
214
+ <span class="pf-v6-c-form-control pf-m-required">
215
215
  <input
216
216
  required
217
217
  type="text"
@@ -223,9 +223,9 @@ section: components
223
223
  />
224
224
  </span>
225
225
  </div>
226
- <div class="pf-v5-c-input-group__item">
226
+ <div class="pf-v6-c-input-group__item">
227
227
  <button
228
- class="pf-v5-c-button pf-m-control"
228
+ class="pf-v6-c-button pf-m-control"
229
229
  type="button"
230
230
  aria-label="Show password"
231
231
  >
@@ -233,30 +233,30 @@ section: components
233
233
  </button>
234
234
  </div>
235
235
  </div>
236
- <div class="pf-v5-c-form__helper-text" aria-live="polite">
237
- <div class="pf-v5-c-helper-text">
238
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
239
- <span class="pf-v5-c-helper-text__item-icon">
236
+ <div class="pf-v6-c-form__helper-text" aria-live="polite">
237
+ <div class="pf-v6-c-helper-text">
238
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
239
+ <span class="pf-v6-c-helper-text__item-icon">
240
240
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
241
241
  </span>
242
242
  <span
243
- class="pf-v5-c-helper-text__item-text"
243
+ class="pf-v6-c-helper-text__item-text"
244
244
  >Must be at least 14 characters</span>
245
245
  </div>
246
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
247
- <span class="pf-v5-c-helper-text__item-icon">
246
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
247
+ <span class="pf-v6-c-helper-text__item-icon">
248
248
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
249
249
  </span>
250
250
  <span
251
- class="pf-v5-c-helper-text__item-text"
251
+ class="pf-v6-c-helper-text__item-text"
252
252
  >Cannot contain the word "redhat"</span>
253
253
  </div>
254
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
255
- <span class="pf-v5-c-helper-text__item-icon">
254
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
255
+ <span class="pf-v6-c-helper-text__item-icon">
256
256
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
257
257
  </span>
258
258
  <span
259
- class="pf-v5-c-helper-text__item-text"
259
+ class="pf-v6-c-helper-text__item-text"
260
260
  >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
261
261
  </div>
262
262
  </div>
@@ -270,16 +270,16 @@ section: components
270
270
  ### Valid, strong password
271
271
 
272
272
  ```html
273
- <form class="pf-v5-c-form" novalidate>
274
- <div class="pf-v5-c-form__group">
275
- <div class="pf-v5-c-form__group-label pf-m-info">
276
- <div class="pf-v5-c-form__group-label-main"><label
277
- class="pf-v5-c-form__label"
273
+ <form class="pf-v6-c-form" novalidate>
274
+ <div class="pf-v6-c-form__group">
275
+ <div class="pf-v6-c-form__group-label pf-m-info">
276
+ <div class="pf-v6-c-form__group-label-main"><label
277
+ class="pf-v6-c-form__label"
278
278
  for="password-strength-demo--strong-password"
279
279
  >
280
- <span class="pf-v5-c-form__label-text">Password</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
280
+ <span class="pf-v6-c-form__label-text">Password</span>&nbsp;<span class="pf-v6-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span class="pf-v6-c-form__group-label-help">
281
281
  <span
282
- class="pf-v5-c-button pf-m-no-padding pf-m-plain"
282
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
283
283
  type="button"
284
284
  role="button"
285
285
  tabindex="0"
@@ -289,21 +289,21 @@ section: components
289
289
  <i class="fas fa-question-circle" aria-hidden="true"></i>
290
290
  </span></span>
291
291
  </div>
292
- <div class="pf-v5-c-form__group-label-info">
293
- <div class="pf-v5-c-helper-text">
294
- <div class="pf-v5-c-helper-text__item pf-m-success">
295
- <span class="pf-v5-c-helper-text__item-icon">
292
+ <div class="pf-v6-c-form__group-label-info">
293
+ <div class="pf-v6-c-helper-text">
294
+ <div class="pf-v6-c-helper-text__item pf-m-success">
295
+ <span class="pf-v6-c-helper-text__item-icon">
296
296
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
297
297
  </span>
298
- <span class="pf-v5-c-helper-text__item-text">Strong</span>
298
+ <span class="pf-v6-c-helper-text__item-text">Strong</span>
299
299
  </div>
300
300
  </div>
301
301
  </div>
302
302
  </div>
303
- <div class="pf-v5-c-form__group-control">
304
- <div class="pf-v5-c-input-group">
305
- <div class="pf-v5-c-input-group__item pf-m-fill">
306
- <span class="pf-v5-c-form-control pf-m-required">
303
+ <div class="pf-v6-c-form__group-control">
304
+ <div class="pf-v6-c-input-group">
305
+ <div class="pf-v6-c-input-group__item pf-m-fill">
306
+ <span class="pf-v6-c-form-control pf-m-required">
307
307
  <input
308
308
  required
309
309
  type="text"
@@ -315,9 +315,9 @@ section: components
315
315
  />
316
316
  </span>
317
317
  </div>
318
- <div class="pf-v5-c-input-group__item">
318
+ <div class="pf-v6-c-input-group__item">
319
319
  <button
320
- class="pf-v5-c-button pf-m-control"
320
+ class="pf-v6-c-button pf-m-control"
321
321
  type="button"
322
322
  aria-label="Show password"
323
323
  >
@@ -325,30 +325,30 @@ section: components
325
325
  </button>
326
326
  </div>
327
327
  </div>
328
- <div class="pf-v5-c-form__helper-text" aria-live="polite">
329
- <div class="pf-v5-c-helper-text">
330
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
331
- <span class="pf-v5-c-helper-text__item-icon">
328
+ <div class="pf-v6-c-form__helper-text" aria-live="polite">
329
+ <div class="pf-v6-c-helper-text">
330
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
331
+ <span class="pf-v6-c-helper-text__item-icon">
332
332
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
333
333
  </span>
334
334
  <span
335
- class="pf-v5-c-helper-text__item-text"
335
+ class="pf-v6-c-helper-text__item-text"
336
336
  >Must be at least 14 characters</span>
337
337
  </div>
338
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
339
- <span class="pf-v5-c-helper-text__item-icon">
338
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
339
+ <span class="pf-v6-c-helper-text__item-icon">
340
340
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
341
341
  </span>
342
342
  <span
343
- class="pf-v5-c-helper-text__item-text"
343
+ class="pf-v6-c-helper-text__item-text"
344
344
  >Cannot contain the word "redhat"</span>
345
345
  </div>
346
- <div class="pf-v5-c-helper-text__item pf-m-success pf-m-dynamic">
347
- <span class="pf-v5-c-helper-text__item-icon">
346
+ <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
347
+ <span class="pf-v6-c-helper-text__item-icon">
348
348
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
349
349
  </span>
350
350
  <span
351
- class="pf-v5-c-helper-text__item-text"
351
+ class="pf-v6-c-helper-text__item-text"
352
352
  >Must include at least 3 of the following: lowercase letters, uppercase letters, numbers, symbols</span>
353
353
  </div>
354
354
  </div>