The React datatable you'd build if you had three months.

You get the source code. Drop it in your repo and customize it as you like.

LIVE SHOWCASE

Loading table preferences...

What's in it.

Included

The full table, already built

Global search, column filters with active chips, multi-column sort, grouping, row selection, bulk actions, row previews, column resize, reorder, freeze, and display options. Everything users expect, working out of the box.

Included

Filters and views stick around

The table remembers where users left off. Filters, sort, grouping, column layout, and scroll position restore automatically on return - even after leaving the page. Saved views capture setups worth keeping, and table state can be synced to the URL: share it, bookmark it, link to it. LocalStorage works out of the box; swap in your backend with a single adapter and example code to follow.

Included

Handles small and large datasets

Run search, filtering, sorting, and grouping in the browser with prefetched data, or switch to server-side pagination and infinite scroll - a single query payload covers filters, sort, group, and page, with a backend helper included. Turn on virtualization to handle massive datasets on the client.

TECH SPECS

Ships with everything you need.

Columns and cells

  • Text, number, and date columns
  • Single-select columns
  • Multi-select columns
  • Custom React cells (build your own)
  • Custom accessors and sort functions
  • Plain React rendering, no canvas

Workflow

  • Global search
  • Column filters with active chips
  • Multi-column sorting
  • Row grouping
  • Column resize, reorder, and visibility controls
  • Frozen columns
  • Display options
  • Keyboard navigation
  • Loading, empty, and error states

Selection and actions

  • Row selection with multi-select mode
  • Select rows directly or by query
  • Per-row action menu
  • Floating action bar for selected rows
  • Bulk actions with server-backed payloads
  • Row peek panel for quick detail view
  • Action registry for adding custom actions

Views and persistence

  • Personal saved views
  • Team and shared views with configurable sharing
  • Persistence for search, filters, sort, grouping, column order, width, visibility, frozen state, and display preferences
  • Scroll restoration
  • URL state sync and copy link
  • LocalStorage or server-side adapters

Loading modes

  • Client-side mode with search, filter, sort, and group in the browser
  • Server-side mode with a shared query contract for filtering, sorting, grouping, pagination, totals, and group-header rows
  • Server pagination and infinite scroll
  • Backend helper included

Scale

  • Row and column virtualization
  • Frozen columns with virtualization
  • Per-table virtualization
  • Overscan control
  • Large local datasets and server-driven datasets

SOURCE CODE

You get the source code.

The full source, dropped into your repo, yours to modify any way you want. Easy to customize, easy to extend, and great context for AI coding agents to work with.

The repo includes plain React component source, local and online examples, backend helper source, installation docs, and boundary tests.

Built with the tools you already use

  • Tailwind
  • shadcn primitives
  • TanStack Table
  • TanStack Query
  • nuqs for URL state
  • TypeScript throughout

WHY BUY THIS

Headless libraries give you parts. This gives you the product.

Headless gives you parts

You still connect filters, saved views, URL sync, persistence, server loading, bulk actions, and column controls. Each piece is manageable; together they become the work.

This gives you the product

react-datatable ships the UI and state model already wired together. Drop it into your repo, start from a working table, and change what you need.

One payment, one company

No annual renewals, no per-seat licenses, no usage tiers. Pay once and use it across the products your company ships.

Why not just use TanStack for free?

I've been in your shoes.

TanStack is great. Genuinely great - it's why react-datatable is built on top of it. But getting from a headless library to a working table UI is a long road. And if you want the kind of data table experience users expect from world-class apps - saved views, filter chips, server pagination, persistence, the whole thing - that road gets long fast.

I've built data tables from scratch several times across my career. Each time it took months to get them to a place I was actually proud of. Months of edge cases, state bugs, and "we'll polish that later" tickets that never close.

You can skip that. Get the table done, and spend those months on what actually makes your product different.

CHECKOUT

react-datatable - you get the source code

Component source, local example, online example, backend helper, Tailwind and shadcn setup, docs, and private GitHub repository delivery.