@redis-ui/table 2.12.0 → 2.18.0

package/dist/Table/Table.cjs

@@ -1,28 +1,19 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
 const jsxRuntime = require("../node_modules/react/jsx-runtime.cjs");
-const React = require("react");
-const index$3 = require("../node_modules/@radix-ui/react-visually-hidden/dist/index.cjs");
-const index$1 = require("../node_modules/@tanstack/react-table/build/lib/index.cjs");
-const index = require("../node_modules/@radix-ui/react-use-controllable-state/dist/index.cjs");
-const TablePagination = require("./components/TablePagination/TablePagination.cjs");
 const ExpandRowButton = require("./components/ExpandRowButton/ExpandRowButton.cjs");
 const TableExpandedRow = require("./components/TableExpandedRow/TableExpandedRow.cjs");
 const TableAnimatedExpandedRow = require("./components/TableExpandedRow/TableAnimatedExpandedRow.cjs");
-const Table_context = require("./Table.context.cjs");
-const TableHeaderCell = require("./components/TableHeaderCell/TableHeaderCell.cjs");
-const TableHeaderCell_utils = require("./components/TableHeaderCell/TableHeaderCell.utils.cjs");
-const EmptyStateRow = require("./components/EmptyStateRow/EmptyStateRow.cjs");
 const RowSelectionButton = require("./components/RowSelection/RowSelectionButton.cjs");
 const HeaderMultiRowSelectionButton = require("./components/RowSelection/HeaderMultiRowSelectionButton.cjs");
-const Table_style = require("./Table.style.cjs");
-const index$2 = require("../node_modules/@tanstack/table-core/build/lib/index.cjs");
-const getTrue = () => true;
-const DEFAULT_PAGINATION = {
-  pageIndex: 0,
-  pageSize: 10
-};
-const DEFAULT_ROW_SELECTION = {};
+const RowSelectionPlugin = require("./plugins/RowSelectionPlugin.cjs");
+const ExpandableRowPlugin = require("./plugins/ExpandableRowPlugin.cjs");
+const PaginationPlugin = require("./plugins/PaginationPlugin.cjs");
+const SortingPlugin = require("./plugins/SortingPlugin.cjs");
+const ClickableRowPlugin = require("./plugins/ClickableRowPlugin.cjs");
+const Table_context = require("./Table.context.cjs");
+const PluggableTable = require("./components/PluggableTable/PluggableTable.cjs");
+const compositionComponents = require("./components/PluggableTable/compositionComponents.cjs");
 const Table = Object.assign(({
   columns,
   caption,
@@ -33,15 +24,16 @@ const Table = Object.assign(({
   maxHeight,
   stripedRows = false,
   // sorting
+  enableSorting,
   defaultSorting,
   onSortingChange,
   sorting,
-  manualSorting = false,
+  manualSorting,
   // row expansion
   getIsRowExpandable,
   renderExpandedRow,
   expandRowOnClick,
-  expandedRowComponent: ExpandedRow = TableExpandedRow.TableExpandedRow,
+  expandedRowComponent,
   // pagination
   pagination,
   defaultPagination,
@@ -49,7 +41,7 @@ const Table = Object.assign(({
   manualPagination,
   totalRowCount,
   pageSizes,
-  paginationEnabled = (pagination || defaultPagination || onPaginationChange || pageSizes) !== void 0 || manualPagination !== void 0,
+  paginationEnabled,
   // row selection
   rowSelection,
   defaultRowSelection,
@@ -57,141 +49,74 @@ const Table = Object.assign(({
   rowSelectionMode,
   getRowCanSelect
 }) => {
-  const [userSorted, setUserSorted] = React.useState(false);
-  const [sortingState, setSortingState] = index.useControllableState({
-    prop: sorting,
-    defaultProp: defaultSorting,
-    onChange: onSortingChange
+  const clickableRowPluginData = ClickableRowPlugin.useClickableRowPlugin({
+    onRowClick: onRowClick && ((row) => onRowClick(row.original)),
+    shouldClickOnEnter: true
   });
-  const [paginationState, setPaginationState] = index.useControllableState({
-    prop: pagination,
-    defaultProp: defaultPagination ?? DEFAULT_PAGINATION,
-    onChange: onPaginationChange
+  const sortingPluginData = SortingPlugin.useSortingPlugin({
+    enableSorting,
+    defaultSorting,
+    onSortingChange,
+    sorting,
+    manualSorting
   });
-  const [rowSelectionState = DEFAULT_ROW_SELECTION, setRowSelectionState] = index.useControllableState({
-    prop: rowSelection,
-    defaultProp: defaultRowSelection,
-    onChange: onRowSelectionChange
-  });
-  const isExpandable = !!renderExpandedRow;
-  const paginationSettings = {
-    getPaginationRowModel: index$2.getPaginationRowModel(),
-    onPaginationChange: setPaginationState,
+  const paginationPluginData = PaginationPlugin.usePaginationPlugin({
+    pagination,
+    defaultPagination,
+    onPaginationChange,
     manualPagination,
-    rowCount: totalRowCount,
-    autoResetPageIndex: false
-  };
-  const table = index$1.useReactTable({
-    data,
-    columns,
-    getRowId,
-    getCoreRowModel: index$2.getCoreRowModel(),
-    getSortedRowModel: index$2.getSortedRowModel(),
-    state: {
-      sorting: sortingState,
-      ...paginationEnabled && {
-        pagination: paginationState
-      },
-      ...rowSelectionMode && {
-        rowSelection: rowSelectionState
-      }
-    },
-    manualSorting,
-    onSortingChange: (value) => {
-      setSortingState(value);
-      setUserSorted(true);
-    },
-    getExpandedRowModel: isExpandable ? index$2.getExpandedRowModel() : void 0,
-    getRowCanExpand: isExpandable ? getIsRowExpandable && ((row) => getIsRowExpandable(row.original)) || getTrue : void 0,
-    ...paginationEnabled && paginationSettings,
-    enableRowSelection: rowSelectionMode && (getRowCanSelect ?? true),
-    enableMultiRowSelection: rowSelectionMode === "multiple",
-    onRowSelectionChange: setRowSelectionState
+    totalRowCount,
+    pageSizes,
+    paginationEnabled
+  });
+  const expandableRowPluginData = ExpandableRowPlugin.useExpandableRowPlugin({
+    expandRowOnClick,
+    getRowCanExpand: getIsRowExpandable && ((row) => getIsRowExpandable(row.original)),
+    renderExpandedRow,
+    expandedRowComponent
   });
-  const {
-    pageIndex
-  } = table.getState().pagination;
-  const maxPageIndex = Math.max(table.getPageCount(), 1) - 1;
-  React.useEffect(() => {
-    if (paginationEnabled) table.setPageIndex(Math.min(pageIndex, maxPageIndex));
-  }, [maxPageIndex, pageIndex, table, paginationEnabled]);
-  const {
-    rows
-  } = table.getRowModel();
-  return jsxRuntime.jsxRuntimeExports.jsxs(Table_context.TableContext.Provider, {
-    value: {
-      table
+  const rowSelectionPluginData = RowSelectionPlugin.useRowSelectionPlugin({
+    rowSelection,
+    defaultRowSelection,
+    onRowSelectionChange,
+    rowSelectionMode,
+    getRowCanSelect
+  });
+  return jsxRuntime.jsxRuntimeExports.jsx(Table.PluggableTable, {
+    ...{
+      data,
+      columns,
+      maxHeight,
+      stripedRows,
+      caption,
+      emptyStateRender: emptyState
+    },
+    tableOptions: {
+      getRowId
     },
-    children: [jsxRuntime.jsxRuntimeExports.jsxs(Table_style.TableContainer, {
-      children: [jsxRuntime.jsxRuntimeExports.jsxs(Table_style.Table, {
-        children: [caption && jsxRuntime.jsxRuntimeExports.jsx(index$3.VisuallyHidden, {
-          asChild: true,
-          children: jsxRuntime.jsxRuntimeExports.jsx("caption", {
-            children: caption
-          })
-        }), jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableHead, {
-          children: table.getHeaderGroups().map((headerGroup) => jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableHeaderRow, {
-            children: headerGroup.headers.map((header) => jsxRuntime.jsxRuntimeExports.jsx(TableHeaderCell.TableHeaderCell, {
-              header
-            }, header.id))
-          }, headerGroup.id))
-        }), jsxRuntime.jsxRuntimeExports.jsxs(Table_style.TableBody, {
-          maxHeight,
-          children: [!rows.length ? jsxRuntime.jsxRuntimeExports.jsx(EmptyStateRow.EmptyStateRow, {
-            table,
-            emptyState
-          }) : null, rows.map((row) => {
-            const isRowExpandable = isExpandable && row.getCanExpand();
-            const isRowExpanded = isRowExpandable && row.getIsExpanded();
-            const handleClick = () => {
-              isRowExpandable && expandRowOnClick && row.toggleExpanded();
-              onRowClick == null ? void 0 : onRowClick(row.original);
-            };
-            return jsxRuntime.jsxRuntimeExports.jsxs(React.Fragment, {
-              children: [jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyRow, {
-                tabIndex: 0,
-                "data-row-type": "regular",
-                ...isRowExpandable ? {
-                  "aria-expanded": isRowExpanded
-                } : null,
-                "$stripedRows": stripedRows,
-                "$hasOnClick": !!onRowClick || isRowExpandable,
-                onClick: handleClick,
-                onKeyDown: (event) => {
-                  if (event.key === "Enter" && event.target === event.currentTarget) {
-                    handleClick();
-                  }
-                },
-                children: row.getVisibleCells().map((cell) => jsxRuntime.jsxRuntimeExports.jsx(Table_style.TableBodyCell, {
-                  style: {
-                    width: cell.column.getSize()
-                  },
-                  children: index$1.flexRender(cell.column.columnDef.cell, cell.getContext())
-                }, cell.id))
-              }), isRowExpandable && // 2nd row is a custom 1 cell row for expanded part
-              jsxRuntime.jsxRuntimeExports.jsx(ExpandedRow, {
-                "data-row-type": "expanded",
-                "data-expanded": isRowExpanded,
-                expanded: isRowExpanded,
-                row,
-                renderExpandedRow
-              })]
-            }, row.id);
-          })]
-        })]
-      }), jsxRuntime.jsxRuntimeExports.jsx(TablePagination.default, {
-        pageSizes
-      })]
-    }), userSorted && jsxRuntime.jsxRuntimeExports.jsx(index$3.VisuallyHidden, {
-      "aria-live": "polite",
-      children: TableHeaderCell_utils.getTableSortLabel(table, TableHeaderCell_utils.formatTableSortNotification)
-    })]
+    pluginsData: [clickableRowPluginData, sortingPluginData, paginationPluginData, expandableRowPluginData, rowSelectionPluginData]
   });
 }, {
   ExpandRowButton: ExpandRowButton.ExpandRowButton,
   ExpandedRow: TableExpandedRow.TableExpandedRow,
   AnimatedExpandedRow: TableAnimatedExpandedRow.TableAnimatedExpandedRow,
   RowSelectionButton: RowSelectionButton.RowSelectionButton,
-  HeaderMultiRowSelectionButton: HeaderMultiRowSelectionButton.HeaderMultiRowSelectionButton
+  HeaderMultiRowSelectionButton: HeaderMultiRowSelectionButton.HeaderMultiRowSelectionButton,
+  // plugins
+  useClickableRowPlugin: ClickableRowPlugin.useClickableRowPlugin,
+  useSortingPlugin: SortingPlugin.useSortingPlugin,
+  usePaginationPlugin: PaginationPlugin.usePaginationPlugin,
+  useExpandableRowPlugin: ExpandableRowPlugin.useExpandableRowPlugin,
+  useRowSelectionPlugin: RowSelectionPlugin.useRowSelectionPlugin,
+  // contexts
+  useTableContext: Table_context.useTableContext,
+  useComposeContext: Table_context.useComposeContext,
+  useClickableRowContext: ClickableRowPlugin.useClickableRowContext,
+  useExpandableRowContext: ExpandableRowPlugin.useExpandableRowContext,
+  usePaginationContext: PaginationPlugin.usePaginationContext,
+  useSortingContext: SortingPlugin.useSortingContext,
+  // composition components
+  PluggableTable: PluggableTable.PluggableTable,
+  ...compositionComponents.compositionComponents
 });
 exports.default = Table;

package/dist/Table/Table.context.cjs

@@ -2,6 +2,7 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const React = require("react");
 const TableContext = React.createContext(null);
+const TableContextProvider = TableContext.Provider;
 const useTableContext = () => {
   const tableContext = React.useContext(TableContext);
   if (!tableContext) {
@@ -9,5 +10,19 @@ const useTableContext = () => {
   }
   return tableContext;
 };
-exports.TableContext = TableContext;
+const usePluginContext = (pluginScope) => {
+  var _a;
+  return (_a = useTableContext().plugins) == null ? void 0 : _a[pluginScope];
+};
+const useComposeContext = (defaults) => {
+  const context = useTableContext();
+  const entries = Object.keys(defaults).map((key) => {
+    var _a;
+    return [key, ((_a = context.components) == null ? void 0 : _a[key]) || defaults[key]];
+  });
+  return Object.fromEntries(entries);
+};
+exports.TableContextProvider = TableContextProvider;
+exports.useComposeContext = useComposeContext;
+exports.usePluginContext = usePluginContext;
 exports.useTableContext = useTableContext;

package/dist/Table/Table.context.d.ts

@@ -1,7 +1,25 @@
-/// <reference types="react" />
+import { ComponentProps, ComponentType } from 'react';
 import { Table } from '@tanstack/react-table';
-export type TableContextProps<T extends object> = {
+import type { TableHeaderRow } from './components/TableHeaderRow/TableHeaderRow';
+import type { TableHeaderCell } from './components/TableHeaderCell/TableHeaderCell';
+import type { TableBodyRow } from './components/TableBodyRow/TableBodyRow';
+import type { TableBodyCell } from './components/TableBodyCell/TableBodyCell';
+export type CompositionContextProps<T extends object> = {
+    TableHeaderRow: ComponentType<ComponentProps<typeof TableHeaderRow<T>>>;
+    TableHeaderCell: ComponentType<ComponentProps<typeof TableHeaderCell<T>>>;
+    TableBodyRow: ComponentType<ComponentProps<typeof TableBodyRow<T>>>;
+    TableBodyCell: ComponentType<ComponentProps<typeof TableBodyCell<T>>>;
+};
+export type TableMainContextProps = {
+    stripedRows?: boolean;
+    maxHeight?: string;
+};
+export type TableContextProps<T extends object> = TableMainContextProps & {
     table: Table<T>;
+    plugins?: Record<string, unknown>;
+    components?: Partial<CompositionContextProps<T>>;
 };
-export declare const TableContext: import("react").Context<TableContextProps<any> | null>;
-export declare const useTableContext: () => TableContextProps<any>;
+export declare const TableContextProvider: import("react").Provider<TableContextProps<any> | null>;
+export declare const useTableContext: <T extends object = object>() => TableContextProps<T>;
+export declare const usePluginContext: <T>(pluginScope: string) => T | undefined;
+export declare const useComposeContext: <T extends object, C extends CompositionContextProps<T> = CompositionContextProps<T>>(defaults: Partial<C>) => C;

package/dist/Table/Table.context.js

@@ -1,5 +1,6 @@
 import { createContext, useContext } from "react";
 const TableContext = createContext(null);
+const TableContextProvider = TableContext.Provider;
 const useTableContext = () => {
   const tableContext = useContext(TableContext);
   if (!tableContext) {
@@ -7,7 +8,21 @@ const useTableContext = () => {
   }
   return tableContext;
 };
+const usePluginContext = (pluginScope) => {
+  var _a;
+  return (_a = useTableContext().plugins) == null ? void 0 : _a[pluginScope];
+};
+const useComposeContext = (defaults) => {
+  const context = useTableContext();
+  const entries = Object.keys(defaults).map((key) => {
+    var _a;
+    return [key, ((_a = context.components) == null ? void 0 : _a[key]) || defaults[key]];
+  });
+  return Object.fromEntries(entries);
+};
 export {
-  TableContext,
+  TableContextProvider,
+  useComposeContext,
+  usePluginContext,
   useTableContext
 };

package/dist/Table/Table.d.ts

@@ -1,9 +1,87 @@
+/// <reference types="react" />
+import './tanStackExtendedTypes';
+import type { Row } from '@tanstack/react-table';
 import { TableProps } from './Table.types';
-declare const Table: (<T extends object>({ columns, caption, onRowClick, data, getRowId, emptyState, maxHeight, stripedRows, defaultSorting, onSortingChange, sorting, manualSorting, getIsRowExpandable, renderExpandedRow, expandRowOnClick, expandedRowComponent: ExpandedRow, pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled, rowSelection, defaultRowSelection, onRowSelectionChange, rowSelectionMode, getRowCanSelect }: TableProps<T>) => import("react/jsx-runtime").JSX.Element) & {
+declare const Table: (<T extends object>({ columns, caption, onRowClick, data, getRowId, emptyState, maxHeight, stripedRows, enableSorting, defaultSorting, onSortingChange, sorting, manualSorting, getIsRowExpandable, renderExpandedRow, expandRowOnClick, expandedRowComponent, pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled, rowSelection, defaultRowSelection, onRowSelectionChange, rowSelectionMode, getRowCanSelect }: TableProps<T>) => import("react/jsx-runtime").JSX.Element) & {
+    Compose: <T_1 extends object>({ data, columns, pluginsData, tableOptions, components, maxHeight, stripedRows, ...restProps }: import("./components/Compose/Compose").TableComposeProps<T_1>) => import("react/jsx-runtime").JSX.Element;
+    Root: import("styled-components").StyledComponent<"table", any, {}, never>;
+    SRCaption: ({ caption }: {
+        caption?: string | undefined;
+    }) => import("react/jsx-runtime").JSX.Element | null;
+    Header: (<T_2 extends object>(props: import("./components/TableHeader/TableHeader").RestTableHeaderProps) => import("react/jsx-runtime").JSX.Element) & {
+        Compose: import("styled-components").StyledComponent<"thead", any, {}, never>;
+        Row: (<T_3 extends object>(props: import("./components/TableHeaderRow/TableHeaderRow").OwnTableHeaderRowProps<T_3> & import("./components/TableHeaderRow/TableHeaderRow").RestTableHeaderRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null) & {
+            Compose: import("styled-components").StyledComponent<"tr", any, {}, never>;
+        };
+        Cell: (<T_4 extends object>(props: import("./components/TableHeaderCell/TableHeaderCell").OwnTableHeaderCellProps<T_4> & import("./components/TableHeaderCell/TableHeaderCell").RestTableHeaderCellProps & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null) & {
+            Compose: <T_5 extends object>(props: import("./components/TableHeaderCell/components/Compose/Compose").OwnTableHeaderCellComposeProps<T_5> & import("@redislabsdev/redis-ui-components").ComposeChildrenProps & Omit<import("react").HTMLAttributes<HTMLTableCellElement>, "content" | "children"> & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null;
+            SortableHeading: (({ children, ...restProps }: import("@redislabsdev/redis-ui-components").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element) & {
+                Compose: ((props: import("@redislabsdev/redis-ui-components").ComposeElementProps<HTMLDivElement>) => import("react/jsx-runtime").JSX.Element) & {
+                    SortIndicator: () => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+                };
+                SortIndicator: () => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>;
+            };
+            Heading: (props: import("./components/TableHeaderCell/components/Heading/Heading").RestTableHeaderCellHeadingProps) => import("react/jsx-runtime").JSX.Element;
+        };
+    };
+    EmptyState: ({ emptyStateRender, ...restProps }: import("./components/EmptyState/EmptyState").EmptyStateProps) => import("react/jsx-runtime").JSX.Element | null;
+    Body: (<T_6 extends object>(props: import("./components/TableBody/TableBody").RestTableBodyProps) => import("react/jsx-runtime").JSX.Element | null) & {
+        Compose: (props: import("./components/TableBody/components/Compose/Compose").TableBodyComposeProps) => import("react/jsx-runtime").JSX.Element;
+        Row: (<T_7 extends object>(props: import("./components/TableBodyRow/TableBodyRow").OwnTableBodyRowProps<T_7> & import("./components/TableBodyRow/TableBodyRow").RestTableBodyRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null) & {
+            Compose: (props: import("@redislabsdev/redis-ui-components").ComposeChildrenProps & Omit<import("react").HTMLAttributes<HTMLTableRowElement>, "content" | "children"> & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null;
+            useHandleClickableRow: <T_8 extends object>({ row, onClick, onKeyDown }: {
+                row: Row<T_8>;
+                onClick?: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+                onKeyDown?: import("react").KeyboardEventHandler<HTMLTableRowElement> | undefined;
+            }) => {
+                onClick: import("react").MouseEventHandler<HTMLTableRowElement> | undefined;
+                onKeyDown: ((event: import("react").KeyboardEvent<HTMLTableRowElement>) => void) | undefined;
+            };
+        };
+        ExpandableRow: <T_9 extends object>(props: import("./components/TableBodyRow/TableBodyRow").OwnTableBodyRowProps<T_9> & import("./components/TableBodyRow/TableBodyRow").RestTableBodyRowProps & import("react").RefAttributes<HTMLTableRowElement>) => import("react").ReactElement<any, any> | null;
+        Cell: (<T_10 extends object>(props: import("./components/TableBodyCell/TableBodyCell").OwnTableBodyCellProps<T_10> & import("./components/TableBodyCell/TableBodyCell").RestTableBodyCellProps & import("react").RefAttributes<HTMLTableCellElement>) => import("react").ReactElement<any, any> | null) & {
+            Compose: import("styled-components").StyledComponent<"td", any, {}, never>;
+        };
+    };
+    Pagination: (() => import("react/jsx-runtime").JSX.Element | null) & {
+        Compose: ({ children }: import("@redislabsdev/redis-ui-components").ComposeChildrenProps) => import("react/jsx-runtime").JSX.Element | null;
+        Bar: import("styled-components").StyledComponent<"nav", any, {
+            'aria-label': string;
+        } & {
+            'aria-label': string;
+        }, "aria-label">;
+        Split: import("styled-components").StyledComponent<"div", any, {}, never>;
+        InfoLabel: import("styled-components").StyledComponent<({ renderer, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationInfoLabelProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+        PageSelect: import("styled-components").StyledComponent<{
+            ({ ...restProps }: import("@redislabsdev/redis-ui-components").PaginationPageSelectProps): import("react/jsx-runtime").JSX.Element;
+            Label: ({ children, ...restProps }: import("@redislabsdev/redis-ui-components").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element;
+        }, any, {}, never>;
+        PageSizeSelect: import("styled-components").StyledComponent<{
+            ({ pageSizes, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationPageSizeSelectProps): import("react/jsx-runtime").JSX.Element | null;
+            Label: ({ children, ...restProps }: import("@redislabsdev/redis-ui-components").TypographyBodyProps) => import("react/jsx-runtime").JSX.Element | null;
+        }, any, {}, never>;
+        NavigationButton: import("styled-components").StyledComponent<({ navType, ...restProps }: import("@redislabsdev/redis-ui-components").PaginationNavigationButtonProps) => import("react/jsx-runtime").JSX.Element, any, {}, never>;
+        PageSizeGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
+        PageNavGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
+        PageSelectGroup: import("styled-components").StyledComponent<"div", any, {}, never>;
+    };
+    SRSortingNotification: typeof import("./components/TableHeaderCell/SRSortingNotification").SRSortingNotification;
     ExpandRowButton: ({ row, expandedIcon, collapsedIcon, ...restProps }: import("./components/ExpandRowButton/ExpandRowButton").ExpandRowButtonProps) => import("react/jsx-runtime").JSX.Element | null;
-    ExpandedRow: <T_1 extends object>({ row, renderExpandedRow, keepInDom, expanded, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_1>) => import("react/jsx-runtime").JSX.Element | null;
-    AnimatedExpandedRow: <T_2 extends object>({ expanded, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_2>) => import("react/jsx-runtime").JSX.Element;
-    RowSelectionButton: <T_3 extends object>({ row, ...restProps }: import("./components/RowSelection/RowSelectionButton").RowSelectionButtonProps<T_3>) => import("react/jsx-runtime").JSX.Element;
-    HeaderMultiRowSelectionButton: <T_4 extends object>({ table, managePage, ...restProps }: import("./components/RowSelection/HeaderMultiRowSelectionButton").HeaderMultiRowSelectionButtonProps<T_4>) => import("react/jsx-runtime").JSX.Element;
+    ExpandedRow: <T_11 extends object>({ row, keepInDom, rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_11>) => import("react/jsx-runtime").JSX.Element | null;
+    AnimatedExpandedRow: <T_12 extends object>({ rowRef, ...restProps }: import("./components/TableExpandedRow").TableExpandedRowProps<T_12>) => import("react/jsx-runtime").JSX.Element;
+    RowSelectionButton: <T_13 extends object>({ row, ...restProps }: import("./components/RowSelection/RowSelectionButton").RowSelectionButtonProps<T_13>) => import("react/jsx-runtime").JSX.Element;
+    HeaderMultiRowSelectionButton: <T_14 extends object>({ table, managePage, ...restProps }: import("./components/RowSelection/HeaderMultiRowSelectionButton").HeaderMultiRowSelectionButtonProps<T_14>) => import("react/jsx-runtime").JSX.Element;
+    useClickableRowPlugin: <T_15 extends object>({ getCanRowClick, onRowClick, shouldClickOnEnter }: Partial<import("./plugins/ClickableRowPlugin").TableClickableRowContext<T_15>>) => import(".").TablePluginData<T_15>;
+    useSortingPlugin: <T_16 extends object>({ defaultSorting, onSortingChange, sorting, manualSorting, enableSorting }: import("./plugins/SortingPlugin").TableSortingParams) => import(".").TablePluginData<T_16>;
+    usePaginationPlugin: <T_17 extends object>({ pagination, defaultPagination, onPaginationChange, manualPagination, totalRowCount, pageSizes, paginationEnabled }: import("./plugins/PaginationPlugin").TablePaginationParams) => import(".").TablePluginData<T_17>;
+    useExpandableRowPlugin: <T_18 extends object>({ getRowCanExpand, renderExpandedRow, expandRowOnClick, expandedRowComponent }: import("./plugins/ExpandableRowPlugin").TableExpandableRowParams<T_18>) => import(".").TablePluginData<T_18>;
+    useRowSelectionPlugin: <T_19 extends object>({ rowSelection, defaultRowSelection, onRowSelectionChange, rowSelectionMode, getRowCanSelect }: import("./plugins/RowSelectionPlugin").TableRowSelectionParams<T_19>) => import(".").TablePluginData<T_19>;
+    useTableContext: <T_20 extends object = object>() => import("./Table.context").TableContextProps<T_20>;
+    useComposeContext: <T_21 extends object, C extends import("./Table.context").CompositionContextProps<T_21> = import("./Table.context").CompositionContextProps<T_21>>(defaults: Partial<C>) => C;
+    useClickableRowContext: <T_22 extends object>() => import("./plugins/ClickableRowPlugin").TableClickableRowContext<T_22> | undefined;
+    useExpandableRowContext: <T_23 extends object>() => import("./plugins/ExpandableRowPlugin").TableExpandableRowContext<T_23> | undefined;
+    usePaginationContext: () => import("./plugins/PaginationPlugin").TablePaginationContext | undefined;
+    useSortingContext: () => import("./plugins/SortingPlugin").TableSortingContext | undefined;
+    PluggableTable: <T_24 extends object>({ caption, emptyStateRender, ...restProps }: import("./components/PluggableTable/PluggableTable").PluggableTableProps<T_24>) => import("react/jsx-runtime").JSX.Element;
 };
 export default Table;