@patternfly/patternfly 6.5.0-prerelease.43 → 6.5.0-prerelease.45

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 (65) hide show
  1. package/components/Button/button.css +76 -3
  2. package/components/Button/button.scss +85 -4
  3. package/components/_index.css +76 -3
  4. package/docs/components/AboutModalBox/examples/AboutModalBox.md +13 -1
  5. package/docs/components/ActionList/examples/ActionList.md +143 -11
  6. package/docs/components/Alert/examples/Alert.md +182 -14
  7. package/docs/components/BackToTop/examples/BackToTop.md +13 -1
  8. package/docs/components/Button/examples/Button.md +2017 -157
  9. package/docs/components/CalendarMonth/examples/CalendarMonth.md +104 -8
  10. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +208 -16
  11. package/docs/components/CodeBlock/examples/CodeBlock.md +78 -6
  12. package/docs/components/CodeEditor/examples/CodeEditor.md +195 -15
  13. package/docs/components/DatePicker/examples/DatePicker.md +78 -6
  14. package/docs/components/DescriptionList/examples/DescriptionList.md +325 -25
  15. package/docs/components/Drawer/examples/Drawer.md +273 -21
  16. package/docs/components/DualListSelector/examples/DualListSelector.md +106 -112
  17. package/docs/components/InlineEdit/examples/InlineEdit.md +312 -24
  18. package/docs/components/InputGroup/examples/InputGroup.md +26 -2
  19. package/docs/components/Label/examples/Label.md +242 -218
  20. package/docs/components/Login/examples/Login.md +26 -2
  21. package/docs/components/Masthead/examples/masthead.md +13 -1
  22. package/docs/components/MenuToggle/examples/MenuToggle.md +1 -1
  23. package/docs/components/ModalBox/examples/ModalBox.md +195 -15
  24. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +117 -9
  25. package/docs/components/Nav/examples/Navigation.md +52 -4
  26. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +26 -2
  27. package/docs/components/OverflowMenu/examples/overflow-menu.md +78 -6
  28. package/docs/components/Page/examples/Page.md +13 -1
  29. package/docs/components/Pagination/examples/Pagination.md +624 -48
  30. package/docs/components/Popover/examples/Popover.md +208 -16
  31. package/docs/components/Slider/examples/Slider.md +4 -4
  32. package/docs/components/Table/examples/Table.md +52 -4
  33. package/docs/components/Tabs/examples/Tabs.md +1378 -106
  34. package/docs/components/TextInputGroup/examples/TextInputGroup.md +128 -44
  35. package/docs/components/Toolbar/examples/Toolbar.md +455 -35
  36. package/docs/components/TreeView/examples/TreeView.md +52 -4
  37. package/docs/components/Wizard/examples/Wizard.md +169 -13
  38. package/docs/demos/AboutModal/examples/AboutModal.md +13 -1
  39. package/docs/demos/Alert/examples/Alert.md +39 -3
  40. package/docs/demos/BackToTop/examples/BackToTop.md +13 -1
  41. package/docs/demos/Button/examples/Button.md +13 -1
  42. package/docs/demos/Card/examples/Card.md +65 -5
  43. package/docs/demos/CardView/examples/CardView.md +78 -6
  44. package/docs/demos/Compass/examples/Compass.md +323 -29
  45. package/docs/demos/Dashboard/examples/Dashboard.md +39 -3
  46. package/docs/demos/DataList/examples/DataList.md +312 -24
  47. package/docs/demos/DescriptionList/examples/DescriptionList.md +13 -1
  48. package/docs/demos/Drawer/examples/Drawer.md +39 -3
  49. package/docs/demos/Form/examples/BasicForms.md +106 -10
  50. package/docs/demos/JumpLinks/examples/JumpLinks.md +26 -2
  51. package/docs/demos/Masthead/examples/Masthead.md +40 -4
  52. package/docs/demos/Modal/examples/Modal.md +78 -6
  53. package/docs/demos/Nav/examples/Nav.md +52 -4
  54. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +13 -1
  55. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +52 -4
  56. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +295 -55
  57. package/docs/demos/Table/examples/Table.md +1108 -145
  58. package/docs/demos/Tabs/examples/Tabs.md +53 -8
  59. package/docs/demos/Toolbar/examples/Toolbar.md +414 -36
  60. package/docs/demos/Wizard/examples/Wizard.md +130 -10
  61. package/package.json +2 -2
  62. package/patternfly-no-globals.css +76 -3
  63. package/patternfly.css +76 -3
  64. package/patternfly.min.css +1 -1
  65. package/patternfly.min.css.map +1 -1
@@ -567,7 +567,19 @@ wrapperTag: div
567
567
  aria-label="Show password"
568
568
  >
569
569
  <span class="pf-v6-c-button__icon pf-m-start">
570
- <i class="fas fa-eye" aria-hidden="true"></i>
570
+ <svg
571
+ class="pf-v6-svg"
572
+ viewBox="0 0 576 512"
573
+ fill="currentColor"
574
+ aria-hidden="true"
575
+ role="img"
576
+ width="1em"
577
+ height="1em"
578
+ >
579
+ <path
580
+ d="M572.52 241.4C518.29 135.59 410.93 64 288 64S57.68 135.64 3.48 241.41a32.35 32.35 0 0 0 0 29.19C57.71 376.41 165.07 448 288 448s230.32-71.64 284.52-177.41a32.35 32.35 0 0 0 0-29.19zM288 400a144 144 0 1 1 144-144 143.93 143.93 0 0 1-144 144zm0-240a95.31 95.31 0 0 0-25.31 3.79 47.85 47.85 0 0 1-66.9 66.9A95.78 95.78 0 1 0 288 160z"
581
+ />
582
+ </svg>
571
583
  </span>
572
584
  </button>
573
585
  </div>
@@ -820,7 +832,19 @@ wrapperTag: div
820
832
  aria-label="Hide password"
821
833
  >
822
834
  <span class="pf-v6-c-button__icon pf-m-start">
823
- <i class="fas fa-eye-slash" aria-hidden="true"></i>
835
+ <svg
836
+ class="pf-v6-svg"
837
+ viewBox="0 0 640 512"
838
+ fill="currentColor"
839
+ aria-hidden="true"
840
+ role="img"
841
+ width="1em"
842
+ height="1em"
843
+ >
844
+ <path
845
+ d="M320 400c-75.85 0-137.25-58.71-142.9-133.11L72.2 185.82c-13.79 17.3-26.48 35.59-36.72 55.59a32.35 32.35 0 0 0 0 29.19C89.71 376.41 197.07 448 320 448c26.91 0 52.87-4 77.89-10.46L346 397.39a144.13 144.13 0 0 1-26 2.61zm313.82 58.1l-110.55-85.44a331.25 331.25 0 0 0 81.25-102.07 32.35 32.35 0 0 0 0-29.19C550.29 135.59 442.93 64 320 64a308.15 308.15 0 0 0-147.32 37.7L45.46 3.37A16 16 0 0 0 23 6.18L3.37 31.45A16 16 0 0 0 6.18 53.9l588.36 454.73a16 16 0 0 0 22.46-2.81l19.64-25.27a16 16 0 0 0-2.82-22.45zm-183.72-142l-39.3-30.38A94.75 94.75 0 0 0 416 256a94.76 94.76 0 0 0-121.31-92.21A47.65 47.65 0 0 1 304 192a46.64 46.64 0 0 1-1.54 10l-73.61-56.89A142.31 142.31 0 0 1 320 112a143.92 143.92 0 0 1 144 144c0 21.63-5.29 41.79-13.9 60.11z"
846
+ />
847
+ </svg>
824
848
  </span>
825
849
  </button>
826
850
  </div>
@@ -742,7 +742,19 @@ cssPrefix: pf-v6-c-masthead
742
742
  <div class="pf-v6-c-masthead__content">
743
743
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Chat">
744
744
  <span class="pf-v6-c-button__icon">
745
- <i class="fas fa-comment-alt" aria-hidden="true"></i>
745
+ <svg
746
+ class="pf-v6-svg"
747
+ viewBox="0 0 512 512"
748
+ fill="currentColor"
749
+ aria-hidden="true"
750
+ role="img"
751
+ width="1em"
752
+ height="1em"
753
+ >
754
+ <path
755
+ d="M448 0H64C28.7 0 0 28.7 0 64v288c0 35.3 28.7 64 64 64h96v84c0 9.8 11.2 15.5 19.1 9.7L304 416h144c35.3 0 64-28.7 64-64V64c0-35.3-28.7-64-64-64z"
756
+ />
757
+ </svg>
746
758
  </span>
747
759
  </button>
748
760
  </div>
@@ -718,7 +718,7 @@ cssPrefix: pf-v6-c-menu-toggle
718
718
  aria-label="Clear input"
719
719
  >
720
720
  <span class="pf-v6-c-button__icon">
721
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
721
+ <!-- Icon "times fa-fw" not found -->
722
722
  </span>
723
723
  </button>
724
724
  </div>
@@ -19,7 +19,19 @@ cssPrefix: pf-v6-c-modal-box
19
19
  <div class="pf-v6-c-modal-box__close">
20
20
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
21
21
  <span class="pf-v6-c-button__icon">
22
- <i class="fas fa-times" aria-hidden="true"></i>
22
+ <svg
23
+ class="pf-v6-svg"
24
+ viewBox="0 0 352 512"
25
+ fill="currentColor"
26
+ aria-hidden="true"
27
+ role="img"
28
+ width="1em"
29
+ height="1em"
30
+ >
31
+ <path
32
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
33
+ />
34
+ </svg>
23
35
  </span>
24
36
  </button>
25
37
  </div>
@@ -50,7 +62,19 @@ cssPrefix: pf-v6-c-modal-box
50
62
  <div class="pf-v6-c-modal-box__close">
51
63
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
52
64
  <span class="pf-v6-c-button__icon">
53
- <i class="fas fa-times" aria-hidden="true"></i>
65
+ <svg
66
+ class="pf-v6-svg"
67
+ viewBox="0 0 352 512"
68
+ fill="currentColor"
69
+ aria-hidden="true"
70
+ role="img"
71
+ width="1em"
72
+ height="1em"
73
+ >
74
+ <path
75
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
76
+ />
77
+ </svg>
54
78
  </span>
55
79
  </button>
56
80
  </div>
@@ -106,7 +130,19 @@ cssPrefix: pf-v6-c-modal-box
106
130
  <div class="pf-v6-c-modal-box__close">
107
131
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
108
132
  <span class="pf-v6-c-button__icon">
109
- <i class="fas fa-times" aria-hidden="true"></i>
133
+ <svg
134
+ class="pf-v6-svg"
135
+ viewBox="0 0 352 512"
136
+ fill="currentColor"
137
+ aria-hidden="true"
138
+ role="img"
139
+ width="1em"
140
+ height="1em"
141
+ >
142
+ <path
143
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
144
+ />
145
+ </svg>
110
146
  </span>
111
147
  </button>
112
148
  </div>
@@ -139,7 +175,19 @@ cssPrefix: pf-v6-c-modal-box
139
175
  <div class="pf-v6-c-modal-box__close">
140
176
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
141
177
  <span class="pf-v6-c-button__icon">
142
- <i class="fas fa-times" aria-hidden="true"></i>
178
+ <svg
179
+ class="pf-v6-svg"
180
+ viewBox="0 0 352 512"
181
+ fill="currentColor"
182
+ aria-hidden="true"
183
+ role="img"
184
+ width="1em"
185
+ height="1em"
186
+ >
187
+ <path
188
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
189
+ />
190
+ </svg>
143
191
  </span>
144
192
  </button>
145
193
  </div>
@@ -172,7 +220,19 @@ cssPrefix: pf-v6-c-modal-box
172
220
  <div class="pf-v6-c-modal-box__close">
173
221
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
174
222
  <span class="pf-v6-c-button__icon">
175
- <i class="fas fa-times" aria-hidden="true"></i>
223
+ <svg
224
+ class="pf-v6-svg"
225
+ viewBox="0 0 352 512"
226
+ fill="currentColor"
227
+ aria-hidden="true"
228
+ role="img"
229
+ width="1em"
230
+ height="1em"
231
+ >
232
+ <path
233
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
234
+ />
235
+ </svg>
176
236
  </span>
177
237
  </button>
178
238
  </div>
@@ -205,7 +265,19 @@ cssPrefix: pf-v6-c-modal-box
205
265
  <div class="pf-v6-c-modal-box__close">
206
266
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
207
267
  <span class="pf-v6-c-button__icon">
208
- <i class="fas fa-times" aria-hidden="true"></i>
268
+ <svg
269
+ class="pf-v6-svg"
270
+ viewBox="0 0 352 512"
271
+ fill="currentColor"
272
+ aria-hidden="true"
273
+ role="img"
274
+ width="1em"
275
+ height="1em"
276
+ >
277
+ <path
278
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
279
+ />
280
+ </svg>
209
281
  </span>
210
282
  </button>
211
283
  </div>
@@ -232,7 +304,19 @@ cssPrefix: pf-v6-c-modal-box
232
304
  <div class="pf-v6-c-modal-box__close">
233
305
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
234
306
  <span class="pf-v6-c-button__icon">
235
- <i class="fas fa-times" aria-hidden="true"></i>
307
+ <svg
308
+ class="pf-v6-svg"
309
+ viewBox="0 0 352 512"
310
+ fill="currentColor"
311
+ aria-hidden="true"
312
+ role="img"
313
+ width="1em"
314
+ height="1em"
315
+ >
316
+ <path
317
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
318
+ />
319
+ </svg>
236
320
  </span>
237
321
  </button>
238
322
  </div>
@@ -269,7 +353,19 @@ cssPrefix: pf-v6-c-modal-box
269
353
  <div class="pf-v6-c-modal-box__close">
270
354
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
271
355
  <span class="pf-v6-c-button__icon">
272
- <i class="fas fa-times" aria-hidden="true"></i>
356
+ <svg
357
+ class="pf-v6-svg"
358
+ viewBox="0 0 352 512"
359
+ fill="currentColor"
360
+ aria-hidden="true"
361
+ role="img"
362
+ width="1em"
363
+ height="1em"
364
+ >
365
+ <path
366
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
367
+ />
368
+ </svg>
273
369
  </span>
274
370
  </button>
275
371
  </div>
@@ -316,7 +412,19 @@ cssPrefix: pf-v6-c-modal-box
316
412
  <div class="pf-v6-c-modal-box__close">
317
413
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
318
414
  <span class="pf-v6-c-button__icon">
319
- <i class="fas fa-times" aria-hidden="true"></i>
415
+ <svg
416
+ class="pf-v6-svg"
417
+ viewBox="0 0 352 512"
418
+ fill="currentColor"
419
+ aria-hidden="true"
420
+ role="img"
421
+ width="1em"
422
+ height="1em"
423
+ >
424
+ <path
425
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
426
+ />
427
+ </svg>
320
428
  </span>
321
429
  </button>
322
430
  </div>
@@ -349,7 +457,19 @@ cssPrefix: pf-v6-c-modal-box
349
457
  <div class="pf-v6-c-modal-box__close">
350
458
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
351
459
  <span class="pf-v6-c-button__icon">
352
- <i class="fas fa-times" aria-hidden="true"></i>
460
+ <svg
461
+ class="pf-v6-svg"
462
+ viewBox="0 0 352 512"
463
+ fill="currentColor"
464
+ aria-hidden="true"
465
+ role="img"
466
+ width="1em"
467
+ height="1em"
468
+ >
469
+ <path
470
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
471
+ />
472
+ </svg>
353
473
  </span>
354
474
  </button>
355
475
  </div>
@@ -389,7 +509,19 @@ cssPrefix: pf-v6-c-modal-box
389
509
  <div class="pf-v6-c-modal-box__close">
390
510
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
391
511
  <span class="pf-v6-c-button__icon">
392
- <i class="fas fa-times" aria-hidden="true"></i>
512
+ <svg
513
+ class="pf-v6-svg"
514
+ viewBox="0 0 352 512"
515
+ fill="currentColor"
516
+ aria-hidden="true"
517
+ role="img"
518
+ width="1em"
519
+ height="1em"
520
+ >
521
+ <path
522
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
523
+ />
524
+ </svg>
393
525
  </span>
394
526
  </button>
395
527
  </div>
@@ -429,7 +561,19 @@ cssPrefix: pf-v6-c-modal-box
429
561
  <div class="pf-v6-c-modal-box__close">
430
562
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
431
563
  <span class="pf-v6-c-button__icon">
432
- <i class="fas fa-times" aria-hidden="true"></i>
564
+ <svg
565
+ class="pf-v6-svg"
566
+ viewBox="0 0 352 512"
567
+ fill="currentColor"
568
+ aria-hidden="true"
569
+ role="img"
570
+ width="1em"
571
+ height="1em"
572
+ >
573
+ <path
574
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
575
+ />
576
+ </svg>
433
577
  </span>
434
578
  </button>
435
579
  </div>
@@ -469,7 +613,19 @@ cssPrefix: pf-v6-c-modal-box
469
613
  <div class="pf-v6-c-modal-box__close">
470
614
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
471
615
  <span class="pf-v6-c-button__icon">
472
- <i class="fas fa-times" aria-hidden="true"></i>
616
+ <svg
617
+ class="pf-v6-svg"
618
+ viewBox="0 0 352 512"
619
+ fill="currentColor"
620
+ aria-hidden="true"
621
+ role="img"
622
+ width="1em"
623
+ height="1em"
624
+ >
625
+ <path
626
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
627
+ />
628
+ </svg>
473
629
  </span>
474
630
  </button>
475
631
  </div>
@@ -509,7 +665,19 @@ cssPrefix: pf-v6-c-modal-box
509
665
  <div class="pf-v6-c-modal-box__close">
510
666
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
511
667
  <span class="pf-v6-c-button__icon">
512
- <i class="fas fa-times" aria-hidden="true"></i>
668
+ <svg
669
+ class="pf-v6-svg"
670
+ viewBox="0 0 352 512"
671
+ fill="currentColor"
672
+ aria-hidden="true"
673
+ role="img"
674
+ width="1em"
675
+ height="1em"
676
+ >
677
+ <path
678
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
679
+ />
680
+ </svg>
513
681
  </span>
514
682
  </button>
515
683
  </div>
@@ -551,7 +719,19 @@ The status modifier classes can be applied directly to the modal title element,
551
719
  <div class="pf-v6-c-modal-box__close">
552
720
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
553
721
  <span class="pf-v6-c-button__icon">
554
- <i class="fas fa-times" aria-hidden="true"></i>
722
+ <svg
723
+ class="pf-v6-svg"
724
+ viewBox="0 0 352 512"
725
+ fill="currentColor"
726
+ aria-hidden="true"
727
+ role="img"
728
+ width="1em"
729
+ height="1em"
730
+ >
731
+ <path
732
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
733
+ />
734
+ </svg>
555
735
  </span>
556
736
  </button>
557
737
  </div>
@@ -216,7 +216,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
216
216
  aria-label="Remove from list"
217
217
  >
218
218
  <span class="pf-v6-c-button__icon">
219
- <i class="fas fa-times" aria-hidden="true"></i>
219
+ <svg
220
+ class="pf-v6-svg"
221
+ viewBox="0 0 352 512"
222
+ fill="currentColor"
223
+ aria-hidden="true"
224
+ role="img"
225
+ width="1em"
226
+ height="1em"
227
+ >
228
+ <path
229
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
230
+ />
231
+ </svg>
220
232
  </span>
221
233
  </button>
222
234
  </div>
@@ -267,7 +279,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
267
279
  aria-label="Remove from list"
268
280
  >
269
281
  <span class="pf-v6-c-button__icon">
270
- <i class="fas fa-times" aria-hidden="true"></i>
282
+ <svg
283
+ class="pf-v6-svg"
284
+ viewBox="0 0 352 512"
285
+ fill="currentColor"
286
+ aria-hidden="true"
287
+ role="img"
288
+ width="1em"
289
+ height="1em"
290
+ >
291
+ <path
292
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
293
+ />
294
+ </svg>
271
295
  </span>
272
296
  </button>
273
297
  </div>
@@ -318,7 +342,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
318
342
  aria-label="Remove from list"
319
343
  >
320
344
  <span class="pf-v6-c-button__icon">
321
- <i class="fas fa-times" aria-hidden="true"></i>
345
+ <svg
346
+ class="pf-v6-svg"
347
+ viewBox="0 0 352 512"
348
+ fill="currentColor"
349
+ aria-hidden="true"
350
+ role="img"
351
+ width="1em"
352
+ height="1em"
353
+ >
354
+ <path
355
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
356
+ />
357
+ </svg>
322
358
  </span>
323
359
  </button>
324
360
  </div>
@@ -433,7 +469,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
433
469
  aria-label="Remove from list"
434
470
  >
435
471
  <span class="pf-v6-c-button__icon">
436
- <i class="fas fa-times" aria-hidden="true"></i>
472
+ <svg
473
+ class="pf-v6-svg"
474
+ viewBox="0 0 352 512"
475
+ fill="currentColor"
476
+ aria-hidden="true"
477
+ role="img"
478
+ width="1em"
479
+ height="1em"
480
+ >
481
+ <path
482
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
483
+ />
484
+ </svg>
437
485
  </span>
438
486
  </button>
439
487
  </div>
@@ -484,7 +532,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
484
532
  aria-label="Remove from list"
485
533
  >
486
534
  <span class="pf-v6-c-button__icon">
487
- <i class="fas fa-times" aria-hidden="true"></i>
535
+ <svg
536
+ class="pf-v6-svg"
537
+ viewBox="0 0 352 512"
538
+ fill="currentColor"
539
+ aria-hidden="true"
540
+ role="img"
541
+ width="1em"
542
+ height="1em"
543
+ >
544
+ <path
545
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
546
+ />
547
+ </svg>
488
548
  </span>
489
549
  </button>
490
550
  </div>
@@ -535,7 +595,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
535
595
  aria-label="Remove from list"
536
596
  >
537
597
  <span class="pf-v6-c-button__icon">
538
- <i class="fas fa-times" aria-hidden="true"></i>
598
+ <svg
599
+ class="pf-v6-svg"
600
+ viewBox="0 0 352 512"
601
+ fill="currentColor"
602
+ aria-hidden="true"
603
+ role="img"
604
+ width="1em"
605
+ height="1em"
606
+ >
607
+ <path
608
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
609
+ />
610
+ </svg>
539
611
  </span>
540
612
  </button>
541
613
  </div>
@@ -650,7 +722,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
650
722
  aria-label="Remove from list"
651
723
  >
652
724
  <span class="pf-v6-c-button__icon">
653
- <i class="fas fa-times" aria-hidden="true"></i>
725
+ <svg
726
+ class="pf-v6-svg"
727
+ viewBox="0 0 352 512"
728
+ fill="currentColor"
729
+ aria-hidden="true"
730
+ role="img"
731
+ width="1em"
732
+ height="1em"
733
+ >
734
+ <path
735
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
736
+ />
737
+ </svg>
654
738
  </span>
655
739
  </button>
656
740
  </div>
@@ -701,7 +785,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
701
785
  aria-label="Remove from list"
702
786
  >
703
787
  <span class="pf-v6-c-button__icon">
704
- <i class="fas fa-times" aria-hidden="true"></i>
788
+ <svg
789
+ class="pf-v6-svg"
790
+ viewBox="0 0 352 512"
791
+ fill="currentColor"
792
+ aria-hidden="true"
793
+ role="img"
794
+ width="1em"
795
+ height="1em"
796
+ >
797
+ <path
798
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
799
+ />
800
+ </svg>
705
801
  </span>
706
802
  </button>
707
803
  </div>
@@ -752,7 +848,19 @@ cssPrefix: pf-v6-c-multiple-file-upload
752
848
  aria-label="Remove from list"
753
849
  >
754
850
  <span class="pf-v6-c-button__icon">
755
- <i class="fas fa-times" aria-hidden="true"></i>
851
+ <svg
852
+ class="pf-v6-svg"
853
+ viewBox="0 0 352 512"
854
+ fill="currentColor"
855
+ aria-hidden="true"
856
+ role="img"
857
+ width="1em"
858
+ height="1em"
859
+ >
860
+ <path
861
+ d="M242.72 256l100.07-100.07c12.28-12.28 12.28-32.19 0-44.48l-22.24-22.24c-12.28-12.28-32.19-12.28-44.48 0L176 189.28 75.93 89.21c-12.28-12.28-32.19-12.28-44.48 0L9.21 111.45c-12.28 12.28-12.28 32.19 0 44.48L109.28 256 9.21 356.07c-12.28 12.28-12.28 32.19 0 44.48l22.24 22.24c12.28 12.28 32.2 12.28 44.48 0L176 322.72l100.07 100.07c12.28 12.28 32.2 12.28 44.48 0l22.24-22.24c12.28-12.28 12.28-32.19 0-44.48L242.72 256z"
862
+ />
863
+ </svg>
756
864
  </span>
757
865
  </button>
758
866
  </div>
@@ -584,7 +584,19 @@ cssPrefix: pf-v6-c-nav
584
584
  disabled
585
585
  >
586
586
  <span class="pf-v6-c-button__icon">
587
- <i class="fas fa-angle-left" aria-hidden="true"></i>
587
+ <svg
588
+ class="pf-v6-svg"
589
+ viewBox="0 0 256 512"
590
+ fill="currentColor"
591
+ aria-hidden="true"
592
+ role="img"
593
+ width="1em"
594
+ height="1em"
595
+ >
596
+ <path
597
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
598
+ />
599
+ </svg>
588
600
  </span>
589
601
  </button>
590
602
  </div>
@@ -622,7 +634,19 @@ cssPrefix: pf-v6-c-nav
622
634
  aria-label="Scroll end"
623
635
  >
624
636
  <span class="pf-v6-c-button__icon">
625
- <i class="fas fa-angle-right" aria-hidden="true"></i>
637
+ <svg
638
+ class="pf-v6-svg"
639
+ viewBox="0 0 256 512"
640
+ fill="currentColor"
641
+ aria-hidden="true"
642
+ role="img"
643
+ width="1em"
644
+ height="1em"
645
+ >
646
+ <path
647
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
648
+ />
649
+ </svg>
626
650
  </span>
627
651
  </button>
628
652
  </div>
@@ -670,7 +694,19 @@ cssPrefix: pf-v6-c-nav
670
694
  disabled
671
695
  >
672
696
  <span class="pf-v6-c-button__icon">
673
- <i class="fas fa-angle-left" aria-hidden="true"></i>
697
+ <svg
698
+ class="pf-v6-svg"
699
+ viewBox="0 0 256 512"
700
+ fill="currentColor"
701
+ aria-hidden="true"
702
+ role="img"
703
+ width="1em"
704
+ height="1em"
705
+ >
706
+ <path
707
+ d="M31.7 239l136-136c9.4-9.4 24.6-9.4 33.9 0l22.6 22.6c9.4 9.4 9.4 24.6 0 33.9L127.9 256l96.4 96.4c9.4 9.4 9.4 24.6 0 33.9L201.7 409c-9.4 9.4-24.6 9.4-33.9 0l-136-136c-9.5-9.4-9.5-24.6-.1-34z"
708
+ />
709
+ </svg>
674
710
  </span>
675
711
  </button>
676
712
  </div>
@@ -708,7 +744,19 @@ cssPrefix: pf-v6-c-nav
708
744
  aria-label="Scroll end"
709
745
  >
710
746
  <span class="pf-v6-c-button__icon">
711
- <i class="fas fa-angle-right" aria-hidden="true"></i>
747
+ <svg
748
+ class="pf-v6-svg"
749
+ viewBox="0 0 256 512"
750
+ fill="currentColor"
751
+ aria-hidden="true"
752
+ role="img"
753
+ width="1em"
754
+ height="1em"
755
+ >
756
+ <path
757
+ d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
758
+ />
759
+ </svg>
712
760
  </span>
713
761
  </button>
714
762
  </div>