@patternfly/patternfly 6.6.0-prerelease.1 → 6.6.0-prerelease.11

package/components/Toolbar/toolbar.scss

@@ -391,10 +391,10 @@ $pf-v6--include-toolbar-breakpoints: true !default;
 // - Toolbar expand all
 .#{$toolbar}__expand-all-icon {
   display: inline-flex;
+  transform: rotate(var(--#{$toolbar}__expand-all-icon--Rotate));
   transition-timing-function: var(--#{$toolbar}__expand-all-icon--TransitionTimingFunction);
   transition-duration: var(--#{$toolbar}__expand-all-icon--TransitionDuration);
   transition-property: transform;
-  transform: rotate(var(--#{$toolbar}__expand-all-icon--Rotate));
 
   @include pf-v6-mirror-inline-on-rtl; // - TODO: mirror this icon in breaking change
 }

package/components/Tooltip/tooltip.css

@@ -98,7 +98,7 @@
   font-size: var(--pf-v6-c-tooltip__content--FontSize);
   color: var(--pf-v6-c-tooltip__content--Color);
   text-align: center;
-  word-break: break-word;
+  overflow-wrap: break-word;
   background-color: var(--pf-v6-c-tooltip__content--BackgroundColor);
   border-radius: var(--pf-v6-c-tooltip__content--BorderRadius);
 }

package/components/Tooltip/tooltip.scss

@@ -129,7 +129,7 @@
   font-size: var(--#{$tooltip}__content--FontSize);
   color: var(--#{$tooltip}__content--Color);
   text-align: center;
-  word-break: break-word;
+  overflow-wrap: break-word;
   background-color: var(--#{$tooltip}__content--BackgroundColor);
   border-radius: var(--#{$tooltip}__content--BorderRadius);
 
@@ -140,7 +140,7 @@
 
 .#{$tooltip}__arrow {
   position: absolute;
-  // stylelint-disable liberty/use-logical-spec
+  // stylelint-disable property-layout-mappings
   top: var(--#{$tooltip}__arrow--InsetBlockStart, auto);
   right: var(--#{$tooltip}__arrow--InsetInlineEnd, auto);
   bottom: var(--#{$tooltip}__arrow--InsetBlockEnd, auto);

package/components/TreeView/tree-view.css

@@ -267,19 +267,19 @@
   display: inline-block;
   min-width: var(--pf-v6-c-tree-view__node-toggle-icon--MinWidth);
   text-align: center;
-  transition: transform var(--pf-v6-c-tree-view__node-toggle-icon--TransitionDuration) var(--pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction);
   transform: rotate(var(--pf-v6-c-tree-view__node-toggle-icon--Rotate));
+  transition: transform var(--pf-v6-c-tree-view__node-toggle-icon--TransitionDuration) var(--pf-v6-c-tree-view__node-toggle-icon--TransitionTimingFunction);
 }
 
 .pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list {
-  max-height: 0;
   visibility: hidden;
+  max-height: 0;
   opacity: var(--pf-v6-c-tree-view__list--Opacity);
+  translate: 0 var(--pf-v6-c-tree-view__list--TranslateY);
   transition-delay: 0s, 0s, var(--pf-v6-c-tree-view__list--TransitionDuration--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--fade);
   transition-timing-function: var(--pf-v6-c-tree-view__list--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--slide), 0s, 0s;
   transition-property: opacity, translate, visibility, max-height;
-  translate: 0 var(--pf-v6-c-tree-view__list--TranslateY);
 }
 .pf-v6-c-tree-view__list-item .pf-v6-c-tree-view__list-item {
   --pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__node-toggle-icon--base--Rotate);
@@ -290,12 +290,12 @@
   --pf-v6-c-tree-view__node-toggle-icon--Rotate: var(--pf-v6-c-tree-view__list-item--m-expanded__node-toggle-icon--Rotate);
 }
 .pf-v6-c-tree-view__list-item.pf-m-expanded > .pf-v6-c-tree-view__list {
-  max-height: 99999px;
   visibility: revert;
+  max-height: 99999px;
   opacity: var(--pf-v6-c-tree-view--m-expanded__list--Opacity);
+  translate: 0 var(--pf-v6-c-tree-view--m-expanded__list--TranslateY);
   transition-delay: 0s;
   transition-duration: var(--pf-v6-c-tree-view__list--TransitionDuration--expand--fade), var(--pf-v6-c-tree-view__list--TransitionDuration--expand--slide), 0s, 0s;
-  translate: 0 var(--pf-v6-c-tree-view--m-expanded__list--TranslateY);
 }
 
 .pf-v6-c-tree-view__node,

package/components/TreeView/tree-view.scss

@@ -376,20 +376,20 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
   display: inline-block;
   min-width: var(--#{$tree-view}__node-toggle-icon--MinWidth);
   text-align: center;
-  transition: transform var(--#{$tree-view}__node-toggle-icon--TransitionDuration) var(--#{$tree-view}__node-toggle-icon--TransitionTimingFunction);
   transform: rotate(var(--#{$tree-view}__node-toggle-icon--Rotate));
+  transition: transform var(--#{$tree-view}__node-toggle-icon--TransitionDuration) var(--#{$tree-view}__node-toggle-icon--TransitionTimingFunction);
 }
 
 .#{$tree-view}__list-item {
   .#{$tree-view}__list {
-    max-height: 0;
     visibility: hidden;
+    max-height: 0;
     opacity: var(--#{$tree-view}__list--Opacity);
+    translate: 0 var(--#{$tree-view}__list--TranslateY);
     transition-delay: 0s, 0s, var(--#{$tree-view}__list--TransitionDuration--fade), var(--#{$tree-view}__list--TransitionDuration--fade);
     transition-timing-function: var(--#{$tree-view}__list--TransitionTimingFunction);
     transition-duration: var(--#{$tree-view}__list--TransitionDuration--fade), var(--#{$tree-view}__list--TransitionDuration--slide), 0s, 0s;
     transition-property: opacity, translate, visibility, max-height;
-    translate: 0 var(--#{$tree-view}__list--TranslateY);
   }
 
   .#{$tree-view}__list-item {
@@ -402,12 +402,12 @@ $pf-v6-c-tree-view--MaxNesting: 10 !default;
     --#{$tree-view}__node-toggle-icon--Rotate: var(--#{$tree-view}__list-item--m-expanded__node-toggle-icon--Rotate);
 
     > .#{$tree-view}__list {
-      max-height: 99999px;
       visibility: revert;
+      max-height: 99999px;
       opacity: var(--#{$tree-view}--m-expanded__list--Opacity);
+      translate: 0 var(--#{$tree-view}--m-expanded__list--TranslateY);
       transition-delay: 0s;
       transition-duration: var(--#{$tree-view}__list--TransitionDuration--expand--fade), var(--#{$tree-view}__list--TransitionDuration--expand--slide), 0s, 0s;
-      translate: 0 var(--#{$tree-view}--m-expanded__list--TranslateY);
     }
   }
 }

package/components/Wizard/wizard.css

@@ -196,7 +196,7 @@
 
 .pf-v6-c-wizard__title {
   padding-inline-end: var(--pf-v6-c-wizard__title--PaddingInlineEnd);
-  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .pf-v6-c-wizard__title-text {
@@ -259,7 +259,7 @@
   align-items: baseline;
   margin-block-end: var(--pf-v6-c-wizard__toggle-list-item--MarginBlockEnd);
   text-align: start;
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 .pf-v6-c-wizard__toggle-list-item:not(:last-child) {
   margin-inline-end: var(--pf-v6-c-wizard__toggle-list-item--not-last-child--MarginInlineEnd);
@@ -395,8 +395,8 @@
   padding-inline: 0;
   color: var(--pf-v6-c-wizard__nav-link--Color);
   text-align: start;
+  overflow-wrap: break-word;
   text-decoration-line: var(--pf-v6-c-wizard__nav-link--TextDecoration);
-  word-break: break-word;
   counter-increment: wizard-nav-count;
   background-color: transparent;
   border: none;
@@ -501,10 +501,10 @@
 
 .pf-v6-c-wizard__nav-link-toggle-icon {
   display: inline-block;
+  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
   transition-timing-function: var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-wizard__nav-link-toggle-icon--TransitionDuration);
   transition-property: transform;
-  transform: rotate(var(--pf-v6-c-wizard__nav-link-toggle-icon--Rotate));
 }
 
 .pf-v6-c-wizard__main {
@@ -514,7 +514,7 @@
   flex-direction: column;
   overflow-x: hidden;
   overflow-y: auto;
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 
 .pf-v6-c-wizard__main-body {

package/components/Wizard/wizard.scss

@@ -261,7 +261,7 @@
 
 .#{$wizard}__title {
   padding-inline-end: var(--#{$wizard}__title--PaddingInlineEnd);
-  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .#{$wizard}__title-text {
@@ -325,7 +325,7 @@
   align-items: baseline;
   margin-block-end: var(--#{$wizard}__toggle-list-item--MarginBlockEnd);
   text-align: start;
-  word-break: break-word;
+  overflow-wrap: break-word;
 
   &:not(:last-child) {
     margin-inline-end: var(--#{$wizard}__toggle-list-item--not-last-child--MarginInlineEnd);
@@ -478,8 +478,8 @@
   padding-inline: 0;
   color: var(--#{$wizard}__nav-link--Color);
   text-align: start; // needed for when the item is a button
+  overflow-wrap: break-word;
   text-decoration-line: var(--#{$wizard}__nav-link--TextDecoration);
-  word-break: break-word;
   counter-increment: wizard-nav-count;
   background-color: transparent;
   border: none;
@@ -601,10 +601,10 @@
   @include pf-v6-mirror-inline-on-rtl;
 
   display: inline-block;
+  transform: rotate(var(--#{$wizard}__nav-link-toggle-icon--Rotate));
   transition-timing-function: var(--#{$wizard}__nav-link-toggle-icon--TransitionTimingFunction);
   transition-duration: var(--#{$wizard}__nav-link-toggle-icon--TransitionDuration);
   transition-property: transform;
-  transform: rotate(var(--#{$wizard}__nav-link-toggle-icon--Rotate));
 }
 
 .#{$wizard}__main {
@@ -614,7 +614,7 @@
   flex-direction: column;
   overflow-x: hidden;
   overflow-y: auto;
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 
 .#{$wizard}__main-body {