paginated-react-table

0.2.3 • Public • Published

paginated-react-table

A React component that returns a table with a search input, sortable columns and customizable results per page.

Installation

Install my-project with npm

  npm install paginated-react-table

Usage/Examples

import PaginatedReactTable from 'paginated-react-table'

const tableTitle = "Current Employees"
const headersArray = [
  'First Name', 
  'Last Name', 
  'Start Date', 
  'Department', 
  'Date of Birth', 
  'Street', 
  'City', 
  'State', 
  'Zip Code'
]
const dataArray = [
  {
    firstName: 'Larry', 
    lastName: 'Anderson', 
    startDate: '05/01/2020', 
    department: 'Human Resources', 
    dateOfBirth: '12/03/2001', 
    street: '4190 Woodside Circle', 
    city: 'Quincy', 
    state: 'FL', 
    zipCode: '32351'
  }, 
  {
    firstName: 'Simon', 
    lastName: 'Hornbeck', 
    startDate: '01/01/2018', 
    department: 'Legal', 
    dateOfBirth: '07/16/1999', 
    street: '3171 Cerullo Road', 
    city: 'Louisville', 
    state: 'KY', 
    zipCode: '40244'
  }, 
  { 
    firstName: 'Ashley', 
    lastName: 'Jones', 
    startDate: '09/14/2016', 
    department: 'Sales', 
    dateOfBirth: '09/03/1999', 
    street: '3931 Saints Alley', 
    city: 'Tampa', 
    state: 'FL', 
    zipCode: '33602'
  }
]

/*
N.B. : If you want to display a table with no data at initialization,
you can initialize with `dataArray = null` :
It will display 'No data available in table' inside the tbody,
and will disable the options (buttons, searchbar, select,...). 
*/

const App = () => {
  return (
    <PaginatedReactTable
      tableTitle={tableTitle}
      headersArray={headersArray}
      dataArray={dataArray}
    />
  )
}

export default App

Props

Prop Type Description
tableTitle string Required. Title of the table
headersArray array of str Required. Headers of the table
dataArray array of obj Required. Data of the table. If you don't have any data yet, initialise the array with null.

Node version

This package requires Node.js version 16.16.0 or later.

License

MIT

Package Sidebar

Install

npm i paginated-react-table

Weekly Downloads

2

Version

0.2.3

License

none

Unpacked Size

26.6 kB

Total Files

5

Last publish

Collaborators

  • a-c-morel