Data Table Filters

Overview

Data Table Filters is an open-source React data table from openstatus, built on TanStack Table and shadcn/ui. It describes itself as a playbook rather than a library: instead of adopting a grid like AG Grid or MUI DataGrid, developers install the pieces through the shadcn CLI and add filters, sorting or infinite scroll as they need them.

State can live in the URL with nuqs or on the client with zustand. With Drizzle ORM, filtering, faceted counts and cursor pagination run in SQL. The registry holds 15 blocks, and the project ships an AI agent skill that understands the structure and can scaffold tables. The repository has about 2.2K GitHub stars.

Features

• Faceted filters: Input, checkbox, slider and time range filters with faceted counts.
• Infinite data table: Infinite scroll with server-side filtering, row selection and a live mode.
• Default data table: A simpler table with client-side filtering and pagination.
• Filter command: A command-style filter input, with an AI-assisted variant.
• Row detail sheet: A side sheet that opens row details.
• Drizzle integration: Server-side filtering and cursor pagination against Postgres.
• Extras: Blocks for schema definition, remote data, actions, charts and an MCP endpoint.

Tech stack

• React, shadcn/ui
• TanStack Table, TanStack Query, TanStack Virtual
• nuqs or zustand
• Drizzle ORM, Zod

Registry

Install via the shadcn CLI registry:

npx shadcn@latest add @data-table-filters/component-name