@patternfly/react-styles 5.0.0-alpha.14 → 5.0.0-alpha.16

package/CHANGELOG.md

@@ -3,6 +3,16 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [5.0.0-alpha.16](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@5.0.0-alpha.15...@patternfly/react-styles@5.0.0-alpha.16) (2023-05-19)
+
+**Note:** Version bump only for package @patternfly/react-styles
+
+# [5.0.0-alpha.15](https://github.com/patternfly/patternfly-react/compare/@patternfly/react-styles@5.0.0-alpha.14...@patternfly/react-styles@5.0.0-alpha.15) (2023-05-18)
+
+### Bug Fixes
+
+- **Multiple:** update old component classnames ([#9139](https://github.com/patternfly/patternfly-react/issues/9139)) ([8fbd940](https://github.com/patternfly/patternfly-react/commit/8fbd9401cd27cb84e73722292a2765781a46a6f7))
+
 # 5.0.0-alpha.14 (2023-05-18)
 
 ### Features

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

@@ -21,7 +21,7 @@
   --pf-v5-c-form-control--BorderLeftColor: var(--pf-v5-global--BorderColor--300);
   --pf-v5-c-form-control--BorderRadius: 0;
   --pf-v5-c-form-control--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-form-control--Width: auto;
+  --pf-v5-c-form-control--Width: 100%;
   --pf-v5-c-form-control--Height: calc(var(--pf-v5-c-form-control--FontSize) * var(--pf-v5-c-form-control--LineHeight) + var(--pf-v5-c-form-control--BorderWidth) * 2 + var(--pf-v5-c-form-control--PaddingTop) + var(--pf-v5-c-form-control--PaddingBottom));
   --pf-v5-c-form-control--inset--base: var(--pf-v5-global--spacer--sm);
   --pf-v5-c-form-control--PaddingTop: calc(var(--pf-v5-global--spacer--form-element) - var(--pf-v5-global--BorderWidth--sm));

package/css/components/Nav/nav.css

@@ -21,6 +21,8 @@
   --pf-v5-c-nav--m-light__subnav__link--focus--after--BorderColor: var(--pf-v5-global--BorderColor--dark-100);
   --pf-v5-c-nav--m-light__subnav__link--active--after--BorderColor: var(--pf-v5-global--BorderColor--dark-100);
   --pf-v5-c-nav--m-light__subnav__link--m-current--after--BorderColor: var(--pf-v5-global--active-color--100);
+  --pf-v5-c-nav__list--PaddingTop: var(--pf-v5-global--spacer--sm);
+  --pf-v5-c-nav__list--PaddingBottom: var(--pf-v5-global--spacer--sm);
   --pf-v5-c-nav__item--MarginTop: 0;
   --pf-v5-c-nav__item--m-current--not--m-expanded__link--BackgroundColor: var(--pf-v5-global--BackgroundColor--dark-400);
   --pf-v5-c-nav__link--m-current--not--m-expanded__link--after--BorderWidth: var(--pf-v5-global--BorderWidth--xl);
@@ -146,7 +148,7 @@
   --pf-v5-c-nav--m-horizontal-subnav__link--hover--after--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
   --pf-v5-c-nav--m-horizontal-subnav__link--active--after--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
   --pf-v5-c-nav--m-horizontal-subnav__link--m-current--after--BorderLeftWidth: var(--pf-v5-global--BorderWidth--sm);
-  --pf-v5-c-nav__subnav--PaddingBottom: var(--pf-v5-global--spacer--md);
+  --pf-v5-c-nav__subnav--PaddingBottom: var(--pf-v5-global--spacer--sm);
   --pf-v5-c-nav__subnav--xl--PaddingLeft: var(--pf-v5-c-nav__link--PaddingLeft);
   --pf-v5-c-nav__subnav__link--MarginTop: 0;
   --pf-v5-c-nav__subnav__link--PaddingTop: var(--pf-v5-global--spacer--sm);
@@ -424,6 +426,8 @@
   display: flex;
 }
 .pf-v5-c-nav.pf-m-horizontal .pf-v5-c-nav__list, .pf-v5-c-nav.pf-m-tertiary .pf-v5-c-nav__list, .pf-v5-c-nav.pf-m-horizontal-subnav .pf-v5-c-nav__list {
+  --pf-v5-c-nav__list--PaddingTop: 0;
+  --pf-v5-c-nav__list--PaddingBottom: 0;
   flex: 1;
   max-width: 100%;
   overflow-x: auto;
@@ -596,11 +600,12 @@
 .pf-v5-c-nav__list {
   position: relative;
   display: block;
+  padding-top: var(--pf-v5-c-nav__list--PaddingTop);
+  padding-bottom: var(--pf-v5-c-nav__list--PaddingBottom);
 }
 
 .pf-v5-c-nav__item {
   position: relative;
-  margin-top: var(--pf-v5-c-nav__item--MarginTop);
 }
 .pf-v5-c-nav__item.pf-m-expandable {
   --pf-v5-c-nav__link--before--BorderBottomWidth: 0;
@@ -613,6 +618,9 @@
   content: "";
   border-bottom: var(--pf-v5-c-nav__item--before--BorderWidth) solid var(--pf-v5-c-nav__item--before--BorderColor);
 }
+.pf-v5-c-nav__item:not(:first-child) {
+  margin-top: var(--pf-v5-c-nav__item--MarginTop);
+}
 .pf-v5-c-nav__item .pf-v5-c-nav__item:not(.pf-m-expanded) .pf-v5-c-nav__toggle-icon {
   transform: rotate(0);
 }
@@ -786,6 +794,8 @@
 }
 
 .pf-v5-c-nav__subnav {
+  --pf-v5-c-nav__list--PaddingTop: 0;
+  --pf-v5-c-nav__list--PaddingBottom: 0;
   --pf-v5-c-nav__link--PaddingTop: var(--pf-v5-c-nav__subnav__link--PaddingTop);
   --pf-v5-c-nav__link--PaddingRight: var(--pf-v5-c-nav__subnav__link--PaddingRight);
   --pf-v5-c-nav__link--PaddingBottom: var(--pf-v5-c-nav__subnav__link--PaddingBottom);
@@ -871,6 +881,9 @@
 .pf-v5-c-nav__section.pf-m-no-title {
   --pf-v5-c-nav__section--MarginTop: 0;
 }
+.pf-v5-c-nav__section:not(:last-child) {
+  --pf-v5-c-nav__list--PaddingBottom: 0;
+}
 
 .pf-v5-c-nav__section-title {
   padding: var(--pf-v5-c-nav__section-title--PaddingTop) var(--pf-v5-c-nav__section-title--PaddingRight) var(--pf-v5-c-nav__section-title--PaddingBottom) var(--pf-v5-c-nav__section-title--PaddingLeft);

package/css/components/Popper/Popper.css

@@ -1,4 +1,4 @@
-.pf-c-popover[data-popper-reference-hidden="true"] {
+.pf-v5-c-popover[data-popper-reference-hidden="true"] {
     visibility: hidden;
     pointer-events: none;
 }

package/css/components/Popper/Popper.d.ts

@@ -1,5 +1,5 @@
 import './Popper.css';
 declare const _default: {
-  "popover": "pf-c-popover"
+  "popover": "pf-v5-c-popover"
 };
 export default _default;

package/css/components/Popper/Popper.js

@@ -2,5 +2,5 @@
 exports.__esModule = true;
 require('./Popper.css');
 exports.default = {
-  "popover": "pf-c-popover"
+  "popover": "pf-v5-c-popover"
 };

package/css/components/Popper/Popper.mjs

@@ -1,4 +1,4 @@
 import './Popper.css';
 export default {
-  "popover": "pf-c-popover"
+  "popover": "pf-v5-c-popover"
 };

package/css/components/Table/table.css

@@ -969,7 +969,6 @@
   --pf-v5-c-table--cell--PaddingRight: var(--pf-v5-c-table--m-compact--cell--first-last-child--PaddingRight);
 }
 .pf-v5-c-table.pf-m-compact thead:where(.pf-v5-c-table__thead) th:where(.pf-v5-c-table__th),
-.pf-v5-c-table.pf-m-compact thead:where(.pf-v5-c-table__thead) td:where(.pf-v5-c-table__td),
 .pf-v5-c-table.pf-m-compact thead:where(.pf-v5-c-table__thead) .pf-v5-c-table__toggle {
   --pf-v5-c-table--cell--PaddingTop: var(--pf-v5-c-table--m-compact__th--PaddingTop);
   --pf-v5-c-table--cell--PaddingBottom: var(--pf-v5-c-table--m-compact__th--PaddingBottom);

package/css/layouts/Flex/flex.css

@@ -1620,6 +1620,10 @@
   --pf-v5-l-flex--RowGap: 0;
   --pf-v5-l-flex--ColumnGap: 0;
 }
+.pf-v5-l-flex.pf-m-gap-xs {
+  --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+}
 .pf-v5-l-flex.pf-m-gap-sm {
   --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1648,7 +1652,7 @@
   --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
 }
-.pf-v5-l-flex:is(.pf-m-gap, .pf-m-gap-none, .pf-m-gap-sm, .pf-m-gap-md, .pf-m-gap-lg, .pf-m-gap-xl, .pf-m-gap-2xl, .pf-m-gap-3xl, .pf-m-gap-4xl) > * {
+.pf-v5-l-flex:is(.pf-m-gap, .pf-m-gap-none, .pf-m-gap-xs, .pf-m-gap-sm, .pf-m-gap-md, .pf-m-gap-lg, .pf-m-gap-xl, .pf-m-gap-2xl, .pf-m-gap-3xl, .pf-m-gap-4xl) > * {
   --pf-v5-l-flex--spacer--row: 0;
   --pf-v5-l-flex--spacer--column: 0;
 }
@@ -1661,6 +1665,10 @@
     --pf-v5-l-flex--RowGap: 0;
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-gap-xs-on-sm {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-gap-sm-on-sm {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1689,7 +1697,7 @@
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-gap-on-sm, .pf-m-gap-none-on-sm, .pf-m-gap-sm-on-sm, .pf-m-gap-md-on-sm, .pf-m-gap-lg-on-sm, .pf-m-gap-xl-on-sm, .pf-m-gap-2xl-on-sm, .pf-m-gap-3xl-on-sm, .pf-m-gap-4xl-on-sm) > * {
+  .pf-v5-l-flex:is(.pf-m-gap-on-sm, .pf-m-gap-none-on-sm, .pf-m-gap-xs-on-sm, .pf-m-gap-sm-on-sm, .pf-m-gap-md-on-sm, .pf-m-gap-lg-on-sm, .pf-m-gap-xl-on-sm, .pf-m-gap-2xl-on-sm, .pf-m-gap-3xl-on-sm, .pf-m-gap-4xl-on-sm) > * {
     --pf-v5-l-flex--spacer--row: 0;
     --pf-v5-l-flex--spacer--column: 0;
   }
@@ -1703,6 +1711,10 @@
     --pf-v5-l-flex--RowGap: 0;
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-gap-xs-on-md {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-gap-sm-on-md {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1731,7 +1743,7 @@
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-gap-on-md, .pf-m-gap-none-on-md, .pf-m-gap-sm-on-md, .pf-m-gap-md-on-md, .pf-m-gap-lg-on-md, .pf-m-gap-xl-on-md, .pf-m-gap-2xl-on-md, .pf-m-gap-3xl-on-md, .pf-m-gap-4xl-on-md) > * {
+  .pf-v5-l-flex:is(.pf-m-gap-on-md, .pf-m-gap-none-on-md, .pf-m-gap-xs-on-md, .pf-m-gap-sm-on-md, .pf-m-gap-md-on-md, .pf-m-gap-lg-on-md, .pf-m-gap-xl-on-md, .pf-m-gap-2xl-on-md, .pf-m-gap-3xl-on-md, .pf-m-gap-4xl-on-md) > * {
     --pf-v5-l-flex--spacer--row: 0;
     --pf-v5-l-flex--spacer--column: 0;
   }
@@ -1745,6 +1757,10 @@
     --pf-v5-l-flex--RowGap: 0;
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-gap-xs-on-lg {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-gap-sm-on-lg {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1773,7 +1789,7 @@
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-gap-on-lg, .pf-m-gap-none-on-lg, .pf-m-gap-sm-on-lg, .pf-m-gap-md-on-lg, .pf-m-gap-lg-on-lg, .pf-m-gap-xl-on-lg, .pf-m-gap-2xl-on-lg, .pf-m-gap-3xl-on-lg, .pf-m-gap-4xl-on-lg) > * {
+  .pf-v5-l-flex:is(.pf-m-gap-on-lg, .pf-m-gap-none-on-lg, .pf-m-gap-xs-on-lg, .pf-m-gap-sm-on-lg, .pf-m-gap-md-on-lg, .pf-m-gap-lg-on-lg, .pf-m-gap-xl-on-lg, .pf-m-gap-2xl-on-lg, .pf-m-gap-3xl-on-lg, .pf-m-gap-4xl-on-lg) > * {
     --pf-v5-l-flex--spacer--row: 0;
     --pf-v5-l-flex--spacer--column: 0;
   }
@@ -1787,6 +1803,10 @@
     --pf-v5-l-flex--RowGap: 0;
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-gap-xs-on-xl {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-gap-sm-on-xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1815,7 +1835,7 @@
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-gap-on-xl, .pf-m-gap-none-on-xl, .pf-m-gap-sm-on-xl, .pf-m-gap-md-on-xl, .pf-m-gap-lg-on-xl, .pf-m-gap-xl-on-xl, .pf-m-gap-2xl-on-xl, .pf-m-gap-3xl-on-xl, .pf-m-gap-4xl-on-xl) > * {
+  .pf-v5-l-flex:is(.pf-m-gap-on-xl, .pf-m-gap-none-on-xl, .pf-m-gap-xs-on-xl, .pf-m-gap-sm-on-xl, .pf-m-gap-md-on-xl, .pf-m-gap-lg-on-xl, .pf-m-gap-xl-on-xl, .pf-m-gap-2xl-on-xl, .pf-m-gap-3xl-on-xl, .pf-m-gap-4xl-on-xl) > * {
     --pf-v5-l-flex--spacer--row: 0;
     --pf-v5-l-flex--spacer--column: 0;
   }
@@ -1829,6 +1849,10 @@
     --pf-v5-l-flex--RowGap: 0;
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-gap-xs-on-2xl {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-gap-sm-on-2xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
@@ -1857,7 +1881,7 @@
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-gap-on-2xl, .pf-m-gap-none-on-2xl, .pf-m-gap-sm-on-2xl, .pf-m-gap-md-on-2xl, .pf-m-gap-lg-on-2xl, .pf-m-gap-xl-on-2xl, .pf-m-gap-2xl-on-2xl, .pf-m-gap-3xl-on-2xl, .pf-m-gap-4xl-on-2xl) > * {
+  .pf-v5-l-flex:is(.pf-m-gap-on-2xl, .pf-m-gap-none-on-2xl, .pf-m-gap-xs-on-2xl, .pf-m-gap-sm-on-2xl, .pf-m-gap-md-on-2xl, .pf-m-gap-lg-on-2xl, .pf-m-gap-xl-on-2xl, .pf-m-gap-2xl-on-2xl, .pf-m-gap-3xl-on-2xl, .pf-m-gap-4xl-on-2xl) > * {
     --pf-v5-l-flex--spacer--row: 0;
     --pf-v5-l-flex--spacer--column: 0;
   }
@@ -1868,6 +1892,9 @@
 .pf-v5-l-flex.pf-m-row-gap-none {
   --pf-v5-l-flex--RowGap: 0;
 }
+.pf-v5-l-flex.pf-m-row-gap-xs {
+  --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+}
 .pf-v5-l-flex.pf-m-row-gap-sm {
   --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
 }
@@ -1889,7 +1916,7 @@
 .pf-v5-l-flex.pf-m-row-gap-4xl {
   --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
 }
-.pf-v5-l-flex:is(.pf-m-row-gap, .pf-m-row-gap-none, .pf-m-row-gap-sm, .pf-m-row-gap-md, .pf-m-row-gap-lg, .pf-m-row-gap-xl, .pf-m-row-gap-2xl, .pf-m-row-gap-3xl, .pf-m-row-gap-4xl) > * {
+.pf-v5-l-flex:is(.pf-m-row-gap, .pf-m-row-gap-none, .pf-m-row-gap-xs, .pf-m-row-gap-sm, .pf-m-row-gap-md, .pf-m-row-gap-lg, .pf-m-row-gap-xl, .pf-m-row-gap-2xl, .pf-m-row-gap-3xl, .pf-m-row-gap-4xl) > * {
   --pf-v5-l-flex--spacer--row: 0;
 }
 @media (min-width: 576px) {
@@ -1899,6 +1926,9 @@
   .pf-v5-l-flex.pf-m-row-gap-none-on-sm {
     --pf-v5-l-flex--RowGap: 0;
   }
+  .pf-v5-l-flex.pf-m-row-gap-xs-on-sm {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-row-gap-sm-on-sm {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   }
@@ -1920,7 +1950,7 @@
   .pf-v5-l-flex.pf-m-row-gap-4xl-on-sm {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-row-gap-on-sm, .pf-m-row-gap-none-on-sm, .pf-m-row-gap-sm-on-sm, .pf-m-row-gap-md-on-sm, .pf-m-row-gap-lg-on-sm, .pf-m-row-gap-xl-on-sm, .pf-m-row-gap-2xl-on-sm, .pf-m-row-gap-3xl-on-sm, .pf-m-row-gap-4xl-on-sm) > * {
+  .pf-v5-l-flex:is(.pf-m-row-gap-on-sm, .pf-m-row-gap-none-on-sm, .pf-m-row-gap-xs-on-sm, .pf-m-row-gap-sm-on-sm, .pf-m-row-gap-md-on-sm, .pf-m-row-gap-lg-on-sm, .pf-m-row-gap-xl-on-sm, .pf-m-row-gap-2xl-on-sm, .pf-m-row-gap-3xl-on-sm, .pf-m-row-gap-4xl-on-sm) > * {
     --pf-v5-l-flex--spacer--row: 0;
   }
 }
@@ -1931,6 +1961,9 @@
   .pf-v5-l-flex.pf-m-row-gap-none-on-md {
     --pf-v5-l-flex--RowGap: 0;
   }
+  .pf-v5-l-flex.pf-m-row-gap-xs-on-md {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-row-gap-sm-on-md {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   }
@@ -1952,7 +1985,7 @@
   .pf-v5-l-flex.pf-m-row-gap-4xl-on-md {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-row-gap-on-md, .pf-m-row-gap-none-on-md, .pf-m-row-gap-sm-on-md, .pf-m-row-gap-md-on-md, .pf-m-row-gap-lg-on-md, .pf-m-row-gap-xl-on-md, .pf-m-row-gap-2xl-on-md, .pf-m-row-gap-3xl-on-md, .pf-m-row-gap-4xl-on-md) > * {
+  .pf-v5-l-flex:is(.pf-m-row-gap-on-md, .pf-m-row-gap-none-on-md, .pf-m-row-gap-xs-on-md, .pf-m-row-gap-sm-on-md, .pf-m-row-gap-md-on-md, .pf-m-row-gap-lg-on-md, .pf-m-row-gap-xl-on-md, .pf-m-row-gap-2xl-on-md, .pf-m-row-gap-3xl-on-md, .pf-m-row-gap-4xl-on-md) > * {
     --pf-v5-l-flex--spacer--row: 0;
   }
 }
@@ -1963,6 +1996,9 @@
   .pf-v5-l-flex.pf-m-row-gap-none-on-lg {
     --pf-v5-l-flex--RowGap: 0;
   }
+  .pf-v5-l-flex.pf-m-row-gap-xs-on-lg {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-row-gap-sm-on-lg {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   }
@@ -1984,7 +2020,7 @@
   .pf-v5-l-flex.pf-m-row-gap-4xl-on-lg {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-row-gap-on-lg, .pf-m-row-gap-none-on-lg, .pf-m-row-gap-sm-on-lg, .pf-m-row-gap-md-on-lg, .pf-m-row-gap-lg-on-lg, .pf-m-row-gap-xl-on-lg, .pf-m-row-gap-2xl-on-lg, .pf-m-row-gap-3xl-on-lg, .pf-m-row-gap-4xl-on-lg) > * {
+  .pf-v5-l-flex:is(.pf-m-row-gap-on-lg, .pf-m-row-gap-none-on-lg, .pf-m-row-gap-xs-on-lg, .pf-m-row-gap-sm-on-lg, .pf-m-row-gap-md-on-lg, .pf-m-row-gap-lg-on-lg, .pf-m-row-gap-xl-on-lg, .pf-m-row-gap-2xl-on-lg, .pf-m-row-gap-3xl-on-lg, .pf-m-row-gap-4xl-on-lg) > * {
     --pf-v5-l-flex--spacer--row: 0;
   }
 }
@@ -1995,6 +2031,9 @@
   .pf-v5-l-flex.pf-m-row-gap-none-on-xl {
     --pf-v5-l-flex--RowGap: 0;
   }
+  .pf-v5-l-flex.pf-m-row-gap-xs-on-xl {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-row-gap-sm-on-xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2016,7 +2055,7 @@
   .pf-v5-l-flex.pf-m-row-gap-4xl-on-xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-row-gap-on-xl, .pf-m-row-gap-none-on-xl, .pf-m-row-gap-sm-on-xl, .pf-m-row-gap-md-on-xl, .pf-m-row-gap-lg-on-xl, .pf-m-row-gap-xl-on-xl, .pf-m-row-gap-2xl-on-xl, .pf-m-row-gap-3xl-on-xl, .pf-m-row-gap-4xl-on-xl) > * {
+  .pf-v5-l-flex:is(.pf-m-row-gap-on-xl, .pf-m-row-gap-none-on-xl, .pf-m-row-gap-xs-on-xl, .pf-m-row-gap-sm-on-xl, .pf-m-row-gap-md-on-xl, .pf-m-row-gap-lg-on-xl, .pf-m-row-gap-xl-on-xl, .pf-m-row-gap-2xl-on-xl, .pf-m-row-gap-3xl-on-xl, .pf-m-row-gap-4xl-on-xl) > * {
     --pf-v5-l-flex--spacer--row: 0;
   }
 }
@@ -2027,6 +2066,9 @@
   .pf-v5-l-flex.pf-m-row-gap-none-on-2xl {
     --pf-v5-l-flex--RowGap: 0;
   }
+  .pf-v5-l-flex.pf-m-row-gap-xs-on-2xl {
+    --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-row-gap-sm-on-2xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2048,7 +2090,7 @@
   .pf-v5-l-flex.pf-m-row-gap-4xl-on-2xl {
     --pf-v5-l-flex--RowGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-row-gap-on-2xl, .pf-m-row-gap-none-on-2xl, .pf-m-row-gap-sm-on-2xl, .pf-m-row-gap-md-on-2xl, .pf-m-row-gap-lg-on-2xl, .pf-m-row-gap-xl-on-2xl, .pf-m-row-gap-2xl-on-2xl, .pf-m-row-gap-3xl-on-2xl, .pf-m-row-gap-4xl-on-2xl) > * {
+  .pf-v5-l-flex:is(.pf-m-row-gap-on-2xl, .pf-m-row-gap-none-on-2xl, .pf-m-row-gap-xs-on-2xl, .pf-m-row-gap-sm-on-2xl, .pf-m-row-gap-md-on-2xl, .pf-m-row-gap-lg-on-2xl, .pf-m-row-gap-xl-on-2xl, .pf-m-row-gap-2xl-on-2xl, .pf-m-row-gap-3xl-on-2xl, .pf-m-row-gap-4xl-on-2xl) > * {
     --pf-v5-l-flex--spacer--row: 0;
   }
 }
@@ -2058,6 +2100,9 @@
 .pf-v5-l-flex.pf-m-column-gap-none {
   --pf-v5-l-flex--ColumnGap: 0;
 }
+.pf-v5-l-flex.pf-m-column-gap-xs {
+  --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+}
 .pf-v5-l-flex.pf-m-column-gap-sm {
   --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
 }
@@ -2079,7 +2124,7 @@
 .pf-v5-l-flex.pf-m-column-gap-4xl {
   --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
 }
-.pf-v5-l-flex:is(.pf-m-column-gap, .pf-m-column-gap-none, .pf-m-column-gap-sm, .pf-m-column-gap-md, .pf-m-column-gap-lg, .pf-m-column-gap-xl, .pf-m-column-gap-2xl, .pf-m-column-gap-3xl, .pf-m-column-gap-4xl) > * {
+.pf-v5-l-flex:is(.pf-m-column-gap, .pf-m-column-gap-none, .pf-m-column-gap-xs, .pf-m-column-gap-sm, .pf-m-column-gap-md, .pf-m-column-gap-lg, .pf-m-column-gap-xl, .pf-m-column-gap-2xl, .pf-m-column-gap-3xl, .pf-m-column-gap-4xl) > * {
   --pf-v5-l-flex--spacer--column: 0;
 }
 @media (min-width: 576px) {
@@ -2089,6 +2134,9 @@
   .pf-v5-l-flex.pf-m-column-gap-none-on-sm {
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-column-gap-xs-on-sm {
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-column-gap-sm-on-sm {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2110,7 +2158,7 @@
   .pf-v5-l-flex.pf-m-column-gap-4xl-on-sm {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-column-gap-on-sm, .pf-m-column-gap-none-on-sm, .pf-m-column-gap-sm-on-sm, .pf-m-column-gap-md-on-sm, .pf-m-column-gap-lg-on-sm, .pf-m-column-gap-xl-on-sm, .pf-m-column-gap-2xl-on-sm, .pf-m-column-gap-3xl-on-sm, .pf-m-column-gap-4xl-on-sm) > * {
+  .pf-v5-l-flex:is(.pf-m-column-gap-on-sm, .pf-m-column-gap-none-on-sm, .pf-m-column-gap-xs-on-sm, .pf-m-column-gap-sm-on-sm, .pf-m-column-gap-md-on-sm, .pf-m-column-gap-lg-on-sm, .pf-m-column-gap-xl-on-sm, .pf-m-column-gap-2xl-on-sm, .pf-m-column-gap-3xl-on-sm, .pf-m-column-gap-4xl-on-sm) > * {
     --pf-v5-l-flex--spacer--column: 0;
   }
 }
@@ -2121,6 +2169,9 @@
   .pf-v5-l-flex.pf-m-column-gap-none-on-md {
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-column-gap-xs-on-md {
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-column-gap-sm-on-md {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2142,7 +2193,7 @@
   .pf-v5-l-flex.pf-m-column-gap-4xl-on-md {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-column-gap-on-md, .pf-m-column-gap-none-on-md, .pf-m-column-gap-sm-on-md, .pf-m-column-gap-md-on-md, .pf-m-column-gap-lg-on-md, .pf-m-column-gap-xl-on-md, .pf-m-column-gap-2xl-on-md, .pf-m-column-gap-3xl-on-md, .pf-m-column-gap-4xl-on-md) > * {
+  .pf-v5-l-flex:is(.pf-m-column-gap-on-md, .pf-m-column-gap-none-on-md, .pf-m-column-gap-xs-on-md, .pf-m-column-gap-sm-on-md, .pf-m-column-gap-md-on-md, .pf-m-column-gap-lg-on-md, .pf-m-column-gap-xl-on-md, .pf-m-column-gap-2xl-on-md, .pf-m-column-gap-3xl-on-md, .pf-m-column-gap-4xl-on-md) > * {
     --pf-v5-l-flex--spacer--column: 0;
   }
 }
@@ -2153,6 +2204,9 @@
   .pf-v5-l-flex.pf-m-column-gap-none-on-lg {
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-column-gap-xs-on-lg {
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-column-gap-sm-on-lg {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2174,7 +2228,7 @@
   .pf-v5-l-flex.pf-m-column-gap-4xl-on-lg {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-column-gap-on-lg, .pf-m-column-gap-none-on-lg, .pf-m-column-gap-sm-on-lg, .pf-m-column-gap-md-on-lg, .pf-m-column-gap-lg-on-lg, .pf-m-column-gap-xl-on-lg, .pf-m-column-gap-2xl-on-lg, .pf-m-column-gap-3xl-on-lg, .pf-m-column-gap-4xl-on-lg) > * {
+  .pf-v5-l-flex:is(.pf-m-column-gap-on-lg, .pf-m-column-gap-none-on-lg, .pf-m-column-gap-xs-on-lg, .pf-m-column-gap-sm-on-lg, .pf-m-column-gap-md-on-lg, .pf-m-column-gap-lg-on-lg, .pf-m-column-gap-xl-on-lg, .pf-m-column-gap-2xl-on-lg, .pf-m-column-gap-3xl-on-lg, .pf-m-column-gap-4xl-on-lg) > * {
     --pf-v5-l-flex--spacer--column: 0;
   }
 }
@@ -2185,6 +2239,9 @@
   .pf-v5-l-flex.pf-m-column-gap-none-on-xl {
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-column-gap-xs-on-xl {
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-column-gap-sm-on-xl {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2206,7 +2263,7 @@
   .pf-v5-l-flex.pf-m-column-gap-4xl-on-xl {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-column-gap-on-xl, .pf-m-column-gap-none-on-xl, .pf-m-column-gap-sm-on-xl, .pf-m-column-gap-md-on-xl, .pf-m-column-gap-lg-on-xl, .pf-m-column-gap-xl-on-xl, .pf-m-column-gap-2xl-on-xl, .pf-m-column-gap-3xl-on-xl, .pf-m-column-gap-4xl-on-xl) > * {
+  .pf-v5-l-flex:is(.pf-m-column-gap-on-xl, .pf-m-column-gap-none-on-xl, .pf-m-column-gap-xs-on-xl, .pf-m-column-gap-sm-on-xl, .pf-m-column-gap-md-on-xl, .pf-m-column-gap-lg-on-xl, .pf-m-column-gap-xl-on-xl, .pf-m-column-gap-2xl-on-xl, .pf-m-column-gap-3xl-on-xl, .pf-m-column-gap-4xl-on-xl) > * {
     --pf-v5-l-flex--spacer--column: 0;
   }
 }
@@ -2217,6 +2274,9 @@
   .pf-v5-l-flex.pf-m-column-gap-none-on-2xl {
     --pf-v5-l-flex--ColumnGap: 0;
   }
+  .pf-v5-l-flex.pf-m-column-gap-xs-on-2xl {
+    --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--xs);
+  }
   .pf-v5-l-flex.pf-m-column-gap-sm-on-2xl {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--sm);
   }
@@ -2238,7 +2298,7 @@
   .pf-v5-l-flex.pf-m-column-gap-4xl-on-2xl {
     --pf-v5-l-flex--ColumnGap: var(--pf-v5-global--spacer--4xl);
   }
-  .pf-v5-l-flex:is(.pf-m-column-gap-on-2xl, .pf-m-column-gap-none-on-2xl, .pf-m-column-gap-sm-on-2xl, .pf-m-column-gap-md-on-2xl, .pf-m-column-gap-lg-on-2xl, .pf-m-column-gap-xl-on-2xl, .pf-m-column-gap-2xl-on-2xl, .pf-m-column-gap-3xl-on-2xl, .pf-m-column-gap-4xl-on-2xl) > * {
+  .pf-v5-l-flex:is(.pf-m-column-gap-on-2xl, .pf-m-column-gap-none-on-2xl, .pf-m-column-gap-xs-on-2xl, .pf-m-column-gap-sm-on-2xl, .pf-m-column-gap-md-on-2xl, .pf-m-column-gap-lg-on-2xl, .pf-m-column-gap-xl-on-2xl, .pf-m-column-gap-2xl-on-2xl, .pf-m-column-gap-3xl-on-2xl, .pf-m-column-gap-4xl-on-2xl) > * {
     --pf-v5-l-flex--spacer--column: 0;
   }
 }

package/css/layouts/Flex/flex.d.ts

@@ -364,6 +364,7 @@ declare const _default: {
     "spacer_4xlOn_2xl": "pf-m-spacer-4xl-on-2xl",
     "gap": "pf-m-gap",
     "gapNone": "pf-m-gap-none",
+    "gapXs": "pf-m-gap-xs",
     "gapSm": "pf-m-gap-sm",
     "gapMd": "pf-m-gap-md",
     "gapLg": "pf-m-gap-lg",
@@ -373,6 +374,7 @@ declare const _default: {
     "gap_4xl": "pf-m-gap-4xl",
     "gapOnSm": "pf-m-gap-on-sm",
     "gapNoneOnSm": "pf-m-gap-none-on-sm",
+    "gapXsOnSm": "pf-m-gap-xs-on-sm",
     "gapSmOnSm": "pf-m-gap-sm-on-sm",
     "gapMdOnSm": "pf-m-gap-md-on-sm",
     "gapLgOnSm": "pf-m-gap-lg-on-sm",
@@ -382,6 +384,7 @@ declare const _default: {
     "gap_4xlOnSm": "pf-m-gap-4xl-on-sm",
     "gapOnMd": "pf-m-gap-on-md",
     "gapNoneOnMd": "pf-m-gap-none-on-md",
+    "gapXsOnMd": "pf-m-gap-xs-on-md",
     "gapSmOnMd": "pf-m-gap-sm-on-md",
     "gapMdOnMd": "pf-m-gap-md-on-md",
     "gapLgOnMd": "pf-m-gap-lg-on-md",
@@ -391,6 +394,7 @@ declare const _default: {
     "gap_4xlOnMd": "pf-m-gap-4xl-on-md",
     "gapOnLg": "pf-m-gap-on-lg",
     "gapNoneOnLg": "pf-m-gap-none-on-lg",
+    "gapXsOnLg": "pf-m-gap-xs-on-lg",
     "gapSmOnLg": "pf-m-gap-sm-on-lg",
     "gapMdOnLg": "pf-m-gap-md-on-lg",
     "gapLgOnLg": "pf-m-gap-lg-on-lg",
@@ -400,6 +404,7 @@ declare const _default: {
     "gap_4xlOnLg": "pf-m-gap-4xl-on-lg",
     "gapOnXl": "pf-m-gap-on-xl",
     "gapNoneOnXl": "pf-m-gap-none-on-xl",
+    "gapXsOnXl": "pf-m-gap-xs-on-xl",
     "gapSmOnXl": "pf-m-gap-sm-on-xl",
     "gapMdOnXl": "pf-m-gap-md-on-xl",
     "gapLgOnXl": "pf-m-gap-lg-on-xl",
@@ -409,6 +414,7 @@ declare const _default: {
     "gap_4xlOnXl": "pf-m-gap-4xl-on-xl",
     "gapOn_2xl": "pf-m-gap-on-2xl",
     "gapNoneOn_2xl": "pf-m-gap-none-on-2xl",
+    "gapXsOn_2xl": "pf-m-gap-xs-on-2xl",
     "gapSmOn_2xl": "pf-m-gap-sm-on-2xl",
     "gapMdOn_2xl": "pf-m-gap-md-on-2xl",
     "gapLgOn_2xl": "pf-m-gap-lg-on-2xl",
@@ -418,6 +424,7 @@ declare const _default: {
     "gap_4xlOn_2xl": "pf-m-gap-4xl-on-2xl",
     "rowGap": "pf-m-row-gap",
     "rowGapNone": "pf-m-row-gap-none",
+    "rowGapXs": "pf-m-row-gap-xs",
     "rowGapSm": "pf-m-row-gap-sm",
     "rowGapMd": "pf-m-row-gap-md",
     "rowGapLg": "pf-m-row-gap-lg",
@@ -427,6 +434,7 @@ declare const _default: {
     "rowGap_4xl": "pf-m-row-gap-4xl",
     "rowGapOnSm": "pf-m-row-gap-on-sm",
     "rowGapNoneOnSm": "pf-m-row-gap-none-on-sm",
+    "rowGapXsOnSm": "pf-m-row-gap-xs-on-sm",
     "rowGapSmOnSm": "pf-m-row-gap-sm-on-sm",
     "rowGapMdOnSm": "pf-m-row-gap-md-on-sm",
     "rowGapLgOnSm": "pf-m-row-gap-lg-on-sm",
@@ -436,6 +444,7 @@ declare const _default: {
     "rowGap_4xlOnSm": "pf-m-row-gap-4xl-on-sm",
     "rowGapOnMd": "pf-m-row-gap-on-md",
     "rowGapNoneOnMd": "pf-m-row-gap-none-on-md",
+    "rowGapXsOnMd": "pf-m-row-gap-xs-on-md",
     "rowGapSmOnMd": "pf-m-row-gap-sm-on-md",
     "rowGapMdOnMd": "pf-m-row-gap-md-on-md",
     "rowGapLgOnMd": "pf-m-row-gap-lg-on-md",
@@ -445,6 +454,7 @@ declare const _default: {
     "rowGap_4xlOnMd": "pf-m-row-gap-4xl-on-md",
     "rowGapOnLg": "pf-m-row-gap-on-lg",
     "rowGapNoneOnLg": "pf-m-row-gap-none-on-lg",
+    "rowGapXsOnLg": "pf-m-row-gap-xs-on-lg",
     "rowGapSmOnLg": "pf-m-row-gap-sm-on-lg",
     "rowGapMdOnLg": "pf-m-row-gap-md-on-lg",
     "rowGapLgOnLg": "pf-m-row-gap-lg-on-lg",
@@ -454,6 +464,7 @@ declare const _default: {
     "rowGap_4xlOnLg": "pf-m-row-gap-4xl-on-lg",
     "rowGapOnXl": "pf-m-row-gap-on-xl",
     "rowGapNoneOnXl": "pf-m-row-gap-none-on-xl",
+    "rowGapXsOnXl": "pf-m-row-gap-xs-on-xl",
     "rowGapSmOnXl": "pf-m-row-gap-sm-on-xl",
     "rowGapMdOnXl": "pf-m-row-gap-md-on-xl",
     "rowGapLgOnXl": "pf-m-row-gap-lg-on-xl",
@@ -463,6 +474,7 @@ declare const _default: {
     "rowGap_4xlOnXl": "pf-m-row-gap-4xl-on-xl",
     "rowGapOn_2xl": "pf-m-row-gap-on-2xl",
     "rowGapNoneOn_2xl": "pf-m-row-gap-none-on-2xl",
+    "rowGapXsOn_2xl": "pf-m-row-gap-xs-on-2xl",
     "rowGapSmOn_2xl": "pf-m-row-gap-sm-on-2xl",
     "rowGapMdOn_2xl": "pf-m-row-gap-md-on-2xl",
     "rowGapLgOn_2xl": "pf-m-row-gap-lg-on-2xl",
@@ -472,6 +484,7 @@ declare const _default: {
     "rowGap_4xlOn_2xl": "pf-m-row-gap-4xl-on-2xl",
     "columnGap": "pf-m-column-gap",
     "columnGapNone": "pf-m-column-gap-none",
+    "columnGapXs": "pf-m-column-gap-xs",
     "columnGapSm": "pf-m-column-gap-sm",
     "columnGapMd": "pf-m-column-gap-md",
     "columnGapLg": "pf-m-column-gap-lg",
@@ -481,6 +494,7 @@ declare const _default: {
     "columnGap_4xl": "pf-m-column-gap-4xl",
     "columnGapOnSm": "pf-m-column-gap-on-sm",
     "columnGapNoneOnSm": "pf-m-column-gap-none-on-sm",
+    "columnGapXsOnSm": "pf-m-column-gap-xs-on-sm",
     "columnGapSmOnSm": "pf-m-column-gap-sm-on-sm",
     "columnGapMdOnSm": "pf-m-column-gap-md-on-sm",
     "columnGapLgOnSm": "pf-m-column-gap-lg-on-sm",
@@ -490,6 +504,7 @@ declare const _default: {
     "columnGap_4xlOnSm": "pf-m-column-gap-4xl-on-sm",
     "columnGapOnMd": "pf-m-column-gap-on-md",
     "columnGapNoneOnMd": "pf-m-column-gap-none-on-md",
+    "columnGapXsOnMd": "pf-m-column-gap-xs-on-md",
     "columnGapSmOnMd": "pf-m-column-gap-sm-on-md",
     "columnGapMdOnMd": "pf-m-column-gap-md-on-md",
     "columnGapLgOnMd": "pf-m-column-gap-lg-on-md",
@@ -499,6 +514,7 @@ declare const _default: {
     "columnGap_4xlOnMd": "pf-m-column-gap-4xl-on-md",
     "columnGapOnLg": "pf-m-column-gap-on-lg",
     "columnGapNoneOnLg": "pf-m-column-gap-none-on-lg",
+    "columnGapXsOnLg": "pf-m-column-gap-xs-on-lg",
     "columnGapSmOnLg": "pf-m-column-gap-sm-on-lg",
     "columnGapMdOnLg": "pf-m-column-gap-md-on-lg",
     "columnGapLgOnLg": "pf-m-column-gap-lg-on-lg",
@@ -508,6 +524,7 @@ declare const _default: {
     "columnGap_4xlOnLg": "pf-m-column-gap-4xl-on-lg",
     "columnGapOnXl": "pf-m-column-gap-on-xl",
     "columnGapNoneOnXl": "pf-m-column-gap-none-on-xl",
+    "columnGapXsOnXl": "pf-m-column-gap-xs-on-xl",
     "columnGapSmOnXl": "pf-m-column-gap-sm-on-xl",
     "columnGapMdOnXl": "pf-m-column-gap-md-on-xl",
     "columnGapLgOnXl": "pf-m-column-gap-lg-on-xl",
@@ -517,6 +534,7 @@ declare const _default: {
     "columnGap_4xlOnXl": "pf-m-column-gap-4xl-on-xl",
     "columnGapOn_2xl": "pf-m-column-gap-on-2xl",
     "columnGapNoneOn_2xl": "pf-m-column-gap-none-on-2xl",
+    "columnGapXsOn_2xl": "pf-m-column-gap-xs-on-2xl",
     "columnGapSmOn_2xl": "pf-m-column-gap-sm-on-2xl",
     "columnGapMdOn_2xl": "pf-m-column-gap-md-on-2xl",
     "columnGapLgOn_2xl": "pf-m-column-gap-lg-on-2xl",

package/css/layouts/Flex/flex.js

@@ -366,6 +366,7 @@ exports.default = {
     "spacer_4xlOn_2xl": "pf-m-spacer-4xl-on-2xl",
     "gap": "pf-m-gap",
     "gapNone": "pf-m-gap-none",
+    "gapXs": "pf-m-gap-xs",
     "gapSm": "pf-m-gap-sm",
     "gapMd": "pf-m-gap-md",
     "gapLg": "pf-m-gap-lg",
@@ -375,6 +376,7 @@ exports.default = {
     "gap_4xl": "pf-m-gap-4xl",
     "gapOnSm": "pf-m-gap-on-sm",
     "gapNoneOnSm": "pf-m-gap-none-on-sm",
+    "gapXsOnSm": "pf-m-gap-xs-on-sm",
     "gapSmOnSm": "pf-m-gap-sm-on-sm",
     "gapMdOnSm": "pf-m-gap-md-on-sm",
     "gapLgOnSm": "pf-m-gap-lg-on-sm",
@@ -384,6 +386,7 @@ exports.default = {
     "gap_4xlOnSm": "pf-m-gap-4xl-on-sm",
     "gapOnMd": "pf-m-gap-on-md",
     "gapNoneOnMd": "pf-m-gap-none-on-md",
+    "gapXsOnMd": "pf-m-gap-xs-on-md",
     "gapSmOnMd": "pf-m-gap-sm-on-md",
     "gapMdOnMd": "pf-m-gap-md-on-md",
     "gapLgOnMd": "pf-m-gap-lg-on-md",
@@ -393,6 +396,7 @@ exports.default = {
     "gap_4xlOnMd": "pf-m-gap-4xl-on-md",
     "gapOnLg": "pf-m-gap-on-lg",
     "gapNoneOnLg": "pf-m-gap-none-on-lg",
+    "gapXsOnLg": "pf-m-gap-xs-on-lg",
     "gapSmOnLg": "pf-m-gap-sm-on-lg",
     "gapMdOnLg": "pf-m-gap-md-on-lg",
     "gapLgOnLg": "pf-m-gap-lg-on-lg",
@@ -402,6 +406,7 @@ exports.default = {
     "gap_4xlOnLg": "pf-m-gap-4xl-on-lg",
     "gapOnXl": "pf-m-gap-on-xl",
     "gapNoneOnXl": "pf-m-gap-none-on-xl",
+    "gapXsOnXl": "pf-m-gap-xs-on-xl",
     "gapSmOnXl": "pf-m-gap-sm-on-xl",
     "gapMdOnXl": "pf-m-gap-md-on-xl",
     "gapLgOnXl": "pf-m-gap-lg-on-xl",
@@ -411,6 +416,7 @@ exports.default = {
     "gap_4xlOnXl": "pf-m-gap-4xl-on-xl",
     "gapOn_2xl": "pf-m-gap-on-2xl",
     "gapNoneOn_2xl": "pf-m-gap-none-on-2xl",
+    "gapXsOn_2xl": "pf-m-gap-xs-on-2xl",
     "gapSmOn_2xl": "pf-m-gap-sm-on-2xl",
     "gapMdOn_2xl": "pf-m-gap-md-on-2xl",
     "gapLgOn_2xl": "pf-m-gap-lg-on-2xl",
@@ -420,6 +426,7 @@ exports.default = {
     "gap_4xlOn_2xl": "pf-m-gap-4xl-on-2xl",
     "rowGap": "pf-m-row-gap",
     "rowGapNone": "pf-m-row-gap-none",
+    "rowGapXs": "pf-m-row-gap-xs",
     "rowGapSm": "pf-m-row-gap-sm",
     "rowGapMd": "pf-m-row-gap-md",
     "rowGapLg": "pf-m-row-gap-lg",
@@ -429,6 +436,7 @@ exports.default = {
     "rowGap_4xl": "pf-m-row-gap-4xl",
     "rowGapOnSm": "pf-m-row-gap-on-sm",
     "rowGapNoneOnSm": "pf-m-row-gap-none-on-sm",
+    "rowGapXsOnSm": "pf-m-row-gap-xs-on-sm",
     "rowGapSmOnSm": "pf-m-row-gap-sm-on-sm",
     "rowGapMdOnSm": "pf-m-row-gap-md-on-sm",
     "rowGapLgOnSm": "pf-m-row-gap-lg-on-sm",
@@ -438,6 +446,7 @@ exports.default = {
     "rowGap_4xlOnSm": "pf-m-row-gap-4xl-on-sm",
     "rowGapOnMd": "pf-m-row-gap-on-md",
     "rowGapNoneOnMd": "pf-m-row-gap-none-on-md",
+    "rowGapXsOnMd": "pf-m-row-gap-xs-on-md",
     "rowGapSmOnMd": "pf-m-row-gap-sm-on-md",
     "rowGapMdOnMd": "pf-m-row-gap-md-on-md",
     "rowGapLgOnMd": "pf-m-row-gap-lg-on-md",
@@ -447,6 +456,7 @@ exports.default = {
     "rowGap_4xlOnMd": "pf-m-row-gap-4xl-on-md",
     "rowGapOnLg": "pf-m-row-gap-on-lg",
     "rowGapNoneOnLg": "pf-m-row-gap-none-on-lg",
+    "rowGapXsOnLg": "pf-m-row-gap-xs-on-lg",
     "rowGapSmOnLg": "pf-m-row-gap-sm-on-lg",
     "rowGapMdOnLg": "pf-m-row-gap-md-on-lg",
     "rowGapLgOnLg": "pf-m-row-gap-lg-on-lg",
@@ -456,6 +466,7 @@ exports.default = {
     "rowGap_4xlOnLg": "pf-m-row-gap-4xl-on-lg",
     "rowGapOnXl": "pf-m-row-gap-on-xl",
     "rowGapNoneOnXl": "pf-m-row-gap-none-on-xl",
+    "rowGapXsOnXl": "pf-m-row-gap-xs-on-xl",
     "rowGapSmOnXl": "pf-m-row-gap-sm-on-xl",
     "rowGapMdOnXl": "pf-m-row-gap-md-on-xl",
     "rowGapLgOnXl": "pf-m-row-gap-lg-on-xl",
@@ -465,6 +476,7 @@ exports.default = {
     "rowGap_4xlOnXl": "pf-m-row-gap-4xl-on-xl",
     "rowGapOn_2xl": "pf-m-row-gap-on-2xl",
     "rowGapNoneOn_2xl": "pf-m-row-gap-none-on-2xl",
+    "rowGapXsOn_2xl": "pf-m-row-gap-xs-on-2xl",
     "rowGapSmOn_2xl": "pf-m-row-gap-sm-on-2xl",
     "rowGapMdOn_2xl": "pf-m-row-gap-md-on-2xl",
     "rowGapLgOn_2xl": "pf-m-row-gap-lg-on-2xl",
@@ -474,6 +486,7 @@ exports.default = {
     "rowGap_4xlOn_2xl": "pf-m-row-gap-4xl-on-2xl",
     "columnGap": "pf-m-column-gap",
     "columnGapNone": "pf-m-column-gap-none",
+    "columnGapXs": "pf-m-column-gap-xs",
     "columnGapSm": "pf-m-column-gap-sm",
     "columnGapMd": "pf-m-column-gap-md",
     "columnGapLg": "pf-m-column-gap-lg",
@@ -483,6 +496,7 @@ exports.default = {
     "columnGap_4xl": "pf-m-column-gap-4xl",
     "columnGapOnSm": "pf-m-column-gap-on-sm",
     "columnGapNoneOnSm": "pf-m-column-gap-none-on-sm",
+    "columnGapXsOnSm": "pf-m-column-gap-xs-on-sm",
     "columnGapSmOnSm": "pf-m-column-gap-sm-on-sm",
     "columnGapMdOnSm": "pf-m-column-gap-md-on-sm",
     "columnGapLgOnSm": "pf-m-column-gap-lg-on-sm",
@@ -492,6 +506,7 @@ exports.default = {
     "columnGap_4xlOnSm": "pf-m-column-gap-4xl-on-sm",
     "columnGapOnMd": "pf-m-column-gap-on-md",
     "columnGapNoneOnMd": "pf-m-column-gap-none-on-md",
+    "columnGapXsOnMd": "pf-m-column-gap-xs-on-md",
     "columnGapSmOnMd": "pf-m-column-gap-sm-on-md",
     "columnGapMdOnMd": "pf-m-column-gap-md-on-md",
     "columnGapLgOnMd": "pf-m-column-gap-lg-on-md",
@@ -501,6 +516,7 @@ exports.default = {
     "columnGap_4xlOnMd": "pf-m-column-gap-4xl-on-md",
     "columnGapOnLg": "pf-m-column-gap-on-lg",
     "columnGapNoneOnLg": "pf-m-column-gap-none-on-lg",
+    "columnGapXsOnLg": "pf-m-column-gap-xs-on-lg",
     "columnGapSmOnLg": "pf-m-column-gap-sm-on-lg",
     "columnGapMdOnLg": "pf-m-column-gap-md-on-lg",
     "columnGapLgOnLg": "pf-m-column-gap-lg-on-lg",
@@ -510,6 +526,7 @@ exports.default = {
     "columnGap_4xlOnLg": "pf-m-column-gap-4xl-on-lg",
     "columnGapOnXl": "pf-m-column-gap-on-xl",
     "columnGapNoneOnXl": "pf-m-column-gap-none-on-xl",
+    "columnGapXsOnXl": "pf-m-column-gap-xs-on-xl",
     "columnGapSmOnXl": "pf-m-column-gap-sm-on-xl",
     "columnGapMdOnXl": "pf-m-column-gap-md-on-xl",
     "columnGapLgOnXl": "pf-m-column-gap-lg-on-xl",
@@ -519,6 +536,7 @@ exports.default = {
     "columnGap_4xlOnXl": "pf-m-column-gap-4xl-on-xl",
     "columnGapOn_2xl": "pf-m-column-gap-on-2xl",
     "columnGapNoneOn_2xl": "pf-m-column-gap-none-on-2xl",
+    "columnGapXsOn_2xl": "pf-m-column-gap-xs-on-2xl",
     "columnGapSmOn_2xl": "pf-m-column-gap-sm-on-2xl",
     "columnGapMdOn_2xl": "pf-m-column-gap-md-on-2xl",
     "columnGapLgOn_2xl": "pf-m-column-gap-lg-on-2xl",

package/css/layouts/Flex/flex.mjs

@@ -364,6 +364,7 @@ export default {
     "spacer_4xlOn_2xl": "pf-m-spacer-4xl-on-2xl",
     "gap": "pf-m-gap",
     "gapNone": "pf-m-gap-none",
+    "gapXs": "pf-m-gap-xs",
     "gapSm": "pf-m-gap-sm",
     "gapMd": "pf-m-gap-md",
     "gapLg": "pf-m-gap-lg",
@@ -373,6 +374,7 @@ export default {
     "gap_4xl": "pf-m-gap-4xl",
     "gapOnSm": "pf-m-gap-on-sm",
     "gapNoneOnSm": "pf-m-gap-none-on-sm",
+    "gapXsOnSm": "pf-m-gap-xs-on-sm",
     "gapSmOnSm": "pf-m-gap-sm-on-sm",
     "gapMdOnSm": "pf-m-gap-md-on-sm",
     "gapLgOnSm": "pf-m-gap-lg-on-sm",
@@ -382,6 +384,7 @@ export default {
     "gap_4xlOnSm": "pf-m-gap-4xl-on-sm",
     "gapOnMd": "pf-m-gap-on-md",
     "gapNoneOnMd": "pf-m-gap-none-on-md",
+    "gapXsOnMd": "pf-m-gap-xs-on-md",
     "gapSmOnMd": "pf-m-gap-sm-on-md",
     "gapMdOnMd": "pf-m-gap-md-on-md",
     "gapLgOnMd": "pf-m-gap-lg-on-md",
@@ -391,6 +394,7 @@ export default {
     "gap_4xlOnMd": "pf-m-gap-4xl-on-md",
     "gapOnLg": "pf-m-gap-on-lg",
     "gapNoneOnLg": "pf-m-gap-none-on-lg",
+    "gapXsOnLg": "pf-m-gap-xs-on-lg",
     "gapSmOnLg": "pf-m-gap-sm-on-lg",
     "gapMdOnLg": "pf-m-gap-md-on-lg",
     "gapLgOnLg": "pf-m-gap-lg-on-lg",
@@ -400,6 +404,7 @@ export default {
     "gap_4xlOnLg": "pf-m-gap-4xl-on-lg",
     "gapOnXl": "pf-m-gap-on-xl",
     "gapNoneOnXl": "pf-m-gap-none-on-xl",
+    "gapXsOnXl": "pf-m-gap-xs-on-xl",
     "gapSmOnXl": "pf-m-gap-sm-on-xl",
     "gapMdOnXl": "pf-m-gap-md-on-xl",
     "gapLgOnXl": "pf-m-gap-lg-on-xl",
@@ -409,6 +414,7 @@ export default {
     "gap_4xlOnXl": "pf-m-gap-4xl-on-xl",
     "gapOn_2xl": "pf-m-gap-on-2xl",
     "gapNoneOn_2xl": "pf-m-gap-none-on-2xl",
+    "gapXsOn_2xl": "pf-m-gap-xs-on-2xl",
     "gapSmOn_2xl": "pf-m-gap-sm-on-2xl",
     "gapMdOn_2xl": "pf-m-gap-md-on-2xl",
     "gapLgOn_2xl": "pf-m-gap-lg-on-2xl",
@@ -418,6 +424,7 @@ export default {
     "gap_4xlOn_2xl": "pf-m-gap-4xl-on-2xl",
     "rowGap": "pf-m-row-gap",
     "rowGapNone": "pf-m-row-gap-none",
+    "rowGapXs": "pf-m-row-gap-xs",
     "rowGapSm": "pf-m-row-gap-sm",
     "rowGapMd": "pf-m-row-gap-md",
     "rowGapLg": "pf-m-row-gap-lg",
@@ -427,6 +434,7 @@ export default {
     "rowGap_4xl": "pf-m-row-gap-4xl",
     "rowGapOnSm": "pf-m-row-gap-on-sm",
     "rowGapNoneOnSm": "pf-m-row-gap-none-on-sm",
+    "rowGapXsOnSm": "pf-m-row-gap-xs-on-sm",
     "rowGapSmOnSm": "pf-m-row-gap-sm-on-sm",
     "rowGapMdOnSm": "pf-m-row-gap-md-on-sm",
     "rowGapLgOnSm": "pf-m-row-gap-lg-on-sm",
@@ -436,6 +444,7 @@ export default {
     "rowGap_4xlOnSm": "pf-m-row-gap-4xl-on-sm",
     "rowGapOnMd": "pf-m-row-gap-on-md",
     "rowGapNoneOnMd": "pf-m-row-gap-none-on-md",
+    "rowGapXsOnMd": "pf-m-row-gap-xs-on-md",
     "rowGapSmOnMd": "pf-m-row-gap-sm-on-md",
     "rowGapMdOnMd": "pf-m-row-gap-md-on-md",
     "rowGapLgOnMd": "pf-m-row-gap-lg-on-md",
@@ -445,6 +454,7 @@ export default {
     "rowGap_4xlOnMd": "pf-m-row-gap-4xl-on-md",
     "rowGapOnLg": "pf-m-row-gap-on-lg",
     "rowGapNoneOnLg": "pf-m-row-gap-none-on-lg",
+    "rowGapXsOnLg": "pf-m-row-gap-xs-on-lg",
     "rowGapSmOnLg": "pf-m-row-gap-sm-on-lg",
     "rowGapMdOnLg": "pf-m-row-gap-md-on-lg",
     "rowGapLgOnLg": "pf-m-row-gap-lg-on-lg",
@@ -454,6 +464,7 @@ export default {
     "rowGap_4xlOnLg": "pf-m-row-gap-4xl-on-lg",
     "rowGapOnXl": "pf-m-row-gap-on-xl",
     "rowGapNoneOnXl": "pf-m-row-gap-none-on-xl",
+    "rowGapXsOnXl": "pf-m-row-gap-xs-on-xl",
     "rowGapSmOnXl": "pf-m-row-gap-sm-on-xl",
     "rowGapMdOnXl": "pf-m-row-gap-md-on-xl",
     "rowGapLgOnXl": "pf-m-row-gap-lg-on-xl",
@@ -463,6 +474,7 @@ export default {
     "rowGap_4xlOnXl": "pf-m-row-gap-4xl-on-xl",
     "rowGapOn_2xl": "pf-m-row-gap-on-2xl",
     "rowGapNoneOn_2xl": "pf-m-row-gap-none-on-2xl",
+    "rowGapXsOn_2xl": "pf-m-row-gap-xs-on-2xl",
     "rowGapSmOn_2xl": "pf-m-row-gap-sm-on-2xl",
     "rowGapMdOn_2xl": "pf-m-row-gap-md-on-2xl",
     "rowGapLgOn_2xl": "pf-m-row-gap-lg-on-2xl",
@@ -472,6 +484,7 @@ export default {
     "rowGap_4xlOn_2xl": "pf-m-row-gap-4xl-on-2xl",
     "columnGap": "pf-m-column-gap",
     "columnGapNone": "pf-m-column-gap-none",
+    "columnGapXs": "pf-m-column-gap-xs",
     "columnGapSm": "pf-m-column-gap-sm",
     "columnGapMd": "pf-m-column-gap-md",
     "columnGapLg": "pf-m-column-gap-lg",
@@ -481,6 +494,7 @@ export default {
     "columnGap_4xl": "pf-m-column-gap-4xl",
     "columnGapOnSm": "pf-m-column-gap-on-sm",
     "columnGapNoneOnSm": "pf-m-column-gap-none-on-sm",
+    "columnGapXsOnSm": "pf-m-column-gap-xs-on-sm",
     "columnGapSmOnSm": "pf-m-column-gap-sm-on-sm",
     "columnGapMdOnSm": "pf-m-column-gap-md-on-sm",
     "columnGapLgOnSm": "pf-m-column-gap-lg-on-sm",
@@ -490,6 +504,7 @@ export default {
     "columnGap_4xlOnSm": "pf-m-column-gap-4xl-on-sm",
     "columnGapOnMd": "pf-m-column-gap-on-md",
     "columnGapNoneOnMd": "pf-m-column-gap-none-on-md",
+    "columnGapXsOnMd": "pf-m-column-gap-xs-on-md",
     "columnGapSmOnMd": "pf-m-column-gap-sm-on-md",
     "columnGapMdOnMd": "pf-m-column-gap-md-on-md",
     "columnGapLgOnMd": "pf-m-column-gap-lg-on-md",
@@ -499,6 +514,7 @@ export default {
     "columnGap_4xlOnMd": "pf-m-column-gap-4xl-on-md",
     "columnGapOnLg": "pf-m-column-gap-on-lg",
     "columnGapNoneOnLg": "pf-m-column-gap-none-on-lg",
+    "columnGapXsOnLg": "pf-m-column-gap-xs-on-lg",
     "columnGapSmOnLg": "pf-m-column-gap-sm-on-lg",
     "columnGapMdOnLg": "pf-m-column-gap-md-on-lg",
     "columnGapLgOnLg": "pf-m-column-gap-lg-on-lg",
@@ -508,6 +524,7 @@ export default {
     "columnGap_4xlOnLg": "pf-m-column-gap-4xl-on-lg",
     "columnGapOnXl": "pf-m-column-gap-on-xl",
     "columnGapNoneOnXl": "pf-m-column-gap-none-on-xl",
+    "columnGapXsOnXl": "pf-m-column-gap-xs-on-xl",
     "columnGapSmOnXl": "pf-m-column-gap-sm-on-xl",
     "columnGapMdOnXl": "pf-m-column-gap-md-on-xl",
     "columnGapLgOnXl": "pf-m-column-gap-lg-on-xl",
@@ -517,6 +534,7 @@ export default {
     "columnGap_4xlOnXl": "pf-m-column-gap-4xl-on-xl",
     "columnGapOn_2xl": "pf-m-column-gap-on-2xl",
     "columnGapNoneOn_2xl": "pf-m-column-gap-none-on-2xl",
+    "columnGapXsOn_2xl": "pf-m-column-gap-xs-on-2xl",
     "columnGapSmOn_2xl": "pf-m-column-gap-sm-on-2xl",
     "columnGapMdOn_2xl": "pf-m-column-gap-md-on-2xl",
     "columnGapLgOn_2xl": "pf-m-column-gap-lg-on-2xl",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@patternfly/react-styles",
-  "version": "5.0.0-alpha.14",
+  "version": "5.0.0-alpha.16",
   "main": "dist/js/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/esm/index.d.ts",
@@ -19,7 +19,7 @@
     "clean": "rimraf dist css"
   },
   "devDependencies": {
-    "@patternfly/patternfly": "5.0.0-alpha.59",
+    "@patternfly/patternfly": "5.0.0-alpha.64",
     "camel-case": "^3.0.0",
     "css": "^2.2.3",
     "fs-extra": "^11.1.1",
@@ -29,5 +29,5 @@
     "typescript": "^4.7.4"
   },
   "license": "MIT",
-  "gitHead": "eac4934781b7f38e76d19d862f442a868ec594d2"
+  "gitHead": "ff94267709508525b7fe8dd1da0b7ea6a33854aa"
 }

package/src/css/components/Popper/Popper.css

@@ -1,4 +1,4 @@
-.pf-c-popover[data-popper-reference-hidden="true"] {
+.pf-v5-c-popover[data-popper-reference-hidden="true"] {
     visibility: hidden;
     pointer-events: none;
 }