@patternfly/patternfly 4.180.1 → 4.182.1

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 (23) hide show
  1. package/assets/images/status-icon-sprite.svg +38 -0
  2. package/components/FormControl/form-control.css +26 -0
  3. package/components/FormControl/form-control.scss +30 -1
  4. package/components/Masthead/masthead.css +21 -27
  5. package/components/Masthead/masthead.scss +21 -27
  6. package/components/Menu/menu.css +10 -0
  7. package/components/Menu/menu.scss +14 -0
  8. package/components/MenuToggle/menu-toggle.css +135 -1
  9. package/components/MenuToggle/menu-toggle.scss +201 -2
  10. package/docs/components/FormControl/examples/FormControl.md +151 -0
  11. package/docs/components/Menu/examples/Menu.md +67 -2
  12. package/docs/components/MenuToggle/examples/MenuToggle.md +552 -20
  13. package/docs/components/Table/examples/Table.md +137 -48
  14. package/docs/demos/ContextSelector/examples/ContextSelector.md +6 -6
  15. package/docs/demos/DescriptionList/examples/DescriptionList.md +3358 -0
  16. package/docs/demos/Masthead/examples/Masthead.md +4 -4
  17. package/docs/demos/Page/examples/Page.md +14 -14
  18. package/docs/demos/Table/examples/Table.md +26 -26
  19. package/package.json +1 -1
  20. package/patternfly-no-reset.css +192 -28
  21. package/patternfly.css +192 -28
  22. package/patternfly.min.css +1 -1
  23. package/patternfly.min.css.map +1 -1
package/patternfly-no-reset.css CHANGED
@@ -14054,6 +14054,18 @@ label.pf-c-check, .pf-c-check__label,
14054
14054
  --pf-c-form-control--textarea--success--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14055
14055
  --pf-c-form-control--textarea--m-warning--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14056
14056
  --pf-c-form-control--textarea--invalid--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14057
+ --pf-c-form-control--m-icon-sprite--success--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#success");
14058
+ --pf-c-form-control--m-icon-sprite--m-warning--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#warning");
14059
+ --pf-c-form-control--m-icon-sprite--m-invalid--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#invalid");
14060
+ --pf-c-form-control--m-icon-sprite__select--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#select");
14061
+ --pf-c-form-control--m-icon-sprite--m-search--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#search");
14062
+ --pf-c-form-control--m-icon-sprite--m-calendar--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#calendar");
14063
+ --pf-c-form-control--m-icon-sprite--m-clock--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#clock");
14064
+ --pf-c-form-control--m-icon-sprite__select--BackgroundSize: var(--pf-c-form-control--FontSize);
14065
+ --pf-c-form-control--m-icon-sprite__select--BackgroundPositionX: calc(100% - var(--pf-global--spacer--md) + 7px);
14066
+ --pf-c-form-control--m-icon-sprite__select--success--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) + 1px - var(--pf-global--spacer--lg));
14067
+ --pf-c-form-control--m-icon-sprite__select--m-warning--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) - var(--pf-global--spacer--lg) + 0.0625rem);
14068
+ --pf-c-form-control--m-icon-sprite__select--invalid--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) - var(--pf-global--spacer--lg));
14057
14069
  color: var(--pf-global--Color--100);
14058
14070
  width: var(--pf-c-form-control--Width);
14059
14071
  padding: var(--pf-c-form-control--PaddingTop) var(--pf-c-form-control--PaddingRight) var(--pf-c-form-control--PaddingBottom) var(--pf-c-form-control--PaddingLeft);
@@ -14167,6 +14179,20 @@ label.pf-c-check, .pf-c-check__label,
14167
14179
  .pf-c-form-control.pf-m-icon.pf-m-clock {
14168
14180
  --pf-c-form-control--m-icon--BackgroundUrl: var(--pf-c-form-control--m-clock--BackgroundUrl);
14169
14181
  }
14182
+ .pf-c-form-control.pf-m-icon-sprite {
14183
+ --pf-c-form-control--success--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--success--BackgroundUrl);
14184
+ --pf-c-form-control--m-warning--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-warning--BackgroundUrl);
14185
+ --pf-c-form-control--m-invalid--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-invalid--BackgroundUrl);
14186
+ --pf-c-form-control__select--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite__select--BackgroundUrl);
14187
+ --pf-c-form-control--m-search--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-search--BackgroundUrl);
14188
+ --pf-c-form-control--m-calendar--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-calendar--BackgroundUrl);
14189
+ --pf-c-form-control--m-clock--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-clock--BackgroundUrl);
14190
+ --pf-c-form-control__select--BackgroundSize: var(--pf-c-form-control--m-icon-sprite__select--BackgroundSize);
14191
+ --pf-c-form-control__select--BackgroundPositionX: var(--pf-c-form-control--m-icon-sprite__select--BackgroundPositionX);
14192
+ --pf-c-form-control__select--success--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--success--BackgroundPosition);
14193
+ --pf-c-form-control__select--m-warning--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--m-warning--BackgroundPosition);
14194
+ --pf-c-form-control__select--invalid--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--invalid--BackgroundPosition);
14195
+ }
14170
14196
  select.pf-c-form-control {
14171
14197
  --pf-c-form-control--PaddingRight: var(--pf-c-form-control__select--PaddingRight);
14172
14198
  --pf-c-form-control--PaddingLeft: var(--pf-c-form-control__select--PaddingLeft);
@@ -15873,24 +15899,21 @@ ul.pf-c-list {
15873
15899
  --pf-c-masthead--c-toolbar__item--Display: flex;
15874
15900
  --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
15875
15901
  --pf-c-masthead--c-context-selector--Width: auto;
15876
- --pf-c-masthead--c-context-selector__toggle--BorderTopColor: transparent;
15877
- --pf-c-masthead--c-context-selector__toggle--BorderRightColor: transparent;
15878
- --pf-c-masthead--c-context-selector__toggle--BorderBottomColor: transparent;
15879
- --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: transparent;
15880
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15881
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15882
- --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: transparent;
15883
- --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: transparent;
15884
- --pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor: transparent;
15885
- --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: transparent;
15886
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15887
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15888
- --pf-c-masthead--c-menu-toggle--before--BorderTopColor: transparent;
15889
- --pf-c-masthead--c-menu-toggle--before--BorderRightColor: transparent;
15890
- --pf-c-masthead--c-menu-toggle--before--BorderBottomColor: transparent;
15891
- --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: transparent;
15892
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15893
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15902
+ --pf-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
15903
+ --pf-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15904
+ --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15905
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
15906
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
15907
+ --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
15908
+ --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15909
+ --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15910
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
15911
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
15912
+ --pf-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
15913
+ --pf-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
15914
+ --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
15915
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor: transparent;
15916
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor: transparent;
15894
15917
  --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
15895
15918
  --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
15896
15919
  --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
@@ -15983,33 +16006,30 @@ ul.pf-c-list {
15983
16006
  .pf-c-masthead .pf-c-menu-toggle {
15984
16007
  --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
15985
16008
  --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
15986
- --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--before--BorderBottomColor);
15987
16009
  --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
15988
16010
  }
15989
16011
  .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
15990
- --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor);
15991
- --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor);
16012
+ --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor);
16013
+ --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor);
15992
16014
  }
15993
16015
  .pf-c-masthead .pf-c-context-selector {
15994
16016
  --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
15995
16017
  --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
15996
16018
  --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
15997
- --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector__toggle--BorderBottomColor);
15998
16019
  --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
15999
16020
  }
16000
16021
  .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
16001
- --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor);
16002
- --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor);
16022
+ --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
16023
+ --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
16003
16024
  }
16004
16025
  .pf-c-masthead .pf-c-dropdown {
16005
16026
  --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
16006
16027
  --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
16007
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor);
16008
16028
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
16009
16029
  }
16010
16030
  .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
16011
- --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
16012
- --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
16031
+ --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
16032
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
16013
16033
  }
16014
16034
  .pf-c-masthead .pf-c-nav {
16015
16035
  align-self: stretch;
@@ -16517,6 +16537,7 @@ ul.pf-c-list {
16517
16537
  --pf-c-menu__item-description--FontSize: var(--pf-global--FontSize--xs);
16518
16538
  --pf-c-menu__item-description--Color: var(--pf-global--Color--200);
16519
16539
  --pf-c-menu__item-icon--MarginRight: var(--pf-global--spacer--sm);
16540
+ --pf-c-menu__item-check--MarginRight: var(--pf-global--spacer--sm);
16520
16541
  --pf-c-menu__item-toggle-icon--PaddingRight: var(--pf-global--spacer--sm);
16521
16542
  --pf-c-menu__item-toggle-icon--PaddingLeft: var(--pf-global--spacer--sm);
16522
16543
  --pf-c-menu__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
@@ -16879,6 +16900,9 @@ ul.pf-c-list {
16879
16900
  .pf-c-menu__item.pf-m-selected .pf-c-menu__item-select-icon {
16880
16901
  opacity: 1;
16881
16902
  }
16903
+ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
16904
+ cursor: pointer;
16905
+ }
16882
16906
 
16883
16907
  .pf-c-menu__item-main {
16884
16908
  display: flex;
@@ -16923,6 +16947,12 @@ ul.pf-c-list {
16923
16947
  margin-right: var(--pf-c-menu__item-icon--MarginRight);
16924
16948
  }
16925
16949
 
16950
+ .pf-c-menu__item-check {
16951
+ display: flex;
16952
+ align-items: center;
16953
+ margin-right: var(--pf-c-menu__item-check--MarginRight);
16954
+ }
16955
+
16926
16956
  .pf-c-menu__item-toggle-icon {
16927
16957
  padding-right: var(--pf-c-menu__item-toggle-icon--PaddingRight);
16928
16958
  padding-left: var(--pf-c-menu__item-toggle-icon--PaddingLeft);
@@ -17071,6 +17101,33 @@ ul.pf-c-list {
17071
17101
  --pf-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17072
17102
  --pf-c-menu-toggle--m-full-height--focus--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17073
17103
  --pf-c-menu-toggle--m-full-height--active--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17104
+ --pf-c-menu-toggle--m-split-button--BackgroundColor: var(--pf-global--BackgroundColor--100);
17105
+ --pf-c-menu-toggle--m-split-button--child--BackgroundColor: var(--pf-global--BackgroundColor--100);
17106
+ --pf-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-global--Color--dark-200);
17107
+ --pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
17108
+ --pf-c-menu-toggle--m-split-button--first-child--PaddingRight: var(--pf-global--spacer--sm);
17109
+ --pf-c-menu-toggle--m-split-button--last-child--PaddingLeft: 0;
17110
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
17111
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-global--BorderColor--300);
17112
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--Left: 0;
17113
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
17114
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-global--BorderColor--200);
17115
+ --pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
17116
+ --pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomColor: var(--pf-global--active-color--100);
17117
+ --pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomWidth: var(--pf-global--BorderWidth--md);
17118
+ --pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomColor: var(--pf-global--active-color--100);
17119
+ --pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomWidth: var(--pf-global--BorderWidth--md);
17120
+ --pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomColor: var(--pf-global--active-color--100);
17121
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius: var(--pf-global--BorderRadius--sm);
17122
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-global--primary-color--100);
17123
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor: var(--pf-global--primary-color--200);
17124
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--focus--BackgroundColor: var(--pf-global--primary-color--200);
17125
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--active--BackgroundColor: var(--pf-global--primary-color--200);
17126
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderLeftColor: var(--pf-global--primary-color--200);
17127
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor: var(--pf-global--primary-color--200);
17128
+ --pf-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-global--primary-color--100);
17129
+ --pf-c-menu-toggle__button__controls--MarginRight: var(--pf-global--spacer--sm);
17130
+ --pf-c-menu-toggle__button__controls--MarginLeft: var(--pf-global--spacer--sm);
17074
17131
  position: relative;
17075
17132
  display: inline-flex;
17076
17133
  align-items: center;
@@ -17182,7 +17239,7 @@ ul.pf-c-list {
17182
17239
  --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color);
17183
17240
  --pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
17184
17241
  }
17185
- .pf-c-menu-toggle:disabled {
17242
+ .pf-c-menu-toggle:disabled, .pf-c-menu-toggle.pf-m-disabled {
17186
17243
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--disabled--Color);
17187
17244
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--disabled--BackgroundColor);
17188
17245
  --pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
@@ -17201,6 +17258,113 @@ ul.pf-c-list {
17201
17258
  --pf-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
17202
17259
  height: 100%;
17203
17260
  }
17261
+ .pf-c-menu-toggle.pf-m-split-button {
17262
+ --pf-c-menu-toggle__toggle-icon--MarginRight: 0;
17263
+ padding: 0;
17264
+ }
17265
+ .pf-c-menu-toggle.pf-m-split-button > * {
17266
+ position: relative;
17267
+ padding: var(--pf-c-menu-toggle--PaddingTop) var(--pf-c-menu-toggle--PaddingRight) var(--pf-c-menu-toggle--PaddingBottom) var(--pf-c-menu-toggle--PaddingLeft);
17268
+ }
17269
+ .pf-c-menu-toggle.pf-m-split-button > *:first-child {
17270
+ padding-right: var(--pf-c-menu-toggle--m-split-button--first-child--PaddingRight);
17271
+ }
17272
+ .pf-c-menu-toggle.pf-m-split-button:where(:not(.pf-m-action)) > :last-child {
17273
+ padding-left: var(--pf-c-menu-toggle--m-split-button--last-child--PaddingLeft);
17274
+ }
17275
+ .pf-c-menu-toggle.pf-m-split-button > .pf-c-check {
17276
+ --pf-c-menu-toggle--PaddingRight: 0;
17277
+ --pf-c-check__input--MarginTop: 0;
17278
+ --pf-c-check__label--Color: var(--pf-c-check__label--Color, inherit);
17279
+ align-items: center;
17280
+ align-self: stretch;
17281
+ }
17282
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
17283
+ position: absolute;
17284
+ top: 0;
17285
+ right: 0;
17286
+ bottom: 0;
17287
+ left: var(--pf-c-menu-toggle--m-split-button--m-action--child--after--Left);
17288
+ pointer-events: none;
17289
+ content: "";
17290
+ border-bottom: var(--pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth) solid var(--pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor);
17291
+ }
17292
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:hover {
17293
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomWidth);
17294
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomColor);
17295
+ }
17296
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:focus {
17297
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomWidth);
17298
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomColor);
17299
+ }
17300
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:active, .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *.pf-m-active {
17301
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomWidth);
17302
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomColor);
17303
+ }
17304
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary {
17305
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderLeftColor);
17306
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: 0;
17307
+ }
17308
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])) {
17309
+ background-color: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor);
17310
+ }
17311
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):hover {
17312
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor);
17313
+ }
17314
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):focus {
17315
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--focus--BackgroundColor);
17316
+ }
17317
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):active, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])).pf-m-active {
17318
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--active--BackgroundColor);
17319
+ }
17320
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-expanded {
17321
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor);
17322
+ }
17323
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
17324
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor);
17325
+ }
17326
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
17327
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: 0;
17328
+ }
17329
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :first-child, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary > :first-child {
17330
+ border-top-left-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17331
+ border-bottom-left-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17332
+ }
17333
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :last-child, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary > :last-child {
17334
+ border-top-right-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17335
+ border-bottom-right-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17336
+ }
17337
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
17338
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--Left: calc(var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth) * -1);
17339
+ border-left: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth) solid var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor);
17340
+ }
17341
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:not(.pf-m-expanded) {
17342
+ --pf-c-menu-toggle--after--BorderBottomColor: transparent;
17343
+ }
17344
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled, .pf-c-menu-toggle.pf-m-split-button:disabled {
17345
+ --pf-c-menu-toggle--m-split-button--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
17346
+ --pf-c-menu-toggle--m-split-button--child--Color: var(--pf-c-menu-toggle--m-split-button--child--disabled--Color);
17347
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: transparent;
17348
+ }
17349
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled::before, .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled::after, .pf-c-menu-toggle.pf-m-split-button:disabled::before, .pf-c-menu-toggle.pf-m-split-button:disabled::after {
17350
+ content: none;
17351
+ }
17352
+ .pf-c-menu-toggle.pf-m-split-button > .pf-m-disabled,
17353
+ .pf-c-menu-toggle.pf-m-split-button > :disabled {
17354
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: transparent;
17355
+ color: var(--pf-c-menu-toggle--m-split-button--child--disabled--Color);
17356
+ background-color: var(--pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
17357
+ }
17358
+
17359
+ .pf-c-menu-toggle__button {
17360
+ color: inherit;
17361
+ border: 0;
17362
+ }
17363
+ .pf-c-menu-toggle__button .pf-c-menu-toggle__controls {
17364
+ padding-left: 0;
17365
+ margin-right: var(--pf-c-menu-toggle__button__controls--MarginRight);
17366
+ margin-left: var(--pf-c-menu-toggle__button__controls--MarginLeft);
17367
+ }
17204
17368
 
17205
17369
  .pf-c-menu-toggle__icon {
17206
17370
  display: inline-flex;
package/patternfly.css CHANGED
@@ -14176,6 +14176,18 @@ label.pf-c-check, .pf-c-check__label,
14176
14176
  --pf-c-form-control--textarea--success--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14177
14177
  --pf-c-form-control--textarea--m-warning--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14178
14178
  --pf-c-form-control--textarea--invalid--BackgroundPositionY: var(--pf-c-form-control--PaddingLeft);
14179
+ --pf-c-form-control--m-icon-sprite--success--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#success");
14180
+ --pf-c-form-control--m-icon-sprite--m-warning--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#warning");
14181
+ --pf-c-form-control--m-icon-sprite--m-invalid--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#invalid");
14182
+ --pf-c-form-control--m-icon-sprite__select--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#select");
14183
+ --pf-c-form-control--m-icon-sprite--m-search--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#search");
14184
+ --pf-c-form-control--m-icon-sprite--m-calendar--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#calendar");
14185
+ --pf-c-form-control--m-icon-sprite--m-clock--BackgroundUrl: url("./assets/images/status-icon-sprite.svg#clock");
14186
+ --pf-c-form-control--m-icon-sprite__select--BackgroundSize: var(--pf-c-form-control--FontSize);
14187
+ --pf-c-form-control--m-icon-sprite__select--BackgroundPositionX: calc(100% - var(--pf-global--spacer--md) + 7px);
14188
+ --pf-c-form-control--m-icon-sprite__select--success--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) + 1px - var(--pf-global--spacer--lg));
14189
+ --pf-c-form-control--m-icon-sprite__select--m-warning--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) - var(--pf-global--spacer--lg) + 0.0625rem);
14190
+ --pf-c-form-control--m-icon-sprite__select--invalid--BackgroundPosition: calc(100% - var(--pf-global--spacer--md) - var(--pf-global--spacer--lg));
14179
14191
  color: var(--pf-global--Color--100);
14180
14192
  width: var(--pf-c-form-control--Width);
14181
14193
  padding: var(--pf-c-form-control--PaddingTop) var(--pf-c-form-control--PaddingRight) var(--pf-c-form-control--PaddingBottom) var(--pf-c-form-control--PaddingLeft);
@@ -14289,6 +14301,20 @@ label.pf-c-check, .pf-c-check__label,
14289
14301
  .pf-c-form-control.pf-m-icon.pf-m-clock {
14290
14302
  --pf-c-form-control--m-icon--BackgroundUrl: var(--pf-c-form-control--m-clock--BackgroundUrl);
14291
14303
  }
14304
+ .pf-c-form-control.pf-m-icon-sprite {
14305
+ --pf-c-form-control--success--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--success--BackgroundUrl);
14306
+ --pf-c-form-control--m-warning--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-warning--BackgroundUrl);
14307
+ --pf-c-form-control--m-invalid--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-invalid--BackgroundUrl);
14308
+ --pf-c-form-control__select--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite__select--BackgroundUrl);
14309
+ --pf-c-form-control--m-search--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-search--BackgroundUrl);
14310
+ --pf-c-form-control--m-calendar--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-calendar--BackgroundUrl);
14311
+ --pf-c-form-control--m-clock--BackgroundUrl: var(--pf-c-form-control--m-icon-sprite--m-clock--BackgroundUrl);
14312
+ --pf-c-form-control__select--BackgroundSize: var(--pf-c-form-control--m-icon-sprite__select--BackgroundSize);
14313
+ --pf-c-form-control__select--BackgroundPositionX: var(--pf-c-form-control--m-icon-sprite__select--BackgroundPositionX);
14314
+ --pf-c-form-control__select--success--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--success--BackgroundPosition);
14315
+ --pf-c-form-control__select--m-warning--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--m-warning--BackgroundPosition);
14316
+ --pf-c-form-control__select--invalid--BackgroundPosition: var(--pf-c-form-control--m-icon-sprite__select--invalid--BackgroundPosition);
14317
+ }
14292
14318
  select.pf-c-form-control {
14293
14319
  --pf-c-form-control--PaddingRight: var(--pf-c-form-control__select--PaddingRight);
14294
14320
  --pf-c-form-control--PaddingLeft: var(--pf-c-form-control__select--PaddingLeft);
@@ -15995,24 +16021,21 @@ ul.pf-c-list {
15995
16021
  --pf-c-masthead--c-toolbar__item--Display: flex;
15996
16022
  --pf-c-masthead--item-border-color--base: var(--pf-global--palette--black-800);
15997
16023
  --pf-c-masthead--c-context-selector--Width: auto;
15998
- --pf-c-masthead--c-context-selector__toggle--BorderTopColor: transparent;
15999
- --pf-c-masthead--c-context-selector__toggle--BorderRightColor: transparent;
16000
- --pf-c-masthead--c-context-selector__toggle--BorderBottomColor: transparent;
16001
- --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: transparent;
16002
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16003
- --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16004
- --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: transparent;
16005
- --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: transparent;
16006
- --pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor: transparent;
16007
- --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: transparent;
16008
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16009
- --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16010
- --pf-c-masthead--c-menu-toggle--before--BorderTopColor: transparent;
16011
- --pf-c-masthead--c-menu-toggle--before--BorderRightColor: transparent;
16012
- --pf-c-masthead--c-menu-toggle--before--BorderBottomColor: transparent;
16013
- --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: transparent;
16014
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16015
- --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16024
+ --pf-c-masthead--c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
16025
+ --pf-c-masthead--c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16026
+ --pf-c-masthead--c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16027
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor: transparent;
16028
+ --pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor: transparent;
16029
+ --pf-c-masthead--c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
16030
+ --pf-c-masthead--c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16031
+ --pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16032
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor: transparent;
16033
+ --pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor: transparent;
16034
+ --pf-c-masthead--c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--item-border-color--base);
16035
+ --pf-c-masthead--c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--item-border-color--base);
16036
+ --pf-c-masthead--c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--item-border-color--base);
16037
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor: transparent;
16038
+ --pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor: transparent;
16016
16039
  --pf-c-masthead--c-toolbar__content--PaddingRight: 0;
16017
16040
  --pf-c-masthead--c-toolbar__content--PaddingLeft: 0;
16018
16041
  --pf-c-masthead--c-toolbar__expandable-content--PaddingTop: var(--pf-global--spacer--md);
@@ -16105,33 +16128,30 @@ ul.pf-c-list {
16105
16128
  .pf-c-masthead .pf-c-menu-toggle {
16106
16129
  --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--before--BorderTopColor);
16107
16130
  --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--before--BorderRightColor);
16108
- --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--before--BorderBottomColor);
16109
16131
  --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--before--BorderLeftColor);
16110
16132
  }
16111
16133
  .pf-c-masthead .pf-c-menu-toggle.pf-m-full-height {
16112
- --pf-c-menu-toggle--before--BorderRightColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderRightColor);
16113
- --pf-c-menu-toggle--before--BorderLeftColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderLeftColor);
16134
+ --pf-c-menu-toggle--before--BorderTopColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderTopColor);
16135
+ --pf-c-menu-toggle--before--BorderBottomColor: var(--pf-c-masthead--c-menu-toggle--m-full-height--before--BorderBottomColor);
16114
16136
  }
16115
16137
  .pf-c-masthead .pf-c-context-selector {
16116
16138
  --pf-c-context-selector--Width: var(--pf-c-masthead--c-context-selector--Width);
16117
16139
  --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector__toggle--BorderTopColor);
16118
16140
  --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector__toggle--BorderRightColor);
16119
- --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector__toggle--BorderBottomColor);
16120
16141
  --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector__toggle--BorderLeftColor);
16121
16142
  }
16122
16143
  .pf-c-masthead .pf-c-context-selector.pf-m-full-height {
16123
- --pf-c-context-selector__toggle--BorderRightColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderRightColor);
16124
- --pf-c-context-selector__toggle--BorderLeftColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderLeftColor);
16144
+ --pf-c-context-selector__toggle--BorderTopColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderTopColor);
16145
+ --pf-c-context-selector__toggle--BorderBottomColor: var(--pf-c-masthead--c-context-selector--m-full-height__toggle--BorderBottomColor);
16125
16146
  }
16126
16147
  .pf-c-masthead .pf-c-dropdown {
16127
16148
  --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderTopColor);
16128
16149
  --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderRightColor);
16129
- --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderBottomColor);
16130
16150
  --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown__toggle--before--BorderLeftColor);
16131
16151
  }
16132
16152
  .pf-c-masthead .pf-c-dropdown.pf-m-full-height {
16133
- --pf-c-dropdown__toggle--before--BorderRightColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderRightColor);
16134
- --pf-c-dropdown__toggle--before--BorderLeftColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderLeftColor);
16153
+ --pf-c-dropdown__toggle--before--BorderTopColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderTopColor);
16154
+ --pf-c-dropdown__toggle--before--BorderBottomColor: var(--pf-c-masthead--c-dropdown--m-full-height__toggle--before--BorderBottomColor);
16135
16155
  }
16136
16156
  .pf-c-masthead .pf-c-nav {
16137
16157
  align-self: stretch;
@@ -16639,6 +16659,7 @@ ul.pf-c-list {
16639
16659
  --pf-c-menu__item-description--FontSize: var(--pf-global--FontSize--xs);
16640
16660
  --pf-c-menu__item-description--Color: var(--pf-global--Color--200);
16641
16661
  --pf-c-menu__item-icon--MarginRight: var(--pf-global--spacer--sm);
16662
+ --pf-c-menu__item-check--MarginRight: var(--pf-global--spacer--sm);
16642
16663
  --pf-c-menu__item-toggle-icon--PaddingRight: var(--pf-global--spacer--sm);
16643
16664
  --pf-c-menu__item-toggle-icon--PaddingLeft: var(--pf-global--spacer--sm);
16644
16665
  --pf-c-menu__list-item--m-disabled__item-toggle-icon--Color: var(--pf-global--disabled-color--200);
@@ -17001,6 +17022,9 @@ ul.pf-c-list {
17001
17022
  .pf-c-menu__item.pf-m-selected .pf-c-menu__item-select-icon {
17002
17023
  opacity: 1;
17003
17024
  }
17025
+ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17026
+ cursor: pointer;
17027
+ }
17004
17028
 
17005
17029
  .pf-c-menu__item-main {
17006
17030
  display: flex;
@@ -17045,6 +17069,12 @@ ul.pf-c-list {
17045
17069
  margin-right: var(--pf-c-menu__item-icon--MarginRight);
17046
17070
  }
17047
17071
 
17072
+ .pf-c-menu__item-check {
17073
+ display: flex;
17074
+ align-items: center;
17075
+ margin-right: var(--pf-c-menu__item-check--MarginRight);
17076
+ }
17077
+
17048
17078
  .pf-c-menu__item-toggle-icon {
17049
17079
  padding-right: var(--pf-c-menu__item-toggle-icon--PaddingRight);
17050
17080
  padding-left: var(--pf-c-menu__item-toggle-icon--PaddingLeft);
@@ -17193,6 +17223,33 @@ ul.pf-c-list {
17193
17223
  --pf-c-menu-toggle--m-full-height--hover--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17194
17224
  --pf-c-menu-toggle--m-full-height--focus--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17195
17225
  --pf-c-menu-toggle--m-full-height--active--after--BorderBottomWidth: var(--pf-global--BorderWidth--xl);
17226
+ --pf-c-menu-toggle--m-split-button--BackgroundColor: var(--pf-global--BackgroundColor--100);
17227
+ --pf-c-menu-toggle--m-split-button--child--BackgroundColor: var(--pf-global--BackgroundColor--100);
17228
+ --pf-c-menu-toggle--m-split-button--child--disabled--Color: var(--pf-global--Color--dark-200);
17229
+ --pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
17230
+ --pf-c-menu-toggle--m-split-button--first-child--PaddingRight: var(--pf-global--spacer--sm);
17231
+ --pf-c-menu-toggle--m-split-button--last-child--PaddingLeft: 0;
17232
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
17233
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-global--BorderColor--300);
17234
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--Left: 0;
17235
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
17236
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-global--BorderColor--200);
17237
+ --pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
17238
+ --pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomColor: var(--pf-global--active-color--100);
17239
+ --pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomWidth: var(--pf-global--BorderWidth--md);
17240
+ --pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomColor: var(--pf-global--active-color--100);
17241
+ --pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomWidth: var(--pf-global--BorderWidth--md);
17242
+ --pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomColor: var(--pf-global--active-color--100);
17243
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius: var(--pf-global--BorderRadius--sm);
17244
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-global--primary-color--100);
17245
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor: var(--pf-global--primary-color--200);
17246
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--focus--BackgroundColor: var(--pf-global--primary-color--200);
17247
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--active--BackgroundColor: var(--pf-global--primary-color--200);
17248
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderLeftColor: var(--pf-global--primary-color--200);
17249
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor: var(--pf-global--primary-color--200);
17250
+ --pf-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-global--primary-color--100);
17251
+ --pf-c-menu-toggle__button__controls--MarginRight: var(--pf-global--spacer--sm);
17252
+ --pf-c-menu-toggle__button__controls--MarginLeft: var(--pf-global--spacer--sm);
17196
17253
  position: relative;
17197
17254
  display: inline-flex;
17198
17255
  align-items: center;
@@ -17304,7 +17361,7 @@ ul.pf-c-list {
17304
17361
  --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--m-expanded__toggle-icon--Color);
17305
17362
  --pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--m-expanded--Color);
17306
17363
  }
17307
- .pf-c-menu-toggle:disabled {
17364
+ .pf-c-menu-toggle:disabled, .pf-c-menu-toggle.pf-m-disabled {
17308
17365
  --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--disabled--Color);
17309
17366
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--disabled--BackgroundColor);
17310
17367
  --pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--disabled--Color);
@@ -17323,6 +17380,113 @@ ul.pf-c-list {
17323
17380
  --pf-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
17324
17381
  height: 100%;
17325
17382
  }
17383
+ .pf-c-menu-toggle.pf-m-split-button {
17384
+ --pf-c-menu-toggle__toggle-icon--MarginRight: 0;
17385
+ padding: 0;
17386
+ }
17387
+ .pf-c-menu-toggle.pf-m-split-button > * {
17388
+ position: relative;
17389
+ padding: var(--pf-c-menu-toggle--PaddingTop) var(--pf-c-menu-toggle--PaddingRight) var(--pf-c-menu-toggle--PaddingBottom) var(--pf-c-menu-toggle--PaddingLeft);
17390
+ }
17391
+ .pf-c-menu-toggle.pf-m-split-button > *:first-child {
17392
+ padding-right: var(--pf-c-menu-toggle--m-split-button--first-child--PaddingRight);
17393
+ }
17394
+ .pf-c-menu-toggle.pf-m-split-button:where(:not(.pf-m-action)) > :last-child {
17395
+ padding-left: var(--pf-c-menu-toggle--m-split-button--last-child--PaddingLeft);
17396
+ }
17397
+ .pf-c-menu-toggle.pf-m-split-button > .pf-c-check {
17398
+ --pf-c-menu-toggle--PaddingRight: 0;
17399
+ --pf-c-check__input--MarginTop: 0;
17400
+ --pf-c-check__label--Color: var(--pf-c-check__label--Color, inherit);
17401
+ align-items: center;
17402
+ align-self: stretch;
17403
+ }
17404
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *::after {
17405
+ position: absolute;
17406
+ top: 0;
17407
+ right: 0;
17408
+ bottom: 0;
17409
+ left: var(--pf-c-menu-toggle--m-split-button--m-action--child--after--Left);
17410
+ pointer-events: none;
17411
+ content: "";
17412
+ border-bottom: var(--pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth) solid var(--pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor);
17413
+ }
17414
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:hover {
17415
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomWidth);
17416
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--hover--after--BorderBottomColor);
17417
+ }
17418
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:focus {
17419
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomWidth);
17420
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--focus--after--BorderBottomColor);
17421
+ }
17422
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *:active, .pf-c-menu-toggle.pf-m-split-button.pf-m-action:where(:not(.pf-m-primary, .pf-m-secondary, .pf-m-disabled)) > *.pf-m-active {
17423
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomWidth);
17424
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomColor: var(--pf-c-menu-toggle--m-split-button--m-action--child--active--after--BorderBottomColor);
17425
+ }
17426
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary {
17427
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BorderLeftColor);
17428
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: 0;
17429
+ }
17430
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])) {
17431
+ background-color: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor);
17432
+ }
17433
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):hover {
17434
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--hover--BackgroundColor);
17435
+ }
17436
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):focus {
17437
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--focus--BackgroundColor);
17438
+ }
17439
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])):active, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :where(:not(.pf-m-disabled):not([disabled])).pf-m-active {
17440
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--child--active--BackgroundColor);
17441
+ }
17442
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary.pf-m-expanded {
17443
+ --pf-c-menu-toggle--m-split-button--m-action--m-primary--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-primary--m-expanded--child--BackgroundColor);
17444
+ }
17445
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
17446
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: var(--pf-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor);
17447
+ }
17448
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary {
17449
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--BorderBottomWidth: 0;
17450
+ }
17451
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :first-child, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary > :first-child {
17452
+ border-top-left-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17453
+ border-bottom-left-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17454
+ }
17455
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-primary > :last-child, .pf-c-menu-toggle.pf-m-split-button.pf-m-action.pf-m-secondary > :last-child {
17456
+ border-top-right-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17457
+ border-bottom-right-radius: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderRadius);
17458
+ }
17459
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action > :not(:first-child) {
17460
+ --pf-c-menu-toggle--m-split-button--m-action--child--after--Left: calc(var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth) * -1);
17461
+ border-left: var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftWidth) solid var(--pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor);
17462
+ }
17463
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-action:not(.pf-m-expanded) {
17464
+ --pf-c-menu-toggle--after--BorderBottomColor: transparent;
17465
+ }
17466
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled, .pf-c-menu-toggle.pf-m-split-button:disabled {
17467
+ --pf-c-menu-toggle--m-split-button--child--BackgroundColor: var(--pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
17468
+ --pf-c-menu-toggle--m-split-button--child--Color: var(--pf-c-menu-toggle--m-split-button--child--disabled--Color);
17469
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: transparent;
17470
+ }
17471
+ .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled::before, .pf-c-menu-toggle.pf-m-split-button.pf-m-disabled::after, .pf-c-menu-toggle.pf-m-split-button:disabled::before, .pf-c-menu-toggle.pf-m-split-button:disabled::after {
17472
+ content: none;
17473
+ }
17474
+ .pf-c-menu-toggle.pf-m-split-button > .pf-m-disabled,
17475
+ .pf-c-menu-toggle.pf-m-split-button > :disabled {
17476
+ --pf-c-menu-toggle--m-split-button--m-action--child--BorderLeftColor: transparent;
17477
+ color: var(--pf-c-menu-toggle--m-split-button--child--disabled--Color);
17478
+ background-color: var(--pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
17479
+ }
17480
+
17481
+ .pf-c-menu-toggle__button {
17482
+ color: inherit;
17483
+ border: 0;
17484
+ }
17485
+ .pf-c-menu-toggle__button .pf-c-menu-toggle__controls {
17486
+ padding-left: 0;
17487
+ margin-right: var(--pf-c-menu-toggle__button__controls--MarginRight);
17488
+ margin-left: var(--pf-c-menu-toggle__button__controls--MarginLeft);
17489
+ }
17326
17490
 
17327
17491
  .pf-c-menu-toggle__icon {
17328
17492
  display: inline-flex;