@patternfly/react-core 4.202.36 → 4.202.37

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.202.37 (2022-04-14)
+
+**Note:** Version bump only for package @patternfly/react-core
+
+
+
+
+
 ## 4.202.36 (2022-04-14)
 
 **Note:** Version bump only for package @patternfly/react-core

package/dist/umd/react-core.css

@@ -773,6 +773,7 @@
   --pf-c-form-control--m-expanded--PaddingBottom: calc(var(--pf-global--spacer--form-element) - var(--pf-c-form-control--focus--BorderBottomWidth));
   --pf-c-form-control--m-expanded--BorderBottomColor: var(--pf-global--primary-color--100);
   --pf-c-form-control--placeholder--Color: var(--pf-global--Color--dark-200);
+  --pf-c-form-control--placeholder--child--Color: var(--pf-global--Color--100);
   --pf-c-form-control--disabled--Color: var(--pf-global--disabled-color--100);
   --pf-c-form-control--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
   --pf-c-form-control--disabled--BorderColor: transparent;
@@ -1059,6 +1060,14 @@ select.pf-c-form-control.pf-m-placeholder {
   color: var(--pf-c-form-control--placeholder--Color);
 }
 
+select.pf-c-form-control.pf-m-placeholder * {
+  color: var(--pf-c-form-control--placeholder--child--Color);
+}
+
+select.pf-c-form-control.pf-m-placeholder *:disabled {
+  color: revert;
+}
+
 textarea.pf-c-form-control {
   --pf-c-form-control--success--BackgroundPositionY: var(--pf-c-form-control--textarea--success--BackgroundPositionY);
   --pf-c-form-control--invalid--BackgroundPositionY: var(--pf-c-form-control--textarea--invalid--BackgroundPositionY);
@@ -2715,6 +2724,7 @@ button.pf-c-breadcrumb__link {
   --pf-c-card--m-selectable-raised--m-selected-raised--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base);
   --pf-c-card--m-flat--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-flat--BorderWidth));
   --pf-c-card--m-rounded--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-rounded--BorderRadius));
+  --pf-c-card--m-selectable-raised--m-selected-raised--ZIndex: var(--pf-global--ZIndex--xs);
   --pf-c-card--m-selectable-raised--m-selected-raised--Transition: transform .25s linear, box-shadow .25s linear;
   --pf-c-card--m-selectable-raised--m-selected-raised--before--Transition: transform .25s linear;
   --pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY) * -1);
@@ -2834,6 +2844,7 @@ button.pf-c-breadcrumb__link {
   --pf-c-card--m-selectable-raised--before--Transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--Transition);
   --pf-c-card--m-selectable-raised--before--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY);
   --pf-c-card--m-selectable-raised--before--ScaleY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--ScaleY);
+  z-index: var(--pf-c-card--m-selectable-raised--m-selected-raised--ZIndex);
   box-shadow: var(--pf-c-card--m-selectable-raised--m-selected-raised--BoxShadow);
   transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--Transition);
   transform: translateY(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY));
@@ -18166,6 +18177,11 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-tabs__link--disabled--before--BorderBottomWidth: 0;
 }
 
+.pf-c-tabs.pf-m-border-bottom {
+  --pf-c-tabs--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
+  --pf-c-tabs__link--disabled--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
+}
+
 .pf-c-tabs.pf-m-box .pf-c-tabs__link, .pf-c-tabs.pf-m-vertical .pf-c-tabs__link {
   --pf-c-tabs__link--after--BorderBottomWidth: 0;
 }
@@ -20959,41 +20975,6 @@ svg.pf-c-spinner.pf-m-xl {
   background-color: var(--pf-c-tooltip__content--BackgroundColor);
 }
 
-.pf-c-number-input .pf-c-form-control {
-  appearance: textfield;
-}
-
-.pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
-  appearance: none;
-  margin: 0;
-}
-
-.pf-c-number-input {
-  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
-  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
-  --pf-c-number-input--c-form-control--width-chars: 4;
-  --pf-c-number-input--c-form-control--Width: calc(var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch);
-  display: inline-flex;
-  align-items: center;
-}
-
-.pf-c-number-input .pf-c-form-control {
-  display: inline-flex;
-  width: var(--pf-c-number-input--c-form-control--Width);
-  text-align: right;
-}
-
-.pf-c-input-group + .pf-c-number-input__unit,
-.pf-c-number-input__unit + .pf-c-input-group {
-  margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
-}
-
-.pf-c-number-input__icon {
-  display: flex;
-  font-size: var(--pf-c-number-input__icon--FontSize);
-}
-
 .pf-c-tree-view {
   --pf-c-tree-view--PaddingTop: var(--pf-global--spacer--sm);
   --pf-c-tree-view--PaddingBottom: var(--pf-global--spacer--sm);
@@ -21463,6 +21444,41 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-tree-view--m-compact--m-no-background--border--nested--Left: calc(var(--pf-c-tree-view__node--PaddingLeft) - var(--pf-c-tree-view--m-compact--m-no-background--base-border--Left--offset));
 }
 
+.pf-c-number-input .pf-c-form-control {
+  appearance: textfield;
+}
+
+.pf-c-number-input .pf-c-form-control::-webkit-inner-spin-button, .pf-c-number-input .pf-c-form-control::-webkit-outer-spin-button {
+  appearance: none;
+  margin: 0;
+}
+
+.pf-c-number-input {
+  --pf-c-number-input__unit--c-input-group--MarginLeft: var(--pf-global--spacer--sm);
+  --pf-c-number-input__icon--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-number-input--c-form-control--width-base: calc(var(--pf-global--spacer--sm) * 2 + var(--pf-global--BorderWidth--sm) * 2);
+  --pf-c-number-input--c-form-control--width-chars: 4;
+  --pf-c-number-input--c-form-control--Width: calc(var(--pf-c-number-input--c-form-control--width-base) + var(--pf-c-number-input--c-form-control--width-chars) * 1ch);
+  display: inline-flex;
+  align-items: center;
+}
+
+.pf-c-number-input .pf-c-form-control {
+  display: inline-flex;
+  width: var(--pf-c-number-input--c-form-control--Width);
+  text-align: right;
+}
+
+.pf-c-input-group + .pf-c-number-input__unit,
+.pf-c-number-input__unit + .pf-c-input-group {
+  margin-left: var(--pf-c-number-input__unit--c-input-group--MarginLeft);
+}
+
+.pf-c-number-input__icon {
+  display: flex;
+  font-size: var(--pf-c-number-input__icon--FontSize);
+}
+
 .pf-c-wizard__header {
   --pf-global--Color--100: var(--pf-global--Color--light-100);
   --pf-global--Color--200: var(--pf-global--Color--light-200);

package/dist/umd/react-core.js

@@ -18132,6 +18132,7 @@
         "scrollable": "pf-m-scrollable",
         "secondary": "pf-m-secondary",
         "noBorderBottom": "pf-m-no-border-bottom",
+        "borderBottom": "pf-m-border-bottom",
         "box": "pf-m-box",
         "vertical": "pf-m-vertical",
         "current": "pf-m-current",

package/dist/umd/react-core.min.css

@@ -773,6 +773,7 @@
   --pf-c-form-control--m-expanded--PaddingBottom: calc(var(--pf-global--spacer--form-element) - var(--pf-c-form-control--focus--BorderBottomWidth));
   --pf-c-form-control--m-expanded--BorderBottomColor: var(--pf-global--primary-color--100);
   --pf-c-form-control--placeholder--Color: var(--pf-global--Color--dark-200);
+  --pf-c-form-control--placeholder--child--Color: var(--pf-global--Color--100);
   --pf-c-form-control--disabled--Color: var(--pf-global--disabled-color--100);
   --pf-c-form-control--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
   --pf-c-form-control--disabled--BorderColor: transparent;
@@ -1059,6 +1060,14 @@ select.pf-c-form-control.pf-m-placeholder {
   color: var(--pf-c-form-control--placeholder--Color);
 }
 
+select.pf-c-form-control.pf-m-placeholder * {
+  color: var(--pf-c-form-control--placeholder--child--Color);
+}
+
+select.pf-c-form-control.pf-m-placeholder *:disabled {
+  color: revert;
+}
+
 textarea.pf-c-form-control {
   --pf-c-form-control--success--BackgroundPositionY: var(--pf-c-form-control--textarea--success--BackgroundPositionY);
   --pf-c-form-control--invalid--BackgroundPositionY: var(--pf-c-form-control--textarea--invalid--BackgroundPositionY);
@@ -2715,6 +2724,7 @@ button.pf-c-breadcrumb__link {
   --pf-c-card--m-selectable-raised--m-selected-raised--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base);
   --pf-c-card--m-flat--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-flat--BorderWidth));
   --pf-c-card--m-rounded--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-rounded--BorderRadius));
+  --pf-c-card--m-selectable-raised--m-selected-raised--ZIndex: var(--pf-global--ZIndex--xs);
   --pf-c-card--m-selectable-raised--m-selected-raised--Transition: transform .25s linear, box-shadow .25s linear;
   --pf-c-card--m-selectable-raised--m-selected-raised--before--Transition: transform .25s linear;
   --pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY) * -1);
@@ -2834,6 +2844,7 @@ button.pf-c-breadcrumb__link {
   --pf-c-card--m-selectable-raised--before--Transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--Transition);
   --pf-c-card--m-selectable-raised--before--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY);
   --pf-c-card--m-selectable-raised--before--ScaleY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--ScaleY);
+  z-index: var(--pf-c-card--m-selectable-raised--m-selected-raised--ZIndex);
   box-shadow: var(--pf-c-card--m-selectable-raised--m-selected-raised--BoxShadow);
   transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--Transition);
   transform: translateY(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY));
@@ -18166,6 +18177,11 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-tabs__link--disabled--before--BorderBottomWidth: 0;
 }
 
+.pf-c-tabs.pf-m-border-bottom {
+  --pf-c-tabs--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
+  --pf-c-tabs__link--disabled--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
+}
+
 .pf-c-tabs.pf-m-box .pf-c-tabs__link, .pf-c-tabs.pf-m-vertical .pf-c-tabs__link {
   --pf-c-tabs__link--after--BorderBottomWidth: 0;
 }