Shadcn.io is not affiliated with official shadcn/ui
Basic Data Table with Checkboxes
A React data table with checkboxes and sorting using TanStack Table getSortedRowModel and shadcn/ui Checkbox for row selection
Multi-select tables power bulk operations—checkboxes let users act on many rows at once. This React data table uses TanStack Table's getSortedRowModel with ArrowUpDown icon from Lucide React for column sorting plus Checkbox for selection with indeterminate state. Built with shadcn/ui Table components featuring data-state selected styling and selected row counter. The checkbox pattern improves efficiency—perfect for bulk deletion, batch exports, mass updates, or anywhere users need to select multiple rows for group actions reducing repetitive single-row operations.
Basic Data Table with Checkboxes preview
Installation
Related Components
Table with Filters
Column filtering inputs
Paginated Table
Page navigation controls
Column Visibility
Toggle column visibility
Table with Actions
Row action dropdown
Standard Checkbox
Basic checkbox component
Expandable Rows
Nested sub-row content
FAQ
Was this page helpful?
Sign in to leave feedback.
Data Table with Actions
A React data table with row action dropdown menus using TanStack Table and shadcn/ui DropdownMenu with MoreHorizontal trigger icon
Data Table with Filters
A React data table with column filter inputs using TanStack Table getFilteredRowModel and shadcn/ui Input for real-time filtering