mui-datatable-delight
    Preparing search index...

    Interface DataTableProps<Row>

    interface DataTableProps<Row = DefaultRow> {
        className?: string;
        columns: ColumnDefinition<Row>[];
        components?: Partial<DataTableComponents>;
        data: Row[];
        icons?: Partial<DataTableIcons>;
        options?: Partial<DataTableOptions<Row>>;
        paperProps?: PaperProps;
        ref?: Ref<HTMLDivElement>;
        textLabels?: Partial<
            {
                body: Partial<TextLabelsType["body"]>;
                filter: Partial<TextLabelsType["filter"]>;
                pagination: Partial<TextLabelsType["pagination"]>;
                selectedRows: Partial<TextLabelsType["selectedRows"]>;
                toolbar: Partial<TextLabelsType["toolbar"]>;
                viewColumns: Partial<TextLabelsType["viewColumns"]>;
            },
        >;
        title?: ReactNode;
    }

    Type Parameters

    Index

    Properties

    className? columns components? data icons? options? paperProps? ref? textLabels? title?

    Properties

    className?: string

    Pass and use className to style <DataTable /> as desired

    columns: ColumnDefinition<Row>[]

    Columns used to describe table

    components?: Partial<DataTableComponents>

    Override <DataTable /> components

    data: Row[]

    Data used to populate <DataTable />

     const data = [
         ['Gabby George', 'Business Analyst', 'Minneapolis'],
         ['Aiden Lloyd', "Business Consultant", 'Dallas'],
         ['Jaden Collins', 'Attorney', 'Santa Ana'],
         // ....
     ];
    icons?: Partial<DataTableIcons>

    Override <DataTable /> icons

    options?: Partial<DataTableOptions<Row>>
    paperProps?: PaperProps

    Override Material UI's <Paper /> props that wrap the <DataTable />

    ref?: Ref<HTMLDivElement>
    textLabels?: Partial<
        {
            body: Partial<TextLabelsType["body"]>;
            filter: Partial<TextLabelsType["filter"]>;
            pagination: Partial<TextLabelsType["pagination"]>;
            selectedRows: Partial<TextLabelsType["selectedRows"]>;
            toolbar: Partial<TextLabelsType["toolbar"]>;
            viewColumns: Partial<TextLabelsType["viewColumns"]>;
        },
    >

    User provided labels to localize text.

    Localization Docs

    title?: ReactNode

    Title of the table

    Settings

    Member Visibility

    On This Page

    Properties