@tanstack/react-table 8.0.0-alpha.1 → 8.0.0-alpha.2

package/build/types/core.d.ts

@@ -48,6 +48,10 @@ export declare type TableCore<TData, TValue, TFilterFns, TSortingFns, TAggregati
     getTableBodyProps: PropGetter<TableBodyProps>;
     getRowProps: <TGetter extends Getter<RowProps>>(rowId: string, userProps?: TGetter) => undefined | PropGetterValue<RowProps, TGetter>;
     getCellProps: <TGetter extends Getter<CellProps>>(rowId: string, columnId: string, userProps?: TGetter) => undefined | PropGetterValue<CellProps, TGetter>;
+    getTableWidth: () => number;
+    getLeftTableWidth: () => number;
+    getCenterTableWidth: () => number;
+    getRightTableWidth: () => number;
 };
 export declare type CoreRow<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
     id: string;

package/build/types/createTable.d.ts

@@ -2,7 +2,7 @@ import { Cell, Column, Row } from '.';
 import { ReactTable, ColumnDef, AccessorFn, Options } from './types';
 import { Overwrite } from './utils';
 declare type TableHelper<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
-    RowType: <TTData>() => TableHelper<TTData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+    RowType<TTData>(): TableHelper<TTData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
     FilterFns: <TTFilterFns>(filterFns: TTFilterFns) => TableHelper<TData, TValue, TTFilterFns, TSortingFns, TAggregationFns>;
     SortingFns: <TTSortingFns>(sortingFns: TTSortingFns) => TableHelper<TData, TValue, TFilterFns, TTSortingFns, TAggregationFns>;
     AggregationFns: <TTAggregationFns>(aggregationFns: TTAggregationFns) => TableHelper<TData, TValue, TFilterFns, TSortingFns, TTAggregationFns>;

package/build/types/features/ColumnSizing.d.ts

@@ -0,0 +1,73 @@
+import { MouseEvent as ReactMouseEvent, TouchEvent as ReactTouchEvent } from 'react';
+import { Column, Getter, Header, OnChangeFn, PropGetterValue, ReactTable, Updater } from '../types';
+export declare type ColumnSizing = Record<string, number>;
+export declare type ColumnSizingInfoState = {
+    startOffset: null | number;
+    startSize: null | number;
+    deltaOffset: null | number;
+    deltaPercentage: null | number;
+    isResizingColumn: false | string;
+    columnSizingStart: [string, number][];
+};
+export declare type ColumnSizingTableState = {
+    columnSizing: ColumnSizing;
+    columnSizingInfo: ColumnSizingInfoState;
+};
+export declare type ColumnResizeMode = 'onChange' | 'onEnd';
+export declare type ColumnSizingOptions = {
+    enableColumnResizing?: boolean;
+    columnResizeMode?: ColumnResizeMode;
+    onColumnSizingChange?: OnChangeFn<ColumnSizing>;
+    onColumnSizingInfoChange?: OnChangeFn<ColumnSizingInfoState>;
+};
+export declare type ColumnSizingDefaultOptions = {
+    columnResizeMode: ColumnResizeMode;
+    onColumnSizingChange: OnChangeFn<ColumnSizing>;
+    onColumnSizingInfoChange: OnChangeFn<ColumnSizingInfoState>;
+};
+export declare type HeaderResizerProps = {
+    title?: string;
+    onMouseDown?: (e: ReactMouseEvent) => void;
+    onTouchStart?: (e: ReactTouchEvent) => void;
+    draggable?: boolean;
+    role?: string;
+};
+export declare type ColumnSizingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
+    setColumnSizing: (updater: Updater<ColumnSizing>) => void;
+    setColumnSizingInfo: (updater: Updater<ColumnSizingInfoState>) => void;
+    resetColumnSizing: () => void;
+    resetColumnSize: (columnId: string) => void;
+    resetHeaderSize: (headerId: string) => void;
+    resetHeaderSizeInfo: () => void;
+    getColumnCanResize: (columnId: string) => boolean;
+    getHeaderCanResize: (headerId: string) => boolean;
+    getHeaderResizerProps: <TGetter extends Getter<HeaderResizerProps>>(columnId: string, userProps?: TGetter) => undefined | PropGetterValue<HeaderResizerProps, TGetter>;
+    getColumnIsResizing: (columnId: string) => boolean;
+    getHeaderIsResizing: (headerId: string) => boolean;
+};
+export declare type ColumnSizingColumnDef = {
+    enableResizing?: boolean;
+    defaultCanResize?: boolean;
+};
+export declare type ColumnSizingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
+    getCanResize: () => boolean;
+    getIsResizing: () => boolean;
+    resetSize: () => void;
+};
+export declare type ColumnSizingHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
+    getCanResize: () => boolean;
+    getIsResizing: () => boolean;
+    getResizerProps: <TGetter extends Getter<HeaderResizerProps>>(userProps?: TGetter) => undefined | PropGetterValue<HeaderResizerProps, TGetter>;
+    resetSize: () => void;
+};
+export declare const defaultColumnSizing: {
+    width: number;
+    minWidth: number;
+    maxWidth: number;
+};
+export declare function getInitialState(): ColumnSizingTableState;
+export declare function getDefaultOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>): ColumnSizingDefaultOptions;
+export declare function getInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>): ColumnSizingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+export declare function createColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>): ColumnSizingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+export declare function createHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(header: Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, instance: ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>): ColumnSizingHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+export declare function passiveEventSupported(): boolean;

package/build/types/sortTypes.d.ts

@@ -10,8 +10,8 @@ export declare const sortTypes: {
 export declare type BuiltInSortType = keyof typeof sortTypes;
 declare function alphanumeric<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): number;
 declare function alphanumericCaseSensitive<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): number;
-declare function text<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 0 | 1 | -1;
-declare function textCaseSensitive<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 0 | 1 | -1;
-declare function datetime<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 0 | 1 | -1;
-declare function basic<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 0 | 1 | -1;
+declare function text<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 1 | 0 | -1;
+declare function textCaseSensitive<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 1 | 0 | -1;
+declare function datetime<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 1 | 0 | -1;
+declare function basic<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>(rowA: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, rowB: Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>, columnId: string): 1 | 0 | -1;
 export {};

package/build/types/types.d.ts

@@ -9,12 +9,13 @@ import { SortingColumn, SortingColumnDef, SortingInstance, SortingOptions, Sorti
 import { GroupingColumn, GroupingColumnDef, GroupingInstance, GroupingOptions, GroupingRow, GroupingTableState } from './features/Grouping';
 import { ExpandedInstance, ExpandedOptions, ExpandedTableState } from './features/Expanding';
 import { Overwrite } from './utils';
-export declare type ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = TableCore<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnOrderInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnPinningInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & HeadersInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & FiltersInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ExpandedInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+import { ColumnSizingColumn, ColumnSizingColumnDef, ColumnSizingHeader, ColumnSizingInstance, ColumnSizingOptions, ColumnSizingTableState } from './features/ColumnSizing';
+export declare type ReactTable<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = TableCore<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnOrderInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnPinningInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & HeadersInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & FiltersInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnSizingInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ExpandedInstance<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
 export declare type Renderable<TProps> = React.ReactNode | React.FunctionComponent<TProps> | React.Component<TProps>;
-export declare type Options<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityOptions & ColumnOrderOptions & ColumnPinningOptions & FiltersOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ExpandedOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
-export declare type Updater<T> = T | ((old?: T) => T);
+export declare type Options<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityOptions & ColumnOrderOptions & ColumnPinningOptions & FiltersOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ExpandedOptions<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnSizingOptions;
+export declare type Updater<T> = T | ((old: T) => T);
 export declare type OnChangeFn<T> = (updaterOrValue: Updater<T>, value: T) => void;
-export declare type TableState = VisibilityTableState & ColumnOrderTableState & ColumnPinningTableState & FiltersTableState & SortingTableState & ExpandedTableState & GroupingTableState;
+export declare type TableState = VisibilityTableState & ColumnOrderTableState & ColumnPinningTableState & FiltersTableState & SortingTableState & ExpandedTableState & GroupingTableState & ColumnSizingTableState;
 export declare type Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreRow<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityRow<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & HeadersRow<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingRow;
 export declare type RowValues = {
     [key: string]: any;
@@ -25,8 +26,8 @@ export declare type RowModel<TData, TValue, TFilterFns, TSortingFns, TAggregatio
     rowsById: Record<string, Row<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>>;
 };
 export declare type AccessorFn<TData> = (originalRow: TData, index: number) => any;
-export declare type ColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityColumnDef & ColumnPinningColumnDef & FiltersColumnDef<TFilterFns> & SortingColumnDef<TSortingFns> & GroupingColumnDef<TAggregationFns>;
-export declare type Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = ColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & CoreColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnVisibilityColumn & ColumnPinningColumn & FiltersColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+export declare type ColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & VisibilityColumnDef & ColumnPinningColumnDef & FiltersColumnDef<TFilterFns> & SortingColumnDef<TSortingFns> & GroupingColumnDef<TAggregationFns> & ColumnSizingColumnDef;
+export declare type Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = ColumnDef<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & CoreColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnVisibilityColumn & ColumnPinningColumn & FiltersColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & SortingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & GroupingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnSizingColumn<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
 export declare type Cell<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
     id: string;
     rowId: string;
@@ -37,7 +38,8 @@ export declare type Cell<TData, TValue, TFilterFns, TSortingFns, TAggregationFns
     getCellProps: PropGetter<CellProps>;
     renderCell: () => React.ReactNode;
 };
-export declare type Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
+export declare type Header<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = CoreHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> & ColumnSizingHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;
+export declare type CoreHeader<TData, TValue, TFilterFns, TSortingFns, TAggregationFns> = {
     id: string;
     depth: number;
     column: Column<TData, TValue, TFilterFns, TSortingFns, TAggregationFns>;

package/build/types/utils.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Getter, NoInfer, PropGetterValue, Renderable } from './types';
+import { Getter, NoInfer, PropGetterValue, Renderable, TableState } from './types';
 export declare type IsAny<T> = 0 extends 1 & T ? true : false;
 export declare type PartialKeys<T, K extends keyof T> = Omit<T, K> & Partial<Pick<T, K>>;
 export declare type RequiredKeys<T, K extends keyof T> = Omit<T, K> & Required<Pick<T, K>>;
@@ -8,7 +8,7 @@ export declare type DataUpdateFunction<TInput, TOutput> = (input: TInput) => TOu
 export declare type Updater<TInput, TOutput> = TOutput | DataUpdateFunction<TInput, TOutput>;
 export declare function functionalUpdate<TInput, TOutput = TInput>(updater: Updater<TInput, TOutput>, input: TInput): TOutput;
 export declare function noop(): void;
-export declare function makeStateUpdater(key: string, instance: unknown): (updater: Updater<any, any>) => void;
+export declare function makeStateUpdater(key: keyof TableState, instance: unknown): (updater: Updater<any, any>) => void;
 export declare const safeUseLayoutEffect: typeof React.useLayoutEffect;
 export declare function useMountedLayoutEffect(fn: any, deps: any[]): void;
 export declare function useGetLatest<T>(obj: T): () => T;