@patternfly/react-core 5.3.0-prerelease.8 → 5.3.0

package/src/demos/Filters/examples/FilterFaceted.tsx

@@ -467,7 +467,7 @@ export const FilterFaceted: React.FunctionComponent = () => {
       <Table aria-label="Selectable table">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row select" />
             <Th width={20}>{columnNames.name}</Th>
             <Th width={10}>{columnNames.threads}</Th>
             <Th width={10}>{columnNames.apps}</Th>

package/src/demos/Filters/examples/FilterMixedSelectGroup.tsx

@@ -517,7 +517,7 @@ export const FilterMixedSelectGroup: React.FunctionComponent = () => {
       <Table aria-label="Selectable table">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row select" />
             <Th width={20}>{columnNames.name}</Th>
             <Th width={10}>{columnNames.threads}</Th>
             <Th width={10}>{columnNames.apps}</Th>

package/src/demos/Filters/examples/FilterSameSelectGroup.tsx

@@ -490,7 +490,7 @@ export const FilterSameSelectGroup: React.FunctionComponent = () => {
       <Table aria-label="Selectable table">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row select" />
             <Th width={20}>{columnNames.name}</Th>
             <Th width={10}>{columnNames.threads}</Th>
             <Th width={10}>{columnNames.apps}</Th>

package/src/demos/Filters/examples/FilterSearchInput.tsx

@@ -298,7 +298,7 @@ export const FilterSearchInput: React.FunctionComponent = () => {
       <Table aria-label="Selectable table">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row select" />
             <Th width={20}>{columnNames.name}</Th>
             <Th width={10}>{columnNames.threads}</Th>
             <Th width={10}>{columnNames.apps}</Th>

package/src/demos/Filters/examples/FilterSingleSelect.tsx

@@ -362,7 +362,7 @@ export const FilterSingleSelect: React.FunctionComponent = () => {
       <Table aria-label="Selectable table">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row select" />
             <Th width={20}>{columnNames.name}</Th>
             <Th width={10}>{columnNames.threads}</Th>
             <Th width={10}>{columnNames.apps}</Th>

package/src/demos/JumpLinks.md

@@ -4,6 +4,7 @@ section: components
 ---
 
 import mastheadStyles from '@patternfly/react-styles/css/components/Masthead/masthead';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 ## Demos
 
@@ -34,7 +35,7 @@ import {
   TextContent,
   getResizeObserver
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import mastheadStyles from '@patternfly/react-styles/css/components/Masthead/masthead';
 
 ScrollspyH2 = () => {

package/src/demos/Nav.md

@@ -11,6 +11,8 @@ import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
 import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
 import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg';
 import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 ## Demos
 

package/src/demos/PrimaryDetail.md

@@ -24,6 +24,7 @@ import azureIcon from './assets/FuseConnector_Icons_AzureServices.png';
 import restIcon from './assets/FuseConnector_Icons_REST.png';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
 import { data } from '@patternfly/react-core/src/demos/CardView/examples/CardViewData.jsx';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 ## Demos
 

package/src/demos/RTL/RTL.md

@@ -26,6 +26,6 @@ This demonstrates how the UI adapts to the writing mode of the page.
 
 ### Paginated table
 
-```js file="./examples/PaginatedTable.jsx" isFullscreen
+```js file="./examples/PaginatedTable.tsx" isFullscreen
 
 ```

package/src/demos/RTL/examples/{PaginatedTable.jsx → PaginatedTable.tsx}

@@ -58,10 +58,22 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico
 import HandPaperIcon from '@patternfly/react-icons/dist/esm/icons/hand-paper-icon';
 import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg';
 
-export const PaginatedTableAction = () => {
-  const [translation, setTranslation] = React.useState(translationsEn);
-  const [page, setPage] = React.useState(1);
-  const [perPage, setPerPage] = React.useState(10);
+interface Row {
+  name: string;
+  status: string;
+  location: string;
+  lastModified: string;
+  url: string;
+}
+
+interface Translation {
+  [key: string]: any;
+}
+
+export const PaginatedTableAction: React.FunctionComponent = () => {
+  const [translation, setTranslation] = React.useState<Translation>(translationsEn);
+  const [page, setPage] = React.useState<number>(1);
+  const [perPage, setPerPage] = React.useState<number>(10);
 
   const columns = [
     translation.table.columns.servers,
@@ -71,13 +83,13 @@ export const PaginatedTableAction = () => {
     translation.table.columns.url
   ];
 
-  const numRows = 25;
-  const getRandomInteger = (min, max) => Math.floor(Math.random() * (max - min + 1)) + min;
+  const numRows: number = 25;
+  const getRandomInteger = (min: number, max: number) => Math.floor(Math.random() * (max - min + 1)) + min;
   const createRows = () => {
-    const rows = [];
+    const rows: Row[] = [];
     for (let i = 0; i < numRows; i++) {
       const num = i + 1;
-      const rowObj = {
+      const rowObj: Row = {
         name: translation.table.rows.node + num,
         status: [
           translation.table.rows.status.stopped,
@@ -110,14 +122,14 @@ export const PaginatedTableAction = () => {
 
   const rows = createRows();
   const [managedRows, setManagedRows] = React.useState(rows);
-  const [paginatedRows, setPaginatedRows] = React.useState(rows.slice(0, 10));
-  const [isDirRTL, setIsDirRTL] = React.useState(false);
+  const [paginatedRows, setPaginatedRows] = React.useState<Row[]>(rows.slice(0, 10));
+  const [isDirRTL, setIsDirRTL] = React.useState<boolean>(false);
 
-  const capitalize = (input) => input[0].toUpperCase() + input.substring(1);
+  const capitalize = (input: string) => input[0].toUpperCase() + input.substring(1);
 
   const switchTranslation = () => {
     setIsDirRTL((prevIsDirRTL) => !prevIsDirRTL);
-    setTranslation((prevTranslation) => (prevTranslation === translationsEn ? translationsHe : translationsEn));
+    setTranslation((prevTranslation: string) => (prevTranslation === translationsEn ? translationsHe : translationsEn));
   };
 
   React.useEffect(() => {
@@ -133,17 +145,29 @@ export const PaginatedTableAction = () => {
 
   // Pagination logic
 
-  const handleSetPage = (_evt, newPage, _perPage, startIdx, endIdx) => {
+  const handleSetPage = (
+    _evt: React.MouseEvent | React.KeyboardEvent | MouseEvent,
+    newPage: number,
+    _perPage: number | undefined,
+    startIdx: number | undefined,
+    endIdx: number | undefined
+  ) => {
     setPaginatedRows(managedRows.slice(startIdx, endIdx));
     setPage(newPage);
   };
 
-  const handlePerPageSelect = (_evt, newPerPage, _newPage, startIdx, endIdx) => {
+  const handlePerPageSelect = (
+    _evt: React.MouseEvent | React.KeyboardEvent | MouseEvent,
+    newPerPage: number,
+    _newPage: number,
+    startIdx: number | undefined,
+    endIdx: number | undefined
+  ) => {
     setPaginatedRows(managedRows.slice(startIdx, endIdx));
     setPerPage(newPerPage);
   };
 
-  const renderPagination = (variant) => {
+  const renderPagination = (variant: PaginationVariant) => {
     const { pagination } = translation;
 
     return (
@@ -181,7 +205,7 @@ export const PaginatedTableAction = () => {
     }
   };
 
-  const renderLabel = (labelText) => {
+  const renderLabel = (labelText: string) => {
     switch (labelText) {
       case 'Running':
       case 'רץ':
@@ -280,9 +304,9 @@ export const PaginatedTableAction = () => {
     </PageSidebar>
   );
 
-  const [isDropdownOpen, setIsDropdownOpen] = React.useState(false);
-  const [isKebabDropdownOpen, setIsKebabDropdownOpen] = React.useState(false);
-  const [isFullKebabDropdownOpen, setIsFullKebabDropdownOpen] = React.useState(false);
+  const [isDropdownOpen, setIsDropdownOpen] = React.useState<boolean>(false);
+  const [isKebabDropdownOpen, setIsKebabDropdownOpen] = React.useState<boolean>(false);
+  const [isFullKebabDropdownOpen, setIsFullKebabDropdownOpen] = React.useState<boolean>(false);
 
   const kebabDropdownItems = (
     <>
@@ -434,15 +458,17 @@ export const PaginatedTableAction = () => {
     </Masthead>
   );
 
+  const breadcrumbItemsLength = Object.keys(breadcrumbItems).length;
+
   return (
     <React.Fragment>
       <Page sidebar={sidebar} header={masthead} isManagedSidebar>
         <PageBreadcrumb>
           <Breadcrumb aria-label={translation.breadcrumbs.ariaLabel || undefined}>
-            {Object.keys(breadcrumbItems).map((key, idx, arr) => (
+            {Object.keys(breadcrumbItems).map((key: string, idx: number, arr: string[]) => (
               <BreadcrumbItem key={idx} isActive={arr.length - 1 === idx} to={`${breadcrumbItems[key].url}`}>
                 {translation.breadcrumbs[key]}
-                {breadcrumbItems.length}
+                {breadcrumbItemsLength}
               </BreadcrumbItem>
             ))}
           </Breadcrumb>
@@ -465,7 +491,7 @@ export const PaginatedTableAction = () => {
                 </Tr>
               </Thead>
               <Tbody>
-                {paginatedRows.map((row, rowIndex) => (
+                {paginatedRows.map((row: Row, rowIndex: number) => (
                   <Tr key={rowIndex}>
                     <>
                       {Object.entries(row).map(([key, value]) => {

package/src/demos/Tabs.md

@@ -11,7 +11,10 @@ import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
 import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon';
 import SortAmountDownIcon from '@patternfly/react-icons/dist/esm/icons/sort-amount-down-icon';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
+import display from '@patternfly/react-styles/css/utilities/Display/display';
+import sizing from '@patternfly/react-styles/css/utilities/Sizing/sizing';
 import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 ## Demos
 
@@ -43,7 +46,7 @@ import {
 import CheckCircleIcon from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 
 TabsOpenDemo = () => {
@@ -235,7 +238,7 @@ import {
 import CheckCircleIcon from '@patternfly/react-icons/dist/js/icons/check-circle-icon';
 import InfoCircleIcon from '@patternfly/react-icons/dist/js/icons/info-circle-icon';
 import spacing from '@patternfly/react-styles/css/utilities/Spacing/spacing';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 TabsOpenWithSecondaryTabsDemo = () => {
   const [activeTabKey, setActiveTabKey] = React.useState(0);

package/src/demos/Toolbar.md

@@ -11,6 +11,7 @@ import DownloadIcon from '@patternfly/react-icons/dist/esm/icons/download-icon';
 import CogIcon from '@patternfly/react-icons/dist/esm/icons/cog-icon';
 import SearchIcon from '@patternfly/react-icons/dist/esm/icons/search-icon';
 import TimesIcon from '@patternfly/react-icons/dist/esm/icons/times-icon';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 ## Demos
 

package/src/demos/Wizard/WizardDemo.md

@@ -6,6 +6,7 @@ source: react-demos
 
 import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg';
 import BarsIcon from '@patternfly/react-icons/dist/js/icons/bars-icon';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 ## Demos
 

package/src/demos/examples/AlertGroup/AlertGroupToastWithNotificationDrawer.tsx

@@ -33,8 +33,8 @@ import {
 } from '@patternfly/react-core';
 import SearchIcon from '@patternfly/react-icons/dist/js/icons/search-icon';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 interface NotificationProps {
   title: string;

package/src/demos/examples/BackToTop/BackToTopNameDemo.tsx

@@ -12,7 +12,7 @@ import {
   Page,
   Switch
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const Name = () => {
   const [isAlwaysVisible, setIsAlwaysVisible] = React.useState(false);

package/src/demos/examples/Card/CardStatus.tsx

@@ -94,7 +94,7 @@ export const CardStatus: React.FunctionComponent = () => {
       <Table variant="compact">
         <Thead>
           <Tr>
-            <Th />
+            <Th screenReaderText="Row expansion" />
             {columns.map((column, columnIndex) => (
               <Th key={columnIndex} modifier="fitContent">
                 {column}

package/src/demos/examples/JumpLinks/JumpLinksWithDrawer.js

@@ -20,7 +20,7 @@ import {
   getResizeObserver,
   DrawerContext
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import mastheadStyles from '@patternfly/react-styles/css/components/Masthead/masthead';
 
 const JumpLinksWrapper = ({ offsetHeight, headings }) => {

package/src/demos/examples/Nav/NavDefault.tsx

@@ -16,8 +16,8 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavDefault: React.FunctionComponent = () => {
   const [activeItem, setActiveItem] = React.useState<number | string>(0);

package/src/demos/examples/Nav/NavDrilldown.tsx

@@ -12,7 +12,7 @@ import {
   Menu,
   PageSection
 } from '@patternfly/react-core';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 interface MenuHeights {
   [menuId: string]: number;

package/src/demos/examples/Nav/NavExpandable.tsx

@@ -17,8 +17,8 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavExpandableDemo: React.FunctionComponent = () => {
   const [activeGroup, setActiveGroup] = React.useState<string | number>('grp-1');

package/src/demos/examples/Nav/NavGrouped.tsx

@@ -12,7 +12,7 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavGrouped: React.FunctionComponent = () => {
   const [activeItem, setActiveItem] = React.useState<number | string>('grp-1_itm-1');

package/src/demos/examples/Nav/NavHorizontal.tsx

@@ -39,7 +39,7 @@ import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-ico
 import BellIcon from '@patternfly/react-icons/dist/esm/icons/bell-icon';
 import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg';
 import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const NavHorizontal: React.FunctionComponent = () => {
   const [isDropdownOpen, setIsDropdownOpen] = React.useState(false);

package/src/demos/examples/Nav/NavHorizontalWithSubnav.tsx

@@ -43,7 +43,7 @@ import BarsIcon from '@patternfly/react-icons/dist/esm/icons/bars-icon';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
 import imgAvatar from '@patternfly/react-core/src/components/assets/avatarImg.svg';
 import pfLogo from '@patternfly/react-core/src/demos/assets/pf-logo.svg';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const NavHorizontalWithSubnav: React.FunctionComponent = () => {
   const [isDropdownOpen, setIsDropdownOpen] = React.useState(false);

package/src/demos/examples/Nav/NavWithSubnav.tsx

@@ -17,8 +17,8 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavWithSubnav: React.FunctionComponent = () => {
   const [activeItem, setActiveItem] = React.useState<string | number>(0);

package/src/demos/examples/Nav/deprecated/NavLight.tsx

@@ -16,7 +16,7 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavLight: React.FunctionComponent = () => {
   const [activeItem, setActiveItem] = React.useState<string | number>(0);

package/src/demos/examples/Nav/deprecated/NavTertiary.tsx

@@ -14,8 +14,8 @@ import {
   TextContent,
   Text
 } from '@patternfly/react-core';
-import { DashboardBreadcrumb } from '@patternfly/react-core/src/demos/DashboardWrapper';
-import { DashboardHeader } from '@patternfly/react-core/src/demos/DashboardHeader';
+import { DashboardBreadcrumb } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
+import { DashboardHeader } from '@patternfly/react-core/dist/js/demos/DashboardHeader';
 
 export const NavTertiary: React.FunctionComponent = () => {
   const [activeItem, setActiveItem] = React.useState<string | number>(0);

package/src/demos/examples/PrimaryDetail/PrimaryDetailCardView.tsx

@@ -51,7 +51,7 @@ import swaggerIcon from './assets/camel-swagger-java_200x150.png';
 import azureIcon from './assets/FuseConnector_Icons_AzureServices.png';
 import restIcon from './assets/FuseConnector_Icons_REST.png';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import { data } from '@patternfly/react-core/src/demos/CardView/examples/CardViewData.jsx';
 
 export const PrimaryDetailCardView: React.FunctionComponent = () => {

package/src/demos/examples/PrimaryDetail/PrimaryDetailContentPadding.tsx

@@ -40,7 +40,7 @@ import {
   SelectOptionProps,
   MenuToggle
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';

package/src/demos/examples/PrimaryDetail/PrimaryDetailDataListInCard.tsx

@@ -31,7 +31,7 @@ import {
   TextContent,
   Title
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const PrimaryDetailDataListInCard: React.FunctionComponent = () => {
   const [drawerPanelBodyContent, setDrawerPanelBodyContent] = React.useState(1);

package/src/demos/examples/PrimaryDetail/PrimaryDetailFullPage.tsx

@@ -40,7 +40,7 @@ import {
   SelectOptionProps,
   MenuToggle
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';

package/src/demos/examples/PrimaryDetail/PrimaryDetailInlineModifier.tsx

@@ -40,7 +40,7 @@ import {
   SelectOptionProps,
   MenuToggle
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';

package/src/demos/examples/PrimaryDetail/PrimaryDetailSimpleListInCard.tsx

@@ -22,7 +22,7 @@ import {
   TextContent,
   Title
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const PrimaryDetailSimpleListInCard: React.FunctionComponent = () => {
   const [drawerPanelBodyContent, setDrawerPanelBodyContent] = React.useState(1);

package/src/demos/examples/Tabs/ModalTabs.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import {
   PageSection,
   TextContent,

package/src/demos/examples/Tabs/NestedTabs.tsx

@@ -16,7 +16,7 @@ import {
   Flex,
   FlexItem
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import sizing from '@patternfly/react-styles/css/utilities/Sizing/sizing';
 
 export const NestedTabs: React.FunctionComponent = () => {

package/src/demos/examples/Tabs/NestedUnindentedTabs.tsx

@@ -17,7 +17,7 @@ import {
   TitleSizes,
   CardTitle
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const NestedUnindentedTabs: React.FunctionComponent = () => {
   const [activeTabKey, setActiveTabKey] = React.useState(1);

package/src/demos/examples/Tabs/TabsAndTable.tsx

@@ -57,7 +57,7 @@ import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon';
 import SortAmountDownIcon from '@patternfly/react-icons/dist/esm/icons/sort-amount-down-icon';
 import { KeyTypes } from '../../../helpers';
 import display from '@patternfly/react-styles/css/utilities/Display/display';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 interface Repository {
   name: string;
@@ -230,7 +230,7 @@ export const TablesAndTabs = () => {
     <Table aria-label="`Composable` table">
       <Thead noWrap>
         <Tr>
-          <Th />
+          <Th screenReaderText="Row select" />
           <Th>{columnNames.name}</Th>
           <Th>{columnNames.branches}</Th>
           <Th>{columnNames.prs}</Th>

package/src/demos/examples/Toolbar/ConsoleLogViewerToolbar.tsx

@@ -20,7 +20,7 @@ import {
   DropdownList,
   MenuFooter
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 import PauseIcon from '@patternfly/react-icons/dist/esm/icons/pause-icon';
 import PlayIcon from '@patternfly/react-icons/dist/esm/icons/play-icon';
 import ExpandIcon from '@patternfly/react-icons/dist/esm/icons/expand-icon';

package/src/demos/examples/Wizard/InModal.tsx

@@ -11,7 +11,7 @@ import {
   WizardHeader,
   WizardStep
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const WizardInModalDemo: React.FunctionComponent = () => (
   <>

package/src/demos/examples/Wizard/InPage.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { PageSection, PageSectionTypes, PageSectionVariants, Wizard, WizardStep } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/src/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-core/dist/js/demos/DashboardWrapper';
 
 export const WizardFullPage: React.FunctionComponent = () => (
   <React.Fragment>

package/src/deprecated/components/Select/__tests__/Select.test.tsx

@@ -9,6 +9,8 @@ import { SelectGroup } from '../SelectGroup';
 import { SelectVariant, SelectDirection } from '../selectConstants';
 import { KeyTypes } from '../../../../helpers';
 
+jest.mock('../../../../helpers/GenerateId/GenerateId');
+
 class User implements SelectOptionObject {
   private firstName: string;
   private lastName: string;