@patternfly/react-styles 6.0.0-alpha.17 → 6.0.0-alpha.19

package/css/components/Divider/divider.css

@@ -1,49 +1,49 @@
 .pf-v6-c-divider {
-  --pf-v5-hidden-visible--hidden--Display: none;
-  --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
-  display: var(--pf-v5-hidden-visible--Display);
+  --pf-v6-hidden-visible--hidden--Display: none;
+  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
+  display: var(--pf-v6-hidden-visible--Display);
 }
 .pf-m-hidden.pf-v6-c-divider {
-  --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+  --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
 }
 @media screen and (min-width: 576px) {
   .pf-m-hidden-on-sm.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
   }
   .pf-m-visible-on-sm.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
   }
 }
 @media screen and (min-width: 768px) {
   .pf-m-hidden-on-md.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
   }
   .pf-m-visible-on-md.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
   }
 }
 @media screen and (min-width: 992px) {
   .pf-m-hidden-on-lg.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
   }
   .pf-m-visible-on-lg.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
   }
 }
 @media screen and (min-width: 1200px) {
   .pf-m-hidden-on-xl.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
   }
   .pf-m-visible-on-xl.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
   }
 }
 @media screen and (min-width: 1450px) {
   .pf-m-hidden-on-2xl.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--hidden--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--hidden--Display);
   }
   .pf-m-visible-on-2xl.pf-v6-c-divider {
-    --pf-v5-hidden-visible--Display: var(--pf-v5-hidden-visible--visible--Display);
+    --pf-v6-hidden-visible--Display: var(--pf-v6-hidden-visible--visible--Display);
   }
 }
 
@@ -59,7 +59,7 @@
   flex-direction: row;
   width: 100%;
   height: var(--pf-v6-c-divider--Size);
-  --pf-v5-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
+  --pf-v6-hidden-visible--visible--Display: var(--pf-v6-c-divider--Display);
   flex-shrink: 0;
   align-items: stretch;
   align-self: stretch;
@@ -85,25 +85,25 @@
   --pf-v6-c-divider--before--FlexBasis: calc(100% - 0% * 2);
 }
 .pf-v6-c-divider.pf-m-inset-xs {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-sm {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-md {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-lg {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-xl {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-2xl {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
 }
 .pf-v6-c-divider.pf-m-inset-3xl {
-  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+  --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
 }
 
 @media (min-width: 576px) {
@@ -125,25 +125,25 @@
     --pf-v6-c-divider--before--FlexBasis: 100%;
   }
   .pf-v6-c-divider.pf-m-inset-xs-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-sm-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-md-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-lg-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-xl-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-2xl-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-3xl-on-sm {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
   }
 }
 @media (min-width: 768px) {
@@ -165,25 +165,25 @@
     --pf-v6-c-divider--before--FlexBasis: 100%;
   }
   .pf-v6-c-divider.pf-m-inset-xs-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-sm-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-md-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-lg-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-xl-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-2xl-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-3xl-on-md {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
   }
 }
 @media (min-width: 992px) {
@@ -205,25 +205,25 @@
     --pf-v6-c-divider--before--FlexBasis: 100%;
   }
   .pf-v6-c-divider.pf-m-inset-xs-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-sm-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-md-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-lg-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-xl-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-2xl-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-3xl-on-lg {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
   }
 }
 @media (min-width: 1200px) {
@@ -245,25 +245,25 @@
     --pf-v6-c-divider--before--FlexBasis: 100%;
   }
   .pf-v6-c-divider.pf-m-inset-xs-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-sm-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-md-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-lg-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-xl-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-2xl-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-3xl-on-xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
   }
 }
 @media (min-width: 1450px) {
@@ -285,24 +285,24 @@
     --pf-v6-c-divider--before--FlexBasis: 100%;
   }
   .pf-v6-c-divider.pf-m-inset-xs-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xs) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xs) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-sm-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--sm) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--sm) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-md-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--md) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--md) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-lg-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--lg) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--lg) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-xl-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-2xl-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--2xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--2xl) * 2);
   }
   .pf-v6-c-divider.pf-m-inset-3xl-on-2xl {
-    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-v6-global--spacer--3xl) * 2);
+    --pf-v6-c-divider--before--FlexBasis: calc(100% - var(--pf-t--global--spacer--3xl) * 2);
   }
 }

package/css/components/Drawer/drawer.css

@@ -3,12 +3,13 @@
   --pf-v6-c-drawer__section--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-drawer__section--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-drawer__content--FlexBasis: 100%;
-  --pf-v6-c-drawer__content--BackgroundColor: var(--pf-t--global--background--color--primary--default);
+  --pf-v6-c-drawer__content--BackgroundColor: transparent;
+  --pf-v6-c-drawer__content--m-primary--BackgroundColor: var(--pf-t--global--background--color--primary--default);
   --pf-v6-c-drawer__content--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
-  --pf-v6-c-drawer__content--ZIndex: var(--pf-t--global--Zindex--xs);
+  --pf-v6-c-drawer__content--ZIndex: var(--pf-t--global--z-index--xs);
   --pf-v6-c-drawer__panel--MinWidth: 50%;
   --pf-v6-c-drawer__panel--MaxHeight: auto;
-  --pf-v6-c-drawer__panel--ZIndex: var(--pf-t--global--Zindex--sm);
+  --pf-v6-c-drawer__panel--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-drawer__panel--BackgroundColor: var(--pf-t--global--background--color--floating--default);
   --pf-v6-c-drawer__panel--m-secondary--BackgroundColor: var(--pf-t--global--background--color--secondary--default);
   --pf-v6-c-drawer__panel--RowGap: var(--pf-t--global--spacer--sm);
@@ -93,8 +94,8 @@
   --pf-v6-c-drawer__splitter-handle--after--Height: 0.25rem;
   --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Width: 0.25rem;
   --pf-v6-c-drawer__splitter--m-vertical__splitter-handle--after--Height: 0.75rem;
-  --pf-v6-c-drawer__actions--MarginTop: calc(var(--pf-t--global--spacer--xs) * -1.5);
-  --pf-v6-c-drawer__actions--MarginRight: calc(var(--pf-t--global--spacer--xs) * -1.5);
+  --pf-v6-c-drawer__actions--MarginTop: calc(var(--pf-t--global--spacer--control--vertical--compact) * -1.5);
+  --pf-v6-c-drawer__actions--MarginRight: calc(var(--pf-t--global--spacer--control--horizontal--compact) * -1.5);
   --pf-v6-c-drawer__panel--BoxShadow: none;
   --pf-v6-c-drawer--m-expanded--m-panel-bottom__panel--BoxShadow: var(--pf-t--global--box-shadow--lg--top);
   --pf-v6-c-drawer__panel--after--Width: var(--pf-t--global--border--width--divider--default);
@@ -119,7 +120,7 @@
 
 .pf-v6-c-drawer {
   --pf-v6-c-drawer--m-expanded__panel--BoxShadow: var(--pf-t--global--box-shadow--lg--left);
-  --pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow: var(--pf-v6-global--BoxShadow--lg-right);
+  --pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow: var(--pf-t--global--box-shadow--lg--right);
   display: flex;
   flex-direction: column;
   height: 100%;
@@ -130,7 +131,7 @@
 }
 
 :where(.pf-v6-m-dir-rtl, [dir=rtl]) .pf-v6-c-drawer {
-  --pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow: var(--pf-v6-global--BoxShadow--lg-left);
+  --pf-v6-c-drawer--m-expanded--m-panel-left__panel--BoxShadow: var(--pf-t--global--box-shadow--lg--left);
 }
 
 .pf-v6-c-drawer.pf-m-inline > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable), .pf-v6-c-drawer.pf-m-static > .pf-v6-c-drawer__main > .pf-v6-c-drawer__panel:not(.pf-m-no-border, .pf-m-resizable) {
@@ -204,12 +205,12 @@
   order: 0;
   background-color: var(--pf-v6-c-drawer__content--BackgroundColor);
 }
+.pf-v6-c-drawer__content.pf-m-primary {
+  --pf-v6-c-drawer__content--BackgroundColor: var(--pf-v6-c-drawer__content--m-primary--BackgroundColor);
+}
 .pf-v6-c-drawer__content.pf-m-secondary {
   --pf-v6-c-drawer__content--BackgroundColor: var(--pf-v6-c-drawer__content--m-secondary--BackgroundColor);
 }
-.pf-v6-c-drawer__content.pf-m-no-background {
-  --pf-v6-c-drawer__content--BackgroundColor: transparent;
-}
 .pf-v6-c-drawer__content > .pf-v6-c-drawer__body {
   padding-block-start: var(--pf-v6-c-drawer__content__body--PaddingTop);
   padding-block-end: var(--pf-v6-c-drawer__content__body--PaddingBottom);

package/css/components/Drawer/drawer.d.ts

@@ -25,6 +25,7 @@ declare const _default: {
     "resizing": "pf-m-resizing",
     "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "primary": "pf-m-primary",
     "noPadding": "pf-m-no-padding",
     "padding": "pf-m-padding",
     "vertical": "pf-m-vertical",

package/css/components/Drawer/drawer.js

@@ -27,6 +27,7 @@ exports.default = {
     "resizing": "pf-m-resizing",
     "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "primary": "pf-m-primary",
     "noPadding": "pf-m-no-padding",
     "padding": "pf-m-padding",
     "vertical": "pf-m-vertical",

package/css/components/Drawer/drawer.mjs

@@ -25,6 +25,7 @@ export default {
     "resizing": "pf-m-resizing",
     "secondary": "pf-m-secondary",
     "noBackground": "pf-m-no-background",
+    "primary": "pf-m-primary",
     "noPadding": "pf-m-no-padding",
     "padding": "pf-m-padding",
     "vertical": "pf-m-vertical",

package/css/components/Dropdown/dropdown.css

@@ -98,7 +98,7 @@
   --pf-v6-c-dropdown__menu--PaddingTop: var(--pf-v6-global--spacer--sm);
   --pf-v6-c-dropdown__menu--PaddingBottom: var(--pf-v6-global--spacer--sm);
   --pf-v6-c-dropdown__menu--Top: calc(100% + var(--pf-v6-global--spacer--xs));
-  --pf-v6-c-dropdown__menu--ZIndex: var(--pf-v6-global--ZIndex--sm);
+  --pf-v6-c-dropdown__menu--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-dropdown--m-top__menu--Top: 0;
   --pf-v6-c-dropdown--m-top__menu--TranslateY: calc(-100% - var(--pf-v6-global--spacer--xs));
   --pf-v6-c-dropdown__menu-item--BackgroundColor: transparent;
@@ -135,7 +135,7 @@
   --pf-v6-c-dropdown__toggle--c-badge__toggle-icon--MarginLeft: var(--pf-v6-global--spacer--xs);
   --pf-v6-c-dropdown__toggle--c-badge__toggle-icon--MarginRight: 0;
   --pf-v6-c-dropdown--c-menu--Top: calc(100% + var(--pf-v6-global--spacer--xs));
-  --pf-v6-c-dropdown--c-menu--ZIndex: var(--pf-v6-global--ZIndex--sm);
+  --pf-v6-c-dropdown--c-menu--ZIndex: var(--pf-t--global--z-index--sm);
   --pf-v6-c-dropdown--m-top--c-menu--Top: 0;
   --pf-v6-c-dropdown--m-top--c-menu--TranslateY: calc(-100% - var(--pf-v6-global--spacer--xs));
   --pf-v6-c-dropdown--m-full-height__toggle--before--BorderTopWidth: 0;

package/css/components/DualListSelector/dual-list-selector.css

@@ -52,7 +52,7 @@
   --pf-v6-c-dual-list-selector__item--c-badge--m-read--BackgroundColor: var(--pf-t--global--color--nonstatus--gray--default);
   --pf-v6-c-dual-list-selector__item-toggle-icon--Rotate: 0;
   --pf-v6-c-dual-list-selector__list-item--m-expanded__item-toggle-icon--Rotate: 90deg;
-  --pf-v6-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-v6-global--Transition);
+  --pf-v6-c-dual-list-selector__item-toggle-icon--Transition: var(--pf-t--global--transition);
   --pf-v6-c-dual-list-selector__item-toggle-icon--MinWidth: var(--pf-v6-c-dual-list-selector__list-item-row--FontSize);
   --pf-v6-c-dual-list-selector__list-item--m-disabled__item-toggle-icon--Color: var(--pf-t--global--icon--color--disabled);
 }

package/css/components/Form/form.css

@@ -57,7 +57,7 @@
   --pf-v6-c-form__field-group__field-group--field-group__field-group-toggle--after--BorderTopWidth: var(--pf-v6-c-form__field-group-header-toggle--BorderWidth--base);
   --pf-v6-c-form__field-group-toggle-button--MarginTop: calc(var(--pf-v6-c-button--m-plain--PaddingTop) * -1);
   --pf-v6-c-form__field-group-toggle-button--MarginBottom: calc(var(--pf-v6-c-button--m-plain--PaddingBottom) * -1);
-  --pf-v6-c-form__field-group-toggle-icon--Transition: var(--pf-v6-global--Transition);
+  --pf-v6-c-form__field-group-toggle-icon--Transition: var(--pf-t--global--transition);
   --pf-v6-c-form__field-group-toggle-icon--MinWidth: var(--pf-t--global--font--size--body--default);
   --pf-v6-c-form__field-group-toggle-icon--Rotate: 0;
   --pf-v6-c-form__field-group--m-expanded__toggle-icon--Rotate: 90deg;

package/css/components/FormControl/form-control.css

@@ -16,8 +16,8 @@
   --pf-v6-c-form-control--BackgroundColor: var(--pf-t--global--background--color--control--default);
   --pf-v6-c-form-control--Width: 100%;
   --pf-v6-c-form-control--inset--base: var(--pf-t--global--spacer--md);
-  --pf-v6-c-form-control--PaddingTop: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-form-control--PaddingBottom: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-form-control--PaddingTop: var(--pf-t--global--spacer--control--vertical--default);
+  --pf-v6-c-form-control--PaddingBottom: var(--pf-t--global--spacer--control--vertical--default);
   --pf-v6-c-form-control--PaddingRight: var(--pf-v6-c-form-control--inset--base);
   --pf-v6-c-form-control--PaddingLeft: var(--pf-v6-c-form-control--inset--base);
   --pf-v6-c-form-control--hover--after--BorderWidth: var(--pf-t--global--border--width--control--hover);
@@ -265,5 +265,5 @@
 }
 
 select ~ .pf-v6-c-form-control__utilities {
-  --pf-v5-c-form-control__utilities--PaddingRight: 0;
+  --pf-v6-c-form-control__utilities--PaddingRight: 0;
 }

package/css/components/Hint/hint.css

@@ -17,7 +17,7 @@
   --pf-v6-c-hint__footer--MarginTop: var(--pf-t--global--spacer--sm);
   --pf-v6-c-hint__footer--child--MarginRight: var(--pf-t--global--spacer--md);
   --pf-v6-c-hint__actions--MarginLeft: var(--pf-t--global--spacer--2xl);
-  --pf-v6-c-hint__actions--c-dropdown--MarginTop: calc(var(--pf-v6-global--spacer--form-element) * -1);
+  --pf-v6-c-hint__actions--c-dropdown--MarginTop: calc(var(--pf-t--global--spacer--control--vertical--default) * -1);
 }
 
 .pf-v6-c-hint {

package/css/components/JumpLinks/jump-links.css

@@ -42,14 +42,14 @@
   --pf-v6-c-jump-links__item--m-current__link-text--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-jump-links__label--MarginBottom: var(--pf-t--global--spacer--md);
   --pf-v6-c-jump-links__label--Display: block;
-  --pf-v6-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-v6-global--spacer--form-element));
-  --pf-v6-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-v6-global--spacer--form-element));
+  --pf-v6-c-jump-links__toggle--MarginTop: calc(-1 * var(--pf-t--global--spacer--button--vertical--default));
+  --pf-v6-c-jump-links__toggle--MarginBottom--base: calc(-1 * var(--pf-t--global--spacer--button--vertical--default));
   --pf-v6-c-jump-links__toggle--MarginBottom: var(--pf-v6-c-jump-links__toggle--MarginBottom--base);
   --pf-v6-c-jump-links--m-expanded__toggle--MarginBottom: calc(var(--pf-v6-c-jump-links__toggle--MarginBottom--base) + var(--pf-t--global--spacer--md));
   --pf-v6-c-jump-links__toggle--MarginLeft: calc(-1 * var(--pf-t--global--spacer--md));
   --pf-v6-c-jump-links__toggle--Display: none;
   --pf-v6-c-jump-links__toggle-icon--Color: currentcolor;
-  --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-v6-global--Transition);
+  --pf-v6-c-jump-links__toggle-icon--Transition: var(--pf-t--global--transition);
   --pf-v6-c-jump-links__toggle-icon--Rotate: 0;
   --pf-v6-c-jump-links--m-expanded__toggle-icon--Color: var(--pf-t--global--icon--color--regular);
   --pf-v6-c-jump-links--m-expanded__toggle-icon--Rotate: 90deg;

package/css/components/Label/label.css

@@ -186,6 +186,10 @@
   --pf-v6-c-label--m-editable--m-editable-active--BackgroundColor: transparent;
   --pf-v6-c-label--m-editable--m-editable-active--Color: var(--pf-t--global--text--color--regular);
   --pf-v6-c-label--m-editable--m-editable-active__content--Cursor: initial;
+  --pf-v6-c-label--m-disabled--BackgroundColor: var(--pf-t--global--background--color--disabled--default);
+  --pf-v6-c-label--m-disabled--Color: var(--pf-t--global--text--color--on-disabled);
+  --pf-v6-c-label--m-disabled__icon--Color: var(--pf-t--global--icon--color--on-disabled);
+  --pf-v6-c-label--m-disabled--c-button--disabled--Color: var(--pf-t--global--text--color--on-disabled);
 }
 
 .pf-v6-c-label {
@@ -420,6 +424,16 @@
 .pf-v6-c-label.pf-m-clickable .pf-v6-c-label__content:is(:hover, :focus) ~ .pf-v6-c-label__actions .pf-v6-c-button {
   --pf-v6-c-label--m-filled__actions--c-button--Color: var(--pf-v6-c-label--m-clickable--hover__icon--Color);
 }
+.pf-v6-c-label.pf-m-disabled {
+  --pf-v6-c-label--BackgroundColor: var(--pf-v6-c-label--m-disabled--BackgroundColor);
+  --pf-v6-c-label--Color: var(--pf-v6-c-label--m-disabled--Color);
+  --pf-v6-c-label__icon--Color: var(--pf-v6-c-label--m-disabled__icon--Color);
+  --pf-v6-c-label--BorderWidth: 0;
+  pointer-events: none;
+}
+.pf-v6-c-label.pf-m-disabled .pf-v6-c-button {
+  --pf-v6-c-button--m-plain--disabled--Color: var(--pf-v6-c-label--m-disabled--c-button--disabled--Color);
+}
 
 .pf-v6-c-label,
 .pf-v6-c-label__content {

package/css/components/Label/label.d.ts

@@ -27,7 +27,8 @@ declare const _default: {
     "editableActive": "pf-m-editable-active",
     "overflow": "pf-m-overflow",
     "add": "pf-m-add",
-    "clickable": "pf-m-clickable"
+    "clickable": "pf-m-clickable",
+    "disabled": "pf-m-disabled"
   }
 };
 export default _default;

package/css/components/Label/label.js

@@ -29,6 +29,7 @@ exports.default = {
     "editableActive": "pf-m-editable-active",
     "overflow": "pf-m-overflow",
     "add": "pf-m-add",
-    "clickable": "pf-m-clickable"
+    "clickable": "pf-m-clickable",
+    "disabled": "pf-m-disabled"
   }
 };

package/css/components/Label/label.mjs

@@ -27,6 +27,7 @@ export default {
     "editableActive": "pf-m-editable-active",
     "overflow": "pf-m-overflow",
     "add": "pf-m-add",
-    "clickable": "pf-m-clickable"
+    "clickable": "pf-m-clickable",
+    "disabled": "pf-m-disabled"
   }
 };

package/css/components/List/list.css

@@ -2,7 +2,7 @@
   --pf-v6-c-list--PaddingLeft: var(--pf-t--global--spacer--lg);
   --pf-v6-c-list--nested--MarginTop: var(--pf-t--global--spacer--sm);
   --pf-v6-c-list--nested--MarginLeft: var(--pf-t--global--spacer--sm);
-  --pf-v6-c-list--ul--ListStyle: var(--pf-v6-global--ListStyle);
+  --pf-v6-c-list--ul--ListStyle: var(--pf-t--global--list-style);
   --pf-v6-c-list--li--MarginTop: var(--pf-t--global--spacer--sm);
   --pf-v6-c-list--m-inline--li--MarginRight: var(--pf-t--global--spacer--lg);
   --pf-v6-c-list--m-bordered--li--PaddingBottom: var(--pf-t--global--spacer--sm);