@patternfly/react-table 6.2.0-prerelease.8 → 6.2.0

package/src/demos/examples/TableExpandCollapseAll.tsx

@@ -1,4 +1,4 @@
-import React, { ReactNode } from 'react';
+import { Fragment, ReactNode, useEffect, useState } from 'react';
 import { Card, Content, Label, PageSection } from '@patternfly/react-core';
 import { Table, Thead, Tbody, Tr, Th, Td, ExpandableRowContent } from '@patternfly/react-table';
 import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/DashboardWrapper';
@@ -120,11 +120,11 @@ const serverData: Server[] = [
 const initialExpandedServerNames = ['US-Node 2']; // Default to expanded
 
 export const TableExpandCollapseAll: React.FunctionComponent = () => {
-  const [areAllExpanded, setAreAllExpanded] = React.useState(false);
-  const [collapseAllAriaLabel, setCollapseAllAriaLabel] = React.useState('Expand all');
-  const [expandedServerNames, setExpandedServerNames] = React.useState(initialExpandedServerNames);
+  const [areAllExpanded, setAreAllExpanded] = useState(false);
+  const [collapseAllAriaLabel, setCollapseAllAriaLabel] = useState('Expand all');
+  const [expandedServerNames, setExpandedServerNames] = useState(initialExpandedServerNames);
 
-  React.useEffect(() => {
+  useEffect(() => {
     const allExpanded = expandedServerNames.length === serverData.length;
     setAreAllExpanded(allExpanded);
     setCollapseAllAriaLabel(allExpanded ? 'Collapse all' : 'Expand all');
@@ -146,7 +146,7 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
   };
 
   return (
-    <React.Fragment>
+    <Fragment>
       <DashboardWrapper hasPageTemplateTitle>
         <PageSection
           padding={{
@@ -206,6 +206,6 @@ export const TableExpandCollapseAll: React.FunctionComponent = () => {
           </Card>
         </PageSection>
       </DashboardWrapper>
-    </React.Fragment>
+    </Fragment>
   );
 };

package/src/demos/examples/TableFilterable.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import { Fragment, useState } from 'react';
 import {
   Badge,
   Button,
@@ -27,11 +27,11 @@ import { Table, TableText, Thead, Tr, Th, Tbody, Td } from '@patternfly/react-ta
 import { rows, columns } from '@patternfly/react-table/dist/esm/demos/sampleData';
 
 export const TableFilterable: React.FunctionComponent = () => {
-  const [filters, setFilters] = React.useState<Record<string, string[]>>({ location: [], name: [], status: [] });
-  const [currentCategory, setCurrentCategory] = React.useState('Status');
-  const [isFilterDropdownOpen, setIsFilterDropdownOpen] = React.useState(false);
-  const [isCategoryDropdownOpen, setIsCategoryDropdownOpen] = React.useState(false);
-  const [inputValue, setInputValue] = React.useState('');
+  const [filters, setFilters] = useState<Record<string, string[]>>({ location: [], name: [], status: [] });
+  const [currentCategory, setCurrentCategory] = useState('Status');
+  const [isFilterDropdownOpen, setIsFilterDropdownOpen] = useState(false);
+  const [isCategoryDropdownOpen, setIsCategoryDropdownOpen] = useState(false);
+  const [inputValue, setInputValue] = useState('');
 
   const rowData = rows.slice(0, 10);
 
@@ -184,7 +184,7 @@ export const TableFilterable: React.FunctionComponent = () => {
     ];
 
     return (
-      <React.Fragment>
+      <Fragment>
         <ToolbarFilter
           labels={filters.location}
           deleteLabel={(category, label) => onDelete(category, label as string)}
@@ -265,7 +265,7 @@ export const TableFilterable: React.FunctionComponent = () => {
             {statusMenuItems}
           </Select>
         </ToolbarFilter>
-      </React.Fragment>
+      </Fragment>
     );
   };
 
@@ -337,7 +337,7 @@ export const TableFilterable: React.FunctionComponent = () => {
   };
 
   return (
-    <React.Fragment>
+    <Fragment>
       {renderToolbar()}
       <Table aria-label="Filterable Table Demo">
         <Thead>
@@ -382,6 +382,6 @@ export const TableFilterable: React.FunctionComponent = () => {
           )}
         </Tbody>
       </Table>
-    </React.Fragment>
+    </Fragment>
   );
 };

package/src/demos/examples/TableSortableResponsive.tsx

@@ -1,5 +1,4 @@
-import React from 'react';
-
+import { Fragment, useEffect, useState } from 'react';
 import {
   Button,
   Card,
@@ -45,7 +44,7 @@ import { rows, columns, SampleDataRow } from '@patternfly/react-table/dist/esm/d
 type Direction = 'asc' | 'desc' | undefined;
 
 export const TableSortableResponsive: React.FunctionComponent = () => {
-  const [isKebabDropdownOpen, setIsKebabDropdownOpen] = React.useState(false);
+  const [isKebabDropdownOpen, setIsKebabDropdownOpen] = useState(false);
 
   const sortRows = (rows: SampleDataRow[], sortIndex: number, sortDirection: Direction) =>
     [...rows].sort((a, b) => {
@@ -65,17 +64,17 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
       return returnValue;
     });
 
-  const [sortedData, setSortedData] = React.useState([...sortRows(rows, 0, 'asc')]);
-  const [sortedRows, setSortedRows] = React.useState([...sortedData]);
-  const [page, setPage] = React.useState(1);
-  const [perPage, setPerPage] = React.useState(10);
+  const [sortedData, setSortedData] = useState([...sortRows(rows, 0, 'asc')]);
+  const [sortedRows, setSortedRows] = useState([...sortedData]);
+  const [page, setPage] = useState(1);
+  const [perPage, setPerPage] = useState(10);
 
   // index of the currently active column
-  const [activeSortIndex, setActiveSortIndex] = React.useState(0);
+  const [activeSortIndex, setActiveSortIndex] = useState(0);
   // sort direction of the currently active column
-  const [activeSortDirection, setActiveSortDirection] = React.useState<Direction>('asc');
+  const [activeSortDirection, setActiveSortDirection] = useState<Direction>('asc');
   // sort dropdown expansion
-  const [isSortDropdownOpen, setIsSortDropdownOpen] = React.useState(false);
+  const [isSortDropdownOpen, setIsSortDropdownOpen] = useState(false);
 
   const onSort = (_event: any, index: number, direction: Direction) => {
     setActiveSortIndex(index);
@@ -86,7 +85,7 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
 
   const kebabDropdownItems = [<OverflowMenuDropdownItem key="kebab-1">Some action</OverflowMenuDropdownItem>];
 
-  React.useEffect(() => {
+  useEffect(() => {
     setSortedRows(sortedData.slice((page - 1) * perPage, page * perPage));
   }, [sortedData, page, perPage]);
 
@@ -228,7 +227,7 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
   );
 
   return (
-    <React.Fragment>
+    <Fragment>
       <DashboardWrapper>
         <PageSection isWidthLimited variant={PageSectionVariants.light}>
           <Content>
@@ -327,6 +326,6 @@ export const TableSortableResponsive: React.FunctionComponent = () => {
           </Card>
         </PageSection>
       </DashboardWrapper>
-    </React.Fragment>
+    </Fragment>
   );
 };

package/src/demos/examples/TableStaticBottomPagination.tsx

@@ -1,5 +1,4 @@
-import React from 'react';
-
+import { Fragment, useState } from 'react';
 import {
   Button,
   Card,
@@ -22,10 +21,10 @@ import { DashboardWrapper } from '@patternfly/react-table/dist/esm/demos/Dashboa
 import { rows, columns } from '@patternfly/react-table/dist/esm/demos/sampleData';
 
 export const TableStaticBottomPagination: React.FunctionComponent = () => {
-  const [isSelectOpen, setIsSelectOpen] = React.useState(false);
-  const [page, setPage] = React.useState(1);
-  const [perPage, setPerPage] = React.useState(10);
-  const [paginatedRows, setPaginatedRows] = React.useState(rows.slice(0, 10));
+  const [isSelectOpen, setIsSelectOpen] = useState(false);
+  const [page, setPage] = useState(1);
+  const [perPage, setPerPage] = useState(10);
+  const [paginatedRows, setPaginatedRows] = useState(rows.slice(0, 10));
   const handleSetPage = (
     _evt: React.MouseEvent | React.KeyboardEvent | MouseEvent,
     newPage: number,
@@ -141,7 +140,7 @@ export const TableStaticBottomPagination: React.FunctionComponent = () => {
   );
 
   return (
-    <React.Fragment>
+    <Fragment>
       <DashboardWrapper hasPageTemplateTitle>
         <PageSection isFilled>
           <Card>
@@ -177,6 +176,6 @@ export const TableStaticBottomPagination: React.FunctionComponent = () => {
           </Card>
         </PageSection>
       </DashboardWrapper>
-    </React.Fragment>
+    </Fragment>
   );
 };

package/src/demos/examples/TableStickyFirstColumn.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import { useState } 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-table/dist/esm/demos/DashboardWrapper';
@@ -67,8 +67,8 @@ export const TableStickyFirstColumn = () => {
     header16: 'Header 16'
   };
 
-  const [activeSortIndex, setActiveSortIndex] = React.useState(-1);
-  const [activeSortDirection, setActiveSortDirection] = React.useState<Direction>('asc');
+  const [activeSortIndex, setActiveSortIndex] = useState(-1);
+  const [activeSortDirection, setActiveSortDirection] = useState<Direction>('asc');
   const getSortableRowValues = (fact: Fact) => {
     const {
       name,

package/src/demos/examples/TableStickyHeader.tsx

@@ -1,5 +1,3 @@
-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-table/dist/esm/demos/DashboardWrapper';

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { Component, Fragment } from 'react';
 import { Body as BaseBody } from './base';
 import { RowType, RowKeyType } from '../../../components/Table/base/types';
 import { IRow, IRowCell, IExtraRowData, isRowExpanded } from '../../../components';
@@ -49,7 +49,7 @@ interface IMappedCell {
   [name: string]: IRowCell;
 }
 
-class ContextBody extends React.Component<TableBodyProps, {}> {
+class ContextBody extends Component<TableBodyProps, {}> {
   onRow = (row: IRow, rowProps: any) => {
     const { onRowClick, onRow } = this.props;
     const extendedRowProps = {
@@ -163,7 +163,7 @@ class ContextBody extends React.Component<TableBodyProps, {}> {
     }
 
     return (
-      <React.Fragment>
+      <Fragment>
         {mappedRows && (
           <BaseBody
             {...props}
@@ -174,7 +174,7 @@ class ContextBody extends React.Component<TableBodyProps, {}> {
             className={className}
           />
         )}
-      </React.Fragment>
+      </Fragment>
     );
   }
 }

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { useState } from 'react';
 import { Tooltip } from '@patternfly/react-core/dist/esm/components/Tooltip';
 import { Bullseye } from '@patternfly/react-core/dist/esm/layouts/Bullseye';
 import { EmptyState } from '@patternfly/react-core/dist/esm/components/EmptyState';
@@ -18,7 +18,7 @@ export interface BodyCellProps {
   ariaControls?: string;
   editableValue?: any;
   editableSelectProps?: SelectProps;
-  options?: React.ReactElement[];
+  options?: React.ReactElement<any>[];
   isSelectOpen?: boolean;
   value?: any;
   isValid?: boolean;
@@ -52,7 +52,7 @@ export const BodyCell: React.FunctionComponent<BodyCellProps> = ({
   /* eslint-enable @typescript-eslint/no-unused-vars */
   ...props
 }: BodyCellProps) => {
-  const [tooltip, setTooltip] = React.useState('');
+  const [tooltip, setTooltip] = useState('');
   const onMouseEnter = (event: any) => {
     if (event.target.offsetWidth < event.target.scrollWidth) {
       if (tooltipProp) {
@@ -69,10 +69,10 @@ export const BodyCell: React.FunctionComponent<BodyCellProps> = ({
   let isEmptyStateCell = false;
   if (children) {
     isEmptyStateCell =
-      ((children as React.ReactElement).type === Bullseye &&
-        (children as React.ReactElement).props.children &&
-        (children as React.ReactElement).props.children.type === EmptyState) ||
-      (children as React.ReactElement).type === EmptyState;
+      ((children as React.ReactElement<any>).type === Bullseye &&
+        (children as React.ReactElement<any>).props.children &&
+        (children as React.ReactElement<any>).props.children.type === EmptyState) ||
+      (children as React.ReactElement<any>).type === EmptyState;
   }
 
   const cell = (

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { Fragment } from 'react';
 import { IRow, IRowData, IExtraData, IHeaderRow } from '../../../components';
 import { mapOpenedRows } from '../../../components';
 import { Tbody } from '../../../components';
@@ -30,13 +30,13 @@ export const BodyWrapper: React.FunctionComponent<BodyWrapperProps> = ({
 }: BodyWrapperProps) => {
   if (mappedRows && mappedRows.some((row) => row.hasOwnProperty('parent'))) {
     return (
-      <React.Fragment>
+      <Fragment>
         {mapOpenedRows(mappedRows, props.children).map((oneRow, key) => (
           <Tbody {...props} isExpanded={oneRow.isOpen} key={`tbody-${key}`} ref={tbodyRef as React.Ref<any>}>
             {oneRow.rows}
           </Tbody>
         ))}
-      </React.Fragment>
+      </Fragment>
     );
   }
   return <Tbody {...props} ref={tbodyRef as React.Ref<any>} />;

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Header } from './base';
 import { IHeaderRow } from '../../../components';
 import { TableContext } from './TableContext';

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

@@ -1,4 +1,3 @@
-import * as React from 'react';
 import { Th } from '../../../components';
 
 export interface HeaderCellProps {

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

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { Component } from 'react';
 import { OUIAProps, getDefaultOUIAId } from '@patternfly/react-core/dist/esm/helpers/OUIA/ouia';
 import inlineStyles from '@patternfly/react-styles/css/components/InlineEdit/inline-edit';
 import { css } from '@patternfly/react-styles';
@@ -105,7 +105,7 @@ export interface TableProps extends OUIAProps {
   /** Wrapper for the body  */
   bodyWrapper?: Function;
   /** Wrapper for the row */
-  rowWrapper?: (props: RowWrapperProps) => JSX.Element;
+  rowWrapper?: (props: RowWrapperProps) => React.JSX.Element;
   /** A valid WAI-ARIA role to be applied to the table element */
   role?: string;
   /** If set to true, the table header sticks to the top of its container */
@@ -131,7 +131,7 @@ export interface TableProps extends OUIAProps {
   ouiaSafe?: boolean;
 }
 
-class Table extends React.Component<TableProps, {}> {
+class Table extends Component<TableProps, {}> {
   static displayName = 'Table';
   static hasWarnBeta = false;
   static defaultProps: Partial<TableProps> = {

package/src/deprecated/components/Table/TableContext.ts

@@ -1,8 +1,8 @@
-import * as React from 'react';
+import { createContext } from 'react';
 import { IHeaderRow, IRow } from '../../../components';
 import { ColumnsType } from '../../../components/Table/base/types';
 
-export const TableContext = React.createContext({
+export const TableContext = createContext({
   headerData: null as ColumnsType,
   headerRows: null as IHeaderRow[],
   rows: [] as (IRow | string[])[]

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

@@ -1,5 +1,3 @@
-import React from 'react';
-
 import { render, screen } from '@testing-library/react';
 
 import {

package/src/deprecated/components/Table/__tests__/__snapshots__/Table.test.tsx.snap

@@ -1523,7 +1523,6 @@ exports[`Table Collapsible nested table 1`] = `
           tabindex="-1"
         >
           <button
-            aria-disabled="false"
             aria-expanded="false"
             aria-label="Details"
             aria-labelledby="simple-node0 expandable-toggle0"
@@ -1615,7 +1614,6 @@ exports[`Table Collapsible nested table 1`] = `
           tabindex="-1"
         >
           <button
-            aria-disabled="false"
             aria-expanded="true"
             aria-label="Details"
             aria-labelledby="simple-node1 expandable-toggle1"
@@ -1778,7 +1776,6 @@ exports[`Table Collapsible nested table 1`] = `
           tabindex="-1"
         >
           <button
-            aria-disabled="false"
             aria-expanded="false"
             aria-label="Details"
             aria-labelledby="simple-node3 expandable-toggle3"
@@ -2287,7 +2284,6 @@ exports[`Table Collapsible table 1`] = `
           tabindex="-1"
         >
           <button
-            aria-disabled="false"
             aria-expanded="true"
             aria-label="Details"
             aria-labelledby="simple-node0 expandable-toggle0"
@@ -2505,7 +2501,6 @@ exports[`Table Collapsible table 1`] = `
           tabindex="-1"
         >
           <button
-            aria-disabled="false"
             aria-expanded="false"
             aria-label="Details"
             aria-labelledby="simple-node3 expandable-toggle3"
@@ -10533,7 +10528,6 @@ exports[`Table simple Editable table 1`] = `
                 class="pf-v6-c-inline-edit__action"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Save row edits for row 0"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-1"
@@ -10564,7 +10558,6 @@ exports[`Table simple Editable table 1`] = `
                 class="pf-v6-c-inline-edit__action"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Cancel row edits for row 0"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-2"
@@ -10596,7 +10589,6 @@ exports[`Table simple Editable table 1`] = `
               class="pf-v6-c-inline-edit__action pf-m-enable-editable"
             >
               <button
-                aria-disabled="false"
                 aria-label="Place row 0 in edit mode"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-3"
@@ -10776,7 +10768,6 @@ exports[`Table simple Editable table 1`] = `
                 class="pf-v6-c-inline-edit__action"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Save row edits for row 1"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-4"
@@ -10807,7 +10798,6 @@ exports[`Table simple Editable table 1`] = `
                 class="pf-v6-c-inline-edit__action"
               >
                 <button
-                  aria-disabled="false"
                   aria-label="Cancel row edits for row 1"
                   class="pf-v6-c-button pf-m-plain"
                   data-ouia-component-id="OUIA-Generated-Button-plain-5"
@@ -10839,7 +10829,6 @@ exports[`Table simple Editable table 1`] = `
               class="pf-v6-c-inline-edit__action pf-m-enable-editable"
             >
               <button
-                aria-disabled="false"
                 aria-label="Place row 1 in edit mode"
                 class="pf-v6-c-button pf-m-plain"
                 data-ouia-component-id="OUIA-Generated-Button-plain-6"

package/src/deprecated/components/Table/base/body-row.tsx

@@ -4,8 +4,8 @@
  * Forked from reactabular-table version 8.14.0
  * https://github.com/reactabular/reactabular/tree/v8.14.0/packages/reactabular-table/src
  */
+import { Component, createElement } from 'react';
 import isEqual from 'lodash/isEqual';
-import * as React from 'react';
 import {
   createElementType,
   formatterValueType,
@@ -28,7 +28,7 @@ export interface BodyRowProps {
   rowKey: string;
 }
 
-class BodyRow extends React.Component<BodyRowProps, {}> {
+class BodyRow extends Component<BodyRowProps, {}> {
   static displayName = 'BodyRow';
   static defaultProps = {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
@@ -54,7 +54,7 @@ class BodyRow extends React.Component<BodyRowProps, {}> {
   render() {
     const { columns, renderers, onRow, rowKey, rowIndex, rowData } = this.props;
 
-    return React.createElement(
+    return createElement(
       renderers.row as createElementType,
       onRow(rowData, { rowIndex, rowKey }),
       (columns as []).map((column: ColumnType, columnIndex: number) => {
@@ -81,7 +81,7 @@ class BodyRow extends React.Component<BodyRowProps, {}> {
           additionalFormaters = rowData[evaluatedProperty].formatters;
         }
 
-        return React.createElement(
+        return createElement(
           renderers.cell as createElementType,
           {
             key: `col-${columnIndex}-row-${rowIndex}`,

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

@@ -4,7 +4,7 @@
  * Forked from reactabular-table version 8.14.0
  * https://github.com/reactabular/reactabular/tree/v8.14.0/packages/reactabular-table/src
  */
-import * as React from 'react';
+import { Component, createElement } from 'react';
 import isEqual from 'lodash/isEqual';
 import {
   RowsType,
@@ -28,7 +28,7 @@ export interface BodyProps {
   className?: string;
 }
 
-class BaseBody extends React.Component<BodyProps, {}> {
+class BaseBody extends Component<BodyProps, {}> {
   static defaultProps = {
     // eslint-disable-next-line @typescript-eslint/no-unused-vars
     onRow: (...args: any) => ({})
@@ -66,7 +66,7 @@ class BaseBody extends React.Component<BodyProps, {}> {
     const { onRow, rows, rowKey, columns, renderers, ...props } = this.props;
     const children = (rows as []).map((rowData: RowType, index: number) => {
       const key = resolveRowKey({ rowData, rowIndex: index, rowKey });
-      return React.createElement(BodyRow, {
+      return createElement(BodyRow, {
         key,
         renderers: renderers.body,
         onRow,
@@ -77,7 +77,7 @@ class BaseBody extends React.Component<BodyProps, {}> {
       });
     });
 
-    return React.createElement(renderers.body.wrapper as createElementType, props, children);
+    return createElement(renderers.body.wrapper as createElementType, props, children);
   }
 }
 

package/src/deprecated/components/Table/base/header-row.tsx

@@ -4,7 +4,7 @@
  * Forked from reactabular-table version 8.14.0
  * https://github.com/reactabular/reactabular/tree/v8.14.0/packages/reactabular-table/src
  */
-import * as React from 'react';
+import { createElement } from 'react';
 import {
   createElementType,
   ColumnType,
@@ -30,7 +30,7 @@ export const HeaderRow: React.FunctionComponent<HeaderRowProps> = ({
   renderers,
   onRow = () => ({})
 }: HeaderRowProps) =>
-  React.createElement(
+  createElement(
     renderers.row as createElementType,
     onRow(rowData, { rowIndex }),
     (rowData as []).map((column: ColumnType, columnIndex: number) => {
@@ -107,7 +107,7 @@ export const HeaderRow: React.FunctionComponent<HeaderRowProps> = ({
         cellNode = transformedProps.children || evaluateFormatters(formatters)(label, extraParameters);
       }
 
-      return React.createElement(
+      return createElement(
         renderers.cell as createElementType,
         {
           key: `${columnIndex}-header`,

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

@@ -4,7 +4,7 @@
  * Forked from reactabular-table version 8.14.0
  * https://github.com/reactabular/reactabular/tree/v8.14.0/packages/reactabular-table/src
  */
-import * as React from 'react';
+import { Component, createElement } from 'react';
 import { createElementType, RowsType, ColumnsType, RenderersTypes } from '../../../../components/Table/base/types';
 import { ProviderContext } from '../../../../components/Table/base/provider';
 
@@ -19,17 +19,17 @@ export interface HeaderProps {
   className?: string;
 }
 
-class BaseHeader extends React.Component<HeaderProps, {}> {
+class BaseHeader extends Component<HeaderProps, {}> {
   render() {
     const { children, headerRows, onRow, renderers, columns, ...props } = this.props;
 
     // If headerRows aren't passed, default to bodyColumns as header rows
-    return React.createElement(
+    return createElement(
       renderers.header.wrapper as createElementType,
       props,
       [
         (headerRows || ([columns] as ColumnsType)).map((rowData, rowIndex) =>
-          React.createElement(HeaderRow, {
+          createElement(HeaderRow, {
             key: `${rowIndex}-header-row`,
             renderers: renderers.header,
             onRow,

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

@@ -1,5 +1,5 @@
 /* eslint-disable no-console */
-import React from 'react';
+import { Fragment, useState } from 'react';
 import {
   Button,
   Checkbox,
@@ -50,13 +50,13 @@ export const LegacyTableActions: React.FunctionComponent = () => {
   ];
 
   // This state is just for the ToggleGroup in this example and isn't necessary for Table usage.
-  const [propToUse, setPropToUse] = React.useState<ExampleType>('actions');
+  const [propToUse, setPropToUse] = useState<ExampleType>('actions');
   const onPropToUseChange: ToggleGroupItemProps['onChange'] = (event, _isSelected) => {
     const id = event.currentTarget.id;
     setPropToUse(id as ExampleType);
   };
 
-  const [useCustomToggle, setUseCustomToggle] = React.useState(false);
+  const [useCustomToggle, setUseCustomToggle] = useState(false);
 
   const customActionsToggle = (props: CustomActionsToggleProps) => (
     <MenuToggle ref={props.toggleRef} onClick={props.onToggle} isDisabled={props.isDisabled}>
@@ -154,7 +154,7 @@ export const LegacyTableActions: React.FunctionComponent = () => {
   };
 
   return (
-    <React.Fragment>
+    <Fragment>
       <Toolbar>
         <ToolbarContent>
           <ToolbarItem>
@@ -199,6 +199,6 @@ export const LegacyTableActions: React.FunctionComponent = () => {
         <TableHeader />
         <TableBody />
       </Table>
-    </React.Fragment>
+    </Fragment>
   );
 };