ivt/dist/data-table/index.d.ts

Ivt Components Library

import * as react_jsx_runtime from 'react/jsx-runtime';
import { Table, ColumnDef, Row } from '@tanstack/react-table';
import React__default from 'react';
import { DragStartEvent, DragEndEvent } from '@dnd-kit/core';

interface DataTableViewOptionsProps$2<TData, TValue> {
    table: Table<TData>;
    columns: ColumnDef<TData, TValue>[];
    setQueryParams?: React__default.Dispatch<React__default.SetStateAction<ListParams$1>>;
    isLoadingTable?: boolean;
    dataLabel: string;
    actionColumns?: string[];
    messageEmpty?: React__default.ReactNode;
    dividingColumnKey?: string[];
    loadingContent?: React__default.ReactNode;
    pageSizeOptions?: number[];
    className?: string;
    isScrollable?: boolean;
    scrollMaxHeightClass?: string;
    fixedHeader?: boolean;
    showPagination?: boolean;
    renderTooltip?: (row: Row<TData>, rowContent: React__default.ReactNode) => React__default.ReactNode;
    renderSubComponent?: (props: {
        row: Row<TData>;
    }) => React__default.ReactNode;
    infoExtraLabel?: React__default.ReactNode;
    showDataLabel?: boolean;
    footerAction?: React__default.ReactNode;
    maxVisualRows?: number;
}
interface ListParams$1 {
    [propName: string]: string | string[];
}
declare const DataTableMainFrame: <TData, TValue>({ table, columns, isLoadingTable, loadingContent, setQueryParams, dataLabel, actionColumns, messageEmpty, dividingColumnKey, pageSizeOptions, className, scrollMaxHeightClass, isScrollable, fixedHeader, showPagination, showDataLabel, renderTooltip, renderSubComponent, infoExtraLabel, footerAction, maxVisualRows, }: DataTableViewOptionsProps$2<TData, TValue>) => react_jsx_runtime.JSX.Element;

type TreeData<T> = T & {
    id: string | number;
    subRows?: TreeData<T>[];
};

interface DataTableViewOptionsProps$1<TData, TValue> {
    table: Table<TData>;
    columns: ColumnDef<TData, TValue>[];
    setQueryParams?: React__default.Dispatch<React__default.SetStateAction<ListParams>>;
    isLoadingTable?: boolean;
    dataLabel: string;
    actionColumns?: string[];
    data: TData[];
    onDataChange?: (newData: TData[]) => void;
    messageEmpty?: React__default.ReactNode;
    rowKey: keyof TData | Array<keyof TData> | ((row: TData) => string | number);
    dividingColumnKey?: string[];
    loadingContent?: React__default.ReactNode;
    pageSizeOptions?: number[];
    className?: string;
    isScrollable?: boolean;
    scrollMaxHeightClass?: string;
    fixedHeader?: boolean;
    showPagination?: boolean;
    renderTooltip?: (row: Row<TData>, rowContent: React__default.ReactNode) => React__default.ReactNode;
    infoExtraLabel?: React__default.ReactNode;
    showDataLabel?: boolean;
    footerAction?: React__default.ReactNode;
    sortableValue?: TreeData<TData>[];
    sortableOnValueChange?: (items: TreeData<TData>[]) => void;
    sortableOnDragStart?: (event: DragStartEvent) => void;
    sortableOnDragEnd?: (event: DragEndEvent) => void;
    maxVisualRows?: number;
}
type RowData = {
    [key: string]: any;
};
interface ListParams {
    [propName: string]: string | string[];
}
declare const DataTableMainFrameSortable: <TData extends RowData, TValue>({ table, columns, isLoadingTable, loadingContent, setQueryParams, dataLabel, actionColumns, data, messageEmpty, onDataChange, rowKey, dividingColumnKey, pageSizeOptions, className, scrollMaxHeightClass, isScrollable, fixedHeader, showPagination, showDataLabel, renderTooltip, infoExtraLabel, footerAction, sortableValue: propValue, sortableOnValueChange: propOnValueChange, sortableOnDragStart: propOnDragStart, sortableOnDragEnd: propOnDragEnd, maxVisualRows, }: DataTableViewOptionsProps$1<TData, TValue>) => react_jsx_runtime.JSX.Element;

interface DataTablePaginationProps<TData> {
    table: Table<TData>;
    pageSizeOptions?: number[];
    dataLabel?: string;
    infoExtraLabel?: React__default.ReactNode;
    showPaginationControls?: boolean;
    showDataLabel?: boolean;
    footerAction?: React__default.ReactNode;
    maxVisualRows?: number;
}
declare function DataTablePagination<TData>({ table, pageSizeOptions, dataLabel, infoExtraLabel, showPaginationControls, showDataLabel, footerAction, maxVisualRows, }: DataTablePaginationProps<TData>): react_jsx_runtime.JSX.Element | null;

declare const DataTablePaginationSkeleton: React__default.FC;

interface DataTableRowSkeletonProps extends React__default.HTMLAttributes<HTMLDivElement> {
    columnCount: number;
    rowCount?: number;
    cellWidths?: string[];
    shrinkZero?: boolean;
}
declare function DataTableRowSkeleton(props: DataTableRowSkeletonProps): react_jsx_runtime.JSX.Element;

interface DataTableSearchProps<TData> {
    table: Table<TData>;
    keySearch: string;
    placeholder: string;
}
declare function DataTableSearch<TData>({ table, keySearch, placeholder, }: DataTableSearchProps<TData>): react_jsx_runtime.JSX.Element;

interface DataTableSkeletonProps extends React__default.HTMLAttributes<HTMLDivElement> {
    /**
     * The number of columns in the table.
     * @type number
     */
    columnCount: number;
    /**
     * The number of rows in the table.
     * @default 10
     * @type number | undefined
     */
    rowCount?: number;
    /**
     * The number of searchable columns in the table.
     * @default 0
     * @type number | undefined
     */
    searchableColumnCount?: number;
    /**
     * The number of filterable columns in the table.
     * @default 0
     * @type number | undefined
     */
    filterableColumnCount?: number;
    /**
     * Flag to show the table view options.
     * @default undefined
     * @type boolean | undefined
     */
    showViewOptions?: boolean;
    /**
     * The width of each cell in the table.
     * The length of the array should be equal to the columnCount.
     * Any valid CSS width value is accepted.
     * @default ["auto"]
     * @type string[] | undefined
     */
    cellWidths?: string[];
    /**
     * Flag to show the pagination bar.
     * @default true
     * @type boolean | undefined
     */
    withPagination?: boolean;
    /**
     * Flag to prevent the table cells from shrinking.
     * @default false
     * @type boolean | undefined
     */
    shrinkZero?: boolean;
}
declare function DataTableSkeleton(props: DataTableSkeletonProps): react_jsx_runtime.JSX.Element;

interface DataTableStatusProps<TData, TEnum> {
    table: Table<TData>;
    uniqueStatusValues: TEnum[];
    renderStatusMessage(status: TEnum): string;
    className?: string;
}
declare function DataTableStatus<TData, TEnum>({ table, uniqueStatusValues, renderStatusMessage, className, }: DataTableStatusProps<TData, TEnum>): react_jsx_runtime.JSX.Element;

interface DataTableViewOptionsProps<TData> {
    table: Table<TData>;
    transformColumnName?: (id: string) => string;
    disabled?: boolean;
}
declare function DataTableViewOptions<TData>({ table, transformColumnName, disabled, }: DataTableViewOptionsProps<TData>): react_jsx_runtime.JSX.Element;

export { DataTableMainFrame, DataTableMainFrameSortable, DataTablePagination, DataTablePaginationSkeleton, DataTableRowSkeleton, DataTableSearch, DataTableSkeleton, DataTableStatus, DataTableViewOptions };