Skip to content

ngduc/react-tabulator

master
Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?
Code

Latest commit

 

Git stats

Files

Permalink
Failed to load latest commit information.
Type
Name
Latest commit message
Commit time
September 4, 2023 13:23
November 16, 2021 07:32
January 20, 2022 23:34
src
January 25, 2022 12:13
October 12, 2018 17:48
September 4, 2023 13:32
October 10, 2018 18:39
November 16, 2021 07:32
November 20, 2018 22:20
November 16, 2021 07:32
October 10, 2018 18:39

react-tabulator

React Tabulator is based on Tabulator - a JS table library with many advanced features. Link.

🌟 Features

Tabulator's features:

  Filters      Sorting      Formatting    Grouping      Ajax      Editing    Virtualization
  Pagination   Themes       A11y          I18n          Layouts   Frozen Cols/Rows
  Key Binding  Responsive   Persisting    History       Calc      Validation
  Clipboard    Tree Layout  Nested Tables

Plus more features:

  • React.
  • Simple syntax; Import css, themes.
  • Typescript, Tslint.
  • Jest-puppeteer for testing.
  • React Cell Editors: DateEditor, MultiSelectEditor, etc.
  • React Cell Formatters: MultiValueFormatter, etc.
  • React Filters (TBD).
  • For the legacy React 15.x, use: import React15Tabulator.

πŸ“¦ Usage

$ npm install react-tabulator --save

import 'react-tabulator/lib/styles.css'; // required styles
import 'react-tabulator/lib/css/tabulator.min.css'; // theme
import { ReactTabulator } from 'react-tabulator';

    <ReactTabulator columns={columns} data={data} options={} events={{ rowClick: rowClickHandler }} />

* "options" will be passed directly to Tabulator's options.
* "events" is an object like { eventName: handlerFunction }
* use "ref.table" to access to all tabulator functions.

πŸ”§ Development - Commands

Require: NodeJS

$ npm install --legacy-peer-deps        install dependencies for development.
$ export NODE_OPTIONS=--openssl-legacy-provider     to work with Node 18+
$ npm run dev      Launch DEV mode (with hot reload).
$ npm run build    Make a build.

$ npm run test     Run tests using jest-puppeteer (with headless Chrome).

πŸ“– Documentation

πŸ™Œ Thanks

All contributions are welcome!

While you're here, also check out