@patternfly/patternfly 6.0.0-alpha.165 → 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 (85) hide show
  1. package/components/Button/button.css +33 -14
  2. package/components/Button/button.scss +36 -14
  3. package/components/_index.css +33 -14
  4. package/docs/components/AboutModalBox/examples/AboutModalBox.md +3 -1
  5. package/docs/components/ActionList/examples/ActionList.md +60 -20
  6. package/docs/components/Alert/examples/Alert.md +106 -62
  7. package/docs/components/BackToTop/examples/BackToTop.md +5 -3
  8. package/docs/components/Banner/examples/Banner.md +9 -3
  9. package/docs/components/Button/examples/Button.md +536 -367
  10. package/docs/components/CalendarMonth/examples/CalendarMonth.md +24 -8
  11. package/docs/components/Card/examples/Card.md +43 -29
  12. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +75 -33
  13. package/docs/components/CodeBlock/examples/CodeBlock.md +18 -6
  14. package/docs/components/CodeEditor/examples/CodeEditor.md +44 -22
  15. package/docs/components/ContextSelector/deprecated/context-selector.md +6 -8
  16. package/docs/components/DataList/examples/DataList.md +121 -63
  17. package/docs/components/DatePicker/examples/DatePicker.md +18 -6
  18. package/docs/components/DescriptionList/examples/DescriptionList.md +125 -75
  19. package/docs/components/Drawer/examples/Drawer.md +57 -19
  20. package/docs/components/DualListSelector/examples/DualListSelector.md +204 -100
  21. package/docs/components/EmptyState/examples/EmptyState.md +123 -53
  22. package/docs/components/FileUpload/examples/FileUpload.md +42 -14
  23. package/docs/components/Form/examples/Form.md +53 -19
  24. package/docs/components/Hint/examples/Hint.md +9 -9
  25. package/docs/components/InlineEdit/examples/InlineEdit.md +78 -26
  26. package/docs/components/InputGroup/examples/InputGroup.md +27 -9
  27. package/docs/components/JumpLinks/examples/JumpLinks.md +188 -68
  28. package/docs/components/Label/examples/Label.md +651 -217
  29. package/docs/components/LogViewer/examples/LogViewer.md +218 -86
  30. package/docs/components/Login/examples/Login.md +346 -282
  31. package/docs/components/Masthead/examples/masthead.md +27 -9
  32. package/docs/components/Menu/examples/Menu.md +35 -25
  33. package/docs/components/MenuToggle/examples/MenuToggle.md +3 -1
  34. package/docs/components/ModalBox/examples/ModalBox.md +48 -16
  35. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +48 -16
  36. package/docs/components/Nav/examples/Navigation.md +12 -4
  37. package/docs/components/NotificationBadge/examples/NotificationBadge.md +78 -42
  38. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +6 -2
  39. package/docs/components/NumberInput/examples/NumberInput.md +96 -48
  40. package/docs/components/OverflowMenu/examples/overflow-menu.md +48 -16
  41. package/docs/components/Page/examples/Page.md +21 -7
  42. package/docs/components/Pagination/examples/Pagination.md +132 -44
  43. package/docs/components/Popover/examples/Popover.md +45 -15
  44. package/docs/components/Select/deprecated/Select.md +111 -55
  45. package/docs/components/SkipToContent/examples/SkipToContent.md +3 -1
  46. package/docs/components/Slider/examples/Slider.md +12 -4
  47. package/docs/components/Table/examples/Table.md +363 -208
  48. package/docs/components/Tabs/examples/Tabs.md +1230 -574
  49. package/docs/components/TextInputGroup/examples/TextInputGroup.md +132 -44
  50. package/docs/components/Toolbar/examples/Toolbar.md +120 -64
  51. package/docs/components/TreeView/examples/TreeView.md +12 -4
  52. package/docs/components/Wizard/examples/Wizard.md +105 -38
  53. package/docs/demos/AboutModal/examples/AboutModal.md +9 -3
  54. package/docs/demos/Alert/examples/Alert.md +39 -25
  55. package/docs/demos/BackToTop/examples/BackToTop.md +11 -5
  56. package/docs/demos/Banner/examples/Banner.md +12 -4
  57. package/docs/demos/Button/examples/Button.md +7 -7
  58. package/docs/demos/Card/examples/Card.md +106 -57
  59. package/docs/demos/CardView/examples/CardView.md +30 -13
  60. package/docs/demos/ContextSelector/examples/ContextSelector.md +24 -8
  61. package/docs/demos/Dashboard/examples/Dashboard.md +43 -28
  62. package/docs/demos/DataList/examples/DataList.md +255 -149
  63. package/docs/demos/DescriptionList/examples/DescriptionList.md +21 -7
  64. package/docs/demos/Drawer/examples/Drawer.md +89 -43
  65. package/docs/demos/Form/examples/BasicForms.md +141 -59
  66. package/docs/demos/JumpLinks/examples/JumpLinks.md +222 -109
  67. package/docs/demos/Masthead/examples/Masthead.md +63 -21
  68. package/docs/demos/Modal/examples/Modal.md +99 -37
  69. package/docs/demos/Nav/examples/Nav.md +45 -15
  70. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +58 -43
  71. package/docs/demos/Page/examples/Page.md +54 -21
  72. package/docs/demos/Page/examples/Penta.md +9 -6
  73. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +9 -3
  74. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +12 -4
  75. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +306 -133
  76. package/docs/demos/Skeleton/examples/Skeleton.md +6 -2
  77. package/docs/demos/Table/examples/Table.md +474 -210
  78. package/docs/demos/Tabs/examples/Tabs.md +60 -22
  79. package/docs/demos/Toolbar/examples/Toolbar.md +123 -72
  80. package/docs/demos/Wizard/examples/Wizard.md +179 -110
  81. package/package.json +1 -1
  82. package/patternfly-no-globals.css +33 -14
  83. package/patternfly.css +33 -14
  84. package/patternfly.min.css +1 -1
  85. package/patternfly.min.css.map +1 -1
package/docs/components/Masthead/examples/masthead.md CHANGED
@@ -14,7 +14,9 @@ cssPrefix: pf-v6-c-masthead
14
14
  type="button"
15
15
  aria-label="Global navigation"
16
16
  >
17
- <i class="fas fa-bars" aria-hidden="true"></i>
17
+ <span class="pf-v6-c-button__text">
18
+ <i class="fas fa-bars" aria-hidden="true"></i>
19
+ </span>
18
20
  </button>
19
21
  </span>
20
22
  <div class="pf-v6-c-masthead__main">
@@ -108,7 +110,9 @@ cssPrefix: pf-v6-c-masthead
108
110
  type="button"
109
111
  aria-label="Global navigation"
110
112
  >
111
- <i class="fas fa-bars" aria-hidden="true"></i>
113
+ <span class="pf-v6-c-button__text">
114
+ <i class="fas fa-bars" aria-hidden="true"></i>
115
+ </span>
112
116
  </button>
113
117
  </span>
114
118
  <div class="pf-v6-c-masthead__main">
@@ -186,9 +190,15 @@ cssPrefix: pf-v6-c-masthead
186
190
  </a>
187
191
  </div>
188
192
  <div class="pf-v6-c-masthead__content">
189
- <button class="pf-v6-c-button pf-m-primary" type="button">Primary</button>
190
- <button class="pf-v6-c-button pf-m-secondary" type="button">Secondary</button>
191
- <button class="pf-v6-c-button pf-m-tertiary" type="button">Tertiary</button>
193
+ <button class="pf-v6-c-button pf-m-primary" type="button">
194
+ <span class="pf-v6-c-button__text">Primary</span>
195
+ </button>
196
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
197
+ <span class="pf-v6-c-button__text">Secondary</span>
198
+ </button>
199
+ <button class="pf-v6-c-button pf-m-tertiary" type="button">
200
+ <span class="pf-v6-c-button__text">Tertiary</span>
201
+ </button>
192
202
  </div>
193
203
  </header>
194
204
 
@@ -207,7 +217,9 @@ cssPrefix: pf-v6-c-masthead
207
217
  type="button"
208
218
  aria-label="Global navigation"
209
219
  >
210
- <i class="fas fa-bars" aria-hidden="true"></i>
220
+ <span class="pf-v6-c-button__text">
221
+ <i class="fas fa-bars" aria-hidden="true"></i>
222
+ </span>
211
223
  </button>
212
224
  </span>
213
225
  <div class="pf-v6-c-masthead__main">
@@ -301,7 +313,9 @@ cssPrefix: pf-v6-c-masthead
301
313
  type="button"
302
314
  aria-label="Global navigation"
303
315
  >
304
- <i class="fas fa-bars" aria-hidden="true"></i>
316
+ <span class="pf-v6-c-button__text">
317
+ <i class="fas fa-bars" aria-hidden="true"></i>
318
+ </span>
305
319
  </button>
306
320
  </span>
307
321
  <div class="pf-v6-c-masthead__main">
@@ -398,7 +412,9 @@ cssPrefix: pf-v6-c-masthead
398
412
  type="button"
399
413
  aria-label="Global navigation"
400
414
  >
401
- <i class="fas fa-bars" aria-hidden="true"></i>
415
+ <span class="pf-v6-c-button__text">
416
+ <i class="fas fa-bars" aria-hidden="true"></i>
417
+ </span>
402
418
  </button>
403
419
  </span>
404
420
  <div class="pf-v6-c-masthead__main">
@@ -492,7 +508,9 @@ cssPrefix: pf-v6-c-masthead
492
508
  type="button"
493
509
  aria-label="Global navigation"
494
510
  >
495
- <i class="fas fa-bars" aria-hidden="true"></i>
511
+ <span class="pf-v6-c-button__text">
512
+ <i class="fas fa-bars" aria-hidden="true"></i>
513
+ </span>
496
514
  </button>
497
515
  </span>
498
516
  <div class="pf-v6-c-masthead__main">
package/docs/components/Menu/examples/Menu.md CHANGED
@@ -5133,7 +5133,9 @@ cssPrefix: pf-v6-c-menu
5133
5133
  </ul>
5134
5134
  </div>
5135
5135
  <div class="pf-v6-c-menu__footer">
5136
- <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">Footer</button>
5136
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
5137
+ <span class="pf-v6-c-button__text">Footer</span>
5138
+ </button>
5137
5139
  </div>
5138
5140
  </div>
5139
5141
 
@@ -5229,7 +5231,9 @@ cssPrefix: pf-v6-c-menu
5229
5231
  </ul>
5230
5232
  </div>
5231
5233
  <div class="pf-v6-c-menu__footer">
5232
- <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">Footer</button>
5234
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
5235
+ <span class="pf-v6-c-button__text">Footer</span>
5236
+ </button>
5233
5237
  </div>
5234
5238
  </div>
5235
5239
 
@@ -5506,7 +5510,9 @@ cssPrefix: pf-v6-c-menu
5506
5510
  role="menuitem"
5507
5511
  aria-label="Actions"
5508
5512
  >
5509
- <i class="fas fa-fw fa-ellipsis-v" aria-hidden="true"></i>
5513
+ <span class="pf-v6-c-button__text">
5514
+ <i class="fas fa-fw fa-ellipsis-v" aria-hidden="true"></i>
5515
+ </span>
5510
5516
  </button>
5511
5517
  </div>
5512
5518
  </li>
@@ -5530,7 +5536,9 @@ cssPrefix: pf-v6-c-menu
5530
5536
  role="menuitem"
5531
5537
  aria-label="Alert"
5532
5538
  >
5533
- <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
5539
+ <span class="pf-v6-c-button__text">
5540
+ <i class="fas fa-fw fa-bell" aria-hidden="true"></i>
5541
+ </span>
5534
5542
  </button>
5535
5543
  </div>
5536
5544
  </li>
@@ -5557,7 +5565,9 @@ cssPrefix: pf-v6-c-menu
5557
5565
  aria-label="Copy"
5558
5566
  disabled
5559
5567
  >
5560
- <i class="fas fa-fw fa-clipboard" aria-hidden="true"></i>
5568
+ <span class="pf-v6-c-button__text">
5569
+ <i class="fas fa-fw fa-clipboard" aria-hidden="true"></i>
5570
+ </span>
5561
5571
  </button>
5562
5572
  </div>
5563
5573
  </li>
@@ -5582,7 +5592,9 @@ cssPrefix: pf-v6-c-menu
5582
5592
  role="menuitem"
5583
5593
  aria-label="Expand"
5584
5594
  >
5585
- <i class="fas fa-fw fa-bars" aria-hidden="true"></i>
5595
+ <span class="pf-v6-c-button__text">
5596
+ <i class="fas fa-fw fa-bars" aria-hidden="true"></i>
5597
+ </span>
5586
5598
  </button>
5587
5599
  </div>
5588
5600
  </li>
@@ -5609,7 +5621,9 @@ cssPrefix: pf-v6-c-menu
5609
5621
  aria-label="Copy"
5610
5622
  aria-disabled="true"
5611
5623
  >
5612
- <i class="fas fa-fw fa-ellipsis-v" aria-hidden="true"></i>
5624
+ <span class="pf-v6-c-button__text">
5625
+ <i class="fas fa-fw fa-ellipsis-v" aria-hidden="true"></i>
5626
+ </span>
5613
5627
  </button>
5614
5628
  </div>
5615
5629
  </li>
@@ -5641,9 +5655,7 @@ cssPrefix: pf-v6-c-menu
5641
5655
  type="button"
5642
5656
  role="menuitem"
5643
5657
  aria-label="Starred"
5644
- >
5645
- <i class="fas fa-star" aria-hidden="true"></i>
5646
- </button>
5658
+ ></button>
5647
5659
  </div>
5648
5660
  </li>
5649
5661
  <li class="pf-v6-c-menu__list-item" role="none">
@@ -5667,9 +5679,7 @@ cssPrefix: pf-v6-c-menu
5667
5679
  type="button"
5668
5680
  role="menuitem"
5669
5681
  aria-label="Not starred"
5670
- >
5671
- <i class="fas fa-star" aria-hidden="true"></i>
5672
- </button>
5682
+ ></button>
5673
5683
  </div>
5674
5684
  </li>
5675
5685
  </ul>
@@ -5691,9 +5701,7 @@ cssPrefix: pf-v6-c-menu
5691
5701
  type="button"
5692
5702
  role="menuitem"
5693
5703
  aria-label="Not starred"
5694
- >
5695
- <i class="fas fa-star" aria-hidden="true"></i>
5696
- </button>
5704
+ ></button>
5697
5705
  </div>
5698
5706
  </li>
5699
5707
  <li class="pf-v6-c-menu__list-item pf-m-disabled" role="none">
@@ -5721,9 +5729,7 @@ cssPrefix: pf-v6-c-menu
5721
5729
  role="menuitem"
5722
5730
  aria-label="Not starred"
5723
5731
  disabled
5724
- >
5725
- <i class="fas fa-star" aria-hidden="true"></i>
5726
- </button>
5732
+ ></button>
5727
5733
  </div>
5728
5734
  </li>
5729
5735
  <li class="pf-v6-c-menu__list-item" role="none">
@@ -5747,9 +5753,7 @@ cssPrefix: pf-v6-c-menu
5747
5753
  type="button"
5748
5754
  role="menuitem"
5749
5755
  aria-label="Not starred"
5750
- >
5751
- <i class="fas fa-star" aria-hidden="true"></i>
5752
- </button>
5756
+ ></button>
5753
5757
  </div>
5754
5758
  </li>
5755
5759
  </ul>
@@ -6049,7 +6053,9 @@ cssPrefix: pf-v6-c-menu
6049
6053
  </div>
6050
6054
  <hr class="pf-v6-c-divider" />
6051
6055
  <div class="pf-v6-c-menu__footer">
6052
- <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">Action</button>
6056
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
6057
+ <span class="pf-v6-c-button__text">Action</span>
6058
+ </button>
6053
6059
  </div>
6054
6060
  </div>
6055
6061
 
@@ -6197,7 +6203,9 @@ cssPrefix: pf-v6-c-menu
6197
6203
  </div>
6198
6204
  <hr class="pf-v6-c-divider" />
6199
6205
  <div class="pf-v6-c-menu__footer">
6200
- <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">Footer</button>
6206
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
6207
+ <span class="pf-v6-c-button__text">Footer</span>
6208
+ </button>
6201
6209
  </div>
6202
6210
  </div>
6203
6211
 
@@ -6293,7 +6301,9 @@ cssPrefix: pf-v6-c-menu
6293
6301
  </ul>
6294
6302
  </div>
6295
6303
  <div class="pf-v6-c-menu__footer">
6296
- <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">Footer</button>
6304
+ <button class="pf-v6-c-button pf-m-link pf-m-inline" type="button">
6305
+ <span class="pf-v6-c-button__text">Footer</span>
6306
+ </button>
6297
6307
  </div>
6298
6308
  </div>
6299
6309
 
package/docs/components/MenuToggle/examples/MenuToggle.md CHANGED
@@ -1103,7 +1103,9 @@ cssPrefix: pf-v6-c-menu-toggle
1103
1103
  type="button"
1104
1104
  aria-label="Clear input"
1105
1105
  >
1106
- <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1106
+ <span class="pf-v6-c-button__text">
1107
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1108
+ </span>
1107
1109
  </button>
1108
1110
  </div>
1109
1111
  </div>
package/docs/components/ModalBox/examples/ModalBox.md CHANGED
@@ -18,7 +18,9 @@ cssPrefix: pf-v6-c-modal-box
18
18
  >
19
19
  <div class="pf-v6-c-modal-box__close">
20
20
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
21
- <i class="fas fa-times" aria-hidden="true"></i>
21
+ <span class="pf-v6-c-button__text">
22
+ <i class="fas fa-times" aria-hidden="true"></i>
23
+ </span>
22
24
  </button>
23
25
  </div>
24
26
  <header class="pf-v6-c-modal-box__header">
@@ -45,7 +47,9 @@ cssPrefix: pf-v6-c-modal-box
45
47
  >
46
48
  <div class="pf-v6-c-modal-box__close">
47
49
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
48
- <i class="fas fa-times" aria-hidden="true"></i>
50
+ <span class="pf-v6-c-button__text">
51
+ <i class="fas fa-times" aria-hidden="true"></i>
52
+ </span>
49
53
  </button>
50
54
  </div>
51
55
  <header class="pf-v6-c-modal-box__header pf-m-help">
@@ -61,7 +65,9 @@ cssPrefix: pf-v6-c-modal-box
61
65
  </div>
62
66
  <div class="pf-v6-c-modal-box__header-help">
63
67
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Help">
64
- <i class="pf-v6-pficon pf-v6-pficon-help" aria-hidden="true"></i>
68
+ <span class="pf-v6-c-button__text">
69
+ <i class="pf-v6-pficon pf-v6-pficon-help" aria-hidden="true"></i>
70
+ </span>
65
71
  </button>
66
72
  </div>
67
73
  </header>
@@ -85,7 +91,9 @@ cssPrefix: pf-v6-c-modal-box
85
91
  >
86
92
  <div class="pf-v6-c-modal-box__close">
87
93
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
88
- <i class="fas fa-times" aria-hidden="true"></i>
94
+ <span class="pf-v6-c-button__text">
95
+ <i class="fas fa-times" aria-hidden="true"></i>
96
+ </span>
89
97
  </button>
90
98
  </div>
91
99
  <header class="pf-v6-c-modal-box__header">
@@ -114,7 +122,9 @@ cssPrefix: pf-v6-c-modal-box
114
122
  >
115
123
  <div class="pf-v6-c-modal-box__close">
116
124
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
117
- <i class="fas fa-times" aria-hidden="true"></i>
125
+ <span class="pf-v6-c-button__text">
126
+ <i class="fas fa-times" aria-hidden="true"></i>
127
+ </span>
118
128
  </button>
119
129
  </div>
120
130
  <header class="pf-v6-c-modal-box__header">
@@ -143,7 +153,9 @@ cssPrefix: pf-v6-c-modal-box
143
153
  >
144
154
  <div class="pf-v6-c-modal-box__close">
145
155
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
146
- <i class="fas fa-times" aria-hidden="true"></i>
156
+ <span class="pf-v6-c-button__text">
157
+ <i class="fas fa-times" aria-hidden="true"></i>
158
+ </span>
147
159
  </button>
148
160
  </div>
149
161
  <header class="pf-v6-c-modal-box__header">
@@ -172,7 +184,9 @@ cssPrefix: pf-v6-c-modal-box
172
184
  >
173
185
  <div class="pf-v6-c-modal-box__close">
174
186
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
175
- <i class="fas fa-times" aria-hidden="true"></i>
187
+ <span class="pf-v6-c-button__text">
188
+ <i class="fas fa-times" aria-hidden="true"></i>
189
+ </span>
176
190
  </button>
177
191
  </div>
178
192
  <div class="pf-v6-c-modal-box__body">
@@ -197,7 +211,9 @@ cssPrefix: pf-v6-c-modal-box
197
211
  >
198
212
  <div class="pf-v6-c-modal-box__close">
199
213
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
200
- <i class="fas fa-times" aria-hidden="true"></i>
214
+ <span class="pf-v6-c-button__text">
215
+ <i class="fas fa-times" aria-hidden="true"></i>
216
+ </span>
201
217
  </button>
202
218
  </div>
203
219
  <header class="pf-v6-c-modal-box__header">
@@ -230,7 +246,9 @@ cssPrefix: pf-v6-c-modal-box
230
246
  >
231
247
  <div class="pf-v6-c-modal-box__close">
232
248
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
233
- <i class="fas fa-times" aria-hidden="true"></i>
249
+ <span class="pf-v6-c-button__text">
250
+ <i class="fas fa-times" aria-hidden="true"></i>
251
+ </span>
234
252
  </button>
235
253
  </div>
236
254
  <header class="pf-v6-c-modal-box__header">
@@ -273,7 +291,9 @@ cssPrefix: pf-v6-c-modal-box
273
291
  >
274
292
  <div class="pf-v6-c-modal-box__close">
275
293
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
276
- <i class="fas fa-times" aria-hidden="true"></i>
294
+ <span class="pf-v6-c-button__text">
295
+ <i class="fas fa-times" aria-hidden="true"></i>
296
+ </span>
277
297
  </button>
278
298
  </div>
279
299
  <header class="pf-v6-c-modal-box__header">
@@ -302,7 +322,9 @@ cssPrefix: pf-v6-c-modal-box
302
322
  >
303
323
  <div class="pf-v6-c-modal-box__close">
304
324
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
305
- <i class="fas fa-times" aria-hidden="true"></i>
325
+ <span class="pf-v6-c-button__text">
326
+ <i class="fas fa-times" aria-hidden="true"></i>
327
+ </span>
306
328
  </button>
307
329
  </div>
308
330
  <header class="pf-v6-c-modal-box__header">
@@ -338,7 +360,9 @@ cssPrefix: pf-v6-c-modal-box
338
360
  >
339
361
  <div class="pf-v6-c-modal-box__close">
340
362
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
341
- <i class="fas fa-times" aria-hidden="true"></i>
363
+ <span class="pf-v6-c-button__text">
364
+ <i class="fas fa-times" aria-hidden="true"></i>
365
+ </span>
342
366
  </button>
343
367
  </div>
344
368
  <header class="pf-v6-c-modal-box__header">
@@ -374,7 +398,9 @@ cssPrefix: pf-v6-c-modal-box
374
398
  >
375
399
  <div class="pf-v6-c-modal-box__close">
376
400
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
377
- <i class="fas fa-times" aria-hidden="true"></i>
401
+ <span class="pf-v6-c-button__text">
402
+ <i class="fas fa-times" aria-hidden="true"></i>
403
+ </span>
378
404
  </button>
379
405
  </div>
380
406
  <header class="pf-v6-c-modal-box__header">
@@ -410,7 +436,9 @@ cssPrefix: pf-v6-c-modal-box
410
436
  >
411
437
  <div class="pf-v6-c-modal-box__close">
412
438
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
413
- <i class="fas fa-times" aria-hidden="true"></i>
439
+ <span class="pf-v6-c-button__text">
440
+ <i class="fas fa-times" aria-hidden="true"></i>
441
+ </span>
414
442
  </button>
415
443
  </div>
416
444
  <header class="pf-v6-c-modal-box__header">
@@ -446,7 +474,9 @@ cssPrefix: pf-v6-c-modal-box
446
474
  >
447
475
  <div class="pf-v6-c-modal-box__close">
448
476
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
449
- <i class="fas fa-times" aria-hidden="true"></i>
477
+ <span class="pf-v6-c-button__text">
478
+ <i class="fas fa-times" aria-hidden="true"></i>
479
+ </span>
450
480
  </button>
451
481
  </div>
452
482
  <header class="pf-v6-c-modal-box__header">
@@ -484,7 +514,9 @@ The status modifier classes can be applied directly to the modal title element,
484
514
  >
485
515
  <div class="pf-v6-c-modal-box__close">
486
516
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
487
- <i class="fas fa-times" aria-hidden="true"></i>
517
+ <span class="pf-v6-c-button__text">
518
+ <i class="fas fa-times" aria-hidden="true"></i>
519
+ </span>
488
520
  </button>
489
521
  </div>
490
522
  <header class="pf-v6-c-modal-box__header">
package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md CHANGED
@@ -20,7 +20,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
20
20
  </div>
21
21
  </div>
22
22
  <div class="pf-v6-c-multiple-file-upload__upload">
23
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
23
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
24
+ <span class="pf-v6-c-button__text">Upload</span>
25
+ </button>
24
26
  </div>
25
27
  <div
26
28
  class="pf-v6-c-multiple-file-upload__info"
@@ -45,7 +47,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
45
47
  </div>
46
48
  </div>
47
49
  <div class="pf-v6-c-multiple-file-upload__upload">
48
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
50
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
51
+ <span class="pf-v6-c-button__text">Upload</span>
52
+ </button>
49
53
  </div>
50
54
  <div
51
55
  class="pf-v6-c-multiple-file-upload__info"
@@ -70,7 +74,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
70
74
  </div>
71
75
  </div>
72
76
  <div class="pf-v6-c-multiple-file-upload__upload">
73
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
77
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
78
+ <span class="pf-v6-c-button__text">Upload</span>
79
+ </button>
74
80
  </div>
75
81
  <div
76
82
  class="pf-v6-c-multiple-file-upload__info"
@@ -95,7 +101,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
95
101
  </div>
96
102
  </div>
97
103
  <div class="pf-v6-c-multiple-file-upload__upload">
98
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
104
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
105
+ <span class="pf-v6-c-button__text">Upload</span>
106
+ </button>
99
107
  </div>
100
108
  <div
101
109
  class="pf-v6-c-multiple-file-upload__info"
@@ -120,7 +128,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
120
128
  </div>
121
129
  </div>
122
130
  <div class="pf-v6-c-multiple-file-upload__upload">
123
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
131
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
132
+ <span class="pf-v6-c-button__text">Upload</span>
133
+ </button>
124
134
  </div>
125
135
  <div
126
136
  class="pf-v6-c-multiple-file-upload__info"
@@ -194,7 +204,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
194
204
  type="button"
195
205
  aria-label="Remove from list"
196
206
  >
197
- <i class="fas fa-times" aria-hidden="true"></i>
207
+ <span class="pf-v6-c-button__text">
208
+ <i class="fas fa-times" aria-hidden="true"></i>
209
+ </span>
198
210
  </button>
199
211
  </div>
200
212
  </li>
@@ -243,7 +255,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
243
255
  type="button"
244
256
  aria-label="Remove from list"
245
257
  >
246
- <i class="fas fa-times" aria-hidden="true"></i>
258
+ <span class="pf-v6-c-button__text">
259
+ <i class="fas fa-times" aria-hidden="true"></i>
260
+ </span>
247
261
  </button>
248
262
  </div>
249
263
  </li>
@@ -292,7 +306,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
292
306
  type="button"
293
307
  aria-label="Remove from list"
294
308
  >
295
- <i class="fas fa-times" aria-hidden="true"></i>
309
+ <span class="pf-v6-c-button__text">
310
+ <i class="fas fa-times" aria-hidden="true"></i>
311
+ </span>
296
312
  </button>
297
313
  </div>
298
314
  </li>
@@ -319,7 +335,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
319
335
  </div>
320
336
  </div>
321
337
  <div class="pf-v6-c-multiple-file-upload__upload">
322
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
338
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
339
+ <span class="pf-v6-c-button__text">Upload</span>
340
+ </button>
323
341
  </div>
324
342
  <div
325
343
  class="pf-v6-c-multiple-file-upload__info"
@@ -393,7 +411,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
393
411
  type="button"
394
412
  aria-label="Remove from list"
395
413
  >
396
- <i class="fas fa-times" aria-hidden="true"></i>
414
+ <span class="pf-v6-c-button__text">
415
+ <i class="fas fa-times" aria-hidden="true"></i>
416
+ </span>
397
417
  </button>
398
418
  </div>
399
419
  </li>
@@ -442,7 +462,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
442
462
  type="button"
443
463
  aria-label="Remove from list"
444
464
  >
445
- <i class="fas fa-times" aria-hidden="true"></i>
465
+ <span class="pf-v6-c-button__text">
466
+ <i class="fas fa-times" aria-hidden="true"></i>
467
+ </span>
446
468
  </button>
447
469
  </div>
448
470
  </li>
@@ -491,7 +513,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
491
513
  type="button"
492
514
  aria-label="Remove from list"
493
515
  >
494
- <i class="fas fa-times" aria-hidden="true"></i>
516
+ <span class="pf-v6-c-button__text">
517
+ <i class="fas fa-times" aria-hidden="true"></i>
518
+ </span>
495
519
  </button>
496
520
  </div>
497
521
  </li>
@@ -518,7 +542,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
518
542
  </div>
519
543
  </div>
520
544
  <div class="pf-v6-c-multiple-file-upload__upload">
521
- <button class="pf-v6-c-button pf-m-secondary" type="button">Upload</button>
545
+ <button class="pf-v6-c-button pf-m-secondary" type="button">
546
+ <span class="pf-v6-c-button__text">Upload</span>
547
+ </button>
522
548
  </div>
523
549
  <div
524
550
  class="pf-v6-c-multiple-file-upload__info"
@@ -592,7 +618,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
592
618
  type="button"
593
619
  aria-label="Remove from list"
594
620
  >
595
- <i class="fas fa-times" aria-hidden="true"></i>
621
+ <span class="pf-v6-c-button__text">
622
+ <i class="fas fa-times" aria-hidden="true"></i>
623
+ </span>
596
624
  </button>
597
625
  </div>
598
626
  </li>
@@ -641,7 +669,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
641
669
  type="button"
642
670
  aria-label="Remove from list"
643
671
  >
644
- <i class="fas fa-times" aria-hidden="true"></i>
672
+ <span class="pf-v6-c-button__text">
673
+ <i class="fas fa-times" aria-hidden="true"></i>
674
+ </span>
645
675
  </button>
646
676
  </div>
647
677
  </li>
@@ -690,7 +720,9 @@ cssPrefix: pf-v6-c-multiple-file-upload
690
720
  type="button"
691
721
  aria-label="Remove from list"
692
722
  >
693
- <i class="fas fa-times" aria-hidden="true"></i>
723
+ <span class="pf-v6-c-button__text">
724
+ <i class="fas fa-times" aria-hidden="true"></i>
725
+ </span>
694
726
  </button>
695
727
  </div>
696
728
  </li>
package/docs/components/Nav/examples/Navigation.md CHANGED
@@ -580,7 +580,9 @@ cssPrefix: pf-v6-c-nav
580
580
  aria-label="Scroll start"
581
581
  disabled
582
582
  >
583
- <i class="fas fa-angle-left" aria-hidden="true"></i>
583
+ <span class="pf-v6-c-button__text">
584
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
585
+ </span>
584
586
  </button>
585
587
  </div>
586
588
  <ul class="pf-v6-c-nav__list" role="list">
@@ -616,7 +618,9 @@ cssPrefix: pf-v6-c-nav
616
618
  type="button"
617
619
  aria-label="Scroll end"
618
620
  >
619
- <i class="fas fa-angle-right" aria-hidden="true"></i>
621
+ <span class="pf-v6-c-button__text">
622
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
623
+ </span>
620
624
  </button>
621
625
  </div>
622
626
  </nav>
@@ -662,7 +666,9 @@ cssPrefix: pf-v6-c-nav
662
666
  aria-label="Scroll start"
663
667
  disabled
664
668
  >
665
- <i class="fas fa-angle-left" aria-hidden="true"></i>
669
+ <span class="pf-v6-c-button__text">
670
+ <i class="fas fa-angle-left" aria-hidden="true"></i>
671
+ </span>
666
672
  </button>
667
673
  </div>
668
674
  <ul class="pf-v6-c-nav__list" role="list">
@@ -698,7 +704,9 @@ cssPrefix: pf-v6-c-nav
698
704
  type="button"
699
705
  aria-label="Scroll end"
700
706
  >
701
- <i class="fas fa-angle-right" aria-hidden="true"></i>
707
+ <span class="pf-v6-c-button__text">
708
+ <i class="fas fa-angle-right" aria-hidden="true"></i>
709
+ </span>
702
710
  </button>
703
711
  </div>
704
712
  </nav>