@patternfly/react-styles 6.2.1-prerelease.0 → 6.2.2

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/CHANGELOG.md CHANGED
@@ -3,6 +3,22 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [6.2.2](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.2.1...@patternfly/react-styles@6.2.2) (2025-04-23)
7
+
8
+ ### Bug Fixes
9
+
10
+ - Updated to pull in 6.2.3 of patternfly. ([660cf4a](https://github.com/patternfly/patternfly-react/commit/660cf4add72c3f9184b6882f06ea69b501d181e3))
11
+
12
+ ## [6.2.1](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.2.0...@patternfly/react-styles@6.2.1) (2025-04-17)
13
+
14
+ ### Bug Fixes
15
+
16
+ - publish patch release. ([ec18e50](https://github.com/patternfly/patternfly-react/commit/ec18e50782c4a7ee2f6a8b072be6b5808b196661))
17
+
18
+ ### Features
19
+
20
+ - **Page:** Added support for sidebar-less layout ([#11760](https://github.com/patternfly/patternfly-react/issues/11760)) ([4b0c6e4](https://github.com/patternfly/patternfly-react/commit/4b0c6e4a79aba86508891985f19f4853e3b7f87f))
21
+
6
22
  ## [6.2.1-prerelease.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.2.0...@patternfly/react-styles@6.2.1-prerelease.0) (2025-04-14)
7
23
 
8
24
  ### Features
@@ -15,7 +15,6 @@
15
15
  --pf-v6-c-card__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
16
16
  --pf-v6-c-card__title-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
17
17
  --pf-v6-c-card__title-text--LineHeight: var(--pf-t--global--font--line-height--heading);
18
- --pf-v6-c-card__title-text--OverflowWrap: break-word;
19
18
  --pf-v6-c-card--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
20
19
  --pf-v6-c-card__body--FontSize: var(--pf-t--global--font--size--body--default);
21
20
  --pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
@@ -228,13 +227,11 @@
228
227
  }
229
228
 
230
229
  .pf-v6-c-card__title-text {
231
- overflow: auto;
232
230
  font-family: var(--pf-v6-c-card__title-text--FontFamily);
233
231
  font-size: var(--pf-v6-c-card__title-text--FontSize);
234
232
  font-weight: var(--pf-v6-c-card__title-text--FontWeight);
235
233
  line-height: var(--pf-v6-c-card__title-text--LineHeight);
236
234
  color: var(--pf-v6-c-card__title-text--Color);
237
- overflow-wrap: var(--pf-v6-c-card__title-text--OverflowWrap);
238
235
  }
239
236
 
240
237
  .pf-v6-c-card__actions {
@@ -15,15 +15,9 @@
15
15
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
16
16
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
17
17
  --pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
18
- --pf-v6-c-drawer__panel--TransitionDelay: 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus), var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
19
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--fade);
20
- --pf-v6-c-drawer__panel--TransitionDelay--expand--focus: 0s;
21
18
  --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
22
- --pf-v6-c-drawer__panel--TransitionDuration--fade: var(--pf-t--global--motion--duration--fade--default);
23
- --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-v6-c-drawer__panel--TransitionDuration--fade), 0s, 0s;
24
- --pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
25
- --pf-v6-c-drawer__panel--Opacity: 0;
26
- --pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
19
+ --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--short);
20
+ --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis;
27
21
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
28
22
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
29
23
  --pf-v6-c-drawer__panel--md--FlexBasis: 50%;
@@ -113,17 +107,6 @@
113
107
  --pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
114
108
  --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
115
109
  }
116
- @media screen and (prefers-reduced-motion: no-preference) {
117
- .pf-v6-c-drawer {
118
- --pf-v6-c-drawer__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
119
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--slide);
120
- --pf-v6-c-drawer__panel--TransitionDelay: 0s, 0s, 0s, 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
121
- --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
122
- --pf-v6-c-drawer__panel--TransitionDuration: 0s, var(--pf-v6-c-drawer__panel--TransitionDuration--slide), 0s, 0s, 0s;
123
- --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis, visibility;
124
- --pf-v6-c-drawer__panel--Opacity: 1;
125
- }
126
- }
127
110
  @media screen and (min-width: 75rem) {
128
111
  .pf-v6-c-drawer {
129
112
  --pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
@@ -171,13 +154,8 @@
171
154
  .pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main {
172
155
  flex-direction: column;
173
156
  }
174
- .pf-v6-c-drawer.pf-m-expanded {
175
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
176
- }
177
157
  .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
178
158
  transform: translateX(-100%);
179
- --pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
180
- visibility: visible;
181
159
  }
182
160
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
183
161
  transform: translateX(calc(-100% * var(--pf-v6-global--inverse--multiplier)));
@@ -250,11 +228,8 @@
250
228
  order: 1;
251
229
  max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
252
230
  overflow: auto;
253
- visibility: hidden;
254
231
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
255
232
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
256
- opacity: var(--pf-v6-c-drawer__panel--Opacity);
257
- transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
258
233
  transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
259
234
  transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
260
235
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
@@ -311,6 +286,17 @@
311
286
  padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
312
287
  }
313
288
 
289
+ @keyframes pf-remove-tab-focus {
290
+ to {
291
+ visibility: hidden;
292
+ }
293
+ }
294
+ .pf-v6-c-drawer__panel[hidden] {
295
+ animation-name: pf-remove-tab-focus;
296
+ animation-delay: var(--pf-v6-c-drawer__panel--TransitionDuration);
297
+ animation-fill-mode: forwards;
298
+ }
299
+
314
300
  .pf-v6-c-drawer__head {
315
301
  display: grid;
316
302
  grid-template-columns: auto;
@@ -418,7 +404,7 @@
418
404
  .pf-v6-c-drawer {
419
405
  min-width: var(--pf-v6-c-drawer__panel--MinWidth);
420
406
  }
421
- .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
407
+ .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
422
408
  box-shadow: var(--pf-v6-c-drawer--m-expanded__panel--BoxShadow);
423
409
  }
424
410
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
@@ -146,11 +146,12 @@
146
146
  padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
147
147
  padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
148
148
  color: var(--pf-v6-c-form-control--Color);
149
- appearance: none;
150
149
  background-color: transparent;
151
150
  border: none;
152
151
  border-radius: var(--pf-v6-c-form-control--BorderRadius);
153
152
  outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
153
+ -moz-appearance: none;
154
+ -webkit-appearance: none;
154
155
  }
155
156
  .pf-v6-c-form-control > ::placeholder {
156
157
  color: var(--pf-v6-c-form-control--m-placeholder--Color);
@@ -1,13 +1,3 @@
1
- @property --pf-v6-c-tabs--link-accent--length {
2
- syntax: "<length>";
3
- inherits: true;
4
- initial-value: 0px;
5
- }
6
- @property --pf-v6-c-tabs--link-accent--start {
7
- syntax: "<length>";
8
- inherits: true;
9
- initial-value: 0px;
10
- }
11
1
  .pf-v6-c-tabs {
12
2
  --pf-v6-c-tabs--inset: 0;
13
3
  --pf-v6-c-tabs--Width: auto;
@@ -69,8 +59,6 @@
69
59
  --pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
70
60
  --pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
71
61
  --pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
72
- --pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
73
- --pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
74
62
  --pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
75
63
  --pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
76
64
  --pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
@@ -95,26 +83,6 @@
95
83
  --pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
96
84
  --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
97
85
  --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
98
- --pf-v6-c-tabs--link-accent--start: 0;
99
- --pf-v6-c-tabs--link-accent--length: auto;
100
- --pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
101
- --pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
102
- --pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
103
- --pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
104
- --pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
105
- --pf-v6-c-tabs--link-accent--Width: initial;
106
- --pf-v6-c-tabs--link-accent--Height: 0;
107
- --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
108
- --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
109
- --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
110
- --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
111
- --pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
112
- --pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
113
- --pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
114
- --pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
115
- --pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
116
- --pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
117
- --pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
118
86
  --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
119
87
  --pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
120
88
  --pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -272,13 +240,6 @@
272
240
  --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
273
241
  --pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
274
242
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
275
- --pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
276
- --pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
277
- --pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
278
- --pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
279
- --pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
280
- --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
281
- --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
282
243
  display: inline-flex;
283
244
  flex-direction: column;
284
245
  height: 100%;
@@ -541,7 +502,6 @@
541
502
  text-decoration-line: none;
542
503
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
543
504
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
544
- transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
545
505
  }
546
506
  .pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
547
507
  --pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
@@ -852,29 +812,4 @@
852
812
  --pf-v6-c-tabs--m-vertical--inset: var(--pf-t--global--spacer--2xl);
853
813
  --pf-v6-c-tabs--m-vertical--m-box--inset: var(--pf-t--global--spacer--2xl);
854
814
  }
855
- }
856
-
857
- @media (prefers-reduced-motion: no-preference) {
858
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
859
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
860
- content: revert;
861
- }
862
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
863
- position: absolute;
864
- inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
865
- inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
866
- inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
867
- width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
868
- height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
869
- content: "";
870
- border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
871
- border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
872
- border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
873
- transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
874
- transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
875
- transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
876
- }
877
- .pf-v6-c-tabs.pf-m-initializing-accent {
878
- --pf-v6-c-tabs--link-accent--TransitionDuration: 0;
879
- }
880
815
  }
@@ -64,8 +64,7 @@ declare const _default: {
64
64
  "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
65
65
  "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
66
66
  "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
67
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl",
68
- "initializingAccent": "pf-m-initializing-accent"
67
+ "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
69
68
  },
70
69
  "tabs": "pf-v6-c-tabs",
71
70
  "tabsAdd": "pf-v6-c-tabs__add",
@@ -66,8 +66,7 @@ exports.default = {
66
66
  "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
67
67
  "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
68
68
  "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
69
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl",
70
- "initializingAccent": "pf-m-initializing-accent"
69
+ "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
71
70
  },
72
71
  "tabs": "pf-v6-c-tabs",
73
72
  "tabsAdd": "pf-v6-c-tabs__add",
@@ -64,8 +64,7 @@ export default {
64
64
  "insetMdOn_2xl": "pf-m-inset-md-on-2xl",
65
65
  "insetLgOn_2xl": "pf-m-inset-lg-on-2xl",
66
66
  "insetXlOn_2xl": "pf-m-inset-xl-on-2xl",
67
- "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl",
68
- "initializingAccent": "pf-m-initializing-accent"
67
+ "inset_2xlOn_2xl": "pf-m-inset-2xl-on-2xl"
69
68
  },
70
69
  "tabs": "pf-v6-c-tabs",
71
70
  "tabsAdd": "pf-v6-c-tabs__add",
@@ -9,11 +9,6 @@
9
9
  align-items: baseline;
10
10
  min-width: var(--pf-v6-c-truncate--MinWidth);
11
11
  }
12
- .pf-v6-c-truncate.pf-m-fixed {
13
- display: inline;
14
- align-items: revert;
15
- min-width: revert;
16
- }
17
12
 
18
13
  .pf-v6-c-truncate__start,
19
14
  .pf-v6-c-truncate__end {
@@ -1,9 +1,6 @@
1
1
  import './truncate.css';
2
2
  declare const _default: {
3
3
  "dirRtl": "pf-v6-m-dir-rtl",
4
- "modifiers": {
5
- "fixed": "pf-m-fixed"
6
- },
7
4
  "truncate": "pf-v6-c-truncate",
8
5
  "truncateEnd": "pf-v6-c-truncate__end",
9
6
  "truncateStart": "pf-v6-c-truncate__start"
@@ -3,9 +3,6 @@ exports.__esModule = true;
3
3
  require('./truncate.css');
4
4
  exports.default = {
5
5
  "dirRtl": "pf-v6-m-dir-rtl",
6
- "modifiers": {
7
- "fixed": "pf-m-fixed"
8
- },
9
6
  "truncate": "pf-v6-c-truncate",
10
7
  "truncateEnd": "pf-v6-c-truncate__end",
11
8
  "truncateStart": "pf-v6-c-truncate__start"
@@ -1,9 +1,6 @@
1
1
  import './truncate.css';
2
2
  export default {
3
3
  "dirRtl": "pf-v6-m-dir-rtl",
4
- "modifiers": {
5
- "fixed": "pf-m-fixed"
6
- },
7
4
  "truncate": "pf-v6-c-truncate",
8
5
  "truncateEnd": "pf-v6-c-truncate__end",
9
6
  "truncateStart": "pf-v6-c-truncate__start"
@@ -2329,7 +2329,6 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2329
2329
  --pf-v6-c-card__title-text--FontSize: var(--pf-t--global--font--size--heading--xs);
2330
2330
  --pf-v6-c-card__title-text--FontWeight: var(--pf-t--global--font--weight--heading--default);
2331
2331
  --pf-v6-c-card__title-text--LineHeight: var(--pf-t--global--font--line-height--heading);
2332
- --pf-v6-c-card__title-text--OverflowWrap: break-word;
2333
2332
  --pf-v6-c-card--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
2334
2333
  --pf-v6-c-card__body--FontSize: var(--pf-t--global--font--size--body--default);
2335
2334
  --pf-v6-c-card__footer--FontSize: var(--pf-t--global--font--size--body--default);
@@ -2542,13 +2541,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2542
2541
  }
2543
2542
 
2544
2543
  .pf-v6-c-card__title-text {
2545
- overflow: auto;
2546
2544
  font-family: var(--pf-v6-c-card__title-text--FontFamily);
2547
2545
  font-size: var(--pf-v6-c-card__title-text--FontSize);
2548
2546
  font-weight: var(--pf-v6-c-card__title-text--FontWeight);
2549
2547
  line-height: var(--pf-v6-c-card__title-text--LineHeight);
2550
2548
  color: var(--pf-v6-c-card__title-text--Color);
2551
- overflow-wrap: var(--pf-v6-c-card__title-text--OverflowWrap);
2552
2549
  }
2553
2550
 
2554
2551
  .pf-v6-c-card__actions {
@@ -5310,15 +5307,9 @@ ul) {
5310
5307
  --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
5311
5308
  --pf-v6-c-drawer__panel--PaddingBlockStart: var(--pf-t--global--spacer--sm);
5312
5309
  --pf-v6-c-drawer__panel--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
5313
- --pf-v6-c-drawer__panel--TransitionDelay: 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus), var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
5314
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--fade);
5315
- --pf-v6-c-drawer__panel--TransitionDelay--expand--focus: 0s;
5316
5310
  --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
5317
- --pf-v6-c-drawer__panel--TransitionDuration--fade: var(--pf-t--global--motion--duration--fade--default);
5318
- --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-v6-c-drawer__panel--TransitionDuration--fade), 0s, 0s;
5319
- --pf-v6-c-drawer__panel--TransitionProperty: opacity, visibility, transform;
5320
- --pf-v6-c-drawer__panel--Opacity: 0;
5321
- --pf-v6-c-drawer--m-expanded__panel--Opacity: 1;
5311
+ --pf-v6-c-drawer__panel--TransitionDuration: var(--pf-t--global--motion--duration--slide-in--short);
5312
+ --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis;
5322
5313
  --pf-v6-c-drawer__panel--FlexBasis: 100%;
5323
5314
  --pf-v6-c-drawer__panel--md--FlexBasis--min: 1.5rem;
5324
5315
  --pf-v6-c-drawer__panel--md--FlexBasis: 50%;
@@ -5408,17 +5399,6 @@ ul) {
5408
5399
  --pf-v6-c-drawer--m-panel-left--m-inline__panel--PaddingInlineEnd: var(--pf-v6-c-drawer__panel--after--Width);
5409
5400
  --pf-v6-c-drawer--m-panel-bottom--m-inline__panel--PaddingBlockStart: var(--pf-v6-c-drawer__panel--after--Width);
5410
5401
  }
5411
- @media screen and (prefers-reduced-motion: no-preference) {
5412
- .pf-v6-c-drawer {
5413
- --pf-v6-c-drawer__panel--TransitionDuration--slide: var(--pf-t--global--motion--duration--slide-in--short);
5414
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDuration--slide);
5415
- --pf-v6-c-drawer__panel--TransitionDelay: 0s, 0s, 0s, 0s, var(--pf-v6-c-drawer__panel--TransitionDelay--focus);
5416
- --pf-v6-c-drawer__panel--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
5417
- --pf-v6-c-drawer__panel--TransitionDuration: 0s, var(--pf-v6-c-drawer__panel--TransitionDuration--slide), 0s, 0s, 0s;
5418
- --pf-v6-c-drawer__panel--TransitionProperty: margin, transform, box-shadow, flex-basis, visibility;
5419
- --pf-v6-c-drawer__panel--Opacity: 1;
5420
- }
5421
- }
5422
5402
  @media screen and (min-width: 75rem) {
5423
5403
  .pf-v6-c-drawer {
5424
5404
  --pf-v6-c-drawer__panel--MinWidth: var(--pf-v6-c-drawer__panel--xl--MinWidth);
@@ -5466,13 +5446,8 @@ ul) {
5466
5446
  .pf-v6-c-drawer.pf-m-panel-bottom > .pf-v6-c-drawer__main {
5467
5447
  flex-direction: column;
5468
5448
  }
5469
- .pf-v6-c-drawer.pf-m-expanded {
5470
- --pf-v6-c-drawer__panel--TransitionDelay--focus: var(--pf-v6-c-drawer__panel--TransitionDelay--expand--focus);
5471
- }
5472
5449
  .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5473
5450
  transform: translateX(-100%);
5474
- --pf-v6-c-drawer__panel--Opacity: var(--pf-v6-c-drawer--m-expanded__panel--Opacity);
5475
- visibility: visible;
5476
5451
  }
5477
5452
  :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5478
5453
  transform: translateX(calc(-100% * var(--pf-v6-global--inverse--multiplier)));
@@ -5545,11 +5520,8 @@ ul) {
5545
5520
  order: 1;
5546
5521
  max-height: var(--pf-v6-c-drawer__panel--MaxHeight);
5547
5522
  overflow: auto;
5548
- visibility: hidden;
5549
5523
  background-color: var(--pf-v6-c-drawer__panel--BackgroundColor);
5550
5524
  box-shadow: var(--pf-v6-c-drawer__panel--BoxShadow);
5551
- opacity: var(--pf-v6-c-drawer__panel--Opacity);
5552
- transition-delay: var(--pf-v6-c-drawer__panel--TransitionDelay);
5553
5525
  transition-timing-function: var(--pf-v6-c-drawer__panel--TransitionTimingFunction);
5554
5526
  transition-duration: var(--pf-v6-c-drawer__panel--TransitionDuration);
5555
5527
  transition-property: var(--pf-v6-c-drawer__panel--TransitionProperty);
@@ -5606,6 +5578,17 @@ ul) {
5606
5578
  padding-block-end: var(--pf-v6-c-drawer__panel--PaddingBlockEnd);
5607
5579
  }
5608
5580
 
5581
+ @keyframes pf-remove-tab-focus {
5582
+ to {
5583
+ visibility: hidden;
5584
+ }
5585
+ }
5586
+ .pf-v6-c-drawer__panel[hidden] {
5587
+ animation-name: pf-remove-tab-focus;
5588
+ animation-delay: var(--pf-v6-c-drawer__panel--TransitionDuration);
5589
+ animation-fill-mode: forwards;
5590
+ }
5591
+
5609
5592
  .pf-v6-c-drawer__head {
5610
5593
  display: grid;
5611
5594
  grid-template-columns: auto;
@@ -5713,7 +5696,7 @@ ul) {
5713
5696
  .pf-v6-c-drawer {
5714
5697
  min-width: var(--pf-v6-c-drawer__panel--MinWidth);
5715
5698
  }
5716
- .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5699
+ .pf-v6-c-drawer.pf-m-expanded > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel {
5717
5700
  box-shadow: var(--pf-v6-c-drawer--m-expanded__panel--BoxShadow);
5718
5701
  }
5719
5702
  .pf-v6-c-drawer > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel.pf-m-resizable {
@@ -7087,11 +7070,12 @@ ul) {
7087
7070
  padding-inline-start: var(--pf-v6-c-form-control--PaddingInlineStart);
7088
7071
  padding-inline-end: var(--pf-v6-c-form-control--PaddingInlineEnd);
7089
7072
  color: var(--pf-v6-c-form-control--Color);
7090
- appearance: none;
7091
7073
  background-color: transparent;
7092
7074
  border: none;
7093
7075
  border-radius: var(--pf-v6-c-form-control--BorderRadius);
7094
7076
  outline-offset: var(--pf-v6-c-form-control--OutlineOffset);
7077
+ -moz-appearance: none;
7078
+ -webkit-appearance: none;
7095
7079
  }
7096
7080
  .pf-v6-c-form-control > ::placeholder {
7097
7081
  color: var(--pf-v6-c-form-control--m-placeholder--Color);
@@ -18335,16 +18319,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18335
18319
  }
18336
18320
  }
18337
18321
 
18338
- @property --pf-v6-c-tabs--link-accent--length {
18339
- syntax: "<length>";
18340
- inherits: true;
18341
- initial-value: 0px;
18342
- }
18343
- @property --pf-v6-c-tabs--link-accent--start {
18344
- syntax: "<length>";
18345
- inherits: true;
18346
- initial-value: 0px;
18347
- }
18348
18322
  .pf-v6-c-tabs {
18349
18323
  --pf-v6-c-tabs--inset: 0;
18350
18324
  --pf-v6-c-tabs--Width: auto;
@@ -18406,8 +18380,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18406
18380
  --pf-v6-c-tabs--m-box--m-secondary__link--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);
18407
18381
  --pf-v6-c-tabs--m-box--m-secondary__item--m-current__link--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
18408
18382
  --pf-v6-c-tabs--m-subtab__link--FontSize: var(--pf-t--global--font--size--xs);
18409
- --pf-v6-c-tabs__link--TransitionDuration--background-color: var(--pf-t--global--motion--duration--fade--short);
18410
- --pf-v6-c-tabs__link--TransitionTimingFunction--background-color: var(--pf-t--global--motion--timing-function--default);
18411
18383
  --pf-v6-c-tabs__link--before--border-color--base: var(--pf-t--global--border--color--default);
18412
18384
  --pf-v6-c-tabs__link--before--border-width--base: var(--pf-t--global--border--width--regular);
18413
18385
  --pf-v6-c-tabs__link--before--BorderBlockStartColor: var(--pf-v6-c-tabs__link--before--border-color--base);
@@ -18432,26 +18404,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18432
18404
  --pf-v6-c-tabs__link--after--BorderInlineStartWidth: 0;
18433
18405
  --pf-v6-c-tabs__item--m-current__link--after--BorderColor: var(--pf-t--global--border--color--clicked);
18434
18406
  --pf-v6-c-tabs__item--m-current__link--after--BorderWidth: var(--pf-t--global--border--width--extra-strong);
18435
- --pf-v6-c-tabs--link-accent--start: 0;
18436
- --pf-v6-c-tabs--link-accent--length: auto;
18437
- --pf-v6-c-tabs--link-accent--color: var(--pf-v6-c-tabs__item--m-current__link--after--BorderColor);
18438
- --pf-v6-c-tabs--link-accent--border-size: var(--pf-v6-c-tabs__item--m-current__link--after--BorderWidth);
18439
- --pf-v6-c-tabs--link-accent--InsetBlockStart: auto;
18440
- --pf-v6-c-tabs--link-accent--InsetBlockEnd: 0;
18441
- --pf-v6-c-tabs--link-accent--InsetInlineStart: initial;
18442
- --pf-v6-c-tabs--link-accent--Width: initial;
18443
- --pf-v6-c-tabs--link-accent--Height: 0;
18444
- --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--link-accent--border-size);
18445
- --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: 0;
18446
- --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart: initial;
18447
- --pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd: auto;
18448
- --pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart: 0;
18449
- --pf-v6-c-tabs--m-vertical--link-accent--Width: 0;
18450
- --pf-v6-c-tabs--m-vertical--link-accent--Height: initial;
18451
- --pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth: 0;
18452
- --pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--link-accent--border-size);
18453
- --pf-v6-c-tabs--link-accent--TransitionDuration: var(--pf-t--global--motion--duration--md);
18454
- --pf-v6-c-tabs--link-accent--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--decelerate);
18455
18407
  --pf-v6-c-tabs__scroll-button--PaddingBlockStart: var(--pf-t--global--spacer--sm);
18456
18408
  --pf-v6-c-tabs__scroll-button--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
18457
18409
  --pf-v6-c-tabs__scroll-button--PaddingInlineStart: var(--pf-t--global--spacer--sm);
@@ -18609,13 +18561,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18609
18561
  --pf-v6-c-tabs__link--after--InsetBlockEnd: 0;
18610
18562
  --pf-v6-c-tabs__link--after--InsetInlineEnd: auto;
18611
18563
  --pf-v6-c-tabs__list--ScrollSnapTypeAxis: var(--pf-v6-c-tabs--m-vertical__list--ScrollSnapTypeAxis);
18612
- --pf-v6-c-tabs--link-accent--InsetBlockStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockStart);
18613
- --pf-v6-c-tabs--link-accent--InsetBlockEnd: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetBlockEnd);
18614
- --pf-v6-c-tabs--link-accent--InsetInlineStart: var(--pf-v6-c-tabs--m-vertical--link-accent--InsetInlineStart);
18615
- --pf-v6-c-tabs--link-accent--Width: var(--pf-v6-c-tabs--m-vertical--link-accent--Width);
18616
- --pf-v6-c-tabs--link-accent--Height: var(--pf-v6-c-tabs--m-vertical--link-accent--Height);
18617
- --pf-v6-c-tabs--link-accent--BorderBlockEndWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderBlockEndWidth);
18618
- --pf-v6-c-tabs--link-accent--BorderInlineStartWidth: var(--pf-v6-c-tabs--m-vertical--link-accent--BorderInlineStartWidth);
18619
18564
  display: inline-flex;
18620
18565
  flex-direction: column;
18621
18566
  height: 100%;
@@ -18878,7 +18823,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
18878
18823
  text-decoration-line: none;
18879
18824
  background-color: var(--pf-v6-c-tabs__link--BackgroundColor);
18880
18825
  border-radius: var(--pf-v6-c-tabs__link--BorderRadius);
18881
- transition: background-color var(--pf-v6-c-tabs__link--TransitionDuration--background-color) var(--pf-v6-c-tabs__link--TransitionTimingFunction--background-color);
18882
18826
  }
18883
18827
  .pf-v6-c-tabs__item.pf-m-action, .pf-v6-c-tabs__link {
18884
18828
  --pf-v6-c-tabs__link--after--BorderBlockEndWidth: var(--pf-v6-c-tabs__link--after--BorderWidth);
@@ -19191,30 +19135,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
19191
19135
  }
19192
19136
  }
19193
19137
 
19194
- @media (prefers-reduced-motion: no-preference) {
19195
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__link::after,
19196
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__item.pf-m-action::after {
19197
- content: revert;
19198
- }
19199
- .pf-v6-c-tabs:not(.pf-m-box) .pf-v6-c-tabs__list::after {
19200
- position: absolute;
19201
- inset-block-start: var(--pf-v6-c-tabs--link-accent--InsetBlockStart, var(--pf-v6-c-tabs--link-accent--start));
19202
- inset-block-end: var(--pf-v6-c-tabs--link-accent--InsetBlockEnd);
19203
- inset-inline-start: var(--pf-v6-c-tabs--link-accent--InsetInlineStart, var(--pf-v6-c-tabs--link-accent--start));
19204
- width: var(--pf-v6-c-tabs--link-accent--Width, var(--pf-v6-c-tabs--link-accent--length));
19205
- height: var(--pf-v6-c-tabs--link-accent--Height, var(--pf-v6-c-tabs--link-accent--length));
19206
- content: "";
19207
- border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
19208
- border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
19209
- border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
19210
- transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
19211
- transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
19212
- transition-property: --pf-v6-c-tabs--link-accent--length, --pf-v6-c-tabs--link-accent--start, width;
19213
- }
19214
- .pf-v6-c-tabs.pf-m-initializing-accent {
19215
- --pf-v6-c-tabs--link-accent--TransitionDuration: 0;
19216
- }
19217
- }
19218
19138
  .pf-v6-c-text-input-group {
19219
19139
  --pf-v6-c-text-input-group--BackgroundColor: var(--pf-t--global--background--color--control--default);
19220
19140
  --pf-v6-c-text-input-group--BorderColor: var(--pf-t--global--border--color--default);
@@ -21826,11 +21746,6 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
21826
21746
  align-items: baseline;
21827
21747
  min-width: var(--pf-v6-c-truncate--MinWidth);
21828
21748
  }
21829
- .pf-v6-c-truncate.pf-m-fixed {
21830
- display: inline;
21831
- align-items: revert;
21832
- min-width: revert;
21833
- }
21834
21749
 
21835
21750
  .pf-v6-c-truncate__start,
21836
21751
  .pf-v6-c-truncate__end {
@@ -809,7 +809,6 @@ declare const _default: {
809
809
  "treeViewGrid_2xl": "pf-m-tree-view-grid-2xl",
810
810
  "noBorderBottom": "pf-m-no-border-bottom",
811
811
  "subtab": "pf-m-subtab",
812
- "initializingAccent": "pf-m-initializing-accent",
813
812
  "hint": "pf-m-hint",
814
813
  "stacked": "pf-m-stacked",
815
814
  "4xl": "pf-m-4xl",
@@ -811,7 +811,6 @@ exports.default = {
811
811
  "treeViewGrid_2xl": "pf-m-tree-view-grid-2xl",
812
812
  "noBorderBottom": "pf-m-no-border-bottom",
813
813
  "subtab": "pf-m-subtab",
814
- "initializingAccent": "pf-m-initializing-accent",
815
814
  "hint": "pf-m-hint",
816
815
  "stacked": "pf-m-stacked",
817
816
  "4xl": "pf-m-4xl",
@@ -809,7 +809,6 @@ export default {
809
809
  "treeViewGrid_2xl": "pf-m-tree-view-grid-2xl",
810
810
  "noBorderBottom": "pf-m-no-border-bottom",
811
811
  "subtab": "pf-m-subtab",
812
- "initializingAccent": "pf-m-initializing-accent",
813
812
  "hint": "pf-m-hint",
814
813
  "stacked": "pf-m-stacked",
815
814
  "4xl": "pf-m-4xl",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-styles",
3
- "version": "6.2.1-prerelease.0",
3
+ "version": "6.2.2",
4
4
  "main": "dist/js/index.js",
5
5
  "module": "dist/esm/index.js",
6
6
  "types": "dist/esm/index.d.ts",
@@ -19,10 +19,10 @@
19
19
  "clean": "rimraf dist css"
20
20
  },
21
21
  "devDependencies": {
22
- "@patternfly/patternfly": "6.3.0-prerelease.6",
22
+ "@patternfly/patternfly": "6.2.3",
23
23
  "change-case": "^5.4.4",
24
24
  "fs-extra": "^11.3.0"
25
25
  },
26
26
  "license": "MIT",
27
- "gitHead": "51f35a918102ae3dcaec8ee577cf6f2f578aea16"
27
+ "gitHead": "f354347710422b87a910bbf8e1cc728cc31a2f11"
28
28
  }