@patternfly/react-core 4.205.0 → 4.205.1

package/CHANGELOG.md

@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 4.205.1 (2022-04-19)
+
+**Note:** Version bump only for package @patternfly/react-core
+
+
+
+
+
 # 4.205.0 (2022-04-18)
 
 

package/dist/umd/react-core.css

@@ -5616,27 +5616,45 @@ label.pf-c-check, .pf-c-check__label,
   }
 }
 .pf-c-divider {
-  --pf-c-divider--Height: var(--pf-global--BorderWidth--sm);
+  --pf-c-divider--BorderWidth--base: var(--pf-global--BorderWidth--sm);
+  --pf-c-divider--BorderColor--base: var(--pf-c-divider--BackgroundColor);
+  --pf-c-divider--Height: var(--pf-c-divider--BorderWidth--base);
   --pf-c-divider--BackgroundColor: var(--pf-global--BorderColor--100);
-  --pf-c-divider--after--Height: var(--pf-c-divider--Height);
-  --pf-c-divider--after--BackgroundColor: var(--pf-c-divider--BackgroundColor);
-  --pf-c-divider--Display: flex;
+  --pf-c-divider--after--BackgroundColor: var(--pf-c-divider--BorderColor--base);
   --pf-c-divider--after--FlexBasis: 100%;
   --pf-c-divider--after--Inset: 0%;
   --pf-c-divider--m-vertical--after--FlexBasis: 100%;
-  --pf-c-divider--m-vertical--after--Width: var(--pf-global--BorderWidth--sm);
+  --pf-c-divider--m-horizontal--Display: flex;
+  --pf-c-divider--m-horizontal--FlexDirection: row;
+  --pf-c-divider--m-horizontal--after--Height: var(--pf-c-divider--Height);
+  --pf-c-divider--m-horizontal--after--Width: auto;
+  --pf-c-divider--m-vertical--Display: inline-flex;
+  --pf-c-divider--m-vertical--FlexDirection: column;
+  --pf-c-divider--m-vertical--after--Height: auto;
+  --pf-c-divider--m-vertical--after--Width: var(--pf-c-divider--BorderWidth--base);
   --pf-hidden-visible--visible--Display: var(--pf-c-divider--Display);
+  --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+  --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+  --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+  --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+  width: 100%;
+  height: auto;
+  display: var(--pf-c-divider--Display);
+  flex-direction: var(--pf-c-divider--FlexDirection);
   align-items: center;
   align-self: stretch;
   flex-shrink: 0;
   justify-content: center;
-  width: 100%;
   border: 0;
 }
 
 .pf-c-divider::after {
   flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+}
+
+.pf-c-divider::after {
   align-self: stretch;
+  width: var(--pf-c-divider--after--Width);
   height: var(--pf-c-divider--after--Height);
   content: "";
   background-color: var(--pf-c-divider--after--BackgroundColor);
@@ -5644,17 +5662,16 @@ label.pf-c-check, .pf-c-check__label,
 }
 
 .pf-c-divider.pf-m-vertical {
-  display: inline-flex;
-  flex-direction: column;
+  --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+  --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+  --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+  --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
   width: auto;
   height: inherit;
-  min-height: 100%;
-  max-height: 100%;
 }
 
 .pf-c-divider.pf-m-vertical::after {
   flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
-  width: var(--pf-c-divider--m-vertical--after--Width);
 }
 
 .pf-c-divider.pf-m-inset-none {
@@ -5689,6 +5706,34 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
 }
 
+@media (min-width: 576px) {
+  .pf-c-divider.pf-m-horizontal-on-sm {
+    --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+    width: 100%;
+    height: auto;
+  }
+
+  .pf-c-divider.pf-m-horizontal-on-sm::after {
+    flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+  }
+}
+@media (min-width: 576px) {
+  .pf-c-divider.pf-m-vertical-on-sm {
+    --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
+    width: auto;
+    height: inherit;
+  }
+
+  .pf-c-divider.pf-m-vertical-on-sm::after {
+    flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
+  }
+}
 @media (min-width: 576px) {
   .pf-c-divider.pf-m-inset-none-on-sm {
     --pf-c-divider--after--Inset: 0%;
@@ -5722,6 +5767,34 @@ label.pf-c-check, .pf-c-check__label,
     --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
   }
 }
+@media (min-width: 768px) {
+  .pf-c-divider.pf-m-horizontal-on-md {
+    --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+    width: 100%;
+    height: auto;
+  }
+
+  .pf-c-divider.pf-m-horizontal-on-md::after {
+    flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+  }
+}
+@media (min-width: 768px) {
+  .pf-c-divider.pf-m-vertical-on-md {
+    --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
+    width: auto;
+    height: inherit;
+  }
+
+  .pf-c-divider.pf-m-vertical-on-md::after {
+    flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
+  }
+}
 @media (min-width: 768px) {
   .pf-c-divider.pf-m-inset-none-on-md {
     --pf-c-divider--after--Inset: 0%;
@@ -5755,6 +5828,34 @@ label.pf-c-check, .pf-c-check__label,
     --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
   }
 }
+@media (min-width: 992px) {
+  .pf-c-divider.pf-m-horizontal-on-lg {
+    --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+    width: 100%;
+    height: auto;
+  }
+
+  .pf-c-divider.pf-m-horizontal-on-lg::after {
+    flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+  }
+}
+@media (min-width: 992px) {
+  .pf-c-divider.pf-m-vertical-on-lg {
+    --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
+    width: auto;
+    height: inherit;
+  }
+
+  .pf-c-divider.pf-m-vertical-on-lg::after {
+    flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
+  }
+}
 @media (min-width: 992px) {
   .pf-c-divider.pf-m-inset-none-on-lg {
     --pf-c-divider--after--Inset: 0%;
@@ -5788,6 +5889,34 @@ label.pf-c-check, .pf-c-check__label,
     --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
   }
 }
+@media (min-width: 1200px) {
+  .pf-c-divider.pf-m-horizontal-on-xl {
+    --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+    width: 100%;
+    height: auto;
+  }
+
+  .pf-c-divider.pf-m-horizontal-on-xl::after {
+    flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+  }
+}
+@media (min-width: 1200px) {
+  .pf-c-divider.pf-m-vertical-on-xl {
+    --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
+    width: auto;
+    height: inherit;
+  }
+
+  .pf-c-divider.pf-m-vertical-on-xl::after {
+    flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
+  }
+}
 @media (min-width: 1200px) {
   .pf-c-divider.pf-m-inset-none-on-xl {
     --pf-c-divider--after--Inset: 0%;
@@ -5821,6 +5950,34 @@ label.pf-c-check, .pf-c-check__label,
     --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
   }
 }
+@media (min-width: 1450px) {
+  .pf-c-divider.pf-m-horizontal-on-2xl {
+    --pf-c-divider--Display: var(--pf-c-divider--m-horizontal--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-horizontal--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-horizontal--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-horizontal--after--Height);
+    width: 100%;
+    height: auto;
+  }
+
+  .pf-c-divider.pf-m-horizontal-on-2xl::after {
+    flex-basis: calc(var(--pf-c-divider--after--FlexBasis) - var(--pf-c-divider--after--Inset) * 2);
+  }
+}
+@media (min-width: 1450px) {
+  .pf-c-divider.pf-m-vertical-on-2xl {
+    --pf-c-divider--Display: var(--pf-c-divider--m-vertical--Display);
+    --pf-c-divider--FlexDirection: var(--pf-c-divider--m-vertical--FlexDirection);
+    --pf-c-divider--after--Width: var(--pf-c-divider--m-vertical--after--Width);
+    --pf-c-divider--after--Height: var(--pf-c-divider--m-vertical--after--Height);
+    width: auto;
+    height: inherit;
+  }
+
+  .pf-c-divider.pf-m-vertical-on-2xl::after {
+    flex-basis: calc(var(--pf-c-divider--m-vertical--after--FlexBasis) - var(--pf-c-divider--after--Inset));
+  }
+}
 @media (min-width: 1450px) {
   .pf-c-divider.pf-m-inset-none-on-2xl {
     --pf-c-divider--after--Inset: 0%;
@@ -14631,6 +14788,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-page__main-wizard--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
   --pf-c-page__main-wizard--BorderTopColor: var(--pf-global--BorderColor--100);
   --pf-c-page__main-wizard--BorderTopWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-page__main-wizard--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);
   display: grid;
   height: 100%;
   grid-template-columns: 1fr;
@@ -15221,6 +15379,10 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
   --pf-c-page__main-wizard--BorderTopWidth: 0;
 }
 
+.pf-c-page__main-wizard.pf-m-light-200 {
+  --pf-c-page__main-wizard--BackgroundColor: var(--pf-c-page__main-wizard--m-light-200--BackgroundColor);
+}
+
 .pf-c-page__main-wizard .pf-c-page__main-body {
   min-height: 0;
 }
@@ -21779,7 +21941,7 @@ svg.pf-c-spinner.pf-m-xl {
   min-height: 0;
 }
 
-.pf-c-wizard > *:not(.pf-c-wizard__outer-wrap) {
+.pf-c-wizard > :not(.pf-c-wizard__outer-wrap):not(.pf-c-drawer) {
   flex-shrink: 0;
 }
 

package/dist/umd/react-core.js

@@ -5059,6 +5059,8 @@
         "insetXl": "pf-m-inset-xl",
         "inset_2xl": "pf-m-inset-2xl",
         "inset_3xl": "pf-m-inset-3xl",
+        "horizontalOnSm": "pf-m-horizontal-on-sm",
+        "verticalOnSm": "pf-m-vertical-on-sm",
         "insetNoneOnSm": "pf-m-inset-none-on-sm",
         "insetXsOnSm": "pf-m-inset-xs-on-sm",
         "insetSmOnSm": "pf-m-inset-sm-on-sm",
@@ -5067,6 +5069,8 @@
         "insetXlOnSm": "pf-m-inset-xl-on-sm",
         "inset_2xlOnSm": "pf-m-inset-2xl-on-sm",
         "inset_3xlOnSm": "pf-m-inset-3xl-on-sm",
+        "horizontalOnMd": "pf-m-horizontal-on-md",
+        "verticalOnMd": "pf-m-vertical-on-md",
         "insetNoneOnMd": "pf-m-inset-none-on-md",
         "insetXsOnMd": "pf-m-inset-xs-on-md",
         "insetSmOnMd": "pf-m-inset-sm-on-md",
@@ -5075,6 +5079,8 @@
         "insetXlOnMd": "pf-m-inset-xl-on-md",
         "inset_2xlOnMd": "pf-m-inset-2xl-on-md",
         "inset_3xlOnMd": "pf-m-inset-3xl-on-md",
+        "horizontalOnLg": "pf-m-horizontal-on-lg",
+        "verticalOnLg": "pf-m-vertical-on-lg",
         "insetNoneOnLg": "pf-m-inset-none-on-lg",
         "insetXsOnLg": "pf-m-inset-xs-on-lg",
         "insetSmOnLg": "pf-m-inset-sm-on-lg",
@@ -5083,6 +5089,8 @@
         "insetXlOnLg": "pf-m-inset-xl-on-lg",
         "inset_2xlOnLg": "pf-m-inset-2xl-on-lg",
         "inset_3xlOnLg": "pf-m-inset-3xl-on-lg",
+        "horizontalOnXl": "pf-m-horizontal-on-xl",
+        "verticalOnXl": "pf-m-vertical-on-xl",
         "insetNoneOnXl": "pf-m-inset-none-on-xl",
         "insetXsOnXl": "pf-m-inset-xs-on-xl",
         "insetSmOnXl": "pf-m-inset-sm-on-xl",
@@ -5091,6 +5099,8 @@
         "insetXlOnXl": "pf-m-inset-xl-on-xl",
         "inset_2xlOnXl": "pf-m-inset-2xl-on-xl",
         "inset_3xlOnXl": "pf-m-inset-3xl-on-xl",
+        "horizontalOn_2xl": "pf-m-horizontal-on-2xl",
+        "verticalOn_2xl": "pf-m-vertical-on-2xl",
         "insetNoneOn_2xl": "pf-m-inset-none-on-2xl",
         "insetXsOn_2xl": "pf-m-inset-xs-on-2xl",
         "insetSmOn_2xl": "pf-m-inset-sm-on-2xl",
@@ -14371,7 +14381,8 @@
         "paddingOnXl": "pf-m-padding-on-xl",
         "noPaddingOnXl": "pf-m-no-padding-on-xl",
         "paddingOn_2xl": "pf-m-padding-on-2xl",
-        "noPaddingOn_2xl": "pf-m-no-padding-on-2xl"
+        "noPaddingOn_2xl": "pf-m-no-padding-on-2xl",
+        "light_200": "pf-m-light-200"
       },
       "nav": "pf-c-nav",
       "notificationBadge": "pf-c-notification-badge",
@@ -19905,6 +19916,7 @@
     var styles$a = {
       "button": "pf-c-button",
       "card": "pf-c-card",
+      "drawer": "pf-c-drawer",
       "modalBox": "pf-c-modal-box",
       "modifiers": {
         "finished": "pf-m-finished",