@rtdui/datatable/lib/DataTable/DataTable.d.ts

React DataTable component based on Rtdui components

import type { Row, TableOptions } from "@tanstack/react-table";
import type { ThemeBaseSize } from "@rtdui/core";
export interface Changes {
    changes: {
        added: any[];
        changed: Record<string, Record<string, any>>;
        deleted: any[];
    };
    errors: Record<string, Record<string, string>>;
}
export type Rule = (value: any, row: Row<any>, data: any[]) => string | null | undefined;
export interface DataTableProps extends React.ComponentPropsWithoutRef<"div">, Omit<TableOptions<any>, "_features" | "getCoreRowModel"> {
    className?: string;
    /** 样式槽 */
    slots?: {
        container?: string;
        toolbar?: string;
        groupDropArea?: string;
        table?: string;
    };
    /** 表行的高度
     * @default "sm"
     */
    size?: ThemeBaseSize;
    /**
     * 是否显示表头行
     * @default true
     */
    showHeader?: boolean;
    /**
     * 是否显示工具栏
     * @default true
     */
    showToolbar?: boolean;
    /**
     * 是否显示表格和单元格的边框
     * @default true
     */
    showBorder?: boolean;
    /**
     * 是否显示表格和单元格的边框大小
     * @default 1
     */
    borderWidth?: number;
    /**
     * use CSS table-layout fixed
     * @default true
     */
    fixedLayout?: boolean;
    /**
     * 表格滚动时列头固定在视图顶部
     * @default true
     */
    enableStickyHeader?: boolean;
    /**
     * 自动创建行号列, 自动行号在初始化确定, 后续的排序过滤将不受影响.
     * @default false
     */
    enableAutoRowNumber?: boolean;
    /**
     * 是否启用表格导出
     * @default false
     */
    enableExport?: boolean;
    /**
     * 过滤编辑器中用户输入生效的延迟毫秒数
     * @default 500
     */
    debouncedWait?: number;
    /**
     * 滚动虚拟化器
     * @default false
     */
    enableVirtualized?: boolean;
    /**
     * 是否允许用户拖放调整列序
     * @default true
     */
    enableColumnReorder?: boolean;
    /**
     * 启用行选择功能时, 是否启动点击行选择.
     * @default true
     */
    enableClickRowSelection?: boolean;
    /**
     * 启用多行选择功能时, 全选时的范围是所有行还是当前页内的行.
     * @default true
     */
    selectAllForAllPages?: boolean;
    /**
     * 是否启用分页
     * @default false
     */
    enablePagination?: boolean;
    /**
     * 行点击事件处理, 只针对数据行触发, 不会对分组行等附加行触发
     */
    onRowClick?: (e: React.MouseEvent<HTMLTableRowElement>, row: Row<any>) => void;
    /**
     * 行双击事件处理,, 只针对数据行触发, 不会对分组行等附加行触发
     */
    onRowDoubleClick?: (e: React.MouseEvent<HTMLTableRowElement>, row: Row<any>) => void;
    /**
     * 在编辑模式下, 字段的验证规则
     * @param row
     * @returns
     */
    validate?: Record<string, Rule>;
}
/** 属性扩展于TableOptions */
export declare const DataTable: import("react").ForwardRefExoticComponent<DataTableProps & import("react").RefAttributes<any>>;