@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
package/docs/components/Table/examples/Table.md CHANGED
@@ -189,8 +189,8 @@ These classes can be used to ensure that the table changes between the tabular a
189
189
  type="button"
190
190
  aria-label="aria-label="More info""
191
191
  >
192
- <span class="pf-v6-c-button__text">
193
- <i class="pf-v6-pficon pf-v6-pficon-help" aria-hidden="true"></i>
192
+ <span class="pf-v6-c-button__icon">
193
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
194
194
  </span>
195
195
  </button>
196
196
  </span>
@@ -224,8 +224,8 @@ These classes can be used to ensure that the table changes between the tabular a
224
224
  type="button"
225
225
  aria-label="aria-label&#x3D;&quot;More info&quot;"
226
226
  >
227
- <span class="pf-v6-c-button__text">
228
- <i class="pf-v6-pficon pf-v6-pficon-help" aria-hidden="true"></i>
227
+ <span class="pf-v6-c-button__icon">
228
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
229
229
  </span>
230
230
  </button>
231
231
  </span>
@@ -1084,10 +1084,12 @@ Note: Table column widths will respond automatically when toggling expanded rows
1084
1084
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1085
1085
  <button
1086
1086
  class="pf-v6-c-button pf-m-plain"
1087
+ id&#x26;#x3D;&#x26;quot;table-expandable-expandable-toggle-thead&#x26;quot;
1087
1088
  type="button"
1089
+ aria-labelledby="table-expandable-node-thead table-expandable-expandable-toggle-thead"
1088
1090
  aria-label="Toggle row"
1089
1091
  >
1090
- <span class="pf-v6-c-button__text">
1092
+ <span class="pf-v6-c-button__icon">
1091
1093
  <div class="pf-v6-c-table__toggle-icon">
1092
1094
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1093
1095
  </div>
@@ -1170,11 +1172,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1170
1172
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1171
1173
  <button
1172
1174
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1175
+ id&#x26;#x3D;&#x26;quot;table-expandable-expandable-toggle-1&#x26;quot;
1173
1176
  type="button"
1174
1177
  aria-expanded="true"
1178
+ aria-labelledby="table-expandable-node-1 table-expandable-expandable-toggle-1"
1175
1179
  aria-label="Toggle row"
1176
1180
  >
1177
- <span class="pf-v6-c-button__text">
1181
+ <span class="pf-v6-c-button__icon">
1178
1182
  <div class="pf-v6-c-table__toggle-icon">
1179
1183
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1180
1184
  </div>
@@ -1254,10 +1258,12 @@ Note: Table column widths will respond automatically when toggling expanded rows
1254
1258
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1255
1259
  <button
1256
1260
  class="pf-v6-c-button pf-m-plain"
1261
+ id&#x26;#x3D;&#x26;quot;table-expandable-expandable-toggle-2&#x26;quot;
1257
1262
  type="button"
1263
+ aria-labelledby="table-expandable-node-2 table-expandable-expandable-toggle-2"
1258
1264
  aria-label="Toggle row"
1259
1265
  >
1260
- <span class="pf-v6-c-button__text">
1266
+ <span class="pf-v6-c-button__icon">
1261
1267
  <div class="pf-v6-c-table__toggle-icon">
1262
1268
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1263
1269
  </div>
@@ -1329,11 +1335,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1329
1335
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1330
1336
  <button
1331
1337
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1338
+ id&#x26;#x3D;&#x26;quot;table-expandable-expandable-toggle-3&#x26;quot;
1332
1339
  type="button"
1333
1340
  aria-expanded="true"
1341
+ aria-labelledby="table-expandable-node-3 table-expandable-expandable-toggle-3"
1334
1342
  aria-label="Toggle row"
1335
1343
  >
1336
- <span class="pf-v6-c-button__text">
1344
+ <span class="pf-v6-c-button__icon">
1337
1345
  <div class="pf-v6-c-table__toggle-icon">
1338
1346
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1339
1347
  </div>
@@ -1408,11 +1416,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1408
1416
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1409
1417
  <button
1410
1418
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1419
+ id&#x26;#x3D;&#x26;quot;table-expandable-expandable-toggle-4&#x26;quot;
1411
1420
  type="button"
1412
1421
  aria-expanded="true"
1422
+ aria-labelledby="table-expandable-node-4 table-expandable-expandable-toggle-4"
1413
1423
  aria-label="Toggle row"
1414
1424
  >
1415
- <span class="pf-v6-c-button__text">
1425
+ <span class="pf-v6-c-button__icon">
1416
1426
  <div class="pf-v6-c-table__toggle-icon">
1417
1427
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1418
1428
  </div>
@@ -1499,11 +1509,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1499
1509
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1500
1510
  <button
1501
1511
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1512
+ id&#x26;#x3D;&#x26;quot;expandable-set-width-columns-example-expandable-toggle-thead&#x26;quot;
1502
1513
  type="button"
1503
1514
  aria-expanded="true"
1515
+ aria-labelledby="expandable-set-width-columns-example-node-thead expandable-set-width-columns-example-expandable-toggle-thead"
1504
1516
  aria-label="Toggle row"
1505
1517
  >
1506
- <span class="pf-v6-c-button__text">
1518
+ <span class="pf-v6-c-button__icon">
1507
1519
  <div class="pf-v6-c-table__toggle-icon">
1508
1520
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1509
1521
  </div>
@@ -1590,11 +1602,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1590
1602
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1591
1603
  <button
1592
1604
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1605
+ id&#x26;#x3D;&#x26;quot;expandable-set-width-columns-example-expandable-toggle-1&#x26;quot;
1593
1606
  type="button"
1594
1607
  aria-expanded="true"
1608
+ aria-labelledby="expandable-set-width-columns-example-node-1 expandable-set-width-columns-example-expandable-toggle-1"
1595
1609
  aria-label="Toggle row"
1596
1610
  >
1597
- <span class="pf-v6-c-button__text">
1611
+ <span class="pf-v6-c-button__icon">
1598
1612
  <div class="pf-v6-c-table__toggle-icon">
1599
1613
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1600
1614
  </div>
@@ -1670,11 +1684,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1670
1684
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1671
1685
  <button
1672
1686
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1687
+ id&#x26;#x3D;&#x26;quot;expandable-set-width-columns-example-expandable-toggle-2&#x26;quot;
1673
1688
  type="button"
1674
1689
  aria-expanded="true"
1690
+ aria-labelledby="expandable-set-width-columns-example-node-2 expandable-set-width-columns-example-expandable-toggle-2"
1675
1691
  aria-label="Toggle row"
1676
1692
  >
1677
- <span class="pf-v6-c-button__text">
1693
+ <span class="pf-v6-c-button__icon">
1678
1694
  <div class="pf-v6-c-table__toggle-icon">
1679
1695
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1680
1696
  </div>
@@ -1751,11 +1767,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1751
1767
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1752
1768
  <button
1753
1769
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1770
+ id&#x26;#x3D;&#x26;quot;expandable-set-width-columns-example-expandable-toggle-3&#x26;quot;
1754
1771
  type="button"
1755
1772
  aria-expanded="true"
1773
+ aria-labelledby="expandable-set-width-columns-example-node-3 expandable-set-width-columns-example-expandable-toggle-3"
1756
1774
  aria-label="Toggle row"
1757
1775
  >
1758
- <span class="pf-v6-c-button__text">
1776
+ <span class="pf-v6-c-button__icon">
1759
1777
  <div class="pf-v6-c-table__toggle-icon">
1760
1778
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1761
1779
  </div>
@@ -1826,11 +1844,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
1826
1844
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1827
1845
  <button
1828
1846
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
1847
+ id&#x26;#x3D;&#x26;quot;expandable-set-width-columns-example-expandable-toggle-4&#x26;quot;
1829
1848
  type="button"
1830
1849
  aria-expanded="true"
1850
+ aria-labelledby="expandable-set-width-columns-example-node-4 expandable-set-width-columns-example-expandable-toggle-4"
1831
1851
  aria-label="Toggle row"
1832
1852
  >
1833
- <span class="pf-v6-c-button__text">
1853
+ <span class="pf-v6-c-button__icon">
1834
1854
  <div class="pf-v6-c-table__toggle-icon">
1835
1855
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1836
1856
  </div>
@@ -1919,10 +1939,12 @@ Note: Table column widths will respond automatically when toggling expanded rows
1919
1939
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
1920
1940
  <button
1921
1941
  class="pf-v6-c-button pf-m-plain"
1942
+ id&#x26;#x3D;&#x26;quot;table-expandable-nested-table-expandable-toggle-thead&#x26;quot;
1922
1943
  type="button"
1944
+ aria-labelledby="table-expandable-nested-table-node-thead table-expandable-nested-table-expandable-toggle-thead"
1923
1945
  aria-label="Toggle row"
1924
1946
  >
1925
- <span class="pf-v6-c-button__text">
1947
+ <span class="pf-v6-c-button__icon">
1926
1948
  <div class="pf-v6-c-table__toggle-icon">
1927
1949
  <i class="fas fa-angle-down" aria-hidden="true"></i>
1928
1950
  </div>
@@ -2005,11 +2027,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
2005
2027
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
2006
2028
  <button
2007
2029
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
2030
+ id&#x26;#x3D;&#x26;quot;table-expandable-nested-table-expandable-toggle-1&#x26;quot;
2008
2031
  type="button"
2009
2032
  aria-expanded="true"
2033
+ aria-labelledby="table-expandable-nested-table-node-1 table-expandable-nested-table-expandable-toggle-1"
2010
2034
  aria-label="Toggle row"
2011
2035
  >
2012
- <span class="pf-v6-c-button__text">
2036
+ <span class="pf-v6-c-button__icon">
2013
2037
  <div class="pf-v6-c-table__toggle-icon">
2014
2038
  <i class="fas fa-angle-down" aria-hidden="true"></i>
2015
2039
  </div>
@@ -2237,10 +2261,12 @@ Note: Table column widths will respond automatically when toggling expanded rows
2237
2261
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
2238
2262
  <button
2239
2263
  class="pf-v6-c-button pf-m-plain"
2264
+ id&#x26;#x3D;&#x26;quot;table-expandable-nested-table-expandable-toggle-2&#x26;quot;
2240
2265
  type="button"
2266
+ aria-labelledby="table-expandable-nested-table-node-2 table-expandable-nested-table-expandable-toggle-2"
2241
2267
  aria-label="Toggle row"
2242
2268
  >
2243
- <span class="pf-v6-c-button__text">
2269
+ <span class="pf-v6-c-button__icon">
2244
2270
  <div class="pf-v6-c-table__toggle-icon">
2245
2271
  <i class="fas fa-angle-down" aria-hidden="true"></i>
2246
2272
  </div>
@@ -2312,11 +2338,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
2312
2338
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
2313
2339
  <button
2314
2340
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
2341
+ id&#x26;#x3D;&#x26;quot;table-expandable-nested-table-expandable-toggle-3&#x26;quot;
2315
2342
  type="button"
2316
2343
  aria-expanded="true"
2344
+ aria-labelledby="table-expandable-nested-table-node-3 table-expandable-nested-table-expandable-toggle-3"
2317
2345
  aria-label="Toggle row"
2318
2346
  >
2319
- <span class="pf-v6-c-button__text">
2347
+ <span class="pf-v6-c-button__icon">
2320
2348
  <div class="pf-v6-c-table__toggle-icon">
2321
2349
  <i class="fas fa-angle-down" aria-hidden="true"></i>
2322
2350
  </div>
@@ -2391,11 +2419,13 @@ Note: Table column widths will respond automatically when toggling expanded rows
2391
2419
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
2392
2420
  <button
2393
2421
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
2422
+ id&#x26;#x3D;&#x26;quot;table-expandable-nested-table-expandable-toggle-4&#x26;quot;
2394
2423
  type="button"
2395
2424
  aria-expanded="true"
2425
+ aria-labelledby="table-expandable-nested-table-node-4 table-expandable-nested-table-expandable-toggle-4"
2396
2426
  aria-label="Toggle row"
2397
2427
  >
2398
- <span class="pf-v6-c-button__text">
2428
+ <span class="pf-v6-c-button__icon">
2399
2429
  <div class="pf-v6-c-table__toggle-icon">
2400
2430
  <i class="fas fa-angle-down" aria-hidden="true"></i>
2401
2431
  </div>
@@ -5013,10 +5043,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5013
5043
  >
5014
5044
  <button
5015
5045
  class="pf-v6-c-button pf-m-small pf-m-plain"
5046
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-thead&#x26;quot;
5016
5047
  type="button"
5048
+ aria-labelledby="table-compact-expandable-node-thead table-compact-expandable-expandable-toggle-thead"
5017
5049
  aria-label="Toggle row"
5018
5050
  >
5019
- <span class="pf-v6-c-button__text">
5051
+ <span class="pf-v6-c-button__icon">
5020
5052
  <div class="pf-v6-c-table__toggle-icon">
5021
5053
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5022
5054
  </div>
@@ -5071,11 +5103,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5071
5103
  >
5072
5104
  <button
5073
5105
  class="pf-v6-c-button pf-m-small pf-m-expanded pf-m-plain"
5106
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-1&#x26;quot;
5074
5107
  type="button"
5075
5108
  aria-expanded="true"
5109
+ aria-labelledby="table-compact-expandable-node-1 table-compact-expandable-expandable-toggle-1"
5076
5110
  aria-label="Toggle row"
5077
5111
  >
5078
- <span class="pf-v6-c-button__text">
5112
+ <span class="pf-v6-c-button__icon">
5079
5113
  <div class="pf-v6-c-table__toggle-icon">
5080
5114
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5081
5115
  </div>
@@ -5175,10 +5209,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5175
5209
  >
5176
5210
  <button
5177
5211
  class="pf-v6-c-button pf-m-small pf-m-plain"
5212
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-2&#x26;quot;
5178
5213
  type="button"
5214
+ aria-labelledby="table-compact-expandable-node-2 table-compact-expandable-expandable-toggle-2"
5179
5215
  aria-label="Toggle row"
5180
5216
  >
5181
- <span class="pf-v6-c-button__text">
5217
+ <span class="pf-v6-c-button__icon">
5182
5218
  <div class="pf-v6-c-table__toggle-icon">
5183
5219
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5184
5220
  </div>
@@ -5270,11 +5306,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5270
5306
  >
5271
5307
  <button
5272
5308
  class="pf-v6-c-button pf-m-small pf-m-expanded pf-m-plain"
5309
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-3&#x26;quot;
5273
5310
  type="button"
5274
5311
  aria-expanded="true"
5312
+ aria-labelledby="table-compact-expandable-node-3 table-compact-expandable-expandable-toggle-3"
5275
5313
  aria-label="Toggle row"
5276
5314
  >
5277
- <span class="pf-v6-c-button__text">
5315
+ <span class="pf-v6-c-button__icon">
5278
5316
  <div class="pf-v6-c-table__toggle-icon">
5279
5317
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5280
5318
  </div>
@@ -5369,11 +5407,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5369
5407
  >
5370
5408
  <button
5371
5409
  class="pf-v6-c-button pf-m-small pf-m-expanded pf-m-plain"
5410
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-4&#x26;quot;
5372
5411
  type="button"
5373
5412
  aria-expanded="true"
5413
+ aria-labelledby="table-compact-expandable-node-4 table-compact-expandable-expandable-toggle-4"
5374
5414
  aria-label="Toggle row"
5375
5415
  >
5376
- <span class="pf-v6-c-button__text">
5416
+ <span class="pf-v6-c-button__icon">
5377
5417
  <div class="pf-v6-c-table__toggle-icon">
5378
5418
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5379
5419
  </div>
@@ -5468,10 +5508,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5468
5508
  >
5469
5509
  <button
5470
5510
  class="pf-v6-c-button pf-m-small pf-m-plain"
5511
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-5&#x26;quot;
5471
5512
  type="button"
5513
+ aria-labelledby="table-compact-expandable-node-5 table-compact-expandable-expandable-toggle-5"
5472
5514
  aria-label="Toggle row"
5473
5515
  >
5474
- <span class="pf-v6-c-button__text">
5516
+ <span class="pf-v6-c-button__icon">
5475
5517
  <div class="pf-v6-c-table__toggle-icon">
5476
5518
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5477
5519
  </div>
@@ -5563,11 +5605,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5563
5605
  >
5564
5606
  <button
5565
5607
  class="pf-v6-c-button pf-m-small pf-m-expanded pf-m-plain"
5608
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-6&#x26;quot;
5566
5609
  type="button"
5567
5610
  aria-expanded="true"
5611
+ aria-labelledby="table-compact-expandable-node-6 table-compact-expandable-expandable-toggle-6"
5568
5612
  aria-label="Toggle row"
5569
5613
  >
5570
- <span class="pf-v6-c-button__text">
5614
+ <span class="pf-v6-c-button__icon">
5571
5615
  <div class="pf-v6-c-table__toggle-icon">
5572
5616
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5573
5617
  </div>
@@ -5669,10 +5713,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5669
5713
  >
5670
5714
  <button
5671
5715
  class="pf-v6-c-button pf-m-small pf-m-plain"
5716
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-7&#x26;quot;
5672
5717
  type="button"
5718
+ aria-labelledby="table-compact-expandable-node-7 table-compact-expandable-expandable-toggle-7"
5673
5719
  aria-label="Toggle row"
5674
5720
  >
5675
- <span class="pf-v6-c-button__text">
5721
+ <span class="pf-v6-c-button__icon">
5676
5722
  <div class="pf-v6-c-table__toggle-icon">
5677
5723
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5678
5724
  </div>
@@ -5764,11 +5810,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5764
5810
  >
5765
5811
  <button
5766
5812
  class="pf-v6-c-button pf-m-small pf-m-expanded pf-m-plain"
5813
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-8&#x26;quot;
5767
5814
  type="button"
5768
5815
  aria-expanded="true"
5816
+ aria-labelledby="table-compact-expandable-node-8 table-compact-expandable-expandable-toggle-8"
5769
5817
  aria-label="Toggle row"
5770
5818
  >
5771
- <span class="pf-v6-c-button__text">
5819
+ <span class="pf-v6-c-button__icon">
5772
5820
  <div class="pf-v6-c-table__toggle-icon">
5773
5821
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5774
5822
  </div>
@@ -5865,10 +5913,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
5865
5913
  >
5866
5914
  <button
5867
5915
  class="pf-v6-c-button pf-m-small pf-m-plain"
5916
+ id&#x26;#x3D;&#x26;quot;table-compact-expandable-expandable-toggle-9&#x26;quot;
5868
5917
  type="button"
5918
+ aria-labelledby="table-compact-expandable-node-9 table-compact-expandable-expandable-toggle-9"
5869
5919
  aria-label="Toggle row"
5870
5920
  >
5871
- <span class="pf-v6-c-button__text">
5921
+ <span class="pf-v6-c-button__icon">
5872
5922
  <div class="pf-v6-c-table__toggle-icon">
5873
5923
  <i class="fas fa-angle-down" aria-hidden="true"></i>
5874
5924
  </div>
@@ -6228,10 +6278,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6228
6278
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
6229
6279
  <button
6230
6280
  class="pf-v6-c-button pf-m-plain"
6281
+ id&#x26;#x3D;&#x26;quot;table-expandable-clickable-expandable-toggle-1&#x26;quot;
6231
6282
  type="button"
6283
+ aria-labelledby="table-expandable-clickable-node-1 table-expandable-clickable-expandable-toggle-1"
6232
6284
  aria-label="Toggle row"
6233
6285
  >
6234
- <span class="pf-v6-c-button__text">
6286
+ <span class="pf-v6-c-button__icon">
6235
6287
  <div class="pf-v6-c-table__toggle-icon">
6236
6288
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6237
6289
  </div>
@@ -6311,11 +6363,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6311
6363
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
6312
6364
  <button
6313
6365
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
6366
+ id&#x26;#x3D;&#x26;quot;table-expandable-clickable-expandable-toggle-2&#x26;quot;
6314
6367
  type="button"
6315
6368
  aria-expanded="true"
6369
+ aria-labelledby="table-expandable-clickable-node-2 table-expandable-clickable-expandable-toggle-2"
6316
6370
  aria-label="Toggle row"
6317
6371
  >
6318
- <span class="pf-v6-c-button__text">
6372
+ <span class="pf-v6-c-button__icon">
6319
6373
  <div class="pf-v6-c-table__toggle-icon">
6320
6374
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6321
6375
  </div>
@@ -6400,10 +6454,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6400
6454
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
6401
6455
  <button
6402
6456
  class="pf-v6-c-button pf-m-plain"
6457
+ id&#x26;#x3D;&#x26;quot;table-expandable-clickable-expandable-toggle-3&#x26;quot;
6403
6458
  type="button"
6459
+ aria-labelledby="table-expandable-clickable-node-3 table-expandable-clickable-expandable-toggle-3"
6404
6460
  aria-label="Toggle row"
6405
6461
  >
6406
- <span class="pf-v6-c-button__text">
6462
+ <span class="pf-v6-c-button__icon">
6407
6463
  <div class="pf-v6-c-table__toggle-icon">
6408
6464
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6409
6465
  </div>
@@ -6483,11 +6539,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6483
6539
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
6484
6540
  <button
6485
6541
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
6542
+ id&#x26;#x3D;&#x26;quot;table-expandable-clickable-expandable-toggle-4&#x26;quot;
6486
6543
  type="button"
6487
6544
  aria-expanded="true"
6545
+ aria-labelledby="table-expandable-clickable-node-4 table-expandable-clickable-expandable-toggle-4"
6488
6546
  aria-label="Toggle row"
6489
6547
  >
6490
- <span class="pf-v6-c-button__text">
6548
+ <span class="pf-v6-c-button__icon">
6491
6549
  <div class="pf-v6-c-table__toggle-icon">
6492
6550
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6493
6551
  </div>
@@ -6622,11 +6680,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6622
6680
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
6623
6681
  <button
6624
6682
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
6683
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-1&#x26;quot;
6625
6684
  type="button"
6626
6685
  aria-expanded="true"
6686
+ aria-labelledby="tree-table-basic-example-node-1 tree-table-basic-example-expandable-toggle-1"
6627
6687
  aria-label="Toggle row"
6628
6688
  >
6629
- <span class="pf-v6-c-button__text">
6689
+ <span class="pf-v6-c-button__icon">
6630
6690
  <div class="pf-v6-c-table__toggle-icon">
6631
6691
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6632
6692
  </div>
@@ -6646,8 +6706,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6646
6706
  type="button"
6647
6707
  aria-label="tree-table-basic-example-1--tree-table--details-toggle"
6648
6708
  >
6649
- <span class="pf-v6-c-table__details-toggle-icon">
6650
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6709
+ <span class="pf-v6-c-button__icon">
6710
+ <span class="pf-v6-c-table__details-toggle-icon">
6711
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6712
+ </span>
6651
6713
  </span>
6652
6714
  </button>
6653
6715
  </span>
@@ -6694,10 +6756,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6694
6756
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
6695
6757
  <button
6696
6758
  class="pf-v6-c-button pf-m-plain"
6759
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-2&#x26;quot;
6697
6760
  type="button"
6761
+ aria-labelledby="tree-table-basic-example-node-2 tree-table-basic-example-expandable-toggle-2"
6698
6762
  aria-label="Toggle row"
6699
6763
  >
6700
- <span class="pf-v6-c-button__text">
6764
+ <span class="pf-v6-c-button__icon">
6701
6765
  <div class="pf-v6-c-table__toggle-icon">
6702
6766
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6703
6767
  </div>
@@ -6713,13 +6777,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6713
6777
  </div>
6714
6778
  <span class="pf-v6-c-table__tree-view-details-toggle">
6715
6779
  <button
6716
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
6717
- aria-expanded="true"
6780
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
6718
6781
  type="button"
6782
+ aria-expanded="true"
6719
6783
  aria-label="tree-table-basic-example-2--tree-table--details-toggle"
6720
6784
  >
6721
- <span class="pf-v6-c-table__details-toggle-icon">
6722
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6785
+ <span class="pf-v6-c-button__icon">
6786
+ <span class="pf-v6-c-table__details-toggle-icon">
6787
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6788
+ </span>
6723
6789
  </span>
6724
6790
  </button>
6725
6791
  </span>
@@ -6774,8 +6840,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6774
6840
  type="button"
6775
6841
  aria-label="tree-table-basic-example-3--tree-table--details-toggle"
6776
6842
  >
6777
- <span class="pf-v6-c-table__details-toggle-icon">
6778
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6843
+ <span class="pf-v6-c-button__icon">
6844
+ <span class="pf-v6-c-table__details-toggle-icon">
6845
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6846
+ </span>
6779
6847
  </span>
6780
6848
  </button>
6781
6849
  </span>
@@ -6830,8 +6898,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6830
6898
  type="button"
6831
6899
  aria-label="tree-table-basic-example-4--tree-table--details-toggle"
6832
6900
  >
6833
- <span class="pf-v6-c-table__details-toggle-icon">
6834
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6901
+ <span class="pf-v6-c-button__icon">
6902
+ <span class="pf-v6-c-table__details-toggle-icon">
6903
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6904
+ </span>
6835
6905
  </span>
6836
6906
  </button>
6837
6907
  </span>
@@ -6886,8 +6956,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6886
6956
  type="button"
6887
6957
  aria-label="tree-table-basic-example-5--tree-table--details-toggle"
6888
6958
  >
6889
- <span class="pf-v6-c-table__details-toggle-icon">
6890
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6959
+ <span class="pf-v6-c-button__icon">
6960
+ <span class="pf-v6-c-table__details-toggle-icon">
6961
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
6962
+ </span>
6891
6963
  </span>
6892
6964
  </button>
6893
6965
  </span>
@@ -6941,8 +7013,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6941
7013
  type="button"
6942
7014
  aria-label="tree-table-basic-example-6--tree-table--details-toggle"
6943
7015
  >
6944
- <span class="pf-v6-c-table__details-toggle-icon">
6945
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7016
+ <span class="pf-v6-c-button__icon">
7017
+ <span class="pf-v6-c-table__details-toggle-icon">
7018
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7019
+ </span>
6946
7020
  </span>
6947
7021
  </button>
6948
7022
  </span>
@@ -6989,11 +7063,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
6989
7063
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
6990
7064
  <button
6991
7065
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
7066
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-7&#x26;quot;
6992
7067
  type="button"
6993
7068
  aria-expanded="true"
7069
+ aria-labelledby="tree-table-basic-example-node-7 tree-table-basic-example-expandable-toggle-7"
6994
7070
  aria-label="Toggle row"
6995
7071
  >
6996
- <span class="pf-v6-c-button__text">
7072
+ <span class="pf-v6-c-button__icon">
6997
7073
  <div class="pf-v6-c-table__toggle-icon">
6998
7074
  <i class="fas fa-angle-down" aria-hidden="true"></i>
6999
7075
  </div>
@@ -7013,8 +7089,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7013
7089
  type="button"
7014
7090
  aria-label="tree-table-basic-example-7--tree-table--details-toggle"
7015
7091
  >
7016
- <span class="pf-v6-c-table__details-toggle-icon">
7017
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7092
+ <span class="pf-v6-c-button__icon">
7093
+ <span class="pf-v6-c-table__details-toggle-icon">
7094
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7095
+ </span>
7018
7096
  </span>
7019
7097
  </button>
7020
7098
  </span>
@@ -7068,8 +7146,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7068
7146
  type="button"
7069
7147
  aria-label="tree-table-basic-example-8--tree-table--details-toggle"
7070
7148
  >
7071
- <span class="pf-v6-c-table__details-toggle-icon">
7072
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7149
+ <span class="pf-v6-c-button__icon">
7150
+ <span class="pf-v6-c-table__details-toggle-icon">
7151
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7152
+ </span>
7073
7153
  </span>
7074
7154
  </button>
7075
7155
  </span>
@@ -7115,11 +7195,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7115
7195
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
7116
7196
  <button
7117
7197
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
7198
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-9&#x26;quot;
7118
7199
  type="button"
7119
7200
  aria-expanded="true"
7201
+ aria-labelledby="tree-table-basic-example-node-9 tree-table-basic-example-expandable-toggle-9"
7120
7202
  aria-label="Toggle row"
7121
7203
  >
7122
- <span class="pf-v6-c-button__text">
7204
+ <span class="pf-v6-c-button__icon">
7123
7205
  <div class="pf-v6-c-table__toggle-icon">
7124
7206
  <i class="fas fa-angle-down" aria-hidden="true"></i>
7125
7207
  </div>
@@ -7139,8 +7221,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7139
7221
  type="button"
7140
7222
  aria-label="tree-table-basic-example-9--tree-table--details-toggle"
7141
7223
  >
7142
- <span class="pf-v6-c-table__details-toggle-icon">
7143
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7224
+ <span class="pf-v6-c-button__icon">
7225
+ <span class="pf-v6-c-table__details-toggle-icon">
7226
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7227
+ </span>
7144
7228
  </span>
7145
7229
  </button>
7146
7230
  </span>
@@ -7190,13 +7274,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7190
7274
  </div>
7191
7275
  <span class="pf-v6-c-table__tree-view-details-toggle">
7192
7276
  <button
7193
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
7194
- aria-expanded="true"
7277
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
7195
7278
  type="button"
7279
+ aria-expanded="true"
7196
7280
  aria-label="tree-table-basic-example-10--tree-table--details-toggle"
7197
7281
  >
7198
- <span class="pf-v6-c-table__details-toggle-icon">
7199
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7282
+ <span class="pf-v6-c-button__icon">
7283
+ <span class="pf-v6-c-table__details-toggle-icon">
7284
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7285
+ </span>
7200
7286
  </span>
7201
7287
  </button>
7202
7288
  </span>
@@ -7250,8 +7336,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7250
7336
  type="button"
7251
7337
  aria-label="tree-table-basic-example-11--tree-table--details-toggle"
7252
7338
  >
7253
- <span class="pf-v6-c-table__details-toggle-icon">
7254
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7339
+ <span class="pf-v6-c-button__icon">
7340
+ <span class="pf-v6-c-table__details-toggle-icon">
7341
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7342
+ </span>
7255
7343
  </span>
7256
7344
  </button>
7257
7345
  </span>
@@ -7298,11 +7386,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7298
7386
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
7299
7387
  <button
7300
7388
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
7389
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-12&#x26;quot;
7301
7390
  type="button"
7302
7391
  aria-expanded="true"
7392
+ aria-labelledby="tree-table-basic-example-node-12 tree-table-basic-example-expandable-toggle-12"
7303
7393
  aria-label="Toggle row"
7304
7394
  >
7305
- <span class="pf-v6-c-button__text">
7395
+ <span class="pf-v6-c-button__icon">
7306
7396
  <div class="pf-v6-c-table__toggle-icon">
7307
7397
  <i class="fas fa-angle-down" aria-hidden="true"></i>
7308
7398
  </div>
@@ -7322,8 +7412,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7322
7412
  type="button"
7323
7413
  aria-label="tree-table-basic-example-12--tree-table--details-toggle"
7324
7414
  >
7325
- <span class="pf-v6-c-table__details-toggle-icon">
7326
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7415
+ <span class="pf-v6-c-button__icon">
7416
+ <span class="pf-v6-c-table__details-toggle-icon">
7417
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7418
+ </span>
7327
7419
  </span>
7328
7420
  </button>
7329
7421
  </span>
@@ -7377,8 +7469,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7377
7469
  type="button"
7378
7470
  aria-label="tree-table-basic-example-13--tree-table--details-toggle"
7379
7471
  >
7380
- <span class="pf-v6-c-table__details-toggle-icon">
7381
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7472
+ <span class="pf-v6-c-button__icon">
7473
+ <span class="pf-v6-c-table__details-toggle-icon">
7474
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7475
+ </span>
7382
7476
  </span>
7383
7477
  </button>
7384
7478
  </span>
@@ -7432,8 +7526,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7432
7526
  type="button"
7433
7527
  aria-label="tree-table-basic-example-14--tree-table--details-toggle"
7434
7528
  >
7435
- <span class="pf-v6-c-table__details-toggle-icon">
7436
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7529
+ <span class="pf-v6-c-button__icon">
7530
+ <span class="pf-v6-c-table__details-toggle-icon">
7531
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7532
+ </span>
7437
7533
  </span>
7438
7534
  </button>
7439
7535
  </span>
@@ -7480,10 +7576,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7480
7576
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
7481
7577
  <button
7482
7578
  class="pf-v6-c-button pf-m-plain"
7579
+ id&#x26;#x3D;&#x26;quot;tree-table-basic-example-expandable-toggle-15&#x26;quot;
7483
7580
  type="button"
7581
+ aria-labelledby="tree-table-basic-example-node-15 tree-table-basic-example-expandable-toggle-15"
7484
7582
  aria-label="Toggle row"
7485
7583
  >
7486
- <span class="pf-v6-c-button__text">
7584
+ <span class="pf-v6-c-button__icon">
7487
7585
  <div class="pf-v6-c-table__toggle-icon">
7488
7586
  <i class="fas fa-angle-down" aria-hidden="true"></i>
7489
7587
  </div>
@@ -7503,8 +7601,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7503
7601
  type="button"
7504
7602
  aria-label="tree-table-basic-example-15--tree-table--details-toggle"
7505
7603
  >
7506
- <span class="pf-v6-c-table__details-toggle-icon">
7507
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7604
+ <span class="pf-v6-c-button__icon">
7605
+ <span class="pf-v6-c-table__details-toggle-icon">
7606
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7607
+ </span>
7508
7608
  </span>
7509
7609
  </button>
7510
7610
  </span>
@@ -7559,8 +7659,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7559
7659
  type="button"
7560
7660
  aria-label="tree-table-basic-example-16--tree-table--details-toggle"
7561
7661
  >
7562
- <span class="pf-v6-c-table__details-toggle-icon">
7563
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7662
+ <span class="pf-v6-c-button__icon">
7663
+ <span class="pf-v6-c-table__details-toggle-icon">
7664
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7665
+ </span>
7564
7666
  </span>
7565
7667
  </button>
7566
7668
  </span>
@@ -7615,8 +7717,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7615
7717
  type="button"
7616
7718
  aria-label="tree-table-basic-example-17--tree-table--details-toggle"
7617
7719
  >
7618
- <span class="pf-v6-c-table__details-toggle-icon">
7619
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7720
+ <span class="pf-v6-c-button__icon">
7721
+ <span class="pf-v6-c-table__details-toggle-icon">
7722
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7723
+ </span>
7620
7724
  </span>
7621
7725
  </button>
7622
7726
  </span>
@@ -7696,11 +7800,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7696
7800
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
7697
7801
  <button
7698
7802
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
7803
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-1&#x26;quot;
7699
7804
  type="button"
7700
7805
  aria-expanded="true"
7806
+ aria-labelledby="tree-table-with-checkboxes-example-node-1 tree-table-with-checkboxes-example-expandable-toggle-1"
7701
7807
  aria-label="Toggle row"
7702
7808
  >
7703
- <span class="pf-v6-c-button__text">
7809
+ <span class="pf-v6-c-button__icon">
7704
7810
  <div class="pf-v6-c-table__toggle-icon">
7705
7811
  <i class="fas fa-angle-down" aria-hidden="true"></i>
7706
7812
  </div>
@@ -7735,8 +7841,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7735
7841
  type="button"
7736
7842
  aria-label="tree-table-with-checkboxes-example-1--tree-table--details-toggle"
7737
7843
  >
7738
- <span class="pf-v6-c-table__details-toggle-icon">
7739
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7844
+ <span class="pf-v6-c-button__icon">
7845
+ <span class="pf-v6-c-table__details-toggle-icon">
7846
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7847
+ </span>
7740
7848
  </span>
7741
7849
  </button>
7742
7850
  </span>
@@ -7783,10 +7891,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7783
7891
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
7784
7892
  <button
7785
7893
  class="pf-v6-c-button pf-m-plain"
7894
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-2&#x26;quot;
7786
7895
  type="button"
7896
+ aria-labelledby="tree-table-with-checkboxes-example-node-2 tree-table-with-checkboxes-example-expandable-toggle-2"
7787
7897
  aria-label="Toggle row"
7788
7898
  >
7789
- <span class="pf-v6-c-button__text">
7899
+ <span class="pf-v6-c-button__icon">
7790
7900
  <div class="pf-v6-c-table__toggle-icon">
7791
7901
  <i class="fas fa-angle-down" aria-hidden="true"></i>
7792
7902
  </div>
@@ -7817,13 +7927,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7817
7927
  </div>
7818
7928
  <span class="pf-v6-c-table__tree-view-details-toggle">
7819
7929
  <button
7820
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
7821
- aria-expanded="true"
7930
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
7822
7931
  type="button"
7932
+ aria-expanded="true"
7823
7933
  aria-label="tree-table-with-checkboxes-example-2--tree-table--details-toggle"
7824
7934
  >
7825
- <span class="pf-v6-c-table__details-toggle-icon">
7826
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7935
+ <span class="pf-v6-c-button__icon">
7936
+ <span class="pf-v6-c-table__details-toggle-icon">
7937
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
7938
+ </span>
7827
7939
  </span>
7828
7940
  </button>
7829
7941
  </span>
@@ -7894,8 +8006,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7894
8006
  type="button"
7895
8007
  aria-label="tree-table-with-checkboxes-example-3--tree-table--details-toggle"
7896
8008
  >
7897
- <span class="pf-v6-c-table__details-toggle-icon">
7898
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8009
+ <span class="pf-v6-c-button__icon">
8010
+ <span class="pf-v6-c-table__details-toggle-icon">
8011
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8012
+ </span>
7899
8013
  </span>
7900
8014
  </button>
7901
8015
  </span>
@@ -7966,8 +8080,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
7966
8080
  type="button"
7967
8081
  aria-label="tree-table-with-checkboxes-example-4--tree-table--details-toggle"
7968
8082
  >
7969
- <span class="pf-v6-c-table__details-toggle-icon">
7970
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8083
+ <span class="pf-v6-c-button__icon">
8084
+ <span class="pf-v6-c-table__details-toggle-icon">
8085
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8086
+ </span>
7971
8087
  </span>
7972
8088
  </button>
7973
8089
  </span>
@@ -8038,8 +8154,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8038
8154
  type="button"
8039
8155
  aria-label="tree-table-with-checkboxes-example-5--tree-table--details-toggle"
8040
8156
  >
8041
- <span class="pf-v6-c-table__details-toggle-icon">
8042
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8157
+ <span class="pf-v6-c-button__icon">
8158
+ <span class="pf-v6-c-table__details-toggle-icon">
8159
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8160
+ </span>
8043
8161
  </span>
8044
8162
  </button>
8045
8163
  </span>
@@ -8109,8 +8227,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8109
8227
  type="button"
8110
8228
  aria-label="tree-table-with-checkboxes-example-6--tree-table--details-toggle"
8111
8229
  >
8112
- <span class="pf-v6-c-table__details-toggle-icon">
8113
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8230
+ <span class="pf-v6-c-button__icon">
8231
+ <span class="pf-v6-c-table__details-toggle-icon">
8232
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8233
+ </span>
8114
8234
  </span>
8115
8235
  </button>
8116
8236
  </span>
@@ -8157,11 +8277,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8157
8277
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
8158
8278
  <button
8159
8279
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
8280
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-7&#x26;quot;
8160
8281
  type="button"
8161
8282
  aria-expanded="true"
8283
+ aria-labelledby="tree-table-with-checkboxes-example-node-7 tree-table-with-checkboxes-example-expandable-toggle-7"
8162
8284
  aria-label="Toggle row"
8163
8285
  >
8164
- <span class="pf-v6-c-button__text">
8286
+ <span class="pf-v6-c-button__icon">
8165
8287
  <div class="pf-v6-c-table__toggle-icon">
8166
8288
  <i class="fas fa-angle-down" aria-hidden="true"></i>
8167
8289
  </div>
@@ -8196,8 +8318,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8196
8318
  type="button"
8197
8319
  aria-label="tree-table-with-checkboxes-example-7--tree-table--details-toggle"
8198
8320
  >
8199
- <span class="pf-v6-c-table__details-toggle-icon">
8200
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8321
+ <span class="pf-v6-c-button__icon">
8322
+ <span class="pf-v6-c-table__details-toggle-icon">
8323
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8324
+ </span>
8201
8325
  </span>
8202
8326
  </button>
8203
8327
  </span>
@@ -8267,8 +8391,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8267
8391
  type="button"
8268
8392
  aria-label="tree-table-with-checkboxes-example-8--tree-table--details-toggle"
8269
8393
  >
8270
- <span class="pf-v6-c-table__details-toggle-icon">
8271
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8394
+ <span class="pf-v6-c-button__icon">
8395
+ <span class="pf-v6-c-table__details-toggle-icon">
8396
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8397
+ </span>
8272
8398
  </span>
8273
8399
  </button>
8274
8400
  </span>
@@ -8314,11 +8440,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8314
8440
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
8315
8441
  <button
8316
8442
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
8443
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-9&#x26;quot;
8317
8444
  type="button"
8318
8445
  aria-expanded="true"
8446
+ aria-labelledby="tree-table-with-checkboxes-example-node-9 tree-table-with-checkboxes-example-expandable-toggle-9"
8319
8447
  aria-label="Toggle row"
8320
8448
  >
8321
- <span class="pf-v6-c-button__text">
8449
+ <span class="pf-v6-c-button__icon">
8322
8450
  <div class="pf-v6-c-table__toggle-icon">
8323
8451
  <i class="fas fa-angle-down" aria-hidden="true"></i>
8324
8452
  </div>
@@ -8353,8 +8481,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8353
8481
  type="button"
8354
8482
  aria-label="tree-table-with-checkboxes-example-9--tree-table--details-toggle"
8355
8483
  >
8356
- <span class="pf-v6-c-table__details-toggle-icon">
8357
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8484
+ <span class="pf-v6-c-button__icon">
8485
+ <span class="pf-v6-c-table__details-toggle-icon">
8486
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8487
+ </span>
8358
8488
  </span>
8359
8489
  </button>
8360
8490
  </span>
@@ -8420,13 +8550,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8420
8550
  </div>
8421
8551
  <span class="pf-v6-c-table__tree-view-details-toggle">
8422
8552
  <button
8423
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
8424
- aria-expanded="true"
8553
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
8425
8554
  type="button"
8555
+ aria-expanded="true"
8426
8556
  aria-label="tree-table-with-checkboxes-example-10--tree-table--details-toggle"
8427
8557
  >
8428
- <span class="pf-v6-c-table__details-toggle-icon">
8429
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8558
+ <span class="pf-v6-c-button__icon">
8559
+ <span class="pf-v6-c-table__details-toggle-icon">
8560
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8561
+ </span>
8430
8562
  </span>
8431
8563
  </button>
8432
8564
  </span>
@@ -8496,8 +8628,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8496
8628
  type="button"
8497
8629
  aria-label="tree-table-with-checkboxes-example-11--tree-table--details-toggle"
8498
8630
  >
8499
- <span class="pf-v6-c-table__details-toggle-icon">
8500
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8631
+ <span class="pf-v6-c-button__icon">
8632
+ <span class="pf-v6-c-table__details-toggle-icon">
8633
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8634
+ </span>
8501
8635
  </span>
8502
8636
  </button>
8503
8637
  </span>
@@ -8544,11 +8678,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8544
8678
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
8545
8679
  <button
8546
8680
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
8681
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-12&#x26;quot;
8547
8682
  type="button"
8548
8683
  aria-expanded="true"
8684
+ aria-labelledby="tree-table-with-checkboxes-example-node-12 tree-table-with-checkboxes-example-expandable-toggle-12"
8549
8685
  aria-label="Toggle row"
8550
8686
  >
8551
- <span class="pf-v6-c-button__text">
8687
+ <span class="pf-v6-c-button__icon">
8552
8688
  <div class="pf-v6-c-table__toggle-icon">
8553
8689
  <i class="fas fa-angle-down" aria-hidden="true"></i>
8554
8690
  </div>
@@ -8583,8 +8719,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8583
8719
  type="button"
8584
8720
  aria-label="tree-table-with-checkboxes-example-12--tree-table--details-toggle"
8585
8721
  >
8586
- <span class="pf-v6-c-table__details-toggle-icon">
8587
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8722
+ <span class="pf-v6-c-button__icon">
8723
+ <span class="pf-v6-c-table__details-toggle-icon">
8724
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8725
+ </span>
8588
8726
  </span>
8589
8727
  </button>
8590
8728
  </span>
@@ -8654,8 +8792,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8654
8792
  type="button"
8655
8793
  aria-label="tree-table-with-checkboxes-example-13--tree-table--details-toggle"
8656
8794
  >
8657
- <span class="pf-v6-c-table__details-toggle-icon">
8658
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8795
+ <span class="pf-v6-c-button__icon">
8796
+ <span class="pf-v6-c-table__details-toggle-icon">
8797
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8798
+ </span>
8659
8799
  </span>
8660
8800
  </button>
8661
8801
  </span>
@@ -8725,8 +8865,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8725
8865
  type="button"
8726
8866
  aria-label="tree-table-with-checkboxes-example-14--tree-table--details-toggle"
8727
8867
  >
8728
- <span class="pf-v6-c-table__details-toggle-icon">
8729
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8868
+ <span class="pf-v6-c-button__icon">
8869
+ <span class="pf-v6-c-table__details-toggle-icon">
8870
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8871
+ </span>
8730
8872
  </span>
8731
8873
  </button>
8732
8874
  </span>
@@ -8773,10 +8915,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8773
8915
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
8774
8916
  <button
8775
8917
  class="pf-v6-c-button pf-m-plain"
8918
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-example-expandable-toggle-15&#x26;quot;
8776
8919
  type="button"
8920
+ aria-labelledby="tree-table-with-checkboxes-example-node-15 tree-table-with-checkboxes-example-expandable-toggle-15"
8777
8921
  aria-label="Toggle row"
8778
8922
  >
8779
- <span class="pf-v6-c-button__text">
8923
+ <span class="pf-v6-c-button__icon">
8780
8924
  <div class="pf-v6-c-table__toggle-icon">
8781
8925
  <i class="fas fa-angle-down" aria-hidden="true"></i>
8782
8926
  </div>
@@ -8811,8 +8955,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8811
8955
  type="button"
8812
8956
  aria-label="tree-table-with-checkboxes-example-15--tree-table--details-toggle"
8813
8957
  >
8814
- <span class="pf-v6-c-table__details-toggle-icon">
8815
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8958
+ <span class="pf-v6-c-button__icon">
8959
+ <span class="pf-v6-c-table__details-toggle-icon">
8960
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
8961
+ </span>
8816
8962
  </span>
8817
8963
  </button>
8818
8964
  </span>
@@ -8883,8 +9029,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8883
9029
  type="button"
8884
9030
  aria-label="tree-table-with-checkboxes-example-16--tree-table--details-toggle"
8885
9031
  >
8886
- <span class="pf-v6-c-table__details-toggle-icon">
8887
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9032
+ <span class="pf-v6-c-button__icon">
9033
+ <span class="pf-v6-c-table__details-toggle-icon">
9034
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9035
+ </span>
8888
9036
  </span>
8889
9037
  </button>
8890
9038
  </span>
@@ -8955,8 +9103,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
8955
9103
  type="button"
8956
9104
  aria-label="tree-table-with-checkboxes-example-17--tree-table--details-toggle"
8957
9105
  >
8958
- <span class="pf-v6-c-table__details-toggle-icon">
8959
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9106
+ <span class="pf-v6-c-button__icon">
9107
+ <span class="pf-v6-c-table__details-toggle-icon">
9108
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9109
+ </span>
8960
9110
  </span>
8961
9111
  </button>
8962
9112
  </span>
@@ -9035,11 +9185,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9035
9185
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
9036
9186
  <button
9037
9187
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
9188
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-1&#x26;quot;
9038
9189
  type="button"
9039
9190
  aria-expanded="true"
9191
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-1 tree-table-with-checkboxes-icons-example-expandable-toggle-1"
9040
9192
  aria-label="Toggle row"
9041
9193
  >
9042
- <span class="pf-v6-c-button__text">
9194
+ <span class="pf-v6-c-button__icon">
9043
9195
  <div class="pf-v6-c-table__toggle-icon">
9044
9196
  <i class="fas fa-angle-down" aria-hidden="true"></i>
9045
9197
  </div>
@@ -9077,8 +9229,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9077
9229
  type="button"
9078
9230
  aria-label="tree-table-with-checkboxes-icons-example-1--tree-table--details-toggle"
9079
9231
  >
9080
- <span class="pf-v6-c-table__details-toggle-icon">
9081
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9232
+ <span class="pf-v6-c-button__icon">
9233
+ <span class="pf-v6-c-table__details-toggle-icon">
9234
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9235
+ </span>
9082
9236
  </span>
9083
9237
  </button>
9084
9238
  </span>
@@ -9125,10 +9279,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9125
9279
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
9126
9280
  <button
9127
9281
  class="pf-v6-c-button pf-m-plain"
9282
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-2&#x26;quot;
9128
9283
  type="button"
9284
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-2 tree-table-with-checkboxes-icons-example-expandable-toggle-2"
9129
9285
  aria-label="Toggle row"
9130
9286
  >
9131
- <span class="pf-v6-c-button__text">
9287
+ <span class="pf-v6-c-button__icon">
9132
9288
  <div class="pf-v6-c-table__toggle-icon">
9133
9289
  <i class="fas fa-angle-down" aria-hidden="true"></i>
9134
9290
  </div>
@@ -9162,13 +9318,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9162
9318
  </div>
9163
9319
  <span class="pf-v6-c-table__tree-view-details-toggle">
9164
9320
  <button
9165
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
9166
- aria-expanded="true"
9321
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
9167
9322
  type="button"
9323
+ aria-expanded="true"
9168
9324
  aria-label="tree-table-with-checkboxes-icons-example-2--tree-table--details-toggle"
9169
9325
  >
9170
- <span class="pf-v6-c-table__details-toggle-icon">
9171
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9326
+ <span class="pf-v6-c-button__icon">
9327
+ <span class="pf-v6-c-table__details-toggle-icon">
9328
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9329
+ </span>
9172
9330
  </span>
9173
9331
  </button>
9174
9332
  </span>
@@ -9242,8 +9400,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9242
9400
  type="button"
9243
9401
  aria-label="tree-table-with-checkboxes-icons-example-3--tree-table--details-toggle"
9244
9402
  >
9245
- <span class="pf-v6-c-table__details-toggle-icon">
9246
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9403
+ <span class="pf-v6-c-button__icon">
9404
+ <span class="pf-v6-c-table__details-toggle-icon">
9405
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9406
+ </span>
9247
9407
  </span>
9248
9408
  </button>
9249
9409
  </span>
@@ -9317,8 +9477,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9317
9477
  type="button"
9318
9478
  aria-label="tree-table-with-checkboxes-icons-example-4--tree-table--details-toggle"
9319
9479
  >
9320
- <span class="pf-v6-c-table__details-toggle-icon">
9321
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9480
+ <span class="pf-v6-c-button__icon">
9481
+ <span class="pf-v6-c-table__details-toggle-icon">
9482
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9483
+ </span>
9322
9484
  </span>
9323
9485
  </button>
9324
9486
  </span>
@@ -9392,8 +9554,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9392
9554
  type="button"
9393
9555
  aria-label="tree-table-with-checkboxes-icons-example-5--tree-table--details-toggle"
9394
9556
  >
9395
- <span class="pf-v6-c-table__details-toggle-icon">
9396
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9557
+ <span class="pf-v6-c-button__icon">
9558
+ <span class="pf-v6-c-table__details-toggle-icon">
9559
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9560
+ </span>
9397
9561
  </span>
9398
9562
  </button>
9399
9563
  </span>
@@ -9466,8 +9630,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9466
9630
  type="button"
9467
9631
  aria-label="tree-table-with-checkboxes-icons-example-6--tree-table--details-toggle"
9468
9632
  >
9469
- <span class="pf-v6-c-table__details-toggle-icon">
9470
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9633
+ <span class="pf-v6-c-button__icon">
9634
+ <span class="pf-v6-c-table__details-toggle-icon">
9635
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9636
+ </span>
9471
9637
  </span>
9472
9638
  </button>
9473
9639
  </span>
@@ -9514,11 +9680,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9514
9680
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
9515
9681
  <button
9516
9682
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
9683
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-7&#x26;quot;
9517
9684
  type="button"
9518
9685
  aria-expanded="true"
9686
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-7 tree-table-with-checkboxes-icons-example-expandable-toggle-7"
9519
9687
  aria-label="Toggle row"
9520
9688
  >
9521
- <span class="pf-v6-c-button__text">
9689
+ <span class="pf-v6-c-button__icon">
9522
9690
  <div class="pf-v6-c-table__toggle-icon">
9523
9691
  <i class="fas fa-angle-down" aria-hidden="true"></i>
9524
9692
  </div>
@@ -9556,8 +9724,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9556
9724
  type="button"
9557
9725
  aria-label="tree-table-with-checkboxes-icons-example-7--tree-table--details-toggle"
9558
9726
  >
9559
- <span class="pf-v6-c-table__details-toggle-icon">
9560
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9727
+ <span class="pf-v6-c-button__icon">
9728
+ <span class="pf-v6-c-table__details-toggle-icon">
9729
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9730
+ </span>
9561
9731
  </span>
9562
9732
  </button>
9563
9733
  </span>
@@ -9630,8 +9800,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9630
9800
  type="button"
9631
9801
  aria-label="tree-table-with-checkboxes-icons-example-8--tree-table--details-toggle"
9632
9802
  >
9633
- <span class="pf-v6-c-table__details-toggle-icon">
9634
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9803
+ <span class="pf-v6-c-button__icon">
9804
+ <span class="pf-v6-c-table__details-toggle-icon">
9805
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9806
+ </span>
9635
9807
  </span>
9636
9808
  </button>
9637
9809
  </span>
@@ -9677,11 +9849,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9677
9849
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
9678
9850
  <button
9679
9851
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
9852
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-9&#x26;quot;
9680
9853
  type="button"
9681
9854
  aria-expanded="true"
9855
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-9 tree-table-with-checkboxes-icons-example-expandable-toggle-9"
9682
9856
  aria-label="Toggle row"
9683
9857
  >
9684
- <span class="pf-v6-c-button__text">
9858
+ <span class="pf-v6-c-button__icon">
9685
9859
  <div class="pf-v6-c-table__toggle-icon">
9686
9860
  <i class="fas fa-angle-down" aria-hidden="true"></i>
9687
9861
  </div>
@@ -9719,8 +9893,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9719
9893
  type="button"
9720
9894
  aria-label="tree-table-with-checkboxes-icons-example-9--tree-table--details-toggle"
9721
9895
  >
9722
- <span class="pf-v6-c-table__details-toggle-icon">
9723
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9896
+ <span class="pf-v6-c-button__icon">
9897
+ <span class="pf-v6-c-table__details-toggle-icon">
9898
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9899
+ </span>
9724
9900
  </span>
9725
9901
  </button>
9726
9902
  </span>
@@ -9789,13 +9965,15 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9789
9965
  </div>
9790
9966
  <span class="pf-v6-c-table__tree-view-details-toggle">
9791
9967
  <button
9792
- class="pf-v6-c-button pf-m-plain pf-m-expanded"
9793
- aria-expanded="true"
9968
+ class="pf-v6-c-button pf-m-expanded pf-m-plain"
9794
9969
  type="button"
9970
+ aria-expanded="true"
9795
9971
  aria-label="tree-table-with-checkboxes-icons-example-10--tree-table--details-toggle"
9796
9972
  >
9797
- <span class="pf-v6-c-table__details-toggle-icon">
9798
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9973
+ <span class="pf-v6-c-button__icon">
9974
+ <span class="pf-v6-c-table__details-toggle-icon">
9975
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
9976
+ </span>
9799
9977
  </span>
9800
9978
  </button>
9801
9979
  </span>
@@ -9868,8 +10046,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9868
10046
  type="button"
9869
10047
  aria-label="tree-table-with-checkboxes-icons-example-11--tree-table--details-toggle"
9870
10048
  >
9871
- <span class="pf-v6-c-table__details-toggle-icon">
9872
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10049
+ <span class="pf-v6-c-button__icon">
10050
+ <span class="pf-v6-c-table__details-toggle-icon">
10051
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10052
+ </span>
9873
10053
  </span>
9874
10054
  </button>
9875
10055
  </span>
@@ -9916,11 +10096,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9916
10096
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
9917
10097
  <button
9918
10098
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
10099
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-12&#x26;quot;
9919
10100
  type="button"
9920
10101
  aria-expanded="true"
10102
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-12 tree-table-with-checkboxes-icons-example-expandable-toggle-12"
9921
10103
  aria-label="Toggle row"
9922
10104
  >
9923
- <span class="pf-v6-c-button__text">
10105
+ <span class="pf-v6-c-button__icon">
9924
10106
  <div class="pf-v6-c-table__toggle-icon">
9925
10107
  <i class="fas fa-angle-down" aria-hidden="true"></i>
9926
10108
  </div>
@@ -9958,8 +10140,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
9958
10140
  type="button"
9959
10141
  aria-label="tree-table-with-checkboxes-icons-example-12--tree-table--details-toggle"
9960
10142
  >
9961
- <span class="pf-v6-c-table__details-toggle-icon">
9962
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10143
+ <span class="pf-v6-c-button__icon">
10144
+ <span class="pf-v6-c-table__details-toggle-icon">
10145
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10146
+ </span>
9963
10147
  </span>
9964
10148
  </button>
9965
10149
  </span>
@@ -10032,8 +10216,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10032
10216
  type="button"
10033
10217
  aria-label="tree-table-with-checkboxes-icons-example-13--tree-table--details-toggle"
10034
10218
  >
10035
- <span class="pf-v6-c-table__details-toggle-icon">
10036
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10219
+ <span class="pf-v6-c-button__icon">
10220
+ <span class="pf-v6-c-table__details-toggle-icon">
10221
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10222
+ </span>
10037
10223
  </span>
10038
10224
  </button>
10039
10225
  </span>
@@ -10106,8 +10292,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10106
10292
  type="button"
10107
10293
  aria-label="tree-table-with-checkboxes-icons-example-14--tree-table--details-toggle"
10108
10294
  >
10109
- <span class="pf-v6-c-table__details-toggle-icon">
10110
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10295
+ <span class="pf-v6-c-button__icon">
10296
+ <span class="pf-v6-c-table__details-toggle-icon">
10297
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10298
+ </span>
10111
10299
  </span>
10112
10300
  </button>
10113
10301
  </span>
@@ -10154,10 +10342,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10154
10342
  <span class="pf-v6-c-table__td pf-v6-c-table__toggle">
10155
10343
  <button
10156
10344
  class="pf-v6-c-button pf-m-plain"
10345
+ id&#x26;#x3D;&#x26;quot;tree-table-with-checkboxes-icons-example-expandable-toggle-15&#x26;quot;
10157
10346
  type="button"
10347
+ aria-labelledby="tree-table-with-checkboxes-icons-example-node-15 tree-table-with-checkboxes-icons-example-expandable-toggle-15"
10158
10348
  aria-label="Toggle row"
10159
10349
  >
10160
- <span class="pf-v6-c-button__text">
10350
+ <span class="pf-v6-c-button__icon">
10161
10351
  <div class="pf-v6-c-table__toggle-icon">
10162
10352
  <i class="fas fa-angle-down" aria-hidden="true"></i>
10163
10353
  </div>
@@ -10195,8 +10385,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10195
10385
  type="button"
10196
10386
  aria-label="tree-table-with-checkboxes-icons-example-15--tree-table--details-toggle"
10197
10387
  >
10198
- <span class="pf-v6-c-table__details-toggle-icon">
10199
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10388
+ <span class="pf-v6-c-button__icon">
10389
+ <span class="pf-v6-c-table__details-toggle-icon">
10390
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10391
+ </span>
10200
10392
  </span>
10201
10393
  </button>
10202
10394
  </span>
@@ -10270,8 +10462,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10270
10462
  type="button"
10271
10463
  aria-label="tree-table-with-checkboxes-icons-example-16--tree-table--details-toggle"
10272
10464
  >
10273
- <span class="pf-v6-c-table__details-toggle-icon">
10274
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10465
+ <span class="pf-v6-c-button__icon">
10466
+ <span class="pf-v6-c-table__details-toggle-icon">
10467
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10468
+ </span>
10275
10469
  </span>
10276
10470
  </button>
10277
10471
  </span>
@@ -10345,8 +10539,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10345
10539
  type="button"
10346
10540
  aria-label="tree-table-with-checkboxes-icons-example-17--tree-table--details-toggle"
10347
10541
  >
10348
- <span class="pf-v6-c-table__details-toggle-icon">
10349
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10542
+ <span class="pf-v6-c-button__icon">
10543
+ <span class="pf-v6-c-table__details-toggle-icon">
10544
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10545
+ </span>
10350
10546
  </span>
10351
10547
  </button>
10352
10548
  </span>
@@ -10423,8 +10619,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10423
10619
  type="button"
10424
10620
  aria-label="tree-table-indent-example-1--tree-table--details-toggle"
10425
10621
  >
10426
- <span class="pf-v6-c-table__details-toggle-icon">
10427
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10622
+ <span class="pf-v6-c-button__icon">
10623
+ <span class="pf-v6-c-table__details-toggle-icon">
10624
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10625
+ </span>
10428
10626
  </span>
10429
10627
  </button>
10430
10628
  </span>
@@ -10458,8 +10656,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10458
10656
  type="button"
10459
10657
  aria-label="tree-table-indent-example-2--tree-table--details-toggle"
10460
10658
  >
10461
- <span class="pf-v6-c-table__details-toggle-icon">
10462
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10659
+ <span class="pf-v6-c-button__icon">
10660
+ <span class="pf-v6-c-table__details-toggle-icon">
10661
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10662
+ </span>
10463
10663
  </span>
10464
10664
  </button>
10465
10665
  </span>
@@ -10493,8 +10693,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10493
10693
  type="button"
10494
10694
  aria-label="tree-table-indent-example-3--tree-table--details-toggle"
10495
10695
  >
10496
- <span class="pf-v6-c-table__details-toggle-icon">
10497
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10696
+ <span class="pf-v6-c-button__icon">
10697
+ <span class="pf-v6-c-table__details-toggle-icon">
10698
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10699
+ </span>
10498
10700
  </span>
10499
10701
  </button>
10500
10702
  </span>
@@ -10528,8 +10730,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10528
10730
  type="button"
10529
10731
  aria-label="tree-table-indent-example-4--tree-table--details-toggle"
10530
10732
  >
10531
- <span class="pf-v6-c-table__details-toggle-icon">
10532
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10733
+ <span class="pf-v6-c-button__icon">
10734
+ <span class="pf-v6-c-table__details-toggle-icon">
10735
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10736
+ </span>
10533
10737
  </span>
10534
10738
  </button>
10535
10739
  </span>
@@ -10563,8 +10767,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10563
10767
  type="button"
10564
10768
  aria-label="tree-table-indent-example-5--tree-table--details-toggle"
10565
10769
  >
10566
- <span class="pf-v6-c-table__details-toggle-icon">
10567
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10770
+ <span class="pf-v6-c-button__icon">
10771
+ <span class="pf-v6-c-table__details-toggle-icon">
10772
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10773
+ </span>
10568
10774
  </span>
10569
10775
  </button>
10570
10776
  </span>
@@ -10598,8 +10804,10 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
10598
10804
  type="button"
10599
10805
  aria-label="tree-table-indent-example-6--tree-table--details-toggle"
10600
10806
  >
10601
- <span class="pf-v6-c-table__details-toggle-icon">
10602
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10807
+ <span class="pf-v6-c-button__icon">
10808
+ <span class="pf-v6-c-table__details-toggle-icon">
10809
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
10810
+ </span>
10603
10811
  </span>
10604
10812
  </button>
10605
10813
  </span>
@@ -11420,11 +11628,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
11420
11628
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
11421
11629
  <button
11422
11630
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
11631
+ id&#x26;#x3D;&#x26;quot;borderless-table-expandable-expandable-toggle-1&#x26;quot;
11423
11632
  type="button"
11424
11633
  aria-expanded="true"
11634
+ aria-labelledby="borderless-table-expandable-node-1 borderless-table-expandable-expandable-toggle-1"
11425
11635
  aria-label="Toggle row"
11426
11636
  >
11427
- <span class="pf-v6-c-button__text">
11637
+ <span class="pf-v6-c-button__icon">
11428
11638
  <div class="pf-v6-c-table__toggle-icon">
11429
11639
  <i class="fas fa-angle-down" aria-hidden="true"></i>
11430
11640
  </div>
@@ -11504,10 +11714,12 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
11504
11714
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
11505
11715
  <button
11506
11716
  class="pf-v6-c-button pf-m-plain"
11717
+ id&#x26;#x3D;&#x26;quot;borderless-table-expandable-expandable-toggle-2&#x26;quot;
11507
11718
  type="button"
11719
+ aria-labelledby="borderless-table-expandable-node-2 borderless-table-expandable-expandable-toggle-2"
11508
11720
  aria-label="Toggle row"
11509
11721
  >
11510
- <span class="pf-v6-c-button__text">
11722
+ <span class="pf-v6-c-button__icon">
11511
11723
  <div class="pf-v6-c-table__toggle-icon">
11512
11724
  <i class="fas fa-angle-down" aria-hidden="true"></i>
11513
11725
  </div>
@@ -11579,11 +11791,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
11579
11791
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
11580
11792
  <button
11581
11793
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
11794
+ id&#x26;#x3D;&#x26;quot;borderless-table-expandable-expandable-toggle-3&#x26;quot;
11582
11795
  type="button"
11583
11796
  aria-expanded="true"
11797
+ aria-labelledby="borderless-table-expandable-node-3 borderless-table-expandable-expandable-toggle-3"
11584
11798
  aria-label="Toggle row"
11585
11799
  >
11586
- <span class="pf-v6-c-button__text">
11800
+ <span class="pf-v6-c-button__icon">
11587
11801
  <div class="pf-v6-c-table__toggle-icon">
11588
11802
  <i class="fas fa-angle-down" aria-hidden="true"></i>
11589
11803
  </div>
@@ -11658,11 +11872,13 @@ Note: To apply padding to `.pf-v6-c-table__expandable-row`, wrap the content in
11658
11872
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
11659
11873
  <button
11660
11874
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
11875
+ id&#x26;#x3D;&#x26;quot;borderless-table-expandable-expandable-toggle-4&#x26;quot;
11661
11876
  type="button"
11662
11877
  aria-expanded="true"
11878
+ aria-labelledby="borderless-table-expandable-node-4 borderless-table-expandable-expandable-toggle-4"
11663
11879
  aria-label="Toggle row"
11664
11880
  >
11665
- <span class="pf-v6-c-button__text">
11881
+ <span class="pf-v6-c-button__icon">
11666
11882
  <div class="pf-v6-c-table__toggle-icon">
11667
11883
  <i class="fas fa-angle-down" aria-hidden="true"></i>
11668
11884
  </div>
@@ -17887,11 +18103,13 @@ For sticky columns to function correctly, the parent table's width must be contr
17887
18103
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
17888
18104
  <button
17889
18105
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
18106
+ id&#x26;#x3D;&#x26;quot;nested-columns-expandable-example-expandable-toggle-1&#x26;quot;
17890
18107
  type="button"
17891
18108
  aria-expanded="true"
18109
+ aria-labelledby="nested-columns-expandable-example-node-1 nested-columns-expandable-example-expandable-toggle-1"
17892
18110
  aria-label="Toggle row"
17893
18111
  >
17894
- <span class="pf-v6-c-button__text">
18112
+ <span class="pf-v6-c-button__icon">
17895
18113
  <div class="pf-v6-c-table__toggle-icon">
17896
18114
  <i class="fas fa-angle-down" aria-hidden="true"></i>
17897
18115
  </div>
@@ -17970,10 +18188,12 @@ For sticky columns to function correctly, the parent table's width must be contr
17970
18188
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
17971
18189
  <button
17972
18190
  class="pf-v6-c-button pf-m-plain"
18191
+ id&#x26;#x3D;&#x26;quot;nested-columns-expandable-example-expandable-toggle-2&#x26;quot;
17973
18192
  type="button"
18193
+ aria-labelledby="nested-columns-expandable-example-node-2 nested-columns-expandable-example-expandable-toggle-2"
17974
18194
  aria-label="Toggle row"
17975
18195
  >
17976
- <span class="pf-v6-c-button__text">
18196
+ <span class="pf-v6-c-button__icon">
17977
18197
  <div class="pf-v6-c-table__toggle-icon">
17978
18198
  <i class="fas fa-angle-down" aria-hidden="true"></i>
17979
18199
  </div>
@@ -18049,10 +18269,12 @@ For sticky columns to function correctly, the parent table's width must be contr
18049
18269
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
18050
18270
  <button
18051
18271
  class="pf-v6-c-button pf-m-plain"
18272
+ id&#x26;#x3D;&#x26;quot;nested-columns-expandable-example-expandable-toggle-3&#x26;quot;
18052
18273
  type="button"
18274
+ aria-labelledby="nested-columns-expandable-example-node-3 nested-columns-expandable-example-expandable-toggle-3"
18053
18275
  aria-label="Toggle row"
18054
18276
  >
18055
- <span class="pf-v6-c-button__text">
18277
+ <span class="pf-v6-c-button__icon">
18056
18278
  <div class="pf-v6-c-table__toggle-icon">
18057
18279
  <i class="fas fa-angle-down" aria-hidden="true"></i>
18058
18280
  </div>
@@ -19782,7 +20004,7 @@ For sticky columns to function correctly, the parent table's width must be contr
19782
20004
  id="table-favorites-favorite-button1"
19783
20005
  aria-labelledby="table-favorites-node1 table-favorites-favorite-button1"
19784
20006
  >
19785
- <span class="pf-v6-c-button__text">
20007
+ <span class="pf-v6-c-button__icon">
19786
20008
  <i class="fas fa-star" aria-hidden="true"></i>
19787
20009
  </span>
19788
20010
  </button>
@@ -19839,7 +20061,7 @@ For sticky columns to function correctly, the parent table's width must be contr
19839
20061
  id="table-favorites-favorite-button2"
19840
20062
  aria-labelledby="table-favorites-node2 table-favorites-favorite-button2"
19841
20063
  >
19842
- <span class="pf-v6-c-button__text">
20064
+ <span class="pf-v6-c-button__icon">
19843
20065
  <i class="fas fa-star" aria-hidden="true"></i>
19844
20066
  </span>
19845
20067
  </button>
@@ -19897,7 +20119,7 @@ For sticky columns to function correctly, the parent table's width must be contr
19897
20119
  id="table-favorites-favorite-button3"
19898
20120
  aria-labelledby="table-favorites-node3 table-favorites-favorite-button3"
19899
20121
  >
19900
- <span class="pf-v6-c-button__text">
20122
+ <span class="pf-v6-c-button__icon">
19901
20123
  <i class="fas fa-star" aria-hidden="true"></i>
19902
20124
  </span>
19903
20125
  </button>
@@ -19952,7 +20174,7 @@ For sticky columns to function correctly, the parent table's width must be contr
19952
20174
  id="table-favorites-favorite-button4"
19953
20175
  aria-labelledby="table-favorites-node4 table-favorites-favorite-button4"
19954
20176
  >
19955
- <span class="pf-v6-c-button__text">
20177
+ <span class="pf-v6-c-button__icon">
19956
20178
  <i class="fas fa-star" aria-hidden="true"></i>
19957
20179
  </span>
19958
20180
  </button>
@@ -20011,7 +20233,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20011
20233
  type="button"
20012
20234
  aria-label="Favorite all"
20013
20235
  >
20014
- <span class="pf-v6-c-button__text">
20236
+ <span class="pf-v6-c-button__icon">
20015
20237
  <i class="fas fa-star" aria-hidden="true"></i>
20016
20238
  </span>
20017
20239
  </button>
@@ -20022,7 +20244,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20022
20244
  type="button"
20023
20245
  aria-label="Sort favorites"
20024
20246
  >
20025
- <span class="pf-v6-c-button__text">
20247
+ <span class="pf-v6-c-button__icon">
20026
20248
  <span class="pf-v6-c-table__sort-indicator">
20027
20249
  <i class="fas fa-long-arrow-alt-down"></i>
20028
20250
  </span>
@@ -20061,7 +20283,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20061
20283
  id="table-favorites-sortable-favorite-button1"
20062
20284
  aria-labelledby="table-favorites-sortable-node1 table-favorites-sortable-favorite-button1"
20063
20285
  >
20064
- <span class="pf-v6-c-button__text">
20286
+ <span class="pf-v6-c-button__icon">
20065
20287
  <i class="fas fa-star" aria-hidden="true"></i>
20066
20288
  </span>
20067
20289
  </button>
@@ -20093,7 +20315,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20093
20315
  id="table-favorites-sortable-favorite-button3"
20094
20316
  aria-labelledby="table-favorites-sortable-node3 table-favorites-sortable-favorite-button3"
20095
20317
  >
20096
- <span class="pf-v6-c-button__text">
20318
+ <span class="pf-v6-c-button__icon">
20097
20319
  <i class="fas fa-star" aria-hidden="true"></i>
20098
20320
  </span>
20099
20321
  </button>
@@ -20120,7 +20342,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20120
20342
  id="table-favorites-sortable-favorite-button2"
20121
20343
  aria-labelledby="table-favorites-sortable-node2 table-favorites-sortable-favorite-button2"
20122
20344
  >
20123
- <span class="pf-v6-c-button__text">
20345
+ <span class="pf-v6-c-button__icon">
20124
20346
  <i class="fas fa-star" aria-hidden="true"></i>
20125
20347
  </span>
20126
20348
  </button>
@@ -20147,7 +20369,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20147
20369
  id="table-favorites-sortable-favorite-button4"
20148
20370
  aria-labelledby="table-favorites-sortable-node4 table-favorites-sortable-favorite-button4"
20149
20371
  >
20150
- <span class="pf-v6-c-button__text">
20372
+ <span class="pf-v6-c-button__icon">
20151
20373
  <i class="fas fa-star" aria-hidden="true"></i>
20152
20374
  </span>
20153
20375
  </button>
@@ -20174,7 +20396,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20174
20396
  id="table-favorites-sortable-favorite-button5"
20175
20397
  aria-labelledby="table-favorites-sortable-node5 table-favorites-sortable-favorite-button5"
20176
20398
  >
20177
- <span class="pf-v6-c-button__text">
20399
+ <span class="pf-v6-c-button__icon">
20178
20400
  <i class="fas fa-star" aria-hidden="true"></i>
20179
20401
  </span>
20180
20402
  </button>
@@ -20261,7 +20483,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20261
20483
  id="table-draggable-rows-row-1-draggable-button"
20262
20484
  aria-labelledby="table-draggable-rows-row-1-draggable-button table-draggable-rows-row-1-node"
20263
20485
  >
20264
- <span class="pf-v6-c-button__text">
20486
+ <span class="pf-v6-c-button__icon">
20265
20487
  <i class="fas fa-grip-vertical" aria-hidden="true"></i>
20266
20488
  </span>
20267
20489
  </button>
@@ -20290,7 +20512,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20290
20512
  id="table-draggable-rows-row-2-draggable-button"
20291
20513
  aria-labelledby="table-draggable-rows-row-2-draggable-button table-draggable-rows-row-2-node"
20292
20514
  >
20293
- <span class="pf-v6-c-button__text">
20515
+ <span class="pf-v6-c-button__icon">
20294
20516
  <i class="fas fa-grip-vertical" aria-hidden="true"></i>
20295
20517
  </span>
20296
20518
  </button>
@@ -20320,7 +20542,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20320
20542
  id="table-draggable-rows-row-3-draggable-button"
20321
20543
  aria-labelledby="table-draggable-rows-row-3-draggable-button table-draggable-rows-row-3-node"
20322
20544
  >
20323
- <span class="pf-v6-c-button__text">
20545
+ <span class="pf-v6-c-button__icon">
20324
20546
  <i class="fas fa-grip-vertical" aria-hidden="true"></i>
20325
20547
  </span>
20326
20548
  </button>
@@ -20349,7 +20571,7 @@ For sticky columns to function correctly, the parent table's width must be contr
20349
20571
  id="table-draggable-rows-row-4-draggable-button"
20350
20572
  aria-labelledby="table-draggable-rows-row-4-draggable-button table-draggable-rows-row-4-node"
20351
20573
  >
20352
- <span class="pf-v6-c-button__text">
20574
+ <span class="pf-v6-c-button__icon">
20353
20575
  <i class="fas fa-grip-vertical" aria-hidden="true"></i>
20354
20576
  </span>
20355
20577
  </button>
@@ -20582,11 +20804,13 @@ Basic striped table rows are supported on tables with a single `<tbody>` element
20582
20804
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
20583
20805
  <button
20584
20806
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
20807
+ id&#x26;#x3D;&#x26;quot;table-striped-expandable-expandable-toggle-1&#x26;quot;
20585
20808
  type="button"
20586
20809
  aria-expanded="true"
20810
+ aria-labelledby="table-striped-expandable-node-1 table-striped-expandable-expandable-toggle-1"
20587
20811
  aria-label="Toggle row"
20588
20812
  >
20589
- <span class="pf-v6-c-button__text">
20813
+ <span class="pf-v6-c-button__icon">
20590
20814
  <div class="pf-v6-c-table__toggle-icon">
20591
20815
  <i class="fas fa-angle-down" aria-hidden="true"></i>
20592
20816
  </div>
@@ -20666,10 +20890,12 @@ Basic striped table rows are supported on tables with a single `<tbody>` element
20666
20890
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
20667
20891
  <button
20668
20892
  class="pf-v6-c-button pf-m-plain"
20893
+ id&#x26;#x3D;&#x26;quot;table-striped-expandable-expandable-toggle-2&#x26;quot;
20669
20894
  type="button"
20895
+ aria-labelledby="table-striped-expandable-node-2 table-striped-expandable-expandable-toggle-2"
20670
20896
  aria-label="Toggle row"
20671
20897
  >
20672
- <span class="pf-v6-c-button__text">
20898
+ <span class="pf-v6-c-button__icon">
20673
20899
  <div class="pf-v6-c-table__toggle-icon">
20674
20900
  <i class="fas fa-angle-down" aria-hidden="true"></i>
20675
20901
  </div>
@@ -20741,11 +20967,13 @@ Basic striped table rows are supported on tables with a single `<tbody>` element
20741
20967
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
20742
20968
  <button
20743
20969
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
20970
+ id&#x26;#x3D;&#x26;quot;table-striped-expandable-expandable-toggle-3&#x26;quot;
20744
20971
  type="button"
20745
20972
  aria-expanded="true"
20973
+ aria-labelledby="table-striped-expandable-node-3 table-striped-expandable-expandable-toggle-3"
20746
20974
  aria-label="Toggle row"
20747
20975
  >
20748
- <span class="pf-v6-c-button__text">
20976
+ <span class="pf-v6-c-button__icon">
20749
20977
  <div class="pf-v6-c-table__toggle-icon">
20750
20978
  <i class="fas fa-angle-down" aria-hidden="true"></i>
20751
20979
  </div>
@@ -20820,11 +21048,13 @@ Basic striped table rows are supported on tables with a single `<tbody>` element
20820
21048
  <td class="pf-v6-c-table__td pf-v6-c-table__toggle" role="cell">
20821
21049
  <button
20822
21050
  class="pf-v6-c-button pf-m-expanded pf-m-plain"
21051
+ id&#x26;#x3D;&#x26;quot;table-striped-expandable-expandable-toggle-4&#x26;quot;
20823
21052
  type="button"
20824
21053
  aria-expanded="true"
21054
+ aria-labelledby="table-striped-expandable-node-4 table-striped-expandable-expandable-toggle-4"
20825
21055
  aria-label="Toggle row"
20826
21056
  >
20827
- <span class="pf-v6-c-button__text">
21057
+ <span class="pf-v6-c-button__icon">
20828
21058
  <div class="pf-v6-c-table__toggle-icon">
20829
21059
  <i class="fas fa-angle-down" aria-hidden="true"></i>
20830
21060
  </div>