@patternfly/react-core 4.231.9 → 4.232.2

package/CHANGELOG.md

@@ -3,6 +3,33 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 4.232.2 (2022-08-16)
+
+**Note:** Version bump only for package @patternfly/react-core
+
+
+
+
+
+## 4.232.1 (2022-08-16)
+
+**Note:** Version bump only for package @patternfly/react-core
+
+
+
+
+
+# 4.232.0 (2022-08-16)
+
+
+### Features
+
+* Allow for 'next' and 'deprecated' react-core subpaths ([#7824](https://github.com/patternfly/patternfly-react/issues/7824)) ([0e68bd3](https://github.com/patternfly/patternfly-react/commit/0e68bd349e9a8b4b08bb8b777358dcde41d5462f))
+
+
+
+
+
 ## 4.231.9 (2022-08-15)
 
 **Note:** Version bump only for package @patternfly/react-core

package/dist/esm/deprecated/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/deprecated/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/deprecated/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/esm/deprecated/components/index.js

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.js.map

package/dist/esm/deprecated/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/deprecated/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/esm/deprecated/index.d.ts

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/deprecated/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/deprecated/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/esm/deprecated/index.js

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.js.map

package/dist/esm/deprecated/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/deprecated/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/esm/next/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/next/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/esm/next/components/index.js

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.js.map

package/dist/esm/next/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/esm/next/index.d.ts

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.d.ts.map

package/dist/esm/next/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/next/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/esm/next/index.js

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.js.map

package/dist/esm/next/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/next/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/js/deprecated/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.d.ts.map

package/dist/js/deprecated/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/deprecated/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/js/deprecated/components/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./"), exports);
+//# sourceMappingURL=index.js.map

package/dist/js/deprecated/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/deprecated/components/index.ts"],"names":[],"mappings":";;;AAAA,6CAAmB"}

package/dist/js/deprecated/index.d.ts

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.d.ts.map

package/dist/js/deprecated/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/deprecated/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/js/deprecated/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./components"), exports);
+//# sourceMappingURL=index.js.map

package/dist/js/deprecated/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/deprecated/index.ts"],"names":[],"mappings":";;;AAAA,uDAA6B"}

package/dist/js/next/components/index.d.ts

@@ -0,0 +1,2 @@
+export * from './';
+//# sourceMappingURL=index.d.ts.map

package/dist/js/next/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}

package/dist/js/next/components/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./"), exports);
+//# sourceMappingURL=index.js.map

package/dist/js/next/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":";;;AAAA,6CAAmB"}

package/dist/js/next/index.d.ts

@@ -0,0 +1,2 @@
+export * from './components';
+//# sourceMappingURL=index.d.ts.map

package/dist/js/next/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/next/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC"}

package/dist/js/next/index.js

@@ -0,0 +1,5 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+tslib_1.__exportStar(require("./components"), exports);
+//# sourceMappingURL=index.js.map

package/dist/js/next/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/next/index.ts"],"names":[],"mappings":";;;AAAA,uDAA6B"}

package/dist/umd/react-core.css

@@ -3206,116 +3206,6 @@ button.pf-c-breadcrumb__link {
   --pf-c-card--m-selectable-raised--active--BoxShadow: var(--pf-global--BoxShadow--lg);
 }
 
-.pf-c-clipboard-copy {
-  --pf-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
-  --pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
-  --pf-c-clipboard-copy__expandable-content--PaddingTop: var(--pf-global--spacer--md);
-  --pf-c-clipboard-copy__expandable-content--PaddingRight: var(--pf-global--spacer--md);
-  --pf-c-clipboard-copy__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
-  --pf-c-clipboard-copy__expandable-content--PaddingLeft: var(--pf-global--spacer--md);
-  --pf-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
-  --pf-c-clipboard-copy__expandable-content--BorderTopWidth: 0;
-  --pf-c-clipboard-copy__expandable-content--BorderRightWidth: var(--pf-global--BorderWidth--sm);
-  --pf-c-clipboard-copy__expandable-content--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
-  --pf-c-clipboard-copy__expandable-content--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
-  --pf-c-clipboard-copy__expandable-content--BorderColor: var(--pf-global--BorderColor--100);
-  --pf-c-clipboard-copy__expandable-content--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
-  --pf-c-clipboard-copy--m-inline--PaddingTop: 0;
-  --pf-c-clipboard-copy--m-inline--PaddingBottom: 0;
-  --pf-c-clipboard-copy--m-inline--PaddingLeft: var(--pf-global--spacer--xs);
-  --pf-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-global--BackgroundColor--200);
-  --pf-c-clipboard-copy__text--m-code--FontFamily: var(--pf-global--FontFamily--monospace);
-  --pf-c-clipboard-copy__text--m-code--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-clipboard-copy__actions-item--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
-  --pf-c-clipboard-copy__actions-item--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
-  --pf-c-clipboard-copy__actions-item--button--PaddingTop: var(--pf-global--spacer--xs);
-  --pf-c-clipboard-copy__actions-item--button--PaddingRight: var(--pf-global--spacer--sm);
-  --pf-c-clipboard-copy__actions-item--button--PaddingBottom: var(--pf-global--spacer--xs);
-  --pf-c-clipboard-copy__actions-item--button--PaddingLeft: var(--pf-global--spacer--sm);
-}
-
-.pf-c-clipboard-copy.pf-m-expanded .pf-c-clipboard-copy__toggle-icon {
-  transform: rotate(var(--pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate));
-}
-
-.pf-c-clipboard-copy.pf-m-inline {
-  display: inline;
-  padding-top: var(--pf-c-clipboard-copy--m-inline--PaddingTop);
-  padding-bottom: var(--pf-c-clipboard-copy--m-inline--PaddingBottom);
-  padding-left: var(--pf-c-clipboard-copy--m-inline--PaddingLeft);
-  white-space: nowrap;
-  background-color: var(--pf-c-clipboard-copy--m-inline--BackgroundColor);
-}
-
-.pf-c-clipboard-copy.pf-m-inline.pf-m-block {
-  display: block;
-}
-
-.pf-c-clipboard-copy__group {
-  display: flex;
-}
-
-.pf-c-clipboard-copy__group > * + * {
-  margin-left: -1px;
-}
-
-.pf-c-clipboard-copy__toggle-icon {
-  transition: var(--pf-c-clipboard-copy__toggle-icon--Transition);
-}
-
-.pf-c-clipboard-copy__expandable-content {
-  padding: var(--pf-c-clipboard-copy__expandable-content--PaddingTop) var(--pf-c-clipboard-copy__expandable-content--PaddingRight) var(--pf-c-clipboard-copy__expandable-content--PaddingBottom) var(--pf-c-clipboard-copy__expandable-content--PaddingLeft);
-  word-wrap: break-word;
-  background-color: var(--pf-c-clipboard-copy__expandable-content--BackgroundColor);
-  background-clip: padding-box;
-  border: solid var(--pf-c-clipboard-copy__expandable-content--BorderColor);
-  border-width: var(--pf-c-clipboard-copy__expandable-content--BorderTopWidth) var(--pf-c-clipboard-copy__expandable-content--BorderRightWidth) var(--pf-c-clipboard-copy__expandable-content--BorderBottomWidth) var(--pf-c-clipboard-copy__expandable-content--BorderLeftWidth);
-  box-shadow: var(--pf-c-clipboard-copy__expandable-content--BoxShadow);
-}
-
-.pf-c-clipboard-copy__expandable-content pre {
-  white-space: pre-wrap;
-}
-
-.pf-c-clipboard-copy__text {
-  word-break: break-word;
-  white-space: normal;
-}
-
-.pf-c-clipboard-copy__text.pf-m-code {
-  font-family: var(--pf-c-clipboard-copy__text--m-code--FontFamily);
-  font-size: var(--pf-c-clipboard-copy__text--m-code--FontSize);
-}
-
-.pf-c-clipboard-copy__actions {
-  display: inline-flex;
-}
-
-.pf-c-clipboard-copy__actions-item {
-  margin-top: calc(-1 * var(--pf-c-clipboard-copy__actions-item--button--PaddingTop));
-  margin-bottom: calc(-1 * var(--pf-c-clipboard-copy__actions-item--button--PaddingBottom));
-}
-
-.pf-c-clipboard-copy__actions-item .pf-c-button {
-  --pf-c-button--PaddingTop: var(--pf-c-clipboard-copy__actions-item--button--PaddingTop);
-  --pf-c-button--PaddingRight: var(--pf-c-clipboard-copy__actions-item--button--PaddingRight);
-  --pf-c-button--PaddingBottom: var(--pf-c-clipboard-copy__actions-item--button--PaddingBottom);
-  --pf-c-button--PaddingLeft: var(--pf-c-clipboard-copy__actions-item--button--PaddingLeft);
-}
-
-:where(.pf-theme-dark) .pf-c-clipboard-copy {
-  --pf-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-global--BackgroundColor--400);
-}
-
-:where(.pf-theme-dark) .pf-c-clipboard-copy__group > * + * {
-  margin-left: 0;
-  border-left: 1px solid var(--pf-global--palette--black-700) !important;
-}
-
-:where(.pf-theme-dark) .pf-c-clipboard-copy__expandable-content {
-  border: 0;
-}
-
 .pf-c-check {
   --pf-c-check--GridGap: var(--pf-global--spacer--xs) var(--pf-global--spacer--sm);
   --pf-c-check__label--disabled--Color: var(--pf-global--disabled-color--100);
@@ -3378,89 +3268,6 @@ label.pf-c-check, .pf-c-check__label,
   cursor: not-allowed;
 }
 
-.pf-c-chip-group {
-  --pf-global--Color--100: var(--pf-global--Color--dark-100);
-  --pf-global--Color--200: var(--pf-global--Color--dark-200);
-  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
-  --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
-  --pf-global--link--Color: var(--pf-global--link--Color--dark);
-  --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
-  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
-}
-
-.pf-c-chip-group {
-  color: var(--pf-global--Color--100);
-  --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
-  --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
-  --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
-  --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
-  --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
-  --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
-  --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
-  --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
-  --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
-  --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-chip-group__label--MaxWidth: 18ch;
-  --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
-  --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
-  --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
-  --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
-  max-width: 100%;
-}
-
-.pf-c-chip-group.pf-m-category {
-  padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
-  padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
-  padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
-  padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
-  background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
-  border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
-}
-
-.pf-c-chip-group__main {
-  display: flex;
-  flex: 1;
-  flex-wrap: wrap;
-  align-items: baseline;
-  min-width: 0;
-}
-
-.pf-c-chip-group__list {
-  margin-right: var(--pf-c-chip-group__list--MarginRight);
-  margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
-}
-
-.pf-c-chip-group,
-.pf-c-chip-group__list {
-  display: inline-flex;
-  flex-wrap: wrap;
-  align-items: center;
-  min-width: 0;
-}
-
-.pf-c-chip-group__list-item {
-  display: inline-flex;
-  min-width: 0;
-  margin-right: var(--pf-c-chip-group__list-item--MarginRight);
-  margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
-}
-
-.pf-c-chip-group__label {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  max-width: var(--pf-c-chip-group__label--MaxWidth);
-  margin-right: var(--pf-c-chip-group__label--MarginRight);
-  font-size: var(--pf-c-chip-group__label--FontSize);
-}
-
-.pf-c-chip-group__close {
-  display: flex;
-  align-self: flex-start;
-  margin-top: var(--pf-c-chip-group__close--MarginTop);
-  margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
-}
-
 .pf-c-chip {
   --pf-global--Color--100: var(--pf-global--Color--dark-100);
   --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -3573,6 +3380,199 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-chip--m-draggable--BackgroundColor: var(--pf-global--palette--black-600);
 }
 
+.pf-c-chip-group {
+  --pf-global--Color--100: var(--pf-global--Color--dark-100);
+  --pf-global--Color--200: var(--pf-global--Color--dark-200);
+  --pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
+  --pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
+  --pf-global--link--Color: var(--pf-global--link--Color--dark);
+  --pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
+  --pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
+}
+
+.pf-c-chip-group {
+  color: var(--pf-global--Color--100);
+  --pf-c-chip-group__list--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
+  --pf-c-chip-group__list--MarginRight: calc(var(--pf-global--spacer--xs) * -1);
+  --pf-c-chip-group--m-category--PaddingTop: var(--pf-global--spacer--xs);
+  --pf-c-chip-group--m-category--PaddingRight: var(--pf-global--spacer--xs);
+  --pf-c-chip-group--m-category--PaddingBottom: var(--pf-global--spacer--xs);
+  --pf-c-chip-group--m-category--PaddingLeft: var(--pf-global--spacer--sm);
+  --pf-c-chip-group--m-category--BorderRadius: var(--pf-global--BorderRadius--sm);
+  --pf-c-chip-group--m-category--BackgroundColor: var(--pf-global--BackgroundColor--200);
+  --pf-c-chip-group__label--MarginRight: var(--pf-global--spacer--sm);
+  --pf-c-chip-group__label--FontSize: var(--pf-global--FontSize--sm);
+  --pf-c-chip-group__label--MaxWidth: 18ch;
+  --pf-c-chip-group__close--MarginTop: calc(var(--pf-global--spacer--xs) * -1);
+  --pf-c-chip-group__close--MarginBottom: calc(var(--pf-global--spacer--xs) * -1);
+  --pf-c-chip-group__list-item--MarginRight: var(--pf-global--spacer--xs);
+  --pf-c-chip-group__list-item--MarginBottom: var(--pf-global--spacer--xs);
+  max-width: 100%;
+}
+
+.pf-c-chip-group.pf-m-category {
+  padding-top: var(--pf-c-chip-group--m-category--PaddingTop);
+  padding-right: var(--pf-c-chip-group--m-category--PaddingRight);
+  padding-bottom: var(--pf-c-chip-group--m-category--PaddingBottom);
+  padding-left: var(--pf-c-chip-group--m-category--PaddingLeft);
+  background-color: var(--pf-c-chip-group--m-category--BackgroundColor);
+  border-radius: var(--pf-c-chip-group--m-category--BorderRadius);
+}
+
+.pf-c-chip-group__main {
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  align-items: baseline;
+  min-width: 0;
+}
+
+.pf-c-chip-group__list {
+  margin-right: var(--pf-c-chip-group__list--MarginRight);
+  margin-bottom: var(--pf-c-chip-group__list--MarginBottom);
+}
+
+.pf-c-chip-group,
+.pf-c-chip-group__list {
+  display: inline-flex;
+  flex-wrap: wrap;
+  align-items: center;
+  min-width: 0;
+}
+
+.pf-c-chip-group__list-item {
+  display: inline-flex;
+  min-width: 0;
+  margin-right: var(--pf-c-chip-group__list-item--MarginRight);
+  margin-bottom: var(--pf-c-chip-group__list-item--MarginBottom);
+}
+
+.pf-c-chip-group__label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: var(--pf-c-chip-group__label--MaxWidth);
+  margin-right: var(--pf-c-chip-group__label--MarginRight);
+  font-size: var(--pf-c-chip-group__label--FontSize);
+}
+
+.pf-c-chip-group__close {
+  display: flex;
+  align-self: flex-start;
+  margin-top: var(--pf-c-chip-group__close--MarginTop);
+  margin-bottom: var(--pf-c-chip-group__close--MarginBottom);
+}
+
+.pf-c-clipboard-copy {
+  --pf-c-clipboard-copy__toggle-icon--Transition: .2s ease-in 0s;
+  --pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate: 90deg;
+  --pf-c-clipboard-copy__expandable-content--PaddingTop: var(--pf-global--spacer--md);
+  --pf-c-clipboard-copy__expandable-content--PaddingRight: var(--pf-global--spacer--md);
+  --pf-c-clipboard-copy__expandable-content--PaddingBottom: var(--pf-global--spacer--md);
+  --pf-c-clipboard-copy__expandable-content--PaddingLeft: var(--pf-global--spacer--md);
+  --pf-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
+  --pf-c-clipboard-copy__expandable-content--BorderTopWidth: 0;
+  --pf-c-clipboard-copy__expandable-content--BorderRightWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-clipboard-copy__expandable-content--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-clipboard-copy__expandable-content--BorderLeftWidth: var(--pf-global--BorderWidth--sm);
+  --pf-c-clipboard-copy__expandable-content--BorderColor: var(--pf-global--BorderColor--100);
+  --pf-c-clipboard-copy__expandable-content--OutlineOffset: calc(-1 * var(--pf-global--spacer--xs));
+  --pf-c-clipboard-copy--m-inline--PaddingTop: 0;
+  --pf-c-clipboard-copy--m-inline--PaddingBottom: 0;
+  --pf-c-clipboard-copy--m-inline--PaddingLeft: var(--pf-global--spacer--xs);
+  --pf-c-clipboard-copy--m-inline--BackgroundColor: var(--pf-global--BackgroundColor--200);
+  --pf-c-clipboard-copy__text--m-code--FontFamily: var(--pf-global--FontFamily--monospace);
+  --pf-c-clipboard-copy__text--m-code--FontSize: var(--pf-global--FontSize--sm);
+  --pf-c-clipboard-copy__actions-item--MarginTop: calc(-1 * var(--pf-global--spacer--form-element));
+  --pf-c-clipboard-copy__actions-item--MarginBottom: calc(-1 * var(--pf-global--spacer--form-element));
+  --pf-c-clipboard-copy__actions-item--button--PaddingTop: var(--pf-global--spacer--xs);
+  --pf-c-clipboard-copy__actions-item--button--PaddingRight: var(--pf-global--spacer--sm);
+  --pf-c-clipboard-copy__actions-item--button--PaddingBottom: var(--pf-global--spacer--xs);
+  --pf-c-clipboard-copy__actions-item--button--PaddingLeft: var(--pf-global--spacer--sm);
+}
+
+.pf-c-clipboard-copy.pf-m-expanded .pf-c-clipboard-copy__toggle-icon {
+  transform: rotate(var(--pf-c-clipboard-copy--m-expanded__toggle-icon--Rotate));
+}
+
+.pf-c-clipboard-copy.pf-m-inline {
+  display: inline;
+  padding-top: var(--pf-c-clipboard-copy--m-inline--PaddingTop);
+  padding-bottom: var(--pf-c-clipboard-copy--m-inline--PaddingBottom);
+  padding-left: var(--pf-c-clipboard-copy--m-inline--PaddingLeft);
+  white-space: nowrap;
+  background-color: var(--pf-c-clipboard-copy--m-inline--BackgroundColor);
+}
+
+.pf-c-clipboard-copy.pf-m-inline.pf-m-block {
+  display: block;
+}
+
+.pf-c-clipboard-copy__group {
+  display: flex;
+}
+
+.pf-c-clipboard-copy__group > * + * {
+  margin-left: -1px;
+}
+
+.pf-c-clipboard-copy__toggle-icon {
+  transition: var(--pf-c-clipboard-copy__toggle-icon--Transition);
+}
+
+.pf-c-clipboard-copy__expandable-content {
+  padding: var(--pf-c-clipboard-copy__expandable-content--PaddingTop) var(--pf-c-clipboard-copy__expandable-content--PaddingRight) var(--pf-c-clipboard-copy__expandable-content--PaddingBottom) var(--pf-c-clipboard-copy__expandable-content--PaddingLeft);
+  word-wrap: break-word;
+  background-color: var(--pf-c-clipboard-copy__expandable-content--BackgroundColor);
+  background-clip: padding-box;
+  border: solid var(--pf-c-clipboard-copy__expandable-content--BorderColor);
+  border-width: var(--pf-c-clipboard-copy__expandable-content--BorderTopWidth) var(--pf-c-clipboard-copy__expandable-content--BorderRightWidth) var(--pf-c-clipboard-copy__expandable-content--BorderBottomWidth) var(--pf-c-clipboard-copy__expandable-content--BorderLeftWidth);
+  box-shadow: var(--pf-c-clipboard-copy__expandable-content--BoxShadow);
+}
+
+.pf-c-clipboard-copy__expandable-content pre {
+  white-space: pre-wrap;
+}
+
+.pf-c-clipboard-copy__text {
+  word-break: break-word;
+  white-space: normal;
+}
+
+.pf-c-clipboard-copy__text.pf-m-code {
+  font-family: var(--pf-c-clipboard-copy__text--m-code--FontFamily);
+  font-size: var(--pf-c-clipboard-copy__text--m-code--FontSize);
+}
+
+.pf-c-clipboard-copy__actions {
+  display: inline-flex;
+}
+
+.pf-c-clipboard-copy__actions-item {
+  margin-top: calc(-1 * var(--pf-c-clipboard-copy__actions-item--button--PaddingTop));
+  margin-bottom: calc(-1 * var(--pf-c-clipboard-copy__actions-item--button--PaddingBottom));
+}
+
+.pf-c-clipboard-copy__actions-item .pf-c-button {
+  --pf-c-button--PaddingTop: var(--pf-c-clipboard-copy__actions-item--button--PaddingTop);
+  --pf-c-button--PaddingRight: var(--pf-c-clipboard-copy__actions-item--button--PaddingRight);
+  --pf-c-button--PaddingBottom: var(--pf-c-clipboard-copy__actions-item--button--PaddingBottom);
+  --pf-c-button--PaddingLeft: var(--pf-c-clipboard-copy__actions-item--button--PaddingLeft);
+}
+
+:where(.pf-theme-dark) .pf-c-clipboard-copy {
+  --pf-c-clipboard-copy__expandable-content--BackgroundColor: var(--pf-global--BackgroundColor--400);
+}
+
+:where(.pf-theme-dark) .pf-c-clipboard-copy__group > * + * {
+  margin-left: 0;
+  border-left: 1px solid var(--pf-global--palette--black-700) !important;
+}
+
+:where(.pf-theme-dark) .pf-c-clipboard-copy__expandable-content {
+  border: 0;
+}
+
 .pf-c-code-block {
   --pf-c-code-block--BackgroundColor: var(--pf-global--BackgroundColor--200);
   --pf-c-code-block__header--BorderBottomWidth: var(--pf-global--BorderWidth--sm);

package/package.json

@@ -1,10 +1,26 @@
 {
   "name": "@patternfly/react-core",
-  "version": "4.231.9",
+  "version": "4.232.2",
   "description": "This library provides a set of common React components for use with the PatternFly reference implementation.",
   "main": "dist/js/index.js",
   "module": "dist/esm/index.js",
   "types": "dist/esm/index.d.ts",
+  "exports": {
+    ".": "./dist/esm/index.js",
+    "./next": "./dist/esm/next/index.js",
+    "./deprecated": "./dist/esm/deprecated/index.js",
+    "./package.json": "./package.json"
+  },
+  "typesVersions": {
+    "*": {
+      "next": [
+        "dist/esm/next/index.d.ts"
+      ],
+      "deprecated": [
+        "dist/esm/deprecated/index.d.ts"
+      ]
+    }
+  },
   "patternfly:src": "src/",
   "sideEffects": [
     "*.css",
@@ -34,9 +50,9 @@
     "generate": "node scripts/copyStyles.js"
   },
   "dependencies": {
-    "@patternfly/react-icons": "^4.82.9",
-    "@patternfly/react-styles": "^4.81.9",
-    "@patternfly/react-tokens": "^4.83.9",
+    "@patternfly/react-icons": "^4.83.2",
+    "@patternfly/react-styles": "^4.82.2",
+    "@patternfly/react-tokens": "^4.84.2",
     "focus-trap": "6.9.2",
     "react-dropzone": "9.0.0",
     "tippy.js": "5.1.2",
@@ -60,5 +76,5 @@
     "react": "^16.8.0 || ^17.0.0",
     "react-dom": "^16.8.0 || ^17.0.0"
   },
-  "gitHead": "fb840e86e1266a20d86e640c00941de6d16abfce"
+  "gitHead": "585189d1c581fbdcb89a1874f49bf4a090618792"
 }

package/src/components/Tabs/__tests__/OverflowTab.test.tsx

@@ -0,0 +1,403 @@
+import React from 'react';
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom';
+import userEvent from '@testing-library/user-event';
+import { OverflowTab } from '../OverflowTab';
+import { TabsContext } from '../TabsContext';
+
+jest.mock('../../../helpers', () => ({
+  Popper: ({ trigger, popper, isVisible, popperMatchesTriggerWidth, appendTo }) => (
+    <div data-testid="popper-mock">
+      <div data-testid="trigger">{trigger}</div>
+      <div data-testid="popper">{isVisible && popper}</div>
+      <p>Popper matches trigger width: {`${popperMatchesTriggerWidth}`}</p>
+      <p>Append to class name: {appendTo && `${appendTo.className}`}</p>
+    </div>
+  )
+}));
+
+jest.mock('../../Menu', () => {
+  const { forwardRef } = jest.requireActual('react');
+  return {
+    Menu: forwardRef((props: { children; onSelect }, ref) => (
+      <div data-testid="menu-mock" ref={ref}>
+        {props.children}
+        <button onClick={() => props.onSelect('mouseEvent', 1, 'fakeRef')}>Select</button>
+      </div>
+    )),
+    MenuContent: ({ children }) => <div data-testid="menu-content-mock">{children}</div>,
+    MenuList: ({ children }) => <ul data-testid="menu-list-mock">{children}</ul>,
+    MenuItem: ({ children, itemId, isSelected }) => (
+      <>
+        <li id={`${itemId}-menu-item-mock`}>
+          {children}
+          <p>Selected: {`${isSelected}`}</p>
+        </li>
+      </>
+    )
+  };
+});
+
+const tabsContextDefaultProps = {
+  variant: 'default' as 'default',
+  mountOnEnter: false,
+  unmountOnExit: false,
+  localActiveKey: '',
+  uniqueId: '',
+  handleTabClick: () => null,
+  handleTabClose: undefined
+};
+
+test('Renders', () => {
+  render(
+    <div data-testid="overflow-tab-container">
+      <OverflowTab />
+    </div>
+  );
+
+  expect(screen.getByTestId('overflow-tab-container').firstChild).toBeVisible();
+});
+
+test('Renders with the passed aria label', () => {
+  render(<OverflowTab aria-label="Overflow tab label test" />);
+
+  expect(screen.getByRole('presentation')).toHaveAccessibleName('Overflow tab label test');
+});
+
+test('Renders with inherited element props spread to the component', () => {
+  render(
+    <>
+      <OverflowTab aria-labelledby="labelling-id" />
+      <p id="labelling-id">Label</p>
+    </>
+  );
+
+  expect(screen.getByRole('presentation')).toHaveAccessibleName('Label');
+});
+
+test('Renders with class names pf-m-overflow and pf-c-tabs__item on the presentation element', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('presentation')).toHaveClass('pf-m-overflow');
+  expect(screen.getByRole('presentation')).toHaveClass('pf-c-tabs__item');
+});
+
+test('Renders with class pf-c-tabs__link on the tab element', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).toHaveClass('pf-c-tabs__link');
+});
+
+test("Renders with class pf-c-tabs__link-toggle-icon on the img element's container", () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('img', { hidden: true }).parentElement).toHaveClass('pf-c-tabs__link-toggle-icon');
+});
+
+test('Renders with custom class names provided via prop', () => {
+  render(<OverflowTab className="test-class" />);
+
+  expect(screen.getByRole('presentation')).toHaveClass('test-class');
+});
+
+test('Renders without pf-m-expanded on the tab element by default', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).not.toHaveClass('pf-m-expanded');
+});
+
+test('Renders with pf-m-expanded on the tab element once clicked', () => {
+  render(<OverflowTab />);
+
+  const overflowTab = screen.getByRole('tab');
+
+  userEvent.click(overflowTab);
+
+  expect(overflowTab).toHaveClass('pf-m-expanded');
+});
+
+test('Renders without pf-m-current on the presentation element by default', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('presentation')).not.toHaveClass('pf-m-current');
+});
+
+test('Renders without pf-m-current when the overflowingTabs does not include the tab indicated by localActiveKey via a context', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 0 }}>
+      <OverflowTab overflowingTabs={[{ title: 'tabTitle', eventKey: 1 }]} />
+    </TabsContext.Provider>
+  );
+
+  expect(screen.getByRole('presentation')).not.toHaveClass('pf-m-current');
+});
+
+test("Renders with pf-m-current when TabContext's localActiveKey matches an overflowingTabs' eventKey", () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 1 }}>
+      <OverflowTab overflowingTabs={[{ title: 'Tab one', eventKey: 1 }]} />
+    </TabsContext.Provider>
+  );
+
+  expect(screen.getByRole('presentation')).toHaveClass('pf-m-current');
+});
+
+test('Does not render tabs passed via overflowingTabs when not expanded', () => {
+  render(
+    <OverflowTab
+      overflowingTabs={[
+        { title: 'Tab one', eventKey: 1 },
+        { title: 'Tab two', eventKey: 2 }
+      ]}
+    />
+  );
+
+  expect(screen.queryByText('Tab one')).not.toBeInTheDocument();
+  expect(screen.queryByText('Tab two')).not.toBeInTheDocument();
+});
+
+test('Renders tabs passed via overflowingTabs when expanded', () => {
+  render(
+    <OverflowTab
+      overflowingTabs={[
+        { title: 'Tab one', eventKey: 1 },
+        { title: 'Tab two', eventKey: 2 }
+      ]}
+    />
+  );
+
+  userEvent.click(screen.getByRole('tab', { name: 'More' }));
+
+  expect(screen.getByText('Tab one')).toBeVisible();
+  expect(screen.getByText('Tab two')).toBeVisible();
+});
+
+test('Closes the overflowing tabs menu when a tab is selected', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 0 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> },
+          { title: 'Tab two', eventKey: 2, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab', { name: 'More' }));
+
+  // rather than actually clicking a menu item here we click the Select button provided via our Menu mock to keep the mocks simpler
+  userEvent.click(screen.getByRole('button', { name: 'Select' }));
+
+  expect(screen.queryByText('Tab two')).not.toBeInTheDocument();
+});
+
+test('Closes the overflowing tabs menu when the user clicks outside of the menu', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 0 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> },
+          { title: 'Tab two', eventKey: 2, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab', { name: 'More' }));
+
+  userEvent.click(document.body);
+
+  expect(screen.queryByText('Tab two')).not.toBeInTheDocument();
+});
+
+test('Calls the onTabClick callback provided via context when a tab is clicked', () => {
+  const mockHandleTabClick = jest.fn();
+
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, handleTabClick: mockHandleTabClick }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab', { name: 'More' }));
+
+  // rather than actually clicking a menu item here we click the Select button provided via our Menu mock to keep the mocks simpler
+  userEvent.click(screen.getByRole('button', { name: 'Select' }));
+
+  expect(mockHandleTabClick).toHaveBeenCalledTimes(1);
+  expect(mockHandleTabClick).toHaveBeenCalledWith('mouseEvent', 1, 'fakeRef');
+});
+
+test('Does not show the overflowing tab count by default', () => {
+  render(
+    <OverflowTab
+      overflowingTabs={[
+        { title: 'Tab one', eventKey: 1 },
+        { title: 'Tab two', eventKey: 2 }
+      ]}
+    />
+  );
+
+  expect(screen.queryByRole('tab', { name: 'More (2)' })).not.toBeInTheDocument();
+});
+
+test('Shows the overflowing tab count when showTabCount is true', () => {
+  render(
+    <OverflowTab
+      overflowingTabs={[
+        { title: 'Tab one', eventKey: 1 },
+        { title: 'Tab two', eventKey: 2 }
+      ]}
+      showTabCount
+    />
+  );
+
+  expect(screen.getByRole('tab', { name: 'More (2)' })).toBeVisible();
+});
+
+test('Uses "More" as the default overflow tab title', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).toHaveTextContent('More');
+});
+
+test('Uses the selected tab title as the overflow tab title rather than the default title when a tab is selected', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 1 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  expect(screen.getByRole('tab')).toHaveTextContent('Tab one');
+});
+
+test('Uses custom overflow tab title text provided via defaultTitleText', () => {
+  render(<OverflowTab defaultTitleText="Test" />);
+
+  expect(screen.getByRole('tab')).toHaveTextContent('Test');
+});
+
+test('Uses the selected tab title as the overflow tab title rather than the defaultTitleText when a tab is selected', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 1 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+        defaultTitleText="Test"
+      />
+    </TabsContext.Provider>
+  );
+
+  expect(screen.getByRole('tab')).toHaveTextContent('Tab one');
+});
+
+test('Does not have an aria label on the tab by default', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).not.toHaveAttribute('aria-label');
+});
+
+test('Renders with the toggleAriaLabel as an aria label on the tab', () => {
+  render(<OverflowTab toggleAriaLabel="Test aria label" />);
+
+  expect(screen.getByRole('tab')).toHaveAttribute('aria-label', 'Test aria label');
+});
+
+test('Renders the tab with aria-haspopup=menu', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).toHaveAttribute('aria-haspopup', 'menu');
+});
+
+test('Renders the tab with aria-expanded set to false by default', () => {
+  render(<OverflowTab />);
+
+  expect(screen.getByRole('tab')).toHaveAttribute('aria-expanded', 'false');
+});
+
+test('Renders the tab with aria-expanded set to true when the menu is opened', () => {
+  render(<OverflowTab />);
+
+  const overflowTab = screen.getByRole('tab');
+
+  userEvent.click(overflowTab);
+
+  expect(overflowTab).toHaveAttribute('aria-expanded', 'true');
+});
+
+test('Passes Popper popperMatchesTriggerWidth set to false', () => {
+  render(<OverflowTab />);
+
+  // This assertion relies on the structure of the Popper mock to verify the correct props are being sent to Popper
+  expect(screen.getByText('Popper matches trigger width: false')).toBeVisible();
+});
+
+test('Passes Popper an appendTo value of the presentation element', () => {
+  render(<OverflowTab />);
+
+  userEvent.click(screen.getByRole('tab'));
+
+  // This assertion relies on the structure of the Popper mock to verify the correct props are being sent to Popper
+  expect(screen.getByText('Append to class name: pf-c-tabs__item pf-m-overflow')).toBeVisible();
+});
+
+test('Does not render an overflowing tab as a selected menu item by default', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 0 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab'));
+
+  // This assertion relies on the structure of the Popper mock to verify the correct props are being sent to Popper
+  expect(screen.queryByText('Selected: true')).not.toBeInTheDocument();
+});
+
+test('Renders an overflowing tab as a selected menu item when its key matches the localActiveKey provided via context', () => {
+  render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 1 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab'));
+
+  // This assertion relies on the structure of the Popper mock to verify the correct props are being sent to Popper
+  expect(screen.getByText('Selected: true')).toBeVisible();
+});
+
+test('Matches snapshot when expanded', () => {
+  const { asFragment } = render(
+    <TabsContext.Provider value={{ ...tabsContextDefaultProps, localActiveKey: 1 }}>
+      <OverflowTab
+        overflowingTabs={[
+          { title: 'Tab one', eventKey: 1, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> },
+          { title: 'Tab two', eventKey: 2, tabContentRef: ('fakeRef' as unknown) as React.RefObject<any> }
+        ]}
+      />
+    </TabsContext.Provider>
+  );
+
+  userEvent.click(screen.getByRole('tab'));
+
+  expect(asFragment()).toMatchSnapshot();
+});

package/src/components/Tabs/__tests__/__snapshots__/OverflowTab.test.tsx.snap

@@ -0,0 +1,89 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Matches snapshot when expanded 1`] = `
+<DocumentFragment>
+  <div
+    data-testid="popper-mock"
+  >
+    <div
+      data-testid="trigger"
+    >
+      <li
+        class="pf-c-tabs__item pf-m-overflow pf-m-current"
+        role="presentation"
+      >
+        <button
+          aria-expanded="true"
+          aria-haspopup="menu"
+          class="pf-c-tabs__link pf-m-expanded"
+          role="tab"
+        >
+          <span
+            class="pf-c-tabs__item-text"
+          >
+            Tab one
+          </span>
+          <span
+            class="pf-c-tabs__link-toggle-icon"
+          >
+            <svg
+              aria-hidden="true"
+              fill="currentColor"
+              height="1em"
+              role="img"
+              style="vertical-align: -0.125em;"
+              viewBox="0 0 256 512"
+              width="1em"
+            >
+              <path
+                d="M224.3 273l-136 136c-9.4 9.4-24.6 9.4-33.9 0l-22.6-22.6c-9.4-9.4-9.4-24.6 0-33.9l96.4-96.4-96.4-96.4c-9.4-9.4-9.4-24.6 0-33.9L54.3 103c9.4-9.4 24.6-9.4 33.9 0l136 136c9.5 9.4 9.5 24.6.1 34z"
+              />
+            </svg>
+          </span>
+        </button>
+      </li>
+    </div>
+    <div
+      data-testid="popper"
+    >
+      <div
+        data-testid="menu-mock"
+      >
+        <div
+          data-testid="menu-content-mock"
+        >
+          <ul
+            data-testid="menu-list-mock"
+          >
+            <li
+              id="1-menu-item-mock"
+            >
+              Tab one
+              <p>
+                Selected: true
+              </p>
+            </li>
+            <li
+              id="2-menu-item-mock"
+            >
+              Tab two
+              <p>
+                Selected: false
+              </p>
+            </li>
+          </ul>
+        </div>
+        <button>
+          Select
+        </button>
+      </div>
+    </div>
+    <p>
+      Popper matches trigger width: false
+    </p>
+    <p>
+      Append to class name: pf-c-tabs__item pf-m-overflow pf-m-current
+    </p>
+  </div>
+</DocumentFragment>
+`;

package/src/deprecated/components/index.ts

@@ -0,0 +1 @@
+export * from './';

package/src/deprecated/index.ts

@@ -0,0 +1 @@
+export * from './components';

package/src/next/components/index.ts

@@ -0,0 +1 @@
+export * from './';

package/src/next/index.ts

@@ -0,0 +1 @@
+export * from './components';