1.8.52 years ago4 years agoMinified + gzip package size for @gemcook/table in KB



npm version

React Table Component.

Online Demo


npm install --save @gemcook/table


yarn add @gemcook/table



Import @gemcook/table/lib/styles/index.scss to your SCSS.

@import '~@gemcook/table/lib/styles/index';

Local Pagination

Use 'makeLocalActive' to generate active.

Remote Pagination




  • There are six required items
  • For Remote Pagination, there are 8 required items
Parameter Type Required Default Description
active [any] true undefined Data displayed in the table
columns ReactElement true undefined Table columns
current number true undefined Current page number
totalCount number true undefined Maximum number of all data
totalPages number true undefined Maximum number of pages (use pagination)
updateCurrent (current: number) => void true undefined -
loading boolean false (Required for remote pagination) false -
disabled boolean false (Required for remote pagination) false Set 'pagination' to disabled
sortState {key: string, order: enum} false undefined Enum: asc desc
updateSortState (sortState: object) => void flase undefined -
pageSize number false 10 Number of rows in table
updatePageSize (current: number, pageSize: number) => void false undefined -
noDataMessage string false 'Data does not exist' -
outline boolean false true Whether to display the outer frame
showPagination boolean false true Whether to display pagination-
paginationPosition string false right Position of placement of pagination
showSizeChanger boolean false false -
scrollTop boolean false false -

Override Styles

$table__main-color: #fa6681 !default;
$table__link-color: #fa6681 !default;
$table__bg-color: white !default;
$table__sort-default-color: #808b97 !default;
$table__thead-border-color: #e9ecef !default;
$table__th-text-color: #7d7d7d !default;
$table__td-text-color: #7d7d7d !default;
$table__nodata-text-color: #404b69 !default;


pagination integration

Confirm the API of pagination from this link.


@gemcook/table is released under the MIT license.

If you find any bugs or have a feature request, please open an issue on github!

The npm package download data comes from npm's download counts api and package details come from npms.io.