@patternfly/react-styles 6.5.1 → 6.6.0-prerelease.2

package/css/components/Popover/popover.css

@@ -199,7 +199,7 @@
 }
 
 .pf-v6-c-popover__body {
-  word-wrap: break-word;
+  overflow-wrap: break-word;
 }
 
 .pf-v6-c-popover__footer {

package/css/components/Progress/progress.css

@@ -36,7 +36,7 @@
   display: grid;
   grid-template-rows: 1fr auto;
   grid-template-columns: auto auto;
-  grid-gap: var(--pf-v6-c-progress--GridGap);
+  gap: var(--pf-v6-c-progress--GridGap);
   align-items: end;
 }
 .pf-v6-c-progress.pf-m-sm {
@@ -130,7 +130,7 @@
 
 .pf-v6-c-progress__description {
   grid-column: 1/2;
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 .pf-v6-c-progress__description.pf-m-truncate {
   overflow: hidden;
@@ -146,7 +146,7 @@
   align-items: flex-start;
   justify-content: flex-end;
   text-align: end;
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 
 .pf-v6-c-progress__status-icon {

package/css/components/ProgressStepper/progress-stepper.css

@@ -205,9 +205,9 @@
   inset-block-start: 0;
   inset-inline-start: 0;
   overflow: hidden;
-  clip: rect(0, 0, 0, 0);
   white-space: nowrap;
   border: 0;
+  clip-path: inset(50%);
 }
 .pf-v6-c-progress-stepper.pf-m-compact .pf-v6-c-progress-stepper__step.pf-m-current .pf-v6-c-progress-stepper__step-main {
   grid-row: 1/2;

package/css/components/Radio/radio.css

@@ -18,7 +18,7 @@
 .pf-v6-c-radio {
   display: grid;
   grid-template-columns: auto 1fr;
-  grid-gap: var(--pf-v6-c-radio--GridGap);
+  gap: var(--pf-v6-c-radio--GridGap);
   align-items: baseline;
   accent-color: var(--pf-v6-c-radio--AccentColor);
 }

package/css/components/Sidebar/sidebar.css

@@ -168,6 +168,9 @@
   --pf-v6-c-sidebar__panel--Position: static;
   --pf-v6-c-sidebar__panel--InsetBlockStart: auto;
 }
+.pf-v6-c-sidebar__panel.pf-m-no-background, :where(:root:not(.pf-v6-theme-glass)) .pf-v6-c-sidebar__panel.pf-m-plain, :where(:root.pf-v6-theme-glass) .pf-v6-c-sidebar__panel:not(.pf-m-no-plain-on-glass) {
+  --pf-v6-c-sidebar__panel--BackgroundColor: transparent;
+}
 .pf-v6-c-sidebar__panel.pf-m-secondary {
   --pf-v6-c-sidebar__panel--BackgroundColor: var(--pf-v6-c-sidebar__panel--m-secondary--BackgroundColor);
 }
@@ -187,7 +190,7 @@
   --pf-v6-c-sidebar__content--PaddingBlockEnd: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockEnd);
   --pf-v6-c-sidebar__content--PaddingInlineStart: var(--pf-v6-c-sidebar__content--m-padding--PaddingBlockStart);
 }
-.pf-v6-c-sidebar__content.pf-m-no-background {
+.pf-v6-c-sidebar__content.pf-m-no-background, :where(:root:not(.pf-v6-theme-glass)) .pf-v6-c-sidebar__content.pf-m-plain, :where(:root.pf-v6-theme-glass) .pf-v6-c-sidebar__content:not(.pf-m-no-plain-on-glass) {
   --pf-v6-c-sidebar__content--BackgroundColor: transparent;
 }
 .pf-v6-c-sidebar__content.pf-m-secondary {
@@ -200,12 +203,6 @@
   --pf-v6-c-sidebar__content--Order: -1;
 }
 
-.pf-v6-c-sidebar.pf-m-no-background,
-.pf-v6-c-sidebar__panel.pf-m-no-background,
-.pf-v6-c-sidebar__content.pf-m-no-background {
-  background-color: transparent;
-}
-
 .pf-v6-c-sidebar__panel.pf-m-width-default {
   --pf-v6-c-sidebar__panel--FlexBasis: var(--pf-v6-c-sidebar__panel--FlexBasis--base);
 }

package/css/components/Sidebar/sidebar.d.ts

@@ -9,8 +9,10 @@ declare const _default: {
     "padding": "pf-m-padding",
     "sticky": "pf-m-sticky",
     "static": "pf-m-static",
-    "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
+    "secondary": "pf-m-secondary",
     "widthDefault": "pf-m-width-default",
     "width_25": "pf-m-width-25",
     "width_33": "pf-m-width-33",
@@ -57,6 +59,7 @@ declare const _default: {
   "sidebar": "pf-v6-c-sidebar",
   "sidebarContent": "pf-v6-c-sidebar__content",
   "sidebarMain": "pf-v6-c-sidebar__main",
-  "sidebarPanel": "pf-v6-c-sidebar__panel"
+  "sidebarPanel": "pf-v6-c-sidebar__panel",
+  "themeGlass": "pf-v6-theme-glass"
 };
 export default _default;

package/css/components/Sidebar/sidebar.js

@@ -11,8 +11,10 @@ exports.default = {
     "padding": "pf-m-padding",
     "sticky": "pf-m-sticky",
     "static": "pf-m-static",
-    "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
+    "secondary": "pf-m-secondary",
     "widthDefault": "pf-m-width-default",
     "width_25": "pf-m-width-25",
     "width_33": "pf-m-width-33",
@@ -59,5 +61,6 @@ exports.default = {
   "sidebar": "pf-v6-c-sidebar",
   "sidebarContent": "pf-v6-c-sidebar__content",
   "sidebarMain": "pf-v6-c-sidebar__main",
-  "sidebarPanel": "pf-v6-c-sidebar__panel"
+  "sidebarPanel": "pf-v6-c-sidebar__panel",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Sidebar/sidebar.mjs

@@ -9,8 +9,10 @@ export default {
     "padding": "pf-m-padding",
     "sticky": "pf-m-sticky",
     "static": "pf-m-static",
-    "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
+    "secondary": "pf-m-secondary",
     "widthDefault": "pf-m-width-default",
     "width_25": "pf-m-width-25",
     "width_33": "pf-m-width-33",
@@ -57,5 +59,6 @@ export default {
   "sidebar": "pf-v6-c-sidebar",
   "sidebarContent": "pf-v6-c-sidebar__content",
   "sidebarMain": "pf-v6-c-sidebar__main",
-  "sidebarPanel": "pf-v6-c-sidebar__panel"
+  "sidebarPanel": "pf-v6-c-sidebar__panel",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Spinner/spinner.css

@@ -49,10 +49,10 @@
   width: 100%;
   height: 100%;
   stroke: var(--pf-v6-c-spinner--Color);
+  stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
+  stroke-linecap: round;
   stroke-dasharray: 283;
   stroke-dashoffset: 280;
-  stroke-linecap: round;
-  stroke-width: var(--pf-v6-c-spinner--StrokeWidth);
   transform-origin: 50% 50%;
   animation: pf-v6-c-spinner-animation-dash var(--pf-v6-c-spinner--AnimationDuration) var(--pf-v6-c-spinner__path--AnimationTimingFunction) infinite;
 }

package/css/components/Switch/switch.css

@@ -128,8 +128,8 @@
   background-color: var(--pf-v6-c-switch__input--not-checked__toggle--before--BackgroundColor);
   border: var(--pf-v6-c-switch__toggle--before--BorderWidth) solid transparent;
   border-radius: var(--pf-v6-c-switch__toggle--before--BorderRadius);
-  transition: var(--pf-v6-c-switch__toggle--before--Transition);
   transform: translateY(-50%);
+  transition: var(--pf-v6-c-switch__toggle--before--Transition);
 }
 .pf-v6-c-switch__toggle::after {
   position: absolute;

package/css/components/Table/table-tree-view.css

@@ -134,8 +134,8 @@
 }
 .pf-m-tree-view-grid.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr) {
   position: relative;
-  border: none;
   outline-offset: var(--pf-v6-c-table--m-tree-view-grid--tr--OutlineOffset);
+  border: none;
 }
 .pf-m-tree-view-grid.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr)::before {
   position: absolute;
@@ -173,7 +173,7 @@
 .pf-m-tree-view-grid.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] {
   grid-template-columns: var(--pf-v6-c-table--m-tree-view-grid__td--data-label--GridTemplateColumns);
   grid-column: 1;
-  grid-column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
+  column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
   align-items: start;
 }
 .pf-m-tree-view-grid.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] > :where(th, td) {
@@ -276,8 +276,8 @@
   }
   .pf-m-tree-view-grid-md.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr) {
     position: relative;
-    border: none;
     outline-offset: var(--pf-v6-c-table--m-tree-view-grid--tr--OutlineOffset);
+    border: none;
   }
   .pf-m-tree-view-grid-md.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr)::before {
     position: absolute;
@@ -315,7 +315,7 @@
   .pf-m-tree-view-grid-md.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] {
     grid-template-columns: var(--pf-v6-c-table--m-tree-view-grid__td--data-label--GridTemplateColumns);
     grid-column: 1;
-    grid-column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
+    column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
     align-items: start;
   }
   .pf-m-tree-view-grid-md.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] > :where(th, td) {
@@ -419,8 +419,8 @@
   }
   .pf-m-tree-view-grid-lg.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr) {
     position: relative;
-    border: none;
     outline-offset: var(--pf-v6-c-table--m-tree-view-grid--tr--OutlineOffset);
+    border: none;
   }
   .pf-m-tree-view-grid-lg.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr)::before {
     position: absolute;
@@ -458,7 +458,7 @@
   .pf-m-tree-view-grid-lg.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] {
     grid-template-columns: var(--pf-v6-c-table--m-tree-view-grid__td--data-label--GridTemplateColumns);
     grid-column: 1;
-    grid-column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
+    column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
     align-items: start;
   }
   .pf-m-tree-view-grid-lg.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] > :where(th, td) {
@@ -562,8 +562,8 @@
   }
   .pf-m-tree-view-grid-xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr) {
     position: relative;
-    border: none;
     outline-offset: var(--pf-v6-c-table--m-tree-view-grid--tr--OutlineOffset);
+    border: none;
   }
   .pf-m-tree-view-grid-xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr)::before {
     position: absolute;
@@ -601,7 +601,7 @@
   .pf-m-tree-view-grid-xl.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] {
     grid-template-columns: var(--pf-v6-c-table--m-tree-view-grid__td--data-label--GridTemplateColumns);
     grid-column: 1;
-    grid-column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
+    column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
     align-items: start;
   }
   .pf-m-tree-view-grid-xl.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] > :where(th, td) {
@@ -705,8 +705,8 @@
   }
   .pf-m-tree-view-grid-2xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr) {
     position: relative;
-    border: none;
     outline-offset: var(--pf-v6-c-table--m-tree-view-grid--tr--OutlineOffset);
+    border: none;
   }
   .pf-m-tree-view-grid-2xl.pf-v6-c-table tbody:where(.pf-v6-c-table__tbody) tr:where(.pf-v6-c-table__tr)::before {
     position: absolute;
@@ -744,7 +744,7 @@
   .pf-m-tree-view-grid-2xl.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] {
     grid-template-columns: var(--pf-v6-c-table--m-tree-view-grid__td--data-label--GridTemplateColumns);
     grid-column: 1;
-    grid-column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
+    column-gap: var(--pf-v6-c-table--m-tree-view-grid__tbody--cell--GridColumnGap);
     align-items: start;
   }
   .pf-m-tree-view-grid-2xl.pf-v6-c-table td:where(.pf-v6-c-table__td)[data-label] > :where(th, td) {

package/css/components/Table/table.css

@@ -175,6 +175,8 @@
   --pf-v6-c-table--m-sticky-header--BoxShadow--glass: var(--pf-t--global--box-shadow--sm);
   --pf-v6-c-table--m-sticky-header--TransitionTimingFunction--BackgroundColor: var(--pf-t--global--motion--timing-function--default);
   --pf-v6-c-table--m-sticky-header--TransitionDuration--BackgroundColor: var(--pf-t--global--motion--duration--fade--default);
+  --pf-v6-c-table--m-sticky-footer--ZIndex: calc(var(--pf-t--global--z-index--xs) + 1);
+  --pf-v6-c-table--m-sticky-footer--border--ZIndex: calc(var(--pf-t--global--z-index--xs) + 2);
 }
 :where(.pf-v6-theme-glass) .pf-v6-c-table {
   --pf-v6-c-table--m-sticky-header--BorderBlockEndWidth: 0;
@@ -244,6 +246,26 @@
 .pf-v6-c-table:not(.pf-m-sticky-header) > .pf-m-nested-column-header tr:where(.pf-v6-c-table__tr):not(:last-child) td:where(.pf-v6-c-table__td):not([rowspan]) {
   --pf-v6-c-table--cell--PaddingBlockEnd: var(--pf-v6-c-table__thead--m-nested-column-header__tr--PaddingBlockEnd);
 }
+.pf-v6-c-table.pf-m-sticky-footer > .pf-v6-c-table__tfoot {
+  position: sticky;
+  inset-block-end: 0;
+  z-index: var(--pf-v6-c-table--m-sticky-footer--ZIndex);
+  background: var(--pf-v6-c-table--BackgroundColor);
+}
+.pf-v6-c-table.pf-m-sticky-footer > .pf-v6-c-table__tfoot::before {
+  position: absolute;
+  inset: 0;
+  z-index: var(--pf-v6-c-table--m-sticky-footer--border--ZIndex);
+  pointer-events: none;
+  content: "";
+  border-block-start: var(--pf-v6-c-table--border-width--base) solid var(--pf-v6-c-table--BorderColor);
+}
+.pf-v6-c-table.pf-m-sticky-footer > .pf-v6-c-table__tbody:last-of-type > .pf-v6-c-table__tr:last-of-type {
+  border-block-end: 0;
+}
+.pf-v6-c-table.pf-m-plain {
+  --pf-v6-c-table--BackgroundColor: transparent;
+}
 .pf-v6-c-table.pf-m-striped:not(.pf-m-expandable) > tbody:where(.pf-v6-c-table__tbody) > tr:where(.pf-v6-c-table__tr):nth-child(odd), .pf-v6-c-table.pf-m-striped.pf-m-expandable > tbody:where(.pf-v6-c-table__tbody):nth-of-type(odd) > tr:where(.pf-v6-c-table__tr),
 .pf-v6-c-table > .pf-m-striped > tr:nth-child(odd),
 .pf-v6-c-table > .pf-m-striped-even > tr:nth-child(even),
@@ -314,11 +336,11 @@
   padding-inline-start: var(--pf-v6-c-table--cell--PaddingInlineStart);
   padding-inline-end: var(--pf-v6-c-table--cell--PaddingInlineEnd);
   overflow: var(--pf-v6-c-table--cell--Overflow);
+  text-overflow: var(--pf-v6-c-table--cell--TextOverflow);
   font-size: var(--pf-v6-c-table--cell--FontSize);
   font-weight: var(--pf-v6-c-table--cell--FontWeight);
   line-height: var(--pf-v6-c-table--cell--LineHeight);
   color: var(--pf-v6-c-table--cell--Color);
-  text-overflow: var(--pf-v6-c-table--cell--TextOverflow);
   word-break: var(--pf-v6-c-table--cell--WordBreak);
   white-space: var(--pf-v6-c-table--cell--WhiteSpace);
 }
@@ -424,24 +446,24 @@
 }
 .pf-v6-c-table tr:where(.pf-v6-c-table__tr).pf-m-clickable {
   cursor: pointer;
-  background-color: var(--pf-v6-c-table__tr--m-clickable--BackgroundColor);
   outline-offset: var(--pf-v6-c-table__tr--m-clickable--OutlineOffset);
+  background-color: var(--pf-v6-c-table__tr--m-clickable--BackgroundColor);
 }
 .pf-v6-c-table tr:where(.pf-v6-c-table__tr).pf-m-clickable:is(:hover, :focus) {
   --pf-v6-c-table__tr--m-clickable--BackgroundColor: var(--pf-v6-c-table__tr--m-clickable--hover--BackgroundColor);
 }
 .pf-v6-c-table tr:where(.pf-v6-c-table__tr).pf-m-selected {
   position: relative;
-  background-color: var(--pf-v6-c-table__tr--m-selected--BackgroundColor);
   outline-offset: var(--pf-v6-c-table__tr--m-selected--OutlineOffset);
+  background-color: var(--pf-v6-c-table__tr--m-selected--BackgroundColor);
 }
 .pf-v6-c-table tr:where(.pf-v6-c-table__tr).pf-m-first-cell-offset-reset > :first-child {
   padding-inline-start: var(--pf-v6-c-table__tr--m-first-cell-offset-reset--cell--PaddingInlineStart);
 }
 .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-clickable {
   cursor: pointer;
-  background-color: var(--pf-v6-c-table__tbody--m-clickable--BackgroundColor);
   outline-offset: var(--pf-v6-c-table__tbody--m-clickable--OutlineOffset);
+  background-color: var(--pf-v6-c-table__tbody--m-clickable--BackgroundColor);
 }
 .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-clickable:is(:hover, :focus) {
   --pf-v6-c-table__tbody--m-clickable--BackgroundColor: var(--pf-v6-c-table__tbody--m-clickable--hover--BackgroundColor);
@@ -450,8 +472,8 @@
   --pf-v6-c-table__tbody--m-clickable--BackgroundColor: var(--pf-v6-c-table__tbody--m-clickable--m-expanded--BackgroundColor);
 }
 .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-selected {
-  background-color: var(--pf-v6-c-table__tbody--m-selected--BackgroundColor);
   outline-offset: var(--pf-v6-c-table__tbody--m-selected--OutlineOffset);
+  background-color: var(--pf-v6-c-table__tbody--m-selected--BackgroundColor);
 }
 .pf-v6-c-table tbody:where(.pf-v6-c-table__tbody).pf-m-selected .pf-v6-c-table__tr.pf-m-expanded:not(.pf-v6-c-table__expandable-row) {
   border: none;
@@ -476,11 +498,11 @@
   display: var(--pf-v6-c-table__expandable-row--Display, revert);
   visibility: hidden;
   opacity: var(--pf-v6-c-table__expandable-row--Opacity);
+  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
   transition-delay: 0s, 0s, var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade);
   transition-timing-function: var(--pf-v6-c-table__expandable-row--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--collapse--slide), 0s, 0s;
   transition-property: opacity, translate, visibility, background-color;
-  translate: 0 var(--pf-v6-c-table__expandable-row--TranslateY);
 }
 .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row[hidden] {
   display: var(--pf-v6-c-table__expandable-row--Display, revert);
@@ -488,9 +510,9 @@
 .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row.pf-m-expanded {
   visibility: visible;
   opacity: var(--pf-v6-c-table__tbody--m-expanded__expandable-row--Opacity);
+  translate: 0 var(--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY);
   transition-delay: 0s;
   transition-duration: var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--fade), var(--pf-v6-c-table__expandable-row--TransitionDuration--expand--slide), 0s, 0s;
-  translate: 0 var(--pf-v6-c-table__tbody--m-expanded__expandable-row--TranslateY);
 }
 .pf-v6-c-table.pf-m-animate-expand > .pf-v6-c-table__tbody > .pf-v6-c-table__expandable-row.pf-m-expanded > :is(.pf-v6-c-table__td, .pf-v6-c-table__th) > .pf-v6-c-table__expandable-row-content {
   max-height: 99999px;
@@ -556,8 +578,8 @@
   min-width: var(--pf-v6-c-table__text--MinWidth);
   max-width: var(--pf-v6-c-table--cell--MaxWidth);
   overflow: var(--pf-v6-c-table--cell--Overflow);
-  line-height: var(--pf-v6-c-table--cell--LineHeight);
   text-overflow: var(--pf-v6-c-table--cell--TextOverflow);
+  line-height: var(--pf-v6-c-table--cell--LineHeight);
   word-break: var(--pf-v6-c-table--cell--WordBreak);
   white-space: var(--pf-v6-c-table--cell--WhiteSpace);
 }
@@ -586,10 +608,10 @@
   text-align: start;
   white-space: inherit;
   user-select: text;
+  outline-offset: var(--pf-v6-c-table__button--OutlineOffset);
   background-color: var(--pf-v6-c-table__button--BackgroundColor);
   border: 0;
   border-radius: var(--pf-v6-c-table__button--BorderRadius);
-  outline-offset: var(--pf-v6-c-table__button--OutlineOffset);
 }
 .pf-v6-c-table__button::after {
   position: absolute;
@@ -683,10 +705,10 @@
 }
 
 .pf-v6-c-table__toggle .pf-v6-c-table__toggle-icon {
+  transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
   transition-timing-function: var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-table__toggle--c-button__toggle-icon--TransitionDuration);
   transition-property: transform;
-  transform: rotate(var(--pf-v6-c-table__toggle--c-button__toggle-icon--Rotate));
 }
 .pf-v6-c-table__toggle svg {
   pointer-events: none;
@@ -978,6 +1000,11 @@ thead .pf-v6-c-table__check .pf-v6-c-radio.pf-m-standalone {
   border-block-end: var(--pf-v6-c-table--border-width--base) solid var(--pf-v6-c-table--BorderColor);
 }
 
+.pf-v6-c-table__tfoot {
+  --pf-v6-c-table__tr--BorderBlockEndWidth: 0;
+  vertical-align: top;
+}
+
 .pf-v6-c-table__icon-inline {
   display: flex;
   align-items: center;

package/css/components/Table/table.d.ts

@@ -11,6 +11,7 @@ declare const _default: {
     "stickyHeader": "pf-m-sticky-header",
     "stickyHeaderStuck": "pf-m-sticky-header-stuck",
     "nestedColumnHeader": "pf-m-nested-column-header",
+    "stickyFooter": "pf-m-sticky-footer",
     "striped": "pf-m-striped",
     "expandable": "pf-m-expandable",
     "stripedEven": "pf-m-striped-even",
@@ -91,6 +92,7 @@ declare const _default: {
   "tableTbody": "pf-v6-c-table__tbody",
   "tableTd": "pf-v6-c-table__td",
   "tableText": "pf-v6-c-table__text",
+  "tableTfoot": "pf-v6-c-table__tfoot",
   "tableTh": "pf-v6-c-table__th",
   "tableThead": "pf-v6-c-table__thead",
   "tableToggle": "pf-v6-c-table__toggle",

package/css/components/Table/table.js

@@ -13,6 +13,7 @@ exports.default = {
     "stickyHeader": "pf-m-sticky-header",
     "stickyHeaderStuck": "pf-m-sticky-header-stuck",
     "nestedColumnHeader": "pf-m-nested-column-header",
+    "stickyFooter": "pf-m-sticky-footer",
     "striped": "pf-m-striped",
     "expandable": "pf-m-expandable",
     "stripedEven": "pf-m-striped-even",
@@ -93,6 +94,7 @@ exports.default = {
   "tableTbody": "pf-v6-c-table__tbody",
   "tableTd": "pf-v6-c-table__td",
   "tableText": "pf-v6-c-table__text",
+  "tableTfoot": "pf-v6-c-table__tfoot",
   "tableTh": "pf-v6-c-table__th",
   "tableThead": "pf-v6-c-table__thead",
   "tableToggle": "pf-v6-c-table__toggle",

package/css/components/Table/table.mjs

@@ -11,6 +11,7 @@ export default {
     "stickyHeader": "pf-m-sticky-header",
     "stickyHeaderStuck": "pf-m-sticky-header-stuck",
     "nestedColumnHeader": "pf-m-nested-column-header",
+    "stickyFooter": "pf-m-sticky-footer",
     "striped": "pf-m-striped",
     "expandable": "pf-m-expandable",
     "stripedEven": "pf-m-striped-even",
@@ -91,6 +92,7 @@ export default {
   "tableTbody": "pf-v6-c-table__tbody",
   "tableTd": "pf-v6-c-table__td",
   "tableText": "pf-v6-c-table__text",
+  "tableTfoot": "pf-v6-c-table__tfoot",
   "tableTh": "pf-v6-c-table__th",
   "tableThead": "pf-v6-c-table__thead",
   "tableToggle": "pf-v6-c-table__toggle",

package/css/components/Tabs/tabs.css

@@ -475,8 +475,8 @@
 
 .pf-v6-c-tabs__toggle-icon {
   display: inline-block;
-  transition: var(--pf-v6-c-tabs__toggle-icon--Transition);
   transform: rotate(var(--pf-v6-c-tabs__toggle-icon--Rotate));
+  transition: var(--pf-v6-c-tabs__toggle-icon--Transition);
 }
 
 .pf-v6-c-tabs__list::-webkit-scrollbar {
@@ -640,8 +640,8 @@
   align-self: end;
   font-size: var(--pf-v6-c-tabs__link-toggle-icon--FontSize);
   color: var(--pf-v6-c-tabs__link-toggle-icon--Color);
-  transition: var(--pf-v6-c-tabs__link-toggle-icon--Transition);
   transform: rotate(var(--pf-v6-c-tabs__link-toggle-icon--Rotate));
+  transition: var(--pf-v6-c-tabs__link-toggle-icon--Transition);
 }
 
 .pf-v6-c-tabs__item-action {
@@ -904,10 +904,10 @@
     border: 0 solid var(--pf-v6-c-tabs--link-accent--color);
     border-block-end-width: var(--pf-v6-c-tabs--link-accent--BorderBlockEndWidth);
     border-inline-start-width: var(--pf-v6-c-tabs--link-accent--BorderInlineStartWidth);
+    transform-origin: var(--pf-v6-c-tabs--link-accent--TransformOrigin);
     transition-timing-function: var(--pf-v6-c-tabs--link-accent--TransitionTimingFunction);
     transition-duration: var(--pf-v6-c-tabs--link-accent--TransitionDuration);
     transition-property: width, height, translate;
-    transform-origin: var(--pf-v6-c-tabs--link-accent--TransformOrigin);
     translate: var(--pf-v6-c-tabs--link-accent--TranslateX) var(--pf-v6-c-tabs--link-accent--TranslateY);
   }
   :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-tabs.pf-m-animate-current:not(.pf-m-box) .pf-v6-c-tabs__list::after {

package/css/components/TextInputGroup/text-input-group.css

@@ -194,9 +194,9 @@
   padding-inline-start: var(--pf-v6-c-text-input-group__text-input--PaddingInlineStart);
   padding-inline-end: var(--pf-v6-c-text-input-group__text-input--PaddingInlineEnd);
   color: var(--pf-v6-c-text-input-group__text-input--Color);
+  outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
   background-color: var(--pf-v6-c-text-input-group__text-input--BackgroundColor);
   border: 0;
-  outline-offset: var(--pf-v6-c-text-input-group__text-input--OutlineOffset);
 }
 .pf-v6-c-text-input-group__text-input, .pf-v6-c-text-input-group__text-input.pf-m-hint {
   grid-area: text-input;

package/css/components/Title/title.css

@@ -41,7 +41,7 @@
 
 .pf-v6-c-title {
   font-family: var(--pf-v6-c-title--FontFamily);
-  word-break: break-word;
+  overflow-wrap: break-word;
 }
 .pf-v6-c-title.pf-m-4xl {
   font-size: var(--pf-v6-c-title--m-4xl--FontSize);

package/css/components/Toolbar/toolbar.css

@@ -558,10 +558,10 @@
 
 .pf-v6-c-toolbar__expand-all-icon {
   display: inline-flex;
+  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
   transition-timing-function: var(--pf-v6-c-toolbar__expand-all-icon--TransitionTimingFunction);
   transition-duration: var(--pf-v6-c-toolbar__expand-all-icon--TransitionDuration);
   transition-property: transform;
-  transform: rotate(var(--pf-v6-c-toolbar__expand-all-icon--Rotate));
 }
 :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-toolbar__expand-all-icon {
   scale: -1 1;

package/css/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/css/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/css/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 {