@patternfly/patternfly 6.0.0-alpha.164 → 6.0.0-alpha.166

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 (89) hide show
  1. package/components/Button/button.css +33 -14
  2. package/components/Button/button.scss +36 -14
  3. package/components/Panel/panel.css +17 -14
  4. package/components/Panel/panel.scss +17 -14
  5. package/components/_index.css +50 -28
  6. package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
  7. package/docs/components/ActionList/examples/ActionList.md +60 -20
  8. package/docs/components/Alert/examples/Alert.md +106 -62
  9. package/docs/components/BackToTop/examples/BackToTop.md +5 -3
  10. package/docs/components/Banner/examples/Banner.md +9 -3
  11. package/docs/components/Button/examples/Button.md +536 -367
  12. package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
  13. package/docs/components/Card/examples/Card.md +43 -29
  14. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +75 -33
  15. package/docs/components/CodeBlock/examples/CodeBlock.md +18 -6
  16. package/docs/components/CodeEditor/examples/CodeEditor.md +44 -22
  17. package/docs/components/ContextSelector/deprecated/context-selector.md +6 -8
  18. package/docs/components/DataList/examples/DataList.md +121 -63
  19. package/docs/components/DatePicker/examples/DatePicker.md +18 -6
  20. package/docs/components/DescriptionList/examples/DescriptionList.md +125 -75
  21. package/docs/components/Drawer/examples/Drawer.md +57 -19
  22. package/docs/components/DualListSelector/examples/DualListSelector.md +204 -100
  23. package/docs/components/EmptyState/examples/EmptyState.md +123 -53
  24. package/docs/components/FileUpload/examples/FileUpload.md +42 -14
  25. package/docs/components/Form/examples/Form.md +53 -19
  26. package/docs/components/Hint/examples/Hint.md +9 -9
  27. package/docs/components/InlineEdit/examples/InlineEdit.md +78 -26
  28. package/docs/components/InputGroup/examples/InputGroup.md +27 -9
  29. package/docs/components/JumpLinks/examples/JumpLinks.md +188 -68
  30. package/docs/components/Label/examples/Label.md +651 -217
  31. package/docs/components/LogViewer/examples/LogViewer.md +218 -86
  32. package/docs/components/Login/examples/Login.md +346 -282
  33. package/docs/components/Masthead/examples/masthead.md +27 -9
  34. package/docs/components/Menu/examples/Menu.md +35 -25
  35. package/docs/components/MenuToggle/examples/MenuToggle.md +3 -1
  36. package/docs/components/ModalBox/examples/ModalBox.md +48 -16
  37. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +48 -16
  38. package/docs/components/Nav/examples/Navigation.md +12 -4
  39. package/docs/components/NotificationBadge/examples/NotificationBadge.md +78 -42
  40. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +6 -2
  41. package/docs/components/NumberInput/examples/NumberInput.md +96 -48
  42. package/docs/components/OverflowMenu/examples/overflow-menu.md +48 -16
  43. package/docs/components/Page/examples/Page.md +21 -7
  44. package/docs/components/Pagination/examples/Pagination.md +132 -44
  45. package/docs/components/Panel/examples/Panel.md +1 -0
  46. package/docs/components/Popover/examples/Popover.md +45 -15
  47. package/docs/components/Select/deprecated/Select.md +111 -55
  48. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
  49. package/docs/components/Slider/examples/Slider.md +12 -4
  50. package/docs/components/Table/examples/Table.md +363 -208
  51. package/docs/components/Tabs/examples/Tabs.md +1230 -574
  52. package/docs/components/TextInputGroup/examples/TextInputGroup.md +132 -44
  53. package/docs/components/Toolbar/examples/Toolbar.md +120 -64
  54. package/docs/components/TreeView/examples/TreeView.md +12 -4
  55. package/docs/components/Wizard/examples/Wizard.md +105 -38
  56. package/docs/demos/AboutModal/examples/AboutModal.md +9 -3
  57. package/docs/demos/Alert/examples/Alert.md +39 -25
  58. package/docs/demos/BackToTop/examples/BackToTop.md +11 -5
  59. package/docs/demos/Banner/examples/Banner.md +12 -4
  60. package/docs/demos/Button/examples/Button.md +7 -7
  61. package/docs/demos/Card/examples/Card.md +106 -57
  62. package/docs/demos/CardView/examples/CardView.md +30 -13
  63. package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -8
  64. package/docs/demos/Dashboard/examples/Dashboard.md +43 -28
  65. package/docs/demos/DataList/examples/DataList.md +255 -149
  66. package/docs/demos/DescriptionList/examples/DescriptionList.md +21 -7
  67. package/docs/demos/Drawer/examples/Drawer.md +89 -43
  68. package/docs/demos/Form/examples/BasicForms.md +141 -59
  69. package/docs/demos/JumpLinks/examples/JumpLinks.md +222 -109
  70. package/docs/demos/Masthead/examples/Masthead.md +63 -21
  71. package/docs/demos/Modal/examples/Modal.md +99 -37
  72. package/docs/demos/Nav/examples/Nav.md +45 -15
  73. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +58 -43
  74. package/docs/demos/Page/examples/Page.md +54 -21
  75. package/docs/demos/Page/examples/Penta.md +9 -6
  76. package/docs/demos/Panel/Panel.md +88 -0
  77. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
  78. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +12 -4
  79. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +306 -133
  80. package/docs/demos/Skeleton/examples/Skeleton.md +6 -2
  81. package/docs/demos/Table/examples/Table.md +474 -210
  82. package/docs/demos/Tabs/examples/Tabs.md +60 -22
  83. package/docs/demos/Toolbar/examples/Toolbar.md +123 -72
  84. package/docs/demos/Wizard/examples/Wizard.md +179 -110
  85. package/package.json +1 -1
  86. package/patternfly-no-globals.css +50 -28
  87. package/patternfly.css +50 -28
  88. package/patternfly.min.css +1 -1
  89. package/patternfly.min.css.map +1 -1
package/docs/demos/Tabs/examples/Tabs.md CHANGED
@@ -11,7 +11,9 @@ section: components
11
11
  <a
12
12
  class="pf-v6-c-button pf-m-primary"
13
13
  href="#main-content-tabs-tables-and-tabs-example"
14
- >Skip to content</a>
14
+ >
15
+ <span class="pf-v6-c-button__text">Skip to content</span>
16
+ </a>
15
17
  </div>
16
18
  <header class="pf-v6-c-masthead" id="tabs-tables-and-tabs-example-masthead">
17
19
  <span class="pf-v6-c-masthead__toggle">
@@ -20,7 +22,9 @@ section: components
20
22
  type="button"
21
23
  aria-label="Global navigation"
22
24
  >
23
- <i class="fas fa-bars" aria-hidden="true"></i>
25
+ <span class="pf-v6-c-button__text">
26
+ <i class="fas fa-bars" aria-hidden="true"></i>
27
+ </span>
24
28
  </button>
25
29
  </span>
26
30
  <div class="pf-v6-c-masthead__main">
@@ -600,7 +604,9 @@ section: components
600
604
  <a
601
605
  class="pf-v6-c-button pf-m-primary"
602
606
  href="#main-content-tabs-tables-and-tabs-example"
603
- >Skip to content</a>
607
+ >
608
+ <span class="pf-v6-c-button__text">Skip to content</span>
609
+ </a>
604
610
  </div>
605
611
  <header class="pf-v6-c-masthead" id="tabs-tables-and-tabs-example-masthead">
606
612
  <span class="pf-v6-c-masthead__toggle">
@@ -609,7 +615,9 @@ section: components
609
615
  type="button"
610
616
  aria-label="Global navigation"
611
617
  >
612
- <i class="fas fa-bars" aria-hidden="true"></i>
618
+ <span class="pf-v6-c-button__text">
619
+ <i class="fas fa-bars" aria-hidden="true"></i>
620
+ </span>
613
621
  </button>
614
622
  </span>
615
623
  <div class="pf-v6-c-masthead__main">
@@ -1192,7 +1200,9 @@ section: components
1192
1200
  <a
1193
1201
  class="pf-v6-c-button pf-m-primary"
1194
1202
  href="#main-content-nested-tabs-example"
1195
- >Skip to content</a>
1203
+ >
1204
+ <span class="pf-v6-c-button__text">Skip to content</span>
1205
+ </a>
1196
1206
  </div>
1197
1207
  <header class="pf-v6-c-masthead" id="nested-tabs-example-masthead">
1198
1208
  <span class="pf-v6-c-masthead__toggle">
@@ -1201,7 +1211,9 @@ section: components
1201
1211
  type="button"
1202
1212
  aria-label="Global navigation"
1203
1213
  >
1204
- <i class="fas fa-bars" aria-hidden="true"></i>
1214
+ <span class="pf-v6-c-button__text">
1215
+ <i class="fas fa-bars" aria-hidden="true"></i>
1216
+ </span>
1205
1217
  </button>
1206
1218
  </span>
1207
1219
  <div class="pf-v6-c-masthead__main">
@@ -1701,7 +1713,9 @@ section: components
1701
1713
  <a
1702
1714
  class="pf-v6-c-button pf-m-primary"
1703
1715
  href="#main-content-table-tabs-example"
1704
- >Skip to content</a>
1716
+ >
1717
+ <span class="pf-v6-c-button__text">Skip to content</span>
1718
+ </a>
1705
1719
  </div>
1706
1720
  <header class="pf-v6-c-masthead" id="table-tabs-example-masthead">
1707
1721
  <span class="pf-v6-c-masthead__toggle">
@@ -1710,7 +1724,9 @@ section: components
1710
1724
  type="button"
1711
1725
  aria-label="Global navigation"
1712
1726
  >
1713
- <i class="fas fa-bars" aria-hidden="true"></i>
1727
+ <span class="pf-v6-c-button__text">
1728
+ <i class="fas fa-bars" aria-hidden="true"></i>
1729
+ </span>
1714
1730
  </button>
1715
1731
  </span>
1716
1732
  <div class="pf-v6-c-masthead__main">
@@ -2116,10 +2132,12 @@ section: components
2116
2132
  type="button"
2117
2133
  aria-label="Sort"
2118
2134
  >
2119
- <i
2120
- class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2121
- aria-hidden="true"
2122
- ></i>
2135
+ <span class="pf-v6-c-button__text">
2136
+ <i
2137
+ class="fas fa-sort-amount-down pf-v6-m-mirror-inline-rtl"
2138
+ aria-hidden="true"
2139
+ ></i>
2140
+ </span>
2123
2141
  </button>
2124
2142
  </div>
2125
2143
 
@@ -2135,14 +2153,18 @@ section: components
2135
2153
  <button
2136
2154
  class="pf-v6-c-button pf-m-primary"
2137
2155
  type="button"
2138
- >Generate</button>
2156
+ >
2157
+ <span class="pf-v6-c-button__text">Generate</span>
2158
+ </button>
2139
2159
  </div>
2140
2160
 
2141
2161
  <div class="pf-v6-c-overflow-menu__item">
2142
2162
  <button
2143
2163
  class="pf-v6-c-button pf-m-secondary"
2144
2164
  type="button"
2145
- >Deploy</button>
2165
+ >
2166
+ <span class="pf-v6-c-button__text">Deploy</span>
2167
+ </button>
2146
2168
  </div>
2147
2169
  </div>
2148
2170
  </div>
@@ -2732,7 +2754,9 @@ section: components
2732
2754
  type="button"
2733
2755
  aria-label="Close drawer panel"
2734
2756
  >
2735
- <i class="fas fa-times" aria-hidden="true"></i>
2757
+ <span class="pf-v6-c-button__text">
2758
+ <i class="fas fa-times" aria-hidden="true"></i>
2759
+ </span>
2736
2760
  </button>
2737
2761
  </div>
2738
2762
  </div>
@@ -2761,7 +2785,9 @@ section: components
2761
2785
  type="button"
2762
2786
  aria-label="Scroll left"
2763
2787
  >
2764
- <i class="fas fa-angle-left" aria-hidden="true"></i>
2788
+ <span class="pf-v6-c-button__text">
2789
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
2790
+ </span>
2765
2791
  </button>
2766
2792
  </div>
2767
2793
  <ul class="pf-v6-c-tabs__list" role="tablist">
@@ -2797,7 +2823,9 @@ section: components
2797
2823
  type="button"
2798
2824
  aria-label="Scroll right"
2799
2825
  >
2800
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2826
+ <span class="pf-v6-c-button__text">
2827
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
2828
+ </span>
2801
2829
  </button>
2802
2830
  </div>
2803
2831
  </div>
@@ -2968,7 +2996,9 @@ section: components
2968
2996
  type="button"
2969
2997
  aria-label="Close"
2970
2998
  >
2971
- <i class="fas fa-times" aria-hidden="true"></i>
2999
+ <span class="pf-v6-c-button__text">
3000
+ <i class="fas fa-times" aria-hidden="true"></i>
3001
+ </span>
2972
3002
  </button>
2973
3003
  </div>
2974
3004
  <header class="pf-v6-c-modal-box__header">
@@ -3060,7 +3090,9 @@ section: components
3060
3090
  <a
3061
3091
  class="pf-v6-c-button pf-m-primary"
3062
3092
  href="#main-content-modal-tabs-example"
3063
- >Skip to content</a>
3093
+ >
3094
+ <span class="pf-v6-c-button__text">Skip to content</span>
3095
+ </a>
3064
3096
  </div>
3065
3097
  <header class="pf-v6-c-masthead" id="modal-tabs-example-masthead">
3066
3098
  <span class="pf-v6-c-masthead__toggle">
@@ -3069,7 +3101,9 @@ section: components
3069
3101
  type="button"
3070
3102
  aria-label="Global navigation"
3071
3103
  >
3072
- <i class="fas fa-bars" aria-hidden="true"></i>
3104
+ <span class="pf-v6-c-button__text">
3105
+ <i class="fas fa-bars" aria-hidden="true"></i>
3106
+ </span>
3073
3107
  </button>
3074
3108
  </span>
3075
3109
  <div class="pf-v6-c-masthead__main">
@@ -3388,7 +3422,9 @@ section: components
3388
3422
  <a
3389
3423
  class="pf-v6-c-button pf-m-primary"
3390
3424
  href="#main-content-gray-tabs-example"
3391
- >Skip to content</a>
3425
+ >
3426
+ <span class="pf-v6-c-button__text">Skip to content</span>
3427
+ </a>
3392
3428
  </div>
3393
3429
  <header class="pf-v6-c-masthead" id="gray-tabs-example-masthead">
3394
3430
  <span class="pf-v6-c-masthead__toggle">
@@ -3397,7 +3433,9 @@ section: components
3397
3433
  type="button"
3398
3434
  aria-label="Global navigation"
3399
3435
  >
3400
- <i class="fas fa-bars" aria-hidden="true"></i>
3436
+ <span class="pf-v6-c-button__text">
3437
+ <i class="fas fa-bars" aria-hidden="true"></i>
3438
+ </span>
3401
3439
  </button>
3402
3440
  </span>
3403
3441
  <div class="pf-v6-c-masthead__main">
package/docs/demos/Toolbar/examples/Toolbar.md CHANGED
@@ -81,16 +81,14 @@ section: components
81
81
  <div class="pf-v6-c-overflow-menu__content">
82
82
  <div class="pf-v6-c-overflow-menu__group pf-m-button-group">
83
83
  <div class="pf-v6-c-overflow-menu__item">
84
- <button
85
- class="pf-v6-c-button pf-m-primary"
86
- type="button"
87
- >Primary</button>
84
+ <button class="pf-v6-c-button pf-m-primary" type="button">
85
+ <span class="pf-v6-c-button__text">Primary</span>
86
+ </button>
88
87
  </div>
89
88
  <div class="pf-v6-c-overflow-menu__item">
90
- <button
91
- class="pf-v6-c-button pf-m-secondary"
92
- type="button"
93
- >Secondary</button>
89
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
90
+ <span class="pf-v6-c-button__text">Secondary</span>
91
+ </button>
94
92
  </div>
95
93
  </div>
96
94
  </div>
@@ -144,7 +142,9 @@ section: components
144
142
  disabled
145
143
  aria-label="Go to previous page"
146
144
  >
147
- <i class="fas fa-angle-left" aria-hidden="true"></i>
145
+ <span class="pf-v6-c-button__text">
146
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
147
+ </span>
148
148
  </button>
149
149
  </div>
150
150
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -153,7 +153,9 @@ section: components
153
153
  type="button"
154
154
  aria-label="Go to next page"
155
155
  >
156
- <i class="fas fa-angle-right" aria-hidden="true"></i>
156
+ <span class="pf-v6-c-button__text">
157
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
158
+ </span>
157
159
  </button>
158
160
  </div>
159
161
  </nav>
@@ -179,7 +181,9 @@ section: components
179
181
  <a
180
182
  class="pf-v6-c-button pf-m-primary"
181
183
  href="#main-content-toolbar-pagination-management-example"
182
- >Skip to content</a>
184
+ >
185
+ <span class="pf-v6-c-button__text">Skip to content</span>
186
+ </a>
183
187
  </div>
184
188
  <header
185
189
  class="pf-v6-c-masthead"
@@ -191,7 +195,9 @@ section: components
191
195
  type="button"
192
196
  aria-label="Global navigation"
193
197
  >
194
- <i class="fas fa-bars" aria-hidden="true"></i>
198
+ <span class="pf-v6-c-button__text">
199
+ <i class="fas fa-bars" aria-hidden="true"></i>
200
+ </span>
195
201
  </button>
196
202
  </span>
197
203
  <div class="pf-v6-c-masthead__main">
@@ -525,10 +531,12 @@ section: components
525
531
  type="button"
526
532
  aria-label="Toggle date picker"
527
533
  >
528
- <i
529
- class="fas fa-calendar-alt"
530
- aria-hidden="true"
531
- ></i>
534
+ <span class="pf-v6-c-button__text">
535
+ <i
536
+ class="fas fa-calendar-alt"
537
+ aria-hidden="true"
538
+ ></i>
539
+ </span>
532
540
  </button>
533
541
  </div>
534
542
  </div>
@@ -576,10 +584,12 @@ section: components
576
584
  type="button"
577
585
  aria-label="Toggle date picker"
578
586
  >
579
- <i
580
- class="fas fa-calendar-alt"
581
- aria-hidden="true"
582
- ></i>
587
+ <span class="pf-v6-c-button__text">
588
+ <i
589
+ class="fas fa-calendar-alt"
590
+ aria-hidden="true"
591
+ ></i>
592
+ </span>
583
593
  </button>
584
594
  </div>
585
595
  <div class="pf-v6-c-date-picker__helper-text"></div>
@@ -643,10 +653,9 @@ section: components
643
653
  </div>
644
654
  </div>
645
655
  </div>
646
- <button
647
- class="pf-v6-c-button pf-m-primary"
648
- type="button"
649
- >Download</button>
656
+ <button class="pf-v6-c-button pf-m-primary" type="button">
657
+ <span class="pf-v6-c-button__text">Download</span>
658
+ </button>
650
659
  </div>
651
660
  <div
652
661
  class="pf-v6-c-toolbar__expandable-content pf-m-hidden"
@@ -1209,7 +1218,9 @@ section: components
1209
1218
  disabled
1210
1219
  aria-label="Go to previous page"
1211
1220
  >
1212
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1221
+ <span class="pf-v6-c-button__text">
1222
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
1223
+ </span>
1213
1224
  </button>
1214
1225
  </div>
1215
1226
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -1218,7 +1229,9 @@ section: components
1218
1229
  type="button"
1219
1230
  aria-label="Go to next page"
1220
1231
  >
1221
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1232
+ <span class="pf-v6-c-button__text">
1233
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1234
+ </span>
1222
1235
  </button>
1223
1236
  </div>
1224
1237
  </nav>
@@ -1347,16 +1360,14 @@ section: components
1347
1360
  <div class="pf-v6-c-overflow-menu__content">
1348
1361
  <div class="pf-v6-c-overflow-menu__group pf-m-button-group">
1349
1362
  <div class="pf-v6-c-overflow-menu__item">
1350
- <button
1351
- class="pf-v6-c-button pf-m-primary"
1352
- type="button"
1353
- >Primary</button>
1363
+ <button class="pf-v6-c-button pf-m-primary" type="button">
1364
+ <span class="pf-v6-c-button__text">Primary</span>
1365
+ </button>
1354
1366
  </div>
1355
1367
  <div class="pf-v6-c-overflow-menu__item">
1356
- <button
1357
- class="pf-v6-c-button pf-m-secondary"
1358
- type="button"
1359
- >Secondary</button>
1368
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
1369
+ <span class="pf-v6-c-button__text">Secondary</span>
1370
+ </button>
1360
1371
  </div>
1361
1372
  </div>
1362
1373
  </div>
@@ -1410,7 +1421,9 @@ section: components
1410
1421
  disabled
1411
1422
  aria-label="Go to previous page"
1412
1423
  >
1413
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1424
+ <span class="pf-v6-c-button__text">
1425
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
1426
+ </span>
1414
1427
  </button>
1415
1428
  </div>
1416
1429
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -1419,7 +1432,9 @@ section: components
1419
1432
  type="button"
1420
1433
  aria-label="Go to next page"
1421
1434
  >
1422
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1435
+ <span class="pf-v6-c-button__text">
1436
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1437
+ </span>
1423
1438
  </button>
1424
1439
  </div>
1425
1440
  </nav>
@@ -1515,7 +1530,9 @@ section: components
1515
1530
  disabled
1516
1531
  aria-label="Go to previous page"
1517
1532
  >
1518
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1533
+ <span class="pf-v6-c-button__text">
1534
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
1535
+ </span>
1519
1536
  </button>
1520
1537
  </div>
1521
1538
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -1524,7 +1541,9 @@ section: components
1524
1541
  type="button"
1525
1542
  aria-label="Go to next page"
1526
1543
  >
1527
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1544
+ <span class="pf-v6-c-button__text">
1545
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1546
+ </span>
1528
1547
  </button>
1529
1548
  </div>
1530
1549
  </nav>
@@ -1644,16 +1663,14 @@ section: components
1644
1663
  <div class="pf-v6-c-overflow-menu__content">
1645
1664
  <div class="pf-v6-c-overflow-menu__group pf-m-button-group">
1646
1665
  <div class="pf-v6-c-overflow-menu__item">
1647
- <button
1648
- class="pf-v6-c-button pf-m-primary"
1649
- type="button"
1650
- >Primary</button>
1666
+ <button class="pf-v6-c-button pf-m-primary" type="button">
1667
+ <span class="pf-v6-c-button__text">Primary</span>
1668
+ </button>
1651
1669
  </div>
1652
1670
  <div class="pf-v6-c-overflow-menu__item">
1653
- <button
1654
- class="pf-v6-c-button pf-m-secondary"
1655
- type="button"
1656
- >Secondary</button>
1671
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
1672
+ <span class="pf-v6-c-button__text">Secondary</span>
1673
+ </button>
1657
1674
  </div>
1658
1675
  </div>
1659
1676
  </div>
@@ -1707,7 +1724,9 @@ section: components
1707
1724
  disabled
1708
1725
  aria-label="Go to previous page"
1709
1726
  >
1710
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1727
+ <span class="pf-v6-c-button__text">
1728
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
1729
+ </span>
1711
1730
  </button>
1712
1731
  </div>
1713
1732
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -1716,7 +1735,9 @@ section: components
1716
1735
  type="button"
1717
1736
  aria-label="Go to next page"
1718
1737
  >
1719
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1738
+ <span class="pf-v6-c-button__text">
1739
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1740
+ </span>
1720
1741
  </button>
1721
1742
  </div>
1722
1743
  </nav>
@@ -1761,7 +1782,9 @@ section: components
1761
1782
  aria-label="Remove"
1762
1783
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-label-groupremove-label-one"
1763
1784
  >
1764
- <i class="fas fa-times" aria-hidden="true"></i>
1785
+ <span class="pf-v6-c-button__text">
1786
+ <i class="fas fa-times" aria-hidden="true"></i>
1787
+ </span>
1765
1788
  </button>
1766
1789
  </span>
1767
1790
  </span>
@@ -1784,7 +1807,9 @@ section: components
1784
1807
  aria-label="Remove"
1785
1808
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-label-groupremove-label-two"
1786
1809
  >
1787
- <i class="fas fa-times" aria-hidden="true"></i>
1810
+ <span class="pf-v6-c-button__text">
1811
+ <i class="fas fa-times" aria-hidden="true"></i>
1812
+ </span>
1788
1813
  </button>
1789
1814
  </span>
1790
1815
  </span>
@@ -1807,7 +1832,9 @@ section: components
1807
1832
  aria-label="Remove"
1808
1833
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-desktop-example-label-groupremove-label-three"
1809
1834
  >
1810
- <i class="fas fa-times" aria-hidden="true"></i>
1835
+ <span class="pf-v6-c-button__text">
1836
+ <i class="fas fa-times" aria-hidden="true"></i>
1837
+ </span>
1811
1838
  </button>
1812
1839
  </span>
1813
1840
  </span>
@@ -1818,10 +1845,9 @@ section: components
1818
1845
  </div>
1819
1846
  </div>
1820
1847
  <div class="pf-v6-c-toolbar__item">
1821
- <button
1822
- class="pf-v6-c-button pf-m-link pf-m-inline"
1823
- type="button"
1824
- >Clear all filters</button>
1848
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
1849
+ <span class="pf-v6-c-button__text">Clear all filters</span>
1850
+ </button>
1825
1851
  </div>
1826
1852
  </div>
1827
1853
  </div>
@@ -1906,7 +1932,9 @@ section: components
1906
1932
  disabled
1907
1933
  aria-label="Go to previous page"
1908
1934
  >
1909
- <i class="fas fa-angle-left" aria-hidden="true"></i>
1935
+ <span class="pf-v6-c-button__text">
1936
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
1937
+ </span>
1910
1938
  </button>
1911
1939
  </div>
1912
1940
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -1915,7 +1943,9 @@ section: components
1915
1943
  type="button"
1916
1944
  aria-label="Go to next page"
1917
1945
  >
1918
- <i class="fas fa-angle-right" aria-hidden="true"></i>
1946
+ <span class="pf-v6-c-button__text">
1947
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
1948
+ </span>
1919
1949
  </button>
1920
1950
  </div>
1921
1951
  </nav>
@@ -1991,7 +2021,9 @@ section: components
1991
2021
  aria-label="Remove"
1992
2022
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-label-groupremove-label-one"
1993
2023
  >
1994
- <i class="fas fa-times" aria-hidden="true"></i>
2024
+ <span class="pf-v6-c-button__text">
2025
+ <i class="fas fa-times" aria-hidden="true"></i>
2026
+ </span>
1995
2027
  </button>
1996
2028
  </span>
1997
2029
  </span>
@@ -2014,7 +2046,9 @@ section: components
2014
2046
  aria-label="Remove"
2015
2047
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-label-groupremove-label-two"
2016
2048
  >
2017
- <i class="fas fa-times" aria-hidden="true"></i>
2049
+ <span class="pf-v6-c-button__text">
2050
+ <i class="fas fa-times" aria-hidden="true"></i>
2051
+ </span>
2018
2052
  </button>
2019
2053
  </span>
2020
2054
  </span>
@@ -2037,7 +2071,9 @@ section: components
2037
2071
  aria-label="Remove"
2038
2072
  id="toolbar-attribute-value-checkbox-menu-toggle-filter-mobile-example-label-groupremove-label-three"
2039
2073
  >
2040
- <i class="fas fa-times" aria-hidden="true"></i>
2074
+ <span class="pf-v6-c-button__text">
2075
+ <i class="fas fa-times" aria-hidden="true"></i>
2076
+ </span>
2041
2077
  </button>
2042
2078
  </span>
2043
2079
  </span>
@@ -2049,10 +2085,9 @@ section: components
2049
2085
  </div>
2050
2086
  </div>
2051
2087
  <div class="pf-v6-c-toolbar__item">
2052
- <button
2053
- class="pf-v6-c-button pf-m-link pf-m-inline"
2054
- type="button"
2055
- >Clear all filters</button>
2088
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
2089
+ <span class="pf-v6-c-button__text">Clear all filters</span>
2090
+ </button>
2056
2091
  </div>
2057
2092
  </div>
2058
2093
  </div>
@@ -2068,7 +2103,9 @@ section: components
2068
2103
  <a
2069
2104
  class="pf-v6-c-button pf-m-primary"
2070
2105
  href="#main-content-toolbar-pagination-management-example"
2071
- >Skip to content</a>
2106
+ >
2107
+ <span class="pf-v6-c-button__text">Skip to content</span>
2108
+ </a>
2072
2109
  </div>
2073
2110
  <header
2074
2111
  class="pf-v6-c-masthead"
@@ -2080,7 +2117,9 @@ section: components
2080
2117
  type="button"
2081
2118
  aria-label="Global navigation"
2082
2119
  >
2083
- <i class="fas fa-bars" aria-hidden="true"></i>
2120
+ <span class="pf-v6-c-button__text">
2121
+ <i class="fas fa-bars" aria-hidden="true"></i>
2122
+ </span>
2084
2123
  </button>
2085
2124
  </span>
2086
2125
  <div class="pf-v6-c-masthead__main">
@@ -2470,7 +2509,9 @@ section: components
2470
2509
  disabled
2471
2510
  aria-label="Go to previous page"
2472
2511
  >
2473
- <i class="fas fa-angle-left" aria-hidden="true"></i>
2512
+ <span class="pf-v6-c-button__text">
2513
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
2514
+ </span>
2474
2515
  </button>
2475
2516
  </div>
2476
2517
  <div class="pf-v6-c-pagination__nav-control pf-m-next">
@@ -2479,7 +2520,9 @@ section: components
2479
2520
  type="button"
2480
2521
  aria-label="Go to next page"
2481
2522
  >
2482
- <i class="fas fa-angle-right" aria-hidden="true"></i>
2523
+ <span class="pf-v6-c-button__text">
2524
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
2525
+ </span>
2483
2526
  </button>
2484
2527
  </div>
2485
2528
  </nav>
@@ -2999,7 +3042,9 @@ section: components
2999
3042
  disabled
3000
3043
  aria-label="Go to first page"
3001
3044
  >
3002
- <i class="fas fa-angle-double-left" aria-hidden="true"></i>
3045
+ <span class="pf-v6-c-button__text">
3046
+ <i class="fas fa-angle-double-left" aria-hidden="true"></i>
3047
+ </span>
3003
3048
  </button>
3004
3049
  </div>
3005
3050
  <div class="pf-v6-c-pagination__nav-control pf-m-prev">
@@ -3009,7 +3054,9 @@ section: components
3009
3054
  disabled
3010
3055
  aria-label="Go to previous page"
3011
3056
  >
3012
- <i class="fas fa-angle-left" aria-hidden="true"></i>
3057
+ <span class="pf-v6-c-button__text">
3058
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
3059
+ </span>
3013
3060
  </button>
3014
3061
  </div>
3015
3062
  <div class="pf-v6-c-pagination__nav-page-select">
@@ -3030,7 +3077,9 @@ section: components
3030
3077
  type="button"
3031
3078
  aria-label="Go to next page"
3032
3079
  >
3033
- <i class="fas fa-angle-right" aria-hidden="true"></i>
3080
+ <span class="pf-v6-c-button__text">
3081
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
3082
+ </span>
3034
3083
  </button>
3035
3084
  </div>
3036
3085
  <div class="pf-v6-c-pagination__nav-control pf-m-last">
@@ -3039,7 +3088,9 @@ section: components
3039
3088
  type="button"
3040
3089
  aria-label="Go to last page"
3041
3090
  >
3042
- <i class="fas fa-angle-double-right" aria-hidden="true"></i>
3091
+ <span class="pf-v6-c-button__text">
3092
+ <i class="fas fa-angle-double-right" aria-hidden="true"></i>
3093
+ </span>
3043
3094
  </button>
3044
3095
  </div>
3045
3096
  </nav>