react-box-tools/dist/table.d.ts

Box tools react components, utils and hooks

import { Context } from 'react';
import { ForwardRefExoticComponent } from 'react';
import { HTMLAttributes } from 'react';
import { JSX } from 'react';
import { JSX as JSX_2 } from 'react/jsx-runtime';
import { ReactElement } from 'react';
import { ReactNode } from 'react';
import { RefAttributes } from 'react';

export declare const ColumnFilter: ({ name, children }: ColumnFilterProps) => JSX_2.Element;

export declare type ColumnFilterProps = {
    name: string;
    children?: (args: {
        filterValue: (value: string) => void;
    }) => JSX.Element;
};

export declare type DataTable<T> = {
    dataGrid: TableRow<T>[];
    selectedRows: Set<string | number>;
    sort: (column: keyof T) => void;
    filterValue: (column: keyof T, value: string) => void;
    selectAll: () => void;
    selectRow: (row: TableRow<T>) => void;
    columnKeys: (keyof T)[];
    sortedColumn: keyof T | null;
    sortOrder: 'asc' | 'desc';
    filters: {
        [key in keyof T]?: string | undefined;
    };
    groups: TableColumnGroup<T>[];
    columns: {
        [K in keyof T]: TableColumn;
    };
};

export declare const Table: ForwardRefExoticComponent<TableProps<any> & RefAttributes<TableRef<any>>>;

export declare function TableBody<T>({ data, children, className }: TableBodyProps<T>): JSX_2.Element;

export declare type TableBodyProps<T> = {
    data?: Array<TableRow<T>>;
    children?: ReactElement<HTMLAttributes<HTMLTableRowElement>> | Array<ReactElement<HTMLAttributes<HTMLTableRowElement>>>;
    className?: string;
};

export declare type TableCell = {
    value: ReactNode | string;
};

export declare type TableColumn = {
    text: string;
    control?: ReactNode;
    shortable?: boolean;
};

export declare type TableColumnGroup<T> = {
    value: ReactNode | string;
    columns: Array<keyof T>;
};

export declare const TableContext: Context<TableContextProps<any>>;

export declare type TableContextProps<T> = {
    columnKeys: string[];
    filters: {
        [key in keyof T]?: string;
    };
    filterValue: (column: keyof T, value: string) => void;
    columns: {
        [key in keyof T]: TableColumn;
    };
    groups: Array<TableColumnGroup<T>>;
    dataGrid: Array<TableRow<T>>;
    selectedRows: Set<number | string>;
    selectAll: () => void;
    sortedColumn: keyof T | null;
    sort: (column: keyof T) => void;
    sortOrder: 'asc' | 'desc';
    selectRow: (row: TableRow<T>) => void;
    selection?: boolean;
};

export declare function TableFoot<T>({ data, children, className }: TableFootProps<T>): JSX_2.Element;

export declare type TableFootProps<T> = {
    data?: TableRow<T>;
    children?: ReactElement<HTMLAttributes<HTMLTableRowElement>> | Array<ReactElement<HTMLAttributes<HTMLTableRowElement>>>;
    className?: string;
};

export declare const TableHead: ({ children, className }: TableHeadProps) => JSX_2.Element;

export declare type TableHeadProps = {
    children?: ReactElement<HTMLAttributes<HTMLTableRowElement>> | Array<ReactElement<HTMLAttributes<HTMLTableRowElement>>>;
    className?: string;
};

export declare type TableProps<T> = {
    columns: {
        [K in keyof T]: TableColumn;
    };
    columnGroup?: {
        [K in keyof any]: TableColumnGroup<T>;
    };
    data: Array<TableRow<T>>;
    children: (args: DataTable<T>) => JSX.Element;
    selection?: boolean;
    className?: string;
};

export declare type TableRef<T> = {
    dataGrid: TableRow<T>[];
};

export declare const tableRefInit: TableRef<any>;

export declare type TableRow<T> = {
    [K in keyof T]: TableCell;
} & {
    id: {
        value: number | string;
        selected?: boolean;
    };
};

export declare function useTable<T>({ columns, columnGroup, data }: UseTableProps<T>): DataTable<T>;

export declare type UseTableProps<T> = {
    columns: {
        [K in keyof T]: TableColumn;
    };
    columnGroup?: {
        [K in keyof any]: TableColumnGroup<T>;
    };
    data: Array<TableRow<T>>;
};

export { }