@gravity-ui/react-data-table 1.0.3

package/build/esm/lib/DataTable.d.ts

@@ -0,0 +1,455 @@
+import PropTypes from 'prop-types';
+import * as React from 'react';
+import ReactList from 'react-list';
+import './DataTable.scss';
+import { HeightObserver } from './height-observer';
+import { Column, DataTableProps, HeadPosition, OrderType, Settings, SortedDataItem } from './types';
+import { SlimColumn, getSortedData } from './util';
+interface CustomIcons {
+    ICON_ASC: React.ReactNode;
+    ICON_DESC: React.ReactNode;
+}
+interface TableHeadProps<T> {
+    dataColumns: DataColumns<T>;
+    headColumns: HeadColumns<T>;
+    displayIndices?: boolean;
+    onSort?: TableProps<T>['onSort'];
+    onColumnsUpdated?: (widths: number[]) => void;
+    renderedDataRows?: React.ReactNode;
+    onDataRowsHeightChange?: StickyHeadProps<T>['onDataRowsHeightChange'];
+}
+declare class TableHead<T> extends React.Component<TableHeadProps<T>> {
+    static propTypes: {
+        headColumns: PropTypes.Validator<any[]>;
+        dataColumns: PropTypes.Validator<any[]>;
+        displayIndices: PropTypes.Validator<boolean>;
+        onSort: PropTypes.Requireable<(...args: any[]) => any>;
+        onColumnsUpdated: PropTypes.Requireable<(...args: any[]) => any>;
+        renderedDataRows: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    };
+    _dataRowsRef: HTMLTableSectionElement | null;
+    dataRowsHeightObserver?: HeightObserver;
+    renderedColumns: HTMLTableHeaderCellElement[];
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    _calculateColumnsWidth(): void;
+    onSort(column?: SlimColumn, multisort?: boolean): void;
+    _getOnSortClick(column: HeadCellColumn<T>): ((event: React.MouseEvent<HTMLTableHeaderCellElement>) => void) | undefined;
+    renderHeadCell: (headCell: HeadCellsType<T>) => JSX.Element;
+    renderHeadLevel: (row: HeadColumnsItem<T>, rowIndex: number) => JSX.Element;
+    dataRowsRef: (ref: HTMLTableSectionElement) => void;
+    _getColumnRef: (index: number) => (node: HTMLTableHeaderCellElement) => void;
+}
+interface StickyHeadProps<T> {
+    dataColumns: DataColumns<T>;
+    headColumns: HeadColumns<T>;
+    mode: HeadPositionInner;
+    displayIndices?: Settings['displayIndices'];
+    onSort?: TableProps<T>['onSort'];
+    top: number;
+    onDataRowsHeightChange: (height: number) => void;
+}
+interface StickyHeadState {
+    widths?: number[];
+    right?: number;
+    style?: React.CSSProperties;
+}
+declare class StickyHead<T> extends React.Component<StickyHeadProps<T>, StickyHeadState> {
+    static propTypes: {
+        mode: PropTypes.Requireable<string>;
+        top: PropTypes.Requireable<number>;
+        renderedDataRows: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+    };
+    static defaultProps: {
+        top: number;
+    };
+    static getDerivedStateFromProps<T>(props: StickyHeadProps<T>, state: StickyHeadState): {
+        style: {
+            top: number;
+        };
+    } | null;
+    state: StickyHeadState;
+    heightObserver?: HeightObserver;
+    _node?: HTMLElement;
+    render(): JSX.Element;
+    setScrollLeft(scrollLeft: number): void;
+    setRightPosition(value: number): void;
+    renderHeader(props: Omit<StickyHeadProps<T>, 'mode' | 'top'>): JSX.Element;
+    onDataRowsHeightChange: (height: number) => void;
+    updateWidths(newWidths?: number[]): void;
+    _nodeRef: (node: HTMLDivElement) => void;
+}
+interface StickyFooterProps<T> {
+    dataColumns: DataColumns<T>;
+    renderedRows: React.ReactNode;
+    mode: StickyHeadProps<T>['mode'];
+    bottom?: number;
+    onMovingHeightChange: (height: number) => void;
+}
+declare type StickyFooterState = StickyHeadState;
+declare class StickyFooter<T> extends React.PureComponent<StickyFooterProps<T>, StickyFooterState> {
+    static defaultProps: {
+        bottom: number;
+    };
+    static getDerivedStateFromProps<T>(props: StickyFooterProps<T>, state: StickyFooterState): {
+        style: {
+            bottom: number;
+        };
+    } | null;
+    state: StickyFooterState;
+    heightObserver?: HeightObserver;
+    _nodeFixed: HTMLElement | null;
+    _nodeMoving: HTMLElement | null;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element | null;
+    _nodeFixedRef: (node: HTMLDivElement) => void;
+    _nodeMovingRef: (node: HTMLDivElement) => void;
+    setScrollLeft(scrollLeft: number): void;
+    setRightPosition(value: number): void;
+    renderFooter(renderedRows: React.ReactNode): JSX.Element;
+    updateWidths(newWidths?: number[]): void;
+}
+interface TableProps<T> {
+    className?: string;
+    settings: DataTableViewState<T>['settings'];
+    headerData: DataTableProps<T>['headerData'];
+    data: SortedDataItem<T>[];
+    footerData: DataTableProps<T>['footerData'];
+    columns: TableColumns<T>;
+    emptyDataMessage?: string;
+    onRowClick: DataTableProps<T>['onRowClick'];
+    rowClassName: DataTableProps<T>['rowClassName'];
+    rowKey: (row: T, index: number) => string | number;
+    startIndex: DataTableProps<T>['startIndex'];
+    onSort: DataTableView<T>['onSort'];
+    renderEmptyRow: unknown;
+    nullBeforeNumbers?: boolean;
+}
+interface TableState {
+    movingFooterStyle?: {
+        marginBottom: number;
+    };
+    movingHeaderStyle?: {
+        marginTop: number;
+    };
+}
+declare class Table<T> extends React.PureComponent<TableProps<T>, TableState> {
+    static propTypes: {
+        className: PropTypes.Requireable<string>;
+        settings: PropTypes.Requireable<object>;
+        refs: PropTypes.Requireable<object>;
+        headerData: PropTypes.Requireable<any[]>;
+        data: PropTypes.Requireable<any[]>;
+        footerData: PropTypes.Requireable<any[]>;
+        columns: PropTypes.Requireable<object>;
+        emptyDataMessage: PropTypes.Requireable<string>;
+        onRowClick: PropTypes.Requireable<(...args: any[]) => any>;
+        rowClassName: PropTypes.Requireable<(...args: any[]) => any>;
+        rowKey: PropTypes.Requireable<(...args: any[]) => any>;
+        startIndex: PropTypes.Requireable<number>;
+        onSort: PropTypes.Requireable<(...args: any[]) => any>;
+        renderEmptyRow: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    state: TableState;
+    _onWindowResize?: () => void;
+    _body?: HTMLDivElement;
+    _box?: HTMLDivElement;
+    _head?: TableHead<T>;
+    _stickyHead?: StickyHead<T>;
+    _stickyFooter?: StickyFooter<T>;
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    _refBody: (node: HTMLDivElement) => void;
+    _refBox: (node: HTMLDivElement) => void;
+    _refHead: (node: TableHead<T>) => void;
+    _refStickyHead: (node: StickyHead<T>) => void;
+    _refStickyFooter: (node: StickyFooter<T>) => void;
+    _onBoxScroll: () => void;
+    _updateBoxConstraints(): void;
+    _onColumnsUpdated: (widths: number[]) => void;
+    syncHeadWidths(): void;
+    _getEmptyRow(): any;
+    renderHead(): JSX.Element;
+    renderStickyHead(): JSX.Element;
+    renderStickyFooter(): JSX.Element;
+    onMovingHeaderDataRowsHeightChange: (height: number) => void;
+    onMovingFooterHeightChange: (height: number) => void;
+    renderRow: (vIndex: number) => JSX.Element;
+    renderFooterRow: (rowData: T, index: number) => JSX.Element;
+    renderHeaderRow: (rowData: T, index: number) => JSX.Element;
+    renderRowImpl: (row: T, index: number, { onRowClick, odd, span, footer, headerData }?: RenderRowImplOptions<T>) => JSX.Element;
+    renderTable: (items: React.ReactNode[], ref?: any) => JSX.Element;
+    renderTableDynamic(): JSX.Element;
+    renderTableSimple(): JSX.Element;
+    renderHeaderRows(): JSX.Element[] | undefined;
+    renderFooterRows(): JSX.Element[] | undefined;
+    getStickyFooterMode(): HeadPositionInner;
+}
+interface RenderRowImplOptions<T> {
+    onRowClick?: DataTableProps<T>['onRowClick'];
+    odd?: boolean;
+    span?: SortedDataItem<T>['span'];
+    footer?: boolean;
+    headerData?: boolean;
+}
+interface CellProps<T> {
+    column: Column<T>;
+    value?: any;
+    row: T;
+    index: number;
+    footer?: boolean;
+    headerData?: boolean;
+}
+declare type InternalProps<T> = DataTableProps<T> & typeof DataTableView.defaultProps;
+interface DataTableViewState<T> extends SortOrderWithSortColumns {
+    indexColumn?: Column<T>;
+    settings: ReturnType<typeof DataTableView.calculateSettings>;
+}
+declare type HeadPositionInner = HeadPosition | false;
+declare class DataTableView<T> extends React.Component<DataTableProps<T>, DataTableViewState<T>> {
+    static propTypes: {
+        columns: PropTypes.Validator<any[]>;
+        headerData: PropTypes.Requireable<any[]>;
+        data: PropTypes.Validator<any[]>;
+        footerData: PropTypes.Requireable<any[]>;
+        startIndex: PropTypes.Requireable<number>;
+        emptyDataMessage: PropTypes.Requireable<string>;
+        renderEmptyRow: PropTypes.Requireable<(...args: any[]) => any>;
+        rowClassName: PropTypes.Requireable<(...args: any[]) => any>;
+        rowKey: PropTypes.Requireable<(...args: any[]) => any>;
+        visibleRowIndex: PropTypes.Requireable<(...args: any[]) => any>;
+        initialSortOrder: PropTypes.Requireable<PropTypes.InferProps<{
+            columnId: PropTypes.Requireable<string>;
+            order: PropTypes.Requireable<number>;
+        }> | (PropTypes.InferProps<{
+            columnId: PropTypes.Requireable<string>;
+            order: PropTypes.Requireable<number>;
+        }> | null | undefined)[]>;
+        sortOrder: PropTypes.Requireable<PropTypes.InferProps<{
+            columnId: PropTypes.Requireable<string>;
+            order: PropTypes.Requireable<number>;
+        }> | (PropTypes.InferProps<{
+            columnId: PropTypes.Requireable<string>;
+            order: PropTypes.Requireable<number>;
+        }> | null | undefined)[]>;
+        settings: PropTypes.Requireable<PropTypes.InferProps<{
+            displayIndices: PropTypes.Requireable<boolean>;
+            dynamicRender: PropTypes.Requireable<boolean>;
+            dynamicRenderType: PropTypes.Requireable<string>;
+            dynamicRenderUseStaticSize: PropTypes.Requireable<boolean>;
+            dynamicRenderThreshold: PropTypes.Requireable<number>;
+            dynamicRenderMinSize: PropTypes.Requireable<number>;
+            dynamicRenderScrollParentGetter: PropTypes.Requireable<(...args: any[]) => any>;
+            dynamicRenderScrollParentViewportSizeGetter: PropTypes.Requireable<(...args: any[]) => any>;
+            dynamicItemSizeEstimator: PropTypes.Requireable<(...args: any[]) => any>;
+            dynamicItemSizeGetter: PropTypes.Requireable<(...args: any[]) => any>;
+            stickyHead: PropTypes.Requireable<string | boolean>;
+            stickyTop: PropTypes.Requireable<string | number>;
+            sortable: PropTypes.Requireable<boolean>;
+            externalSort: PropTypes.Requireable<boolean>;
+            highlightRows: PropTypes.Requireable<boolean>;
+            stripedRows: PropTypes.Requireable<boolean>;
+            headerMod: PropTypes.Requireable<string>;
+            defaultOrder: PropTypes.Requireable<number>;
+            syncHeadOnResize: PropTypes.Requireable<boolean>;
+        }>>;
+        theme: PropTypes.Requireable<string>;
+        onSort: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    static defaultProps: {
+        startIndex: number;
+        emptyDataMessage: string;
+        settings: {
+            displayIndices: boolean;
+            dynamicRenderMinSize: number;
+            stickyHead: HeadPositionInner;
+            stickyFooter: HeadPositionInner;
+            sortable: boolean;
+            externalSort: boolean;
+            defaultOrder: OrderType;
+        };
+        rowKey: (row: any, index: number) => any;
+        initialSortOrder: {};
+        initialSortColumns: never[];
+        theme: string;
+    };
+    static getSortedData: typeof getSortedData;
+    static normalizeStickyHead(stickyHead?: Settings['stickyHead'] | false): HeadPositionInner;
+    static calculateSettings(nextSettings: Settings): {
+        stickyHead: HeadPositionInner;
+        stickyFooter: HeadPositionInner;
+        displayIndices: boolean;
+        stickyTop?: number | "auto" | undefined;
+        syncHeadOnResize?: boolean | undefined;
+        stickyBottom?: number | "auto" | undefined;
+        dynamicRender?: boolean | undefined;
+        dynamicInnerRef?: React.Ref<ReactList> | undefined;
+        dynamicRenderType?: "simple" | "uniform" | "variable" | undefined;
+        dynamicItemSizeEstimator?: ((index: number, cache: {}) => number) | undefined;
+        dynamicItemSizeGetter?: ((index: number) => number) | undefined;
+        dynamicRenderMinSize: number;
+        dynamicRenderUseStaticSize?: boolean | undefined;
+        dynamicRenderThreshold?: number | undefined;
+        dynamicRenderScrollParentGetter?: (() => JSX.Element) | undefined;
+        dynamicRenderScrollParentViewportSizeGetter?: (() => number) | undefined;
+        sortable: boolean;
+        externalSort: boolean;
+        disableSortReset?: boolean | undefined;
+        defaultOrder: OrderType;
+        highlightRows?: boolean | undefined;
+        stripedRows?: boolean | undefined;
+        headerMod?: "pre" | "multiline" | undefined;
+    };
+    static getIndexColumn<T extends HasHeaderFooterIndex>({ startIndex, data, visibleRowIndex, }: InternalProps<T>): Column<T>;
+    static getDerivedStateFromProps<T>(nextProps: InternalProps<T>): {
+        sortOrder?: NameToOrderTypeMap | undefined;
+        sortColumns?: string[] | undefined;
+        settings: {
+            stickyHead: HeadPositionInner;
+            stickyFooter: HeadPositionInner;
+            displayIndices: boolean;
+            stickyTop?: number | "auto" | undefined;
+            syncHeadOnResize?: boolean | undefined;
+            stickyBottom?: number | "auto" | undefined;
+            dynamicRender?: boolean | undefined;
+            dynamicInnerRef?: React.Ref<ReactList> | undefined;
+            dynamicRenderType?: "simple" | "uniform" | "variable" | undefined;
+            dynamicItemSizeEstimator?: ((index: number, cache: {}) => number) | undefined;
+            dynamicItemSizeGetter?: ((index: number) => number) | undefined;
+            dynamicRenderMinSize: number;
+            dynamicRenderUseStaticSize?: boolean | undefined;
+            dynamicRenderThreshold?: number | undefined;
+            dynamicRenderScrollParentGetter?: (() => JSX.Element) | undefined;
+            dynamicRenderScrollParentViewportSizeGetter?: (() => number) | undefined;
+            sortable: boolean;
+            externalSort: boolean;
+            disableSortReset?: boolean | undefined;
+            defaultOrder: OrderType;
+            highlightRows?: boolean | undefined;
+            stripedRows?: boolean | undefined;
+            headerMod?: "pre" | "multiline" | undefined;
+        };
+        indexColumn: false | Column<T>;
+    };
+    state: DataTableViewState<T>;
+    table?: Table<T>;
+    render(): JSX.Element;
+    _tableRef: (node: Table<T>) => void;
+    renderMemoizedCell: ({ column, value, row, index, footer, headerData }: CellProps<T>) => JSX.Element;
+    getColumn: (column: Column<T>, columnIndex: number) => {
+        sortable: boolean;
+        _className: string;
+        _getValue: (row: T) => any;
+        _getTitle: (row: T) => any;
+        _getSortValue: (row: T) => any;
+        _renderValue: (({ value, row, index, footer, headerData }: Omit<CellProps<T>, 'column'>) => JSX.Element) | (({ value }: Partial<CellProps<T>>) => any);
+        _getOnClick: ((data: {
+            row: T;
+            index: number;
+            footer?: boolean;
+            headerData?: boolean;
+        }) => () => void) | (() => undefined);
+        customStyle: ((props: import("./types").CustomStyleParams<T>) => React.CSSProperties) | (() => undefined);
+        group: boolean | undefined;
+        autogroup: boolean;
+        sortOrder: OrderType;
+        sortIndex: number | undefined;
+        name: string;
+        header?: React.ReactNode;
+        headerTitle?: string | undefined;
+        className?: string | undefined;
+        width?: string | number | undefined;
+        align?: import("./types").AlignType | undefined;
+        accessor?: string | ((row: T) => any) | undefined;
+        title?: string | ((row: T) => string) | undefined;
+        render?: ((props: {
+            value?: unknown;
+            row: T;
+            index: number;
+            footer?: boolean | undefined;
+            headerData?: boolean | undefined;
+        }) => React.ReactNode) | undefined;
+        onClick?: ((data: {
+            row: T;
+            index: number;
+            footer?: boolean | undefined;
+            headerData?: boolean | undefined;
+        }, column: Column<T>) => void) | undefined;
+        defaultOrder: OrderType;
+        sortAccessor?: string | ((row: T) => any) | undefined;
+        sortAscending?: import("./types").Comparator<T> | undefined;
+        sub?: Column<T>[] | undefined;
+        index: number;
+        columnIndex: number;
+        dataColumn: boolean;
+    };
+    getComplexColumns(columns: DataTableProps<T>['columns']): {
+        headColumns: HeadColumns<T>;
+        dataColumns: DataColumns<T>;
+    };
+    isSortEnabled: () => boolean;
+    onSort: (column?: SlimColumn | undefined, multisort?: boolean | undefined) => void;
+    resize(): void;
+}
+export declare type ColumnExtended<T> = ReturnType<DataTableView<T>['getColumn']> & {
+    headerTitle?: string;
+};
+declare type HeadCellColumn<T> = ColumnExtended<T> | (Column<T> & {
+    index?: number;
+    columnIndex?: number;
+    headerTitle?: string;
+    dataColumn?: boolean;
+});
+declare type HeadCellsType<T> = {
+    column: HeadCellColumn<T>;
+    itemLevel: number;
+    colSpan: number;
+    rowSpan: number;
+};
+declare type HeadColumnsItem<T> = HeadCellsType<T>[];
+declare type HeadColumns<T> = HeadColumnsItem<T>[];
+declare type DataColumns<T> = ColumnExtended<T>[];
+interface TableColumns<T> {
+    headColumns: HeadColumns<T>;
+    dataColumns: DataColumns<T>;
+}
+export interface SortOrderWithSortColumns {
+    sortOrder: NameToOrderTypeMap;
+    sortColumns: string[];
+}
+export declare type NameToOrderTypeMap = {
+    [colName: string]: OrderType;
+};
+interface State {
+    error?: any;
+}
+interface HasHeaderFooterIndex {
+    footerIndex?: number;
+    headerIndex?: number;
+    id?: number;
+}
+export default class DataTable<T> extends React.PureComponent<DataTableProps<T>, State> {
+    static readonly FIXED = "fixed";
+    static readonly MOVING = "moving";
+    static readonly ASCENDING = 1;
+    static readonly DESCENDING = -1;
+    static readonly LEFT = "left";
+    static readonly CENTER = "center";
+    static readonly RIGHT = "right";
+    static setCustomIcons(customIcons: Partial<CustomIcons>): void;
+    table?: DataTableView<T>;
+    state: State;
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Readonly<DataTableProps<T>>): void;
+    componentDidCatch(error: unknown): void;
+    render(): JSX.Element;
+    _tableRef: (node: DataTableView<T>) => void;
+    resize(): void;
+}
+export {};