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

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 (94) hide show
  1. package/components/Accordion/accordion.css +1 -1
  2. package/components/Accordion/accordion.scss +1 -1
  3. package/components/Card/card.css +1 -1
  4. package/components/Card/card.scss +1 -1
  5. package/components/ClipboardCopy/clipboard-copy.css +1 -1
  6. package/components/ClipboardCopy/clipboard-copy.scss +1 -1
  7. package/components/DataList/data-list.css +1 -1
  8. package/components/DataList/data-list.scss +1 -1
  9. package/components/DualListSelector/dual-list-selector.css +1 -1
  10. package/components/DualListSelector/dual-list-selector.scss +1 -1
  11. package/components/ExpandableSection/expandable-section.css +2 -2
  12. package/components/ExpandableSection/expandable-section.scss +2 -2
  13. package/components/Form/form.css +1 -1
  14. package/components/Form/form.scss +1 -1
  15. package/components/JumpLinks/jump-links.css +1 -1
  16. package/components/JumpLinks/jump-links.scss +1 -1
  17. package/components/Nav/nav.css +1 -1
  18. package/components/Nav/nav.scss +1 -1
  19. package/components/NotificationDrawer/notification-drawer.css +11 -3
  20. package/components/NotificationDrawer/notification-drawer.scss +12 -5
  21. package/components/Table/table.css +2 -2
  22. package/components/Table/table.scss +2 -2
  23. package/components/Tabs/tabs.css +2 -2
  24. package/components/Tabs/tabs.scss +2 -2
  25. package/components/Toolbar/toolbar.css +1 -1
  26. package/components/Toolbar/toolbar.scss +1 -1
  27. package/components/TreeView/tree-view.css +1 -1
  28. package/components/TreeView/tree-view.scss +1 -1
  29. package/components/Wizard/wizard.css +1 -1
  30. package/components/Wizard/wizard.scss +1 -1
  31. package/components/_index.css +28 -20
  32. package/docs/components/AboutModalBox/examples/AboutModalBox.md +2 -2
  33. package/docs/components/Accordion/examples/Accordion.md +390 -30
  34. package/docs/components/ActionList/examples/ActionList.md +10 -10
  35. package/docs/components/Alert/examples/Alert.md +30 -30
  36. package/docs/components/Banner/examples/Banner.md +65 -5
  37. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -23
  38. package/docs/components/CalendarMonth/examples/CalendarMonth.md +16 -16
  39. package/docs/components/Card/examples/Card.md +52 -4
  40. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +78 -6
  41. package/docs/components/CodeBlock/examples/CodeBlock.md +26 -2
  42. package/docs/components/DataList/examples/DataList.md +221 -17
  43. package/docs/components/Drawer/examples/Drawer.md +42 -42
  44. package/docs/components/DualListSelector/examples/DualListSelector.md +961 -85
  45. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  46. package/docs/components/Form/examples/Form.md +78 -6
  47. package/docs/components/Icon/examples/Icon.md +91 -7
  48. package/docs/components/InlineEdit/examples/InlineEdit.md +16 -16
  49. package/docs/components/JumpLinks/examples/JumpLinks.md +52 -4
  50. package/docs/components/Label/examples/Label.md +2812 -220
  51. package/docs/components/Menu/examples/Menu.md +1456 -112
  52. package/docs/components/MenuToggle/examples/MenuToggle.md +13 -1
  53. package/docs/components/ModalBox/examples/ModalBox.md +121 -37
  54. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +57 -21
  55. package/docs/components/Nav/examples/Navigation.md +710 -62
  56. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +576 -48
  57. package/docs/components/Popover/examples/Popover.md +110 -38
  58. package/docs/components/ProgressStepper/examples/ProgressStepper.md +273 -21
  59. package/docs/components/Slider/examples/Slider.md +52 -4
  60. package/docs/components/Table/examples/Table.md +819 -63
  61. package/docs/components/Tabs/examples/Tabs.md +1959 -339
  62. package/docs/components/TextInputGroup/examples/TextInputGroup.md +509 -41
  63. package/docs/components/Toolbar/examples/Toolbar.md +48 -48
  64. package/docs/components/TreeView/examples/TreeView.md +1300 -100
  65. package/docs/components/Wizard/examples/Wizard.md +349 -85
  66. package/docs/demos/AboutModal/examples/AboutModal.md +41 -5
  67. package/docs/demos/Alert/examples/Alert.md +123 -15
  68. package/docs/demos/BackToTop/examples/BackToTop.md +39 -3
  69. package/docs/demos/Banner/examples/Banner.md +78 -6
  70. package/docs/demos/Card/examples/Card.md +310 -34
  71. package/docs/demos/CardView/examples/CardView.md +78 -6
  72. package/docs/demos/Compass/examples/Compass.md +73 -37
  73. package/docs/demos/Dashboard/examples/Dashboard.md +128 -14
  74. package/docs/demos/DataList/examples/DataList.md +234 -18
  75. package/docs/demos/DescriptionList/examples/DescriptionList.md +119 -11
  76. package/docs/demos/Drawer/examples/Drawer.md +147 -21
  77. package/docs/demos/Form/examples/BasicForms.md +169 -13
  78. package/docs/demos/JumpLinks/examples/JumpLinks.md +220 -31
  79. package/docs/demos/Masthead/examples/Masthead.md +370 -34
  80. package/docs/demos/Modal/examples/Modal.md +246 -30
  81. package/docs/demos/Nav/examples/Nav.md +320 -32
  82. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +1063 -115
  83. package/docs/demos/Page/examples/Page.md +548 -44
  84. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +371 -47
  85. package/docs/demos/Skeleton/examples/Skeleton.md +39 -3
  86. package/docs/demos/Table/examples/Table.md +934 -73
  87. package/docs/demos/Tabs/examples/Tabs.md +261 -27
  88. package/docs/demos/Toolbar/examples/Toolbar.md +102 -30
  89. package/docs/demos/Wizard/examples/Wizard.md +641 -92
  90. package/package.json +1 -1
  91. package/patternfly-no-globals.css +28 -20
  92. package/patternfly.css +28 -20
  93. package/patternfly.min.css +1 -1
  94. package/patternfly.min.css.map +1 -1
@@ -718,7 +718,19 @@ cssPrefix: pf-v6-c-menu-toggle
718
718
  aria-label="Clear input"
719
719
  >
720
720
  <span class="pf-v6-c-button__icon">
721
- <!-- Icon "times fa-fw" not found -->
721
+ <svg
722
+ class="pf-v6-svg"
723
+ viewBox="0 0 20 20"
724
+ fill="currentColor"
725
+ aria-hidden="true"
726
+ role="img"
727
+ width="1em"
728
+ height="1em"
729
+ >
730
+ <path
731
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
732
+ />
733
+ </svg>
722
734
  </span>
723
735
  </button>
724
736
  </div>
@@ -21,7 +21,7 @@ cssPrefix: pf-v6-c-modal-box
21
21
  <span class="pf-v6-c-button__icon">
22
22
  <svg
23
23
  class="pf-v6-svg"
24
- viewBox="0 0 352 512"
24
+ viewBox="0 0 20 20"
25
25
  fill="currentColor"
26
26
  aria-hidden="true"
27
27
  role="img"
@@ -29,7 +29,7 @@ cssPrefix: pf-v6-c-modal-box
29
29
  height="1em"
30
30
  >
31
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"
32
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
33
33
  />
34
34
  </svg>
35
35
  </span>
@@ -64,7 +64,7 @@ cssPrefix: pf-v6-c-modal-box
64
64
  <span class="pf-v6-c-button__icon">
65
65
  <svg
66
66
  class="pf-v6-svg"
67
- viewBox="0 0 352 512"
67
+ viewBox="0 0 20 20"
68
68
  fill="currentColor"
69
69
  aria-hidden="true"
70
70
  role="img"
@@ -72,7 +72,7 @@ cssPrefix: pf-v6-c-modal-box
72
72
  height="1em"
73
73
  >
74
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"
75
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
76
76
  />
77
77
  </svg>
78
78
  </span>
@@ -132,7 +132,7 @@ cssPrefix: pf-v6-c-modal-box
132
132
  <span class="pf-v6-c-button__icon">
133
133
  <svg
134
134
  class="pf-v6-svg"
135
- viewBox="0 0 352 512"
135
+ viewBox="0 0 20 20"
136
136
  fill="currentColor"
137
137
  aria-hidden="true"
138
138
  role="img"
@@ -140,7 +140,7 @@ cssPrefix: pf-v6-c-modal-box
140
140
  height="1em"
141
141
  >
142
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"
143
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
144
144
  />
145
145
  </svg>
146
146
  </span>
@@ -177,7 +177,7 @@ cssPrefix: pf-v6-c-modal-box
177
177
  <span class="pf-v6-c-button__icon">
178
178
  <svg
179
179
  class="pf-v6-svg"
180
- viewBox="0 0 352 512"
180
+ viewBox="0 0 20 20"
181
181
  fill="currentColor"
182
182
  aria-hidden="true"
183
183
  role="img"
@@ -185,7 +185,7 @@ cssPrefix: pf-v6-c-modal-box
185
185
  height="1em"
186
186
  >
187
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"
188
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
189
189
  />
190
190
  </svg>
191
191
  </span>
@@ -222,7 +222,7 @@ cssPrefix: pf-v6-c-modal-box
222
222
  <span class="pf-v6-c-button__icon">
223
223
  <svg
224
224
  class="pf-v6-svg"
225
- viewBox="0 0 352 512"
225
+ viewBox="0 0 20 20"
226
226
  fill="currentColor"
227
227
  aria-hidden="true"
228
228
  role="img"
@@ -230,7 +230,7 @@ cssPrefix: pf-v6-c-modal-box
230
230
  height="1em"
231
231
  >
232
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"
233
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
234
234
  />
235
235
  </svg>
236
236
  </span>
@@ -267,7 +267,7 @@ cssPrefix: pf-v6-c-modal-box
267
267
  <span class="pf-v6-c-button__icon">
268
268
  <svg
269
269
  class="pf-v6-svg"
270
- viewBox="0 0 352 512"
270
+ viewBox="0 0 20 20"
271
271
  fill="currentColor"
272
272
  aria-hidden="true"
273
273
  role="img"
@@ -275,7 +275,7 @@ cssPrefix: pf-v6-c-modal-box
275
275
  height="1em"
276
276
  >
277
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"
278
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
279
279
  />
280
280
  </svg>
281
281
  </span>
@@ -306,7 +306,7 @@ cssPrefix: pf-v6-c-modal-box
306
306
  <span class="pf-v6-c-button__icon">
307
307
  <svg
308
308
  class="pf-v6-svg"
309
- viewBox="0 0 352 512"
309
+ viewBox="0 0 20 20"
310
310
  fill="currentColor"
311
311
  aria-hidden="true"
312
312
  role="img"
@@ -314,7 +314,7 @@ cssPrefix: pf-v6-c-modal-box
314
314
  height="1em"
315
315
  >
316
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"
317
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
318
318
  />
319
319
  </svg>
320
320
  </span>
@@ -355,7 +355,7 @@ cssPrefix: pf-v6-c-modal-box
355
355
  <span class="pf-v6-c-button__icon">
356
356
  <svg
357
357
  class="pf-v6-svg"
358
- viewBox="0 0 352 512"
358
+ viewBox="0 0 20 20"
359
359
  fill="currentColor"
360
360
  aria-hidden="true"
361
361
  role="img"
@@ -363,7 +363,7 @@ cssPrefix: pf-v6-c-modal-box
363
363
  height="1em"
364
364
  >
365
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"
366
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
367
367
  />
368
368
  </svg>
369
369
  </span>
@@ -414,7 +414,7 @@ cssPrefix: pf-v6-c-modal-box
414
414
  <span class="pf-v6-c-button__icon">
415
415
  <svg
416
416
  class="pf-v6-svg"
417
- viewBox="0 0 352 512"
417
+ viewBox="0 0 20 20"
418
418
  fill="currentColor"
419
419
  aria-hidden="true"
420
420
  role="img"
@@ -422,7 +422,7 @@ cssPrefix: pf-v6-c-modal-box
422
422
  height="1em"
423
423
  >
424
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"
425
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
426
426
  />
427
427
  </svg>
428
428
  </span>
@@ -432,7 +432,19 @@ cssPrefix: pf-v6-c-modal-box
432
432
  <div class="pf-v6-c-modal-box__header-main">
433
433
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="icon-title">
434
434
  <span class="pf-v6-c-modal-box__title-icon">
435
- <i class="fas fa-fw fa-bullhorn" aria-hidden="true"></i>
435
+ <svg
436
+ class="pf-v6-svg"
437
+ viewBox="0 0 576 512"
438
+ fill="currentColor"
439
+ aria-hidden="true"
440
+ role="img"
441
+ width="1em"
442
+ height="1em"
443
+ >
444
+ <path
445
+ d="M576 240c0-23.63-12.95-44.04-32-55.12V32.01C544 23.26 537.02 0 512 0c-7.12 0-14.19 2.38-19.98 7.02l-85.03 68.03C364.28 109.19 310.66 128 256 128H64c-35.35 0-64 28.65-64 64v96c0 35.35 28.65 64 64 64h33.7c-1.39 10.48-2.18 21.14-2.18 32 0 39.77 9.26 77.35 25.56 110.94 5.19 10.69 16.52 17.06 28.4 17.06h74.28c26.05 0 41.69-29.84 25.9-50.56-16.4-21.52-26.15-48.36-26.15-77.44 0-11.11 1.62-21.79 4.41-32H256c54.66 0 108.28 18.81 150.98 52.95l85.03 68.03a32.023 32.023 0 0 0 19.98 7.02c24.92 0 32-22.78 32-32V295.13C563.05 284.04 576 263.63 576 240zm-96 141.42l-33.05-26.44C392.95 311.78 325.12 288 256 288v-96c69.12 0 136.95-23.78 190.95-66.98L480 98.58v282.84z"
446
+ />
447
+ </svg>
436
448
  </span>
437
449
  <span class="pf-v6-c-modal-box__title-text">Modal with icon title</span>
438
450
  </h1>
@@ -459,7 +471,7 @@ cssPrefix: pf-v6-c-modal-box
459
471
  <span class="pf-v6-c-button__icon">
460
472
  <svg
461
473
  class="pf-v6-svg"
462
- viewBox="0 0 352 512"
474
+ viewBox="0 0 20 20"
463
475
  fill="currentColor"
464
476
  aria-hidden="true"
465
477
  role="img"
@@ -467,7 +479,7 @@ cssPrefix: pf-v6-c-modal-box
467
479
  height="1em"
468
480
  >
469
481
  <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"
482
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
471
483
  />
472
484
  </svg>
473
485
  </span>
@@ -477,7 +489,19 @@ cssPrefix: pf-v6-c-modal-box
477
489
  <div class="pf-v6-c-modal-box__header-main">
478
490
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="custom-alert-title">
479
491
  <span class="pf-v6-c-modal-box__title-icon">
480
- <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
492
+ <svg
493
+ class="pf-v6-svg"
494
+ viewBox="0 0 32 32"
495
+ fill="currentColor"
496
+ aria-hidden="true"
497
+ role="img"
498
+ width="1em"
499
+ height="1em"
500
+ >
501
+ <path
502
+ d="M28.75 22v3.5c0 .689-.561 1.25-1.25 1.25h-7.521c.005.084.021.166.021.25 0 2.206-1.794 4-4 4s-4-1.794-4-4c0-.084.016-.166.021-.25H4.5c-.689 0-1.25-.561-1.25-1.25V22a.75.75 0 0 1 .75-.75c1.24 0 2.25-1.009 2.25-2.25v-4c0-4.826 3.528-8.833 8.138-9.605A2.482 2.482 0 0 1 13.5 3.5C13.5 2.122 14.621 1 16 1s2.5 1.122 2.5 2.5c0 .761-.349 1.436-.888 1.895 4.61.772 8.138 4.779 8.138 9.605v4c0 1.241 1.01 2.25 2.25 2.25a.75.75 0 0 1 .75.75Z"
503
+ />
504
+ </svg>
481
505
  </span>
482
506
  <span class="pf-v6-u-screen-reader">
483
507
  Default
@@ -511,7 +535,7 @@ cssPrefix: pf-v6-c-modal-box
511
535
  <span class="pf-v6-c-button__icon">
512
536
  <svg
513
537
  class="pf-v6-svg"
514
- viewBox="0 0 352 512"
538
+ viewBox="0 0 20 20"
515
539
  fill="currentColor"
516
540
  aria-hidden="true"
517
541
  role="img"
@@ -519,7 +543,7 @@ cssPrefix: pf-v6-c-modal-box
519
543
  height="1em"
520
544
  >
521
545
  <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"
546
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
523
547
  />
524
548
  </svg>
525
549
  </span>
@@ -529,7 +553,19 @@ cssPrefix: pf-v6-c-modal-box
529
553
  <div class="pf-v6-c-modal-box__header-main">
530
554
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="info-alert-title">
531
555
  <span class="pf-v6-c-modal-box__title-icon">
532
- <i class="fas fa-fw fa-info-circle" aria-hidden="true"></i>
556
+ <svg
557
+ class="pf-v6-svg"
558
+ viewBox="0 0 32 32"
559
+ fill="currentColor"
560
+ aria-hidden="true"
561
+ role="img"
562
+ width="1em"
563
+ height="1em"
564
+ >
565
+ <path
566
+ d="M16 1C7.729 1 1 7.729 1 16s6.729 15 15 15 15-6.729 15-15S24.271 1 16 1Zm1.5 22a1.5 1.5 0 1 1-3 0v-5.157l-.188.04a1.5 1.5 0 0 1-.625-2.934l1.956-.416c.112-.024.223-.032.333-.03l.024-.002a1.5 1.5 0 0 1 1.5 1.5v7Zm-.08-12.58c-.38.37-.89.58-1.42.58a1.998 1.998 0 0 1-1.851-2.76c.051-.13.11-.24.19-.35.07-.11.15-.21.25-.3.74-.75 2.08-.75 2.83 0 .09.09.17.19.24.3.08.11.14.22.189.35.05.12.09.24.11.37.03.13.04.26.04.39 0 .53-.21 1.04-.58 1.42Z"
567
+ />
568
+ </svg>
533
569
  </span>
534
570
  <span class="pf-v6-u-screen-reader">
535
571
  Info
@@ -563,7 +599,7 @@ cssPrefix: pf-v6-c-modal-box
563
599
  <span class="pf-v6-c-button__icon">
564
600
  <svg
565
601
  class="pf-v6-svg"
566
- viewBox="0 0 352 512"
602
+ viewBox="0 0 20 20"
567
603
  fill="currentColor"
568
604
  aria-hidden="true"
569
605
  role="img"
@@ -571,7 +607,7 @@ cssPrefix: pf-v6-c-modal-box
571
607
  height="1em"
572
608
  >
573
609
  <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"
610
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
575
611
  />
576
612
  </svg>
577
613
  </span>
@@ -581,7 +617,19 @@ cssPrefix: pf-v6-c-modal-box
581
617
  <div class="pf-v6-c-modal-box__header-main">
582
618
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="success-alert-title">
583
619
  <span class="pf-v6-c-modal-box__title-icon">
584
- <i class="fas fa-fw fa-check-circle" aria-hidden="true"></i>
620
+ <svg
621
+ class="pf-v6-svg"
622
+ viewBox="0 0 32 32"
623
+ fill="currentColor"
624
+ aria-hidden="true"
625
+ role="img"
626
+ width="1em"
627
+ height="1em"
628
+ >
629
+ <path
630
+ 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"
631
+ />
632
+ </svg>
585
633
  </span>
586
634
  <span class="pf-v6-u-screen-reader">
587
635
  Success
@@ -615,7 +663,7 @@ cssPrefix: pf-v6-c-modal-box
615
663
  <span class="pf-v6-c-button__icon">
616
664
  <svg
617
665
  class="pf-v6-svg"
618
- viewBox="0 0 352 512"
666
+ viewBox="0 0 20 20"
619
667
  fill="currentColor"
620
668
  aria-hidden="true"
621
669
  role="img"
@@ -623,7 +671,7 @@ cssPrefix: pf-v6-c-modal-box
623
671
  height="1em"
624
672
  >
625
673
  <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"
674
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
627
675
  />
628
676
  </svg>
629
677
  </span>
@@ -633,7 +681,19 @@ cssPrefix: pf-v6-c-modal-box
633
681
  <div class="pf-v6-c-modal-box__header-main">
634
682
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="warning-alert-title">
635
683
  <span class="pf-v6-c-modal-box__title-icon">
636
- <i class="fas fa-fw fa-exclamation-triangle" aria-hidden="true"></i>
684
+ <svg
685
+ class="pf-v6-svg"
686
+ viewBox="0 0 32 32"
687
+ fill="currentColor"
688
+ aria-hidden="true"
689
+ role="img"
690
+ width="1em"
691
+ height="1em"
692
+ >
693
+ <path
694
+ d="m31.874 28.514-15.011-27a1.001 1.001 0 0 0-1.748 0l-15.011 27A1 1 0 0 0 .978 30H31a1 1 0 0 0 .874-1.486ZM14.5 12a1.5 1.5 0 0 1 3 0v5a1.5 1.5 0 0 1-3 0v-5ZM16 26.001a2 2 0 1 1-.001-3.999A2 2 0 0 1 16 26.001Z"
695
+ />
696
+ </svg>
637
697
  </span>
638
698
  <span class="pf-v6-u-screen-reader">
639
699
  Warning
@@ -667,7 +727,7 @@ cssPrefix: pf-v6-c-modal-box
667
727
  <span class="pf-v6-c-button__icon">
668
728
  <svg
669
729
  class="pf-v6-svg"
670
- viewBox="0 0 352 512"
730
+ viewBox="0 0 20 20"
671
731
  fill="currentColor"
672
732
  aria-hidden="true"
673
733
  role="img"
@@ -675,7 +735,7 @@ cssPrefix: pf-v6-c-modal-box
675
735
  height="1em"
676
736
  >
677
737
  <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"
738
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
679
739
  />
680
740
  </svg>
681
741
  </span>
@@ -685,7 +745,19 @@ cssPrefix: pf-v6-c-modal-box
685
745
  <div class="pf-v6-c-modal-box__header-main">
686
746
  <h1 class="pf-v6-c-modal-box__title pf-m-icon" id="danger-alert-title">
687
747
  <span class="pf-v6-c-modal-box__title-icon">
688
- <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
748
+ <svg
749
+ class="pf-v6-svg"
750
+ viewBox="0 0 32 32"
751
+ fill="currentColor"
752
+ aria-hidden="true"
753
+ role="img"
754
+ width="1em"
755
+ height="1em"
756
+ >
757
+ <path
758
+ 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"
759
+ />
760
+ </svg>
689
761
  </span>
690
762
  <span class="pf-v6-u-screen-reader">
691
763
  Danger
@@ -721,7 +793,7 @@ The status modifier classes can be applied directly to the modal title element,
721
793
  <span class="pf-v6-c-button__icon">
722
794
  <svg
723
795
  class="pf-v6-svg"
724
- viewBox="0 0 352 512"
796
+ viewBox="0 0 20 20"
725
797
  fill="currentColor"
726
798
  aria-hidden="true"
727
799
  role="img"
@@ -729,7 +801,7 @@ The status modifier classes can be applied directly to the modal title element,
729
801
  height="1em"
730
802
  >
731
803
  <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"
804
+ d="M17.8 16.2 11.59 10l6.21-6.21c.42-.46.39-1.17-.07-1.59-.43-.4-1.09-.4-1.52 0l-6.2 6.2-6.22-6.19c-.44-.44-1.15-.44-1.59 0-.44.44-.44 1.15 0 1.59l6.2 6.21-6.2 6.2c-.42.46-.39 1.17.07 1.59.43.4 1.09.4 1.52 0L10 11.59l6.2 6.2c.44.44 1.15.44 1.59 0 .44-.45.44-1.16 0-1.6Z"
733
805
  />
734
806
  </svg>
735
807
  </span>
@@ -742,7 +814,19 @@ The status modifier classes can be applied directly to the modal title element,
742
814
  id="danger-alert-title-title"
743
815
  >
744
816
  <span class="pf-v6-c-modal-box__title-icon">
745
- <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
817
+ <svg
818
+ class="pf-v6-svg"
819
+ viewBox="0 0 32 32"
820
+ fill="currentColor"
821
+ aria-hidden="true"
822
+ role="img"
823
+ width="1em"
824
+ height="1em"
825
+ >
826
+ <path
827
+ 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"
828
+ />
829
+ </svg>
746
830
  </span>
747
831
  <span class="pf-v6-u-screen-reader">
748
832
  Danger