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

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 +33 -5
  43. package/components/Button/button.scss +39 -7
  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 +412 -141
  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 +424 -151
  156. package/patternfly.css +424 -151
  157. package/patternfly.min.css +1 -1
  158. package/patternfly.min.css.map +1 -1
package/docs/components/DataList/examples/DataList.md CHANGED
@@ -390,7 +390,19 @@ When a list item includes more than one block of content, it can be difficult fo
390
390
  </div>
391
391
  <div class="pf-v6-c-data-list__item-content">
392
392
  <div class="pf-v6-c-data-list__cell pf-m-icon">
393
- <i class="fas fa-code-branch" aria-hidden="true"></i>
393
+ <svg
394
+ class="pf-v6-svg"
395
+ fill="currentColor"
396
+ viewBox="0 0 32 32"
397
+ aria-hidden="true"
398
+ role="img"
399
+ width="1em"
400
+ height="1em"
401
+ >
402
+ <path
403
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
404
+ />
405
+ </svg>
394
406
  </div>
395
407
  <div class="pf-v6-c-data-list__cell">
396
408
  <span id="data-list-expandable-item-1">Primary content</span>
@@ -559,7 +571,19 @@ When a list item includes more than one block of content, it can be difficult fo
559
571
  </div>
560
572
  <div class="pf-v6-c-data-list__item-content">
561
573
  <div class="pf-v6-c-data-list__cell pf-m-icon">
562
- <i class="fas fa-code-branch" aria-hidden="true"></i>
574
+ <svg
575
+ class="pf-v6-svg"
576
+ fill="currentColor"
577
+ viewBox="0 0 32 32"
578
+ aria-hidden="true"
579
+ role="img"
580
+ width="1em"
581
+ height="1em"
582
+ >
583
+ <path
584
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
585
+ />
586
+ </svg>
563
587
  </div>
564
588
  <div class="pf-v6-c-data-list__cell">
565
589
  <div id="data-list-expandable-item-3">Tertiary content</div>
@@ -656,7 +680,19 @@ When a list item includes more than one block of content, it can be difficult fo
656
680
  </div>
657
681
  <div class="pf-v6-c-data-list__item-content">
658
682
  <div class="pf-v6-c-data-list__cell pf-m-icon">
659
- <i class="fas fa-code-branch" aria-hidden="true"></i>
683
+ <svg
684
+ class="pf-v6-svg"
685
+ fill="currentColor"
686
+ viewBox="0 0 32 32"
687
+ aria-hidden="true"
688
+ role="img"
689
+ width="1em"
690
+ height="1em"
691
+ >
692
+ <path
693
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
694
+ />
695
+ </svg>
660
696
  </div>
661
697
  <div class="pf-v6-c-data-list__cell">
662
698
  <div id="data-list-expandable-compact-item-1">Primary content</div>
@@ -742,7 +778,19 @@ When a list item includes more than one block of content, it can be difficult fo
742
778
  </div>
743
779
  <div class="pf-v6-c-data-list__item-content">
744
780
  <div class="pf-v6-c-data-list__cell pf-m-icon">
745
- <i class="fas fa-code-branch" aria-hidden="true"></i>
781
+ <svg
782
+ class="pf-v6-svg"
783
+ fill="currentColor"
784
+ viewBox="0 0 32 32"
785
+ aria-hidden="true"
786
+ role="img"
787
+ width="1em"
788
+ height="1em"
789
+ >
790
+ <path
791
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
792
+ />
793
+ </svg>
746
794
  </div>
747
795
  <div class="pf-v6-c-data-list__cell">
748
796
  <span id="data-list-expandable-compact-item-2">Secondary content</span>
@@ -828,7 +876,19 @@ When a list item includes more than one block of content, it can be difficult fo
828
876
  </div>
829
877
  <div class="pf-v6-c-data-list__item-content">
830
878
  <div class="pf-v6-c-data-list__cell pf-m-icon">
831
- <i class="fas fa-code-branch" aria-hidden="true"></i>
879
+ <svg
880
+ class="pf-v6-svg"
881
+ fill="currentColor"
882
+ viewBox="0 0 32 32"
883
+ aria-hidden="true"
884
+ role="img"
885
+ width="1em"
886
+ height="1em"
887
+ >
888
+ <path
889
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
890
+ />
891
+ </svg>
832
892
  </div>
833
893
  <div class="pf-v6-c-data-list__cell">
834
894
  <span id="data-list-expandable-compact-item-3">Tertiary content</span>
@@ -925,7 +985,19 @@ When a list item includes more than one block of content, it can be difficult fo
925
985
  </div>
926
986
  <div class="pf-v6-c-data-list__item-content">
927
987
  <div class="pf-v6-c-data-list__cell pf-m-icon">
928
- <i class="fas fa-code-branch" aria-hidden="true"></i>
988
+ <svg
989
+ class="pf-v6-svg"
990
+ fill="currentColor"
991
+ viewBox="0 0 32 32"
992
+ aria-hidden="true"
993
+ role="img"
994
+ width="1em"
995
+ height="1em"
996
+ >
997
+ <path
998
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
999
+ />
1000
+ </svg>
929
1001
  </div>
930
1002
  <div class="pf-v6-c-data-list__cell">
931
1003
  <span id="data-list-expandable-nested-item-1">Primary content</span>
@@ -1256,7 +1328,19 @@ When a list item includes more than one block of content, it can be difficult fo
1256
1328
  </div>
1257
1329
  <div class="pf-v6-c-data-list__item-content">
1258
1330
  <div class="pf-v6-c-data-list__cell pf-m-icon">
1259
- <i class="fas fa-code-branch" aria-hidden="true"></i>
1331
+ <svg
1332
+ class="pf-v6-svg"
1333
+ fill="currentColor"
1334
+ viewBox="0 0 32 32"
1335
+ aria-hidden="true"
1336
+ role="img"
1337
+ width="1em"
1338
+ height="1em"
1339
+ >
1340
+ <path
1341
+ d="M23 3c-2.206 0-4 1.794-4 4 0 1.858 1.279 3.411 3 3.858V13c0 1.103-.897 2-2 2h-6c-1.13 0-2.162.391-3 1.026V8.858c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4S6 2.794 6 5c0 1.858 1.279 3.411 3 3.858v14.284c-1.721.447-3 2-3 3.858 0 2.206 1.794 4 4 4s4-1.794 4-4c0-1.858-1.279-3.411-3-3.858V20c0-1.654 1.346-3 3-3h6c2.206 0 4-1.794 4-4v-2.142c1.721-.447 3-2 3-3.858 0-2.206-1.794-4-4-4ZM12 27c0 1.103-.897 2-2 2s-2-.897-2-2 .897-2 2-2 2 .897 2 2ZM10 7c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Zm13 2c-1.103 0-2-.897-2-2s.897-2 2-2 2 .897 2 2-.897 2-2 2Z"
1342
+ />
1343
+ </svg>
1260
1344
  </div>
1261
1345
  <div class="pf-v6-c-data-list__cell">
1262
1346
  <div id="data-list-expandable-nested-item-3">Tertiary content</div>
@@ -2167,7 +2251,19 @@ When a list item includes more than one block of content, it can be difficult fo
2167
2251
  disabled
2168
2252
  >
2169
2253
  <span class="pf-v6-c-data-list__item-draggable-icon">
2170
- <i class="fas fa-grip-vertical"></i>
2254
+ <svg
2255
+ class="pf-v6-svg"
2256
+ fill="currentColor"
2257
+ viewBox="0 0 32 32"
2258
+ aria-hidden="true"
2259
+ role="img"
2260
+ width="1em"
2261
+ height="1em"
2262
+ >
2263
+ <path
2264
+ d="M13.75 2.25v5.5c0 .551-.448 1-1 1h-5.5c-.552 0-1-.449-1-1v-5.5c0-.551.448-1 1-1h5.5c.552 0 1 .449 1 1Zm11-1h-5.5c-.552 0-1 .449-1 1v5.5c0 .551.448 1 1 1h5.5c.552 0 1-.449 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm12 0h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Zm12 0h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Z"
2265
+ />
2266
+ </svg>
2171
2267
  </span>
2172
2268
  </button>
2173
2269
  <div class="pf-v6-c-data-list__check">
@@ -2209,7 +2305,19 @@ When a list item includes more than one block of content, it can be difficult fo
2209
2305
  aria-labelledby="data-list-draggable-draggable-button-2 data-list-draggable-item-2"
2210
2306
  >
2211
2307
  <span class="pf-v6-c-data-list__item-draggable-icon">
2212
- <i class="fas fa-grip-vertical"></i>
2308
+ <svg
2309
+ class="pf-v6-svg"
2310
+ fill="currentColor"
2311
+ viewBox="0 0 32 32"
2312
+ aria-hidden="true"
2313
+ role="img"
2314
+ width="1em"
2315
+ height="1em"
2316
+ >
2317
+ <path
2318
+ d="M13.75 2.25v5.5c0 .551-.448 1-1 1h-5.5c-.552 0-1-.449-1-1v-5.5c0-.551.448-1 1-1h5.5c.552 0 1 .449 1 1Zm11-1h-5.5c-.552 0-1 .449-1 1v5.5c0 .551.448 1 1 1h5.5c.552 0 1-.449 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm12 0h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Zm12 0h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Z"
2319
+ />
2320
+ </svg>
2213
2321
  </span>
2214
2322
  </button>
2215
2323
  <div class="pf-v6-c-data-list__check">
@@ -2252,7 +2360,19 @@ When a list item includes more than one block of content, it can be difficult fo
2252
2360
  disabled
2253
2361
  >
2254
2362
  <span class="pf-v6-c-data-list__item-draggable-icon">
2255
- <i class="fas fa-grip-vertical"></i>
2363
+ <svg
2364
+ class="pf-v6-svg"
2365
+ fill="currentColor"
2366
+ viewBox="0 0 32 32"
2367
+ aria-hidden="true"
2368
+ role="img"
2369
+ width="1em"
2370
+ height="1em"
2371
+ >
2372
+ <path
2373
+ d="M13.75 2.25v5.5c0 .551-.448 1-1 1h-5.5c-.552 0-1-.449-1-1v-5.5c0-.551.448-1 1-1h5.5c.552 0 1 .449 1 1Zm11-1h-5.5c-.552 0-1 .449-1 1v5.5c0 .551.448 1 1 1h5.5c.552 0 1-.449 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm12 0h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Zm12 0h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Z"
2374
+ />
2375
+ </svg>
2256
2376
  </span>
2257
2377
  </button>
2258
2378
  <div class="pf-v6-c-data-list__check">
@@ -2294,7 +2414,19 @@ When a list item includes more than one block of content, it can be difficult fo
2294
2414
  aria-labelledby="data-list-draggable-draggable-button-4 data-list-draggable-item-4"
2295
2415
  >
2296
2416
  <span class="pf-v6-c-data-list__item-draggable-icon">
2297
- <i class="fas fa-grip-vertical"></i>
2417
+ <svg
2418
+ class="pf-v6-svg"
2419
+ fill="currentColor"
2420
+ viewBox="0 0 32 32"
2421
+ aria-hidden="true"
2422
+ role="img"
2423
+ width="1em"
2424
+ height="1em"
2425
+ >
2426
+ <path
2427
+ d="M13.75 2.25v5.5c0 .551-.448 1-1 1h-5.5c-.552 0-1-.449-1-1v-5.5c0-.551.448-1 1-1h5.5c.552 0 1 .449 1 1Zm11-1h-5.5c-.552 0-1 .449-1 1v5.5c0 .551.448 1 1 1h5.5c.552 0 1-.449 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm12 0h-5.5c-.552 0-1 .449-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5c0-.551-.448-1-1-1Zm-12 11h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Zm12 0h-5.5a1 1 0 0 0-1 1v5.5a1 1 0 0 0 1 1h5.5a1 1 0 0 0 1-1v-5.5a1 1 0 0 0-1-1Z"
2428
+ />
2429
+ </svg>
2298
2430
  </span>
2299
2431
  </button>
2300
2432
  <div class="pf-v6-c-data-list__check">
package/docs/components/DatePicker/examples/DatePicker.md CHANGED
@@ -124,7 +124,19 @@ cssPrefix: pf-v6-c-date-picker
124
124
  />
125
125
  <span class="pf-v6-c-form-control__utilities">
126
126
  <span class="pf-v6-c-form-control__icon pf-m-status">
127
- <i class="fas fa-exclamation-circle" aria-hidden="true"></i>
127
+ <svg
128
+ class="pf-v6-svg"
129
+ fill="currentColor"
130
+ viewBox="0 0 32 32"
131
+ aria-hidden="true"
132
+ role="img"
133
+ width="1em"
134
+ height="1em"
135
+ >
136
+ <path
137
+ 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"
138
+ />
139
+ </svg>
128
140
  </span>
129
141
  </span>
130
142
  </span>
@@ -158,7 +170,19 @@ cssPrefix: pf-v6-c-date-picker
158
170
  <div class="pf-v6-c-helper-text">
159
171
  <div class="pf-v6-c-helper-text__item pf-m-error">
160
172
  <span class="pf-v6-c-helper-text__item-icon">
161
- <i class="fas fa-fw fa-exclamation-circle" aria-hidden="true"></i>
173
+ <svg
174
+ class="pf-v6-svg"
175
+ fill="currentColor"
176
+ viewBox="0 0 32 32"
177
+ aria-hidden="true"
178
+ role="img"
179
+ width="1em"
180
+ height="1em"
181
+ >
182
+ <path
183
+ 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"
184
+ />
185
+ </svg>
162
186
  </span>
163
187
  <span class="pf-v6-c-helper-text__item-text">
164
188
  <span class="pf-v6-screen-reader">Error:</span>