@patternfly/patternfly 6.0.0-alpha.8 → 6.0.0-alpha.80

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 (331) hide show
  1. package/CODE_OF_CONDUCT.md +1 -2
  2. package/assets/images/PF-Backdrop.svg +1 -0
  3. package/assets/images/PF-HorizontalLogo-Color.svg +29 -0
  4. package/assets/images/PF-HorizontalLogo-Reverse.svg +28 -0
  5. package/assets/images/PF-IconLogo-Reverse.svg +14 -0
  6. package/assets/images/PF-IconLogo-color.svg +17 -0
  7. package/assets/images/PF-IconLogo.svg +17 -0
  8. package/assets/images/logo__pf--reverse-on-md.svg +1 -1
  9. package/assets/images/pf-background.svg +22 -0
  10. package/assets/images/pf-c-brand__logo-on-lg-white.svg +32 -0
  11. package/assets/images/pf-c-brand__logo-on-md-white.svg +42 -0
  12. package/assets/images/pf-c-brand__logo-on-sm-white.svg +17 -0
  13. package/assets/images/pf-c-brand__logo-on-sm.svg +1 -1
  14. package/assets/images/pf-c-brand__logo-on-xl-white.svg +39 -0
  15. package/assets/images/pf_logo_white.hbs +35 -0
  16. package/assets/images/pf_logo_white.svg +38 -0
  17. package/base/_common.scss +8 -4
  18. package/base/_globals.scss +4 -6
  19. package/base/_variables.scss +2 -7
  20. package/base/patternfly-common.css +8 -4
  21. package/base/patternfly-globals.css +4 -3
  22. package/base/patternfly-variables.css +884 -871
  23. package/base/tokens/_tokens-charts.scss +159 -0
  24. package/base/tokens/_tokens-dark.scss +311 -287
  25. package/base/tokens/_tokens-default.scss +425 -329
  26. package/base/tokens/_tokens-font.scss +29 -36
  27. package/base/tokens/_tokens-palette.scss +71 -71
  28. package/base/tokens/_workspace-overrides.scss +7 -0
  29. package/components/AboutModalBox/about-modal-box.css +57 -94
  30. package/components/AboutModalBox/about-modal-box.scss +37 -62
  31. package/components/Accordion/accordion.css +85 -177
  32. package/components/Accordion/accordion.scss +96 -195
  33. package/components/ActionList/action-list.css +18 -17
  34. package/components/ActionList/action-list.scss +26 -16
  35. package/components/Alert/alert-group.css +20 -16
  36. package/components/Alert/alert-group.scss +20 -16
  37. package/components/Alert/alert.css +59 -84
  38. package/components/Alert/alert.scss +62 -78
  39. package/components/Avatar/avatar.css +10 -13
  40. package/components/Avatar/avatar.scss +10 -17
  41. package/components/BackToTop/back-to-top.css +17 -16
  42. package/components/BackToTop/back-to-top.scss +12 -12
  43. package/components/Backdrop/backdrop.css +6 -2
  44. package/components/Backdrop/backdrop.scss +5 -2
  45. package/components/BackgroundImage/background-image.css +5 -1
  46. package/components/BackgroundImage/background-image.scss +5 -1
  47. package/components/Badge/badge.css +23 -15
  48. package/components/Badge/badge.scss +25 -17
  49. package/components/Banner/banner.css +90 -64
  50. package/components/Banner/banner.scss +95 -32
  51. package/components/Breadcrumb/breadcrumb.css +19 -16
  52. package/components/Breadcrumb/breadcrumb.scss +18 -16
  53. package/components/Button/button.css +419 -353
  54. package/components/Button/button.scss +476 -476
  55. package/components/CalendarMonth/calendar-month.css +61 -92
  56. package/components/CalendarMonth/calendar-month.scss +68 -63
  57. package/components/Card/card.css +100 -194
  58. package/components/Card/card.scss +121 -237
  59. package/components/Check/check.css +24 -21
  60. package/components/Check/check.scss +25 -23
  61. package/components/ClipboardCopy/clipboard-copy.css +30 -33
  62. package/components/ClipboardCopy/clipboard-copy.scss +34 -26
  63. package/components/CodeBlock/code-block.css +22 -9
  64. package/components/CodeBlock/code-block.scss +22 -10
  65. package/components/CodeEditor/code-editor.css +94 -72
  66. package/components/CodeEditor/code-editor.scss +104 -82
  67. package/components/Content/content.css +7 -7
  68. package/components/Content/content.scss +7 -7
  69. package/components/DataList/data-list.css +101 -158
  70. package/components/DataList/data-list.scss +95 -154
  71. package/components/DatePicker/date-picker.css +13 -14
  72. package/components/DatePicker/date-picker.scss +12 -16
  73. package/components/DescriptionList/description-list.css +39 -34
  74. package/components/DescriptionList/description-list.scss +25 -25
  75. package/components/Divider/divider.css +91 -169
  76. package/components/Divider/divider.scss +60 -77
  77. package/components/DragDrop/drag-drop.css +18 -14
  78. package/components/DragDrop/drag-drop.scss +18 -17
  79. package/components/Drawer/drawer.css +112 -113
  80. package/components/Drawer/drawer.scss +134 -134
  81. package/components/Dropdown/dropdown.css +1 -3
  82. package/components/Dropdown/dropdown.scss +2 -6
  83. package/components/EmptyState/empty-state.css +57 -34
  84. package/components/EmptyState/empty-state.scss +63 -34
  85. package/components/ExpandableSection/expandable-section.css +64 -62
  86. package/components/ExpandableSection/expandable-section.scss +73 -76
  87. package/components/FileUpload/file-upload.css +28 -34
  88. package/components/FileUpload/file-upload.scss +30 -42
  89. package/components/Form/form.css +68 -114
  90. package/components/Form/form.scss +65 -126
  91. package/components/FormControl/form-control.css +86 -111
  92. package/components/FormControl/form-control.scss +88 -92
  93. package/components/HelperText/helper-text.css +28 -34
  94. package/components/HelperText/helper-text.scss +30 -40
  95. package/components/Hint/hint.css +28 -21
  96. package/components/Hint/hint.scss +28 -24
  97. package/components/Icon/icon.css +154 -18
  98. package/components/Icon/icon.scss +187 -20
  99. package/components/InlineEdit/inline-edit.css +8 -7
  100. package/components/InlineEdit/inline-edit.scss +8 -7
  101. package/components/InputGroup/input-group.css +22 -38
  102. package/components/InputGroup/input-group.scss +21 -29
  103. package/components/JumpLinks/jump-links.css +34 -34
  104. package/components/JumpLinks/jump-links.scss +35 -36
  105. package/components/Label/label-group.css +39 -44
  106. package/components/Label/label-group.scss +39 -45
  107. package/components/Label/label.css +380 -355
  108. package/components/Label/label.scss +434 -348
  109. package/components/List/list.css +16 -16
  110. package/components/List/list.scss +17 -17
  111. package/components/Login/login.css +70 -97
  112. package/components/Login/login.scss +56 -64
  113. package/components/Masthead/masthead.css +261 -502
  114. package/components/Masthead/masthead.scss +123 -286
  115. package/components/Menu/menu.css +3 -0
  116. package/components/Menu/menu.scss +7 -3
  117. package/components/MenuToggle/menu-toggle.css +8 -8
  118. package/components/MenuToggle/menu-toggle.scss +8 -10
  119. package/components/ModalBox/modal-box.css +59 -52
  120. package/components/ModalBox/modal-box.scss +57 -53
  121. package/components/MultipleFileUpload/multiple-file-upload.css +77 -50
  122. package/components/MultipleFileUpload/multiple-file-upload.scss +82 -53
  123. package/components/Nav/nav.css +240 -918
  124. package/components/Nav/nav.scss +300 -1082
  125. package/components/NotificationBadge/notification-badge.css +56 -81
  126. package/components/NotificationBadge/notification-badge.scss +60 -97
  127. package/components/NotificationDrawer/notification-drawer.css +104 -115
  128. package/components/NotificationDrawer/notification-drawer.scss +106 -116
  129. package/components/NumberInput/number-input.css +8 -8
  130. package/components/NumberInput/number-input.scss +7 -12
  131. package/components/OverflowMenu/overflow-menu.css +17 -47
  132. package/components/OverflowMenu/overflow-menu.scss +27 -65
  133. package/components/Page/page.css +56 -164
  134. package/components/Page/page.scss +60 -154
  135. package/components/Pagination/pagination.css +57 -124
  136. package/components/Pagination/pagination.scss +40 -128
  137. package/components/Panel/panel.css +27 -23
  138. package/components/Panel/panel.scss +29 -26
  139. package/components/Popover/popover.css +42 -53
  140. package/components/Popover/popover.scss +46 -55
  141. package/components/Progress/progress.css +31 -45
  142. package/components/Progress/progress.scss +36 -55
  143. package/components/ProgressStepper/progress-stepper.css +72 -69
  144. package/components/ProgressStepper/progress-stepper.scss +65 -65
  145. package/components/Radio/radio.css +27 -20
  146. package/components/Radio/radio.scss +28 -22
  147. package/components/Sidebar/sidebar.css +20 -9
  148. package/components/Sidebar/sidebar.scss +23 -11
  149. package/components/SimpleList/simple-list.css +35 -52
  150. package/components/SimpleList/simple-list.scss +41 -51
  151. package/components/Skeleton/skeleton.css +18 -20
  152. package/components/Skeleton/skeleton.scss +17 -21
  153. package/components/SkipToContent/skip-to-content.css +6 -3
  154. package/components/SkipToContent/skip-to-content.scss +8 -6
  155. package/components/Slider/slider.css +34 -30
  156. package/components/Slider/slider.scss +46 -43
  157. package/components/Spinner/spinner.css +17 -34
  158. package/components/Spinner/spinner.scss +19 -47
  159. package/components/Switch/switch.css +42 -38
  160. package/components/Switch/switch.scss +48 -43
  161. package/components/TabContent/tab-content.css +17 -11
  162. package/components/TabContent/tab-content.scss +18 -14
  163. package/components/Table/table-grid.css +29 -45
  164. package/components/Table/table-grid.scss +40 -53
  165. package/components/Table/table-scrollable.css +6 -6
  166. package/components/Table/table-scrollable.scss +8 -8
  167. package/components/Table/table-tree-view.css +76 -74
  168. package/components/Table/table-tree-view.scss +44 -39
  169. package/components/Table/table.css +67 -93
  170. package/components/Table/table.scss +83 -105
  171. package/components/Tabs/tabs.css +143 -175
  172. package/components/Tabs/tabs.scss +159 -217
  173. package/components/Tile/tile.css +40 -81
  174. package/components/Tile/tile.scss +38 -84
  175. package/components/Timestamp/timestamp.css +12 -9
  176. package/components/Timestamp/timestamp.scss +11 -10
  177. package/components/Title/title.css +70 -19
  178. package/components/Title/title.scss +90 -20
  179. package/components/ToggleGroup/toggle-group.css +54 -48
  180. package/components/ToggleGroup/toggle-group.scss +62 -50
  181. package/components/Toolbar/toolbar.css +2527 -1031
  182. package/components/Toolbar/toolbar.scss +233 -520
  183. package/components/Tooltip/tooltip.css +16 -18
  184. package/components/Tooltip/tooltip.scss +20 -24
  185. package/components/TreeView/tree-view.css +76 -97
  186. package/components/TreeView/tree-view.scss +82 -113
  187. package/components/Truncate/truncate.css +4 -0
  188. package/components/Truncate/truncate.scss +3 -0
  189. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  190. package/docs/components/Accordion/examples/Accordion.md +614 -416
  191. package/docs/components/ActionList/examples/ActionList.md +73 -22
  192. package/docs/components/Alert/examples/Alert.md +3 -3
  193. package/docs/components/Avatar/examples/Avatar.md +5 -19
  194. package/docs/components/BackgroundImage/examples/BackgroundImage.md +1 -1
  195. package/docs/components/Badge/examples/Badge.md +21 -0
  196. package/docs/components/Banner/examples/Banner.md +48 -25
  197. package/docs/components/Brand/examples/Brand.css +12 -0
  198. package/docs/components/Brand/examples/Brand.md +51 -32
  199. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  200. package/docs/components/Button/examples/Button.css +4 -0
  201. package/docs/components/Button/examples/Button.md +1419 -93
  202. package/docs/components/CalendarMonth/examples/CalendarMonth.md +48 -224
  203. package/docs/components/Card/examples/Card.md +550 -133
  204. package/docs/components/Check/examples/Check.md +1 -0
  205. package/docs/components/CodeBlock/examples/CodeBlock.md +4 -4
  206. package/docs/components/CodeEditor/examples/CodeEditor.md +144 -132
  207. package/docs/components/Content/examples/Content.md +5 -5
  208. package/docs/components/DatePicker/examples/DatePicker.md +5 -2
  209. package/docs/components/Divider/examples/Divider.css +3 -1
  210. package/docs/components/Divider/examples/Divider.md +30 -5
  211. package/docs/components/DragDrop/examples/DragDrop.css +1 -1
  212. package/docs/components/Drawer/examples/Drawer.md +294 -256
  213. package/docs/components/EmptyState/examples/EmptyState.md +45 -1
  214. package/docs/components/ExpandableSection/examples/ExpandableSection.md +49 -28
  215. package/docs/components/FileUpload/examples/FileUpload.md +112 -53
  216. package/docs/components/Form/examples/Form.md +134 -89
  217. package/docs/components/Icon/examples/Icon.md +82 -11
  218. package/docs/components/InlineEdit/examples/InlineEdit.md +3 -1
  219. package/docs/components/JumpLinks/examples/JumpLinks.md +280 -168
  220. package/docs/components/Label/examples/Label.css +4 -0
  221. package/docs/components/Label/examples/Label.md +3090 -703
  222. package/docs/components/LogViewer/examples/LogViewer.md +180 -180
  223. package/docs/components/Login/examples/Login.md +10 -5
  224. package/docs/components/Masthead/examples/masthead.md +443 -65
  225. package/docs/components/Menu/examples/Menu.md +507 -473
  226. package/docs/components/MenuToggle/examples/MenuToggle.md +106 -114
  227. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  228. package/docs/components/Nav/examples/Navigation.css +1 -23
  229. package/docs/components/Nav/examples/Navigation.md +209 -356
  230. package/docs/components/NotificationBadge/examples/NotificationBadge.md +5 -7
  231. package/docs/components/Page/examples/Page.css +0 -8
  232. package/docs/components/Page/examples/Page.md +22 -21
  233. package/docs/components/Pagination/examples/Pagination.md +663 -637
  234. package/docs/components/Panel/examples/Panel.md +12 -0
  235. package/docs/components/Popover/examples/Popover.md +1 -1
  236. package/docs/components/ProgressStepper/examples/ProgressStepper.md +15 -14
  237. package/docs/components/Radio/examples/Radio.md +1 -1
  238. package/docs/components/Sidebar/examples/Sidebar.md +19 -0
  239. package/docs/components/SimpleList/examples/SimpleList.md +3 -3
  240. package/docs/components/TabContent/examples/TabContent.md +10 -10
  241. package/docs/components/Table/examples/Table.md +8 -8
  242. package/docs/components/Tabs/examples/Tabs.css +1 -1
  243. package/docs/components/Tabs/examples/Tabs.md +1025 -826
  244. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  245. package/docs/components/Tile/examples/Tile.md +264 -144
  246. package/docs/components/Title/examples/Title.md +18 -0
  247. package/docs/components/Toolbar/examples/Toolbar.css +20 -15
  248. package/docs/components/Toolbar/examples/Toolbar.md +985 -3355
  249. package/docs/components/TreeView/examples/TreeView.md +7 -57
  250. package/docs/components/Truncate/examples/Truncate.css +2 -2
  251. package/docs/demos/AboutModal/examples/AboutModal.md +104 -31
  252. package/docs/demos/Alert/examples/Alert.md +330 -87
  253. package/docs/demos/BackToTop/examples/BackToTop.md +102 -29
  254. package/docs/demos/Banner/examples/Banner.md +211 -60
  255. package/docs/demos/Card/examples/Card.md +2 -2
  256. package/docs/demos/CardView/examples/CardView.md +241 -187
  257. package/docs/demos/ContextSelector/examples/ContextSelector.md +377 -94
  258. package/docs/demos/Dashboard/examples/Dashboard.md +102 -29
  259. package/docs/demos/DataList/examples/DataList.md +999 -938
  260. package/docs/demos/DescriptionList/examples/DescriptionList.md +306 -87
  261. package/docs/demos/Drawer/examples/Drawer.md +640 -251
  262. package/docs/demos/Form/examples/BasicForms.md +138 -84
  263. package/docs/demos/JumpLinks/examples/JumpLinks.md +917 -385
  264. package/docs/demos/Masthead/examples/Masthead.md +786 -342
  265. package/docs/demos/Modal/examples/Modal.md +645 -198
  266. package/docs/demos/Nav/examples/Nav.md +691 -902
  267. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +515 -145
  268. package/docs/demos/Page/examples/Page.md +942 -273
  269. package/docs/demos/Page/examples/Penta.md +66 -26
  270. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -9
  271. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +44 -32
  272. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +1183 -832
  273. package/docs/demos/Skeleton/examples/Skeleton.md +102 -29
  274. package/docs/demos/Table/examples/Table.md +3811 -3456
  275. package/docs/demos/Tabs/examples/Tabs.md +636 -194
  276. package/docs/demos/Toolbar/examples/Toolbar.css +10 -0
  277. package/docs/demos/Toolbar/examples/Toolbar.md +1316 -1478
  278. package/docs/demos/Wizard/examples/Wizard.md +918 -261
  279. package/docs/layouts/Flex/examples/Flex.md +11 -11
  280. package/package.json +32 -32
  281. package/patternfly-base-no-globals-theme-dark-unversioned.css +897 -880
  282. package/patternfly-base-no-globals.css +897 -880
  283. package/patternfly-base-theme-dark-unversioned.css +890 -872
  284. package/patternfly-base.css +890 -872
  285. package/patternfly-no-globals.css +8053 -7977
  286. package/patternfly-theme-dark-unversioned.css +8059 -7982
  287. package/patternfly.css +8059 -7982
  288. package/patternfly.min.css +1 -1
  289. package/patternfly.min.css.map +1 -1
  290. package/sass-utilities/mixins.scss +18 -0
  291. package/base/themes/dark/_variables.scss +0 -102
  292. package/components/AboutModalBox/themes/dark/about-modal-box.scss +0 -7
  293. package/components/Accordion/themes/dark/accordion.scss +0 -9
  294. package/components/Alert/themes/dark/alert.scss +0 -17
  295. package/components/Badge/themes/dark/badge.scss +0 -9
  296. package/components/Banner/themes/dark/banner.scss +0 -14
  297. package/components/Button/themes/dark/button.scss +0 -51
  298. package/components/CalendarMonth/themes/dark/calendar-month.scss +0 -37
  299. package/components/Card/themes/dark/card.scss +0 -20
  300. package/components/ClipboardCopy/themes/dark/clipboard-copy.scss +0 -19
  301. package/components/CodeEditor/themes/dark/code-editor.scss +0 -14
  302. package/components/DataList/themes/dark/data-list.scss +0 -10
  303. package/components/DatePicker/themes/dark/date-picker.scss +0 -8
  304. package/components/DragDrop/themes/dark/drag-drop.scss +0 -7
  305. package/components/Drawer/themes/dark/drawer.scss +0 -13
  306. package/components/Form/themes/dark/form.scss +0 -7
  307. package/components/FormControl/themes/dark/form-control.scss +0 -24
  308. package/components/HelperText/themes/dark/helper-text.scss +0 -7
  309. package/components/Hint/themes/dark/hint.scss +0 -8
  310. package/components/InputGroup/themes/dark/input-group.scss +0 -22
  311. package/components/Label/themes/dark/label.scss +0 -53
  312. package/components/Login/themes/dark/login.scss +0 -12
  313. package/components/Masthead/themes/dark/masthead.scss +0 -14
  314. package/components/ModalBox/themes/dark/modal-box.scss +0 -7
  315. package/components/NotificationBadge/themes/dark/notification-badge.scss +0 -10
  316. package/components/NotificationDrawer/themes/dark/notification-drawer.scss +0 -14
  317. package/components/Page/themes/dark/page.scss +0 -69
  318. package/components/Pagination/themes/dark/pagination.scss +0 -7
  319. package/components/Panel/themes/dark/panel.scss +0 -7
  320. package/components/Popover/themes/dark/popover.scss +0 -11
  321. package/components/Progress/themes/dark/progress.scss +0 -9
  322. package/components/SimpleList/themes/dark/simple-list.scss +0 -14
  323. package/components/Skeleton/themes/dark/skeleton.scss +0 -10
  324. package/components/Switch/themes/dark/switch.scss +0 -11
  325. package/components/Tabs/themes/dark/tabs.scss +0 -10
  326. package/components/Tile/themes/dark/tile.scss +0 -10
  327. package/components/ToggleGroup/themes/dark/toggle-group.scss +0 -12
  328. package/components/Tooltip/themes/dark/tooltip.scss +0 -8
  329. package/components/TreeView/themes/dark/tree-view.scss +0 -8
  330. package/docs/components/Avatar/examples/Avatar.css +0 -3
  331. package/docs/components/NotificationBadge/examples/NotificationBadge.css +0 -3
package/docs/components/Form/examples/Form.md CHANGED
@@ -11,14 +11,17 @@ cssPrefix: pf-v5-c-form
11
11
  <form class="pf-v5-c-form" novalidate>
12
12
  <div class="pf-v5-c-form__group">
13
13
  <div class="pf-v5-c-form__group-label"><label class="pf-v5-c-form__label" for="form-vertical-name">
14
- <span class="pf-v5-c-form__label-text">Name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
15
- class="pf-v5-c-form__group-label-help"
16
- aria-label="More information for name field"
17
- aria-describedby="form-vertical-name"
18
- role="button"
19
- type="button"
20
- tabindex="0"
21
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
14
+ <span class="pf-v5-c-form__label-text">Name</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">
15
+ <span
16
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
17
+ type="button"
18
+ role="button"
19
+ tabindex="0"
20
+ aria-label="More information for name field"
21
+ aria-describedby="form-vertical-name"
22
+ >
23
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
24
+ </span></span>
22
25
  </div>
23
26
  <div class="pf-v5-c-form__group-control">
24
27
  <span class="pf-v5-c-form-control pf-m-required">
@@ -56,14 +59,17 @@ cssPrefix: pf-v5-c-form
56
59
  </div>
57
60
  <div class="pf-v5-c-form__group">
58
61
  <div class="pf-v5-c-form__group-label"><label class="pf-v5-c-form__label" for="form-horizontal-info">
59
- <span class="pf-v5-c-form__label-text">Information</span></label>&nbsp;<span
60
- class="pf-v5-c-form__group-label-help"
61
- aria-label="More information for information field"
62
- aria-describedby="form-horizontal-info"
63
- role="button"
64
- type="button"
65
- tabindex="0"
66
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
62
+ <span class="pf-v5-c-form__label-text">Information</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
63
+ <span
64
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
65
+ type="button"
66
+ role="button"
67
+ tabindex="0"
68
+ aria-label="More information for information field"
69
+ aria-describedby="form-horizontal-info"
70
+ >
71
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
72
+ </span></span>
67
73
  </div>
68
74
  <div class="pf-v5-c-form__group-control">
69
75
  <span class="pf-v5-c-form-control">
@@ -85,14 +91,17 @@ cssPrefix: pf-v5-c-form
85
91
  class="pf-v5-c-form__group-label pf-m-no-padding-top"
86
92
  id="form-horizontalform-horizontal-checkbox-legend"
87
93
  ><span class="pf-v5-c-form__label">
88
- <span class="pf-v5-c-form__label-text">Label (no top padding)</span></span>&nbsp;<span
89
- class="pf-v5-c-form__group-label-help"
90
- aria-label="More information for label field"
91
- aria-describedby="form-horizontal-checkbox-legend"
92
- role="button"
93
- type="button"
94
- tabindex="0"
95
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
94
+ <span class="pf-v5-c-form__label-text">Label (no top padding)</span></span>&nbsp;<span class="pf-v5-c-form__group-label-help">
95
+ <span
96
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
97
+ type="button"
98
+ role="button"
99
+ tabindex="0"
100
+ aria-label="More information for label field"
101
+ aria-describedby="form-horizontal-checkbox-legend"
102
+ >
103
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
104
+ </span></span>
96
105
  </div>
97
106
  <div class="pf-v5-c-form__group-control pf-m-stack">
98
107
  <div class="pf-v5-c-check">
@@ -136,14 +145,17 @@ cssPrefix: pf-v5-c-form
136
145
  class="pf-v5-c-form__label"
137
146
  for="form-horizontal-custom-breakpoint-name"
138
147
  >
139
- <span class="pf-v5-c-form__label-text">Name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
140
- class="pf-v5-c-form__group-label-help"
141
- aria-label="More information for name field"
142
- aria-describedby="form-horizontal-custom-breakpoint-name"
143
- role="button"
144
- type="button"
145
- tabindex="0"
146
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
148
+ <span class="pf-v5-c-form__label-text">Name</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">
149
+ <span
150
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
151
+ type="button"
152
+ role="button"
153
+ tabindex="0"
154
+ aria-label="More information for name field"
155
+ aria-describedby="form-horizontal-custom-breakpoint-name"
156
+ >
157
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
158
+ </span></span>
147
159
  </div>
148
160
  <div class="pf-v5-c-form__group-control">
149
161
  <span class="pf-v5-c-form-control pf-m-required">
@@ -277,6 +289,9 @@ cssPrefix: pf-v5-c-form
277
289
  class="pf-v5-c-helper-text__item"
278
290
  id="form-help-text-name-helper"
279
291
  >
292
+ <span class="pf-v5-c-helper-text__item-icon">
293
+ <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
294
+ </span>
280
295
  <span class="pf-v5-c-helper-text__item-text">This is helper text.</span>
281
296
  </div>
282
297
  </div>
@@ -308,6 +323,9 @@ cssPrefix: pf-v5-c-form
308
323
  class="pf-v5-c-helper-text__item pf-m-warning"
309
324
  id="form-help-text-email-helper"
310
325
  >
326
+ <span class="pf-v5-c-helper-text__item-icon">
327
+ <i class="fas fa-fw fa-exclamation-triangle" aria-hidden="true"></i>
328
+ </span>
311
329
  <span
312
330
  class="pf-v5-c-helper-text__item-text"
313
331
  >This is helper text for a warning input.</span>
@@ -342,6 +360,9 @@ cssPrefix: pf-v5-c-form
342
360
  class="pf-v5-c-helper-text__item pf-m-error"
343
361
  id="-address-helper"
344
362
  >
363
+ <span class="pf-v5-c-helper-text__item-icon">
364
+ <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
365
+ </span>
345
366
  <span
346
367
  class="pf-v5-c-helper-text__item-text"
347
368
  >This is helper text for an invalid input.</span>
@@ -375,6 +396,9 @@ cssPrefix: pf-v5-c-form
375
396
  class="pf-v5-c-helper-text__item pf-m-success"
376
397
  id="form-help-text-comment-helper"
377
398
  >
399
+ <span class="pf-v5-c-helper-text__item-icon">
400
+ <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
401
+ </span>
378
402
  <span
379
403
  class="pf-v5-c-helper-text__item-text"
380
404
  >This is helper text for success input.</span>
@@ -429,14 +453,17 @@ cssPrefix: pf-v5-c-form
429
453
  <div class="pf-v5-c-form__group">
430
454
  <div class="pf-v5-c-form__group-label pf-m-info">
431
455
  <div class="pf-v5-c-form__group-label-main"><label class="pf-v5-c-form__label" for="form-additional-info-name">
432
- <span class="pf-v5-c-form__label-text">Name</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
433
- class="pf-v5-c-form__group-label-help"
434
- aria-label="More information for name field"
435
- aria-describedby="form-additional-infoform-additional-info-name"
436
- role="button"
437
- type="button"
438
- tabindex="0"
439
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
456
+ <span class="pf-v5-c-form__label-text">Name</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">
457
+ <span
458
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
459
+ type="button"
460
+ role="button"
461
+ tabindex="0"
462
+ aria-label="More information for name field"
463
+ aria-describedby="form-additional-infoform-additional-info-name"
464
+ >
465
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
466
+ </span></span>
440
467
  </div>
441
468
  <div class="pf-v5-c-form__group-label-info">info</div>
442
469
  </div>
@@ -500,14 +527,17 @@ cssPrefix: pf-v5-c-form
500
527
  class="pf-v5-c-form__label"
501
528
  for="form-field-group-field-group-label1"
502
529
  >
503
- <span class="pf-v5-c-form__label-text">Label 1</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
504
- class="pf-v5-c-form__group-label-help"
505
- aria-label="More information for label 1 field"
506
- aria-describedby="form-field-group-field-group-label1"
507
- role="button"
508
- type="button"
509
- tabindex="0"
510
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
530
+ <span class="pf-v5-c-form__label-text">Label 1</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">
531
+ <span
532
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
533
+ type="button"
534
+ role="button"
535
+ tabindex="0"
536
+ aria-label="More information for label 1 field"
537
+ aria-describedby="form-field-group-field-group-label1"
538
+ >
539
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
540
+ </span></span>
511
541
  </div>
512
542
  <div class="pf-v5-c-form__group-control">
513
543
  <span class="pf-v5-c-form-control pf-m-required">
@@ -525,14 +555,17 @@ cssPrefix: pf-v5-c-form
525
555
  class="pf-v5-c-form__label"
526
556
  for="form-field-group-field-group-label2"
527
557
  >
528
- <span class="pf-v5-c-form__label-text">Label 2</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
529
- class="pf-v5-c-form__group-label-help"
530
- aria-label="More information for label 2 field"
531
- aria-describedby="form-field-group-field-group-label2"
532
- role="button"
533
- type="button"
534
- tabindex="0"
535
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
558
+ <span class="pf-v5-c-form__label-text">Label 2</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">
559
+ <span
560
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
561
+ type="button"
562
+ role="button"
563
+ tabindex="0"
564
+ aria-label="More information for label 2 field"
565
+ aria-describedby="form-field-group-field-group-label2"
566
+ >
567
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
568
+ </span></span>
536
569
  </div>
537
570
  <div class="pf-v5-c-form__group-control">
538
571
  <span class="pf-v5-c-form-control pf-m-required">
@@ -633,14 +666,17 @@ cssPrefix: pf-v5-c-form
633
666
  class="pf-v5-c-form__label"
634
667
  for="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label1"
635
668
  >
636
- <span class="pf-v5-c-form__label-text">Label 1</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
637
- class="pf-v5-c-form__group-label-help"
638
- aria-label="More information for label 1 field"
639
- aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label1"
640
- role="button"
641
- type="button"
642
- tabindex="0"
643
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
669
+ <span class="pf-v5-c-form__label-text">Label 1</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">
670
+ <span
671
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
672
+ type="button"
673
+ role="button"
674
+ tabindex="0"
675
+ aria-label="More information for label 1 field"
676
+ aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label1"
677
+ >
678
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
679
+ </span></span>
644
680
  </div>
645
681
  <div class="pf-v5-c-form__group-control">
646
682
  <span class="pf-v5-c-form-control pf-m-required">
@@ -658,14 +694,17 @@ cssPrefix: pf-v5-c-form
658
694
  class="pf-v5-c-form__label"
659
695
  for="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label2"
660
696
  >
661
- <span class="pf-v5-c-form__label-text">Label 2</span>&nbsp;<span class="pf-v5-c-form__label-required" aria-hidden="true">&#42;</span></label>&nbsp;<span
662
- class="pf-v5-c-form__group-label-help"
663
- aria-label="More information for label 2 field"
664
- aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label2"
665
- role="button"
666
- type="button"
667
- tabindex="0"
668
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
697
+ <span class="pf-v5-c-form__label-text">Label 2</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">
698
+ <span
699
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
700
+ type="button"
701
+ role="button"
702
+ tabindex="0"
703
+ aria-label="More information for label 2 field"
704
+ aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-2-label2"
705
+ >
706
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
707
+ </span></span>
669
708
  </div>
670
709
  <div class="pf-v5-c-form__group-control">
671
710
  <span class="pf-v5-c-form-control pf-m-required">
@@ -702,14 +741,17 @@ cssPrefix: pf-v5-c-form
702
741
  <span class="pf-v5-c-form__label-text">Label 1</span>&nbsp;<span
703
742
  class="pf-v5-c-form__label-required"
704
743
  aria-hidden="true"
705
- >&#42;</span></label>&nbsp;<span
706
- class="pf-v5-c-form__group-label-help"
707
- aria-label="More information for label 1 field"
708
- aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label1"
709
- role="button"
710
- type="button"
711
- tabindex="0"
712
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
744
+ >&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
745
+ <span
746
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
747
+ type="button"
748
+ role="button"
749
+ tabindex="0"
750
+ aria-label="More information for label 1 field"
751
+ aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label1"
752
+ >
753
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
754
+ </span></span>
713
755
  </div>
714
756
  <div class="pf-v5-c-form__group-control">
715
757
  <span class="pf-v5-c-form-control pf-m-required">
@@ -730,14 +772,17 @@ cssPrefix: pf-v5-c-form
730
772
  <span class="pf-v5-c-form__label-text">Label 2</span>&nbsp;<span
731
773
  class="pf-v5-c-form__label-required"
732
774
  aria-hidden="true"
733
- >&#42;</span></label>&nbsp;<span
734
- class="pf-v5-c-form__group-label-help"
735
- aria-label="More information for label 2 field"
736
- aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label2"
737
- role="button"
738
- type="button"
739
- tabindex="0"
740
- ><i class="pf-v5-pficon pf-v5-pficon-help" aria-hidden="true"></i></span>
775
+ >&#42;</span></label>&nbsp;<span class="pf-v5-c-form__group-label-help">
776
+ <span
777
+ class="pf-v5-c-button pf-m-plain pf-m-no-padding"
778
+ type="button"
779
+ role="button"
780
+ tabindex="0"
781
+ aria-label="More information for label 2 field"
782
+ aria-describedby="form-expandable-field-groupsform-expandable-field-groups-field-group-3-label2"
783
+ >
784
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
785
+ </span></span>
741
786
  </div>
742
787
  <div class="pf-v5-c-form__group-control">
743
788
  <span class="pf-v5-c-form-control pf-m-required">
@@ -799,7 +844,7 @@ To avoid the form label's required indicator or help tooltip icon from wrapping
799
844
  | `.pf-v5-c-form__label-required` | `<span>` | Initiates a form label required indicator. |
800
845
  | `.pf-v5-c-form__group-label-main` | `<div>` | Initiates a form group label main container. |
801
846
  | `.pf-v5-c-form__group-label-info` | `<div>` | Initiates a form group info label. |
802
- | `.pf-v5-c-form__group-label-help` | `<button>`, `<span>` | Initiates a field level help span/button. |
847
+ | `.pf-v5-c-form__group-label-help` | `<span>` | Initiates field level help. |
803
848
  | `.pf-v5-c-form__group-control` | `<div>` | Initiates a form group control section. |
804
849
  | `.pf-v5-c-form__actions` | `<div>` | Iniates a row of actions. |
805
850
  | `.pf-v5-c-form__helper-text` | `<p>`, `<div>` | Initiates a form helper text block. |
package/docs/components/Icon/examples/Icon.md CHANGED
@@ -33,7 +33,7 @@ cssPrefix: pf-v5-c-icon
33
33
 
34
34
  ```
35
35
 
36
- ### Sizes
36
+ ### Standalone icon sizes
37
37
 
38
38
  ```html
39
39
  <span class="pf-v5-c-icon pf-m-sm">
@@ -56,6 +56,73 @@ cssPrefix: pf-v5-c-icon
56
56
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
57
57
  </span>
58
58
  </span>
59
+ <span class="pf-v5-c-icon pf-m-2xl">
60
+ <span class="pf-v5-c-icon__content">
61
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
62
+ </span>
63
+ </span>
64
+ <span class="pf-v5-c-icon pf-m-3xl">
65
+ <span class="pf-v5-c-icon__content">
66
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
67
+ </span>
68
+ </span>
69
+
70
+ ```
71
+
72
+ ### Body sizes
73
+
74
+ ```html
75
+ <span class="pf-v5-c-icon pf-m-body-sm">
76
+ <span class="pf-v5-c-icon__content">
77
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
78
+ </span>
79
+ </span>
80
+ <span class="pf-v5-c-icon pf-m-body-default">
81
+ <span class="pf-v5-c-icon__content">
82
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
83
+ </span>
84
+ </span>
85
+ <span class="pf-v5-c-icon pf-m-body-lg">
86
+ <span class="pf-v5-c-icon__content">
87
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
88
+ </span>
89
+ </span>
90
+
91
+ ```
92
+
93
+ ### Heading sizes
94
+
95
+ ```html
96
+ <span class="pf-v5-c-icon pf-m-heading-sm">
97
+ <span class="pf-v5-c-icon__content">
98
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
99
+ </span>
100
+ </span>
101
+ <span class="pf-v5-c-icon pf-m-heading-md">
102
+ <span class="pf-v5-c-icon__content">
103
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
104
+ </span>
105
+ </span>
106
+ <span class="pf-v5-c-icon pf-m-heading-lg">
107
+ <span class="pf-v5-c-icon__content">
108
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
109
+ </span>
110
+ </span>
111
+ <span class="pf-v5-c-icon pf-m-heading-xl">
112
+ <span class="pf-v5-c-icon__content">
113
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
114
+ </span>
115
+ </span>
116
+ <span class="pf-v5-c-icon pf-m-heading-2xl">
117
+ <span class="pf-v5-c-icon__content">
118
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
119
+ </span>
120
+ </span>
121
+ <span class="pf-v5-c-icon pf-m-heading-3xl">
122
+ <span class="pf-v5-c-icon__content">
123
+ <i class="fas fa-plus-circle" aria-hidden="true"></i>
124
+ </span>
125
+ </span>
59
126
 
60
127
  ```
61
128
 
@@ -95,23 +162,23 @@ cssPrefix: pf-v5-c-icon
95
162
  Use a size modifier on the icon container to maintain a consistent size, even if the contents change in size.
96
163
 
97
164
  ```html
98
- <span class="pf-v5-c-icon pf-m-xl pf-m-inline">
99
- <span class="pf-v5-c-icon__content pf-m-sm">
165
+ <span class="pf-v5-c-icon pf-m-3xl pf-m-inline">
166
+ <span class="pf-v5-c-icon__content pf-m-lg">
100
167
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
101
168
  </span>
102
169
  </span>
103
- <span class="pf-v5-c-icon pf-m-xl pf-m-inline">
104
- <span class="pf-v5-c-icon__content pf-m-md">
170
+ <span class="pf-v5-c-icon pf-m-3xl pf-m-inline">
171
+ <span class="pf-v5-c-icon__content pf-m-xl">
105
172
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
106
173
  </span>
107
174
  </span>
108
- <span class="pf-v5-c-icon pf-m-xl pf-m-inline">
109
- <span class="pf-v5-c-icon__content pf-m-lg">
175
+ <span class="pf-v5-c-icon pf-m-3xl pf-m-inline">
176
+ <span class="pf-v5-c-icon__content pf-m-2xl">
110
177
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
111
178
  </span>
112
179
  </span>
113
- <span class="pf-v5-c-icon pf-m-xl pf-m-inline">
114
- <span class="pf-v5-c-icon__content pf-m-xl">
180
+ <span class="pf-v5-c-icon pf-m-3xl pf-m-inline">
181
+ <span class="pf-v5-c-icon__content pf-m-3xl">
115
182
  <i class="fas fa-plus-circle" aria-hidden="true"></i>
116
183
  </span>
117
184
  </span>
@@ -248,7 +315,11 @@ Refer to the [icons](/design-foundations/icons) page for information about the P
248
315
  | `.pf-v5-c-icon__content` | `<span>`, `<div>` | Initiates the icon content. **Required** |
249
316
  | `.pf-v5-c-icon__progress` | `<span>`, `<div>` | Initiates a container for a progress spinner. |
250
317
  | `.pf-m-inline` | `.pf-v5-c-icon` | Displays the icon inline with text, and allows the icon to inherit the size and color of the parent. |
251
- | `.pf-m-[sm,md,lg,xl]` | `.pf-v5-c-icon` | Modifies the icon container to be small, medium, large, or extra large. |
252
- | `.pf-m-[sm,md,lg,xl]` | `.pf-v5-c-icon__content`, `pf-v5-c-icon__progress` | Modifies the icon content or progress element to be small, medium, large, or extra large. |
318
+ | `.pf-m-[sm,md,lg,xl,2xl,3xl]` | `.pf-v5-c-icon` | Modifies the icon container to be small, medium, large, extra large, double extra large, or triple extra large. |
319
+ | `.pf-m-body-[sm,default,lg]` | `.pf-v5-c-icon` | Modifies the icon container to be a size matching small, default, or large body text. |
320
+ | `.pf-m-heading-[sm,md,lg,xl,2xl,3xl]` | `.pf-v5-c-icon` | Modifies the icon container to be a size matching small, medium, large, extra large, double extra large, or triple extra large (h6-h1) heading text. |
321
+ | `.pf-m-[sm,md,lg,xl,2xl,3xl]` | `.pf-v5-c-icon__content`, `pf-v5-c-icon__progress` | Modifies the icon content or progress element to be small, medium, large, or extra large. |
322
+ | `.pf-m-body-[sm,default,lg]` | `.pf-v5-c-icon__content` | Modifies the icon content or progress element to be a size matching small, default, or large body text. |
323
+ | `.pf-m-heading-[sm,md,lg,xl,2xl,3xl]` | `.pf-v5-c-icon__content` | Modifies the icon content or progress element to be a size matching small, medium, large, extra large, double extra large, or triple extra large (h6-h1) heading text. |
253
324
  | `.pf-m-in-progress` | `.pf-v5-c-icon` | Shows the progress element in place of the icon content. |
254
325
  | `.pf-m-danger`, `.pf-m-warning`, `.pf-m-success`, `.pf-m-info`, `.pf-m-custom` | `.pf-v5-c-icon__content` | Modifies the icon content to use a status color. |
package/docs/components/InlineEdit/examples/InlineEdit.md CHANGED
@@ -930,4 +930,6 @@ All accessibility requirements for inputs apply to elements within inline edit.
930
930
  | `.pf-m-valid` | `.pf-v5-c-inline-edit__action` | Modifies the action button state. |
931
931
  | `.pf-m-enable-editable` | `.pf-v5-c-inline-edit__action` | Exposes an inline edit action by default. |
932
932
 
933
- -->
933
+ ```
934
+ -->
935
+ ```