🚀 Quick Start
Install via the Shadcn registry, then wire config and actions to DataTable: export const MyTable = () = ( tableType="products" getTableConfig=getTableConfig
Documentation
Open-source React data table for Shadcn UI and TanStack Table with URL state, Server Actions, bulk actions, and full code ownership
Install via the Shadcn registry, then wire config and actions to DataTable: export const MyTable = () = ( tableType="products" getTableConfig=getTableConfig
Less boilerplate – Clear, focused API Minimal setup – Sensible defaults Stable – No hydration loops with Next.js Powered by TanStack Table – Great performance
Grouping Grouping, pagination, and sorting are enabled via table configuration and column types. No heavy wiring needed. Saved views Users can save and restore URL-backed views that include filters, search, sorting, col...
Documentation map
The public Table documentation is now represented as editable CMS pages under yayaw.app/table.
Install YaYaw Table, the open-source React data table for Shadcn UI and TanStack Table, via the Shadcn registry
Step-by-step setup with a concrete Next.js example
Build create/edit forms with native array editors, validation, and nested collection support
Props and usage reference for the unified DataTable component
Table behavior configuration and defaults
Columns configuration, types, order, and visibility
Wire CRUD actions to the table via provider callbacks
Shared QueryClient architecture, invalidation, and refetch behavior
Confirmation flow and callback contract for copy, delete, edit, and export
Using Server Actions for list, create, update, delete and bulk operations
Sort, filters, pagination and column state in the URL with Nuqs
Common runtime issues and fixes
Implementation notes
Install YaYaw Table, the open-source React data table for Shadcn UI and TanStack Table, via the Shadcn registry
$ export const MyTable = () => (
$ <DataTable
$ tableType="products"
$ getTableConfig={getTableConfig}
$ getTableActions={getTableActions}