@patternfly/patternfly 6.0.0-alpha.230 → 6.0.0-alpha.231

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.
package/patternfly.css CHANGED
@@ -5803,9 +5803,6 @@ button) {
5803
5803
  var(--pf-t--global--box-shadow--blur--lg)
5804
5804
  var(--pf-t--global--box-shadow--spread--lg)
5805
5805
  var(--pf-t--global--box-shadow--color--lg);
5806
- --pf-t--global--transition: all 250ms cubic-bezier(.42, 0, .58, 1);
5807
- --pf-t--global--transition--timing-function: cubic-bezier(.645, .045, .355, 1);
5808
- --pf-t--global--transition--duration: 250ms;
5809
5806
  --pf-t--global--list-style: disc outside;
5810
5807
  --pf-t--temp--dev--tbd: #BC11E0;
5811
5808
  }
@@ -6588,7 +6585,8 @@ button) {
6588
6585
  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
6589
6586
  --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
6590
6587
  --pf-v6-c-alert__toggle-icon--Rotate: 0;
6591
- --pf-v6-c-alert__toggle-icon--Transition: var(--pf-t--global--transition);
6588
+ --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
6589
+ --pf-v6-c-alert__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
6592
6590
  --pf-v6-c-alert__icon--Color: var(--pf-t--global--icon--color--regular);
6593
6591
  --pf-v6-c-alert__icon--MarginBlockStart: 0.25rem;
6594
6592
  --pf-v6-c-alert__icon--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
@@ -6709,7 +6707,7 @@ button) {
6709
6707
 
6710
6708
  .pf-v6-c-alert__toggle-icon {
6711
6709
  display: inline-block;
6712
- transition: var(--pf-v6-c-alert__toggle-icon--Transition);
6710
+ transition: transform var(--pf-v6-c-alert__toggle-icon--TransitionDuration) var(--pf-v6-c-alert__toggle-icon--TransitionTimingFunction);
6713
6711
  transform: rotate(var(--pf-v6-c-alert__toggle-icon--Rotate));
6714
6712
  }
6715
6713
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-alert__toggle-icon {
@@ -8423,7 +8421,8 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
8423
8421
  --pf-v6-c-card__header-toggle--MarginInlineEnd: var(--pf-t--global--spacer--gap--text-to-element--default);
8424
8422
  --pf-v6-c-card__header-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
8425
8423
  --pf-v6-c-card__header-toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
8426
- --pf-v6-c-card__header-toggle-icon--Transition: var(--pf-t--global--transition);
8424
+ --pf-v6-c-card__header-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
8425
+ --pf-v6-c-card__header-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
8427
8426
  --pf-v6-c-card--m-expanded__header-toggle-icon--Rotate: 90deg;
8428
8427
  --pf-v6-c-card--m-selectable--BorderWidth: var(--pf-v6-c-card--BorderWidth);
8429
8428
  --pf-v6-c-card--m-clickable--m-current--BorderColor: var(--pf-t--global--border--color--clicked);
@@ -8596,7 +8595,7 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
8596
8595
 
8597
8596
  .pf-v6-c-card__header-toggle-icon {
8598
8597
  display: inline-block;
8599
- transition: var(--pf-v6-c-card__header-toggle-icon--Transition);
8598
+ transition: transform var(--pf-v6-c-card__header-toggle-icon--TransitionDuration) var(--pf-v6-c-card__header-toggle-icon--TransitionTimingFunction);
8600
8599
  }
8601
8600
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-card__header-toggle-icon {
8602
8601
  scale: -1 1;
@@ -10706,7 +10705,8 @@ ul) {
10706
10705
  --pf-v6-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
10707
10706
  --pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: 0;
10708
10707
  --pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
10709
- --pf-v6-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-t--global--transition);
10708
+ --pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
10709
+ --pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
10710
10710
  --pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
10711
10711
  --pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
10712
10712
  }
@@ -10929,7 +10929,7 @@ ul) {
10929
10929
  min-width: var(--pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth);
10930
10930
  color: var(--pf-v6-c-dual-list-selector__item-toggle-icon--Color, inherit);
10931
10931
  text-align: center;
10932
- transition: var(--pf-v6-c-dual-list-selector__item-toggle-icon--Transition);
10932
+ transition: transform var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionDuration) var(--pf-v6-c-dual-list-selector__item-toggle-icon--TransitionTimingFunction);
10933
10933
  transform: rotate(var(--pf-v6-c-dual-list-selector__item-toggle-icon--Rotate));
10934
10934
  }
10935
10935
 
@@ -12520,7 +12520,8 @@ ul) {
12520
12520
  --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderBlockStartWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
12521
12521
  --pf-v6-c-form__field-group-toggle-button--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
12522
12522
  --pf-v6-c-form__field-group-toggle-button--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
12523
- --pf-v6-c-form__field-group-toggle-icon--Transition: var(--pf-t--global--transition);
12523
+ --pf-v6-c-form__field-group-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
12524
+ --pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
12524
12525
  --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
12525
12526
  --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
12526
12527
  --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;
@@ -12925,7 +12926,7 @@ ul) {
12925
12926
  display: inline-block;
12926
12927
  min-width: var(--pf-v6-c-form__field-group-toggle-icon--MinWidth);
12927
12928
  text-align: center;
12928
- transition: var(--pf-v6-c-form__field-group-toggle-icon--Transition);
12929
+ transition: transform var(--pf-v6-c-form__field-group-toggle-icon--TransitionDuration) var(--pf-v6-c-form__field-group-toggle-icon--TransitionTimingFunction);
12929
12930
  transform: rotate(var(--pf-v6-c-form__field-group-toggle-icon--Rotate));
12930
12931
  }
12931
12932
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-form__field-group-toggle-icon {
@@ -13861,7 +13862,8 @@ label.pf-v6-c-input-group__text {
13861
13862
  --pf-v6-c-jump-links--m-expanded__toggle--MarginBlockEnd: var(--pf-t--global--spacer--sm);
13862
13863
  --pf-v6-c-jump-links__toggle--Display: none;
13863
13864
  --pf-v6-c-jump-links__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
13864
- --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
13865
+ --pf-v6-c-jump-links__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
13866
+ --pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
13865
13867
  --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
13866
13868
  --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;
13867
13869
  }
@@ -14052,7 +14054,7 @@ label.pf-v6-c-input-group__text {
14052
14054
  .pf-v6-c-jump-links__toggle-icon {
14053
14055
  display: inline-block;
14054
14056
  color: var(--pf-v6-c-jump-links__toggle-icon--Color);
14055
- transition: var(--pf-v6-c-jump-links__toggle-icon--Transition);
14057
+ transition: transform var(--pf-v6-c-jump-links__toggle-icon--TransitionDuration) var(--pf-v6-c-jump-links__toggle-icon--TransitionTimingFunction);
14056
14058
  transform: rotate(var(--pf-v6-c-jump-links__toggle-icon--Rotate));
14057
14059
  }
14058
14060
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-jump-links__toggle-icon {
@@ -15646,13 +15648,13 @@ ul.pf-v6-c-list {
15646
15648
  --pf-v6-c-menu--m-flyout__menu--InsetInlineStart: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--left-offset));
15647
15649
  --pf-v6-c-menu--m-flyout__menu--m-top--InsetBlockEnd: calc(var(--pf-v6-c-menu__list--PaddingBlockStart) * -1);
15648
15650
  --pf-v6-c-menu--m-flyout__menu--m-left--InsetInlineEnd: calc(100% + var(--pf-v6-c-menu--m-flyout__menu--m-left--right-offset));
15649
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--transition--duration);
15650
- --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--transition--duration);
15651
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--height: var(--pf-t--global--motion--duration--slide-in--default);
15652
+ --pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
15651
15653
  --pf-v6-c-menu--m-drilldown__content--Transition: transform var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--transform), height var(--pf-v6-c-menu--m-drilldown__content--TransitionDuration--height);
15652
15654
  --pf-v6-c-menu--m-drilldown--c-menu--InsetBlockStart: 0;
15653
- --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--transition--duration);
15655
+ --pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
15654
15656
  --pf-v6-c-menu--m-drilldown--c-menu--Transition: transform var(--pf-v6-c-menu--m-drilldown--c-menu--TransitionDuration--transform);
15655
- --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--transition--duration);
15657
+ --pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform: var(--pf-t--global--motion--duration--slide-in--default);
15656
15658
  --pf-v6-c-menu--m-drilldown__list--Transition: transform var(--pf-v6-c-menu--m-drilldown__list--TransitionDuration--transform);
15657
15659
  --pf-v6-c-menu--m-drilled-in--c-menu__list-item--m-current-path--c-menu--ZIndex: var(--pf-t--global--z-index--xs);
15658
15660
  }
@@ -17597,7 +17599,8 @@ ul.pf-v6-c-list {
17597
17599
  --pf-v6-c-page__sidebar--Width: 18.125rem;
17598
17600
  --pf-v6-c-page__sidebar--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
17599
17601
  --pf-v6-c-page__sidebar--BoxShadow: none;
17600
- --pf-v6-c-page__sidebar--Transition: var(--pf-t--global--transition);
17602
+ --pf-v6-c-page__sidebar--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--default);
17603
+ --pf-v6-c-page__sidebar--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
17601
17604
  --pf-v6-c-page__sidebar--TranslateX: -100%;
17602
17605
  --pf-v6-c-page__sidebar--TranslateZ: 0;
17603
17606
  --pf-v6-c-page__sidebar--m-expanded--TranslateX: 0;
@@ -17719,7 +17722,7 @@ ul.pf-v6-c-list {
17719
17722
  overflow-y: auto;
17720
17723
  -webkit-overflow-scrolling: touch;
17721
17724
  background-color: var(--pf-v6-c-page__sidebar--BackgroundColor);
17722
- transition: var(--pf-v6-c-page__sidebar--Transition);
17725
+ transition: transform var(--pf-v6-c-page__sidebar--TransitionDuration) var(--pf-v6-c-page__sidebar--TransitionTimingFunction);
17723
17726
  transform: translateX(var(--pf-v6-c-page__sidebar--TranslateX)) translateZ(var(--pf-v6-c-page__sidebar--TranslateZ));
17724
17727
  }
17725
17728
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-page__sidebar {
@@ -22418,7 +22421,8 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
22418
22421
  --pf-v6-c-table__toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
22419
22422
  --pf-v6-c-table__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
22420
22423
  --pf-v6-c-table__toggle--c-button__toggle-icon--Rotate: 270deg;
22421
- --pf-v6-c-table__toggle--c-button__toggle-icon--Transition: .2s ease-in 0s;
22424
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
22425
+ --pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
22422
22426
  --pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate: 360deg;
22423
22427
  --pf-v6-c-table__button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
22424
22428
  --pf-v6-c-table__button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
@@ -22441,7 +22445,6 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
22441
22445
  --pf-v6-c-table__action--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
22442
22446
  --pf-v6-c-table__action--PaddingInlineStart: var(--pf-t--global--spacer--sm);
22443
22447
  --pf-v6-c-table__action--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
22444
- --pf-v6-c-table__expandable-row--Transition: var(--pf-t--global--transition);
22445
22448
  --pf-v6-c-table__expandable-row-content--PaddingBlockStart: var(--pf-t--global--spacer--md);
22446
22449
  --pf-v6-c-table__expandable-row-content--PaddingBlockEnd: var(--pf-t--global--spacer--md);
22447
22450
  --pf-v6-c-table__expandable-row-content--PaddingInlineStart: var(--pf-t--global--spacer--md);
@@ -22912,7 +22915,7 @@ label.pf-v6-c-radio, .pf-v6-c-radio__label,
22912
22915
  transform: rotate(var(--pf-v6-c-table__toggle--c-button--m-expanded__toggle-icon--Rotate));
22913
22916
  }
22914
22917
  .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
22915
- transition: var(--pf-v6-c-table__toggle--c-button__toggle-icon--Transition);
22918
+ transition: transform var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration) var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction);
22916
22919
  transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
22917
22920
  }
22918
22921
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
@@ -23064,10 +23067,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
23064
23067
  position: relative;
23065
23068
  border-block-end: 0 solid transparent;
23066
23069
  }
23067
- .pf-v6-c-table__expandable-row,
23068
- .pf-v6-c-table__expandable-row td:where(.pf-v6-c-table__td):first-child::after {
23069
- transition: var(--pf-v6-c-table__expandable-row--Transition);
23070
- }
23071
23070
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__th,
23072
23071
  :not(.pf-v6-c-table__control-row) ~ .pf-v6-c-table__expandable-row > .pf-v6-c-table__td {
23073
23072
  padding-block-start: 0;
@@ -25542,7 +25541,8 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25542
25541
  --pf-v6-c-toolbar--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md--bottom);
25543
25542
  --pf-v6-c-toolbar--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
25544
25543
  --pf-v6-c-toolbar__expand-all-icon--Rotate: 0;
25545
- --pf-v6-c-toolbar__expand-all-icon--Transition: var(--pf-t--global--transition);
25544
+ --pf-v6-c-toolbar__expand-all-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
25545
+ --pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
25546
25546
  --pf-v6-c-toolbar__item--m-expand-all--m-expanded__expand-all-icon--Rotate: 90deg;
25547
25547
  --pf-v6-c-toolbar__group--m-filter-group--ColumnGap: var(--pf-t--global--spacer--gap--control-to-control--default);
25548
25548
  --pf-v6-c-toolbar__item--m-label--FontWeight: var(--pf-t--global--font--weight--body--bold);
@@ -25874,7 +25874,7 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
25874
25874
 
25875
25875
  .pf-v6-c-toolbar__expand-all-icon {
25876
25876
  display: inline-flex;
25877
- transition: var(--pf-v6-c-toolbar__expand-all-icon--Transition);
25877
+ transition: transform var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration) var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
25878
25878
  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
25879
25879
  }
25880
25880
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-toolbar__expand-all-icon {
@@ -28111,7 +28111,8 @@ label.pf-v6-c-tree-view__node-text {
28111
28111
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
28112
28112
  --pf-v6-c-wizard__nav-link-toggle--PaddingInlineStart: var(--pf-t--global--spacer--sm);
28113
28113
  --pf-v6-c-wizard__nav-link-toggle--Color: var(--pf-t--global--icon--color--regular);
28114
- --pf-v6-c-wizard__nav-link-toggle-icon--Transition: var(--pf-t--global--transition);
28114
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration: var(--pf-t--global--motion--duration--icon--long);
28115
+ --pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
28115
28116
  --pf-v6-c-wizard__nav-link-toggle-icon--Rotate: 0;
28116
28117
  --pf-v6-c-wizard__nav-item--m-expanded__link-toggle-icon--Rotate: 90deg;
28117
28118
  --pf-v6-c-wizard__nav-link--before--Width: var(--pf-t--global--icon--size--font--xl);
@@ -28517,7 +28518,7 @@ label.pf-v6-c-tree-view__node-text {
28517
28518
 
28518
28519
  .pf-v6-c-wizard__nav-link-toggle-icon {
28519
28520
  display: inline-block;
28520
- transition: var(--pf-v6-c-wizard__nav-link-toggle-icon--Transition);
28521
+ transition: transform var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration) var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
28521
28522
  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
28522
28523
  }
28523
28524
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-wizard__nav-link-toggle-icon {