@patternfly/react-styles 5.0.0-alpha.1 → 5.0.0-alpha.3

package/css/components/SearchInput/search-input.css

@@ -12,6 +12,7 @@
   --pf-c-search-input__text-input--PaddingLeft: var(--pf-global--spacer--xl);
   --pf-c-search-input__text-input--MinWidth: 6ch;
   --pf-c-search-input__text-input--m-hint--Color: var(--pf-global--Color--dark-200);
+  --pf-c-search-input__text-input--BackgroundColor: transparent;
   --pf-c-search-input__icon--Left: var(--pf-global--spacer--sm);
   --pf-c-search-input__icon--Color: var(--pf-global--Color--200);
   --pf-c-search-input__text--hover__icon--Color: var(--pf-global--Color--100);
@@ -99,6 +100,7 @@
   width: 100%;
   min-width: var(--pf-c-search-input__text-input--MinWidth);
   padding: var(--pf-c-search-input__text-input--PaddingTop) var(--pf-c-search-input__text-input--PaddingRight) var(--pf-c-search-input__text-input--PaddingBottom) var(--pf-c-search-input__text-input--PaddingLeft);
+  background-color: var(--pf-c-search-input__text-input--BackgroundColor);
   border: 0;
 }
 .pf-c-search-input__text-input, .pf-c-search-input__text-input.pf-m-hint {

package/css/components/Table/table-grid.css

@@ -418,7 +418,7 @@
     border-bottom: var(--pf-c-table-tr--responsive--border-width--base) solid var(--pf-c-table--responsive--BorderColor);
   }
   .pf-m-grid-md.pf-c-table tr:last-child,
-.pf-m-grid-md.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
+  .pf-m-grid-md.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
     border-bottom-width: var(--pf-c-table-tr--responsive--last-child--BorderBottomWidth);
   }
   .pf-m-grid-md.pf-c-table tbody.pf-m-expanded {
@@ -563,7 +563,7 @@
     --pf-c-table--tbody--after--BorderLeftColor: transparent;
   }
   .pf-m-grid-md.pf-c-table tbody.pf-m-hoverable,
-.pf-m-grid-md.pf-c-table tbody.pf-m-hoverable > tr {
+  .pf-m-grid-md.pf-c-table tbody.pf-m-hoverable > tr {
     position: relative;
   }
   .pf-m-grid-md.pf-c-table tbody.pf-m-hoverable > tr::after {
@@ -593,9 +593,9 @@
     background-color: var(--pf-c-table--tr--m-selected--after--BorderLeftColor);
   }
   .pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__toggle,
-.pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
-.pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
-.pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
+  .pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
+  .pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
+  .pf-m-grid-md.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
     width: auto;
     padding: 0;
   }
@@ -615,8 +615,8 @@
     --pf-c-table--cell--PaddingLeft: var(--pf-c-table--m-grid--cell--PaddingLeft);
   }
   .pf-m-grid-md.pf-c-table .pf-c-table__check,
-.pf-m-grid-md.pf-c-table .pf-c-table__favorite,
-.pf-m-grid-md.pf-c-table .pf-c-table__action {
+  .pf-m-grid-md.pf-c-table .pf-c-table__favorite,
+  .pf-m-grid-md.pf-c-table .pf-c-table__action {
     grid-row-start: 1;
     grid-column-start: 2;
   }
@@ -733,7 +733,7 @@
     border-bottom: var(--pf-c-table-tr--responsive--border-width--base) solid var(--pf-c-table--responsive--BorderColor);
   }
   .pf-m-grid-lg.pf-c-table tr:last-child,
-.pf-m-grid-lg.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
+  .pf-m-grid-lg.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
     border-bottom-width: var(--pf-c-table-tr--responsive--last-child--BorderBottomWidth);
   }
   .pf-m-grid-lg.pf-c-table tbody.pf-m-expanded {
@@ -878,7 +878,7 @@
     --pf-c-table--tbody--after--BorderLeftColor: transparent;
   }
   .pf-m-grid-lg.pf-c-table tbody.pf-m-hoverable,
-.pf-m-grid-lg.pf-c-table tbody.pf-m-hoverable > tr {
+  .pf-m-grid-lg.pf-c-table tbody.pf-m-hoverable > tr {
     position: relative;
   }
   .pf-m-grid-lg.pf-c-table tbody.pf-m-hoverable > tr::after {
@@ -908,9 +908,9 @@
     background-color: var(--pf-c-table--tr--m-selected--after--BorderLeftColor);
   }
   .pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__toggle,
-.pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
-.pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
-.pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
+  .pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
+  .pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
+  .pf-m-grid-lg.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
     width: auto;
     padding: 0;
   }
@@ -930,8 +930,8 @@
     --pf-c-table--cell--PaddingLeft: var(--pf-c-table--m-grid--cell--PaddingLeft);
   }
   .pf-m-grid-lg.pf-c-table .pf-c-table__check,
-.pf-m-grid-lg.pf-c-table .pf-c-table__favorite,
-.pf-m-grid-lg.pf-c-table .pf-c-table__action {
+  .pf-m-grid-lg.pf-c-table .pf-c-table__favorite,
+  .pf-m-grid-lg.pf-c-table .pf-c-table__action {
     grid-row-start: 1;
     grid-column-start: 2;
   }
@@ -1048,7 +1048,7 @@
     border-bottom: var(--pf-c-table-tr--responsive--border-width--base) solid var(--pf-c-table--responsive--BorderColor);
   }
   .pf-m-grid-xl.pf-c-table tr:last-child,
-.pf-m-grid-xl.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
+  .pf-m-grid-xl.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
     border-bottom-width: var(--pf-c-table-tr--responsive--last-child--BorderBottomWidth);
   }
   .pf-m-grid-xl.pf-c-table tbody.pf-m-expanded {
@@ -1193,7 +1193,7 @@
     --pf-c-table--tbody--after--BorderLeftColor: transparent;
   }
   .pf-m-grid-xl.pf-c-table tbody.pf-m-hoverable,
-.pf-m-grid-xl.pf-c-table tbody.pf-m-hoverable > tr {
+  .pf-m-grid-xl.pf-c-table tbody.pf-m-hoverable > tr {
     position: relative;
   }
   .pf-m-grid-xl.pf-c-table tbody.pf-m-hoverable > tr::after {
@@ -1223,9 +1223,9 @@
     background-color: var(--pf-c-table--tr--m-selected--after--BorderLeftColor);
   }
   .pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__toggle,
-.pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
-.pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
-.pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
+  .pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
+  .pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
+  .pf-m-grid-xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
     width: auto;
     padding: 0;
   }
@@ -1245,8 +1245,8 @@
     --pf-c-table--cell--PaddingLeft: var(--pf-c-table--m-grid--cell--PaddingLeft);
   }
   .pf-m-grid-xl.pf-c-table .pf-c-table__check,
-.pf-m-grid-xl.pf-c-table .pf-c-table__favorite,
-.pf-m-grid-xl.pf-c-table .pf-c-table__action {
+  .pf-m-grid-xl.pf-c-table .pf-c-table__favorite,
+  .pf-m-grid-xl.pf-c-table .pf-c-table__action {
     grid-row-start: 1;
     grid-column-start: 2;
   }
@@ -1363,7 +1363,7 @@
     border-bottom: var(--pf-c-table-tr--responsive--border-width--base) solid var(--pf-c-table--responsive--BorderColor);
   }
   .pf-m-grid-2xl.pf-c-table tr:last-child,
-.pf-m-grid-2xl.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
+  .pf-m-grid-2xl.pf-c-table tbody:last-of-type:not(:only-of-type) > tr {
     border-bottom-width: var(--pf-c-table-tr--responsive--last-child--BorderBottomWidth);
   }
   .pf-m-grid-2xl.pf-c-table tbody.pf-m-expanded {
@@ -1508,7 +1508,7 @@
     --pf-c-table--tbody--after--BorderLeftColor: transparent;
   }
   .pf-m-grid-2xl.pf-c-table tbody.pf-m-hoverable,
-.pf-m-grid-2xl.pf-c-table tbody.pf-m-hoverable > tr {
+  .pf-m-grid-2xl.pf-c-table tbody.pf-m-hoverable > tr {
     position: relative;
   }
   .pf-m-grid-2xl.pf-c-table tbody.pf-m-hoverable > tr::after {
@@ -1538,9 +1538,9 @@
     background-color: var(--pf-c-table--tr--m-selected--after--BorderLeftColor);
   }
   .pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__toggle,
-.pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
-.pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
-.pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
+  .pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__check,
+  .pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__favorite,
+  .pf-m-grid-2xl.pf-c-table tr:not(.pf-c-table__expandable-row) .pf-c-table__action {
     width: auto;
     padding: 0;
   }
@@ -1560,8 +1560,8 @@
     --pf-c-table--cell--PaddingLeft: var(--pf-c-table--m-grid--cell--PaddingLeft);
   }
   .pf-m-grid-2xl.pf-c-table .pf-c-table__check,
-.pf-m-grid-2xl.pf-c-table .pf-c-table__favorite,
-.pf-m-grid-2xl.pf-c-table .pf-c-table__action {
+  .pf-m-grid-2xl.pf-c-table .pf-c-table__favorite,
+  .pf-m-grid-2xl.pf-c-table .pf-c-table__action {
     grid-row-start: 1;
     grid-column-start: 2;
   }

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

@@ -311,7 +311,7 @@
     display: block;
   }
   .pf-m-tree-view-grid-md.pf-c-table .pf-c-table__tree-view-details-toggle,
-.pf-m-tree-view-grid-md.pf-c-table .pf-c-table__action {
+  .pf-m-tree-view-grid-md.pf-c-table .pf-c-table__action {
     display: inline-block;
   }
   .pf-m-tree-view-grid-md.pf-c-table .pf-c-table__action {
@@ -452,7 +452,7 @@
     display: block;
   }
   .pf-m-tree-view-grid-lg.pf-c-table .pf-c-table__tree-view-details-toggle,
-.pf-m-tree-view-grid-lg.pf-c-table .pf-c-table__action {
+  .pf-m-tree-view-grid-lg.pf-c-table .pf-c-table__action {
     display: inline-block;
   }
   .pf-m-tree-view-grid-lg.pf-c-table .pf-c-table__action {
@@ -593,7 +593,7 @@
     display: block;
   }
   .pf-m-tree-view-grid-xl.pf-c-table .pf-c-table__tree-view-details-toggle,
-.pf-m-tree-view-grid-xl.pf-c-table .pf-c-table__action {
+  .pf-m-tree-view-grid-xl.pf-c-table .pf-c-table__action {
     display: inline-block;
   }
   .pf-m-tree-view-grid-xl.pf-c-table .pf-c-table__action {
@@ -734,7 +734,7 @@
     display: block;
   }
   .pf-m-tree-view-grid-2xl.pf-c-table .pf-c-table__tree-view-details-toggle,
-.pf-m-tree-view-grid-2xl.pf-c-table .pf-c-table__action {
+  .pf-m-tree-view-grid-2xl.pf-c-table .pf-c-table__action {
     display: inline-block;
   }
   .pf-m-tree-view-grid-2xl.pf-c-table .pf-c-table__action {

package/css/components/Tabs/tabs.css

@@ -115,7 +115,6 @@
   --pf-c-tabs__item-action--last-child--c-button--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-tabs__item-action--c-button--OutlineOffset: -0.1875rem;
   --pf-c-tabs__item-action-icon--MarginTop: 0.125rem;
-  --pf-c-tabs__item-action--m-help--c-button--PaddingLeft: var(--pf-global--spacer--xs);
   --pf-c-tabs__add--before--BorderColor: var(--pf-c-tabs__link--before--border-color--base);
   --pf-c-tabs__add--before--BorderLeftWidth: var(--pf-c-tabs__link--before--border-width--base);
   --pf-c-tabs__add--c-button--FontSize: var(--pf-global--FontSize--sm);
@@ -589,9 +588,6 @@
   --pf-c-button--PaddingLeft: var(--pf-c-tabs__item-action--c-button--PaddingLeft);
   outline-offset: var(--pf-c-tabs__item-action--c-button--OutlineOffset);
 }
-.pf-c-tabs__item-action.pf-m-help {
-  --pf-c-tabs__item-action--c-button--PaddingLeft: var(--pf-c-tabs__item-action--m-help--c-button--PaddingLeft);
-}
 .pf-c-tabs__item-action:last-child {
   --pf-c-tabs__item-action--c-button--PaddingRight: var(--pf-c-tabs__item-action--last-child--c-button--PaddingRight);
 }

package/css/components/Tabs/tabs.d.ts

@@ -29,7 +29,6 @@ declare const _default: {
     "active": "pf-m-active",
     "disabled": "pf-m-disabled",
     "ariaDisabled": "pf-m-aria-disabled",
-    "help": "pf-m-help",
     "insetNone": "pf-m-inset-none",
     "insetSm": "pf-m-inset-sm",
     "insetMd": "pf-m-inset-md",

package/css/components/Tabs/tabs.js

@@ -31,7 +31,6 @@ exports.default = {
     "active": "pf-m-active",
     "disabled": "pf-m-disabled",
     "ariaDisabled": "pf-m-aria-disabled",
-    "help": "pf-m-help",
     "insetNone": "pf-m-inset-none",
     "insetSm": "pf-m-inset-sm",
     "insetMd": "pf-m-inset-md",

package/css/components/Tabs/tabs.mjs

@@ -29,7 +29,6 @@ export default {
     "active": "pf-m-active",
     "disabled": "pf-m-disabled",
     "ariaDisabled": "pf-m-aria-disabled",
-    "help": "pf-m-help",
     "insetNone": "pf-m-inset-none",
     "insetSm": "pf-m-inset-sm",
     "insetMd": "pf-m-inset-md",

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

@@ -20,7 +20,8 @@
   --pf-c-text-input-group__text-input--PaddingLeft: var(--pf-global--spacer--sm);
   --pf-c-text-input-group__text-input--MinWidth: 12ch;
   --pf-c-text-input-group__text-input--m-hint--Color: var(--pf-global--Color--dark-200);
-  --pf-c-text-input-group--placeholder--Color: var(--pf-global--Color--dark-200);
+  --pf-c-text-input-group__text-input--placeholder--Color: var(--pf-global--Color--dark-200);
+  --pf-c-text-input-group__text-input--BackgroundColor: transparent;
   --pf-c-text-input-group__icon--Left: var(--pf-global--spacer--sm);
   --pf-c-text-input-group__icon--Color: var(--pf-global--Color--200);
   --pf-c-text-input-group__text--hover__icon--Color: var(--pf-global--Color--100);
@@ -120,6 +121,7 @@
   width: 100%;
   min-width: var(--pf-c-text-input-group__text-input--MinWidth);
   padding: var(--pf-c-text-input-group__text-input--PaddingTop) var(--pf-c-text-input-group__text-input--PaddingRight) var(--pf-c-text-input-group__text-input--PaddingBottom) var(--pf-c-text-input-group__text-input--PaddingLeft);
+  background-color: var(--pf-c-text-input-group__text-input--BackgroundColor);
   border: 0;
 }
 .pf-c-text-input-group__text-input, .pf-c-text-input-group__text-input.pf-m-hint {
@@ -129,7 +131,7 @@
   color: var(--pf-c-text-input-group__text-input--m-hint--Color);
 }
 .pf-c-text-input-group__text-input::placeholder {
-  color: var(--pf-c-text-input-group--placeholder--Color);
+  color: var(--pf-c-text-input-group__text-input--placeholder--Color);
 }
 
 .pf-c-text-input-group__utilities {

package/css/components/Toolbar/toolbar.css

@@ -54,13 +54,17 @@
   --pf-c-toolbar--PaddingBottom: var(--pf-global--spacer--md);
   --pf-c-toolbar__item--Display: block;
   --pf-c-toolbar__item--MinWidth--base: auto;
+  --pf-c-toolbar__item--AlignSelf: auto;
   --pf-c-toolbar__group--Display: flex;
+  --pf-c-toolbar__group--AlignItems: baseline;
+  --pf-c-toolbar__group--AlignSelf: auto;
   --pf-c-toolbar--m-sticky--ZIndex: var(--pf-global--ZIndex--xs);
   --pf-c-toolbar--m-sticky--BoxShadow: var(--pf-global--BoxShadow--sm-bottom);
   --pf-c-toolbar__content--Display: flex;
   --pf-c-toolbar__content--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-toolbar__content--PaddingLeft: var(--pf-global--spacer--md);
   --pf-c-toolbar__content-section--Display: flex;
+  --pf-c-toolbar__content-section--AlignItems: baseline;
   --pf-c-toolbar--m-page-insets--inset: var(--pf-global--spacer--md);
   --pf-c-toolbar--m-page-insets--xl--inset: var(--pf-global--spacer--lg);
   --pf-c-toolbar__expandable-content--Display: grid;
@@ -182,9 +186,22 @@
 .pf-c-toolbar__group {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--spacer);
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__group--Display);
-  align-items: center;
+  align-items: var(--pf-c-toolbar__group--AlignItems);
+  align-self: var(--pf-c-toolbar__group--AlignSelf);
   margin-right: var(--pf-c-toolbar--spacer);
 }
+.pf-c-toolbar__group.pf-m-align-items-center {
+  align-items: center;
+}
+.pf-c-toolbar__group.pf-m-align-items-baseline {
+  align-items: baseline;
+}
+.pf-c-toolbar__group.pf-m-align-self-center {
+  align-self: center;
+}
+.pf-c-toolbar__group.pf-m-align-self-baseline {
+  align-self: baseline;
+}
 .pf-c-toolbar__group.pf-m-button-group {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-button-group--spacer);
 }
@@ -225,6 +242,7 @@
   --pf-c-toolbar__item--Width--base: var(--pf-c-toolbar__item--Width);
   --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth);
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__item--Display);
+  align-self: var(--pf-c-toolbar__item--AlignSelf);
   width: var(--pf-c-toolbar__item--Width--base);
   min-width: var(--pf-c-toolbar__item--MinWidth--base);
   margin-right: var(--pf-c-toolbar--spacer);
@@ -279,6 +297,12 @@
     --pf-c-toolbar__item--MinWidth--base: var(--pf-c-toolbar__item--MinWidth-on-2xl, var(--pf-c-toolbar__item--MinWidth-on-xl, var(--pf-c-toolbar__item--MinWidth-on-lg, var(--pf-c-toolbar__item--MinWidth-on-md, var(--pf-c-toolbar__item--MinWidth-on-sm, var(--pf-c-toolbar__item--MinWidth))))));
   }
 }
+.pf-c-toolbar__item.pf-m-align-self-center {
+  align-self: center;
+}
+.pf-c-toolbar__item.pf-m-align-self-baseline {
+  align-self: baseline;
+}
 .pf-c-toolbar__item.pf-m-overflow-menu {
   --pf-c-toolbar--spacer: var(--pf-c-toolbar__item--m-overflow-menu--spacer);
 }
@@ -323,20 +347,24 @@
 .pf-c-toolbar__content,
 .pf-c-toolbar__content-section {
   flex-wrap: wrap;
-  align-items: center;
 }
 
 .pf-c-toolbar__content {
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content--Display);
   position: relative;
+  align-items: center;
   padding-right: var(--pf-c-toolbar__content--PaddingRight);
   padding-left: var(--pf-c-toolbar__content--PaddingLeft);
 }
 
 .pf-c-toolbar__content-section {
   --pf-hidden-visible--visible--Display: var(--pf-c-toolbar__content-section--Display);
+  align-items: var(--pf-c-toolbar__content-section--AlignItems);
   width: 100%;
 }
+.pf-c-toolbar__content-section.pf-m-align-items-center {
+  align-items: center;
+}
 
 .pf-c-toolbar__expandable-content {
   position: absolute;
@@ -429,7 +457,7 @@
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
   }
   .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__group,
-.pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__item {
+  .pf-m-toggle-group.pf-m-show-on-sm .pf-c-toolbar__item {
     display: flex;
     flex: 0 1 auto;
   }
@@ -442,7 +470,7 @@
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
   }
   .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__group,
-.pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__item {
+  .pf-m-toggle-group.pf-m-show-on-md .pf-c-toolbar__item {
     display: flex;
     flex: 0 1 auto;
   }
@@ -455,7 +483,7 @@
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
   }
   .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__group,
-.pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__item {
+  .pf-m-toggle-group.pf-m-show-on-lg .pf-c-toolbar__item {
     display: flex;
     flex: 0 1 auto;
   }
@@ -468,7 +496,7 @@
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
   }
   .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__group,
-.pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__item {
+  .pf-m-toggle-group.pf-m-show-on-xl .pf-c-toolbar__item {
     display: flex;
     flex: 0 1 auto;
   }
@@ -481,7 +509,7 @@
     --pf-c-toolbar--spacer: var(--pf-c-toolbar__group--m-toggle-group--m-show--spacer);
   }
   .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__group,
-.pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__item {
+  .pf-m-toggle-group.pf-m-show-on-2xl .pf-c-toolbar__item {
     display: flex;
     flex: 0 1 auto;
   }
@@ -515,131 +543,131 @@
 }
 @media (min-width: 576px) {
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-sm ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-sm ~ .pf-m-pagination {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-sm ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-sm ~ .pf-m-pagination {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-sm,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-sm {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-sm {
     flex-wrap: nowrap;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-sm,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-sm {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-sm {
     flex-wrap: wrap;
   }
 }
 @media (min-width: 768px) {
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-md ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-md ~ .pf-m-pagination {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-md ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-md ~ .pf-m-pagination {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-md,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-md {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-md {
     flex-wrap: nowrap;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-md,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-md {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-md {
     flex-wrap: wrap;
   }
 }
 @media (min-width: 992px) {
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-lg ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-lg ~ .pf-m-pagination {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-lg ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-lg ~ .pf-m-pagination {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-lg,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-lg {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-lg {
     flex-wrap: nowrap;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-lg,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-lg {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-lg {
     flex-wrap: wrap;
   }
 }
 @media (min-width: 1200px) {
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-xl ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-xl ~ .pf-m-pagination {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-xl ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-xl ~ .pf-m-pagination {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-xl {
     flex-wrap: nowrap;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-xl {
     flex-wrap: wrap;
   }
 }
 @media (min-width: 1450px) {
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-right-on-2xl ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-right-on-2xl ~ .pf-m-pagination {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl {
     margin-left: 0;
   }
   .pf-c-toolbar .pf-c-toolbar__item.pf-m-align-left-on-2xl ~ .pf-m-pagination,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl ~ .pf-m-pagination {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-align-left-on-2xl ~ .pf-m-pagination {
     margin-left: auto;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-nowrap-on-2xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-2xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-nowrap-on-2xl {
     flex-wrap: nowrap;
   }
   .pf-c-toolbar .pf-c-toolbar__content-section.pf-m-wrap-on-2xl,
-.pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-2xl {
+  .pf-c-toolbar .pf-c-toolbar__group.pf-m-wrap-on-2xl {
     flex-wrap: wrap;
   }
 }

package/css/components/Toolbar/toolbar.d.ts

@@ -20,6 +20,10 @@ declare const _default: {
     "fullHeight": "pf-m-full-height",
     "static": "pf-m-static",
     "vertical": "pf-m-vertical",
+    "alignItemsCenter": "pf-m-align-items-center",
+    "alignItemsBaseline": "pf-m-align-items-baseline",
+    "alignSelfCenter": "pf-m-align-self-center",
+    "alignSelfBaseline": "pf-m-align-self-baseline",
     "buttonGroup": "pf-m-button-group",
     "iconButtonGroup": "pf-m-icon-button-group",
     "filterGroup": "pf-m-filter-group",

package/css/components/Toolbar/toolbar.js

@@ -22,6 +22,10 @@ exports.default = {
     "fullHeight": "pf-m-full-height",
     "static": "pf-m-static",
     "vertical": "pf-m-vertical",
+    "alignItemsCenter": "pf-m-align-items-center",
+    "alignItemsBaseline": "pf-m-align-items-baseline",
+    "alignSelfCenter": "pf-m-align-self-center",
+    "alignSelfBaseline": "pf-m-align-self-baseline",
     "buttonGroup": "pf-m-button-group",
     "iconButtonGroup": "pf-m-icon-button-group",
     "filterGroup": "pf-m-filter-group",

package/css/components/Toolbar/toolbar.mjs

@@ -20,6 +20,10 @@ export default {
     "fullHeight": "pf-m-full-height",
     "static": "pf-m-static",
     "vertical": "pf-m-vertical",
+    "alignItemsCenter": "pf-m-align-items-center",
+    "alignItemsBaseline": "pf-m-align-items-baseline",
+    "alignSelfCenter": "pf-m-align-self-center",
+    "alignSelfBaseline": "pf-m-align-self-baseline",
     "buttonGroup": "pf-m-button-group",
     "iconButtonGroup": "pf-m-icon-button-group",
     "filterGroup": "pf-m-filter-group",

package/css/components/Tooltip/tooltip.css

@@ -8,8 +8,10 @@
   --pf-c-tooltip__content--Color: var(--pf-global--Color--light-100);
   --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
   --pf-c-tooltip__content--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-tooltip__arrow--Width: 0.5rem;
-  --pf-c-tooltip__arrow--Height: 0.5rem;
+  --pf-c-tooltip__arrow--Width: 0.9375rem;
+  --pf-c-tooltip__arrow--Height: 0.9375rem;
+  --pf-c-tooltip__arrow--BackgroundColor: var(--pf-global--BackgroundColor--dark-100);
+  --pf-c-tooltip__arrow--BoxShadow: var(--pf-global--BoxShadow--md);
   --pf-c-tooltip__arrow--m-top--TranslateX: -50%;
   --pf-c-tooltip__arrow--m-top--TranslateY: 50%;
   --pf-c-tooltip__arrow--m-top--Rotate: 45deg;
@@ -79,18 +81,11 @@
   width: var(--pf-c-tooltip__arrow--Width);
   height: var(--pf-c-tooltip__arrow--Height);
   pointer-events: none;
-  background-color: var(--pf-c-tooltip__content--BackgroundColor);
+  background-color: var(--pf-c-tooltip__arrow--BackgroundColor);
+  box-shadow: var(--pf-c-tooltip__arrow--BoxShadow);
 }
 
 :where(.pf-theme-dark) .pf-c-tooltip {
-  --pf-c-tooltip--BoxShadow: none;
   --pf-c-tooltip__content--BackgroundColor: var(--pf-global--BackgroundColor--300);
-}
-:where(.pf-theme-dark) .pf-c-tooltip,
-:where(.pf-theme-dark) .pf-c-tooltip__arrow {
-  border: var(--pf-global--BorderWidth--lg) solid var(--pf-global--BorderColor--300);
-}
-:where(.pf-theme-dark) .pf-c-tooltip__arrow {
-  --pf-c-tooltip__arrow--Width: 0.9375rem;
-  --pf-c-tooltip__arrow--Height: 0.9375rem;
+  --pf-c-tooltip__arrow--BackgroundColor: var(--pf-global--BackgroundColor--300);
 }