@patternfly/patternfly 6.6.0-prerelease.9 → 6.6.1

package/README.md

@@ -1,5 +1,5 @@
 # PatternFly 
- 
+
 ## Contributing
 
 We welcome contributions to PatternFly! Please read our [Contributing Guide](https://pf-core-staging.patternfly.org/contribution) to learn how to get started, submit issues, and contribute code to the project. 

package/base/patternfly-fonts.css

@@ -1,28 +1,28 @@
 @font-face {
   font-family: "Red Hat Text";
   font-style: normal;
-  font-weight: 400 500;
+  font-weight: 400 600;
   src: url("./assets/fonts/RedHatText/RedHatTextVF.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "Red Hat Text";
   font-style: italic;
-  font-weight: 400 500;
+  font-weight: 400 600;
   src: url("./assets/fonts/RedHatText/RedHatTextVF-Italic.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "Red Hat Display";
   font-style: normal;
-  font-weight: 400 700;
+  font-weight: 600 800;
   src: url("./assets/fonts/RedHatDisplay/RedHatDisplayVF.woff2") format("woff2-variations");
   font-display: fallback;
 }
 @font-face {
   font-family: "Red Hat Display";
   font-style: italic;
-  font-weight: 400 700;
+  font-weight: 600 800;
   src: url("./assets/fonts/RedHatDisplay/RedHatDisplayVF-Italic.woff2") format("woff2-variations");
   font-display: fallback;
 }

package/base/patternfly-fonts.scss

@@ -3,7 +3,7 @@
 @font-face {
   font-family: "Red Hat Text";
   font-style: normal;
-  font-weight: 400 500;
+  font-weight: 400 600;
   src: url("#{$pf-v6-global--font-path}/RedHatText/RedHatTextVF.woff2") format("woff2-variations");
   font-display: fallback;
 }
@@ -11,7 +11,7 @@
 @font-face {
   font-family: "Red Hat Text";
   font-style: italic;
-  font-weight: 400 500;
+  font-weight: 400 600;
   src: url("#{$pf-v6-global--font-path}/RedHatText/RedHatTextVF-Italic.woff2") format("woff2-variations");
   font-display: fallback;
 }
@@ -19,7 +19,7 @@
 @font-face {
   font-family: "Red Hat Display";
   font-style: normal;
-  font-weight: 400 700;
+  font-weight: 600 800;
   src: url("#{$pf-v6-global--font-path}/RedHatDisplay/RedHatDisplayVF.woff2") format("woff2-variations");
   font-display: fallback;
 }
@@ -27,7 +27,7 @@
 @font-face {
   font-family: "Red Hat Display";
   font-style: italic;
-  font-weight: 400 700;
+  font-weight: 600 800;
   src: url("#{$pf-v6-global--font-path}/RedHatDisplay/RedHatDisplayVF-Italic.woff2") format("woff2-variations");
   font-display: fallback;
 }

package/base/patternfly-variables.css

@@ -167,9 +167,9 @@
   --pf-t--global--font--size--700: 1.75rem;
   --pf-t--global--font--size--800: 2.25rem;
   --pf-t--global--font--weight--100: 400;
-  --pf-t--global--font--weight--200: 500;
-  --pf-t--global--font--weight--300: 500;
-  --pf-t--global--font--weight--400: 700;
+  --pf-t--global--font--weight--200: 600;
+  --pf-t--global--font--weight--300: 600;
+  --pf-t--global--font--weight--400: 800;
   --pf-t--global--icon--size--100: 0.75rem;
   --pf-t--global--icon--size--200: 0.875rem;
   --pf-t--global--icon--size--250: 1rem;
@@ -1067,9 +1067,9 @@
   --pf-t--global--font--size--700: 1.75rem;
   --pf-t--global--font--size--800: 2.25rem;
   --pf-t--global--font--weight--100: 400;
-  --pf-t--global--font--weight--200: 500;
-  --pf-t--global--font--weight--300: 500;
-  --pf-t--global--font--weight--400: 700;
+  --pf-t--global--font--weight--200: 600;
+  --pf-t--global--font--weight--300: 600;
+  --pf-t--global--font--weight--400: 800;
   --pf-t--global--icon--size--100: 0.75rem;
   --pf-t--global--icon--size--200: 0.875rem;
   --pf-t--global--icon--size--250: 1rem;

package/base/tokens/tokens-charts-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--chart--global--BorderWidth--lg: 8;

package/base/tokens/tokens-charts-highcontrast-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--chart--global--BorderWidth--lg: 8;

package/base/tokens/tokens-charts-highcontrast.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--chart--global--BorderWidth--lg: 8;

package/base/tokens/tokens-charts.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--chart--global--BorderWidth--lg: 8;

package/base/tokens/tokens-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--global--background--color--action--plain--default: rgb(0, 0, 0, 0.0000);

package/base/tokens/tokens-default.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--global--background--color--500: rgb(21, 21, 21, 0.4000);
@@ -92,9 +92,9 @@
   --pf-t--global--font--size--700: 1.75rem;
   --pf-t--global--font--size--800: 2.25rem;
   --pf-t--global--font--weight--100: 400;
-  --pf-t--global--font--weight--200: 500;
-  --pf-t--global--font--weight--300: 500;
-  --pf-t--global--font--weight--400: 700;
+  --pf-t--global--font--weight--200: 600;
+  --pf-t--global--font--weight--300: 600;
+  --pf-t--global--font--weight--400: 800;
   --pf-t--global--icon--size--100: 0.75rem;
   --pf-t--global--icon--size--200: 0.875rem;
   --pf-t--global--icon--size--250: 1rem;

package/base/tokens/tokens-felt-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (14 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-felt-glass-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (33 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-felt-glass.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (24 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-felt-highcontrast-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (43 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-felt-highcontrast.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (122 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-felt.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (8 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-glass-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (19 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-glass.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 // Only tokens that differ from base theme (16 tokens)
 @mixin pf-v6-tokens {

package/base/tokens/tokens-highcontrast-dark.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--global--background--color--action--plain--default: rgb(0, 0, 0, 0.0000);

package/base/tokens/tokens-highcontrast.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--global--background--color--500: rgb(21, 21, 21, 0.4000);
@@ -75,9 +75,9 @@
   --pf-t--global--font--size--700: 1.75rem;
   --pf-t--global--font--size--800: 2.25rem;
   --pf-t--global--font--weight--100: 400;
-  --pf-t--global--font--weight--200: 500;
-  --pf-t--global--font--weight--300: 500;
-  --pf-t--global--font--weight--400: 700;
+  --pf-t--global--font--weight--200: 600;
+  --pf-t--global--font--weight--300: 600;
+  --pf-t--global--font--weight--400: 800;
   --pf-t--global--icon--size--100: 0.75rem;
   --pf-t--global--icon--size--200: 0.875rem;
   --pf-t--global--icon--size--250: 1rem;

package/base/tokens/tokens-palette.scss

@@ -1,6 +1,6 @@
 
 // Do not edit directly
-// Generated on Mon, 01 Jun 2026 21:26:11 GMT
+// Generated on Tue, 23 Jun 2026 19:20:00 GMT
 
 @mixin pf-v6-tokens {
   --pf-t--color--black: #000000;

package/base/tokens/tokens-redhat-highcontrast.scss

@@ -314,10 +314,10 @@
   --pf-t--global--font--size--sm: var(--pf-t--global--font--size--200);
   --pf-t--global--font--size--xl: var(--pf-t--global--font--size--500);
   --pf-t--global--font--size--xs: var(--pf-t--global--font--size--100);
-  --pf-t--global--font--weight--body--bold: var(--pf-t--global--font--weight--200);
+  --pf-t--global--font--weight--body--bold: 600;
   --pf-t--global--font--weight--body--default: var(--pf-t--global--font--weight--100);
-  --pf-t--global--font--weight--heading--bold: var(--pf-t--global--font--weight--400);
-  --pf-t--global--font--weight--heading--default: var(--pf-t--global--font--weight--300);
+  --pf-t--global--font--weight--heading--bold: 800;
+  --pf-t--global--font--weight--heading--default: 600;
   --pf-t--global--icon--color--100: var(--pf-t--color--gray--90);
   --pf-t--global--icon--color--150: var(--pf-t--color--gray--60);
   --pf-t--global--icon--color--200: var(--pf-t--color--gray--50);

package/components/AboutModalBox/about-modal-box.css

@@ -164,7 +164,7 @@
   overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
   -webkit-overflow-scrolling: touch;
 }
 @media screen and (min-width: 36rem) {

package/components/AboutModalBox/about-modal-box.scss

@@ -176,7 +176,7 @@
   overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
   -webkit-overflow-scrolling: touch;
 
   @media screen and (min-width: $pf-v6-global--breakpoint--sm) {

package/components/Accordion/accordion.css

@@ -4,10 +4,10 @@
   --pf-v6-c-accordion__item--BorderRadius: var(--pf-t--global--border--radius--200);
   --pf-v6-c-accordion__item--m-expanded--BackgroundColor: var(--pf-t--global--background--color--action--plain--clicked);
   --pf-v6-c-accordion__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
-  --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-accordion__toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
   --pf-v6-c-accordion__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
-  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-accordion__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
+  --pf-v6-c-accordion__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
   --pf-v6-c-accordion__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-accordion__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
   --pf-v6-c-accordion__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);

package/components/Accordion/accordion.scss

@@ -11,10 +11,10 @@
 
   // accordion toggle
   --#{$accordion}__toggle--ColumnGap: var(--pf-t--global--spacer--gap--text-to-element--default);
-  --#{$accordion}__toggle--PaddingBlockStart: var(--pf-t--global--spacer--sm);
+  --#{$accordion}__toggle--PaddingBlockStart: var(--pf-t--global--spacer--control--vertical--plain);
   --#{$accordion}__toggle--PaddingInlineEnd: var(--pf-t--global--spacer--md);
-  --#{$accordion}__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
-  --#{$accordion}__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--sm);
+  --#{$accordion}__toggle--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
+  --#{$accordion}__toggle--m-expanded--PaddingBlockEnd: var(--pf-t--global--spacer--control--vertical--plain);
   --#{$accordion}__toggle--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --#{$accordion}__toggle--BackgroundColor: var(--pf-t--global--background--color--action--plain--default);
   --#{$accordion}__toggle--hover--BackgroundColor: var(--pf-t--global--background--color--action--plain--hover);

package/components/Alert/alert.css

@@ -14,9 +14,9 @@
   --pf-v6-c-alert--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-alert--PaddingInlineStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-alert--FontSize: var(--pf-t--global--font--size--body--default);
-  --pf-v6-c-alert__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
-  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
-  --pf-v6-c-alert__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default));
+  --pf-v6-c-alert__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --pf-v6-c-alert__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --pf-v6-c-alert__toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
   --pf-v6-c-alert__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
   --pf-v6-c-alert__toggle-icon--Rotate: 0;
   --pf-v6-c-alert__toggle-icon--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
@@ -28,8 +28,8 @@
   --pf-v6-c-alert__title--FontWeight: var(--pf-t--global--font--weight--body--bold);
   --pf-v6-c-alert__title--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-alert__title--max-lines: 1;
-  --pf-v6-c-alert__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
-  --pf-v6-c-alert__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --pf-v6-c-alert__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --pf-v6-c-alert__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --pf-v6-c-alert__action--TranslateY: 0.125rem;
   --pf-v6-c-alert__action--MarginInlineEnd: calc(var(--pf-t--global--spacer--sm) * -1);
   --pf-v6-c-alert__description--PaddingBlockStart: var(--pf-t--global--spacer--xs);
@@ -152,6 +152,7 @@
 
 .pf-v6-c-alert__icon {
   grid-area: icon;
+  align-self: baseline;
   margin-inline-end: var(--pf-v6-c-alert__icon--MarginInlineEnd);
   font-size: var(--pf-v6-c-alert__icon--FontSize);
   color: var(--pf-v6-c-alert__icon--Color);
@@ -162,7 +163,7 @@
   grid-area: title;
   font-weight: var(--pf-v6-c-alert__title--FontWeight);
   color: var(--pf-v6-c-alert__title--Color);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
 }
 .pf-v6-c-alert__title.pf-m-truncate {
   display: -webkit-box;
@@ -174,7 +175,7 @@
 .pf-v6-c-alert__description {
   grid-area: description;
   padding-block-start: var(--pf-v6-c-alert__description--PaddingBlockStart);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
 }
 .pf-v6-c-alert__description + .pf-v6-c-alert__action-group {
   --pf-v6-c-alert__action-group--PaddingBlockStart: var(--pf-v6-c-alert__description--action-group--PaddingBlockStart);

package/components/Alert/alert.scss

@@ -19,9 +19,9 @@
   --#{$alert}--FontSize: var(--pf-t--global--font--size--body--default);
 
   // Toggle
-  --#{$alert}__toggle--MarginBlockStart: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
-  --#{$alert}__toggle--MarginBlockEnd: calc(-1 * var(--pf-t--global--spacer--control--vertical--default));
-  --#{$alert}__toggle--MarginInlineStart: calc(-1 * var(--pf-t--global--spacer--action--horizontal--plain--default));
+  --#{$alert}__toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --#{$alert}__toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --#{$alert}__toggle--MarginInlineStart: calc(var(--pf-t--global--spacer--action--horizontal--plain--default) * -1);
   --#{$alert}__toggle--MarginInlineEnd: var(--pf-t--global--spacer--sm);
 
   // Toggle icon
@@ -41,8 +41,8 @@
   --#{$alert}__title--max-lines: 1;
 
   // Action
-  --#{$alert}__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
-  --#{$alert}__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --#{$alert}__action--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
+  --#{$alert}__action--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --#{$alert}__action--TranslateY: #{pf-size-prem(2px)};
   --#{$alert}__action--MarginInlineEnd: calc(var(--pf-t--global--spacer--sm) * -1);
 
@@ -194,6 +194,7 @@
 
 .#{$alert}__icon {
   grid-area: icon;
+  align-self: baseline;
   margin-inline-end: var(--#{$alert}__icon--MarginInlineEnd);
   font-size: var(--#{$alert}__icon--FontSize);
   color: var(--#{$alert}__icon--Color);
@@ -204,7 +205,7 @@
   grid-area: title;
   font-weight: var(--#{$alert}__title--FontWeight);
   color: var(--#{$alert}__title--Color);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
 
   &.pf-m-truncate {
     @include pf-v6-line-clamp("var(--#{$alert}__title--max-lines)");
@@ -214,7 +215,7 @@
 .#{$alert}__description {
   grid-area: description;
   padding-block-start: var(--#{$alert}__description--PaddingBlockStart);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
 
   + .#{$alert}__action-group {
     --#{$alert}__action-group--PaddingBlockStart: var(--#{$alert}__description--action-group--PaddingBlockStart);

package/components/Banner/banner.css

@@ -21,7 +21,9 @@
   --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--Color);
   --pf-v6-c-banner--link--TextDecoration: underline;
   --pf-v6-c-banner--link--hover--Color: var(--pf-v6-c-banner--Color);
+  --pf-v6-c-banner--link--clicked--Color: var(--pf-v6-c-banner--Color);
   --pf-v6-c-banner--link--disabled--Color: var(--pf-t--global--text--color--disabled);
+  --pf-v6-c-banner--link--TextDecorationColor: currentcolor;
   --pf-v6-c-banner--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
   --pf-v6-c-banner--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--md);
   --pf-v6-c-banner--m-danger--BackgroundColor: var(--pf-t--global--color--status--danger--default);
@@ -130,6 +132,7 @@
 .pf-v6-c-banner a {
   color: var(--pf-v6-c-banner--link--Color);
   text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
+  text-decoration-color: var(--pf-v6-c-banner--a--TextDecorationColor);
 }
 .pf-v6-c-banner a:hover:not(.pf-m-disabled) {
   --pf-v6-c-banner--link--Color: var(--pf-v6-c-banner--link--hover--Color);
@@ -141,7 +144,11 @@
 .pf-v6-c-banner .pf-v6-c-button.pf-m-inline {
   --pf-v6-c-button--m-link--m-inline--Color: var(--pf-v6-c-banner--link--Color);
   --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-v6-c-banner--link--hover--Color);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-v6-c-banner--link--clicked--Color);
   --pf-v6-c-button--disabled--Color: var(--pf-v6-c-banner--link--disabled--Color);
+  --pf-v6-c-button--m-link--m-inline--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
+  --pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-v6-c-banner--link--TextDecorationColor);
   text-decoration-line: var(--pf-v6-c-banner--link--TextDecoration);
 }
 .pf-v6-c-banner .pf-v6-c-button.pf-m-inline:disabled, .pf-v6-c-banner .pf-v6-c-button.pf-m-inline.pf-m-disabled {

package/components/Banner/banner.scss

@@ -22,7 +22,9 @@
   --#{$banner}--link--Color: var(--#{$banner}--Color);
   --#{$banner}--link--TextDecoration: underline;
   --#{$banner}--link--hover--Color: var(--#{$banner}--Color);
+  --#{$banner}--link--clicked--Color: var(--#{$banner}--Color);
   --#{$banner}--link--disabled--Color: var(--pf-t--global--text--color--disabled);
+  --#{$banner}--link--TextDecorationColor: currentcolor;
 
   // modifier variables
   --#{$banner}--m-sticky--ZIndex: var(--pf-t--global--z-index--md);
@@ -154,6 +156,7 @@
   a {
     color: var(--#{$banner}--link--Color);
     text-decoration-line: var(--#{$banner}--link--TextDecoration);
+    text-decoration-color: var(--#{$banner}--a--TextDecorationColor);
 
     &:hover:not(.pf-m-disabled) {
       --#{$banner}--link--Color: var(--#{$banner}--link--hover--Color);
@@ -171,7 +174,11 @@
   .#{$button}.pf-m-inline {
     --#{$button}--m-link--m-inline--Color: var(--#{$banner}--link--Color);
     --#{$button}--m-link--m-inline--hover--Color: var(--#{$banner}--link--hover--Color);
+    --#{$button}--m-link--m-inline--m-clicked--Color: var(--#{$banner}--link--clicked--Color);
     --#{$button}--disabled--Color: var(--#{$banner}--link--disabled--Color);
+    --#{$button}--m-link--m-inline--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
+    --#{$button}--m-link--m-inline--hover--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
+    --#{$button}--m-link--m-inline--m-clicked--TextDecorationColor: var(--#{$banner}--link--TextDecorationColor);
 
     text-decoration-line: var(--#{$banner}--link--TextDecoration);
 

package/components/Breadcrumb/breadcrumb.css

@@ -18,9 +18,9 @@
   --pf-v6-c-breadcrumb__link--m-current--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-breadcrumb__link--BackgroundColor: transparent;
   --pf-v6-c-breadcrumb__heading--FontSize: var(--pf-v6-c-breadcrumb__item--FontSize);
-  --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --pf-v6-c-breadcrumb__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --pf-v6-c-breadcrumb__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
-  --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --pf-v6-c-breadcrumb__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --pf-v6-c-breadcrumb__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
 }
 
@@ -68,7 +68,7 @@
   font-weight: var(--pf-v6-c-breadcrumb__link--FontWeight);
   line-height: inherit;
   color: var(--pf-v6-c-breadcrumb__link--Color);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
   text-decoration-line: var(--pf-v6-c-breadcrumb__link--TextDecorationLine);
   text-decoration-style: var(--pf-v6-c-breadcrumb__link--TextDecorationStyle);
   text-decoration-color: var(--pf-v6-c-breadcrumb__link--TextDecorationColor);

package/components/Breadcrumb/breadcrumb.scss

@@ -29,9 +29,9 @@
   --#{$breadcrumb}__heading--FontSize: var(--#{$breadcrumb}__item--FontSize);
 
   // breadcrumb dropdown
-  --#{$breadcrumb}__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --#{$breadcrumb}__menu-toggle--MarginBlockStart: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --#{$breadcrumb}__menu-toggle--MarginInlineEnd: var(--pf-t--global--spacer--xs);
-  --#{$breadcrumb}__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
+  --#{$breadcrumb}__menu-toggle--MarginBlockEnd: calc(var(--pf-t--global--spacer--control--vertical--plain) * -1);
   --#{$breadcrumb}__menu-toggle--MarginInlineStart: var(--pf-t--global--spacer--xs);
 }
 
@@ -83,7 +83,7 @@
   font-weight: var(--#{$breadcrumb}__link--FontWeight);
   line-height: inherit;
   color: var(--#{$breadcrumb}__link--Color);
-  overflow-wrap: break-word;
+  overflow-wrap: anywhere;
   text-decoration-line: var(--#{$breadcrumb}__link--TextDecorationLine);
   text-decoration-style: var(--#{$breadcrumb}__link--TextDecorationStyle);
   text-decoration-color: var(--#{$breadcrumb}__link--TextDecorationColor);

package/components/Button/button.css

@@ -126,6 +126,10 @@
   --pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
   --pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
   --pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor: var(--pf-t--global--text-decoration--color--hover);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine: var(--pf-t--global--text-decoration--link--line--hover);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle: var(--pf-t--global--text-decoration--link--style--hover);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset: var(--pf-t--global--text-decoration--offset--hover);
   --pf-v6-c-button--m-link--m-inline--TransitionProperty: color, text-underline-offset;
   --pf-v6-c-button--m-link--m-inline--TransitionDuration: var(--pf-t--global--motion--duration--fade--default), var(--pf-t--global--motion--duration--lg);
   --pf-v6-c-button--m-link--m-inline--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--accelerate), var(--pf-t--global--motion--timing-function--default);
@@ -140,6 +144,8 @@
   --pf-v6-c-button--m-link--m-inline__icon--Color: var(--pf-t--global--icon--color--brand--default);
   --pf-v6-c-button--m-link--m-inline--hover--Color: var(--pf-t--global--text--color--brand--hover);
   --pf-v6-c-button--m-link--m-inline--hover__icon--Color: var(--pf-t--global--icon--color--brand--hover);
+  --pf-v6-c-button--m-link--m-inline--m-clicked--Color: var(--pf-t--global--text--color--brand--clicked);
+  --pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color: var(--pf-t--global--icon--color--brand--clicked);
   --pf-v6-c-button--m-plain--BorderRadius: var(--pf-t--global--border--radius--action--plain--default);
   --pf-v6-c-button--m-plain--PaddingInlineEnd: var(--pf-t--global--spacer--action--horizontal--plain--default);
   --pf-v6-c-button--m-plain--PaddingInlineStart: var(--pf-t--global--spacer--action--horizontal--plain--default);
@@ -512,9 +518,14 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
   --pf-v6-c-button--hover--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationLine);
   --pf-v6-c-button--hover--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationStyle);
   --pf-v6-c-button--hover--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--hover--TextDecorationColor);
-  --pf-v6-c-button--hover--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--TextUnderlineOffset);
+  --pf-v6-c-button--m-clicked--TextDecorationLine: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationLine);
+  --pf-v6-c-button--m-clicked--TextDecorationStyle: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationStyle);
+  --pf-v6-c-button--m-clicked--TextDecorationColor: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextDecorationColor);
+  --pf-v6-c-button--m-clicked--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
   --pf-v6-c-button--m-link--hover--Color: var(--pf-v6-c-button--m-link--m-inline--hover--Color);
   --pf-v6-c-button--m-link--hover__icon--Color: var(--pf-v6-c-button--m-link--m-inline--hover__icon--Color);
+  --pf-v6-c-button--m-link--m-clicked--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked--Color);
+  --pf-v6-c-button--m-link--m-clicked__icon--Color: var(--pf-v6-c-button--m-link--m-inline--m-clicked__icon--Color);
   --pf-v6-c-button--BorderWidth: 0;
   --pf-v6-c-button--hover--BorderWidth: 0;
   --pf-v6-c-button--m-clicked--BorderWidth: 0;
@@ -527,6 +538,9 @@ span.pf-v6-c-button.pf-m-link.pf-m-inline {
 .pf-v6-c-button.pf-m-link.pf-m-inline:hover, .pf-v6-c-button.pf-m-link.pf-m-inline:focus {
   --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--hover--TextUnderlineOffset);
 }
+.pf-v6-c-button.pf-m-link.pf-m-inline:active, .pf-v6-c-button.pf-m-link.pf-m-inline.pf-m-clicked {
+  --pf-v6-c-button--m-link--m-inline--TextUnderlineOffset: var(--pf-v6-c-button--m-link--m-inline--m-clicked--TextUnderlineOffset);
+}
 .pf-v6-c-button.pf-m-link.pf-m-danger {
   --pf-v6-c-button--m-danger--Color: var(--pf-v6-c-button--m-link--m-danger--Color);
   --pf-v6-c-button--m-danger--BackgroundColor: var(--pf-v6-c-button--m-link--m-danger--BackgroundColor);