@patternfly/patternfly 6.5.0-prerelease.46 → 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 (80) 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 +1 -1
  20. package/components/NotificationDrawer/notification-drawer.scss +1 -1
  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 +18 -18
  32. package/docs/components/Accordion/examples/Accordion.md +390 -30
  33. package/docs/components/Breadcrumb/examples/Breadcrumb.md +299 -23
  34. package/docs/components/CalendarMonth/examples/CalendarMonth.md +16 -16
  35. package/docs/components/Card/examples/Card.md +52 -4
  36. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +78 -6
  37. package/docs/components/CodeBlock/examples/CodeBlock.md +26 -2
  38. package/docs/components/DataList/examples/DataList.md +221 -17
  39. package/docs/components/DualListSelector/examples/DualListSelector.md +169 -13
  40. package/docs/components/ExpandableSection/examples/ExpandableSection.md +91 -7
  41. package/docs/components/Form/examples/Form.md +78 -6
  42. package/docs/components/Icon/examples/Icon.md +26 -2
  43. package/docs/components/JumpLinks/examples/JumpLinks.md +52 -4
  44. package/docs/components/Menu/examples/Menu.md +1456 -112
  45. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +39 -3
  46. package/docs/components/Nav/examples/Navigation.md +710 -62
  47. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +52 -4
  48. package/docs/components/Table/examples/Table.md +819 -63
  49. package/docs/components/Tabs/examples/Tabs.md +321 -213
  50. package/docs/components/TreeView/examples/TreeView.md +1300 -100
  51. package/docs/components/Wizard/examples/Wizard.md +323 -59
  52. package/docs/demos/AboutModal/examples/AboutModal.md +39 -3
  53. package/docs/demos/Alert/examples/Alert.md +117 -9
  54. package/docs/demos/BackToTop/examples/BackToTop.md +39 -3
  55. package/docs/demos/Banner/examples/Banner.md +78 -6
  56. package/docs/demos/Card/examples/Card.md +230 -26
  57. package/docs/demos/CardView/examples/CardView.md +78 -6
  58. package/docs/demos/Compass/examples/Compass.md +71 -35
  59. package/docs/demos/Dashboard/examples/Dashboard.md +104 -8
  60. package/docs/demos/DataList/examples/DataList.md +234 -18
  61. package/docs/demos/DescriptionList/examples/DescriptionList.md +117 -9
  62. package/docs/demos/Drawer/examples/Drawer.md +141 -15
  63. package/docs/demos/Form/examples/BasicForms.md +143 -11
  64. package/docs/demos/JumpLinks/examples/JumpLinks.md +216 -27
  65. package/docs/demos/Masthead/examples/Masthead.md +355 -31
  66. package/docs/demos/Modal/examples/Modal.md +234 -18
  67. package/docs/demos/Nav/examples/Nav.md +320 -32
  68. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +247 -19
  69. package/docs/demos/Page/examples/Page.md +546 -42
  70. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +281 -29
  71. package/docs/demos/Skeleton/examples/Skeleton.md +39 -3
  72. package/docs/demos/Table/examples/Table.md +702 -54
  73. package/docs/demos/Tabs/examples/Tabs.md +238 -22
  74. package/docs/demos/Toolbar/examples/Toolbar.md +78 -6
  75. package/docs/demos/Wizard/examples/Wizard.md +621 -72
  76. package/package.json +1 -1
  77. package/patternfly-no-globals.css +18 -18
  78. package/patternfly.css +18 -18
  79. package/patternfly.min.css +1 -1
  80. package/patternfly.min.css.map +1 -1
package/docs/components/DualListSelector/examples/DualListSelector.md CHANGED
@@ -1660,7 +1660,19 @@ cssPrefix: pf-v6-c-dual-list-selector
1660
1660
  <span class="pf-v6-c-dual-list-selector__item-main">
1661
1661
  <div class="pf-v6-c-dual-list-selector__item-toggle">
1662
1662
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
1663
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1663
+ <svg
1664
+ class="pf-v6-svg"
1665
+ viewBox="0 0 20 20"
1666
+ fill="currentColor"
1667
+ aria-hidden="true"
1668
+ role="img"
1669
+ width="1em"
1670
+ height="1em"
1671
+ >
1672
+ <path
1673
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1674
+ />
1675
+ </svg>
1664
1676
  </span>
1665
1677
  </div>
1666
1678
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -1758,7 +1770,19 @@ cssPrefix: pf-v6-c-dual-list-selector
1758
1770
  <span
1759
1771
  class="pf-v6-c-dual-list-selector__item-toggle-icon"
1760
1772
  >
1761
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1773
+ <svg
1774
+ class="pf-v6-svg"
1775
+ viewBox="0 0 20 20"
1776
+ fill="currentColor"
1777
+ aria-hidden="true"
1778
+ role="img"
1779
+ width="1em"
1780
+ height="1em"
1781
+ >
1782
+ <path
1783
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1784
+ />
1785
+ </svg>
1762
1786
  </span>
1763
1787
  </div>
1764
1788
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -1874,7 +1898,19 @@ cssPrefix: pf-v6-c-dual-list-selector
1874
1898
  <span class="pf-v6-c-dual-list-selector__item-main">
1875
1899
  <div class="pf-v6-c-dual-list-selector__item-toggle">
1876
1900
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
1877
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1901
+ <svg
1902
+ class="pf-v6-svg"
1903
+ viewBox="0 0 20 20"
1904
+ fill="currentColor"
1905
+ aria-hidden="true"
1906
+ role="img"
1907
+ width="1em"
1908
+ height="1em"
1909
+ >
1910
+ <path
1911
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1912
+ />
1913
+ </svg>
1878
1914
  </span>
1879
1915
  </div>
1880
1916
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -1927,7 +1963,19 @@ cssPrefix: pf-v6-c-dual-list-selector
1927
1963
  <span class="pf-v6-c-dual-list-selector__item-main">
1928
1964
  <div class="pf-v6-c-dual-list-selector__item-toggle">
1929
1965
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
1930
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1966
+ <svg
1967
+ class="pf-v6-svg"
1968
+ viewBox="0 0 20 20"
1969
+ fill="currentColor"
1970
+ aria-hidden="true"
1971
+ role="img"
1972
+ width="1em"
1973
+ height="1em"
1974
+ >
1975
+ <path
1976
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1977
+ />
1978
+ </svg>
1931
1979
  </span>
1932
1980
  </div>
1933
1981
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2221,7 +2269,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2221
2269
  <span class="pf-v6-c-dual-list-selector__item-main">
2222
2270
  <div class="pf-v6-c-dual-list-selector__item-toggle">
2223
2271
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
2224
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2272
+ <svg
2273
+ class="pf-v6-svg"
2274
+ viewBox="0 0 20 20"
2275
+ fill="currentColor"
2276
+ aria-hidden="true"
2277
+ role="img"
2278
+ width="1em"
2279
+ height="1em"
2280
+ >
2281
+ <path
2282
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2283
+ />
2284
+ </svg>
2225
2285
  </span>
2226
2286
  </div>
2227
2287
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2300,7 +2360,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2300
2360
  <span
2301
2361
  class="pf-v6-c-dual-list-selector__item-toggle-icon"
2302
2362
  >
2303
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2363
+ <svg
2364
+ class="pf-v6-svg"
2365
+ viewBox="0 0 20 20"
2366
+ fill="currentColor"
2367
+ aria-hidden="true"
2368
+ role="img"
2369
+ width="1em"
2370
+ height="1em"
2371
+ >
2372
+ <path
2373
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2374
+ />
2375
+ </svg>
2304
2376
  </span>
2305
2377
  </div>
2306
2378
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2421,7 +2493,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2421
2493
  <span class="pf-v6-c-dual-list-selector__item-main">
2422
2494
  <div class="pf-v6-c-dual-list-selector__item-toggle">
2423
2495
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
2424
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2496
+ <svg
2497
+ class="pf-v6-svg"
2498
+ viewBox="0 0 20 20"
2499
+ fill="currentColor"
2500
+ aria-hidden="true"
2501
+ role="img"
2502
+ width="1em"
2503
+ height="1em"
2504
+ >
2505
+ <path
2506
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2507
+ />
2508
+ </svg>
2425
2509
  </span>
2426
2510
  </div>
2427
2511
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2472,7 +2556,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2472
2556
  <span class="pf-v6-c-dual-list-selector__item-main">
2473
2557
  <div class="pf-v6-c-dual-list-selector__item-toggle">
2474
2558
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
2475
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2559
+ <svg
2560
+ class="pf-v6-svg"
2561
+ viewBox="0 0 20 20"
2562
+ fill="currentColor"
2563
+ aria-hidden="true"
2564
+ role="img"
2565
+ width="1em"
2566
+ height="1em"
2567
+ >
2568
+ <path
2569
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2570
+ />
2571
+ </svg>
2476
2572
  </span>
2477
2573
  </div>
2478
2574
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2679,7 +2775,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2679
2775
  <span class="pf-v6-c-dual-list-selector__item-main">
2680
2776
  <div class="pf-v6-c-dual-list-selector__item-toggle">
2681
2777
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
2682
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2778
+ <svg
2779
+ class="pf-v6-svg"
2780
+ viewBox="0 0 20 20"
2781
+ fill="currentColor"
2782
+ aria-hidden="true"
2783
+ role="img"
2784
+ width="1em"
2785
+ height="1em"
2786
+ >
2787
+ <path
2788
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2789
+ />
2790
+ </svg>
2683
2791
  </span>
2684
2792
  </div>
2685
2793
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2824,7 +2932,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2824
2932
  <span class="pf-v6-c-dual-list-selector__item-main">
2825
2933
  <div class="pf-v6-c-dual-list-selector__item-toggle">
2826
2934
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
2827
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2935
+ <svg
2936
+ class="pf-v6-svg"
2937
+ viewBox="0 0 20 20"
2938
+ fill="currentColor"
2939
+ aria-hidden="true"
2940
+ role="img"
2941
+ width="1em"
2942
+ height="1em"
2943
+ >
2944
+ <path
2945
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
2946
+ />
2947
+ </svg>
2828
2948
  </span>
2829
2949
  </div>
2830
2950
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -2922,7 +3042,19 @@ cssPrefix: pf-v6-c-dual-list-selector
2922
3042
  <span
2923
3043
  class="pf-v6-c-dual-list-selector__item-toggle-icon"
2924
3044
  >
2925
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3045
+ <svg
3046
+ class="pf-v6-svg"
3047
+ viewBox="0 0 20 20"
3048
+ fill="currentColor"
3049
+ aria-hidden="true"
3050
+ role="img"
3051
+ width="1em"
3052
+ height="1em"
3053
+ >
3054
+ <path
3055
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3056
+ />
3057
+ </svg>
2926
3058
  </span>
2927
3059
  </div>
2928
3060
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -3038,7 +3170,19 @@ cssPrefix: pf-v6-c-dual-list-selector
3038
3170
  <span class="pf-v6-c-dual-list-selector__item-main">
3039
3171
  <div class="pf-v6-c-dual-list-selector__item-toggle">
3040
3172
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
3041
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3173
+ <svg
3174
+ class="pf-v6-svg"
3175
+ viewBox="0 0 20 20"
3176
+ fill="currentColor"
3177
+ aria-hidden="true"
3178
+ role="img"
3179
+ width="1em"
3180
+ height="1em"
3181
+ >
3182
+ <path
3183
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3184
+ />
3185
+ </svg>
3042
3186
  </span>
3043
3187
  </div>
3044
3188
  <span class="pf-v6-c-dual-list-selector__item-check">
@@ -3091,7 +3235,19 @@ cssPrefix: pf-v6-c-dual-list-selector
3091
3235
  <span class="pf-v6-c-dual-list-selector__item-main">
3092
3236
  <div class="pf-v6-c-dual-list-selector__item-toggle">
3093
3237
  <span class="pf-v6-c-dual-list-selector__item-toggle-icon">
3094
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3238
+ <svg
3239
+ class="pf-v6-svg"
3240
+ viewBox="0 0 20 20"
3241
+ fill="currentColor"
3242
+ aria-hidden="true"
3243
+ role="img"
3244
+ width="1em"
3245
+ height="1em"
3246
+ >
3247
+ <path
3248
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
3249
+ />
3250
+ </svg>
3095
3251
  </span>
3096
3252
  </div>
3097
3253
  <span class="pf-v6-c-dual-list-selector__item-check">
package/docs/components/ExpandableSection/examples/ExpandableSection.md CHANGED
@@ -18,7 +18,19 @@ cssPrefix: pf-v6-c-expandable-section
18
18
  >
19
19
  <span class="pf-v6-c-button__icon pf-m-start">
20
20
  <span class="pf-v6-c-expandable-section__toggle-icon">
21
- <i class="fas fa-angle-right" aria-hidden="true"></i>
21
+ <svg
22
+ class="pf-v6-svg"
23
+ viewBox="0 0 20 20"
24
+ fill="currentColor"
25
+ aria-hidden="true"
26
+ role="img"
27
+ width="1em"
28
+ height="1em"
29
+ >
30
+ <path
31
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
32
+ />
33
+ </svg>
22
34
  </span>
23
35
  </span>
24
36
  <span class="pf-v6-c-button__text">Show more hidden example content</span>
@@ -49,7 +61,19 @@ cssPrefix: pf-v6-c-expandable-section
49
61
  >
50
62
  <span class="pf-v6-c-button__icon pf-m-start">
51
63
  <span class="pf-v6-c-expandable-section__toggle-icon">
52
- <i class="fas fa-angle-right" aria-hidden="true"></i>
64
+ <svg
65
+ class="pf-v6-svg"
66
+ viewBox="0 0 20 20"
67
+ fill="currentColor"
68
+ aria-hidden="true"
69
+ role="img"
70
+ width="1em"
71
+ height="1em"
72
+ >
73
+ <path
74
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
75
+ />
76
+ </svg>
53
77
  </span>
54
78
  </span>
55
79
  <span class="pf-v6-c-button__text">Show less expanded example content</span>
@@ -79,7 +103,19 @@ cssPrefix: pf-v6-c-expandable-section
79
103
  >
80
104
  <span class="pf-v6-c-button__icon pf-m-start">
81
105
  <span class="pf-v6-c-expandable-section__toggle-icon">
82
- <i class="fas fa-angle-right" aria-hidden="true"></i>
106
+ <svg
107
+ class="pf-v6-svg"
108
+ viewBox="0 0 20 20"
109
+ fill="currentColor"
110
+ aria-hidden="true"
111
+ role="img"
112
+ width="1em"
113
+ height="1em"
114
+ >
115
+ <path
116
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
117
+ />
118
+ </svg>
83
119
  </span>
84
120
  </span>
85
121
  <span class="pf-v6-c-button__text">Show less indented example content</span>
@@ -109,7 +145,19 @@ cssPrefix: pf-v6-c-expandable-section
109
145
  >
110
146
  <span class="pf-v6-c-button__icon pf-m-start">
111
147
  <span class="pf-v6-c-expandable-section__toggle-icon">
112
- <i class="fas fa-angle-right" aria-hidden="true"></i>
148
+ <svg
149
+ class="pf-v6-svg"
150
+ viewBox="0 0 20 20"
151
+ fill="currentColor"
152
+ aria-hidden="true"
153
+ role="img"
154
+ width="1em"
155
+ height="1em"
156
+ >
157
+ <path
158
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
159
+ />
160
+ </svg>
113
161
  </span>
114
162
  </span>
115
163
  <span
@@ -144,7 +192,19 @@ cssPrefix: pf-v6-c-expandable-section
144
192
  >
145
193
  <span class="pf-v6-c-button__icon pf-m-start">
146
194
  <span class="pf-v6-c-expandable-section__toggle-icon">
147
- <i class="fas fa-angle-right" aria-hidden="true"></i>
195
+ <svg
196
+ class="pf-v6-svg"
197
+ viewBox="0 0 20 20"
198
+ fill="currentColor"
199
+ aria-hidden="true"
200
+ role="img"
201
+ width="1em"
202
+ height="1em"
203
+ >
204
+ <path
205
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
206
+ />
207
+ </svg>
148
208
  </span>
149
209
  </span>
150
210
  <span
@@ -178,7 +238,19 @@ cssPrefix: pf-v6-c-expandable-section
178
238
  >
179
239
  <span class="pf-v6-c-button__icon pf-m-start">
180
240
  <span class="pf-v6-c-expandable-section__toggle-icon">
181
- <i class="fas fa-angle-right" aria-hidden="true"></i>
241
+ <svg
242
+ class="pf-v6-svg"
243
+ viewBox="0 0 20 20"
244
+ fill="currentColor"
245
+ aria-hidden="true"
246
+ role="img"
247
+ width="1em"
248
+ height="1em"
249
+ >
250
+ <path
251
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
252
+ />
253
+ </svg>
182
254
  </span>
183
255
  </span>
184
256
  <span
@@ -227,7 +299,19 @@ cssPrefix: pf-v6-c-expandable-section
227
299
  >
228
300
  <span class="pf-v6-c-button__icon pf-m-start">
229
301
  <span class="pf-v6-c-expandable-section__toggle-icon">
230
- <i class="fas fa-angle-right" aria-hidden="true"></i>
302
+ <svg
303
+ class="pf-v6-svg"
304
+ viewBox="0 0 20 20"
305
+ fill="currentColor"
306
+ aria-hidden="true"
307
+ role="img"
308
+ width="1em"
309
+ height="1em"
310
+ >
311
+ <path
312
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
313
+ />
314
+ </svg>
231
315
  </span>
232
316
  </span>
233
317
  <span class="pf-v6-c-button__text">Show less detached example content</span>
package/docs/components/Form/examples/Form.md CHANGED
@@ -803,7 +803,19 @@ cssPrefix: pf-v6-c-form
803
803
  >
804
804
  <span class="pf-v6-c-button__icon">
805
805
  <span class="pf-v6-c-form__field-group-toggle-icon">
806
- <i class="fas fa-angle-right" aria-hidden="true"></i>
806
+ <svg
807
+ class="pf-v6-svg"
808
+ viewBox="0 0 20 20"
809
+ fill="currentColor"
810
+ aria-hidden="true"
811
+ role="img"
812
+ width="1em"
813
+ height="1em"
814
+ >
815
+ <path
816
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
817
+ />
818
+ </svg>
807
819
  </span>
808
820
  </span>
809
821
  </button>
@@ -845,7 +857,19 @@ cssPrefix: pf-v6-c-form
845
857
  >
846
858
  <span class="pf-v6-c-button__icon">
847
859
  <span class="pf-v6-c-form__field-group-toggle-icon">
848
- <i class="fas fa-angle-right" aria-hidden="true"></i>
860
+ <svg
861
+ class="pf-v6-svg"
862
+ viewBox="0 0 20 20"
863
+ fill="currentColor"
864
+ aria-hidden="true"
865
+ role="img"
866
+ width="1em"
867
+ height="1em"
868
+ >
869
+ <path
870
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
871
+ />
872
+ </svg>
849
873
  </span>
850
874
  </span>
851
875
  </button>
@@ -980,7 +1004,19 @@ cssPrefix: pf-v6-c-form
980
1004
  >
981
1005
  <span class="pf-v6-c-button__icon">
982
1006
  <span class="pf-v6-c-form__field-group-toggle-icon">
983
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1007
+ <svg
1008
+ class="pf-v6-svg"
1009
+ viewBox="0 0 20 20"
1010
+ fill="currentColor"
1011
+ aria-hidden="true"
1012
+ role="img"
1013
+ width="1em"
1014
+ height="1em"
1015
+ >
1016
+ <path
1017
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1018
+ />
1019
+ </svg>
984
1020
  </span>
985
1021
  </span>
986
1022
  </button>
@@ -1112,7 +1148,19 @@ cssPrefix: pf-v6-c-form
1112
1148
  >
1113
1149
  <span class="pf-v6-c-button__icon">
1114
1150
  <span class="pf-v6-c-form__field-group-toggle-icon">
1115
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1151
+ <svg
1152
+ class="pf-v6-svg"
1153
+ viewBox="0 0 20 20"
1154
+ fill="currentColor"
1155
+ aria-hidden="true"
1156
+ role="img"
1157
+ width="1em"
1158
+ height="1em"
1159
+ >
1160
+ <path
1161
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1162
+ />
1163
+ </svg>
1116
1164
  </span>
1117
1165
  </span>
1118
1166
  </button>
@@ -1287,7 +1335,19 @@ cssPrefix: pf-v6-c-form
1287
1335
  >
1288
1336
  <span class="pf-v6-c-button__icon">
1289
1337
  <span class="pf-v6-c-form__field-group-toggle-icon">
1290
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1338
+ <svg
1339
+ class="pf-v6-svg"
1340
+ viewBox="0 0 20 20"
1341
+ fill="currentColor"
1342
+ aria-hidden="true"
1343
+ role="img"
1344
+ width="1em"
1345
+ height="1em"
1346
+ >
1347
+ <path
1348
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1349
+ />
1350
+ </svg>
1291
1351
  </span>
1292
1352
  </span>
1293
1353
  </button>
@@ -1519,7 +1579,19 @@ cssPrefix: pf-v6-c-form
1519
1579
  >
1520
1580
  <span class="pf-v6-c-button__icon">
1521
1581
  <span class="pf-v6-c-form__field-group-toggle-icon">
1522
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1582
+ <svg
1583
+ class="pf-v6-svg"
1584
+ viewBox="0 0 20 20"
1585
+ fill="currentColor"
1586
+ aria-hidden="true"
1587
+ role="img"
1588
+ width="1em"
1589
+ height="1em"
1590
+ >
1591
+ <path
1592
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
1593
+ />
1594
+ </svg>
1523
1595
  </span>
1524
1596
  </span>
1525
1597
  </button>
package/docs/components/Icon/examples/Icon.md CHANGED
@@ -15,13 +15,37 @@ cssPrefix: pf-v6-c-icon
15
15
 
16
16
  <span class="pf-v6-c-icon">
17
17
  <span class="pf-v6-c-icon__content">
18
- <i class="fas fa-angle-right" aria-hidden="true"></i>
18
+ <svg
19
+ class="pf-v6-svg"
20
+ viewBox="0 0 20 20"
21
+ fill="currentColor"
22
+ aria-hidden="true"
23
+ role="img"
24
+ width="1em"
25
+ height="1em"
26
+ >
27
+ <path
28
+ d="M14.35 8.94 6.71 1.29l-.02-.02c-.4-.38-1.03-.37-1.41.02-.38.4-.37 1.03.02 1.41l7.29 7.29-7.29 7.29a1.003 1.003 0 0 0 1.42 1.42l7.65-7.65c.59-.59.59-1.54 0-2.12Z"
29
+ />
30
+ </svg>
19
31
  </span>
20
32
  </span>
21
33
 
22
34
  <span class="pf-v6-c-icon">
23
35
  <span class="pf-v6-c-icon__content">
24
- <i class="fas fa-angle-down" aria-hidden="true"></i>
36
+ <svg
37
+ class="pf-v6-svg"
38
+ viewBox="0 0 20 20"
39
+ fill="currentColor"
40
+ aria-hidden="true"
41
+ role="img"
42
+ width="1em"
43
+ height="1em"
44
+ >
45
+ <path
46
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
47
+ />
48
+ </svg>
25
49
  </span>
26
50
  </span>
27
51
 
package/docs/components/JumpLinks/examples/JumpLinks.md CHANGED
@@ -525,7 +525,19 @@ cssPrefix: pf-v6-c-jump-links
525
525
  >
526
526
  <span class="pf-v6-c-button__icon pf-m-start">
527
527
  <span class="pf-v6-c-jump-links__toggle-icon">
528
- <i class="fas fa-angle-right" aria-hidden="true"></i>
528
+ <svg
529
+ class="pf-v6-svg"
530
+ viewBox="0 0 20 20"
531
+ fill="currentColor"
532
+ aria-hidden="true"
533
+ role="img"
534
+ width="1em"
535
+ height="1em"
536
+ >
537
+ <path
538
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
539
+ />
540
+ </svg>
529
541
  </span>
530
542
  </span>
531
543
  <span class="pf-v6-c-button__text">Jump to expandable example sections</span>
@@ -604,7 +616,19 @@ cssPrefix: pf-v6-c-jump-links
604
616
  >
605
617
  <span class="pf-v6-c-button__icon pf-m-start">
606
618
  <span class="pf-v6-c-jump-links__toggle-icon">
607
- <i class="fas fa-angle-right" aria-hidden="true"></i>
619
+ <svg
620
+ class="pf-v6-svg"
621
+ viewBox="0 0 20 20"
622
+ fill="currentColor"
623
+ aria-hidden="true"
624
+ role="img"
625
+ width="1em"
626
+ height="1em"
627
+ >
628
+ <path
629
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
630
+ />
631
+ </svg>
608
632
  </span>
609
633
  </span>
610
634
  <span class="pf-v6-c-button__text">Jump to expanded example sections</span>
@@ -683,7 +707,19 @@ cssPrefix: pf-v6-c-jump-links
683
707
  >
684
708
  <span class="pf-v6-c-button__icon pf-m-start">
685
709
  <span class="pf-v6-c-jump-links__toggle-icon">
686
- <i class="fas fa-angle-right" aria-hidden="true"></i>
710
+ <svg
711
+ class="pf-v6-svg"
712
+ viewBox="0 0 20 20"
713
+ fill="currentColor"
714
+ aria-hidden="true"
715
+ role="img"
716
+ width="1em"
717
+ height="1em"
718
+ >
719
+ <path
720
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
721
+ />
722
+ </svg>
687
723
  </span>
688
724
  </span>
689
725
  <span
@@ -766,7 +802,19 @@ cssPrefix: pf-v6-c-jump-links
766
802
  >
767
803
  <span class="pf-v6-c-button__icon pf-m-start">
768
804
  <span class="pf-v6-c-jump-links__toggle-icon">
769
- <i class="fas fa-angle-right" aria-hidden="true"></i>
805
+ <svg
806
+ class="pf-v6-svg"
807
+ viewBox="0 0 20 20"
808
+ fill="currentColor"
809
+ aria-hidden="true"
810
+ role="img"
811
+ width="1em"
812
+ height="1em"
813
+ >
814
+ <path
815
+ d="M18.71 5.29a.996.996 0 0 0-1.41 0l-7.29 7.29-7.3-7.29a.987.987 0 0 0-1.41-.02.987.987 0 0 0-.02 1.41l.02.02 7.65 7.65c.29.29.68.44 1.06.44s.77-.15 1.06-.44l7.65-7.65a.996.996 0 0 0 0-1.41Z"
816
+ />
817
+ </svg>
770
818
  </span>
771
819
  </span>
772
820
  <span class="pf-v6-c-button__text">Jump to section</span>