👋 This is a community-driven shadcn/ui resource. For the official documentation, visit ui.shadcn.com
Table with Row Selection
Data table with row selection checkboxes, select all functionality, and bulk action toolbar for managing multiple items
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Managing multiple rows at once? This React selection table adds checkboxes to each row with a select-all header checkbox that syncs with individual selections. Built with shadcn/ui Table, Checkbox, and Button components with Lucide React icons, selected rows highlight with background color and a floating toolbar appears showing bulk actions—Delete, Archive, and Export. The indeterminate checkbox state shows when some but not all rows are selected—perfect for admin dashboards, content management systems, or any interface where batch operations on table data save time.
Installation
npx shadcn@latest add https://www.shadcn.io/registry/table-selection-01.jsonnpx shadcn@latest add https://www.shadcn.io/registry/table-selection-01.jsonpnpm dlx shadcn@latest add https://www.shadcn.io/registry/table-selection-01.jsonbunx shadcn@latest add https://www.shadcn.io/registry/table-selection-01.jsonRelated blocks you will also like
Table with Sortable Columns
Column sorting with direction indicators
Task Table with Actions
Individual row action buttons
Table with Page Navigation
Navigate through pages
Table with Quick Filters
Filter before selecting
Table with Export Options
Export selected rows
Table with Row Menu
Dropdown menu per row