@patternfly/react-styles 6.5.0-prerelease.9 → 6.5.1-prerelease.0

package/css/components/Page/page.d.ts

@@ -8,10 +8,12 @@ declare const _default: {
   "masthead": "pf-v6-c-masthead",
   "mastheadToggle": "pf-v6-c-masthead__toggle",
   "modifiers": {
-    "dock": "pf-m-dock",
+    "docked": "pf-m-docked",
     "hamburger": "pf-m-hamburger",
     "expanded": "pf-m-expanded",
     "collapsed": "pf-m-collapsed",
+    "textExpanded": "pf-m-text-expanded",
+    "vertical": "pf-m-vertical",
     "pageInsets": "pf-m-page-insets",
     "contextSelector": "pf-m-context-selector",
     "insetNone": "pf-m-inset-none",
@@ -34,7 +36,13 @@ declare const _default: {
     "stickyBottomOnXlHeight": "pf-m-sticky-bottom-on-xl-height",
     "stickyTopOn_2xlHeight": "pf-m-sticky-top-on-2xl-height",
     "stickyBottomOn_2xlHeight": "pf-m-sticky-bottom-on-2xl-height",
+    "stickyTopBase": "pf-m-sticky-top-base",
+    "stickyTopStuck": "pf-m-sticky-top-stuck",
+    "stickyBottomBase": "pf-m-sticky-bottom-base",
+    "stickyBottomStuck": "pf-m-sticky-bottom-stuck",
     "noSidebar": "pf-m-no-sidebar",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "secondary": "pf-m-secondary",
     "padding": "pf-m-padding",
     "noPadding": "pf-m-no-padding",
@@ -51,6 +59,7 @@ declare const _default: {
   },
   "page": "pf-v6-c-page",
   "pageDock": "pf-v6-c-page__dock",
+  "pageDockMain": "pf-v6-c-page__dock-main",
   "pageDrawer": "pf-v6-c-page__drawer",
   "pageMain": "pf-v6-c-page__main",
   "pageMainBody": "pf-v6-c-page__main-body",
@@ -65,6 +74,12 @@ declare const _default: {
   "pageSidebar": "pf-v6-c-page__sidebar",
   "pageSidebarBody": "pf-v6-c-page__sidebar-body",
   "pageSidebarHeader": "pf-v6-c-page__sidebar-header",
-  "pageSidebarTitle": "pf-v6-c-page__sidebar-title"
+  "pageSidebarMain": "pf-v6-c-page__sidebar-main",
+  "pageSidebarTitle": "pf-v6-c-page__sidebar-title",
+  "themeGlass": "pf-v6-theme-glass",
+  "toolbar": "pf-v6-c-toolbar",
+  "toolbarContentSection": "pf-v6-c-toolbar__content-section",
+  "toolbarGroup": "pf-v6-c-toolbar__group",
+  "toolbarItem": "pf-v6-c-toolbar__item"
 };
 export default _default;

package/css/components/Page/page.js

@@ -10,10 +10,12 @@ exports.default = {
   "masthead": "pf-v6-c-masthead",
   "mastheadToggle": "pf-v6-c-masthead__toggle",
   "modifiers": {
-    "dock": "pf-m-dock",
+    "docked": "pf-m-docked",
     "hamburger": "pf-m-hamburger",
     "expanded": "pf-m-expanded",
     "collapsed": "pf-m-collapsed",
+    "textExpanded": "pf-m-text-expanded",
+    "vertical": "pf-m-vertical",
     "pageInsets": "pf-m-page-insets",
     "contextSelector": "pf-m-context-selector",
     "insetNone": "pf-m-inset-none",
@@ -36,7 +38,13 @@ exports.default = {
     "stickyBottomOnXlHeight": "pf-m-sticky-bottom-on-xl-height",
     "stickyTopOn_2xlHeight": "pf-m-sticky-top-on-2xl-height",
     "stickyBottomOn_2xlHeight": "pf-m-sticky-bottom-on-2xl-height",
+    "stickyTopBase": "pf-m-sticky-top-base",
+    "stickyTopStuck": "pf-m-sticky-top-stuck",
+    "stickyBottomBase": "pf-m-sticky-bottom-base",
+    "stickyBottomStuck": "pf-m-sticky-bottom-stuck",
     "noSidebar": "pf-m-no-sidebar",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "secondary": "pf-m-secondary",
     "padding": "pf-m-padding",
     "noPadding": "pf-m-no-padding",
@@ -53,6 +61,7 @@ exports.default = {
   },
   "page": "pf-v6-c-page",
   "pageDock": "pf-v6-c-page__dock",
+  "pageDockMain": "pf-v6-c-page__dock-main",
   "pageDrawer": "pf-v6-c-page__drawer",
   "pageMain": "pf-v6-c-page__main",
   "pageMainBody": "pf-v6-c-page__main-body",
@@ -67,5 +76,11 @@ exports.default = {
   "pageSidebar": "pf-v6-c-page__sidebar",
   "pageSidebarBody": "pf-v6-c-page__sidebar-body",
   "pageSidebarHeader": "pf-v6-c-page__sidebar-header",
-  "pageSidebarTitle": "pf-v6-c-page__sidebar-title"
+  "pageSidebarMain": "pf-v6-c-page__sidebar-main",
+  "pageSidebarTitle": "pf-v6-c-page__sidebar-title",
+  "themeGlass": "pf-v6-theme-glass",
+  "toolbar": "pf-v6-c-toolbar",
+  "toolbarContentSection": "pf-v6-c-toolbar__content-section",
+  "toolbarGroup": "pf-v6-c-toolbar__group",
+  "toolbarItem": "pf-v6-c-toolbar__item"
 };

package/css/components/Page/page.mjs

@@ -8,10 +8,12 @@ export default {
   "masthead": "pf-v6-c-masthead",
   "mastheadToggle": "pf-v6-c-masthead__toggle",
   "modifiers": {
-    "dock": "pf-m-dock",
+    "docked": "pf-m-docked",
     "hamburger": "pf-m-hamburger",
     "expanded": "pf-m-expanded",
     "collapsed": "pf-m-collapsed",
+    "textExpanded": "pf-m-text-expanded",
+    "vertical": "pf-m-vertical",
     "pageInsets": "pf-m-page-insets",
     "contextSelector": "pf-m-context-selector",
     "insetNone": "pf-m-inset-none",
@@ -34,7 +36,13 @@ export default {
     "stickyBottomOnXlHeight": "pf-m-sticky-bottom-on-xl-height",
     "stickyTopOn_2xlHeight": "pf-m-sticky-top-on-2xl-height",
     "stickyBottomOn_2xlHeight": "pf-m-sticky-bottom-on-2xl-height",
+    "stickyTopBase": "pf-m-sticky-top-base",
+    "stickyTopStuck": "pf-m-sticky-top-stuck",
+    "stickyBottomBase": "pf-m-sticky-bottom-base",
+    "stickyBottomStuck": "pf-m-sticky-bottom-stuck",
     "noSidebar": "pf-m-no-sidebar",
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "secondary": "pf-m-secondary",
     "padding": "pf-m-padding",
     "noPadding": "pf-m-no-padding",
@@ -51,6 +59,7 @@ export default {
   },
   "page": "pf-v6-c-page",
   "pageDock": "pf-v6-c-page__dock",
+  "pageDockMain": "pf-v6-c-page__dock-main",
   "pageDrawer": "pf-v6-c-page__drawer",
   "pageMain": "pf-v6-c-page__main",
   "pageMainBody": "pf-v6-c-page__main-body",
@@ -65,5 +74,11 @@ export default {
   "pageSidebar": "pf-v6-c-page__sidebar",
   "pageSidebarBody": "pf-v6-c-page__sidebar-body",
   "pageSidebarHeader": "pf-v6-c-page__sidebar-header",
-  "pageSidebarTitle": "pf-v6-c-page__sidebar-title"
+  "pageSidebarMain": "pf-v6-c-page__sidebar-main",
+  "pageSidebarTitle": "pf-v6-c-page__sidebar-title",
+  "themeGlass": "pf-v6-theme-glass",
+  "toolbar": "pf-v6-c-toolbar",
+  "toolbarContentSection": "pf-v6-c-toolbar__content-section",
+  "toolbarGroup": "pf-v6-c-toolbar__group",
+  "toolbarItem": "pf-v6-c-toolbar__item"
 };

package/css/components/Pagination/pagination.css

@@ -17,7 +17,7 @@
   --pf-v6-c-pagination__total-items--Display: block;
   --pf-v6-c-pagination--m-display-summary__total-items--Display: block;
   --pf-v6-c-pagination--m-display-full__total-items--Display: none;
-  --pf-v6-c-pagination--m-sticky--BackgroundColor: var(--pf-t--global--background--color--primary--default);
+  --pf-v6-c-pagination--m-sticky--BackgroundColor: var(--pf-t--global--background--color--sticky--default);
   --pf-v6-c-pagination--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--bottom);
   --pf-v6-c-pagination--m-sticky--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-pagination--m-sticky--PaddingBlockEnd: var(--pf-t--global--spacer--md);
@@ -26,6 +26,13 @@
   --pf-v6-c-pagination--m-sticky--ZIndex: var(--pf-t--global--z-index--xs);
   --pf-v6-c-pagination--m-sticky--InsetBlockStart: 0;
   --pf-v6-c-pagination--m-sticky--BorderBlockEndWidth: var(--pf-t--global--border--width--high-contrast--regular);
+  --pf-v6-c-pagination--m-sticky-base--InsetBlockStart: 0;
+  --pf-v6-c-pagination--m-sticky-base--BorderRadius: 0;
+  --pf-v6-c-pagination--m-sticky-base--TransitionTimingFunction: var(--pf-t--global--motion--timing-function--default);
+  --pf-v6-c-pagination--m-sticky-base--TransitionDuration: var(--pf-t--global--motion--duration--fade--short);
+  --pf-v6-c-pagination--m-sticky-stuck--BoxShadow: var(--pf-v6-c-pagination--m-sticky--BoxShadow);
+  --pf-v6-c-pagination--m-sticky-stuck--BackgroundColor: var(--pf-t--global--background--color--sticky--default);
+  --pf-v6-c-pagination--m-sticky--BorderRadius--glass: var(--pf-t--global--border--radius--medium);
   --pf-v6-c-pagination--m-bottom--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-pagination--m-bottom--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
   --pf-v6-c-pagination--m-bottom--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
@@ -40,6 +47,15 @@
   --pf-v6-c-pagination--m-bottom--m-static--PaddingBlockEnd: 0;
   --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-pagination--m-bottom--m-static--PaddingInlineEnd: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-pagination--m-bottom--m-sticky-base--InsetBlockEnd: 0;
+}
+:where(:root.pf-v6-theme-glass) .pf-v6-c-pagination {
+  --pf-v6-c-pagination--m-sticky-stuck--BorderRadius: var(--pf-t--global--border--radius--glass--default);
+  --pf-v6-c-pagination--m-sticky-stuck--BoxShadow: var(--pf-t--global--box-shadow--sm);
+  --pf-v6-c-pagination--m-sticky--BorderRadius: var(--pf-v6-c-pagination--m-sticky--BorderRadius--glass);
+  --pf-v6-c-pagination--m-sticky--BoxShadow: var(--pf-t--global--box-shadow--sm);
+}
+.pf-v6-c-pagination {
   --pf-v6-c-pagination__page-menu--Display--base: block;
   --pf-v6-c-pagination__page-menu--Display: none;
   --pf-v6-c-pagination--m-display-summary__page-menu--Display: none;
@@ -74,6 +90,9 @@
   border-block-start-width: var(--pf-v6-c-pagination--BorderBlockStartWidth);
   border-block-end-width: var(--pf-v6-c-pagination--BorderBlockEndWidth);
 }
+:where(:root:not(.pf-v6-theme-glass)) .pf-v6-c-pagination.pf-m-plain, :where(:root.pf-v6-theme-glass) .pf-v6-c-pagination:not(.pf-m-no-plain-on-glass) {
+  --pf-v6-c-pagination--m-bottom--BackgroundColor: transparent;
+}
 .pf-v6-c-pagination .pf-v6-c-pagination__page-menu {
   display: var(--pf-v6-c-pagination__page-menu--Display);
 }
@@ -91,6 +110,9 @@
   background-color: var(--pf-v6-c-pagination--m-bottom--BackgroundColor);
   box-shadow: var(--pf-v6-c-pagination--m-bottom--BoxShadow);
 }
+:where(:root.pf-v6-theme-glass) .pf-v6-c-pagination.pf-m-bottom.pf-m-sticky-base:not(.pf-m-sticky-stuck) {
+  --pf-v6-c-pagination--m-bottom--BackgroundColor: transparent;
+}
 .pf-v6-c-pagination.pf-m-bottom .pf-v6-c-pagination__nav-control.pf-m-first,
 .pf-v6-c-pagination.pf-m-bottom .pf-v6-c-pagination__nav-control.pf-m-last,
 .pf-v6-c-pagination.pf-m-bottom .pf-v6-c-pagination__nav-page-select {
@@ -145,15 +167,47 @@
   --pf-v6-c-pagination--m-bottom--InsetBlockEnd: 0;
   --pf-v6-c-pagination--BorderBlockEndWidth: var(--pf-v6-c-pagination--m-sticky--BorderBlockEndWidth);
   --pf-v6-c-pagination--m-bottom--BorderBlockStartWidth: var(--pf-v6-c-pagination--m-bottom--m-sticky--BorderBlockStartWidth);
-  position: sticky;
   inset-block-start: var(--pf-v6-c-pagination--m-sticky--InsetBlockStart);
+  background-color: var(--pf-v6-c-pagination--m-sticky--BackgroundColor);
+  border-radius: var(--pf-v6-c-pagination--m-sticky--BorderRadius);
+  box-shadow: var(--pf-v6-c-pagination--m-sticky--BoxShadow);
+}
+.pf-v6-c-pagination.pf-m-sticky, .pf-v6-c-pagination.pf-m-sticky-base {
+  position: sticky;
   z-index: var(--pf-v6-c-pagination--m-sticky--ZIndex);
   padding-block-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockStart);
   padding-block-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingBlockEnd);
   padding-inline-start: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineStart);
   padding-inline-end: var(--pf-v6-c-pagination--m-bottom--m-sticky--PaddingInlineEnd);
-  background-color: var(--pf-v6-c-pagination--m-sticky--BackgroundColor);
-  box-shadow: var(--pf-v6-c-pagination--m-sticky--BoxShadow);
+}
+.pf-v6-c-pagination.pf-m-sticky-base {
+  inset-block-start: var(--pf-v6-c-pagination--m-sticky-base--InsetBlockStart);
+  border-radius: var(--pf-v6-c-pagination--m-sticky-base--BorderRadius, 0);
+}
+.pf-v6-c-pagination.pf-m-sticky-base.pf-m-bottom {
+  --pf-v6-c-pagination--m-sticky-base--InsetBlockStart: 0;
+  --pf-v6-c-pagination--m-bottom--InsetBlockEnd: var(--pf-v6-c-pagination--m-bottom--m-sticky-base--InsetBlockEnd);
+}
+.pf-v6-c-pagination.pf-m-sticky-base::before {
+  position: absolute;
+  inset: 0;
+  z-index: -1;
+  content: "";
+  background-color: var(--pf-v6-c-pagination--m-sticky-stuck--BackgroundColor);
+  border-radius: var(--pf-v6-c-pagination--m-sticky-stuck--BorderRadius);
+  box-shadow: var(--pf-v6-c-pagination--m-sticky-stuck--BoxShadow);
+  opacity: 0;
+  transition-timing-function: var(--pf-v6-c-pagination--m-sticky-base--TransitionTimingFunction);
+  transition-duration: var(--pf-v6-c-pagination--m-sticky-base--TransitionDuration);
+  transition-property: opacity;
+}
+.pf-v6-c-pagination.pf-m-sticky-stuck {
+  --pf-v6-c-pagination--m-sticky-base--BoxShadow: var(--pf-v6-c-pagination--m-sticky-stuck--BoxShadow);
+  --pf-v6-c-pagination--m-sticky-base--BorderRadius: var(--pf-v6-c-pagination--m-sticky-stuck--BorderRadius);
+  --pf-v6-c-pagination--m-sticky-base--BackgroundColor: var(--pf-v6-c-pagination--m-sticky-stuck--BackgroundColor);
+}
+.pf-v6-c-pagination.pf-m-sticky-stuck::before {
+  opacity: 1;
 }
 .pf-v6-c-pagination.pf-m-page-insets {
   --pf-v6-c-pagination--inset: var(--pf-v6-c-pagination--m-page-insets--inset);

package/css/components/Pagination/pagination.d.ts

@@ -3,7 +3,11 @@ declare const _default: {
   "dirRtl": "pf-v6-m-dir-rtl",
   "formControl": "pf-v6-c-form-control",
   "modifiers": {
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "bottom": "pf-m-bottom",
+    "stickyBase": "pf-m-sticky-base",
+    "stickyStuck": "pf-m-sticky-stuck",
     "first": "pf-m-first",
     "last": "pf-m-last",
     "static": "pf-m-static",
@@ -63,6 +67,7 @@ declare const _default: {
   "paginationNavControl": "pf-v6-c-pagination__nav-control",
   "paginationNavPageSelect": "pf-v6-c-pagination__nav-page-select",
   "paginationPageMenu": "pf-v6-c-pagination__page-menu",
-  "paginationTotalItems": "pf-v6-c-pagination__total-items"
+  "paginationTotalItems": "pf-v6-c-pagination__total-items",
+  "themeGlass": "pf-v6-theme-glass"
 };
 export default _default;

package/css/components/Pagination/pagination.js

@@ -5,7 +5,11 @@ exports.default = {
   "dirRtl": "pf-v6-m-dir-rtl",
   "formControl": "pf-v6-c-form-control",
   "modifiers": {
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "bottom": "pf-m-bottom",
+    "stickyBase": "pf-m-sticky-base",
+    "stickyStuck": "pf-m-sticky-stuck",
     "first": "pf-m-first",
     "last": "pf-m-last",
     "static": "pf-m-static",
@@ -65,5 +69,6 @@ exports.default = {
   "paginationNavControl": "pf-v6-c-pagination__nav-control",
   "paginationNavPageSelect": "pf-v6-c-pagination__nav-page-select",
   "paginationPageMenu": "pf-v6-c-pagination__page-menu",
-  "paginationTotalItems": "pf-v6-c-pagination__total-items"
+  "paginationTotalItems": "pf-v6-c-pagination__total-items",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Pagination/pagination.mjs

@@ -3,7 +3,11 @@ export default {
   "dirRtl": "pf-v6-m-dir-rtl",
   "formControl": "pf-v6-c-form-control",
   "modifiers": {
+    "plain": "pf-m-plain",
+    "noPlainOnGlass": "pf-m-no-plain-on-glass",
     "bottom": "pf-m-bottom",
+    "stickyBase": "pf-m-sticky-base",
+    "stickyStuck": "pf-m-sticky-stuck",
     "first": "pf-m-first",
     "last": "pf-m-last",
     "static": "pf-m-static",
@@ -63,5 +67,6 @@ export default {
   "paginationNavControl": "pf-v6-c-pagination__nav-control",
   "paginationNavPageSelect": "pf-v6-c-pagination__nav-page-select",
   "paginationPageMenu": "pf-v6-c-pagination__page-menu",
-  "paginationTotalItems": "pf-v6-c-pagination__total-items"
+  "paginationTotalItems": "pf-v6-c-pagination__total-items",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Panel/panel.css

@@ -4,25 +4,27 @@
   --pf-v6-c-panel--MaxWidth: none;
   --pf-v6-c-panel--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-panel--BoxShadow: none;
-  --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--small);
+  --pf-v6-c-panel--BorderRadius: var(--pf-t--global--border--radius--medium);
   --pf-v6-c-panel--before--BorderWidth: 0;
   --pf-v6-c-panel--before--BorderColor: var(--pf-t--global--border--color--high-contrast);
   --pf-v6-c-panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-panel--m-secondary--before--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
   --pf-v6-c-panel--m-bordered--before--BorderWidth: var(--pf-t--global--border--width--box--default);
   --pf-v6-c-panel--m-bordered--before--BorderColor: var(--pf-t--global--border--color--default);
+  --pf-v6-c-panel--m-no-border--before--BorderWidth: 0;
   --pf-v6-c-panel--m-raised--BoxShadow: var(--pf-t--global--box-shadow--md);
   --pf-v6-c-panel--m-raised--BackgroundColor: var(--pf-t--global--background--color--floating--default);
   --pf-v6-c-panel--m-raised--before--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
+  --pf-v6-c-panel--m-raised--BorderRadius: var(--pf-t--global--border--radius--small);
   --pf-v6-c-panel__header--PaddingBlockStart: var(--pf-t--global--spacer--md);
   --pf-v6-c-panel__header--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
   --pf-v6-c-panel__header--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-panel__header--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-panel__main--MaxHeight: none;
   --pf-v6-c-panel__main--Overflow: visible;
-  --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingBlockStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-panel__main-body--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
-  --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--md);
+  --pf-v6-c-panel__main-body--PaddingBlockEnd: var(--pf-t--global--spacer--lg);
   --pf-v6-c-panel__main-body--PaddingInlineStart: var(--pf-t--global--spacer--lg);
   --pf-v6-c-panel__footer--PaddingBlockStart: var(--pf-t--global--spacer--sm);
   --pf-v6-c-panel__footer--PaddingInlineEnd: var(--pf-t--global--spacer--lg);
@@ -31,6 +33,7 @@
   --pf-v6-c-panel__footer--BoxShadow: none;
   --pf-v6-c-panel__footer--BorderColor: transparent;
   --pf-v6-c-panel__footer--BorderWidth: 0;
+  --pf-v6-c-panel--m-pill--BorderRadius: var(--pf-t--global--border--radius--pill);
   --pf-v6-c-panel--m-scrollable__main--MaxHeight: 18.75rem;
   --pf-v6-c-panel--m-scrollable__main--Overflow: auto;
   --pf-v6-c-panel--m-scrollable__footer--BoxShadow: var(--pf-t--global--box-shadow--sm--top);
@@ -38,6 +41,12 @@
   --pf-v6-c-panel--m-scrollable__footer--PaddingBlockEnd: var(--pf-t--global--spacer--md);
   --pf-v6-c-panel--m-scrollable__footer--BorderColor: var(--pf-t--global--border--color--high-contrast);
   --pf-v6-c-panel--m-scrollable__footer--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
+  --pf-v6-c-panel--m-glass--BackgroundColor: var(--pf-t--global--background--color--glass--primary--default);
+  --pf-v6-c-panel--m-glass--before--BorderWidth: var(--pf-t--global--border--width--glass--default);
+  --pf-v6-c-panel--m-glass--before--BorderColor: var(--pf-t--global--border--color--glass--default);
+  --pf-v6-c-panel--m-glass--BoxShadow: var(--pf-t--global--box-shadow--glass--default);
+  --pf-v6-c-panel--m-glass--BorderRadius: var(--pf-t--global--border--radius--glass--default);
+  --pf-v6-c-panel--m-glass--BackdropFilter: var(--pf-t--global--background--filter--glass--blur--primary);
 }
 
 .pf-v6-c-panel {
@@ -69,6 +78,7 @@
   --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-raised--BackgroundColor);
   --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-raised--BoxShadow);
   --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-raised--before--BorderWidth);
+  --pf-v6-c-panel--BorderRadius: var(--pf-v6-c-panel--m-raised--BorderRadius);
 }
 .pf-v6-c-panel.pf-m-scrollable {
   --pf-v6-c-panel__main--MaxHeight: var(--pf-v6-c-panel--m-scrollable__main--MaxHeight);
@@ -79,6 +89,33 @@
   --pf-v6-c-panel__footer--BorderColor: var(--pf-v6-c-panel--m-scrollable__footer--BorderColor);
   --pf-v6-c-panel__footer--BorderWidth: var(--pf-v6-c-panel--m-scrollable__footer--BorderWidth);
 }
+.pf-v6-c-panel.pf-m-scrollable-auto-height {
+  --pf-v6-c-panel__main--MaxHeight: 100%;
+  max-height: 100%;
+}
+:where(.pf-v6-theme-glass) .pf-v6-c-panel.pf-m-glass {
+  --pf-v6-c-panel--BackgroundColor: var(--pf-v6-c-panel--m-glass--BackgroundColor);
+  --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-glass--before--BorderWidth);
+  --pf-v6-c-panel--before--BorderColor: var(--pf-v6-c-panel--m-glass--before--BorderColor);
+  --pf-v6-c-panel--BoxShadow: var(--pf-v6-c-panel--m-glass--BoxShadow);
+  --pf-v6-c-panel--BorderRadius: var(--pf-v6-c-panel--m-glass--BorderRadius);
+  backdrop-filter: var(--pf-v6-c-panel--m-glass--BackdropFilter);
+}
+.pf-v6-c-panel.pf-m-no-border {
+  --pf-v6-c-panel--before--BorderWidth: var(--pf-v6-c-panel--m-no-border--before--BorderWidth);
+}
+.pf-v6-c-panel.pf-m-pill {
+  --pf-v6-c-panel--BorderRadius: var(--pf-v6-c-panel--m-pill--BorderRadius);
+}
+.pf-v6-c-panel.pf-m-full-height {
+  height: 100%;
+}
+
+.pf-v6-c-panel,
+.pf-v6-c-panel__main {
+  display: flex;
+  flex-direction: column;
+}
 
 .pf-v6-c-panel__header {
   padding-block-start: var(--pf-v6-c-panel__header--PaddingBlockStart);
@@ -88,6 +125,7 @@
 }
 
 .pf-v6-c-panel__main {
+  min-height: 0;
   max-height: var(--pf-v6-c-panel__main--MaxHeight);
   overflow: var(--pf-v6-c-panel__main--Overflow);
 }

package/css/components/Panel/panel.d.ts

@@ -4,12 +4,18 @@ declare const _default: {
     "bordered": "pf-m-bordered",
     "secondary": "pf-m-secondary",
     "raised": "pf-m-raised",
-    "scrollable": "pf-m-scrollable"
+    "scrollable": "pf-m-scrollable",
+    "scrollableAutoHeight": "pf-m-scrollable-auto-height",
+    "glass": "pf-m-glass",
+    "noBorder": "pf-m-no-border",
+    "pill": "pf-m-pill",
+    "fullHeight": "pf-m-full-height"
   },
   "panel": "pf-v6-c-panel",
   "panelFooter": "pf-v6-c-panel__footer",
   "panelHeader": "pf-v6-c-panel__header",
   "panelMain": "pf-v6-c-panel__main",
-  "panelMainBody": "pf-v6-c-panel__main-body"
+  "panelMainBody": "pf-v6-c-panel__main-body",
+  "themeGlass": "pf-v6-theme-glass"
 };
 export default _default;

package/css/components/Panel/panel.js

@@ -6,11 +6,17 @@ exports.default = {
     "bordered": "pf-m-bordered",
     "secondary": "pf-m-secondary",
     "raised": "pf-m-raised",
-    "scrollable": "pf-m-scrollable"
+    "scrollable": "pf-m-scrollable",
+    "scrollableAutoHeight": "pf-m-scrollable-auto-height",
+    "glass": "pf-m-glass",
+    "noBorder": "pf-m-no-border",
+    "pill": "pf-m-pill",
+    "fullHeight": "pf-m-full-height"
   },
   "panel": "pf-v6-c-panel",
   "panelFooter": "pf-v6-c-panel__footer",
   "panelHeader": "pf-v6-c-panel__header",
   "panelMain": "pf-v6-c-panel__main",
-  "panelMainBody": "pf-v6-c-panel__main-body"
+  "panelMainBody": "pf-v6-c-panel__main-body",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Panel/panel.mjs

@@ -4,11 +4,17 @@ export default {
     "bordered": "pf-m-bordered",
     "secondary": "pf-m-secondary",
     "raised": "pf-m-raised",
-    "scrollable": "pf-m-scrollable"
+    "scrollable": "pf-m-scrollable",
+    "scrollableAutoHeight": "pf-m-scrollable-auto-height",
+    "glass": "pf-m-glass",
+    "noBorder": "pf-m-no-border",
+    "pill": "pf-m-pill",
+    "fullHeight": "pf-m-full-height"
   },
   "panel": "pf-v6-c-panel",
   "panelFooter": "pf-v6-c-panel__footer",
   "panelHeader": "pf-v6-c-panel__header",
   "panelMain": "pf-v6-c-panel__main",
-  "panelMainBody": "pf-v6-c-panel__main-body"
+  "panelMainBody": "pf-v6-c-panel__main-body",
+  "themeGlass": "pf-v6-theme-glass"
 };

package/css/components/Progress/progress.css

@@ -2,7 +2,7 @@
   --pf-v6-c-progress--GridGap: var(--pf-t--global--spacer--md);
   --pf-v6-c-progress__bar--Height: var(--pf-t--global--spacer--md);
   --pf-v6-c-progress__bar--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
-  --pf-v6-c-progress__bar--BorderRadius: var(--pf-t--global--border--radius--medium);
+  --pf-v6-c-progress__bar--BorderRadius: var(--pf-t--global--border--radius--pill);
   --pf-v6-c-progress__bar--BorderColor: var(--pf-t--global--border--color--high-contrast);
   --pf-v6-c-progress__bar--BorderWidth: var(--pf-t--global--border--width--high-contrast--regular);
   --pf-v6-c-progress__measure--m-static-width--MinWidth: 4.5ch;
@@ -12,6 +12,7 @@
   --pf-v6-c-progress__indicator--BackgroundColor: var(--pf-t--global--color--brand--default);
   --pf-v6-c-progress__indicator--BorderWidth: var(--pf-t--global--border--width--high-contrast--extra-strong);
   --pf-v6-c-progress__indicator--BorderColor: transparent;
+  --pf-v6-c-progress__indicator--BorderRadius: var(--pf-t--global--border--radius--pill);
   --pf-v6-c-progress__helper-text--MarginBlockStart: calc(var(--pf-t--global--spacer--sm) - var(--pf-v6-c-progress--GridGap));
   --pf-v6-c-progress--m-success__indicator--BackgroundColor: var(--pf-t--global--color--status--success--default);
   --pf-v6-c-progress--m-warning__indicator--BackgroundColor: var(--pf-t--global--color--status--warning--default);
@@ -181,6 +182,7 @@
   position: absolute;
   height: var(--pf-v6-c-progress__indicator--Height);
   background-color: var(--pf-v6-c-progress__indicator--BackgroundColor);
+  border-radius: var(--pf-v6-c-progress__indicator--BorderRadius);
 }
 .pf-v6-c-progress__indicator::before {
   position: absolute;

package/css/components/Sidebar/sidebar.css

@@ -143,8 +143,8 @@
   position: var(--pf-v6-c-sidebar__panel--Position);
   inset-block-start: var(--pf-v6-c-sidebar__panel--InsetBlockStart);
   z-index: var(--pf-v6-c-sidebar__panel--ZIndex);
-  flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
   flex-shrink: 0;
+  flex-basis: var(--pf-v6-c-sidebar__panel--FlexBasis);
   order: var(--pf-v6-c-sidebar__panel--Order);
   padding-block-start: var(--pf-v6-c-sidebar__panel--PaddingBlockStart);
   padding-block-end: var(--pf-v6-c-sidebar__panel--PaddingBlockEnd);

package/css/components/Skeleton/skeleton.css

@@ -1,4 +1,3 @@
-@charset "UTF-8";
 .pf-v6-c-skeleton {
   --pf-v6-c-skeleton--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-skeleton--Width: auto;
@@ -6,7 +5,7 @@
   --pf-v6-c-skeleton--BorderRadius: var(--pf-t--global--spacer--sm);
   --pf-v6-c-skeleton--before--PaddingBlockEnd: 0;
   --pf-v6-c-skeleton--before--Height: auto;
-  --pf-v6-c-skeleton--before--Content: " ";
+  --pf-v6-c-skeleton--before--Content: "\00a0";
   --pf-v6-c-skeleton--after--LinearGradientAngle: 90deg;
   --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
@@ -17,6 +16,17 @@
   --pf-v6-c-skeleton--after--AnimationIterationCount: infinite;
   --pf-v6-c-skeleton--after--AnimationTimingFunction: linear;
   --pf-v6-c-skeleton--after--AnimationDelay: .5s;
+}
+@media screen and (prefers-reduced-motion: no-preference) {
+  .pf-v6-c-skeleton {
+    --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
+    --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
+    --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
+    --pf-v6-c-skeleton--after--TranslateX: -100%;
+    --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
+  }
+}
+.pf-v6-c-skeleton {
   --pf-v6-c-skeleton--m-circle--BorderRadius: var(--pf-t--global--border--radius--pill);
   --pf-v6-c-skeleton--m-circle--before--PaddingBlockEnd: 100%;
   --pf-v6-c-skeleton--m-text-4xl--Height: calc(var(--pf-t--global--font--size--4xl) * var(--pf-t--global--font--line-height--heading));
@@ -44,15 +54,6 @@
   --pf-v6-c-skeleton--m-height-75--Height: 75%;
   --pf-v6-c-skeleton--m-height-100--Height: 100%;
 }
-@media screen and (prefers-reduced-motion: no-preference) {
-  .pf-v6-c-skeleton {
-    --pf-v6-c-skeleton--after--LinearGradientColorStop1: var(--pf-t--global--background--color--secondary--default);
-    --pf-v6-c-skeleton--after--LinearGradientColorStop2: var(--pf-t--global--background--color--secondary--hover);
-    --pf-v6-c-skeleton--after--LinearGradientColorStop3: var(--pf-t--global--background--color--secondary--default);
-    --pf-v6-c-skeleton--after--TranslateX: -100%;
-    --pf-v6-c-skeleton--after--AnimationName: pf-v6-c-skeleton-loading;
-  }
-}
 
 .pf-v6-c-skeleton {
   position: relative;
@@ -69,6 +70,10 @@
   padding-block-end: var(--pf-v6-c-skeleton--before--PaddingBlockEnd);
   content: var(--pf-v6-c-skeleton--before--Content);
 }
+:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-skeleton::after {
+  scale: -1 1;
+}
+
 .pf-v6-c-skeleton::after {
   position: absolute;
   inset: 0;
@@ -78,10 +83,6 @@
   transform: translate3d(var(--pf-v6-c-skeleton--after--TranslateX), 0, 0);
   animation: var(--pf-v6-c-skeleton--after--AnimationName) var(--pf-v6-c-skeleton--after--AnimationDuration) var(--pf-v6-c-skeleton--after--AnimationTimingFunction) var(--pf-v6-c-skeleton--after--AnimationDelay) var(--pf-v6-c-skeleton--after--AnimationIterationCount);
 }
-:where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-skeleton::after {
-  scale: -1 1;
-}
-
 .pf-v6-c-skeleton.pf-m-circle {
   --pf-v6-c-skeleton--BorderRadius: var(--pf-v6-c-skeleton--m-circle--BorderRadius);
 }