@patternfly/patternfly 6.0.0-alpha.174 → 6.0.0-alpha.175

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 (91) hide show
  1. package/components/Button/button.css +5 -1
  2. package/components/Button/button.scss +5 -1
  3. package/components/Card/card.css +2 -2
  4. package/components/Card/card.scss +1 -1
  5. package/components/ClipboardCopy/clipboard-copy.css +2 -2
  6. package/components/ClipboardCopy/clipboard-copy.scss +2 -2
  7. package/components/JumpLinks/jump-links.css +0 -7
  8. package/components/JumpLinks/jump-links.scss +0 -9
  9. package/components/Label/label.css +2 -2
  10. package/components/Label/label.scss +2 -2
  11. package/components/NumberInput/number-input.css +0 -1
  12. package/components/NumberInput/number-input.scss +0 -1
  13. package/components/Tabs/tabs.css +1 -18
  14. package/components/Tabs/tabs.scss +1 -18
  15. package/components/_index.css +12 -33
  16. package/docs/components/AboutModalBox/examples/AboutModalBox.md +1 -1
  17. package/docs/components/ActionList/examples/ActionList.md +7 -7
  18. package/docs/components/Alert/examples/Alert.md +44 -46
  19. package/docs/components/BackToTop/examples/BackToTop.md +3 -5
  20. package/docs/components/Banner/examples/Banner.md +1 -1
  21. package/docs/components/Button/examples/Button.md +35 -35
  22. package/docs/components/CalendarMonth/examples/CalendarMonth.md +8 -8
  23. package/docs/components/Card/examples/Card.md +36 -20
  24. package/docs/components/ClipboardCopy/examples/ClipboardCopy.md +32 -29
  25. package/docs/components/CodeBlock/examples/CodeBlock.md +6 -6
  26. package/docs/components/CodeEditor/examples/CodeEditor.md +18 -21
  27. package/docs/components/DataList/examples/DataList.md +17 -17
  28. package/docs/components/DatePicker/examples/DatePicker.md +6 -6
  29. package/docs/components/DescriptionList/examples/DescriptionList.md +100 -150
  30. package/docs/components/Drawer/examples/Drawer.md +19 -19
  31. package/docs/components/DualListSelector/examples/DualListSelector.md +84 -84
  32. package/docs/components/EmptyState/examples/EmptyState.md +6 -6
  33. package/docs/components/Form/examples/Form.md +18 -19
  34. package/docs/components/Hint/examples/Hint.md +2 -2
  35. package/docs/components/InlineEdit/examples/InlineEdit.md +24 -24
  36. package/docs/components/InputGroup/examples/InputGroup.md +2 -2
  37. package/docs/components/JumpLinks/examples/JumpLinks.md +8 -8
  38. package/docs/components/Label/examples/Label.md +217 -217
  39. package/docs/components/LogViewer/examples/LogViewer.md +77 -97
  40. package/docs/components/Login/examples/Login.md +37 -32
  41. package/docs/components/Masthead/examples/masthead.md +6 -6
  42. package/docs/components/Menu/examples/Menu.md +10 -10
  43. package/docs/components/MenuToggle/examples/MenuToggle.md +1 -1
  44. package/docs/components/ModalBox/examples/ModalBox.md +17 -17
  45. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +9 -9
  46. package/docs/components/Nav/examples/Navigation.md +4 -4
  47. package/docs/components/NotificationDrawer/examples/NotificationDrawer.md +2 -2
  48. package/docs/components/NumberInput/examples/NumberInput.md +24 -24
  49. package/docs/components/OverflowMenu/examples/overflow-menu.md +6 -6
  50. package/docs/components/Page/examples/Page.md +7 -7
  51. package/docs/components/Pagination/examples/Pagination.md +53 -44
  52. package/docs/components/Popover/examples/Popover.md +30 -15
  53. package/docs/components/Slider/examples/Slider.md +8 -8
  54. package/docs/components/Table/examples/Table.md +433 -203
  55. package/docs/components/Tabs/examples/Tabs.md +364 -358
  56. package/docs/components/TextInputGroup/examples/TextInputGroup.md +364 -404
  57. package/docs/components/Toolbar/examples/Toolbar.md +59 -59
  58. package/docs/components/TreeView/examples/TreeView.md +4 -4
  59. package/docs/components/Wizard/examples/Wizard.md +10 -10
  60. package/docs/demos/AboutModal/examples/AboutModal.md +2 -2
  61. package/docs/demos/Alert/examples/Alert.md +6 -6
  62. package/docs/demos/BackToTop/examples/BackToTop.md +4 -6
  63. package/docs/demos/Banner/examples/Banner.md +2 -2
  64. package/docs/demos/Button/examples/Button.md +1 -1
  65. package/docs/demos/Card/examples/Card.md +54 -79
  66. package/docs/demos/CardView/examples/CardView.md +8 -7
  67. package/docs/demos/Dashboard/examples/Dashboard.md +25 -37
  68. package/docs/demos/DataList/examples/DataList.md +38 -34
  69. package/docs/demos/DescriptionList/examples/DescriptionList.md +4 -4
  70. package/docs/demos/Drawer/examples/Drawer.md +8 -8
  71. package/docs/demos/Form/examples/BasicForms.md +69 -86
  72. package/docs/demos/JumpLinks/examples/JumpLinks.md +14 -20
  73. package/docs/demos/Masthead/examples/Masthead.md +13 -13
  74. package/docs/demos/Modal/examples/Modal.md +15 -15
  75. package/docs/demos/Nav/examples/Nav.md +9 -9
  76. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +5 -5
  77. package/docs/demos/Page/examples/Page.md +9 -9
  78. package/docs/demos/Page/examples/Penta.md +2 -2
  79. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +3 -3
  80. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +4 -4
  81. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +35 -35
  82. package/docs/demos/Skeleton/examples/Skeleton.md +1 -1
  83. package/docs/demos/Table/examples/Table.md +132 -115
  84. package/docs/demos/Tabs/examples/Tabs.md +11 -11
  85. package/docs/demos/Toolbar/examples/Toolbar.md +37 -36
  86. package/docs/demos/Wizard/examples/Wizard.md +22 -23
  87. package/package.json +1 -1
  88. package/patternfly-no-globals.css +12 -33
  89. package/patternfly.css +12 -33
  90. package/patternfly.min.css +1 -1
  91. package/patternfly.min.css.map +1 -1
@@ -88,7 +88,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
88
88
  type="button"
89
89
  aria-label="Clear input"
90
90
  >
91
- <span class="pf-v6-c-button__text">
91
+ <span class="pf-v6-c-button__icon">
92
92
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
93
93
  </span>
94
94
  </button>
@@ -112,150 +112,138 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
112
112
  <li class="pf-v6-c-label-group__list-item">
113
113
  <span class="pf-v6-c-label pf-m-outline">
114
114
  <span class="pf-v6-c-label__content">
115
- <span class="pf-v6-c-label__content">
116
- <span
117
- class="pf-v6-c-label__text"
118
- id="text-input-group-filters-label-group-label_one_select_collapsed"
119
- >Label one</span>
120
- </span>
121
- <span class="pf-v6-c-label__actions">
122
- <button
123
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
124
- type="button"
125
- aria-labelledby="text-input-group-filters-label-group-remove_label_one_select_collapsed text-input-group-filters-label-group-label_one_select_collapsed"
126
- aria-label="Remove"
127
- id="text-input-group-filters-label-group-remove_label_one_select_collapsed"
128
- >
129
- <span class="pf-v6-c-button__text">
130
- <i class="fas fa-times" aria-hidden="true"></i>
131
- </span>
132
- </button>
133
- </span>
115
+ <span
116
+ class="pf-v6-c-label__text"
117
+ id="text-input-group-filters-label-group-label-one-text"
118
+ >Label one</span>
119
+ </span>
120
+ <span class="pf-v6-c-label__actions">
121
+ <button
122
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
123
+ type="button"
124
+ id="text-input-group-filters-label-group-label-one-button"
125
+ aria-label="Remove"
126
+ aria-labelledby="text-input-group-filters-label-group-label-one-button text-input-group-filters-label-group-label-one-text"
127
+ >
128
+ <span class="pf-v6-c-button__icon">
129
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
130
+ </span>
131
+ </button>
134
132
  </span>
135
133
  </span>
136
134
  </li>
137
135
  <li class="pf-v6-c-label-group__list-item">
138
136
  <span class="pf-v6-c-label pf-m-outline">
139
137
  <span class="pf-v6-c-label__content">
140
- <span class="pf-v6-c-label__content">
141
- <span
142
- class="pf-v6-c-label__text"
143
- id="text-input-group-filters-label-group-label_two_select_collapsed"
144
- >Label two</span>
145
- </span>
146
- <span class="pf-v6-c-label__actions">
147
- <button
148
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
149
- type="button"
150
- aria-labelledby="text-input-group-filters-label-group-remove_label_two_select_collapsed text-input-group-filters-label-group-label_two_select_collapsed"
151
- aria-label="Remove"
152
- id="text-input-group-filters-label-group-remove_label_two_select_collapsed"
153
- >
154
- <span class="pf-v6-c-button__text">
155
- <i class="fas fa-times" aria-hidden="true"></i>
156
- </span>
157
- </button>
158
- </span>
138
+ <span
139
+ class="pf-v6-c-label__text"
140
+ id="text-input-group-filters-label-group-label-two-text"
141
+ >Label two</span>
142
+ </span>
143
+ <span class="pf-v6-c-label__actions">
144
+ <button
145
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
146
+ type="button"
147
+ id="text-input-group-filters-label-group-label-two-button"
148
+ aria-label="Remove"
149
+ aria-labelledby="text-input-group-filters-label-group-label-two-button text-input-group-filters-label-group-label-two-text"
150
+ >
151
+ <span class="pf-v6-c-button__icon">
152
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
153
+ </span>
154
+ </button>
159
155
  </span>
160
156
  </span>
161
157
  </li>
162
158
  <li class="pf-v6-c-label-group__list-item">
163
159
  <span class="pf-v6-c-label pf-m-outline">
164
160
  <span class="pf-v6-c-label__content">
165
- <span class="pf-v6-c-label__content">
166
- <span
167
- class="pf-v6-c-label__text"
168
- id="text-input-group-filters-label-group-label_three_select_collapsed"
169
- >Label three</span>
170
- </span>
171
- <span class="pf-v6-c-label__actions">
172
- <button
173
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
174
- type="button"
175
- aria-labelledby="text-input-group-filters-label-group-remove_label_three_select_collapsed text-input-group-filters-label-group-label_three_select_collapsed"
176
- aria-label="Remove"
177
- id="text-input-group-filters-label-group-remove_label_three_select_collapsed"
178
- >
179
- <span class="pf-v6-c-button__text">
180
- <i class="fas fa-times" aria-hidden="true"></i>
181
- </span>
182
- </button>
183
- </span>
161
+ <span
162
+ class="pf-v6-c-label__text"
163
+ id="text-input-group-filters-label-group-label-three-text"
164
+ >Label three</span>
165
+ </span>
166
+ <span class="pf-v6-c-label__actions">
167
+ <button
168
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
169
+ type="button"
170
+ id="text-input-group-filters-label-group-label-three-button"
171
+ aria-label="Remove"
172
+ aria-labelledby="text-input-group-filters-label-group-label-three-button text-input-group-filters-label-group-label-three-text"
173
+ >
174
+ <span class="pf-v6-c-button__icon">
175
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
176
+ </span>
177
+ </button>
184
178
  </span>
185
179
  </span>
186
180
  </li>
187
181
  <li class="pf-v6-c-label-group__list-item">
188
182
  <span class="pf-v6-c-label pf-m-outline">
189
183
  <span class="pf-v6-c-label__content">
190
- <span class="pf-v6-c-label__content">
191
- <span
192
- class="pf-v6-c-label__text"
193
- id="text-input-group-filters-label-group-label_four_select_collapsed"
194
- >Label four</span>
195
- </span>
196
- <span class="pf-v6-c-label__actions">
197
- <button
198
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
199
- type="button"
200
- aria-labelledby="text-input-group-filters-label-group-remove_label_four_select_collapsed text-input-group-filters-label-group-label_four_select_collapsed"
201
- aria-label="Remove"
202
- id="text-input-group-filters-label-group-remove_label_four_select_collapsed"
203
- >
204
- <span class="pf-v6-c-button__text">
205
- <i class="fas fa-times" aria-hidden="true"></i>
206
- </span>
207
- </button>
208
- </span>
184
+ <span
185
+ class="pf-v6-c-label__text"
186
+ id="text-input-group-filters-label-group-label-four-text"
187
+ >Label four</span>
188
+ </span>
189
+ <span class="pf-v6-c-label__actions">
190
+ <button
191
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
192
+ type="button"
193
+ id="text-input-group-filters-label-group-label-four-button"
194
+ aria-label="Remove"
195
+ aria-labelledby="text-input-group-filters-label-group-label-four-button text-input-group-filters-label-group-label-four-text"
196
+ >
197
+ <span class="pf-v6-c-button__icon">
198
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
199
+ </span>
200
+ </button>
209
201
  </span>
210
202
  </span>
211
203
  </li>
212
204
  <li class="pf-v6-c-label-group__list-item">
213
205
  <span class="pf-v6-c-label pf-m-outline">
214
206
  <span class="pf-v6-c-label__content">
215
- <span class="pf-v6-c-label__content">
216
- <span
217
- class="pf-v6-c-label__text"
218
- id="text-input-group-filters-label-group-label_five_select_collapsed"
219
- >Label five</span>
220
- </span>
221
- <span class="pf-v6-c-label__actions">
222
- <button
223
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
224
- type="button"
225
- aria-labelledby="text-input-group-filters-label-group-remove_label_five_select_collapsed text-input-group-filters-label-group-label_five_select_collapsed"
226
- aria-label="Remove"
227
- id="text-input-group-filters-label-group-remove_label_five_select_collapsed"
228
- >
229
- <span class="pf-v6-c-button__text">
230
- <i class="fas fa-times" aria-hidden="true"></i>
231
- </span>
232
- </button>
233
- </span>
207
+ <span
208
+ class="pf-v6-c-label__text"
209
+ id="text-input-group-filters-label-group-label-five-text"
210
+ >Label five</span>
211
+ </span>
212
+ <span class="pf-v6-c-label__actions">
213
+ <button
214
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
215
+ type="button"
216
+ id="text-input-group-filters-label-group-label-five-button"
217
+ aria-label="Remove"
218
+ aria-labelledby="text-input-group-filters-label-group-label-five-button text-input-group-filters-label-group-label-five-text"
219
+ >
220
+ <span class="pf-v6-c-button__icon">
221
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
222
+ </span>
223
+ </button>
234
224
  </span>
235
225
  </span>
236
226
  </li>
237
227
  <li class="pf-v6-c-label-group__list-item">
238
228
  <span class="pf-v6-c-label pf-m-outline">
239
229
  <span class="pf-v6-c-label__content">
240
- <span class="pf-v6-c-label__content">
241
- <span
242
- class="pf-v6-c-label__text"
243
- id="text-input-group-filters-label-group-label_six_select_collapsed"
244
- >Label six</span>
245
- </span>
246
- <span class="pf-v6-c-label__actions">
247
- <button
248
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
249
- type="button"
250
- aria-labelledby="text-input-group-filters-label-group-remove_label_six_select_collapsed text-input-group-filters-label-group-label_six_select_collapsed"
251
- aria-label="Remove"
252
- id="text-input-group-filters-label-group-remove_label_six_select_collapsed"
253
- >
254
- <span class="pf-v6-c-button__text">
255
- <i class="fas fa-times" aria-hidden="true"></i>
256
- </span>
257
- </button>
258
- </span>
230
+ <span
231
+ class="pf-v6-c-label__text"
232
+ id="text-input-group-filters-label-group-label-six-text"
233
+ >Label six</span>
234
+ </span>
235
+ <span class="pf-v6-c-label__actions">
236
+ <button
237
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
238
+ type="button"
239
+ id="text-input-group-filters-label-group-label-six-button"
240
+ aria-label="Remove"
241
+ aria-labelledby="text-input-group-filters-label-group-label-six-button text-input-group-filters-label-group-label-six-text"
242
+ >
243
+ <span class="pf-v6-c-button__icon">
244
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
245
+ </span>
246
+ </button>
259
247
  </span>
260
248
  </span>
261
249
  </li>
@@ -286,7 +274,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
286
274
  type="button"
287
275
  aria-label="Clear input"
288
276
  >
289
- <span class="pf-v6-c-button__text">
277
+ <span class="pf-v6-c-button__icon">
290
278
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
291
279
  </span>
292
280
  </button>
@@ -310,350 +298,322 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
310
298
  <li class="pf-v6-c-label-group__list-item">
311
299
  <span class="pf-v6-c-label pf-m-outline">
312
300
  <span class="pf-v6-c-label__content">
313
- <span class="pf-v6-c-label__content">
314
- <span
315
- class="pf-v6-c-label__text"
316
- id="text-input-group-filters-expanded-label-group-label_one_select_collapsed"
317
- >Label one</span>
318
- </span>
319
- <span class="pf-v6-c-label__actions">
320
- <button
321
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
322
- type="button"
323
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_one_select_collapsed text-input-group-filters-expanded-label-group-label_one_select_collapsed"
324
- aria-label="Remove"
325
- id="text-input-group-filters-expanded-label-group-remove_label_one_select_collapsed"
326
- >
327
- <span class="pf-v6-c-button__text">
328
- <i class="fas fa-times" aria-hidden="true"></i>
329
- </span>
330
- </button>
331
- </span>
301
+ <span
302
+ class="pf-v6-c-label__text"
303
+ id="text-input-group-filters-expanded-label-group-label-one-text"
304
+ >Label one</span>
305
+ </span>
306
+ <span class="pf-v6-c-label__actions">
307
+ <button
308
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
309
+ type="button"
310
+ id="text-input-group-filters-expanded-label-group-label-one-button"
311
+ aria-label="Remove"
312
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-one-button text-input-group-filters-expanded-label-group-label-one-text"
313
+ >
314
+ <span class="pf-v6-c-button__icon">
315
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
316
+ </span>
317
+ </button>
332
318
  </span>
333
319
  </span>
334
320
  </li>
335
321
  <li class="pf-v6-c-label-group__list-item">
336
322
  <span class="pf-v6-c-label pf-m-outline">
337
323
  <span class="pf-v6-c-label__content">
338
- <span class="pf-v6-c-label__content">
339
- <span
340
- class="pf-v6-c-label__text"
341
- id="text-input-group-filters-expanded-label-group-label_two_select_collapsed"
342
- >Label two</span>
343
- </span>
344
- <span class="pf-v6-c-label__actions">
345
- <button
346
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
347
- type="button"
348
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_two_select_collapsed text-input-group-filters-expanded-label-group-label_two_select_collapsed"
349
- aria-label="Remove"
350
- id="text-input-group-filters-expanded-label-group-remove_label_two_select_collapsed"
351
- >
352
- <span class="pf-v6-c-button__text">
353
- <i class="fas fa-times" aria-hidden="true"></i>
354
- </span>
355
- </button>
356
- </span>
324
+ <span
325
+ class="pf-v6-c-label__text"
326
+ id="text-input-group-filters-expanded-label-group-label-two-text"
327
+ >Label two</span>
328
+ </span>
329
+ <span class="pf-v6-c-label__actions">
330
+ <button
331
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
332
+ type="button"
333
+ id="text-input-group-filters-expanded-label-group-label-two-button"
334
+ aria-label="Remove"
335
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-two-button text-input-group-filters-expanded-label-group-label-two-text"
336
+ >
337
+ <span class="pf-v6-c-button__icon">
338
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
339
+ </span>
340
+ </button>
357
341
  </span>
358
342
  </span>
359
343
  </li>
360
344
  <li class="pf-v6-c-label-group__list-item">
361
345
  <span class="pf-v6-c-label pf-m-outline">
362
346
  <span class="pf-v6-c-label__content">
363
- <span class="pf-v6-c-label__content">
364
- <span
365
- class="pf-v6-c-label__text"
366
- id="text-input-group-filters-expanded-label-group-label_three_select_collapsed"
367
- >Label three</span>
368
- </span>
369
- <span class="pf-v6-c-label__actions">
370
- <button
371
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
372
- type="button"
373
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_three_select_collapsed text-input-group-filters-expanded-label-group-label_three_select_collapsed"
374
- aria-label="Remove"
375
- id="text-input-group-filters-expanded-label-group-remove_label_three_select_collapsed"
376
- >
377
- <span class="pf-v6-c-button__text">
378
- <i class="fas fa-times" aria-hidden="true"></i>
379
- </span>
380
- </button>
381
- </span>
347
+ <span
348
+ class="pf-v6-c-label__text"
349
+ id="text-input-group-filters-expanded-label-group-label-three-text"
350
+ >Label three</span>
351
+ </span>
352
+ <span class="pf-v6-c-label__actions">
353
+ <button
354
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
355
+ type="button"
356
+ id="text-input-group-filters-expanded-label-group-label-three-button"
357
+ aria-label="Remove"
358
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-three-button text-input-group-filters-expanded-label-group-label-three-text"
359
+ >
360
+ <span class="pf-v6-c-button__icon">
361
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
362
+ </span>
363
+ </button>
382
364
  </span>
383
365
  </span>
384
366
  </li>
385
367
  <li class="pf-v6-c-label-group__list-item">
386
368
  <span class="pf-v6-c-label pf-m-outline">
387
369
  <span class="pf-v6-c-label__content">
388
- <span class="pf-v6-c-label__content">
389
- <span
390
- class="pf-v6-c-label__text"
391
- id="text-input-group-filters-expanded-label-group-label_four_select_collapsed"
392
- >Label four</span>
393
- </span>
394
- <span class="pf-v6-c-label__actions">
395
- <button
396
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
397
- type="button"
398
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_four_select_collapsed text-input-group-filters-expanded-label-group-label_four_select_collapsed"
399
- aria-label="Remove"
400
- id="text-input-group-filters-expanded-label-group-remove_label_four_select_collapsed"
401
- >
402
- <span class="pf-v6-c-button__text">
403
- <i class="fas fa-times" aria-hidden="true"></i>
404
- </span>
405
- </button>
406
- </span>
370
+ <span
371
+ class="pf-v6-c-label__text"
372
+ id="text-input-group-filters-expanded-label-group-label-four-text"
373
+ >Label four</span>
374
+ </span>
375
+ <span class="pf-v6-c-label__actions">
376
+ <button
377
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
378
+ type="button"
379
+ id="text-input-group-filters-expanded-label-group-label-four-button"
380
+ aria-label="Remove"
381
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-four-button text-input-group-filters-expanded-label-group-label-four-text"
382
+ >
383
+ <span class="pf-v6-c-button__icon">
384
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
385
+ </span>
386
+ </button>
407
387
  </span>
408
388
  </span>
409
389
  </li>
410
390
  <li class="pf-v6-c-label-group__list-item">
411
391
  <span class="pf-v6-c-label pf-m-outline">
412
392
  <span class="pf-v6-c-label__content">
413
- <span class="pf-v6-c-label__content">
414
- <span
415
- class="pf-v6-c-label__text"
416
- id="text-input-group-filters-expanded-label-group-label_five_select_collapsed"
417
- >Label five</span>
418
- </span>
419
- <span class="pf-v6-c-label__actions">
420
- <button
421
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
422
- type="button"
423
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_five_select_collapsed text-input-group-filters-expanded-label-group-label_five_select_collapsed"
424
- aria-label="Remove"
425
- id="text-input-group-filters-expanded-label-group-remove_label_five_select_collapsed"
426
- >
427
- <span class="pf-v6-c-button__text">
428
- <i class="fas fa-times" aria-hidden="true"></i>
429
- </span>
430
- </button>
431
- </span>
393
+ <span
394
+ class="pf-v6-c-label__text"
395
+ id="text-input-group-filters-expanded-label-group-label-five-text"
396
+ >Label five</span>
397
+ </span>
398
+ <span class="pf-v6-c-label__actions">
399
+ <button
400
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
401
+ type="button"
402
+ id="text-input-group-filters-expanded-label-group-label-five-button"
403
+ aria-label="Remove"
404
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-five-button text-input-group-filters-expanded-label-group-label-five-text"
405
+ >
406
+ <span class="pf-v6-c-button__icon">
407
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
408
+ </span>
409
+ </button>
432
410
  </span>
433
411
  </span>
434
412
  </li>
435
413
  <li class="pf-v6-c-label-group__list-item">
436
414
  <span class="pf-v6-c-label pf-m-outline">
437
415
  <span class="pf-v6-c-label__content">
438
- <span class="pf-v6-c-label__content">
439
- <span
440
- class="pf-v6-c-label__text"
441
- id="text-input-group-filters-expanded-label-group-label_six_select_collapsed"
442
- >Label six</span>
443
- </span>
444
- <span class="pf-v6-c-label__actions">
445
- <button
446
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
447
- type="button"
448
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_six_select_collapsed text-input-group-filters-expanded-label-group-label_six_select_collapsed"
449
- aria-label="Remove"
450
- id="text-input-group-filters-expanded-label-group-remove_label_six_select_collapsed"
451
- >
452
- <span class="pf-v6-c-button__text">
453
- <i class="fas fa-times" aria-hidden="true"></i>
454
- </span>
455
- </button>
456
- </span>
416
+ <span
417
+ class="pf-v6-c-label__text"
418
+ id="text-input-group-filters-expanded-label-group-label-six-text"
419
+ >Label six</span>
420
+ </span>
421
+ <span class="pf-v6-c-label__actions">
422
+ <button
423
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
424
+ type="button"
425
+ id="text-input-group-filters-expanded-label-group-label-six-button"
426
+ aria-label="Remove"
427
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-six-button text-input-group-filters-expanded-label-group-label-six-text"
428
+ >
429
+ <span class="pf-v6-c-button__icon">
430
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
431
+ </span>
432
+ </button>
457
433
  </span>
458
434
  </span>
459
435
  </li>
460
436
  <li class="pf-v6-c-label-group__list-item">
461
437
  <span class="pf-v6-c-label pf-m-outline">
462
438
  <span class="pf-v6-c-label__content">
463
- <span class="pf-v6-c-label__content">
464
- <span
465
- class="pf-v6-c-label__text"
466
- id="text-input-group-filters-expanded-label-group-label_seven_select_collapsed"
467
- >Label seven</span>
468
- </span>
469
- <span class="pf-v6-c-label__actions">
470
- <button
471
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
472
- type="button"
473
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_seven_select_collapsed text-input-group-filters-expanded-label-group-label_seven_select_collapsed"
474
- aria-label="Remove"
475
- id="text-input-group-filters-expanded-label-group-remove_label_seven_select_collapsed"
476
- >
477
- <span class="pf-v6-c-button__text">
478
- <i class="fas fa-times" aria-hidden="true"></i>
479
- </span>
480
- </button>
481
- </span>
439
+ <span
440
+ class="pf-v6-c-label__text"
441
+ id="text-input-group-filters-expanded-label-group-label-seven-text"
442
+ >Label seven</span>
443
+ </span>
444
+ <span class="pf-v6-c-label__actions">
445
+ <button
446
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
447
+ type="button"
448
+ id="text-input-group-filters-expanded-label-group-label-seven-button"
449
+ aria-label="Remove"
450
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-seven-button text-input-group-filters-expanded-label-group-label-seven-text"
451
+ >
452
+ <span class="pf-v6-c-button__icon">
453
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
454
+ </span>
455
+ </button>
482
456
  </span>
483
457
  </span>
484
458
  </li>
485
459
  <li class="pf-v6-c-label-group__list-item">
486
460
  <span class="pf-v6-c-label pf-m-outline">
487
461
  <span class="pf-v6-c-label__content">
488
- <span class="pf-v6-c-label__content">
489
- <span
490
- class="pf-v6-c-label__text"
491
- id="text-input-group-filters-expanded-label-group-label_eight_select_collapsed"
492
- >Label eight</span>
493
- </span>
494
- <span class="pf-v6-c-label__actions">
495
- <button
496
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
497
- type="button"
498
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_eight_select_collapsed text-input-group-filters-expanded-label-group-label_eight_select_collapsed"
499
- aria-label="Remove"
500
- id="text-input-group-filters-expanded-label-group-remove_label_eight_select_collapsed"
501
- >
502
- <span class="pf-v6-c-button__text">
503
- <i class="fas fa-times" aria-hidden="true"></i>
504
- </span>
505
- </button>
506
- </span>
462
+ <span
463
+ class="pf-v6-c-label__text"
464
+ id="text-input-group-filters-expanded-label-group-label-eight-text"
465
+ >Label eight</span>
466
+ </span>
467
+ <span class="pf-v6-c-label__actions">
468
+ <button
469
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
470
+ type="button"
471
+ id="text-input-group-filters-expanded-label-group-label-eight-button"
472
+ aria-label="Remove"
473
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-eight-button text-input-group-filters-expanded-label-group-label-eight-text"
474
+ >
475
+ <span class="pf-v6-c-button__icon">
476
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
477
+ </span>
478
+ </button>
507
479
  </span>
508
480
  </span>
509
481
  </li>
510
482
  <li class="pf-v6-c-label-group__list-item">
511
483
  <span class="pf-v6-c-label pf-m-outline">
512
484
  <span class="pf-v6-c-label__content">
513
- <span class="pf-v6-c-label__content">
514
- <span
515
- class="pf-v6-c-label__text"
516
- id="text-input-group-filters-expanded-label-group-label_nine_select_collapsed"
517
- >Label nine</span>
518
- </span>
519
- <span class="pf-v6-c-label__actions">
520
- <button
521
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
522
- type="button"
523
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_nine_select_collapsed text-input-group-filters-expanded-label-group-label_nine_select_collapsed"
524
- aria-label="Remove"
525
- id="text-input-group-filters-expanded-label-group-remove_label_nine_select_collapsed"
526
- >
527
- <span class="pf-v6-c-button__text">
528
- <i class="fas fa-times" aria-hidden="true"></i>
529
- </span>
530
- </button>
531
- </span>
485
+ <span
486
+ class="pf-v6-c-label__text"
487
+ id="text-input-group-filters-expanded-label-group-label-nine-text"
488
+ >Label nine</span>
489
+ </span>
490
+ <span class="pf-v6-c-label__actions">
491
+ <button
492
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
493
+ type="button"
494
+ id="text-input-group-filters-expanded-label-group-label-nine-button"
495
+ aria-label="Remove"
496
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-nine-button text-input-group-filters-expanded-label-group-label-nine-text"
497
+ >
498
+ <span class="pf-v6-c-button__icon">
499
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
500
+ </span>
501
+ </button>
532
502
  </span>
533
503
  </span>
534
504
  </li>
535
505
  <li class="pf-v6-c-label-group__list-item">
536
506
  <span class="pf-v6-c-label pf-m-outline">
537
507
  <span class="pf-v6-c-label__content">
538
- <span class="pf-v6-c-label__content">
539
- <span
540
- class="pf-v6-c-label__text"
541
- id="text-input-group-filters-expanded-label-group-label_ten_select_collapsed"
542
- >Label ten</span>
543
- </span>
544
- <span class="pf-v6-c-label__actions">
545
- <button
546
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
547
- type="button"
548
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_ten_select_collapsed text-input-group-filters-expanded-label-group-label_ten_select_collapsed"
549
- aria-label="Remove"
550
- id="text-input-group-filters-expanded-label-group-remove_label_ten_select_collapsed"
551
- >
552
- <span class="pf-v6-c-button__text">
553
- <i class="fas fa-times" aria-hidden="true"></i>
554
- </span>
555
- </button>
556
- </span>
508
+ <span
509
+ class="pf-v6-c-label__text"
510
+ id="text-input-group-filters-expanded-label-group-label-ten-text"
511
+ >Label ten</span>
512
+ </span>
513
+ <span class="pf-v6-c-label__actions">
514
+ <button
515
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
516
+ type="button"
517
+ id="text-input-group-filters-expanded-label-group-label-ten-button"
518
+ aria-label="Remove"
519
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-ten-button text-input-group-filters-expanded-label-group-label-ten-text"
520
+ >
521
+ <span class="pf-v6-c-button__icon">
522
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
523
+ </span>
524
+ </button>
557
525
  </span>
558
526
  </span>
559
527
  </li>
560
528
  <li class="pf-v6-c-label-group__list-item">
561
529
  <span class="pf-v6-c-label pf-m-outline">
562
530
  <span class="pf-v6-c-label__content">
563
- <span class="pf-v6-c-label__content">
564
- <span
565
- class="pf-v6-c-label__text"
566
- id="text-input-group-filters-expanded-label-group-label_eleven_select_collapsed"
567
- >Label eleven</span>
568
- </span>
569
- <span class="pf-v6-c-label__actions">
570
- <button
571
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
572
- type="button"
573
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_eleven_select_collapsed text-input-group-filters-expanded-label-group-label_eleven_select_collapsed"
574
- aria-label="Remove"
575
- id="text-input-group-filters-expanded-label-group-remove_label_eleven_select_collapsed"
576
- >
577
- <span class="pf-v6-c-button__text">
578
- <i class="fas fa-times" aria-hidden="true"></i>
579
- </span>
580
- </button>
581
- </span>
531
+ <span
532
+ class="pf-v6-c-label__text"
533
+ id="text-input-group-filters-expanded-label-group-label-eleven-text"
534
+ >Label eleven</span>
535
+ </span>
536
+ <span class="pf-v6-c-label__actions">
537
+ <button
538
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
539
+ type="button"
540
+ id="text-input-group-filters-expanded-label-group-label-eleven-button"
541
+ aria-label="Remove"
542
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-eleven-button text-input-group-filters-expanded-label-group-label-eleven-text"
543
+ >
544
+ <span class="pf-v6-c-button__icon">
545
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
546
+ </span>
547
+ </button>
582
548
  </span>
583
549
  </span>
584
550
  </li>
585
551
  <li class="pf-v6-c-label-group__list-item">
586
552
  <span class="pf-v6-c-label pf-m-outline">
587
553
  <span class="pf-v6-c-label__content">
588
- <span class="pf-v6-c-label__content">
589
- <span
590
- class="pf-v6-c-label__text"
591
- id="text-input-group-filters-expanded-label-group-label_twelve_select_collapsed"
592
- >Label twelve</span>
593
- </span>
594
- <span class="pf-v6-c-label__actions">
595
- <button
596
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
597
- type="button"
598
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_twelve_select_collapsed text-input-group-filters-expanded-label-group-label_twelve_select_collapsed"
599
- aria-label="Remove"
600
- id="text-input-group-filters-expanded-label-group-remove_label_twelve_select_collapsed"
601
- >
602
- <span class="pf-v6-c-button__text">
603
- <i class="fas fa-times" aria-hidden="true"></i>
604
- </span>
605
- </button>
606
- </span>
554
+ <span
555
+ class="pf-v6-c-label__text"
556
+ id="text-input-group-filters-expanded-label-group-label-twelve-text"
557
+ >Label twelve</span>
558
+ </span>
559
+ <span class="pf-v6-c-label__actions">
560
+ <button
561
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
562
+ type="button"
563
+ id="text-input-group-filters-expanded-label-group-label-twelve-button"
564
+ aria-label="Remove"
565
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-twelve-button text-input-group-filters-expanded-label-group-label-twelve-text"
566
+ >
567
+ <span class="pf-v6-c-button__icon">
568
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
569
+ </span>
570
+ </button>
607
571
  </span>
608
572
  </span>
609
573
  </li>
610
574
  <li class="pf-v6-c-label-group__list-item">
611
575
  <span class="pf-v6-c-label pf-m-outline">
612
576
  <span class="pf-v6-c-label__content">
613
- <span class="pf-v6-c-label__content">
614
- <span
615
- class="pf-v6-c-label__text"
616
- id="text-input-group-filters-expanded-label-group-label_thirteen_select_collapsed"
617
- >Label thirteen</span>
618
- </span>
619
- <span class="pf-v6-c-label__actions">
620
- <button
621
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
622
- type="button"
623
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_thirteen_select_collapsed text-input-group-filters-expanded-label-group-label_thirteen_select_collapsed"
624
- aria-label="Remove"
625
- id="text-input-group-filters-expanded-label-group-remove_label_thirteen_select_collapsed"
626
- >
627
- <span class="pf-v6-c-button__text">
628
- <i class="fas fa-times" aria-hidden="true"></i>
629
- </span>
630
- </button>
631
- </span>
577
+ <span
578
+ class="pf-v6-c-label__text"
579
+ id="text-input-group-filters-expanded-label-group-label-thirteen-text"
580
+ >Label thirteen</span>
581
+ </span>
582
+ <span class="pf-v6-c-label__actions">
583
+ <button
584
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
585
+ type="button"
586
+ id="text-input-group-filters-expanded-label-group-label-thirteen-button"
587
+ aria-label="Remove"
588
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-thirteen-button text-input-group-filters-expanded-label-group-label-thirteen-text"
589
+ >
590
+ <span class="pf-v6-c-button__icon">
591
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
592
+ </span>
593
+ </button>
632
594
  </span>
633
595
  </span>
634
596
  </li>
635
597
  <li class="pf-v6-c-label-group__list-item">
636
598
  <span class="pf-v6-c-label pf-m-outline">
637
599
  <span class="pf-v6-c-label__content">
638
- <span class="pf-v6-c-label__content">
639
- <span
640
- class="pf-v6-c-label__text"
641
- id="text-input-group-filters-expanded-label-group-label_fourteen_select_collapsed"
642
- >Label fourteen</span>
643
- </span>
644
- <span class="pf-v6-c-label__actions">
645
- <button
646
- class="pf-v6-c-button pf-m-plain pf-m-no-padding"
647
- type="button"
648
- aria-labelledby="text-input-group-filters-expanded-label-group-remove_label_fourteen_select_collapsed text-input-group-filters-expanded-label-group-label_fourteen_select_collapsed"
649
- aria-label="Remove"
650
- id="text-input-group-filters-expanded-label-group-remove_label_fourteen_select_collapsed"
651
- >
652
- <span class="pf-v6-c-button__text">
653
- <i class="fas fa-times" aria-hidden="true"></i>
654
- </span>
655
- </button>
656
- </span>
600
+ <span
601
+ class="pf-v6-c-label__text"
602
+ id="text-input-group-filters-expanded-label-group-label-fourteen-text"
603
+ >Label fourteen</span>
604
+ </span>
605
+ <span class="pf-v6-c-label__actions">
606
+ <button
607
+ class="pf-v6-c-button pf-m-no-padding pf-m-plain"
608
+ type="button"
609
+ id="text-input-group-filters-expanded-label-group-label-fourteen-button"
610
+ aria-label="Remove"
611
+ aria-labelledby="text-input-group-filters-expanded-label-group-label-fourteen-button text-input-group-filters-expanded-label-group-label-fourteen-text"
612
+ >
613
+ <span class="pf-v6-c-button__icon">
614
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
615
+ </span>
616
+ </button>
657
617
  </span>
658
618
  </span>
659
619
  </li>
@@ -675,7 +635,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
675
635
  type="button"
676
636
  aria-label="Clear input"
677
637
  >
678
- <span class="pf-v6-c-button__text">
638
+ <span class="pf-v6-c-button__icon">
679
639
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
680
640
  </span>
681
641
  </button>
@@ -755,7 +715,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
755
715
  type="button"
756
716
  aria-label="Clear input"
757
717
  >
758
- <span class="pf-v6-c-button__text">
718
+ <span class="pf-v6-c-button__icon">
759
719
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
760
720
  </span>
761
721
  </button>
@@ -789,7 +749,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
789
749
  type="button"
790
750
  aria-label="Clear input"
791
751
  >
792
- <span class="pf-v6-c-button__text">
752
+ <span class="pf-v6-c-button__icon">
793
753
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
794
754
  </span>
795
755
  </button>
@@ -823,7 +783,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
823
783
  type="button"
824
784
  aria-label="Clear input"
825
785
  >
826
- <span class="pf-v6-c-button__text">
786
+ <span class="pf-v6-c-button__icon">
827
787
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
828
788
  </span>
829
789
  </button>
@@ -844,8 +804,8 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
844
804
  type="button"
845
805
  aria-label="Open search"
846
806
  >
847
- <span class="pf-v6-c-button__text">
848
- <i class="fas fa-fw fa-search" aria-hidden="true"></i>
807
+ <span class="pf-v6-c-button__icon">
808
+ <i class="fas fa-search fa-fw" aria-hidden="true"></i>
849
809
  </span>
850
810
  </button>
851
811
  </div>
@@ -875,8 +835,8 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
875
835
  </div>
876
836
  <div class="pf-v6-c-input-group__item pf-m-plain">
877
837
  <button class="pf-v6-c-button pf-m-plain" type="button" aria-label="Close">
878
- <span class="pf-v6-c-button__text">
879
- <i class="fas fa-times" aria-hidden="true"></i>
838
+ <span class="pf-v6-c-button__icon">
839
+ <i class="fas fa-times fa-fw" aria-hidden="true"></i>
880
840
  </span>
881
841
  </button>
882
842
  </div>
@@ -912,7 +872,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
912
872
  type="submit"
913
873
  aria-label="Search"
914
874
  >
915
- <span class="pf-v6-c-button__text">
875
+ <span class="pf-v6-c-button__icon">
916
876
  <i class="fas fa-arrow-right" aria-hidden="true"></i>
917
877
  </span>
918
878
  </button>
@@ -946,7 +906,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
946
906
  type="button"
947
907
  aria-label="Clear input"
948
908
  >
949
- <span class="pf-v6-c-button__text">
909
+ <span class="pf-v6-c-button__icon">
950
910
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
951
911
  </span>
952
912
  </button>
@@ -960,7 +920,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
960
920
  aria-expanded="false"
961
921
  aria-label="Advanced search"
962
922
  >
963
- <span class="pf-v6-c-button__text">
923
+ <span class="pf-v6-c-button__icon">
964
924
  <i class="fas fa-caret-down" aria-hidden="true"></i>
965
925
  </span>
966
926
  </button>
@@ -971,7 +931,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
971
931
  type="submit"
972
932
  aria-label="Search"
973
933
  >
974
- <span class="pf-v6-c-button__text">
934
+ <span class="pf-v6-c-button__icon">
975
935
  <i class="fas fa-arrow-right" aria-hidden="true"></i>
976
936
  </span>
977
937
  </button>
@@ -1005,7 +965,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1005
965
  type="button"
1006
966
  aria-label="Clear input"
1007
967
  >
1008
- <span class="pf-v6-c-button__text">
968
+ <span class="pf-v6-c-button__icon">
1009
969
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1010
970
  </span>
1011
971
  </button>
@@ -1014,12 +974,12 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1014
974
  </div>
1015
975
  <div class="pf-v6-c-input-group__item">
1016
976
  <button
1017
- class="pf-v6-c-button pf-m-control pf-m-expanded"
977
+ class="pf-v6-c-button pf-m-expanded pf-m-control"
1018
978
  type="button"
1019
979
  aria-expanded="true"
1020
980
  aria-label="Advanced search"
1021
981
  >
1022
- <span class="pf-v6-c-button__text">
982
+ <span class="pf-v6-c-button__icon">
1023
983
  <i class="fas fa-caret-down" aria-hidden="true"></i>
1024
984
  </span>
1025
985
  </button>
@@ -1030,7 +990,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1030
990
  type="submit"
1031
991
  aria-label="Search"
1032
992
  >
1033
- <span class="pf-v6-c-button__text">
993
+ <span class="pf-v6-c-button__icon">
1034
994
  <i class="fas fa-arrow-right" aria-hidden="true"></i>
1035
995
  </span>
1036
996
  </button>
@@ -1151,7 +1111,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1151
1111
  type="button"
1152
1112
  aria-label="Clear input"
1153
1113
  >
1154
- <span class="pf-v6-c-button__text">
1114
+ <span class="pf-v6-c-button__icon">
1155
1115
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1156
1116
  </span>
1157
1117
  </button>
@@ -1219,7 +1179,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1219
1179
  type="button"
1220
1180
  aria-label="Clear input"
1221
1181
  >
1222
- <span class="pf-v6-c-button__text">
1182
+ <span class="pf-v6-c-button__icon">
1223
1183
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1224
1184
  </span>
1225
1185
  </button>
@@ -1268,7 +1228,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1268
1228
  type="button"
1269
1229
  aria-label="Clear input"
1270
1230
  >
1271
- <span class="pf-v6-c-button__text">
1231
+ <span class="pf-v6-c-button__icon">
1272
1232
  <i class="fas fa-times fa-fw" aria-hidden="true"></i>
1273
1233
  </span>
1274
1234
  </button>
@@ -1277,12 +1237,12 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1277
1237
  </div>
1278
1238
  <div class="pf-v6-c-input-group__item">
1279
1239
  <button
1280
- class="pf-v6-c-button pf-m-control pf-m-expanded"
1240
+ class="pf-v6-c-button pf-m-expanded pf-m-control"
1281
1241
  type="button"
1282
1242
  aria-expanded="true"
1283
1243
  aria-label="Advanced search"
1284
1244
  >
1285
- <span class="pf-v6-c-button__text">
1245
+ <span class="pf-v6-c-button__icon">
1286
1246
  <i class="fas fa-caret-down" aria-hidden="true"></i>
1287
1247
  </span>
1288
1248
  </button>
@@ -1293,7 +1253,7 @@ For the purposes of this example, the `TextInputGroup` is contained in a wrapper
1293
1253
  type="submit"
1294
1254
  aria-label="Search"
1295
1255
  >
1296
- <span class="pf-v6-c-button__text">
1256
+ <span class="pf-v6-c-button__icon">
1297
1257
  <i class="fas fa-arrow-right" aria-hidden="true"></i>
1298
1258
  </span>
1299
1259
  </button>