@patternfly/patternfly 5.0.0-alpha.2 → 5.0.0-alpha.21

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 (224) hide show
  1. package/README.md +1 -1
  2. package/RELEASE-NOTES.md +47 -0
  3. package/assets/icons/iconUnicodes.json +1 -0
  4. package/assets/pficon/pficon.scss +6 -0
  5. package/assets/pficon/pficon.woff +0 -0
  6. package/assets/pficon/pficon.woff2 +0 -0
  7. package/base/_chart-globals.scss +0 -4
  8. package/base/_common.scss +0 -22
  9. package/base/patternfly-common.css +0 -10
  10. package/base/patternfly-icons.css +5 -1
  11. package/base/patternfly-pf-icons.css +5 -1
  12. package/components/Accordion/accordion.css +2 -0
  13. package/components/Accordion/accordion.scss +2 -0
  14. package/components/AppLauncher/app-launcher.css +2 -0
  15. package/components/AppLauncher/app-launcher.scss +2 -0
  16. package/components/Breadcrumb/breadcrumb.css +2 -0
  17. package/components/Breadcrumb/breadcrumb.scss +2 -0
  18. package/components/CalendarMonth/calendar-month.css +1 -1
  19. package/components/CalendarMonth/calendar-month.scss +1 -1
  20. package/components/Card/card.css +9 -12
  21. package/components/Card/card.scss +11 -17
  22. package/components/ChipGroup/chip-group.css +27 -17
  23. package/components/ChipGroup/chip-group.scss +36 -22
  24. package/components/Content/content.css +6 -0
  25. package/components/Content/content.scss +8 -0
  26. package/components/ContextSelector/context-selector.css +5 -1
  27. package/components/ContextSelector/context-selector.scss +6 -2
  28. package/components/DataList/data-list.css +2 -1
  29. package/components/DataList/data-list.scss +2 -1
  30. package/components/Drawer/drawer.css +13 -14
  31. package/components/Drawer/drawer.scss +0 -1
  32. package/components/Dropdown/dropdown.css +27 -10
  33. package/components/Dropdown/dropdown.scss +22 -0
  34. package/components/EmptyState/empty-state.css +46 -52
  35. package/components/EmptyState/empty-state.scss +58 -57
  36. package/components/ExpandableSection/expandable-section.css +2 -0
  37. package/components/ExpandableSection/expandable-section.scss +2 -0
  38. package/components/FormControl/form-control.css +1 -1
  39. package/components/FormControl/themes/dark/form-control.scss +1 -1
  40. package/components/InputGroup/input-group.css +14 -0
  41. package/components/InputGroup/input-group.scss +9 -0
  42. package/components/InputGroup/themes/dark/input-group.scss +8 -0
  43. package/components/Label/label.css +2 -0
  44. package/components/Label/label.scss +2 -0
  45. package/components/LabelGroup/label-group.css +26 -22
  46. package/components/LabelGroup/label-group.scss +31 -26
  47. package/components/Login/login.css +1 -1
  48. package/components/Menu/menu.css +7 -0
  49. package/components/Menu/menu.scss +8 -0
  50. package/components/MenuToggle/menu-toggle.css +2 -0
  51. package/components/MenuToggle/menu-toggle.scss +2 -0
  52. package/components/ModalBox/modal-box.css +9 -8
  53. package/components/ModalBox/modal-box.scss +11 -11
  54. package/components/Page/page.css +60 -60
  55. package/components/Pagination/pagination.css +122 -2
  56. package/components/Pagination/pagination.scss +24 -1
  57. package/components/Popover/popover.css +2 -7
  58. package/components/Popover/themes/dark/popover.scss +2 -8
  59. package/components/Progress/progress.css +5 -2
  60. package/components/Progress/progress.scss +5 -2
  61. package/components/SearchInput/search-input.css +2 -0
  62. package/components/SearchInput/search-input.scss +2 -0
  63. package/components/Slider/slider.css +0 -7
  64. package/components/Slider/slider.scss +0 -9
  65. package/components/Table/table-grid.css +28 -28
  66. package/components/Table/table-tree-view.css +4 -4
  67. package/components/Table/table.css +4 -0
  68. package/components/Table/table.scss +4 -0
  69. package/components/Tabs/tabs.css +0 -4
  70. package/components/Tabs/tabs.scss +0 -7
  71. package/components/TextInputGroup/text-input-group.css +4 -2
  72. package/components/TextInputGroup/text-input-group.scss +4 -3
  73. package/components/Toolbar/toolbar.css +65 -37
  74. package/components/Toolbar/toolbar.scss +37 -3
  75. package/components/Tooltip/themes/dark/tooltip.scss +1 -11
  76. package/components/Tooltip/tooltip.css +7 -12
  77. package/components/Tooltip/tooltip.scss +6 -3
  78. package/components/TreeView/tree-view.css +7 -15
  79. package/components/TreeView/tree-view.scss +7 -18
  80. package/components/Wizard/wizard.css +2 -0
  81. package/components/Wizard/wizard.scss +2 -0
  82. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -13
  83. package/docs/components/Accordion/examples/Accordion.md +12 -12
  84. package/docs/components/ActionList/examples/ActionList.md +6 -6
  85. package/docs/components/Alert/examples/Alert.md +19 -19
  86. package/docs/components/AlertGroup/examples/AlertGroup.md +12 -12
  87. package/docs/components/AppLauncher/examples/application-launcher.md +51 -46
  88. package/docs/components/Avatar/examples/Avatar.md +11 -11
  89. package/docs/components/BackToTop/examples/BackToTop.md +4 -4
  90. package/docs/components/Backdrop/examples/Backdrop.md +4 -4
  91. package/docs/components/BackgroundImage/examples/BackgroundImage.md +4 -4
  92. package/docs/components/Badge/examples/Badge.md +5 -5
  93. package/docs/components/Banner/examples/Banner.md +8 -8
  94. package/docs/components/Brand/examples/Brand.md +9 -9
  95. package/docs/components/Breadcrumb/examples/Breadcrumb.md +20 -20
  96. package/docs/components/Button/examples/Button.md +35 -35
  97. package/docs/components/CalendarMonth/examples/CalendarMonth.md +32 -32
  98. package/docs/components/Card/examples/Card.md +61 -44
  99. package/docs/components/Check/examples/Check.md +15 -19
  100. package/docs/components/Chip/examples/Chip.md +13 -13
  101. package/docs/components/ChipGroup/examples/ChipGroup.md +15 -344
  102. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +22 -22
  103. package/docs/components/CodeBlock/examples/CodeBlock.md +9 -9
  104. package/docs/components/CodeEditor/examples/CodeEditor.md +54 -35
  105. package/docs/components/Content/examples/Content.md +37 -9
  106. package/docs/components/ContextSelector/examples/context-selector.css +5 -1
  107. package/docs/components/ContextSelector/examples/context-selector.md +86 -80
  108. package/docs/components/DataList/examples/DataList.md +187 -148
  109. package/docs/components/DatePicker/examples/DatePicker.md +10 -10
  110. package/docs/components/DescriptionList/examples/DescriptionList.md +24 -24
  111. package/docs/components/Divider/examples/Divider.md +10 -10
  112. package/docs/components/DragDrop/examples/DragDrop.md +5 -5
  113. package/docs/components/Drawer/examples/Drawer.md +43 -43
  114. package/docs/components/Dropdown/examples/Dropdown.css +5 -2
  115. package/docs/components/Dropdown/examples/Dropdown.md +311 -71
  116. package/docs/components/DualListSelector/examples/DualListSelector.md +201 -197
  117. package/docs/components/EmptyState/examples/EmptyState.md +130 -82
  118. package/docs/components/ExpandableSection/examples/ExpandableSection.md +23 -23
  119. package/docs/components/FileUpload/examples/FileUpload.md +8 -8
  120. package/docs/components/Form/examples/Form.md +64 -64
  121. package/docs/components/FormControl/examples/FormControl.md +20 -20
  122. package/docs/components/HelperText/examples/HelperText.md +12 -12
  123. package/docs/components/Hint/examples/Hint.md +7 -7
  124. package/docs/components/Icon/examples/Icon.md +10 -10
  125. package/docs/components/InlineEdit/examples/InlineEdit.md +24 -24
  126. package/docs/components/InputGroup/examples/InputGroup.md +10 -9
  127. package/docs/components/JumpLinks/examples/JumpLinks.md +35 -35
  128. package/docs/components/Label/examples/Label.md +31 -31
  129. package/docs/components/LabelGroup/examples/LabelGroup.md +24 -36
  130. package/docs/components/List/examples/List.md +18 -18
  131. package/docs/components/LogViewer/examples/LogViewer.md +69 -69
  132. package/docs/components/Login/examples/Login.md +32 -32
  133. package/docs/components/Masthead/examples/masthead.md +9 -9
  134. package/docs/components/Menu/examples/Menu.md +82 -80
  135. package/docs/components/MenuToggle/examples/MenuToggle.md +28 -28
  136. package/docs/components/ModalBox/examples/ModalBox.md +106 -85
  137. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +25 -25
  138. package/docs/components/Nav/examples/Navigation.md +69 -69
  139. package/docs/components/NotificationBadge/examples/NotificationBadge.md +8 -8
  140. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +44 -44
  141. package/docs/components/NumberInput/examples/NumberInput.md +12 -12
  142. package/docs/components/OptionsMenu/examples/options-menu.md +27 -28
  143. package/docs/components/OverflowMenu/examples/overflow-menu.md +25 -25
  144. package/docs/components/Page/examples/Page.md +54 -54
  145. package/docs/components/Pagination/examples/Pagination.md +129 -30
  146. package/docs/components/Panel/examples/Panel.md +10 -10
  147. package/docs/components/Popover/examples/Popover.md +34 -34
  148. package/docs/components/Progress/examples/Progress.md +31 -60
  149. package/docs/components/ProgressStepper/examples/ProgressStepper.md +45 -38
  150. package/docs/components/Radio/examples/Radio.md +11 -11
  151. package/docs/components/SearchInput/examples/SearchInput.md +34 -34
  152. package/docs/components/Select/examples/Select.md +143 -143
  153. package/docs/components/Sidebar/examples/Sidebar.md +14 -14
  154. package/docs/components/SimpleList/examples/SimpleList.md +15 -15
  155. package/docs/components/Skeleton/examples/Skeleton.md +8 -8
  156. package/docs/components/SkipToContent/examples/SkipToContent.md +5 -5
  157. package/docs/components/Slider/examples/Slider.md +30 -30
  158. package/docs/components/Spinner/examples/Spinner.md +24 -24
  159. package/docs/components/Switch/examples/Switch.md +19 -19
  160. package/docs/components/TabContent/examples/TabContent.md +13 -13
  161. package/docs/components/Table/examples/Table.md +1272 -855
  162. package/docs/components/Tabs/examples/Tabs.md +149 -149
  163. package/docs/components/TextInputGroup/examples/TextInputGroup.md +19 -19
  164. package/docs/components/Tile/examples/Tile.md +15 -15
  165. package/docs/components/Timestamp/examples/Timestamp.md +5 -5
  166. package/docs/components/Title/examples/Title.md +17 -17
  167. package/docs/components/ToggleGroup/examples/toggle-group.md +13 -13
  168. package/docs/components/Toolbar/examples/Toolbar.md +165 -144
  169. package/docs/components/Tooltip/examples/Tooltip.md +10 -10
  170. package/docs/components/TreeView/examples/TreeView.md +34 -34
  171. package/docs/components/Truncate/examples/Truncate.md +4 -4
  172. package/docs/components/Wizard/examples/Wizard.md +63 -70
  173. package/docs/demos/AboutModal/examples/AboutModal.md +4 -4
  174. package/docs/demos/Alert/examples/Alert.md +13 -13
  175. package/docs/demos/BackToTop/examples/BackToTop.md +4 -4
  176. package/docs/demos/Banner/examples/Banner.md +10 -11
  177. package/docs/demos/Card/examples/Card.md +151 -116
  178. package/docs/demos/CardView/examples/CardView.md +16 -15
  179. package/docs/demos/ContextSelector/examples/ContextSelector.md +18 -18
  180. package/docs/demos/Dashboard/examples/Dashboard.md +10 -9
  181. package/docs/demos/DataList/examples/DataList.md +160 -111
  182. package/docs/demos/DescriptionList/examples/DescriptionList.md +12 -13
  183. package/docs/demos/Drawer/examples/Drawer.md +20 -20
  184. package/docs/demos/HelperText/examples/HelperText.md +8 -9
  185. package/docs/demos/JumpLinks/examples/JumpLinks.md +28 -28
  186. package/docs/demos/Masthead/examples/Masthead.md +32 -35
  187. package/docs/demos/Modal/examples/Modal.md +54 -66
  188. package/docs/demos/Nav/examples/Nav.md +720 -767
  189. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +40 -28
  190. package/docs/demos/Page/examples/Page.md +37 -37
  191. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +32 -33
  192. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +53 -49
  193. package/docs/demos/Skeleton/examples/Skeleton.md +4 -4
  194. package/docs/demos/Table/examples/Table.md +522 -378
  195. package/docs/demos/Tabs/examples/Tabs.md +120 -601
  196. package/docs/demos/Toolbar/examples/Toolbar.md +1781 -171
  197. package/docs/demos/Wizard/examples/Wizard.md +229 -225
  198. package/docs/layouts/Bullseye/examples/Bullseye.md +4 -4
  199. package/docs/layouts/Flex/examples/Flex.md +98 -98
  200. package/docs/layouts/Gallery/examples/Gallery.md +7 -7
  201. package/docs/layouts/Grid/examples/Grid.md +9 -9
  202. package/docs/layouts/Level/examples/Level.md +5 -5
  203. package/docs/layouts/Split/examples/Split.md +7 -7
  204. package/docs/layouts/Stack/examples/Stack.md +6 -6
  205. package/docs/utilities/Accessibility/examples/Accessibility.md +4 -4
  206. package/docs/utilities/Alignment/examples/Alignment.md +6 -6
  207. package/docs/utilities/BackgroundColor/examples/BackgroundColor.md +12 -12
  208. package/docs/utilities/BoxShadow/examples/box-shadow.md +22 -22
  209. package/docs/utilities/Display/examples/Display.md +11 -11
  210. package/docs/utilities/Flex/examples/Flex.md +34 -34
  211. package/docs/utilities/Float/examples/Float.md +4 -4
  212. package/docs/utilities/Sizing/examples/Sizing.md +50 -50
  213. package/docs/utilities/Spacing/examples/Spacing.md +34 -34
  214. package/docs/utilities/Text/examples/Text.md +27 -27
  215. package/icons/{pf-icons.json → pf-icons.mjs} +2 -1
  216. package/layouts/Grid/grid.css +5 -5
  217. package/package.json +59 -64
  218. package/patternfly-base-no-reset.css +5 -11
  219. package/patternfly-base.css +5 -11
  220. package/patternfly-no-reset.css +528 -336
  221. package/patternfly.css +528 -336
  222. package/patternfly.min.css +1 -1
  223. package/patternfly.min.css.map +1 -1
  224. package/sass-utilities/scss-variables.scss +0 -1
@@ -1,6 +1,5 @@
1
1
  ---
2
2
  id: 'Description list'
3
- beta: true
4
3
  section: components
5
4
  cssPrefix: pf-d-description-list
6
5
  ---## Examples
@@ -97,7 +96,7 @@ cssPrefix: pf-d-description-list
97
96
  </div>
98
97
  <section class="pf-c-app-launcher__group">
99
98
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
100
- <ul>
99
+ <ul role="list">
101
100
  <li
102
101
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
103
102
  >
@@ -149,7 +148,7 @@ cssPrefix: pf-d-description-list
149
148
  <hr class="pf-c-divider" />
150
149
  <section class="pf-c-app-launcher__group">
151
150
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
152
- <ul>
151
+ <ul role="list">
153
152
  <li
154
153
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
155
154
  >
@@ -804,7 +803,7 @@ cssPrefix: pf-d-description-list
804
803
  id="description-list-basic-example-primary-nav"
805
804
  aria-label="Global"
806
805
  >
807
- <ul class="pf-c-nav__list">
806
+ <ul class="pf-c-nav__list" role="list">
808
807
  <li class="pf-c-nav__item">
809
808
  <a href="#" class="pf-c-nav__link">System panel</a>
810
809
  </li>
@@ -836,7 +835,7 @@ cssPrefix: pf-d-description-list
836
835
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
837
836
  <div class="pf-c-page__main-body">
838
837
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
839
- <ol class="pf-c-breadcrumb__list">
838
+ <ol class="pf-c-breadcrumb__list" role="list">
840
839
  <li class="pf-c-breadcrumb__item">
841
840
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
842
841
  </li>
@@ -1071,7 +1070,7 @@ cssPrefix: pf-d-description-list
1071
1070
  </div>
1072
1071
  <section class="pf-c-app-launcher__group">
1073
1072
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
1074
- <ul>
1073
+ <ul role="list">
1075
1074
  <li
1076
1075
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1077
1076
  >
@@ -1123,7 +1122,7 @@ cssPrefix: pf-d-description-list
1123
1122
  <hr class="pf-c-divider" />
1124
1123
  <section class="pf-c-app-launcher__group">
1125
1124
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
1126
- <ul>
1125
+ <ul role="list">
1127
1126
  <li
1128
1127
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
1129
1128
  >
@@ -1778,7 +1777,7 @@ cssPrefix: pf-d-description-list
1778
1777
  id="description-list-in-drawer-example-primary-nav"
1779
1778
  aria-label="Global"
1780
1779
  >
1781
- <ul class="pf-c-nav__list">
1780
+ <ul class="pf-c-nav__list" role="list">
1782
1781
  <li class="pf-c-nav__item">
1783
1782
  <a href="#" class="pf-c-nav__link">System panel</a>
1784
1783
  </li>
@@ -1815,7 +1814,7 @@ cssPrefix: pf-d-description-list
1815
1814
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
1816
1815
  <div class="pf-c-page__main-body">
1817
1816
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
1818
- <ol class="pf-c-breadcrumb__list">
1817
+ <ol class="pf-c-breadcrumb__list" role="list">
1819
1818
  <li class="pf-c-breadcrumb__item">
1820
1819
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
1821
1820
  </li>
@@ -2330,7 +2329,7 @@ cssPrefix: pf-d-description-list
2330
2329
  </div>
2331
2330
  <section class="pf-c-app-launcher__group">
2332
2331
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
2333
- <ul>
2332
+ <ul role="list">
2334
2333
  <li
2335
2334
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
2336
2335
  >
@@ -2382,7 +2381,7 @@ cssPrefix: pf-d-description-list
2382
2381
  <hr class="pf-c-divider" />
2383
2382
  <section class="pf-c-app-launcher__group">
2384
2383
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
2385
- <ul>
2384
+ <ul role="list">
2386
2385
  <li
2387
2386
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
2388
2387
  >
@@ -3037,7 +3036,7 @@ cssPrefix: pf-d-description-list
3037
3036
  id="description-list-complex-content-example-primary-nav"
3038
3037
  aria-label="Global"
3039
3038
  >
3040
- <ul class="pf-c-nav__list">
3039
+ <ul class="pf-c-nav__list" role="list">
3041
3040
  <li class="pf-c-nav__item">
3042
3041
  <a href="#" class="pf-c-nav__link">System panel</a>
3043
3042
  </li>
@@ -3069,7 +3068,7 @@ cssPrefix: pf-d-description-list
3069
3068
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
3070
3069
  <div class="pf-c-page__main-body">
3071
3070
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
3072
- <ol class="pf-c-breadcrumb__list">
3071
+ <ol class="pf-c-breadcrumb__list" role="list">
3073
3072
  <li class="pf-c-breadcrumb__item">
3074
3073
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
3075
3074
  </li>
@@ -96,7 +96,7 @@ wrapperTag: div
96
96
  </div>
97
97
  <section class="pf-c-app-launcher__group">
98
98
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
99
- <ul>
99
+ <ul role="list">
100
100
  <li
101
101
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
102
102
  >
@@ -148,7 +148,7 @@ wrapperTag: div
148
148
  <hr class="pf-c-divider" />
149
149
  <section class="pf-c-app-launcher__group">
150
150
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
151
- <ul>
151
+ <ul role="list">
152
152
  <li
153
153
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
154
154
  >
@@ -803,7 +803,7 @@ wrapperTag: div
803
803
  id="drawer-collapsed-example-primary-nav"
804
804
  aria-label="Global"
805
805
  >
806
- <ul class="pf-c-nav__list">
806
+ <ul class="pf-c-nav__list" role="list">
807
807
  <li class="pf-c-nav__item">
808
808
  <a href="#" class="pf-c-nav__link">System panel</a>
809
809
  </li>
@@ -840,7 +840,7 @@ wrapperTag: div
840
840
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
841
841
  <div class="pf-c-page__main-body">
842
842
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
843
- <ol class="pf-c-breadcrumb__list">
843
+ <ol class="pf-c-breadcrumb__list" role="list">
844
844
  <li class="pf-c-breadcrumb__item">
845
845
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
846
846
  </li>
@@ -1200,7 +1200,7 @@ wrapperTag: div
1200
1200
  </div>
1201
1201
  <section class="pf-c-app-launcher__group">
1202
1202
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
1203
- <ul>
1203
+ <ul role="list">
1204
1204
  <li
1205
1205
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1206
1206
  >
@@ -1252,7 +1252,7 @@ wrapperTag: div
1252
1252
  <hr class="pf-c-divider" />
1253
1253
  <section class="pf-c-app-launcher__group">
1254
1254
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
1255
- <ul>
1255
+ <ul role="list">
1256
1256
  <li
1257
1257
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
1258
1258
  >
@@ -1907,7 +1907,7 @@ wrapperTag: div
1907
1907
  id="drawer-expanded-example-primary-nav"
1908
1908
  aria-label="Global"
1909
1909
  >
1910
- <ul class="pf-c-nav__list">
1910
+ <ul class="pf-c-nav__list" role="list">
1911
1911
  <li class="pf-c-nav__item">
1912
1912
  <a href="#" class="pf-c-nav__link">System panel</a>
1913
1913
  </li>
@@ -1944,7 +1944,7 @@ wrapperTag: div
1944
1944
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
1945
1945
  <div class="pf-c-page__main-body">
1946
1946
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
1947
- <ol class="pf-c-breadcrumb__list">
1947
+ <ol class="pf-c-breadcrumb__list" role="list">
1948
1948
  <li class="pf-c-breadcrumb__item">
1949
1949
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
1950
1950
  </li>
@@ -2128,7 +2128,7 @@ wrapperTag: div
2128
2128
  </div>
2129
2129
  <section class="pf-c-app-launcher__group">
2130
2130
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
2131
- <ul>
2131
+ <ul role="list">
2132
2132
  <li
2133
2133
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
2134
2134
  >
@@ -2180,7 +2180,7 @@ wrapperTag: div
2180
2180
  <hr class="pf-c-divider" />
2181
2181
  <section class="pf-c-app-launcher__group">
2182
2182
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
2183
- <ul>
2183
+ <ul role="list">
2184
2184
  <li
2185
2185
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
2186
2186
  >
@@ -2835,7 +2835,7 @@ wrapperTag: div
2835
2835
  id="drawer-expanded-bottom-example-primary-nav"
2836
2836
  aria-label="Global"
2837
2837
  >
2838
- <ul class="pf-c-nav__list">
2838
+ <ul class="pf-c-nav__list" role="list">
2839
2839
  <li class="pf-c-nav__item">
2840
2840
  <a href="#" class="pf-c-nav__link">System panel</a>
2841
2841
  </li>
@@ -2872,7 +2872,7 @@ wrapperTag: div
2872
2872
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
2873
2873
  <div class="pf-c-page__main-body">
2874
2874
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
2875
- <ol class="pf-c-breadcrumb__list">
2875
+ <ol class="pf-c-breadcrumb__list" role="list">
2876
2876
  <li class="pf-c-breadcrumb__item">
2877
2877
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
2878
2878
  </li>
@@ -3056,7 +3056,7 @@ wrapperTag: div
3056
3056
  </div>
3057
3057
  <section class="pf-c-app-launcher__group">
3058
3058
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
3059
- <ul>
3059
+ <ul role="list">
3060
3060
  <li
3061
3061
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3062
3062
  >
@@ -3108,7 +3108,7 @@ wrapperTag: div
3108
3108
  <hr class="pf-c-divider" />
3109
3109
  <section class="pf-c-app-launcher__group">
3110
3110
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
3111
- <ul>
3111
+ <ul role="list">
3112
3112
  <li
3113
3113
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
3114
3114
  >
@@ -3763,7 +3763,7 @@ wrapperTag: div
3763
3763
  id="drawer-jump-links-primary-nav"
3764
3764
  aria-label="Global"
3765
3765
  >
3766
- <ul class="pf-c-nav__list">
3766
+ <ul class="pf-c-nav__list" role="list">
3767
3767
  <li class="pf-c-nav__item">
3768
3768
  <a href="#" class="pf-c-nav__link">System panel</a>
3769
3769
  </li>
@@ -3807,7 +3807,7 @@ wrapperTag: div
3807
3807
  class="pf-c-jump-links pf-m-vertical pf-m-non-expandable-on-md pf-m-expandable"
3808
3808
  >
3809
3809
  <div class="pf-c-jump-links__label">Jump to section</div>
3810
- <ul class="pf-c-jump-links__list">
3810
+ <ul class="pf-c-jump-links__list" role="list">
3811
3811
  <li class="pf-c-jump-links__item pf-m-current">
3812
3812
  <a
3813
3813
  class="pf-c-jump-links__link"
@@ -4011,7 +4011,7 @@ wrapperTag: div
4011
4011
  </div>
4012
4012
  <section class="pf-c-app-launcher__group">
4013
4013
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
4014
- <ul>
4014
+ <ul role="list">
4015
4015
  <li
4016
4016
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
4017
4017
  >
@@ -4063,7 +4063,7 @@ wrapperTag: div
4063
4063
  <hr class="pf-c-divider" />
4064
4064
  <section class="pf-c-app-launcher__group">
4065
4065
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
4066
- <ul>
4066
+ <ul role="list">
4067
4067
  <li
4068
4068
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
4069
4069
  >
@@ -4718,7 +4718,7 @@ wrapperTag: div
4718
4718
  id="drawer-expanded-jump-links-primary-nav"
4719
4719
  aria-label="Global"
4720
4720
  >
4721
- <ul class="pf-c-nav__list">
4721
+ <ul class="pf-c-nav__list" role="list">
4722
4722
  <li class="pf-c-nav__item">
4723
4723
  <a href="#" class="pf-c-nav__link">System panel</a>
4724
4724
  </li>
@@ -4762,7 +4762,7 @@ wrapperTag: div
4762
4762
  class="pf-c-jump-links pf-m-vertical pf-m-non-expandable-on-md pf-m-expandable"
4763
4763
  >
4764
4764
  <div class="pf-c-jump-links__label">Jump to section</div>
4765
- <ul class="pf-c-jump-links__list">
4765
+ <ul class="pf-c-jump-links__list" role="list">
4766
4766
  <li class="pf-c-jump-links__item pf-m-current">
4767
4767
  <a
4768
4768
  class="pf-c-jump-links__link"
@@ -1,6 +1,5 @@
1
1
  ---
2
2
  id: 'Helper text'
3
- beta: true
4
3
  section: components
5
4
  ---## Examples
6
5
 
@@ -83,32 +82,32 @@ section: components
83
82
  id="helper-text-form-address-helper"
84
83
  aria-live="polite"
85
84
  >
86
- <ul class="pf-c-helper-text">
87
- <li class="pf-c-helper-text__item pf-m-dynamic pf-m-success">
85
+ <div class="pf-c-helper-text">
86
+ <div class="pf-c-helper-text__item pf-m-dynamic pf-m-success">
88
87
  <span class="pf-c-helper-text__item-icon">
89
88
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
90
89
  </span>
91
90
  <span
92
91
  class="pf-c-helper-text__item-text"
93
92
  >This criteria has been met.</span>
94
- </li>
95
- <li class="pf-c-helper-text__item pf-m-dynamic pf-m-error">
93
+ </div>
94
+ <div class="pf-c-helper-text__item pf-m-dynamic pf-m-error">
96
95
  <span class="pf-c-helper-text__item-icon">
97
96
  <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
98
97
  </span>
99
98
  <span
100
99
  class="pf-c-helper-text__item-text"
101
100
  >This criteria has not been met.</span>
102
- </li>
103
- <li class="pf-c-helper-text__item pf-m-dynamic pf-m-success">
101
+ </div>
102
+ <div class="pf-c-helper-text__item pf-m-dynamic pf-m-success">
104
103
  <span class="pf-c-helper-text__item-icon">
105
104
  <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
106
105
  </span>
107
106
  <span
108
107
  class="pf-c-helper-text__item-text"
109
108
  >This criteria has been met.</span>
110
- </li>
111
- </ul>
109
+ </div>
110
+ </div>
112
111
  </div>
113
112
  </div>
114
113
  </div>
@@ -98,7 +98,7 @@ section: components
98
98
  </div>
99
99
  <section class="pf-c-app-launcher__group">
100
100
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
101
- <ul>
101
+ <ul role="list">
102
102
  <li
103
103
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
104
104
  >
@@ -150,7 +150,7 @@ section: components
150
150
  <hr class="pf-c-divider" />
151
151
  <section class="pf-c-app-launcher__group">
152
152
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
153
- <ul>
153
+ <ul role="list">
154
154
  <li
155
155
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
156
156
  >
@@ -805,7 +805,7 @@ section: components
805
805
  id="jump-links-collapsed-mobile-example-primary-nav"
806
806
  aria-label="Global"
807
807
  >
808
- <ul class="pf-c-nav__list">
808
+ <ul class="pf-c-nav__list" role="list">
809
809
  <li class="pf-c-nav__item">
810
810
  <a href="#" class="pf-c-nav__link">System panel</a>
811
811
  </li>
@@ -837,7 +837,7 @@ section: components
837
837
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
838
838
  <div class="pf-c-page__main-body">
839
839
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
840
- <ol class="pf-c-breadcrumb__list">
840
+ <ol class="pf-c-breadcrumb__list" role="list">
841
841
  <li class="pf-c-breadcrumb__item">
842
842
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
843
843
  </li>
@@ -902,7 +902,7 @@ section: components
902
902
  </div>
903
903
  <div class="pf-c-jump-links__label">Jump to section</div>
904
904
  </div>
905
- <ul class="pf-c-jump-links__list">
905
+ <ul class="pf-c-jump-links__list" role="list">
906
906
  <li class="pf-c-jump-links__item pf-m-current">
907
907
  <a
908
908
  class="pf-c-jump-links__link"
@@ -1084,7 +1084,7 @@ section: components
1084
1084
  </div>
1085
1085
  <section class="pf-c-app-launcher__group">
1086
1086
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
1087
- <ul>
1087
+ <ul role="list">
1088
1088
  <li
1089
1089
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
1090
1090
  >
@@ -1136,7 +1136,7 @@ section: components
1136
1136
  <hr class="pf-c-divider" />
1137
1137
  <section class="pf-c-app-launcher__group">
1138
1138
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
1139
- <ul>
1139
+ <ul role="list">
1140
1140
  <li
1141
1141
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
1142
1142
  >
@@ -1791,7 +1791,7 @@ section: components
1791
1791
  id="jump-links-vertical-expanded-mobile-example-primary-nav"
1792
1792
  aria-label="Global"
1793
1793
  >
1794
- <ul class="pf-c-nav__list">
1794
+ <ul class="pf-c-nav__list" role="list">
1795
1795
  <li class="pf-c-nav__item">
1796
1796
  <a href="#" class="pf-c-nav__link">System panel</a>
1797
1797
  </li>
@@ -1823,7 +1823,7 @@ section: components
1823
1823
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
1824
1824
  <div class="pf-c-page__main-body">
1825
1825
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
1826
- <ol class="pf-c-breadcrumb__list">
1826
+ <ol class="pf-c-breadcrumb__list" role="list">
1827
1827
  <li class="pf-c-breadcrumb__item">
1828
1828
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
1829
1829
  </li>
@@ -1888,7 +1888,7 @@ section: components
1888
1888
  </div>
1889
1889
  <div class="pf-c-jump-links__label">Jump to section</div>
1890
1890
  </div>
1891
- <ul class="pf-c-jump-links__list">
1891
+ <ul class="pf-c-jump-links__list" role="list">
1892
1892
  <li class="pf-c-jump-links__item pf-m-current">
1893
1893
  <a
1894
1894
  class="pf-c-jump-links__link"
@@ -2070,7 +2070,7 @@ section: components
2070
2070
  </div>
2071
2071
  <section class="pf-c-app-launcher__group">
2072
2072
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
2073
- <ul>
2073
+ <ul role="list">
2074
2074
  <li
2075
2075
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
2076
2076
  >
@@ -2122,7 +2122,7 @@ section: components
2122
2122
  <hr class="pf-c-divider" />
2123
2123
  <section class="pf-c-app-launcher__group">
2124
2124
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
2125
- <ul>
2125
+ <ul role="list">
2126
2126
  <li
2127
2127
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
2128
2128
  >
@@ -2777,7 +2777,7 @@ section: components
2777
2777
  id="jump-links-vertical-toggle-text-mobile-example-primary-nav"
2778
2778
  aria-label="Global"
2779
2779
  >
2780
- <ul class="pf-c-nav__list">
2780
+ <ul class="pf-c-nav__list" role="list">
2781
2781
  <li class="pf-c-nav__item">
2782
2782
  <a href="#" class="pf-c-nav__link">System panel</a>
2783
2783
  </li>
@@ -2809,7 +2809,7 @@ section: components
2809
2809
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
2810
2810
  <div class="pf-c-page__main-body">
2811
2811
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
2812
- <ol class="pf-c-breadcrumb__list">
2812
+ <ol class="pf-c-breadcrumb__list" role="list">
2813
2813
  <li class="pf-c-breadcrumb__item">
2814
2814
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
2815
2815
  </li>
@@ -2874,7 +2874,7 @@ section: components
2874
2874
  </div>
2875
2875
  <div class="pf-c-jump-links__label">Jump to section</div>
2876
2876
  </div>
2877
- <ul class="pf-c-jump-links__list">
2877
+ <ul class="pf-c-jump-links__list" role="list">
2878
2878
  <li class="pf-c-jump-links__item pf-m-current">
2879
2879
  <a
2880
2880
  class="pf-c-jump-links__link"
@@ -3053,7 +3053,7 @@ section: components
3053
3053
  </div>
3054
3054
  <section class="pf-c-app-launcher__group">
3055
3055
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
3056
- <ul>
3056
+ <ul role="list">
3057
3057
  <li
3058
3058
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3059
3059
  >
@@ -3105,7 +3105,7 @@ section: components
3105
3105
  <hr class="pf-c-divider" />
3106
3106
  <section class="pf-c-app-launcher__group">
3107
3107
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
3108
- <ul>
3108
+ <ul role="list">
3109
3109
  <li
3110
3110
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
3111
3111
  >
@@ -3760,7 +3760,7 @@ section: components
3760
3760
  id="jump-links-horizontal-example-primary-nav"
3761
3761
  aria-label="Global"
3762
3762
  >
3763
- <ul class="pf-c-nav__list">
3763
+ <ul class="pf-c-nav__list" role="list">
3764
3764
  <li class="pf-c-nav__item">
3765
3765
  <a href="#" class="pf-c-nav__link">System panel</a>
3766
3766
  </li>
@@ -3792,7 +3792,7 @@ section: components
3792
3792
  <section class="pf-c-page__main-breadcrumb pf-m-limit-width">
3793
3793
  <div class="pf-c-page__main-body">
3794
3794
  <nav class="pf-c-breadcrumb" aria-label="breadcrumb">
3795
- <ol class="pf-c-breadcrumb__list">
3795
+ <ol class="pf-c-breadcrumb__list" role="list">
3796
3796
  <li class="pf-c-breadcrumb__item">
3797
3797
  <a href="#" class="pf-c-breadcrumb__link">Section home</a>
3798
3798
  </li>
@@ -3839,7 +3839,7 @@ section: components
3839
3839
  <div class="pf-c-jump-links__header">
3840
3840
  <div class="pf-c-jump-links__label">Jump to section</div>
3841
3841
  </div>
3842
- <ul class="pf-c-jump-links__list">
3842
+ <ul class="pf-c-jump-links__list" role="list">
3843
3843
  <li class="pf-c-jump-links__item pf-m-current">
3844
3844
  <a class="pf-c-jump-links__link" href="#-first">
3845
3845
  <span class="pf-c-jump-links__link-text">First section</span>
@@ -3988,7 +3988,7 @@ section: components
3988
3988
  </div>
3989
3989
  <section class="pf-c-app-launcher__group">
3990
3990
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
3991
- <ul>
3991
+ <ul role="list">
3992
3992
  <li
3993
3993
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
3994
3994
  >
@@ -4040,7 +4040,7 @@ section: components
4040
4040
  <hr class="pf-c-divider" />
4041
4041
  <section class="pf-c-app-launcher__group">
4042
4042
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
4043
- <ul>
4043
+ <ul role="list">
4044
4044
  <li
4045
4045
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
4046
4046
  >
@@ -4695,7 +4695,7 @@ section: components
4695
4695
  id="jump-links-drawer-primary-nav"
4696
4696
  aria-label="Global"
4697
4697
  >
4698
- <ul class="pf-c-nav__list">
4698
+ <ul class="pf-c-nav__list" role="list">
4699
4699
  <li class="pf-c-nav__item">
4700
4700
  <a href="#" class="pf-c-nav__link">System panel</a>
4701
4701
  </li>
@@ -4739,7 +4739,7 @@ section: components
4739
4739
  class="pf-c-jump-links pf-m-vertical pf-m-non-expandable-on-md pf-m-expandable"
4740
4740
  >
4741
4741
  <div class="pf-c-jump-links__label">Jump to section</div>
4742
- <ul class="pf-c-jump-links__list">
4742
+ <ul class="pf-c-jump-links__list" role="list">
4743
4743
  <li class="pf-c-jump-links__item pf-m-current">
4744
4744
  <a
4745
4745
  class="pf-c-jump-links__link"
@@ -4943,7 +4943,7 @@ section: components
4943
4943
  </div>
4944
4944
  <section class="pf-c-app-launcher__group">
4945
4945
  <h1 class="pf-c-app-launcher__group-title">Favorites</h1>
4946
- <ul>
4946
+ <ul role="list">
4947
4947
  <li
4948
4948
  class="pf-c-app-launcher__menu-wrapper pf-m-external pf-m-favorite"
4949
4949
  >
@@ -4995,7 +4995,7 @@ section: components
4995
4995
  <hr class="pf-c-divider" />
4996
4996
  <section class="pf-c-app-launcher__group">
4997
4997
  <h1 class="pf-c-app-launcher__group-title">Group 1</h1>
4998
- <ul>
4998
+ <ul role="list">
4999
4999
  <li
5000
5000
  class="pf-c-app-launcher__menu-wrapper pf-m-external"
5001
5001
  >
@@ -5650,7 +5650,7 @@ section: components
5650
5650
  id="jump-links-drawer-expanded-primary-nav"
5651
5651
  aria-label="Global"
5652
5652
  >
5653
- <ul class="pf-c-nav__list">
5653
+ <ul class="pf-c-nav__list" role="list">
5654
5654
  <li class="pf-c-nav__item">
5655
5655
  <a href="#" class="pf-c-nav__link">System panel</a>
5656
5656
  </li>
@@ -5694,7 +5694,7 @@ section: components
5694
5694
  class="pf-c-jump-links pf-m-vertical pf-m-non-expandable-on-md pf-m-expandable"
5695
5695
  >
5696
5696
  <div class="pf-c-jump-links__label">Jump to section</div>
5697
- <ul class="pf-c-jump-links__list">
5697
+ <ul class="pf-c-jump-links__list" role="list">
5698
5698
  <li class="pf-c-jump-links__item pf-m-current">
5699
5699
  <a
5700
5700
  class="pf-c-jump-links__link"