@patternfly/react-table 6.0.0-alpha.6 → 6.0.0-alpha.61

package/src/demos/examples/TableEmptyStateError.tsx

@@ -11,8 +11,7 @@ import {
   PageSection
 } from '@patternfly/react-core';
 import ExclamationCircleIcon from '@patternfly/react-icons/dist/esm/icons/exclamation-circle-icon';
-import globalDangerColor200 from '@patternfly/react-tokens/dist/esm/global_danger_color_200';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 
 export const TableEmptyStateError: React.FunctionComponent = () => (
   <DashboardWrapper hasPageTemplateTitle>
@@ -32,10 +31,10 @@ export const TableEmptyStateError: React.FunctionComponent = () => (
             <Tr>
               <Td colSpan={8}>
                 <Bullseye>
-                  <EmptyState variant={EmptyStateVariant.sm}>
+                  <EmptyState variant={EmptyStateVariant.sm} titleText="">
                     <EmptyStateHeader
                       titleText="Unable to connect"
-                      icon={<EmptyStateIcon icon={ExclamationCircleIcon} color={globalDangerColor200.value} />}
+                      icon={<EmptyStateIcon icon={ExclamationCircleIcon} />}
                       headingLevel="h2"
                     />
                     <EmptyStateBody>

package/src/demos/examples/TableEmptyStateLoading.tsx

@@ -9,7 +9,7 @@ import {
   PageSection,
   Spinner
 } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 
 export const TableEmptyStateLoading: React.FunctionComponent = () => (
   <DashboardWrapper hasPageTemplateTitle>

package/src/demos/examples/TableExpandCollapseAll.tsx

@@ -1,7 +1,7 @@
 import React, { ReactNode } from 'react';
 import { Card, Label, PageSection, TextVariants, Text, TextContent } from '@patternfly/react-core';
 import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 
 const expandableColumns = ['Servers', 'Threads', 'Applications', 'Workspaces', 'Status'];
 
@@ -164,7 +164,8 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
                       collapseAllAriaLabel,
                       onToggle: onCollapseAll
                     }}
-                  ></Th>
+                    aria-label="Row expansion"
+                  />
                   {expandableColumns.map((column) => (
                     <Th key={column}>{column}</Th>
                   ))}

package/src/demos/examples/TableSortableResponsive.tsx

@@ -39,7 +39,7 @@ import CodeIcon from '@patternfly/react-icons/dist/esm/icons/code-icon';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 import SortAmountDownIcon from '@patternfly/react-icons/dist/esm/icons/sort-amount-down-icon';
 import CubeIcon from '@patternfly/react-icons/dist/esm/icons/cube-icon';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 import EllipsisVIcon from '@patternfly/react-icons/dist/esm/icons/ellipsis-v-icon';
 import { rows, columns, SampleDataRow } from '@patternfly/react-table/dist/esm/demos/sampleData';
 
@@ -88,7 +88,7 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
   const kebabDropdownItems = [<OverflowMenuDropdownItem key="kebab-1">Some action</OverflowMenuDropdownItem>];
 
   React.useEffect(() => {
-    setSortedRows(sortedData.slice((page - 1) * perPage, page * perPage - 1));
+    setSortedRows(sortedData.slice((page - 1) * perPage, page * perPage));
   }, [sortedData, page, perPage]);
 
   const handleSetPage = (_evt: React.MouseEvent | React.KeyboardEvent | MouseEvent, newPage: number) => {
@@ -154,9 +154,8 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
                 onClick={() => setIsSortDropdownOpen(!isSortDropdownOpen)}
                 isExpanded={isSortDropdownOpen}
                 variant="plain"
-              >
-                <SortAmountDownIcon />
-              </MenuToggle>
+                icon={<SortAmountDownIcon />}
+              />
             )}
           >
             <SelectGroup label="Sort column">
@@ -203,9 +202,8 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
                     variant="plain"
                     onClick={() => setIsKebabDropdownOpen(!isKebabDropdownOpen)}
                     isExpanded={false}
-                  >
-                    <EllipsisVIcon />
-                  </MenuToggle>
+                    icon={<EllipsisVIcon />}
+                  />
                 )}
                 isOpen={isKebabDropdownOpen}
               >

package/src/demos/examples/TableStaticBottomPagination.tsx

@@ -18,7 +18,7 @@ import {
 } from '@patternfly/react-core';
 import { Table, TableText, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-table';
 import FilterIcon from '@patternfly/react-icons/dist/esm/icons/filter-icon';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 import { rows, columns } from '@patternfly/react-table/dist/esm/demos/sampleData';
 
 export const TableStaticBottomPagination: React.FunctionComponent = () => {
@@ -101,8 +101,13 @@ export const TableStaticBottomPagination: React.FunctionComponent = () => {
             id="select-example"
             aria-label="Select Input"
             toggle={(toggleRef: React.Ref<MenuToggleElement>) => (
-              <MenuToggle ref={toggleRef} onClick={() => setIsSelectOpen(!isSelectOpen)} isExpanded={isSelectOpen}>
-                <FilterIcon /> Status
+              <MenuToggle
+                icon={<FilterIcon />}
+                ref={toggleRef}
+                onClick={() => setIsSelectOpen(!isSelectOpen)}
+                isExpanded={isSelectOpen}
+              >
+                Status
               </MenuToggle>
             )}
             isOpen={isSelectOpen}

package/src/demos/examples/TableStickyFirstColumn.tsx

@@ -1,7 +1,7 @@
 import React from 'react';
 import { Table, Thead, Tr, Th, Tbody, Td, InnerScrollContainer } from '@patternfly/react-table';
 import { Card, PageSection } from '@patternfly/react-core';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 
 type Direction = 'asc' | 'desc' | undefined;
 

package/src/demos/examples/TableStickyHeader.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 
 import { Card, Label, PageSection } from '@patternfly/react-core';
 import { Table, Thead, Tr, Th, Tbody, Td, TableText } from '@patternfly/react-table';
-import { DashboardWrapper } from '@patternfly/react-core/dist/esm/demos/DashboardWrapper';
+import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
 import { rows, columns } from '@patternfly/react-table/dist/esm/demos/sampleData';
 
 export const TableStickyHeader: React.FunctionComponent = () => {

package/src/demos/index.ts

@@ -1 +1,3 @@
 export * from './sampleData';
+export * from './DashboardWrapper';
+export * from './DashboardHeader';

package/src/deprecated/components/Table/Table.tsx

@@ -1,6 +1,5 @@
 import * as React from 'react';
 import { OUIAProps, getDefaultOUIAId } from '@patternfly/react-core';
-import { DropdownDirection, DropdownPosition } from '@patternfly/react-core/dist/esm/deprecated/components';
 import inlineStyles from '@patternfly/react-styles/css/components/InlineEdit/inline-edit';
 import { css } from '@patternfly/react-styles';
 import { Provider } from '../../../components/Table/base/provider';
@@ -143,8 +142,8 @@ class Table extends React.Component<TableProps, {}> {
     rowLabeledBy: 'simple-node',
     expandId: 'expandable-toggle',
     contentId: 'expanded-content',
-    dropdownPosition: DropdownPosition.right,
-    dropdownDirection: DropdownDirection.down,
+    dropdownPosition: 'right',
+    dropdownDirection: 'down',
     actionsMenuAppendTo: 'inline',
     header: undefined as React.ReactNode,
     caption: undefined as React.ReactNode,