@patternfly/patternfly 6.6.0-prerelease.3 → 6.6.0-prerelease.30

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 (158) hide show
  1. package/assets/fonts/RedHatDisplay/RedHatDisplayVF-Italic.woff2 +0 -0
  2. package/assets/fonts/RedHatDisplay/RedHatDisplayVF.woff2 +0 -0
  3. package/assets/fonts/RedHatMono/RedHatMonoVF-Italic.woff2 +0 -0
  4. package/assets/fonts/RedHatMono/RedHatMonoVF.woff2 +0 -0
  5. package/assets/fonts/RedHatText/RedHatTextVF-Italic.woff2 +0 -0
  6. package/assets/fonts/RedHatText/RedHatTextVF.woff2 +0 -0
  7. package/assets/images/img_avatar-rhds.svg +22 -0
  8. package/assets/images/pf-logo-avatar.jpg +0 -0
  9. package/base/patternfly-fonts.css +4 -4
  10. package/base/patternfly-fonts.scss +4 -4
  11. package/base/patternfly-variables.css +8 -6
  12. package/base/tokens/tokens-charts-dark.scss +1 -1
  13. package/base/tokens/tokens-charts-highcontrast-dark.scss +1 -1
  14. package/base/tokens/tokens-charts-highcontrast.scss +1 -1
  15. package/base/tokens/tokens-charts.scss +1 -1
  16. package/base/tokens/tokens-dark.scss +1 -1
  17. package/base/tokens/tokens-default.scss +4 -4
  18. package/base/tokens/tokens-felt-dark.scss +1 -1
  19. package/base/tokens/tokens-felt-glass-dark.scss +1 -1
  20. package/base/tokens/tokens-felt-glass.scss +3 -2
  21. package/base/tokens/tokens-felt-highcontrast-dark.scss +1 -1
  22. package/base/tokens/tokens-felt-highcontrast.scss +1 -1
  23. package/base/tokens/tokens-felt.scss +1 -1
  24. package/base/tokens/tokens-glass-dark.scss +1 -1
  25. package/base/tokens/tokens-glass.scss +3 -2
  26. package/base/tokens/tokens-highcontrast-dark.scss +1 -1
  27. package/base/tokens/tokens-highcontrast.scss +4 -4
  28. package/base/tokens/tokens-palette.scss +1 -1
  29. package/base/tokens/tokens-redhat-highcontrast.scss +3 -3
  30. package/components/AboutModalBox/about-modal-box.css +1 -1
  31. package/components/AboutModalBox/about-modal-box.scss +1 -1
  32. package/components/Accordion/accordion.css +3 -3
  33. package/components/Accordion/accordion.scss +3 -3
  34. package/components/Alert/alert.css +8 -7
  35. package/components/Alert/alert.scss +8 -7
  36. package/components/Avatar/avatar.css +144 -0
  37. package/components/Avatar/avatar.scss +161 -0
  38. package/components/Banner/banner.css +7 -0
  39. package/components/Banner/banner.scss +7 -0
  40. package/components/Breadcrumb/breadcrumb.css +3 -3
  41. package/components/Breadcrumb/breadcrumb.scss +3 -3
  42. package/components/Button/button.css +20 -4
  43. package/components/Button/button.scss +24 -5
  44. package/components/Card/card.css +4 -4
  45. package/components/Card/card.scss +4 -4
  46. package/components/ClipboardCopy/clipboard-copy.css +1 -1
  47. package/components/ClipboardCopy/clipboard-copy.scss +1 -1
  48. package/components/DataList/data-list.css +5 -5
  49. package/components/DataList/data-list.scss +5 -5
  50. package/components/DragDrop/drag-drop.css +4 -0
  51. package/components/DragDrop/drag-drop.scss +4 -0
  52. package/components/DualListSelector/dual-list-selector.css +1 -1
  53. package/components/DualListSelector/dual-list-selector.scss +1 -1
  54. package/components/Form/form.scss +1 -0
  55. package/components/FormControl/form-control.css +12 -2
  56. package/components/FormControl/form-control.scss +14 -2
  57. package/components/Hint/hint.css +2 -2
  58. package/components/Hint/hint.scss +2 -2
  59. package/components/Label/label.css +9 -3
  60. package/components/Label/label.scss +9 -3
  61. package/components/Masthead/masthead.css +1 -1
  62. package/components/Masthead/masthead.scss +1 -1
  63. package/components/Menu/menu.css +2 -2
  64. package/components/Menu/menu.scss +3 -3
  65. package/components/MenuToggle/menu-toggle.css +3 -0
  66. package/components/MenuToggle/menu-toggle.scss +4 -1
  67. package/components/ModalBox/modal-box.css +4 -4
  68. package/components/ModalBox/modal-box.scss +5 -5
  69. package/components/Nav/nav.css +2 -2
  70. package/components/Nav/nav.scss +2 -2
  71. package/components/NotificationDrawer/notification-drawer.css +3 -3
  72. package/components/NotificationDrawer/notification-drawer.scss +3 -3
  73. package/components/Page/page.css +25 -22
  74. package/components/Page/page.scss +28 -28
  75. package/components/Pagination/pagination.css +12 -7
  76. package/components/Pagination/pagination.scss +15 -12
  77. package/components/Panel/panel.css +1 -1
  78. package/components/Panel/panel.scss +2 -2
  79. package/components/Popover/popover.css +1 -1
  80. package/components/Popover/popover.scss +1 -1
  81. package/components/Progress/progress.css +2 -2
  82. package/components/Progress/progress.scss +2 -2
  83. package/components/Sidebar/sidebar.css +4 -7
  84. package/components/Sidebar/sidebar.scss +9 -9
  85. package/components/Table/table-grid.css +25 -13
  86. package/components/Table/table-grid.scss +10 -5
  87. package/components/Table/table-tree-view.css +3 -0
  88. package/components/Table/table-tree-view.scss +2 -0
  89. package/components/Table/table.css +55 -21
  90. package/components/Table/table.scss +82 -34
  91. package/components/Tabs/tabs.css +19 -5
  92. package/components/Tabs/tabs.scss +22 -5
  93. package/components/Title/title.css +1 -1
  94. package/components/Title/title.scss +1 -1
  95. package/components/Tooltip/tooltip.css +1 -1
  96. package/components/Tooltip/tooltip.scss +1 -1
  97. package/components/TreeView/tree-view.css +7 -7
  98. package/components/TreeView/tree-view.scss +7 -7
  99. package/components/Wizard/wizard.css +4 -4
  100. package/components/Wizard/wizard.scss +4 -4
  101. package/components/_index.css +399 -140
  102. package/docs/components/Avatar/examples/Avatar.css +6 -0
  103. package/docs/components/Avatar/examples/Avatar.md +414 -40
  104. package/docs/components/Button/examples/Button.md +2 -2
  105. package/docs/components/CodeEditor/examples/CodeEditor.md +131 -47
  106. package/docs/components/DataList/examples/DataList.md +143 -11
  107. package/docs/components/DatePicker/examples/DatePicker.md +26 -2
  108. package/docs/components/DescriptionList/examples/DescriptionList.md +115 -55
  109. package/docs/components/Drawer/examples/Drawer.md +1 -1
  110. package/docs/components/DualListSelector/examples/DualListSelector.md +355 -139
  111. package/docs/components/EmptyState/examples/EmptyState.md +12 -12
  112. package/docs/components/FileUpload/examples/FileUpload.md +26 -2
  113. package/docs/components/Form/examples/Form.md +140 -16
  114. package/docs/components/FormControl/examples/FormControl.md +260 -20
  115. package/docs/components/HelperText/examples/HelperText.md +139 -11
  116. package/docs/components/Icon/examples/Icon.md +403 -31
  117. package/docs/components/InlineEdit/examples/InlineEdit.md +13 -1
  118. package/docs/components/InputGroup/examples/InputGroup.md +20 -8
  119. package/docs/components/Label/examples/Label.md +4029 -765
  120. package/docs/components/List/examples/List.md +78 -6
  121. package/docs/components/Login/examples/Login.md +104 -8
  122. package/docs/components/Menu/examples/Menu.md +221 -17
  123. package/docs/components/MenuToggle/examples/MenuToggle.md +54 -15
  124. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +247 -19
  125. package/docs/components/NumberInput/examples/NumberInput.md +301 -25
  126. package/docs/components/Pagination/examples/Pagination.md +111 -273
  127. package/docs/components/ProgressStepper/examples/ProgressStepper.md +169 -13
  128. package/docs/components/Sidebar/examples/Sidebar.md +3 -1
  129. package/docs/components/Switch/examples/Switch.md +52 -4
  130. package/docs/components/Table/examples/Table.css +6 -0
  131. package/docs/components/Table/examples/Table.md +1322 -171
  132. package/docs/components/Tabs/examples/Tabs.md +18 -998
  133. package/docs/components/TextInputGroup/examples/TextInputGroup.md +355 -115
  134. package/docs/components/Toolbar/examples/Toolbar.md +133 -25
  135. package/docs/components/TreeView/examples/TreeView.md +286 -118
  136. package/docs/components/Wizard/examples/Wizard.md +325 -25
  137. package/docs/demos/Alert/examples/Alert.md +181 -40
  138. package/docs/demos/Button/examples/Button.md +57 -45
  139. package/docs/demos/Card/examples/Card.md +280 -34
  140. package/docs/demos/CardView/examples/CardView.md +12 -12
  141. package/docs/demos/Compass/examples/Compass.md +91 -439
  142. package/docs/demos/Dashboard/examples/Dashboard.md +92 -41
  143. package/docs/demos/DataList/examples/DataList.md +74 -50
  144. package/docs/demos/Form/examples/BasicForms.md +112 -36
  145. package/docs/demos/HelperText/examples/HelperText.md +104 -8
  146. package/docs/demos/Masthead/examples/Masthead.md +52 -4
  147. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +176 -14
  148. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +2570 -4968
  149. package/docs/demos/Table/examples/Table.md +407 -179
  150. package/docs/demos/Toolbar/examples/Toolbar.md +139 -46
  151. package/docs/demos/Wizard/examples/Wizard.md +117 -9
  152. package/package.json +7 -7
  153. package/patternfly-base-no-globals.css +12 -10
  154. package/patternfly-base.css +12 -10
  155. package/patternfly-no-globals.css +411 -150
  156. package/patternfly.css +411 -150
  157. package/patternfly.min.css +1 -1
  158. package/patternfly.min.css.map +1 -1
package/docs/demos/PasswordStrength/examples/PasswordStrength.md CHANGED
@@ -62,7 +62,17 @@ section: components
62
62
  class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
63
63
  >
64
64
  <span class="pf-v6-c-helper-text__item-icon">
65
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
65
+ <svg
66
+ class="pf-v6-svg"
67
+ fill="currentColor"
68
+ viewBox="0 0 32 32"
69
+ aria-hidden="true"
70
+ role="img"
71
+ width="1em"
72
+ height="1em"
73
+ >
74
+ <path d="M29 17H3a1 1 0 0 1 0-2h26a1 1 0 0 1 0 2Z" />
75
+ </svg>
66
76
  </span>
67
77
  <span class="pf-v6-c-helper-text__item-text">
68
78
  <span class="pf-v6-screen-reader">Indeterminate:</span>
@@ -73,7 +83,17 @@ section: components
73
83
  class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
74
84
  >
75
85
  <span class="pf-v6-c-helper-text__item-icon">
76
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
86
+ <svg
87
+ class="pf-v6-svg"
88
+ fill="currentColor"
89
+ viewBox="0 0 32 32"
90
+ aria-hidden="true"
91
+ role="img"
92
+ width="1em"
93
+ height="1em"
94
+ >
95
+ <path d="M29 17H3a1 1 0 0 1 0-2h26a1 1 0 0 1 0 2Z" />
96
+ </svg>
77
97
  </span>
78
98
  <span class="pf-v6-c-helper-text__item-text">
79
99
  <span class="pf-v6-screen-reader">Indeterminate:</span>
@@ -84,7 +104,17 @@ section: components
84
104
  class="pf-v6-c-helper-text__item pf-m-indeterminate pf-m-dynamic"
85
105
  >
86
106
  <span class="pf-v6-c-helper-text__item-icon">
87
- <i class="fas fa-fw fa-minus" aria-hidden="true"></i>
107
+ <svg
108
+ class="pf-v6-svg"
109
+ fill="currentColor"
110
+ viewBox="0 0 32 32"
111
+ aria-hidden="true"
112
+ role="img"
113
+ width="1em"
114
+ height="1em"
115
+ >
116
+ <path d="M29 17H3a1 1 0 0 1 0-2h26a1 1 0 0 1 0 2Z" />
117
+ </svg>
88
118
  </span>
89
119
  <span class="pf-v6-c-helper-text__item-text">
90
120
  <span class="pf-v6-screen-reader">Indeterminate:</span>
@@ -156,7 +186,19 @@ section: components
156
186
  <div class="pf-v6-c-helper-text">
157
187
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
158
188
  <span class="pf-v6-c-helper-text__item-icon">
159
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
189
+ <svg
190
+ class="pf-v6-svg"
191
+ fill="currentColor"
192
+ viewBox="0 0 32 32"
193
+ aria-hidden="true"
194
+ role="img"
195
+ width="1em"
196
+ height="1em"
197
+ >
198
+ <path
199
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
200
+ />
201
+ </svg>
160
202
  </span>
161
203
  <span class="pf-v6-c-helper-text__item-text">
162
204
  <span class="pf-v6-screen-reader">Success:</span>
@@ -165,7 +207,19 @@ section: components
165
207
  </div>
166
208
  <div class="pf-v6-c-helper-text__item pf-m-error pf-m-dynamic">
167
209
  <span class="pf-v6-c-helper-text__item-icon">
168
- <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
210
+ <svg
211
+ class="pf-v6-svg"
212
+ fill="currentColor"
213
+ viewBox="0 0 32 32"
214
+ aria-hidden="true"
215
+ role="img"
216
+ width="1em"
217
+ height="1em"
218
+ >
219
+ <path
220
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
221
+ />
222
+ </svg>
169
223
  </span>
170
224
  <span class="pf-v6-c-helper-text__item-text">
171
225
  <span class="pf-v6-screen-reader">Error:</span>
@@ -174,7 +228,19 @@ section: components
174
228
  </div>
175
229
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
176
230
  <span class="pf-v6-c-helper-text__item-icon">
177
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
231
+ <svg
232
+ class="pf-v6-svg"
233
+ fill="currentColor"
234
+ viewBox="0 0 32 32"
235
+ aria-hidden="true"
236
+ role="img"
237
+ width="1em"
238
+ height="1em"
239
+ >
240
+ <path
241
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
242
+ />
243
+ </svg>
178
244
  </span>
179
245
  <span class="pf-v6-c-helper-text__item-text">
180
246
  <span class="pf-v6-screen-reader">Success:</span>
@@ -205,7 +271,19 @@ section: components
205
271
  <div class="pf-v6-c-helper-text">
206
272
  <div class="pf-v6-c-helper-text__item pf-m-error">
207
273
  <span class="pf-v6-c-helper-text__item-icon">
208
- <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
274
+ <svg
275
+ class="pf-v6-svg"
276
+ fill="currentColor"
277
+ viewBox="0 0 32 32"
278
+ aria-hidden="true"
279
+ role="img"
280
+ width="1em"
281
+ height="1em"
282
+ >
283
+ <path
284
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm-1.5 8a1.5 1.5 0 1 1 3 0v7a1.5 1.5 0 1 1-3 0V9ZM16 25.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 25.001Z"
285
+ />
286
+ </svg>
209
287
  </span>
210
288
  <span class="pf-v6-c-helper-text__item-text">
211
289
  <span class="pf-v6-screen-reader">Error:</span>
@@ -258,7 +336,19 @@ section: components
258
336
  <div class="pf-v6-c-helper-text">
259
337
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
260
338
  <span class="pf-v6-c-helper-text__item-icon">
261
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
339
+ <svg
340
+ class="pf-v6-svg"
341
+ fill="currentColor"
342
+ viewBox="0 0 32 32"
343
+ aria-hidden="true"
344
+ role="img"
345
+ width="1em"
346
+ height="1em"
347
+ >
348
+ <path
349
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
350
+ />
351
+ </svg>
262
352
  </span>
263
353
  <span class="pf-v6-c-helper-text__item-text">
264
354
  <span class="pf-v6-screen-reader">Success:</span>
@@ -267,7 +357,19 @@ section: components
267
357
  </div>
268
358
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
269
359
  <span class="pf-v6-c-helper-text__item-icon">
270
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
360
+ <svg
361
+ class="pf-v6-svg"
362
+ fill="currentColor"
363
+ viewBox="0 0 32 32"
364
+ aria-hidden="true"
365
+ role="img"
366
+ width="1em"
367
+ height="1em"
368
+ >
369
+ <path
370
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
371
+ />
372
+ </svg>
271
373
  </span>
272
374
  <span class="pf-v6-c-helper-text__item-text">
273
375
  <span class="pf-v6-screen-reader">Success:</span>
@@ -276,7 +378,19 @@ section: components
276
378
  </div>
277
379
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
278
380
  <span class="pf-v6-c-helper-text__item-icon">
279
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
381
+ <svg
382
+ class="pf-v6-svg"
383
+ fill="currentColor"
384
+ viewBox="0 0 32 32"
385
+ aria-hidden="true"
386
+ role="img"
387
+ width="1em"
388
+ height="1em"
389
+ >
390
+ <path
391
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
392
+ />
393
+ </svg>
280
394
  </span>
281
395
  <span class="pf-v6-c-helper-text__item-text">
282
396
  <span class="pf-v6-screen-reader">Success:</span>
@@ -307,7 +421,19 @@ section: components
307
421
  <div class="pf-v6-c-helper-text">
308
422
  <div class="pf-v6-c-helper-text__item pf-m-success">
309
423
  <span class="pf-v6-c-helper-text__item-icon">
310
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
424
+ <svg
425
+ class="pf-v6-svg"
426
+ fill="currentColor"
427
+ viewBox="0 0 32 32"
428
+ aria-hidden="true"
429
+ role="img"
430
+ width="1em"
431
+ height="1em"
432
+ >
433
+ <path
434
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
435
+ />
436
+ </svg>
311
437
  </span>
312
438
  <span class="pf-v6-c-helper-text__item-text">
313
439
  <span class="pf-v6-screen-reader">Success:</span>
@@ -360,7 +486,19 @@ section: components
360
486
  <div class="pf-v6-c-helper-text">
361
487
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
362
488
  <span class="pf-v6-c-helper-text__item-icon">
363
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
489
+ <svg
490
+ class="pf-v6-svg"
491
+ fill="currentColor"
492
+ viewBox="0 0 32 32"
493
+ aria-hidden="true"
494
+ role="img"
495
+ width="1em"
496
+ height="1em"
497
+ >
498
+ <path
499
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
500
+ />
501
+ </svg>
364
502
  </span>
365
503
  <span class="pf-v6-c-helper-text__item-text">
366
504
  <span class="pf-v6-screen-reader">Success:</span>
@@ -369,7 +507,19 @@ section: components
369
507
  </div>
370
508
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
371
509
  <span class="pf-v6-c-helper-text__item-icon">
372
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
510
+ <svg
511
+ class="pf-v6-svg"
512
+ fill="currentColor"
513
+ viewBox="0 0 32 32"
514
+ aria-hidden="true"
515
+ role="img"
516
+ width="1em"
517
+ height="1em"
518
+ >
519
+ <path
520
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
521
+ />
522
+ </svg>
373
523
  </span>
374
524
  <span class="pf-v6-c-helper-text__item-text">
375
525
  <span class="pf-v6-screen-reader">Success:</span>
@@ -378,7 +528,19 @@ section: components
378
528
  </div>
379
529
  <div class="pf-v6-c-helper-text__item pf-m-success pf-m-dynamic">
380
530
  <span class="pf-v6-c-helper-text__item-icon">
381
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
531
+ <svg
532
+ class="pf-v6-svg"
533
+ fill="currentColor"
534
+ viewBox="0 0 32 32"
535
+ aria-hidden="true"
536
+ role="img"
537
+ width="1em"
538
+ height="1em"
539
+ >
540
+ <path
541
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm7.795 11.795-8.646 8.646c-.317.317-.733.475-1.149.475s-.832-.158-1.149-.475l-4.646-4.646a1.126 1.126 0 0 1 1.591-1.591l4.205 4.205 8.205-8.205a1.126 1.126 0 0 1 1.591 1.591Z"
542
+ />
543
+ </svg>
382
544
  </span>
383
545
  <span class="pf-v6-c-helper-text__item-text">
384
546
  <span class="pf-v6-screen-reader">Success:</span>