@patternfly/patternfly 6.3.0-prerelease.8 → 6.3.0

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 (111) hide show
  1. package/assets/images/icon-outlined-star.hbs +3 -0
  2. package/assets/images/icon-star.hbs +3 -0
  3. package/base/patternfly-common.css +46 -11
  4. package/base/patternfly-common.scss +58 -13
  5. package/components/Accordion/accordion.css +72 -3
  6. package/components/Accordion/accordion.scss +78 -6
  7. package/components/Alert/alert-group.css +52 -31
  8. package/components/Alert/alert-group.scss +77 -46
  9. package/components/Button/button.css +154 -6
  10. package/components/Button/button.scss +160 -8
  11. package/components/DataList/data-list.css +2 -2
  12. package/components/DataList/data-list.scss +2 -2
  13. package/components/DualListSelector/dual-list-selector.css +36 -0
  14. package/components/DualListSelector/dual-list-selector.scss +43 -0
  15. package/components/ExpandableSection/expandable-section.css +63 -1
  16. package/components/ExpandableSection/expandable-section.scss +76 -2
  17. package/components/FileUpload/file-upload.css +3 -3
  18. package/components/FileUpload/file-upload.scss +3 -3
  19. package/components/Form/form.css +40 -1
  20. package/components/Form/form.scss +47 -1
  21. package/components/FormControl/form-control.css +16 -0
  22. package/components/FormControl/form-control.scss +9 -0
  23. package/components/InputGroup/input-group.css +80 -0
  24. package/components/InputGroup/input-group.scss +95 -0
  25. package/components/Menu/menu.css +24 -4
  26. package/components/Menu/menu.scss +20 -5
  27. package/components/MenuToggle/menu-toggle.css +30 -0
  28. package/components/MenuToggle/menu-toggle.scss +33 -0
  29. package/components/Nav/nav.css +22 -8
  30. package/components/Nav/nav.scss +22 -9
  31. package/components/Page/page.css +62 -3
  32. package/components/Page/page.scss +44 -3
  33. package/components/Progress/progress.css +16 -0
  34. package/components/Progress/progress.scss +11 -1
  35. package/components/ProgressStepper/progress-stepper.scss +1 -0
  36. package/components/Skeleton/skeleton.css +22 -2
  37. package/components/Skeleton/skeleton.scss +25 -3
  38. package/components/Spinner/spinner.css +5 -0
  39. package/components/Spinner/spinner.scss +6 -0
  40. package/components/Table/table-grid.css +51 -5
  41. package/components/Table/table-grid.scss +22 -1
  42. package/components/Table/table.css +83 -1
  43. package/components/Table/table.scss +123 -1
  44. package/components/Tabs/tabs.css +25 -15
  45. package/components/Tabs/tabs.scss +26 -13
  46. package/components/TextInputGroup/text-input-group.css +16 -0
  47. package/components/TextInputGroup/text-input-group.scss +8 -0
  48. package/components/Timestamp/timestamp.css +4 -0
  49. package/components/Timestamp/timestamp.scss +7 -0
  50. package/components/TreeView/tree-view.css +39 -0
  51. package/components/TreeView/tree-view.scss +42 -2
  52. package/components/Truncate/truncate.css +1 -0
  53. package/components/Truncate/truncate.scss +3 -0
  54. package/components/_index.css +918 -85
  55. package/docs/components/Breadcrumb/examples/Breadcrumb.md +1 -1
  56. package/docs/components/Button/examples/Button.md +148 -5
  57. package/docs/components/Card/examples/Card.md +8 -8
  58. package/docs/components/CodeBlock/examples/CodeBlock.md +5 -5
  59. package/docs/components/DataList/examples/DataList.md +23 -23
  60. package/docs/components/DualListSelector/examples/DualListSelector.md +534 -16
  61. package/docs/components/ExpandableSection/examples/ExpandableSection.md +17 -12
  62. package/docs/components/Form/examples/Form.md +1047 -126
  63. package/docs/components/Hint/examples/Hint.md +3 -3
  64. package/docs/components/InlineEdit/examples/InlineEdit.md +2 -2
  65. package/docs/components/InputGroup/examples/InputGroup.md +5 -1
  66. package/docs/components/JumpLinks/examples/JumpLinks.md +1 -1
  67. package/docs/components/Masthead/examples/masthead.md +90 -12
  68. package/docs/components/Menu/examples/Menu.md +122 -6
  69. package/docs/components/MenuToggle/examples/MenuToggle.md +90 -51
  70. package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md +2 -10
  71. package/docs/components/OverflowMenu/examples/overflow-menu.md +5 -5
  72. package/docs/components/Page/examples/Page.md +147 -14
  73. package/docs/components/Pagination/examples/Pagination.md +12 -12
  74. package/docs/components/ProgressStepper/examples/ProgressStepper.md +32 -6
  75. package/docs/components/Slider/examples/Slider.md +2 -2
  76. package/docs/components/Spinner/examples/Spinner.md +10 -0
  77. package/docs/components/Table/examples/Table.md +9428 -6173
  78. package/docs/components/Tabs/examples/Tabs.md +1214 -6729
  79. package/docs/components/TextInputGroup/examples/TextInputGroup.md +45 -5
  80. package/docs/components/Toolbar/examples/Toolbar.md +7 -7
  81. package/docs/demos/AboutModal/examples/AboutModal.md +22 -3
  82. package/docs/demos/Alert/examples/Alert.md +66 -9
  83. package/docs/demos/BackToTop/examples/BackToTop.md +22 -3
  84. package/docs/demos/Banner/examples/Banner.md +47 -6
  85. package/docs/demos/Card/examples/Card.md +5 -62
  86. package/docs/demos/CardView/examples/CardView.md +24 -5
  87. package/docs/demos/Dashboard/examples/Dashboard.md +24 -5
  88. package/docs/demos/DataList/examples/DataList.md +100 -24
  89. package/docs/demos/DescriptionList/examples/DescriptionList.md +66 -47
  90. package/docs/demos/Drawer/examples/Drawer.md +110 -53
  91. package/docs/demos/Form/examples/BasicForms.md +12 -12
  92. package/docs/demos/JumpLinks/examples/JumpLinks.md +132 -18
  93. package/docs/demos/Masthead/examples/Masthead.md +170 -18
  94. package/docs/demos/Modal/examples/Modal.md +132 -18
  95. package/docs/demos/Nav/examples/Nav.md +111 -16
  96. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +110 -15
  97. package/docs/demos/Page/examples/Page.md +309 -43
  98. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +160 -103
  99. package/docs/demos/Skeleton/examples/Skeleton.md +22 -3
  100. package/docs/demos/Table/examples/Table.md +449 -155
  101. package/docs/demos/Tabs/examples/Tabs.md +137 -593
  102. package/docs/demos/Toolbar/examples/Toolbar.md +72 -34
  103. package/docs/demos/Wizard/examples/Wizard.md +198 -27
  104. package/package.json +5 -5
  105. package/patternfly-base-no-globals.css +45 -11
  106. package/patternfly-base.css +45 -11
  107. package/patternfly-no-globals.css +963 -96
  108. package/patternfly.css +963 -96
  109. package/patternfly.min.css +1 -1
  110. package/patternfly.min.css.map +1 -1
  111. package/sass-utilities/mixins.scss +54 -0
package/docs/components/MenuToggle/examples/MenuToggle.md CHANGED
@@ -75,7 +75,7 @@ cssPrefix: pf-v6-c-menu-toggle
75
75
 
76
76
   
77
77
  <button
78
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-text"
78
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-small pf-m-plain"
79
79
  type="button"
80
80
  aria-expanded="false"
81
81
  aria-label="Menu toggle"
@@ -130,7 +130,7 @@ cssPrefix: pf-v6-c-menu-toggle
130
130
 
131
131
  &nbsp;
132
132
  <button
133
- class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded"
133
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-primary"
134
134
  type="button"
135
135
  aria-expanded="true"
136
136
  >
@@ -194,7 +194,7 @@ cssPrefix: pf-v6-c-menu-toggle
194
194
 
195
195
  &nbsp;
196
196
  <button
197
- class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded"
197
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-secondary"
198
198
  type="button"
199
199
  aria-expanded="true"
200
200
  >
@@ -238,7 +238,7 @@ cssPrefix: pf-v6-c-menu-toggle
238
238
  </button>
239
239
  &nbsp;
240
240
  <button
241
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-expanded"
241
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-plain"
242
242
  type="button"
243
243
  aria-expanded="true"
244
244
  aria-label="Actions"
@@ -266,7 +266,7 @@ cssPrefix: pf-v6-c-menu-toggle
266
266
 
267
267
  ```html
268
268
  <button
269
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text"
269
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain"
270
270
  type="button"
271
271
  aria-expanded="false"
272
272
  aria-label="Menu toggle"
@@ -281,7 +281,7 @@ cssPrefix: pf-v6-c-menu-toggle
281
281
 
282
282
  &nbsp;
283
283
  <button
284
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text pf-m-expanded"
284
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-text pf-m-plain"
285
285
  type="button"
286
286
  aria-expanded="true"
287
287
  aria-label="Menu toggle"
@@ -296,7 +296,7 @@ cssPrefix: pf-v6-c-menu-toggle
296
296
 
297
297
  &nbsp;
298
298
  <button
299
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-text pf-m-disabled"
299
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-plain pf-m-disabled"
300
300
  type="button"
301
301
  aria-expanded="false"
302
302
  disabled
@@ -329,7 +329,7 @@ cssPrefix: pf-v6-c-menu-toggle
329
329
  </button>
330
330
  &nbsp;
331
331
  <button
332
- class="pf-v6-c-menu-toggle pf-m-small pf-m-expanded"
332
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-small"
333
333
  type="button"
334
334
  aria-expanded="true"
335
335
  >
@@ -357,7 +357,7 @@ cssPrefix: pf-v6-c-menu-toggle
357
357
  <br />
358
358
  <br />
359
359
  <button
360
- class="pf-v6-c-menu-toggle pf-m-primary pf-m-small"
360
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-primary"
361
361
  type="button"
362
362
  aria-expanded="false"
363
363
  >
@@ -370,7 +370,7 @@ cssPrefix: pf-v6-c-menu-toggle
370
370
  </button>
371
371
  &nbsp;
372
372
  <button
373
- class="pf-v6-c-menu-toggle pf-m-primary pf-m-small pf-m-expanded"
373
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-small pf-m-primary"
374
374
  type="button"
375
375
  aria-expanded="true"
376
376
  >
@@ -383,7 +383,7 @@ cssPrefix: pf-v6-c-menu-toggle
383
383
  </button>
384
384
  &nbsp;
385
385
  <button
386
- class="pf-v6-c-menu-toggle pf-m-primary pf-m-small pf-m-disabled"
386
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-primary pf-m-disabled"
387
387
  type="button"
388
388
  aria-expanded="false"
389
389
  disabled
@@ -398,7 +398,7 @@ cssPrefix: pf-v6-c-menu-toggle
398
398
  <br />
399
399
  <br />
400
400
  <button
401
- class="pf-v6-c-menu-toggle pf-m-secondary pf-m-small"
401
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-secondary"
402
402
  type="button"
403
403
  aria-expanded="false"
404
404
  >
@@ -411,7 +411,7 @@ cssPrefix: pf-v6-c-menu-toggle
411
411
  </button>
412
412
  &nbsp;
413
413
  <button
414
- class="pf-v6-c-menu-toggle pf-m-secondary pf-m-small pf-m-expanded"
414
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-small pf-m-secondary"
415
415
  type="button"
416
416
  aria-expanded="true"
417
417
  >
@@ -424,7 +424,7 @@ cssPrefix: pf-v6-c-menu-toggle
424
424
  </button>
425
425
  &nbsp;
426
426
  <button
427
- class="pf-v6-c-menu-toggle pf-m-secondary pf-m-small pf-m-disabled"
427
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-secondary pf-m-disabled"
428
428
  type="button"
429
429
  aria-expanded="false"
430
430
  disabled
@@ -439,7 +439,7 @@ cssPrefix: pf-v6-c-menu-toggle
439
439
  <br />
440
440
  <br />
441
441
  <button
442
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-text"
442
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-small pf-m-plain"
443
443
  type="button"
444
444
  aria-expanded="false"
445
445
  >
@@ -452,7 +452,7 @@ cssPrefix: pf-v6-c-menu-toggle
452
452
  </button>
453
453
  &nbsp;
454
454
  <button
455
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-text pf-m-expanded"
455
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-text pf-m-small pf-m-plain"
456
456
  type="button"
457
457
  aria-expanded="true"
458
458
  >
@@ -465,7 +465,7 @@ cssPrefix: pf-v6-c-menu-toggle
465
465
  </button>
466
466
  &nbsp;
467
467
  <button
468
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-text pf-m-disabled"
468
+ class="pf-v6-c-menu-toggle pf-m-text pf-m-small pf-m-plain pf-m-disabled"
469
469
  type="button"
470
470
  aria-expanded="false"
471
471
  disabled
@@ -480,7 +480,7 @@ cssPrefix: pf-v6-c-menu-toggle
480
480
  <br />
481
481
  <br />
482
482
  <button
483
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small"
483
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-plain"
484
484
  type="button"
485
485
  aria-expanded="false"
486
486
  aria-label="Actions"
@@ -491,7 +491,7 @@ cssPrefix: pf-v6-c-menu-toggle
491
491
  </button>
492
492
  &nbsp;
493
493
  <button
494
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-expanded"
494
+ class="pf-v6-c-menu-toggle pf-m-expanded pf-m-small pf-m-plain"
495
495
  type="button"
496
496
  aria-expanded="true"
497
497
  aria-label="Actions"
@@ -502,7 +502,7 @@ cssPrefix: pf-v6-c-menu-toggle
502
502
  </button>
503
503
  &nbsp;
504
504
  <button
505
- class="pf-v6-c-menu-toggle pf-m-plain pf-m-small pf-m-disabled"
505
+ class="pf-v6-c-menu-toggle pf-m-small pf-m-plain pf-m-disabled"
506
506
  type="button"
507
507
  aria-expanded="false"
508
508
  disabled
@@ -658,7 +658,7 @@ cssPrefix: pf-v6-c-menu-toggle
658
658
 
659
659
  ```html
660
660
  <div
661
- class="pf-v6-c-menu-toggle pf-m-typeahead pf-m-full-width"
661
+ class="pf-v6-c-menu-toggle pf-m-full-width pf-m-typeahead"
662
662
  id="typeahead-example"
663
663
  >
664
664
  <div class="pf-v6-c-text-input-group pf-m-plain">
@@ -848,7 +848,7 @@ Shown with default, primary, and secondary styling
848
848
  <br />
849
849
 
850
850
  <div
851
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-primary"
851
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button"
852
852
  id="split-button-checkbox-with-toggle-action-primary-example"
853
853
  >
854
854
  <button class="pf-v6-c-menu-toggle__button" type="button">Action</button>
@@ -868,7 +868,7 @@ Shown with default, primary, and secondary styling
868
868
  </div>
869
869
  &nbsp;
870
870
  <div
871
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
871
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded pf-m-split-button"
872
872
  id="split-button-checkbox-with-toggle-action-primary-expanded-example"
873
873
  >
874
874
  <button class="pf-v6-c-menu-toggle__button" type="button">Action</button>
@@ -888,7 +888,7 @@ Shown with default, primary, and secondary styling
888
888
  </div>
889
889
  &nbsp;
890
890
  <div
891
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
891
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button pf-m-disabled"
892
892
  id="split-button-checkbox-with-toggle-action-primary-disabled-example"
893
893
  >
894
894
  <button class="pf-v6-c-menu-toggle__button" type="button" disabled>Action</button>
@@ -912,7 +912,7 @@ Shown with default, primary, and secondary styling
912
912
  <br />
913
913
 
914
914
  <div
915
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-secondary"
915
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button"
916
916
  id="split-button-checkbox-with-toggle-action-secondary-example"
917
917
  >
918
918
  <button class="pf-v6-c-menu-toggle__button" type="button">Action</button>
@@ -932,7 +932,7 @@ Shown with default, primary, and secondary styling
932
932
  </div>
933
933
  &nbsp;
934
934
  <div
935
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
935
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded pf-m-split-button"
936
936
  id="split-button-checkbox-with-toggle-action-secondary-expanded-example"
937
937
  >
938
938
  <button class="pf-v6-c-menu-toggle__button" type="button">Action</button>
@@ -952,7 +952,7 @@ Shown with default, primary, and secondary styling
952
952
  </div>
953
953
  &nbsp;
954
954
  <div
955
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
955
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button pf-m-disabled"
956
956
  id="split-button-checkbox-with-toggle-action-secondary-disabled-example"
957
957
  >
958
958
  <button class="pf-v6-c-menu-toggle__button" type="button" disabled>Action</button>
@@ -1069,7 +1069,7 @@ Shown with default, primary, and secondary styling
1069
1069
  <br />
1070
1070
 
1071
1071
  <div
1072
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-primary"
1072
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button"
1073
1073
  id="split-button-primary-checkbox-example"
1074
1074
  >
1075
1075
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1097,7 +1097,7 @@ Shown with default, primary, and secondary styling
1097
1097
  </div>
1098
1098
  &nbsp;
1099
1099
  <div
1100
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
1100
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded pf-m-split-button"
1101
1101
  id="split-button--primary-checkbox-expanded-example"
1102
1102
  >
1103
1103
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1125,7 +1125,7 @@ Shown with default, primary, and secondary styling
1125
1125
  </div>
1126
1126
  &nbsp;
1127
1127
  <div
1128
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
1128
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button pf-m-disabled"
1129
1129
  id="split-button--primary-checkbox-disabled-example"
1130
1130
  >
1131
1131
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1158,7 +1158,7 @@ Shown with default, primary, and secondary styling
1158
1158
  <br />
1159
1159
 
1160
1160
  <div
1161
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-secondary"
1161
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button"
1162
1162
  id="split-button-secondary-checkbox-example"
1163
1163
  >
1164
1164
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1186,7 +1186,7 @@ Shown with default, primary, and secondary styling
1186
1186
  </div>
1187
1187
  &nbsp;
1188
1188
  <div
1189
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
1189
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded pf-m-split-button"
1190
1190
  id="split-button-secondary-checkbox-expanded-example"
1191
1191
  >
1192
1192
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1214,7 +1214,7 @@ Shown with default, primary, and secondary styling
1214
1214
  </div>
1215
1215
  &nbsp;
1216
1216
  <div
1217
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
1217
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button pf-m-disabled"
1218
1218
  id="split-button-secondary-checkbox-disabled-example"
1219
1219
  >
1220
1220
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1350,7 +1350,7 @@ Shown with default, primary, and secondary styling
1350
1350
  <br />
1351
1351
 
1352
1352
  <div
1353
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-primary"
1353
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button"
1354
1354
  id="split-button-checkbox-primary-example"
1355
1355
  >
1356
1356
  <label
@@ -1381,7 +1381,7 @@ Shown with default, primary, and secondary styling
1381
1381
  </div>
1382
1382
  &nbsp;
1383
1383
  <div
1384
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
1384
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded pf-m-split-button"
1385
1385
  id="split-button-checkbox-primary-expanded-example"
1386
1386
  >
1387
1387
  <label
@@ -1412,7 +1412,7 @@ Shown with default, primary, and secondary styling
1412
1412
  </div>
1413
1413
  &nbsp;
1414
1414
  <div
1415
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
1415
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button pf-m-disabled"
1416
1416
  id="split-button-checkbox-primary-disabled-example"
1417
1417
  >
1418
1418
  <label
@@ -1448,7 +1448,7 @@ Shown with default, primary, and secondary styling
1448
1448
  <br />
1449
1449
 
1450
1450
  <div
1451
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-secondary"
1451
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button"
1452
1452
  id="split-button-checkbox-secondary-example"
1453
1453
  >
1454
1454
  <label
@@ -1479,7 +1479,7 @@ Shown with default, primary, and secondary styling
1479
1479
  </div>
1480
1480
  &nbsp;
1481
1481
  <div
1482
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
1482
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded pf-m-split-button"
1483
1483
  id="split-button-checkbox-secondary-expanded-example"
1484
1484
  >
1485
1485
  <label
@@ -1510,7 +1510,7 @@ Shown with default, primary, and secondary styling
1510
1510
  </div>
1511
1511
  &nbsp;
1512
1512
  <div
1513
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
1513
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button pf-m-disabled"
1514
1514
  id="split-button-checkbox-secondary-disabled-example"
1515
1515
  >
1516
1516
  <label
@@ -1641,7 +1641,7 @@ Shown with default, primary, and secondary styling
1641
1641
  <br />
1642
1642
 
1643
1643
  <div
1644
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-primary"
1644
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button"
1645
1645
  id="split-button-primary-checkbox-with-toggle-button-text-example"
1646
1646
  >
1647
1647
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1669,7 +1669,7 @@ Shown with default, primary, and secondary styling
1669
1669
  </button>
1670
1670
  </div>&nbsp;
1671
1671
  <div
1672
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
1672
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded pf-m-split-button"
1673
1673
  id="split-button-primary-checkbox-with-toggle-button-text-expanded-example"
1674
1674
  >
1675
1675
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1697,7 +1697,7 @@ Shown with default, primary, and secondary styling
1697
1697
  </button>
1698
1698
  </div>&nbsp;
1699
1699
  <div
1700
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
1700
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button pf-m-disabled"
1701
1701
  id="split-button-primary-checkbox-with-toggle-button-text-disabled-example"
1702
1702
  >
1703
1703
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1731,7 +1731,7 @@ Shown with default, primary, and secondary styling
1731
1731
  <br />
1732
1732
 
1733
1733
  <div
1734
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-secondary"
1734
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button"
1735
1735
  id="split-button-secondary-checkbox-with-toggle-button-text-example"
1736
1736
  >
1737
1737
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1759,7 +1759,7 @@ Shown with default, primary, and secondary styling
1759
1759
  </button>
1760
1760
  </div>&nbsp;
1761
1761
  <div
1762
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
1762
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded pf-m-split-button"
1763
1763
  id="split-button-secondary-checkbox-with-toggle-button-text-expanded-example"
1764
1764
  >
1765
1765
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1787,7 +1787,7 @@ Shown with default, primary, and secondary styling
1787
1787
  </button>
1788
1788
  </div>&nbsp;
1789
1789
  <div
1790
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
1790
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button pf-m-disabled"
1791
1791
  id="split-button-secondary-checkbox-with-toggle-button-text-disabled-example"
1792
1792
  >
1793
1793
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1925,7 +1925,7 @@ Shown with default, primary, and secondary styling
1925
1925
  <br />
1926
1926
 
1927
1927
  <div
1928
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-primary"
1928
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button"
1929
1929
  id="split-button-primary-checkbox-with-toggle-button-icon-text-example"
1930
1930
  >
1931
1931
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1956,7 +1956,7 @@ Shown with default, primary, and secondary styling
1956
1956
  </button>
1957
1957
  </div>&nbsp;
1958
1958
  <div
1959
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-primary"
1959
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-expanded pf-m-split-button"
1960
1960
  id="split-button-primary-checkbox-with-toggle-button-icon-text-expanded-example"
1961
1961
  >
1962
1962
  <label class="pf-v6-c-check pf-m-standalone">
@@ -1987,7 +1987,7 @@ Shown with default, primary, and secondary styling
1987
1987
  </button>
1988
1988
  </div>&nbsp;
1989
1989
  <div
1990
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-primary"
1990
+ class="pf-v6-c-menu-toggle pf-m-primary pf-m-split-button pf-m-disabled"
1991
1991
  id="split-button-primary-checkbox-with-toggle-button-icon-text-disabled-example"
1992
1992
  >
1993
1993
  <label class="pf-v6-c-check pf-m-standalone">
@@ -2024,7 +2024,7 @@ Shown with default, primary, and secondary styling
2024
2024
  <br />
2025
2025
 
2026
2026
  <div
2027
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-secondary"
2027
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button"
2028
2028
  id="split-button-secondary-checkbox-with-toggle-button-icon-text-example"
2029
2029
  >
2030
2030
  <label class="pf-v6-c-check pf-m-standalone">
@@ -2055,7 +2055,7 @@ Shown with default, primary, and secondary styling
2055
2055
  </button>
2056
2056
  </div>&nbsp;
2057
2057
  <div
2058
- class="pf-v6-c-menu-toggle pf-m-expanded pf-m-split-button pf-m-secondary"
2058
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-expanded pf-m-split-button"
2059
2059
  id="split-button-secondary-checkbox-with-toggle-button-icon-text-expanded-example"
2060
2060
  >
2061
2061
  <label class="pf-v6-c-check pf-m-standalone">
@@ -2086,7 +2086,7 @@ Shown with default, primary, and secondary styling
2086
2086
  </button>
2087
2087
  </div>&nbsp;
2088
2088
  <div
2089
- class="pf-v6-c-menu-toggle pf-m-split-button pf-m-disabled pf-m-secondary"
2089
+ class="pf-v6-c-menu-toggle pf-m-secondary pf-m-split-button pf-m-disabled"
2090
2090
  id="split-button-secondary-checkbox-with-toggle-button-icon-text-disabled-example"
2091
2091
  >
2092
2092
  <label class="pf-v6-c-check pf-m-standalone">
@@ -2121,6 +2121,45 @@ Shown with default, primary, and secondary styling
2121
2121
 
2122
2122
  ```
2123
2123
 
2124
+ ### Settings
2125
+
2126
+ ```html
2127
+ <button
2128
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain"
2129
+ type="button"
2130
+ aria-expanded="false"
2131
+ aria-label="Settings"
2132
+ >
2133
+ <span class="pf-v6-c-menu-toggle__icon">
2134
+ <i class="fas fa-cog" aria-hidden="true"></i>
2135
+ </span>
2136
+ </button>
2137
+
2138
+ <button
2139
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-expanded pf-m-plain"
2140
+ type="button"
2141
+ aria-expanded="true"
2142
+ aria-label="Settings"
2143
+ >
2144
+ <span class="pf-v6-c-menu-toggle__icon">
2145
+ <i class="fas fa-cog" aria-hidden="true"></i>
2146
+ </span>
2147
+ </button>
2148
+
2149
+ <button
2150
+ class="pf-v6-c-menu-toggle pf-m-settings pf-m-plain pf-m-disabled"
2151
+ type="button"
2152
+ aria-expanded="false"
2153
+ disabled
2154
+ aria-label="Settings"
2155
+ >
2156
+ <span class="pf-v6-c-menu-toggle__icon">
2157
+ <i class="fas fa-cog" aria-hidden="true"></i>
2158
+ </span>
2159
+ </button>
2160
+
2161
+ ```
2162
+
2124
2163
  ## Documentation
2125
2164
 
2126
2165
  ### Accessibility
package/docs/components/MultipleFileUpload/examples/MultipleFileUpload.md CHANGED
@@ -346,11 +346,7 @@ cssPrefix: pf-v6-c-multiple-file-upload
346
346
  <div class="pf-v6-c-multiple-file-upload__status">
347
347
  <div class="pf-v6-c-expandable-section pf-m-expanded">
348
348
  <div class="pf-v6-c-expandable-section__toggle">
349
- <button
350
- class="pf-v6-c-button pf-m-link"
351
- type="button"
352
- aria-expanded="true"
353
- >
349
+ <button class="pf-v6-c-button pf-m-link" type="button" aria-expanded>
354
350
  <span class="pf-v6-c-button__icon pf-m-start">
355
351
  <span class="pf-v6-c-expandable-section__toggle-icon">
356
352
  <i class="fas fa-angle-right" aria-hidden="true"></i>
@@ -557,11 +553,7 @@ cssPrefix: pf-v6-c-multiple-file-upload
557
553
  <div class="pf-v6-c-multiple-file-upload__status">
558
554
  <div class="pf-v6-c-expandable-section pf-m-expanded">
559
555
  <div class="pf-v6-c-expandable-section__toggle">
560
- <button
561
- class="pf-v6-c-button pf-m-link"
562
- type="button"
563
- aria-expanded="true"
564
- >
556
+ <button class="pf-v6-c-button pf-m-link" type="button" aria-expanded>
565
557
  <span class="pf-v6-c-button__icon pf-m-start">
566
558
  <span class="pf-v6-c-expandable-section__toggle-icon">
567
559
  <i class="fas fa-angle-right" aria-hidden="true"></i>
package/docs/components/OverflowMenu/examples/overflow-menu.md CHANGED
@@ -19,7 +19,7 @@ The overflow menu relies on groups (`.pf-v6-c-overflow-menu__group`) and items (
19
19
  class="pf-v6-c-menu-toggle pf-m-plain"
20
20
  type="button"
21
21
  aria-expanded="false"
22
- aria-label="Menu toggle"
22
+ aria-label="Generic options"
23
23
  id="overflow-menu-simple-toggle"
24
24
  >
25
25
  <span class="pf-v6-c-menu-toggle__icon">
@@ -154,7 +154,7 @@ The action group consists of a primary and secondary action. Any additional acti
154
154
  class="pf-v6-c-menu-toggle pf-m-plain"
155
155
  type="button"
156
156
  aria-expanded="false"
157
- aria-label="Menu toggle"
157
+ aria-label="Additional options in menu toggle"
158
158
  id="overflow-menu-simple-additional-options-hidden-toggle"
159
159
  >
160
160
  <span class="pf-v6-c-menu-toggle__icon">
@@ -232,7 +232,7 @@ The action group consists of a primary and secondary action. Any additional acti
232
232
  class="pf-v6-c-menu-toggle pf-m-plain"
233
233
  type="button"
234
234
  aria-expanded="false"
235
- aria-label="Menu toggle"
235
+ aria-label="Additional options toggle"
236
236
  id="overflow-menu-simple-additional-options-visible-toggle"
237
237
  >
238
238
  <span class="pf-v6-c-menu-toggle__icon">
@@ -264,7 +264,7 @@ The action group consists of a primary and secondary action. Any additional acti
264
264
  class="pf-v6-c-menu-toggle pf-m-plain"
265
265
  type="button"
266
266
  aria-expanded="false"
267
- aria-label="Menu toggle"
267
+ aria-label="menu with additional options"
268
268
  id="overflow-menu-persistent-hidden-toggle"
269
269
  >
270
270
  <span class="pf-v6-c-menu-toggle__icon">
@@ -307,7 +307,7 @@ The action group consists of a primary and secondary action. Any additional acti
307
307
  class="pf-v6-c-menu-toggle pf-m-plain"
308
308
  type="button"
309
309
  aria-expanded="false"
310
- aria-label="Menu toggle"
310
+ aria-label="Persistent options toggle"
311
311
  id="overflow-menu-persistent-visible-example-toggle"
312
312
  >
313
313
  <span class="pf-v6-c-menu-toggle__icon">