<> Open Source Project

react-flexi-datatable

v1.0.5

A powerful, flexible and customizable React DataTable component with modern features and high performance.

Lightweight Customizable ResponsiveTS TypeScript Easy to Use
NameRoleStatusDateActions
Shubham MauryaDeveloperActive28 Aug 2025
John DoeDesignerActive27 Aug 2025
Jane SmithManagerInactive26 Aug 2025
Alex JohnsonDeveloperActive25 Aug 2025
Rows per page:
5
1-4 of 4
700+
Downloads
120+
Stars
10+
Forks
2+
Contributors
MIT
License

Why react-flexi-datatable?

Powerful features designed for flexible and configurable React data tables.

Sorting & Filtering

Real-time multi-column search, dynamic filters and multi-state column sorting.

Pagination

Built-in pagination with configurable page sizes and optional top pagination.

Custom Styling

Supports preset themes and custom Tailwind classes for table areas.

Responsive Design

Responsive table layouts with configurable horizontal and vertical scrolling.

CSV Export

Export active filtered and sorted table data to CSV with one click.

Performance

Designed for smooth interaction with large datasets and configurable scrolling.

Column Visibility

Show or hide columns while preserving layout preferences in localStorage.

Column Reordering

Drag and drop column headers or reorder columns from the Columns menu.

Column Resizing

Resize columns using drag handles and reset widths when needed.

Drop Column to Hide

Drag a column header into the drop zone to hide it instantly.

Inline Row Editing

Edit row values directly with text or select controls and save changes easily.

Bulk Editing

Select multiple rows and update chosen columns simultaneously.

Keyboard Navigation

Navigate table cells using arrow keys and activate controls with Enter or Space.

Flexible Layout

Configure table width, height and horizontal or vertical scrolling behavior.

Built for developers

Configure the table exactly according to your application's requirements.

Flexible API

Configure search, filtering, sorting, pagination and table behavior.

Column Control

Reorder, resize, hide and customize table columns.

Responsive

Support for responsive layouts and horizontal scrolling.

Developer Ready

Built for configurable real-world data management needs.

Install via npm
npm install react-flexi-datatable
Or via yarn
yarn add react-flexi-datatable
Or via pnpm
pnpm add react-flexi-datatable

Themes & Layout

Choose a preset theme or customize the table appearance.

Default
Dark
Indigo
Emerald
Slate
Blue