@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/CalendarMonth/examples/CalendarMonth.md CHANGED
@@ -16,7 +16,7 @@ cssPrefix: pf-v6-c-calendar-month
16
16
  type="button"
17
17
  aria-label="Previous month"
18
18
  >
19
- <span class="pf-v6-c-button__text">
19
+ <span class="pf-v6-c-button__icon">
20
20
  <i class="fas fa-angle-left" aria-hidden="true"></i>
21
21
  </span>
22
22
  </button>
@@ -58,7 +58,7 @@ cssPrefix: pf-v6-c-calendar-month
58
58
  type="button"
59
59
  aria-label="Next month"
60
60
  >
61
- <span class="pf-v6-c-button__text">
61
+ <span class="pf-v6-c-button__icon">
62
62
  <i class="fas fa-angle-right" aria-hidden="true"></i>
63
63
  </span>
64
64
  </button>
@@ -370,7 +370,7 @@ cssPrefix: pf-v6-c-calendar-month
370
370
  type="button"
371
371
  aria-label="Previous month"
372
372
  >
373
- <span class="pf-v6-c-button__text">
373
+ <span class="pf-v6-c-button__icon">
374
374
  <i class="fas fa-angle-left" aria-hidden="true"></i>
375
375
  </span>
376
376
  </button>
@@ -412,7 +412,7 @@ cssPrefix: pf-v6-c-calendar-month
412
412
  type="button"
413
413
  aria-label="Next month"
414
414
  >
415
- <span class="pf-v6-c-button__text">
415
+ <span class="pf-v6-c-button__icon">
416
416
  <i class="fas fa-angle-right" aria-hidden="true"></i>
417
417
  </span>
418
418
  </button>
@@ -749,7 +749,7 @@ cssPrefix: pf-v6-c-calendar-month
749
749
  type="button"
750
750
  aria-label="Previous month"
751
751
  >
752
- <span class="pf-v6-c-button__text">
752
+ <span class="pf-v6-c-button__icon">
753
753
  <i class="fas fa-angle-left" aria-hidden="true"></i>
754
754
  </span>
755
755
  </button>
@@ -791,7 +791,7 @@ cssPrefix: pf-v6-c-calendar-month
791
791
  type="button"
792
792
  aria-label="Next month"
793
793
  >
794
- <span class="pf-v6-c-button__text">
794
+ <span class="pf-v6-c-button__icon">
795
795
  <i class="fas fa-angle-right" aria-hidden="true"></i>
796
796
  </span>
797
797
  </button>
@@ -1128,7 +1128,7 @@ cssPrefix: pf-v6-c-calendar-month
1128
1128
  type="button"
1129
1129
  aria-label="Previous month"
1130
1130
  >
1131
- <span class="pf-v6-c-button__text">
1131
+ <span class="pf-v6-c-button__icon">
1132
1132
  <i class="fas fa-angle-left" aria-hidden="true"></i>
1133
1133
  </span>
1134
1134
  </button>
@@ -1170,7 +1170,7 @@ cssPrefix: pf-v6-c-calendar-month
1170
1170
  type="button"
1171
1171
  aria-label="Next month"
1172
1172
  >
1173
- <span class="pf-v6-c-button__text">
1173
+ <span class="pf-v6-c-button__icon">
1174
1174
  <i class="fas fa-angle-right" aria-hidden="true"></i>
1175
1175
  </span>
1176
1176
  </button>
package/docs/components/Card/examples/Card.md CHANGED
@@ -1004,7 +1004,7 @@ cssPrefix: pf-v6-c-card
1004
1004
  id="card-clickable-selectable-example-title"
1005
1005
  >
1006
1006
  <h2 class="pf-v6-c-card__title-text">
1007
- <button class="pf-v6-c-button pf-m-inline pf-m-link">
1007
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
1008
1008
  <span class="pf-v6-c-button__text">Title</span>
1009
1009
  </button>
1010
1010
  </h2>
@@ -1045,7 +1045,7 @@ cssPrefix: pf-v6-c-card
1045
1045
  id="card-clickable-selectable-current-example-title"
1046
1046
  >
1047
1047
  <h2 class="pf-v6-c-card__title-text">
1048
- <button class="pf-v6-c-button pf-m-inline pf-m-link">
1048
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
1049
1049
  <span class="pf-v6-c-button__text">Current card (clicked)</span>
1050
1050
  </button>
1051
1051
  </h2>
@@ -1087,7 +1087,11 @@ cssPrefix: pf-v6-c-card
1087
1087
  id="card-clickable-selectable-example-disabled-title"
1088
1088
  >
1089
1089
  <h2 class="pf-v6-c-card__title-text">
1090
- <button class="pf-v6-c-button pf-m-inline pf-m-link pf-m-disabled">
1090
+ <button
1091
+ class="pf-v6-c-button pf-m-inline pf-m-link"
1092
+ type="button"
1093
+ disabled
1094
+ >
1091
1095
  <span class="pf-v6-c-button__text">Disabled card</span>
1092
1096
  </button>
1093
1097
  </h2>
@@ -1130,7 +1134,11 @@ cssPrefix: pf-v6-c-card
1130
1134
  id="card-clickable-selectable-example-selected-disabled-title"
1131
1135
  >
1132
1136
  <h2 class="pf-v6-c-card__title-text">
1133
- <button class="pf-v6-c-button pf-m-inline pf-m-link pf-m-disabled">
1137
+ <button
1138
+ class="pf-v6-c-button pf-m-inline pf-m-link"
1139
+ type="button"
1140
+ disabled
1141
+ >
1134
1142
  <span class="pf-v6-c-button__text">Selected but disabled card</span>
1135
1143
  </button>
1136
1144
  </h2>
@@ -1178,7 +1186,7 @@ cssPrefix: pf-v6-c-card
1178
1186
  id="card-clickable-selectable-secondary-example-title"
1179
1187
  >
1180
1188
  <h2 class="pf-v6-c-card__title-text">
1181
- <button class="pf-v6-c-button pf-m-inline pf-m-link">
1189
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
1182
1190
  <span class="pf-v6-c-button__text">Title</span>
1183
1191
  </button>
1184
1192
  </h2>
@@ -1219,7 +1227,7 @@ cssPrefix: pf-v6-c-card
1219
1227
  id="card-clickable-selectable-secondary-current-example-title"
1220
1228
  >
1221
1229
  <h2 class="pf-v6-c-card__title-text">
1222
- <button class="pf-v6-c-button pf-m-inline pf-m-link">
1230
+ <button class="pf-v6-c-button pf-m-inline pf-m-link" type="button">
1223
1231
  <span class="pf-v6-c-button__text">Current card (clicked)</span>
1224
1232
  </button>
1225
1233
  </h2>
@@ -1261,7 +1269,11 @@ cssPrefix: pf-v6-c-card
1261
1269
  id="card-clickable-selectable-secondary-example-disabled-title"
1262
1270
  >
1263
1271
  <h2 class="pf-v6-c-card__title-text">
1264
- <button class="pf-v6-c-button pf-m-inline pf-m-link pf-m-disabled">
1272
+ <button
1273
+ class="pf-v6-c-button pf-m-inline pf-m-link"
1274
+ type="button"
1275
+ disabled
1276
+ >
1265
1277
  <span class="pf-v6-c-button__text">Disabled card</span>
1266
1278
  </button>
1267
1279
  </h2>
@@ -1304,7 +1316,11 @@ cssPrefix: pf-v6-c-card
1304
1316
  id="card-clickable-selectable-secondary-example-selected-disabled-title"
1305
1317
  >
1306
1318
  <h2 class="pf-v6-c-card__title-text">
1307
- <button class="pf-v6-c-button pf-m-inline pf-m-link pf-m-disabled">
1319
+ <button
1320
+ class="pf-v6-c-button pf-m-inline pf-m-link"
1321
+ type="button"
1322
+ disabled
1323
+ >
1308
1324
  <span class="pf-v6-c-button__text">Selected but disabled card</span>
1309
1325
  </button>
1310
1326
  </h2>
@@ -1352,12 +1368,12 @@ cssPrefix: pf-v6-c-card
1352
1368
  <div class="pf-v6-c-card__header-toggle">
1353
1369
  <button
1354
1370
  class="pf-v6-c-button pf-m-plain"
1371
+ id&#x26;#x3D;&#x26;quot;card-expandable-example-toggle&#x26;quot;
1355
1372
  type="button"
1356
- aria-label="Details"
1357
- id="card-expandable-example-toggle"
1358
1373
  aria-labelledby="card-expandable-example-title card-expandable-example-toggle"
1374
+ aria-label="Details"
1359
1375
  >
1360
- <span class="pf-v6-c-button__text">
1376
+ <span class="pf-v6-c-button__icon pf-m-start">
1361
1377
  <span class="pf-v6-c-card__header-toggle-icon">
1362
1378
  <i class="fas fa-angle-right" aria-hidden="true"></i>
1363
1379
  </span>
@@ -1408,12 +1424,12 @@ cssPrefix: pf-v6-c-card
1408
1424
  <div class="pf-v6-c-card__header-toggle">
1409
1425
  <button
1410
1426
  class="pf-v6-c-button pf-m-plain"
1427
+ id&#x26;#x3D;&#x26;quot;card-expandable-image-example-toggle&#x26;quot;
1411
1428
  type="button"
1412
- aria-label="Details"
1413
- id="card-expandable-image-example-toggle"
1414
1429
  aria-labelledby="card-expandable-image-example-title card-expandable-image-example-toggle"
1430
+ aria-label="Details"
1415
1431
  >
1416
- <span class="pf-v6-c-button__text">
1432
+ <span class="pf-v6-c-button__icon pf-m-start">
1417
1433
  <span class="pf-v6-c-card__header-toggle-icon">
1418
1434
  <i class="fas fa-angle-right" aria-hidden="true"></i>
1419
1435
  </span>
@@ -1463,12 +1479,12 @@ cssPrefix: pf-v6-c-card
1463
1479
  <div class="pf-v6-c-card__header-toggle">
1464
1480
  <button
1465
1481
  class="pf-v6-c-button pf-m-plain"
1482
+ id&#x26;#x3D;&#x26;quot;card-expanded-example-toggle&#x26;quot;
1466
1483
  type="button"
1467
- aria-label="Details"
1468
- id="card-expanded-example-toggle"
1469
1484
  aria-labelledby="card-expanded-example-title card-expanded-example-toggle"
1485
+ aria-label="Details"
1470
1486
  >
1471
- <span class="pf-v6-c-button__text">
1487
+ <span class="pf-v6-c-button__icon pf-m-start">
1472
1488
  <span class="pf-v6-c-card__header-toggle-icon">
1473
1489
  <i class="fas fa-angle-right" aria-hidden="true"></i>
1474
1490
  </span>
@@ -1595,12 +1611,12 @@ cssPrefix: pf-v6-c-card
1595
1611
  <div class="pf-v6-c-card__header-toggle">
1596
1612
  <button
1597
1613
  class="pf-v6-c-button pf-m-plain"
1614
+ id&#x26;#x3D;&#x26;quot;card-toggle-on-right-example-toggle&#x26;quot;
1598
1615
  type="button"
1599
- aria-label="Details"
1600
- id="card-toggle-on-right-example-toggle"
1601
1616
  aria-labelledby="card-toggle-on-right-example-title card-toggle-on-right-example-toggle"
1617
+ aria-label="Details"
1602
1618
  >
1603
- <span class="pf-v6-c-button__text">
1619
+ <span class="pf-v6-c-button__icon pf-m-start">
1604
1620
  <span class="pf-v6-c-card__header-toggle-icon">
1605
1621
  <i class="fas fa-angle-right" aria-hidden="true"></i>
1606
1622
  </span>
package/docs/components/ClipboardCopy/examples/ClipboardCopy.md CHANGED
@@ -19,12 +19,12 @@ cssPrefix: pf-v6-c-clipboard-copy
19
19
  </span>
20
20
  <button
21
21
  class="pf-v6-c-button pf-m-control"
22
+ id&#x26;#x3D;&#x26;quot;basic-editable-copy-button&#x26;quot;
22
23
  type="button"
23
- aria-label="Copy to clipboard"
24
- id="basic-editable-copy-button"
25
24
  aria-labelledby="basic-editable-copy-button basic-editable-text-input"
25
+ aria-label="Copy to clipboard"
26
26
  >
27
- <span class="pf-v6-c-button__text">
27
+ <span class="pf-v6-c-button__icon">
28
28
  <i class="fas fa-copy" aria-hidden="true"></i>
29
29
  </span>
30
30
  </button>
@@ -44,12 +44,12 @@ cssPrefix: pf-v6-c-clipboard-copy
44
44
  </span>
45
45
  <button
46
46
  class="pf-v6-c-button pf-m-control"
47
+ id&#x26;#x3D;&#x26;quot;basic-readonly-copy-button&#x26;quot;
47
48
  type="button"
48
- aria-label="Copy to clipboard"
49
- id="basic-readonly-copy-button"
50
49
  aria-labelledby="basic-readonly-copy-button basic-readonly-text-input"
50
+ aria-label="Copy to clipboard"
51
51
  >
52
- <span class="pf-v6-c-button__text">
52
+ <span class="pf-v6-c-button__icon">
53
53
  <i class="fas fa-copy" aria-hidden="true"></i>
54
54
  </span>
55
55
  </button>
@@ -71,7 +71,7 @@ cssPrefix: pf-v6-c-clipboard-copy
71
71
  aria-labelledby="expandable-not-expanded-editable-toggle expandable-not-expanded-editable-text-input"
72
72
  aria-controls="expandable-not-expanded-editable-content"
73
73
  >
74
- <span class="pf-v6-c-button__text">
74
+ <span class="pf-v6-c-button__icon">
75
75
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
76
76
  <i class="fas fa-angle-right" aria-hidden="true"></i>
77
77
  </div>
@@ -92,7 +92,7 @@ cssPrefix: pf-v6-c-clipboard-copy
92
92
  id="expandable-not-expanded-editable-copy-button"
93
93
  aria-labelledby="expandable-not-expanded-editable-copy-button expandable-not-expanded-editable-text-input"
94
94
  >
95
- <span class="pf-v6-c-button__text">
95
+ <span class="pf-v6-c-button__icon">
96
96
  <i class="fas fa-copy" aria-hidden="true"></i>
97
97
  </span>
98
98
  </button>
@@ -107,13 +107,14 @@ cssPrefix: pf-v6-c-clipboard-copy
107
107
  <div class="pf-v6-c-clipboard-copy pf-m-expanded">
108
108
  <div class="pf-v6-c-clipboard-copy__group">
109
109
  <button
110
- class="pf-v6-c-button pf-m-control pf-m-expanded"
110
+ class="pf-v6-c-button pf-m-expanded pf-m-control"
111
111
  type="button"
112
+ aria-expanded="true"
112
113
  id="expandable-expanded-editable-toggle"
113
114
  aria-labelledby="expandable-expanded-editable-toggle expandable-expanded-editable-text-input"
114
115
  aria-controls="expandable-expanded-editable-content"
115
116
  >
116
- <span class="pf-v6-c-button__text">
117
+ <span class="pf-v6-c-button__icon">
117
118
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
118
119
  <i class="fas fa-angle-right" aria-hidden="true"></i>
119
120
  </div>
@@ -135,7 +136,7 @@ cssPrefix: pf-v6-c-clipboard-copy
135
136
  id="expandable-expanded-editable-copy-button"
136
137
  aria-labelledby="expandable-expanded-editable-copy-button expandable-expanded-editable-text-input"
137
138
  >
138
- <span class="pf-v6-c-button__text">
139
+ <span class="pf-v6-c-button__icon">
139
140
  <i class="fas fa-copy" aria-hidden="true"></i>
140
141
  </span>
141
142
  </button>
@@ -157,7 +158,7 @@ cssPrefix: pf-v6-c-clipboard-copy
157
158
  aria-labelledby="expandable-not-expanded-readonly-toggle expandable-not-expanded-readonly-text-input"
158
159
  aria-controls="expandable-not-expanded-readonly-content"
159
160
  >
160
- <span class="pf-v6-c-button__text">
161
+ <span class="pf-v6-c-button__icon">
161
162
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
162
163
  <i class="fas fa-angle-right" aria-hidden="true"></i>
163
164
  </div>
@@ -179,7 +180,7 @@ cssPrefix: pf-v6-c-clipboard-copy
179
180
  id="expandable-not-expanded-readonly-copy-button"
180
181
  aria-labelledby="expandable-not-expanded-readonly-copy-button expandable-not-expanded-readonly-text-input"
181
182
  >
182
- <span class="pf-v6-c-button__text">
183
+ <span class="pf-v6-c-button__icon">
183
184
  <i class="fas fa-copy" aria-hidden="true"></i>
184
185
  </span>
185
186
  </button>
@@ -194,13 +195,14 @@ cssPrefix: pf-v6-c-clipboard-copy
194
195
  <div class="pf-v6-c-clipboard-copy pf-m-expanded">
195
196
  <div class="pf-v6-c-clipboard-copy__group">
196
197
  <button
197
- class="pf-v6-c-button pf-m-control pf-m-expanded"
198
+ class="pf-v6-c-button pf-m-expanded pf-m-control"
198
199
  type="button"
200
+ aria-expanded="true"
199
201
  id="expandable-expanded-readonly-toggle"
200
202
  aria-labelledby="expandable-expanded-readonly-toggle expandable-expanded-readonly-text-input"
201
203
  aria-controls="expandable-expanded-readonly-content"
202
204
  >
203
- <span class="pf-v6-c-button__text">
205
+ <span class="pf-v6-c-button__icon">
204
206
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
205
207
  <i class="fas fa-angle-right" aria-hidden="true"></i>
206
208
  </div>
@@ -222,7 +224,7 @@ cssPrefix: pf-v6-c-clipboard-copy
222
224
  id="expandable-expanded-readonly-copy-button"
223
225
  aria-labelledby="expandable-expanded-readonly-copy-button expandable-expanded-readonly-text-input"
224
226
  >
225
- <span class="pf-v6-c-button__text">
227
+ <span class="pf-v6-c-button__icon">
226
228
  <i class="fas fa-copy" aria-hidden="true"></i>
227
229
  </span>
228
230
  </button>
@@ -243,7 +245,7 @@ cssPrefix: pf-v6-c-clipboard-copy
243
245
  aria-labelledby="expandable-not-expanded-code-toggle expandable-not-expanded-code-text-input"
244
246
  aria-controls="expandable-not-expanded-code-content"
245
247
  >
246
- <span class="pf-v6-c-button__text">
248
+ <span class="pf-v6-c-button__icon">
247
249
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
248
250
  <i class="fas fa-angle-right" aria-hidden="true"></i>
249
251
  </div>
@@ -265,7 +267,7 @@ cssPrefix: pf-v6-c-clipboard-copy
265
267
  id="expandable-not-expanded-code-copy-button"
266
268
  aria-labelledby="expandable-not-expanded-code-copy-button expandable-not-expanded-code-text-input"
267
269
  >
268
- <span class="pf-v6-c-button__text">
270
+ <span class="pf-v6-c-button__icon">
269
271
  <i class="fas fa-copy" aria-hidden="true"></i>
270
272
  </span>
271
273
  </button>
@@ -293,13 +295,14 @@ cssPrefix: pf-v6-c-clipboard-copy
293
295
  <div class="pf-v6-c-clipboard-copy pf-m-expanded">
294
296
  <div class="pf-v6-c-clipboard-copy__group">
295
297
  <button
296
- class="pf-v6-c-button pf-m-control pf-m-expanded"
298
+ class="pf-v6-c-button pf-m-expanded pf-m-control"
297
299
  type="button"
300
+ aria-expanded="true"
298
301
  id="expandable-expanded-code-toggle"
299
302
  aria-labelledby="expandable-expanded-code-toggle expandable-expanded-code-text-input"
300
303
  aria-controls="expandable-expanded-code-content"
301
304
  >
302
- <span class="pf-v6-c-button__text">
305
+ <span class="pf-v6-c-button__icon">
303
306
  <div class="pf-v6-c-clipboard-copy__toggle-icon">
304
307
  <i class="fas fa-angle-right" aria-hidden="true"></i>
305
308
  </div>
@@ -322,7 +325,7 @@ cssPrefix: pf-v6-c-clipboard-copy
322
325
  id="expandable-expanded-code-copy-button"
323
326
  aria-labelledby="expandable-expanded-code-copy-button expandable-expanded-code-text-input"
324
327
  >
325
- <span class="pf-v6-c-button__text">
328
+ <span class="pf-v6-c-button__icon">
326
329
  <i class="fas fa-copy" aria-hidden="true"></i>
327
330
  </span>
328
331
  </button>
@@ -361,7 +364,7 @@ cssPrefix: pf-v6-c-clipboard-copy
361
364
  type="button"
362
365
  aria-label="Copy to clipboard"
363
366
  >
364
- <span class="pf-v6-c-button__text">
367
+ <span class="pf-v6-c-button__icon">
365
368
  <i class="fas fa-copy" aria-hidden="true"></i>
366
369
  </span>
367
370
  </button>
@@ -383,7 +386,7 @@ cssPrefix: pf-v6-c-clipboard-copy
383
386
  type="button"
384
387
  aria-label="Copy to clipboard"
385
388
  >
386
- <span class="pf-v6-c-button__text">
389
+ <span class="pf-v6-c-button__icon">
387
390
  <i class="fas fa-copy" aria-hidden="true"></i>
388
391
  </span>
389
392
  </button>
@@ -405,7 +408,7 @@ cssPrefix: pf-v6-c-clipboard-copy
405
408
  type="button"
406
409
  aria-label="Copy to clipboard"
407
410
  >
408
- <span class="pf-v6-c-button__text">
411
+ <span class="pf-v6-c-button__icon">
409
412
  <i class="fas fa-copy" aria-hidden="true"></i>
410
413
  </span>
411
414
  </button>
@@ -416,8 +419,8 @@ cssPrefix: pf-v6-c-clipboard-copy
416
419
  type="button"
417
420
  aria-label="Run in web terminal"
418
421
  >
419
- <span class="pf-v6-c-button__text">
420
- <i class="fas fa-play" aria-hidden="true"></i>
422
+ <span class="pf-v6-c-button__icon">
423
+ <i class="fas fa-copy" aria-hidden="true"></i>
421
424
  </span>
422
425
  </button>
423
426
  </span>
@@ -441,7 +444,7 @@ cssPrefix: pf-v6-c-clipboard-copy
441
444
  type="button"
442
445
  aria-label="Copy to clipboard"
443
446
  >
444
- <span class="pf-v6-c-button__text">
447
+ <span class="pf-v6-c-button__icon">
445
448
  <i class="fas fa-copy" aria-hidden="true"></i>
446
449
  </span>
447
450
  </button>
@@ -466,7 +469,7 @@ cssPrefix: pf-v6-c-clipboard-copy
466
469
  type="button"
467
470
  aria-label="Copy to clipboard"
468
471
  >
469
- <span class="pf-v6-c-button__text">
472
+ <span class="pf-v6-c-button__icon">
470
473
  <i class="fas fa-copy" aria-hidden="true"></i>
471
474
  </span>
472
475
  </button>
@@ -490,7 +493,7 @@ cssPrefix: pf-v6-c-clipboard-copy
490
493
  type="button"
491
494
  aria-label="Copy to clipboard"
492
495
  >
493
- <span class="pf-v6-c-button__text">
496
+ <span class="pf-v6-c-button__icon">
494
497
  <i class="fas fa-copy" aria-hidden="true"></i>
495
498
  </span>
496
499
  </button>
package/docs/components/CodeBlock/examples/CodeBlock.md CHANGED
@@ -16,7 +16,7 @@ cssPrefix: pf-v6-c-code-block
16
16
  type="button"
17
17
  aria-label="Copy to clipboard"
18
18
  >
19
- <span class="pf-v6-c-button__text">
19
+ <span class="pf-v6-c-button__icon">
20
20
  <i class="fas fa-copy" aria-hidden="true"></i>
21
21
  </span>
22
22
  </button>
@@ -27,7 +27,7 @@ cssPrefix: pf-v6-c-code-block
27
27
  type="button"
28
28
  aria-label="Run in Web Terminal"
29
29
  >
30
- <span class="pf-v6-c-button__text">
30
+ <span class="pf-v6-c-button__icon">
31
31
  <i class="fas fa-play" aria-hidden="true"></i>
32
32
  </span>
33
33
  </button>
@@ -60,7 +60,7 @@ url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs</co
60
60
  type="button"
61
61
  aria-label="Copy to clipboard"
62
62
  >
63
- <span class="pf-v6-c-button__text">
63
+ <span class="pf-v6-c-button__icon">
64
64
  <i class="fas fa-copy" aria-hidden="true"></i>
65
65
  </span>
66
66
  </button>
@@ -71,7 +71,7 @@ url: https://raw.githubusercontent.com/Azure-Samples/helm-charts/master/docs</co
71
71
  type="button"
72
72
  aria-label="Run in Web Terminal"
73
73
  >
74
- <span class="pf-v6-c-button__text">
74
+ <span class="pf-v6-c-button__icon">
75
75
  <i class="fas fa-play" aria-hidden="true"></i>
76
76
  </span>
77
77
  </button>
@@ -125,7 +125,7 @@ name: azure-sample-repo<div
125
125
  type="button"
126
126
  aria-label="Copy to clipboard"
127
127
  >
128
- <span class="pf-v6-c-button__text">
128
+ <span class="pf-v6-c-button__icon">
129
129
  <i class="fas fa-copy" aria-hidden="true"></i>
130
130
  </span>
131
131
  </button>
@@ -136,7 +136,7 @@ name: azure-sample-repo<div
136
136
  type="button"
137
137
  aria-label="Run in Web Terminal"
138
138
  >
139
- <span class="pf-v6-c-button__text">
139
+ <span class="pf-v6-c-button__icon">
140
140
  <i class="fas fa-play" aria-hidden="true"></i>
141
141
  </span>
142
142
  </button>
package/docs/components/CodeEditor/examples/CodeEditor.md CHANGED
@@ -16,7 +16,7 @@ cssPrefix: pf-v6-c-code-editor
16
16
  type="button"
17
17
  aria-label="Copy to clipboard"
18
18
  >
19
- <span class="pf-v6-c-button__text">
19
+ <span class="pf-v6-c-button__icon">
20
20
  <i class="fas fa-copy" aria-hidden="true"></i>
21
21
  </span>
22
22
  </button>
@@ -25,8 +25,8 @@ cssPrefix: pf-v6-c-code-editor
25
25
  type="button"
26
26
  aria-label="Download code"
27
27
  >
28
- <span class="pf-v6-c-button__text">
29
- <i class="fas fa-download"></i>
28
+ <span class="pf-v6-c-button__icon">
29
+ <i class="fas fa-download" aria-hidden="true"></i>
30
30
  </span>
31
31
  </button>
32
32
  <button
@@ -34,8 +34,8 @@ cssPrefix: pf-v6-c-code-editor
34
34
  type="button"
35
35
  aria-label="Upload code"
36
36
  >
37
- <span class="pf-v6-c-button__text">
38
- <i class="fas fa-upload"></i>
37
+ <span class="pf-v6-c-button__icon">
38
+ <i class="fas fa-upload" aria-hidden="true"></i>
39
39
  </span>
40
40
  </button>
41
41
  </div>
@@ -71,7 +71,7 @@ cssPrefix: pf-v6-c-code-editor
71
71
  type="button"
72
72
  aria-label="Copy to clipboard"
73
73
  >
74
- <span class="pf-v6-c-button__text">
74
+ <span class="pf-v6-c-button__icon">
75
75
  <i class="fas fa-copy" aria-hidden="true"></i>
76
76
  </span>
77
77
  </button>
@@ -80,18 +80,17 @@ cssPrefix: pf-v6-c-code-editor
80
80
  type="button"
81
81
  aria-label="Download code"
82
82
  >
83
- <span class="pf-v6-c-button__text">
84
- <i class="fas fa-download"></i>
83
+ <span class="pf-v6-c-button__icon">
84
+ <i class="fas fa-download" aria-hidden="true"></i>
85
85
  </span>
86
86
  </button>
87
87
  <button
88
88
  class="pf-v6-c-button pf-m-plain"
89
89
  type="button"
90
90
  aria-label="Upload code"
91
- disabled
92
91
  >
93
- <span class="pf-v6-c-button__text">
94
- <i class="fas fa-upload"></i>
92
+ <span class="pf-v6-c-button__icon">
93
+ <i class="fas fa-upload" aria-hidden="true"></i>
95
94
  </span>
96
95
  </button>
97
96
  </div>
@@ -227,7 +226,7 @@ cssPrefix: pf-v6-c-code-editor
227
226
  type="button"
228
227
  aria-label="Copy to clipboard"
229
228
  >
230
- <span class="pf-v6-c-button__text">
229
+ <span class="pf-v6-c-button__icon">
231
230
  <i class="fas fa-copy" aria-hidden="true"></i>
232
231
  </span>
233
232
  </button>
@@ -236,8 +235,8 @@ cssPrefix: pf-v6-c-code-editor
236
235
  type="button"
237
236
  aria-label="Download code"
238
237
  >
239
- <span class="pf-v6-c-button__text">
240
- <i class="fas fa-download"></i>
238
+ <span class="pf-v6-c-button__icon">
239
+ <i class="fas fa-download" aria-hidden="true"></i>
241
240
  </span>
242
241
  </button>
243
242
  <button
@@ -245,20 +244,18 @@ cssPrefix: pf-v6-c-code-editor
245
244
  type="button"
246
245
  aria-label="Upload code"
247
246
  >
248
- <span class="pf-v6-c-button__text">
249
- <i class="fas fa-upload"></i>
247
+ <span class="pf-v6-c-button__icon">
248
+ <i class="fas fa-upload" aria-hidden="true"></i>
250
249
  </span>
251
250
  </button>
252
251
  </div>
253
252
  <div class="pf-v6-c-code-editor__header-main">Header main content</div>
254
253
  <div class="pf-v6-c-code-editor__keyboard-shortcuts">
255
254
  <button class="pf-v6-c-button pf-m-link" type="button">
256
- <span class="pf-v6-c-button__text">
257
- <span class="pf-v6-c-button__icon pf-m-start pf-m-start">
258
- <i class="pf-v6-pficon pf-v6-pficon-help" aria-hidden="true"></i>
259
- </span>
260
- View shortcuts
255
+ <span class="pf-v6-c-button__icon pf-m-start">
256
+ <i class="fas fa-question-circle" aria-hidden="true"></i>
261
257
  </span>
258
+ <span class="pf-v6-c-button__text">View shortcuts</span>
262
259
  </button>
263
260
  </div>
264
261
  </div>