@trove-ui/react/lib/Table/index.d.ts

A React component library for T Design UI

import { CSSProperties, HTMLAttributes, ReactNode } from 'react';
export type Align = 'left' | 'center' | 'right';
export type TableHeader<T> = {
    [K in keyof T]: {
        /**
         * 字段名
         * @description 实际显示的当前列表头信息
         */
        fieldName: ReactNode;
        /**
         * 字段属性
         * @description 它决定了当前列该根据Data中的哪个键进行值获取
         */
        fieldProp: K & string;
        /**
         * 横向排列方式
         * @description 它决定了当前列的所有数据在横向上的排列方式
         */
        align?: Align;
        /**
         * 列宽
         * @description 定义当前列的宽度
         */
        width?: CSSProperties['width'];
        /**
         * 自定义表格
         */
        render?(value: T[K], record: T, index: number): ReactNode;
    };
}[keyof T];
export interface TableProps<T> extends HTMLAttributes<HTMLDivElement> {
    bodyClassName?: string;
    bodyStyle?: CSSProperties;
    headerClassName?: string;
    headerStyle?: CSSProperties;
    wrapperClassName?: string;
    wrapperStyle?: CSSProperties;
    rowClassName?: string;
    rowStyle?: CSSProperties;
    /**
     * 是否显示边框
     */
    border?: boolean;
    /**
     * 表头数据
     */
    headers: TableHeader<T>[];
    /**
     * 数据源
     */
    data: T[];
    /**
     * 每一行的ID
     */
    rowIndex?: keyof T;
}
declare const Table: <T extends object>({ data, headers, rowIndex, style, rowStyle, className, bodyStyle, headerStyle, wrapperStyle, rowClassName, bodyClassName, headerClassName, wrapperClassName, border, ...props }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
export default Table;