smart-react-table v1.0.3

• What is it
• How to install
• How to use

What is it

This is a study project.

How to install

# npm
npm install --save smart-react-table

How to use

Import Table component

import {Table} from "smart-react-table"

Examples below use the following lines array

const lines = [
    {
        id: 1, data: { name: "Example", date: new Date() }
    },
    {
        id: 2, data: { name: "Example 2", date: new Date() }
    },
    {
        id: 3, data: { name: "Example 3", date: new Date() }
    },
]

Automatic version

// Automatically get all available columns from given lines
<Table lines={lines} />

Specify columns to display

// Only display specified columns, accepting dot notation
<Table lines={lines} columns={[
    "id",
    "data.name",
    "data.date",
]} />

// You can also rename columns by giving a original/renamed object
<Table lines={lines} columns={{
    "id": "#",
    "data.name": "Name",
    "data.date": "Date",
}} />

Lines per page settings

// Choose wich lines per page options are available
// (default to [3, 5, 10])
<Table lines={lines} linesPerPageOptions={[10, 20, 50, 100]} />

// Choose default lines per page
// (needs to be one of linesPerPageOptions item)
// (default to linesPerPageOptions array middle value
<Table lines={lines} linesPerPageOptions={[10, 20, 50, 100]} />

// Disable lines per page dropdown by giving component only 1 option
<Table lines={lines} linesPerPageOptions={[10]} />

Please check the storybook on the github pages to see more examples.