@anschau1992/material-data-table v1.0.5

Material Data Table

Easy and flexible Material Data Table component using React and Typescript. Compared to material-table it allows Pagination with backend page-call.

WIP Project still in development

Example Usage:

      <MaterialDataTable<[string, boolean, Date]>
        title="Meine Tabelle"

        columnTitles={["Überschrift 1", "Überschrift 2", "Überschrift 3"]}
        rows={[
          {
            cells: [
              { content: "string" },
              { content: true },
              { content: new Date() }
            ],
            props: {
              deleteButton: {
                "data-test-id": "delete-button"
              },
              confirmButton: {
                "data-test-id": "confirm-button"
              },
              editButton: {
                "data-test-id": "edit-button"
              },
              cancelButton: {
                "data-test-id": "cancel-button"
              }
            }
          }
        ]}
        pagination={{
          initialPage: 0,
          pageSizes: [2, 15],
          totalCount: 10,
          onChangePage: page => console.log(page),
          onChangePageSize: pageSize => console.log(pageSize)
        }}
        tableProps={{
          tableTitle: {
            "data-test-id": "table-title"
          },
          createButton: {
            "data-test-id": "create-button"
          }
        }
      }
        onRowCreate={r => console.log("Created:", r)}
        onRowUpdate={r => console.log("Updated:", r)}
        onRowDelete={r => console.log("Deleted:", r)}
      />