Search Docs

Search through documentation...

OpenStatus Logo

React Data Table with Filters

Open-source faceted filters, sorting, and infinite scroll with tanstack table, shadcn/ui and state management via nuqs (url-based) or zustand (client-side). Open Source on GitHub.

It's not a library. It's a playbook. Stop hand-rolling data tables. Copy proven patterns, install the agent skill, ship.
Learn more in the Docs. 

nuqs | zustand

Infinite Data-Table

A cooked  infinite scroll data-table with a server-side filter, row selection and live mode.

nuqs | zustand

Default Data-Table

A simple  data-table with a client-side filter and pagination.

Changelog

More Examples

Why data-table-filters?

10 filter types, 2 state management options, server-side and client-side rendering — all fully open source. Built for developers who want production-ready data tables without the overhead of a monolithic library. Learn more.

Built on proven foundations

Powered by TanStack Table for headless table logic, shadcn/ui for accessible components, nuqs for URL-based state management, and zustand for client-side state. Each dependency is best-in-class.

Not a library — a playbook

Unlike AG Grid, MUI DataGrid, or react-data-table-component, this project gives you the code directly. Install components via the shadcn CLI and extend your table one piece at a time as your project grows — add filters, sorting, or infinite scroll only when you need them. Own every line, no vendor lock-in, no bundle bloat.

Built for AI agents

Ships with an AI agent skill that understands the full project structure — it can scaffold, configure, and extend data tables end-to-end. Because every component is installed via the shadcn CLI, agents know exactly how to add and compose pieces without custom tooling. Also includes an MCP server that lets AI assistants query and filter your actual table data directly.

Features

Frequently Asked Questions