@patternfly/react-styles 6.6.1-prerelease.4 → 6.7.0-prerelease.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 (34) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/css/components/Button/button.css +2 -2
  3. package/css/components/Button/button.d.ts +1 -2
  4. package/css/components/Button/button.js +1 -2
  5. package/css/components/Button/button.mjs +1 -2
  6. package/css/components/Compass/compass.css +13 -15
  7. package/css/components/Compass/compass.d.ts +1 -2
  8. package/css/components/Compass/compass.js +1 -2
  9. package/css/components/Compass/compass.mjs +1 -2
  10. package/css/components/Masthead/masthead.css +3 -3
  11. package/css/components/Masthead/masthead.d.ts +1 -2
  12. package/css/components/Masthead/masthead.js +1 -2
  13. package/css/components/Masthead/masthead.mjs +1 -2
  14. package/css/components/MenuToggle/menu-toggle.css +3 -4
  15. package/css/components/MenuToggle/menu-toggle.d.ts +0 -2
  16. package/css/components/MenuToggle/menu-toggle.js +0 -2
  17. package/css/components/MenuToggle/menu-toggle.mjs +0 -2
  18. package/css/components/Nav/nav.css +5 -5
  19. package/css/components/Nav/nav.d.ts +2 -3
  20. package/css/components/Nav/nav.js +2 -3
  21. package/css/components/Nav/nav.mjs +2 -3
  22. package/css/components/Page/page.css +13 -15
  23. package/css/components/Page/page.d.ts +1 -2
  24. package/css/components/Page/page.js +1 -2
  25. package/css/components/Page/page.mjs +1 -2
  26. package/css/components/_index.css +39 -44
  27. package/css/components/_index.d.ts +1 -2
  28. package/css/components/_index.js +1 -2
  29. package/css/components/_index.mjs +1 -2
  30. package/css/docs/components/Nav/examples/Navigation.css +8 -0
  31. package/css/docs/components/Nav/examples/Navigation.d.ts +4 -1
  32. package/css/docs/components/Nav/examples/Navigation.js +4 -1
  33. package/css/docs/components/Nav/examples/Navigation.mjs +4 -1
  34. package/package.json +3 -3
package/CHANGELOG.md CHANGED
@@ -3,6 +3,20 @@
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.7.0-prerelease.1](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.7.0-prerelease.0...@patternfly/react-styles@6.7.0-prerelease.1) (2026-09-30)
7
+
8
+ ### Features
9
+
10
+ - **Page,Compass,Nav,MenuToggle,Button:** simplify docked nav expand props ([#12661](https://github.com/patternfly/patternfly-react/issues/12661)) ([dab7e8a](https://github.com/patternfly/patternfly-react/commit/dab7e8a28ef70eee1764d682d19fa40c622fb4dd))
11
+
12
+ ### Reverts
13
+
14
+ - Revert "chore(release): releasing packages [ci skip]" (#12663) ([de8fb05](https://github.com/patternfly/patternfly-react/commit/de8fb05e58ffdf9adf30f8225a03783c70978df6)), closes [#12663](https://github.com/patternfly/patternfly-react/issues/12663)
15
+
16
+ # [6.7.0-prerelease.0](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.6.1-prerelease.4...@patternfly/react-styles@6.7.0-prerelease.0) (2026-09-28)
17
+
18
+ **Note:** Version bump only for package @patternfly/react-styles
19
+
6
20
  ## [6.6.1-prerelease.4](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@6.6.1-prerelease.3...@patternfly/react-styles@6.6.1-prerelease.4) (2026-09-24)
7
21
 
8
22
  ### Bug Fixes
package/css/components/Button/button.css CHANGED
@@ -897,11 +897,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
897
897
  display: none;
898
898
  }
899
899
  }
900
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button.pf-m-docked, .pf-v6-c-button:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
900
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-button.pf-m-docked {
901
901
  justify-content: flex-start;
902
902
  width: 100%;
903
903
  }
904
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button.pf-m-docked .pf-v6-c-button__text, .pf-v6-c-button:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button__text {
904
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-button.pf-m-docked .pf-v6-c-button__text {
905
905
  display: revert;
906
906
  }
907
907
 
package/css/components/Button/button.d.ts CHANGED
@@ -47,8 +47,7 @@ declare const _default: {
47
47
  "inProgress": "pf-m-in-progress",
48
48
  "notify": "pf-m-notify",
49
49
  "docked": "pf-m-docked",
50
- "textExpanded": "pf-m-text-expanded",
51
- "expandableExpanded": "pf-m-expandable-expanded",
50
+ "expanded": "pf-m-expanded",
52
51
  "start": "pf-m-start",
53
52
  "end": "pf-m-end"
54
53
  },
package/css/components/Button/button.js CHANGED
@@ -49,8 +49,7 @@ exports.default = {
49
49
  "inProgress": "pf-m-in-progress",
50
50
  "notify": "pf-m-notify",
51
51
  "docked": "pf-m-docked",
52
- "textExpanded": "pf-m-text-expanded",
53
- "expandableExpanded": "pf-m-expandable-expanded",
52
+ "expanded": "pf-m-expanded",
54
53
  "start": "pf-m-start",
55
54
  "end": "pf-m-end"
56
55
  },
package/css/components/Button/button.mjs CHANGED
@@ -47,8 +47,7 @@ export default {
47
47
  "inProgress": "pf-m-in-progress",
48
48
  "notify": "pf-m-notify",
49
49
  "docked": "pf-m-docked",
50
- "textExpanded": "pf-m-text-expanded",
51
- "expandableExpanded": "pf-m-expandable-expanded",
50
+ "expanded": "pf-m-expanded",
52
51
  "start": "pf-m-start",
53
52
  "end": "pf-m-end"
54
53
  },
package/css/components/Compass/compass.css CHANGED
@@ -138,7 +138,7 @@
138
138
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
139
139
  }
140
140
 
141
- .pf-v6-c-compass .pf-v6-c-compass__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
141
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
142
142
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
143
143
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
144
144
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -148,15 +148,15 @@
148
148
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-collapse--ScaleX);
149
149
  }
150
150
  @media (min-width: 62rem) {
151
- .pf-v6-c-compass .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
152
- .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
151
+ .pf-v6-c-compass .pf-v6-c-compass__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
152
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
153
153
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
154
154
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
155
155
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
156
156
  --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
157
157
  --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
158
158
  }
159
- .pf-v6-c-compass .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
159
+ .pf-v6-c-compass .pf-v6-c-compass__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
160
160
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
161
161
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
162
162
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -165,7 +165,7 @@
165
165
  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
166
166
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
167
167
  }
168
- .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-text-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
168
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
169
169
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
170
170
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
171
171
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -319,14 +319,8 @@
319
319
  translate: -100% 0;
320
320
  transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-compass__dock--TransitionDuration--slide);
321
321
  }
322
- .pf-v6-c-compass__dock.pf-m-expanded, .pf-v6-c-compass__dock.pf-m-expandable-expanded {
323
- --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
324
- visibility: visible;
325
- translate: 0;
326
- transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
327
- }
328
322
  @media (min-width: 62rem) {
329
- .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) {
323
+ .pf-v6-c-compass__dock:not(.pf-m-overlay) {
330
324
  --pf-v6-c-compass__dock-main--BackgroundColor: var(--pf-v6-c-compass__dock-main--desktop--BackgroundColor);
331
325
  --pf-v6-c-compass__dock-main--BorderInlineEndColor: var(--pf-v6-c-compass__dock-main--desktop--BorderInlineEndColor);
332
326
  position: revert;
@@ -339,8 +333,12 @@
339
333
  .pf-v6-c-compass__dock .pf-v6-c-toolbar.pf-m-vertical :is(.pf-v6-c-toolbar__content-section, .pf-v6-c-toolbar__group, .pf-v6-c-toolbar__item) {
340
334
  align-items: stretch;
341
335
  }
342
- .pf-v6-c-compass__dock.pf-m-text-expanded {
336
+ .pf-v6-c-compass__dock.pf-m-expanded {
337
+ --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
338
+ visibility: visible;
343
339
  width: var(--pf-v6-c-compass__dock--Width);
340
+ translate: 0;
341
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
344
342
  }
345
343
 
346
344
  .pf-v6-c-compass__dock-main {
@@ -350,12 +348,12 @@
350
348
  box-shadow: var(--pf-v6-c-compass__dock-main--BoxShadow);
351
349
  backdrop-filter: var(--pf-v6-c-compass__dock-main--BackdropFilter);
352
350
  }
353
- .pf-v6-c-compass__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-compass__dock-main {
351
+ .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-compass__dock-main {
354
352
  border-inline-end: var(--pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndWidth) solid var(--pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndColor);
355
353
  box-shadow: var(--pf-v6-c-compass__dock--m-expanded__dock-main--BoxShadow);
356
354
  }
357
355
  @media (min-width: 62rem) {
358
- .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-compass__dock-main {
356
+ .pf-v6-c-compass__dock:not(.pf-m-overlay) .pf-v6-c-compass__dock-main {
359
357
  --pf-v6-c-compass__dock-main--BoxShadow: var(--pf-v6-c-compass__dock-main--desktop--BoxShadow);
360
358
  --pf-v6-c-compass__dock--m-expanded__dock-main--BoxShadow: var(--pf-v6-c-compass__dock-main--desktop--BoxShadow);
361
359
  --pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndWidth: var(--pf-v6-c-compass__dock-main--BorderInlineEndWidth);
package/css/components/Compass/compass.d.ts CHANGED
@@ -27,11 +27,10 @@ declare const _default: {
27
27
  "docked": "pf-m-docked",
28
28
  "hamburger": "pf-m-hamburger",
29
29
  "expanded": "pf-m-expanded",
30
- "expandableExpanded": "pf-m-expandable-expanded",
31
- "textExpanded": "pf-m-text-expanded",
32
30
  "start": "pf-m-start",
33
31
  "end": "pf-m-end",
34
32
  "plain": "pf-m-plain",
33
+ "overlay": "pf-m-overlay",
35
34
  "vertical": "pf-m-vertical"
36
35
  },
37
36
  "panel": "pf-v6-c-panel",
package/css/components/Compass/compass.js CHANGED
@@ -29,11 +29,10 @@ exports.default = {
29
29
  "docked": "pf-m-docked",
30
30
  "hamburger": "pf-m-hamburger",
31
31
  "expanded": "pf-m-expanded",
32
- "expandableExpanded": "pf-m-expandable-expanded",
33
- "textExpanded": "pf-m-text-expanded",
34
32
  "start": "pf-m-start",
35
33
  "end": "pf-m-end",
36
34
  "plain": "pf-m-plain",
35
+ "overlay": "pf-m-overlay",
37
36
  "vertical": "pf-m-vertical"
38
37
  },
39
38
  "panel": "pf-v6-c-panel",
package/css/components/Compass/compass.mjs CHANGED
@@ -27,11 +27,10 @@ export default {
27
27
  "docked": "pf-m-docked",
28
28
  "hamburger": "pf-m-hamburger",
29
29
  "expanded": "pf-m-expanded",
30
- "expandableExpanded": "pf-m-expandable-expanded",
31
- "textExpanded": "pf-m-text-expanded",
32
30
  "start": "pf-m-start",
33
31
  "end": "pf-m-end",
34
32
  "plain": "pf-m-plain",
33
+ "overlay": "pf-m-overlay",
35
34
  "vertical": "pf-m-vertical"
36
35
  },
37
36
  "panel": "pf-v6-c-panel",
package/css/components/Masthead/masthead.css CHANGED
@@ -167,13 +167,13 @@
167
167
  display: revert;
168
168
  }
169
169
  }
170
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo {
170
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo {
171
171
  display: revert;
172
172
  }
173
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo.pf-m-compact {
173
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo.pf-m-compact {
174
174
  display: none;
175
175
  }
176
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__main {
176
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__main {
177
177
  align-items: flex-start;
178
178
  }
179
179
 
package/css/components/Masthead/masthead.d.ts CHANGED
@@ -12,8 +12,7 @@ declare const _default: {
12
12
  "resizeObserver": "pf-m-resize-observer",
13
13
  "docked": "pf-m-docked",
14
14
  "compact": "pf-m-compact",
15
- "textExpanded": "pf-m-text-expanded",
16
- "expandableExpanded": "pf-m-expandable-expanded",
15
+ "expanded": "pf-m-expanded",
17
16
  "displayStack": "pf-m-display-stack",
18
17
  "displayInline": "pf-m-display-inline",
19
18
  "insetNone": "pf-m-inset-none",
package/css/components/Masthead/masthead.js CHANGED
@@ -14,8 +14,7 @@ exports.default = {
14
14
  "resizeObserver": "pf-m-resize-observer",
15
15
  "docked": "pf-m-docked",
16
16
  "compact": "pf-m-compact",
17
- "textExpanded": "pf-m-text-expanded",
18
- "expandableExpanded": "pf-m-expandable-expanded",
17
+ "expanded": "pf-m-expanded",
19
18
  "displayStack": "pf-m-display-stack",
20
19
  "displayInline": "pf-m-display-inline",
21
20
  "insetNone": "pf-m-inset-none",
package/css/components/Masthead/masthead.mjs CHANGED
@@ -12,8 +12,7 @@ export default {
12
12
  "resizeObserver": "pf-m-resize-observer",
13
13
  "docked": "pf-m-docked",
14
14
  "compact": "pf-m-compact",
15
- "textExpanded": "pf-m-text-expanded",
16
- "expandableExpanded": "pf-m-expandable-expanded",
15
+ "expanded": "pf-m-expanded",
17
16
  "displayStack": "pf-m-display-stack",
18
17
  "displayInline": "pf-m-display-inline",
19
18
  "insetNone": "pf-m-inset-none",
package/css/components/MenuToggle/menu-toggle.css CHANGED
@@ -370,13 +370,12 @@
370
370
  display: none;
371
371
  }
372
372
  }
373
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked, .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
373
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked {
374
374
  justify-content: flex-start;
375
375
  width: 100%;
376
376
  }
377
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__text,
378
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__controls, .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle__text,
379
- .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle__controls {
377
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__text,
378
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__controls {
380
379
  display: revert;
381
380
  }
382
381
 
package/css/components/MenuToggle/menu-toggle.d.ts CHANGED
@@ -30,8 +30,6 @@ declare const _default: {
30
30
  "settings": "pf-m-settings",
31
31
  "placeholder": "pf-m-placeholder",
32
32
  "docked": "pf-m-docked",
33
- "textExpanded": "pf-m-text-expanded",
34
- "expandableExpanded": "pf-m-expandable-expanded",
35
33
  "splitButton": "pf-m-split-button",
36
34
  "standalone": "pf-m-standalone",
37
35
  "typeahead": "pf-m-typeahead",
package/css/components/MenuToggle/menu-toggle.js CHANGED
@@ -32,8 +32,6 @@ exports.default = {
32
32
  "settings": "pf-m-settings",
33
33
  "placeholder": "pf-m-placeholder",
34
34
  "docked": "pf-m-docked",
35
- "textExpanded": "pf-m-text-expanded",
36
- "expandableExpanded": "pf-m-expandable-expanded",
37
35
  "splitButton": "pf-m-split-button",
38
36
  "standalone": "pf-m-standalone",
39
37
  "typeahead": "pf-m-typeahead",
package/css/components/MenuToggle/menu-toggle.mjs CHANGED
@@ -30,8 +30,6 @@ export default {
30
30
  "settings": "pf-m-settings",
31
31
  "placeholder": "pf-m-placeholder",
32
32
  "docked": "pf-m-docked",
33
- "textExpanded": "pf-m-text-expanded",
34
- "expandableExpanded": "pf-m-expandable-expanded",
35
33
  "splitButton": "pf-m-split-button",
36
34
  "standalone": "pf-m-standalone",
37
35
  "typeahead": "pf-m-typeahead",
package/css/components/Nav/nav.css CHANGED
@@ -184,13 +184,13 @@
184
184
  display: revert;
185
185
  }
186
186
  }
187
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
187
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) {
188
188
  width: 100%;
189
189
  }
190
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-text, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__toggle, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__subnav, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__link-text, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__toggle, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__subnav {
190
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-text, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__toggle, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__subnav, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__link-text, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__toggle, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__subnav {
191
191
  display: revert;
192
192
  }
193
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-expandable-icon, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__link-expandable-icon {
193
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-expandable-icon, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__link-expandable-icon {
194
194
  display: none;
195
195
  }
196
196
 
@@ -281,7 +281,7 @@
281
281
  .pf-v6-c-nav__item.pf-m-expanded:last-child > .pf-v6-c-nav__subnav {
282
282
  margin-block-end: calc(var(--pf-v6-c-nav__subnav--PaddingBlockEnd) * -1);
283
283
  }
284
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-m-docked .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current), .pf-v6-c-nav__item:has(> .pf-v6-c-nav__link.pf-m-current) {
284
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-expanded) .pf-m-docked .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current), .pf-v6-c-nav__item:has(> .pf-v6-c-nav__link.pf-m-current) {
285
285
  --pf-v6-c-nav__item--accent--ScaleY: var(--pf-v6-c-nav__item--current--accent--ScaleY);
286
286
  --pf-v6-c-nav__item--accent--TransitionDuration: var(--pf-v6-c-nav__item--current--accent--TransitionDuration);
287
287
  }
@@ -336,7 +336,7 @@
336
336
  color: var(--pf-v6-c-nav__link--hover--Color);
337
337
  background-color: var(--pf-v6-c-nav__link--hover--BackgroundColor);
338
338
  }
339
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current) > .pf-v6-c-nav__link, .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
339
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-expanded) .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current) > .pf-v6-c-nav__link, .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
340
340
  --pf-v6-c-nav__link-icon--Color: var(--pf-v6-c-nav__link--m-current__link-icon--Color);
341
341
  --pf-v6-c-nav__link--BorderWidth: var(--pf-v6-c-nav__link--m-current--BorderWidth);
342
342
  color: var(--pf-v6-c-nav__link--m-current--Color);
package/css/components/Nav/nav.d.ts CHANGED
@@ -11,10 +11,9 @@ declare const _default: {
11
11
  "inset": "pf-m-inset",
12
12
  "fill": "pf-m-fill",
13
13
  "docked": "pf-m-docked",
14
- "textExpanded": "pf-m-text-expanded",
15
- "expandableExpanded": "pf-m-expandable-expanded",
16
- "drilldown": "pf-m-drilldown",
17
14
  "expanded": "pf-m-expanded",
15
+ "overlay": "pf-m-overlay",
16
+ "drilldown": "pf-m-drilldown",
18
17
  "current": "pf-m-current",
19
18
  "hover": "pf-m-hover",
20
19
  "flyout": "pf-m-flyout",
package/css/components/Nav/nav.js CHANGED
@@ -13,10 +13,9 @@ exports.default = {
13
13
  "inset": "pf-m-inset",
14
14
  "fill": "pf-m-fill",
15
15
  "docked": "pf-m-docked",
16
- "textExpanded": "pf-m-text-expanded",
17
- "expandableExpanded": "pf-m-expandable-expanded",
18
- "drilldown": "pf-m-drilldown",
19
16
  "expanded": "pf-m-expanded",
17
+ "overlay": "pf-m-overlay",
18
+ "drilldown": "pf-m-drilldown",
20
19
  "current": "pf-m-current",
21
20
  "hover": "pf-m-hover",
22
21
  "flyout": "pf-m-flyout",
package/css/components/Nav/nav.mjs CHANGED
@@ -11,10 +11,9 @@ export default {
11
11
  "inset": "pf-m-inset",
12
12
  "fill": "pf-m-fill",
13
13
  "docked": "pf-m-docked",
14
- "textExpanded": "pf-m-text-expanded",
15
- "expandableExpanded": "pf-m-expandable-expanded",
16
- "drilldown": "pf-m-drilldown",
17
14
  "expanded": "pf-m-expanded",
15
+ "overlay": "pf-m-overlay",
16
+ "drilldown": "pf-m-drilldown",
18
17
  "current": "pf-m-current",
19
18
  "hover": "pf-m-hover",
20
19
  "flyout": "pf-m-flyout",
package/css/components/Page/page.css CHANGED
@@ -349,7 +349,7 @@
349
349
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
350
350
  }
351
351
  }
352
- .pf-v6-c-page .pf-v6-c-page__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
352
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
353
353
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
354
354
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
355
355
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -359,15 +359,15 @@
359
359
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-collapse--ScaleX);
360
360
  }
361
361
  @media (min-width: 62rem) {
362
- .pf-v6-c-page .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
363
- .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
362
+ .pf-v6-c-page .pf-v6-c-page__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
363
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
364
364
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
365
365
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
366
366
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
367
367
  --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
368
368
  --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
369
369
  }
370
- .pf-v6-c-page .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
370
+ .pf-v6-c-page .pf-v6-c-page__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
371
371
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
372
372
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
373
373
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -376,7 +376,7 @@
376
376
  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
377
377
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
378
378
  }
379
- .pf-v6-c-page .pf-v6-c-page__dock.pf-m-text-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
379
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
380
380
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
381
381
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
382
382
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -456,14 +456,8 @@
456
456
  translate: 100% 0;
457
457
  }
458
458
 
459
- .pf-v6-c-page__dock.pf-m-expanded, .pf-v6-c-page__dock.pf-m-expandable-expanded {
460
- --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
461
- visibility: visible;
462
- translate: 0;
463
- transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
464
- }
465
459
  @media (min-width: 62rem) {
466
- .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) {
460
+ .pf-v6-c-page__dock:not(.pf-m-overlay) {
467
461
  position: revert;
468
462
  inset: revert;
469
463
  visibility: revert;
@@ -474,8 +468,12 @@
474
468
  .pf-v6-c-page__dock .pf-v6-c-toolbar.pf-m-vertical :is(.pf-v6-c-toolbar__content-section, .pf-v6-c-toolbar__group, .pf-v6-c-toolbar__item) {
475
469
  align-items: stretch;
476
470
  }
477
- .pf-v6-c-page__dock.pf-m-text-expanded {
471
+ .pf-v6-c-page__dock.pf-m-expanded {
472
+ --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
473
+ visibility: visible;
478
474
  width: var(--pf-v6-c-page__dock--Width);
475
+ translate: 0;
476
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
479
477
  }
480
478
 
481
479
  .pf-v6-c-page__dock-main {
@@ -485,12 +483,12 @@
485
483
  box-shadow: var(--pf-v6-c-page__dock-main--BoxShadow);
486
484
  backdrop-filter: var(--pf-v6-c-page__dock-main--BackdropFilter);
487
485
  }
488
- .pf-v6-c-page__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-page__dock-main {
486
+ .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-page__dock-main {
489
487
  border-inline-end: var(--pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndWidth) solid var(--pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndColor);
490
488
  box-shadow: var(--pf-v6-c-page__dock--m-expanded__dock-main--BoxShadow);
491
489
  }
492
490
  @media (min-width: 62rem) {
493
- .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-page__dock-main {
491
+ .pf-v6-c-page__dock:not(.pf-m-overlay) .pf-v6-c-page__dock-main {
494
492
  --pf-v6-c-page__dock-main--BorderInlineEndWidth: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndWidth);
495
493
  --pf-v6-c-page__dock-main--BackgroundColor: var(--pf-v6-c-page__dock-main--desktop--BackgroundColor);
496
494
  --pf-v6-c-page__dock-main--BorderInlineEndColor: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndColor);
package/css/components/Page/page.d.ts CHANGED
@@ -12,9 +12,8 @@ declare const _default: {
12
12
  "hamburger": "pf-m-hamburger",
13
13
  "expanded": "pf-m-expanded",
14
14
  "collapsed": "pf-m-collapsed",
15
- "expandableExpanded": "pf-m-expandable-expanded",
16
- "textExpanded": "pf-m-text-expanded",
17
15
  "plain": "pf-m-plain",
16
+ "overlay": "pf-m-overlay",
18
17
  "vertical": "pf-m-vertical",
19
18
  "pageInsets": "pf-m-page-insets",
20
19
  "contextSelector": "pf-m-context-selector",
package/css/components/Page/page.js CHANGED
@@ -14,9 +14,8 @@ exports.default = {
14
14
  "hamburger": "pf-m-hamburger",
15
15
  "expanded": "pf-m-expanded",
16
16
  "collapsed": "pf-m-collapsed",
17
- "expandableExpanded": "pf-m-expandable-expanded",
18
- "textExpanded": "pf-m-text-expanded",
19
17
  "plain": "pf-m-plain",
18
+ "overlay": "pf-m-overlay",
20
19
  "vertical": "pf-m-vertical",
21
20
  "pageInsets": "pf-m-page-insets",
22
21
  "contextSelector": "pf-m-context-selector",
package/css/components/Page/page.mjs CHANGED
@@ -12,9 +12,8 @@ export default {
12
12
  "hamburger": "pf-m-hamburger",
13
13
  "expanded": "pf-m-expanded",
14
14
  "collapsed": "pf-m-collapsed",
15
- "expandableExpanded": "pf-m-expandable-expanded",
16
- "textExpanded": "pf-m-text-expanded",
17
15
  "plain": "pf-m-plain",
16
+ "overlay": "pf-m-overlay",
18
17
  "vertical": "pf-m-vertical",
19
18
  "pageInsets": "pf-m-page-insets",
20
19
  "contextSelector": "pf-m-context-selector",
package/css/components/_index.css CHANGED
@@ -2706,11 +2706,11 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
2706
2706
  display: none;
2707
2707
  }
2708
2708
  }
2709
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button.pf-m-docked, .pf-v6-c-button:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
2709
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-button.pf-m-docked {
2710
2710
  justify-content: flex-start;
2711
2711
  width: 100%;
2712
2712
  }
2713
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button.pf-m-docked .pf-v6-c-button__text, .pf-v6-c-button:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-button__text {
2713
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-button.pf-m-docked .pf-v6-c-button__text {
2714
2714
  display: revert;
2715
2715
  }
2716
2716
 
@@ -4055,7 +4055,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4055
4055
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
4056
4056
  }
4057
4057
 
4058
- .pf-v6-c-compass .pf-v6-c-compass__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
4058
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
4059
4059
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
4060
4060
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
4061
4061
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -4065,15 +4065,15 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4065
4065
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-collapse--ScaleX);
4066
4066
  }
4067
4067
  @media (min-width: 62rem) {
4068
- .pf-v6-c-compass .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
4069
- .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
4068
+ .pf-v6-c-compass .pf-v6-c-compass__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
4069
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
4070
4070
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
4071
4071
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
4072
4072
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
4073
4073
  --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
4074
4074
  --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
4075
4075
  }
4076
- .pf-v6-c-compass .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
4076
+ .pf-v6-c-compass .pf-v6-c-compass__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
4077
4077
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
4078
4078
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
4079
4079
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -4082,7 +4082,7 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4082
4082
  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
4083
4083
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
4084
4084
  }
4085
- .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-text-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
4085
+ .pf-v6-c-compass .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
4086
4086
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
4087
4087
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
4088
4088
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -4236,14 +4236,8 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4236
4236
  translate: -100% 0;
4237
4237
  transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s var(--pf-v6-c-compass__dock--TransitionDuration--slide);
4238
4238
  }
4239
- .pf-v6-c-compass__dock.pf-m-expanded, .pf-v6-c-compass__dock.pf-m-expandable-expanded {
4240
- --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
4241
- visibility: visible;
4242
- translate: 0;
4243
- transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
4244
- }
4245
4239
  @media (min-width: 62rem) {
4246
- .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) {
4240
+ .pf-v6-c-compass__dock:not(.pf-m-overlay) {
4247
4241
  --pf-v6-c-compass__dock-main--BackgroundColor: var(--pf-v6-c-compass__dock-main--desktop--BackgroundColor);
4248
4242
  --pf-v6-c-compass__dock-main--BorderInlineEndColor: var(--pf-v6-c-compass__dock-main--desktop--BorderInlineEndColor);
4249
4243
  position: revert;
@@ -4256,8 +4250,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4256
4250
  .pf-v6-c-compass__dock .pf-v6-c-toolbar.pf-m-vertical :is(.pf-v6-c-toolbar__content-section, .pf-v6-c-toolbar__group, .pf-v6-c-toolbar__item) {
4257
4251
  align-items: stretch;
4258
4252
  }
4259
- .pf-v6-c-compass__dock.pf-m-text-expanded {
4253
+ .pf-v6-c-compass__dock.pf-m-expanded {
4254
+ --pf-v6-c-compass__dock--TransitionDuration--slide: var(--pf-v6-c-compass__dock--m-expanded--TransitionDuration--slide);
4255
+ visibility: visible;
4260
4256
  width: var(--pf-v6-c-compass__dock--Width);
4257
+ translate: 0;
4258
+ transition: translate var(--pf-v6-c-compass__dock--TransitionDuration--slide) var(--pf-v6-c-compass__dock--TransitionTimingFunction--slide), visibility 0s 0s;
4261
4259
  }
4262
4260
 
4263
4261
  .pf-v6-c-compass__dock-main {
@@ -4267,12 +4265,12 @@ label.pf-v6-c-check, .pf-v6-c-check__label,
4267
4265
  box-shadow: var(--pf-v6-c-compass__dock-main--BoxShadow);
4268
4266
  backdrop-filter: var(--pf-v6-c-compass__dock-main--BackdropFilter);
4269
4267
  }
4270
- .pf-v6-c-compass__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-compass__dock-main {
4268
+ .pf-v6-c-compass__dock.pf-m-expanded .pf-v6-c-compass__dock-main {
4271
4269
  border-inline-end: var(--pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndWidth) solid var(--pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndColor);
4272
4270
  box-shadow: var(--pf-v6-c-compass__dock--m-expanded__dock-main--BoxShadow);
4273
4271
  }
4274
4272
  @media (min-width: 62rem) {
4275
- .pf-v6-c-compass__dock:not(.pf-m-expandable-expanded) .pf-v6-c-compass__dock-main {
4273
+ .pf-v6-c-compass__dock:not(.pf-m-overlay) .pf-v6-c-compass__dock-main {
4276
4274
  --pf-v6-c-compass__dock-main--BoxShadow: var(--pf-v6-c-compass__dock-main--desktop--BoxShadow);
4277
4275
  --pf-v6-c-compass__dock--m-expanded__dock-main--BoxShadow: var(--pf-v6-c-compass__dock-main--desktop--BoxShadow);
4278
4276
  --pf-v6-c-compass__dock--m-expanded__dock-main--BorderInlineEndWidth: var(--pf-v6-c-compass__dock-main--BorderInlineEndWidth);
@@ -11094,13 +11092,13 @@ ul.pf-v6-c-list {
11094
11092
  display: revert;
11095
11093
  }
11096
11094
  }
11097
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo {
11095
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo {
11098
11096
  display: revert;
11099
11097
  }
11100
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo.pf-m-compact {
11098
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__logo.pf-m-compact {
11101
11099
  display: none;
11102
11100
  }
11103
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__main {
11101
+ :where(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-masthead.pf-m-docked .pf-v6-c-masthead__main {
11104
11102
  align-items: flex-start;
11105
11103
  }
11106
11104
 
@@ -12574,13 +12572,12 @@ ul.pf-v6-c-list {
12574
12572
  display: none;
12575
12573
  }
12576
12574
  }
12577
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked, .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
12575
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked {
12578
12576
  justify-content: flex-start;
12579
12577
  width: 100%;
12580
12578
  }
12581
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__text,
12582
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__controls, .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle__text,
12583
- .pf-v6-c-menu-toggle:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-menu-toggle__controls {
12579
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__text,
12580
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock).pf-m-expanded .pf-v6-c-menu-toggle.pf-m-docked .pf-v6-c-menu-toggle__controls {
12584
12581
  display: revert;
12585
12582
  }
12586
12583
 
@@ -13404,13 +13401,13 @@ ul.pf-v6-c-list {
13404
13401
  display: revert;
13405
13402
  }
13406
13403
  }
13407
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) {
13404
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) {
13408
13405
  width: 100%;
13409
13406
  }
13410
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-text, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__toggle, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__subnav, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__link-text, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__toggle, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__subnav {
13407
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-text, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__toggle, :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__subnav, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__link-text, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__toggle, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__subnav {
13411
13408
  display: revert;
13412
13409
  }
13413
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-expandable-icon, .pf-v6-c-nav.pf-m-docked:is(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__link-expandable-icon {
13410
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav.pf-m-docked .pf-v6-c-nav__link-expandable-icon, .pf-v6-c-nav.pf-m-docked:where(.pf-m-expanded, .pf-m-overlay) .pf-v6-c-nav__link-expandable-icon {
13414
13411
  display: none;
13415
13412
  }
13416
13413
 
@@ -13501,7 +13498,7 @@ ul.pf-v6-c-list {
13501
13498
  .pf-v6-c-nav__item.pf-m-expanded:last-child > .pf-v6-c-nav__subnav {
13502
13499
  margin-block-end: calc(var(--pf-v6-c-nav__subnav--PaddingBlockEnd) * -1);
13503
13500
  }
13504
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-m-docked .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current), .pf-v6-c-nav__item:has(> .pf-v6-c-nav__link.pf-m-current) {
13501
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-expanded) .pf-m-docked .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current), .pf-v6-c-nav__item:has(> .pf-v6-c-nav__link.pf-m-current) {
13505
13502
  --pf-v6-c-nav__item--accent--ScaleY: var(--pf-v6-c-nav__item--current--accent--ScaleY);
13506
13503
  --pf-v6-c-nav__item--accent--TransitionDuration: var(--pf-v6-c-nav__item--current--accent--TransitionDuration);
13507
13504
  }
@@ -13556,7 +13553,7 @@ ul.pf-v6-c-list {
13556
13553
  color: var(--pf-v6-c-nav__link--hover--Color);
13557
13554
  background-color: var(--pf-v6-c-nav__link--hover--BackgroundColor);
13558
13555
  }
13559
- :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-text-expanded, .pf-m-expandable-expanded) .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current) > .pf-v6-c-nav__link, .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
13556
+ :is(.pf-v6-c-page__dock, .pf-v6-c-compass__dock):not(.pf-m-expanded) .pf-v6-c-nav__item:has(.pf-v6-c-nav__subnav .pf-v6-c-nav__link.pf-m-current) > .pf-v6-c-nav__link, .pf-v6-c-nav__link.pf-m-current, .pf-v6-c-nav__link.pf-m-current:hover {
13560
13557
  --pf-v6-c-nav__link-icon--Color: var(--pf-v6-c-nav__link--m-current__link-icon--Color);
13561
13558
  --pf-v6-c-nav__link--BorderWidth: var(--pf-v6-c-nav__link--m-current--BorderWidth);
13562
13559
  color: var(--pf-v6-c-nav__link--m-current--Color);
@@ -14369,7 +14366,7 @@ ul.pf-v6-c-list {
14369
14366
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
14370
14367
  }
14371
14368
  }
14372
- .pf-v6-c-page .pf-v6-c-page__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
14369
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
14373
14370
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
14374
14371
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
14375
14372
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -14379,15 +14376,15 @@ ul.pf-v6-c-list {
14379
14376
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-collapse--ScaleX);
14380
14377
  }
14381
14378
  @media (min-width: 62rem) {
14382
- .pf-v6-c-page .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
14383
- .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
14379
+ .pf-v6-c-page .pf-v6-c-page__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger,
14380
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger {
14384
14381
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--path--base);
14385
14382
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--path--base);
14386
14383
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--path--base);
14387
14384
  --pf-v6-c-button__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
14388
14385
  --pf-v6-c-button--hover__icon--TransitionDelay: var(--pf-v6-c-button--hamburger-icon--TransitionDuration);
14389
14386
  }
14390
- .pf-v6-c-page .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
14387
+ .pf-v6-c-page .pf-v6-c-page__dock .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
14391
14388
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
14392
14389
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
14393
14390
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -14396,7 +14393,7 @@ ul.pf-v6-c-list {
14396
14393
  --pf-v6-c-button--hover__icon--TransitionDelay: 0s;
14397
14394
  --pf-v6-c-button--hover__icon--ScaleX: var(--pf-v6-c-button--m-hamburger__icon--m-expand--ScaleX);
14398
14395
  }
14399
- .pf-v6-c-page .pf-v6-c-page__dock.pf-m-text-expanded:not(.pf-m-expandable-expanded) .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
14396
+ .pf-v6-c-page .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-masthead__toggle .pf-v6-c-button.pf-m-hamburger:is(:hover, :focus-visible) {
14400
14397
  --pf-v6-c-button--hamburger-icon--top--path: var(--pf-v6-c-button--hamburger-icon--top--collapse--path);
14401
14398
  --pf-v6-c-button--hamburger-icon--arrow--path: var(--pf-v6-c-button--hamburger-icon--arrow--collapse--path);
14402
14399
  --pf-v6-c-button--hamburger-icon--bottom--path: var(--pf-v6-c-button--hamburger-icon--bottom--collapse--path);
@@ -14476,14 +14473,8 @@ ul.pf-v6-c-list {
14476
14473
  translate: 100% 0;
14477
14474
  }
14478
14475
 
14479
- .pf-v6-c-page__dock.pf-m-expanded, .pf-v6-c-page__dock.pf-m-expandable-expanded {
14480
- --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
14481
- visibility: visible;
14482
- translate: 0;
14483
- transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
14484
- }
14485
14476
  @media (min-width: 62rem) {
14486
- .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) {
14477
+ .pf-v6-c-page__dock:not(.pf-m-overlay) {
14487
14478
  position: revert;
14488
14479
  inset: revert;
14489
14480
  visibility: revert;
@@ -14494,8 +14485,12 @@ ul.pf-v6-c-list {
14494
14485
  .pf-v6-c-page__dock .pf-v6-c-toolbar.pf-m-vertical :is(.pf-v6-c-toolbar__content-section, .pf-v6-c-toolbar__group, .pf-v6-c-toolbar__item) {
14495
14486
  align-items: stretch;
14496
14487
  }
14497
- .pf-v6-c-page__dock.pf-m-text-expanded {
14488
+ .pf-v6-c-page__dock.pf-m-expanded {
14489
+ --pf-v6-c-page__dock--TransitionDuration--slide: var(--pf-v6-c-page__dock--m-expanded--TransitionDuration--slide);
14490
+ visibility: visible;
14498
14491
  width: var(--pf-v6-c-page__dock--Width);
14492
+ translate: 0;
14493
+ transition: translate var(--pf-v6-c-page__dock--TransitionDuration--slide) var(--pf-v6-c-page__dock--TransitionTimingFunction--slide), visibility 0s 0s;
14499
14494
  }
14500
14495
 
14501
14496
  .pf-v6-c-page__dock-main {
@@ -14505,12 +14500,12 @@ ul.pf-v6-c-list {
14505
14500
  box-shadow: var(--pf-v6-c-page__dock-main--BoxShadow);
14506
14501
  backdrop-filter: var(--pf-v6-c-page__dock-main--BackdropFilter);
14507
14502
  }
14508
- .pf-v6-c-page__dock:is(.pf-m-expanded, .pf-m-expandable-expanded) .pf-v6-c-page__dock-main {
14503
+ .pf-v6-c-page__dock.pf-m-expanded .pf-v6-c-page__dock-main {
14509
14504
  border-inline-end: var(--pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndWidth) solid var(--pf-v6-c-page__dock--m-expanded__dock-main--BorderInlineEndColor);
14510
14505
  box-shadow: var(--pf-v6-c-page__dock--m-expanded__dock-main--BoxShadow);
14511
14506
  }
14512
14507
  @media (min-width: 62rem) {
14513
- .pf-v6-c-page__dock:not(.pf-m-expandable-expanded) .pf-v6-c-page__dock-main {
14508
+ .pf-v6-c-page__dock:not(.pf-m-overlay) .pf-v6-c-page__dock-main {
14514
14509
  --pf-v6-c-page__dock-main--BorderInlineEndWidth: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndWidth);
14515
14510
  --pf-v6-c-page__dock-main--BackgroundColor: var(--pf-v6-c-page__dock-main--desktop--BackgroundColor);
14516
14511
  --pf-v6-c-page__dock-main--BorderInlineEndColor: var(--pf-v6-c-page__dock-main--desktop--BorderInlineEndColor);
package/css/components/_index.d.ts CHANGED
@@ -439,8 +439,6 @@ declare const _default: {
439
439
  "inProgress": "pf-m-in-progress",
440
440
  "notify": "pf-m-notify",
441
441
  "docked": "pf-m-docked",
442
- "textExpanded": "pf-m-text-expanded",
443
- "expandableExpanded": "pf-m-expandable-expanded",
444
442
  "start": "pf-m-start",
445
443
  "end": "pf-m-end",
446
444
  "inRange": "pf-m-in-range",
@@ -465,6 +463,7 @@ declare const _default: {
465
463
  "readOnly": "pf-m-read-only",
466
464
  "dragHover": "pf-m-drag-hover",
467
465
  "animateSmoothly": "pf-m-animate-smoothly",
466
+ "overlay": "pf-m-overlay",
468
467
  "editorial": "pf-m-editorial",
469
468
  "visited": "pf-m-visited",
470
469
  "pageTitle": "pf-m-page-title",
package/css/components/_index.js CHANGED
@@ -441,8 +441,6 @@ exports.default = {
441
441
  "inProgress": "pf-m-in-progress",
442
442
  "notify": "pf-m-notify",
443
443
  "docked": "pf-m-docked",
444
- "textExpanded": "pf-m-text-expanded",
445
- "expandableExpanded": "pf-m-expandable-expanded",
446
444
  "start": "pf-m-start",
447
445
  "end": "pf-m-end",
448
446
  "inRange": "pf-m-in-range",
@@ -467,6 +465,7 @@ exports.default = {
467
465
  "readOnly": "pf-m-read-only",
468
466
  "dragHover": "pf-m-drag-hover",
469
467
  "animateSmoothly": "pf-m-animate-smoothly",
468
+ "overlay": "pf-m-overlay",
470
469
  "editorial": "pf-m-editorial",
471
470
  "visited": "pf-m-visited",
472
471
  "pageTitle": "pf-m-page-title",
package/css/components/_index.mjs CHANGED
@@ -439,8 +439,6 @@ export default {
439
439
  "inProgress": "pf-m-in-progress",
440
440
  "notify": "pf-m-notify",
441
441
  "docked": "pf-m-docked",
442
- "textExpanded": "pf-m-text-expanded",
443
- "expandableExpanded": "pf-m-expandable-expanded",
444
442
  "start": "pf-m-start",
445
443
  "end": "pf-m-end",
446
444
  "inRange": "pf-m-in-range",
@@ -465,6 +463,7 @@ export default {
465
463
  "readOnly": "pf-m-read-only",
466
464
  "dragHover": "pf-m-drag-hover",
467
465
  "animateSmoothly": "pf-m-animate-smoothly",
466
+ "overlay": "pf-m-overlay",
468
467
  "editorial": "pf-m-editorial",
469
468
  "visited": "pf-m-visited",
470
469
  "pageTitle": "pf-m-page-title",
package/css/docs/components/Nav/examples/Navigation.css CHANGED
@@ -13,6 +13,14 @@
13
13
  inset-inline-start: 265px;
14
14
  }
15
15
 
16
+ #ws-core-c-navigation-docked-nav-with-expandable-links .pf-v6-c-nav__item:has(.pf-m-current) {
17
+ --pf-v6-c-nav__item--accent--ScaleY: var(--pf-v6-c-nav__item--current--accent--ScaleY);
18
+
19
+ > .pf-v6-c-nav__link {
20
+ background-color: var(--pf-v6-c-nav__link--m-current--BackgroundColor);
21
+ }
22
+ }
23
+
16
24
  #ws-core-c-navigation-horizontal .ws-preview-html,
17
25
  #ws-core-c-navigation-horizontal-overflow .ws-preview-html {
18
26
  padding: var(--pf-t--global--spacer--md);
package/css/docs/components/Nav/examples/Navigation.d.ts CHANGED
@@ -3,8 +3,11 @@ declare const _default: {
3
3
  "menu": "pf-v6-c-menu",
4
4
  "modifiers": {
5
5
  "flyout": "pf-m-flyout",
6
- "nav": "pf-m-nav"
6
+ "nav": "pf-m-nav",
7
+ "current": "pf-m-current"
7
8
  },
9
+ "navItem": "pf-v6-c-nav__item",
10
+ "navLink": "pf-v6-c-nav__link",
8
11
  "wsCoreCNavigation": "ws-core-c-navigation",
9
12
  "wsPreviewHtml": "ws-preview-html"
10
13
  };
package/css/docs/components/Nav/examples/Navigation.js CHANGED
@@ -5,8 +5,11 @@ exports.default = {
5
5
  "menu": "pf-v6-c-menu",
6
6
  "modifiers": {
7
7
  "flyout": "pf-m-flyout",
8
- "nav": "pf-m-nav"
8
+ "nav": "pf-m-nav",
9
+ "current": "pf-m-current"
9
10
  },
11
+ "navItem": "pf-v6-c-nav__item",
12
+ "navLink": "pf-v6-c-nav__link",
10
13
  "wsCoreCNavigation": "ws-core-c-navigation",
11
14
  "wsPreviewHtml": "ws-preview-html"
12
15
  };
package/css/docs/components/Nav/examples/Navigation.mjs CHANGED
@@ -3,8 +3,11 @@ export default {
3
3
  "menu": "pf-v6-c-menu",
4
4
  "modifiers": {
5
5
  "flyout": "pf-m-flyout",
6
- "nav": "pf-m-nav"
6
+ "nav": "pf-m-nav",
7
+ "current": "pf-m-current"
7
8
  },
9
+ "navItem": "pf-v6-c-nav__item",
10
+ "navLink": "pf-v6-c-nav__link",
8
11
  "wsCoreCNavigation": "ws-core-c-navigation",
9
12
  "wsPreviewHtml": "ws-preview-html"
10
13
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@patternfly/react-styles",
3
- "version": "6.6.1-prerelease.4",
3
+ "version": "6.7.0-prerelease.1",
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.6.0-prerelease.49",
22
+ "@patternfly/patternfly": "6.6.0-prerelease.50",
23
23
  "change-case": "^5.4.4",
24
24
  "fs-extra": "^11.3.3"
25
25
  },
26
26
  "license": "MIT",
27
- "gitHead": "d05c304675ccc19b82df36c0701986120e353329"
27
+ "gitHead": "32056428bd221fb8009157d7f7d29bae84f7fe3f"
28
28
  }