@berlitz/table

Table

A themed wrapper around React Table https://github.com/tannerlinsley/react-table

When to use this component

When you need a table which is driven by structured data

Installation

yarn add @berlitz/table

Props

See docs for react-table for data and column structures

Prop	Type	Required	Default	Description
paginated	boolean			should this table be paginated
rowsPerPage	number		16	number of rows per page, if paginated

Usage

import Table from '@berlitz/table'
const MyApp = () => (
  <Table
    columns={[
      {
        Header: 'First Name',
        accessor: 'firstName',
      },
      {
        Header: 'Last Name',
        accessor: 'lastName',
      },
      {
        Header: 'Email',
        accessor: 'email',
      },
      {
        Header: 'Order ID',
        accessor: 'orderId',
      },
    ]}
    data={[...Array(10).keys()].map(() => ({
      firstName: faker.name.firstName(),
      lastName: faker.name.lastName(),
      email: faker.internet.email(),
      orderId: faker.random.uuid(),
    }))}
  />
)