Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Button Group - Bulk Actions
A button group for bulk operations on multiple items with Select All, Delete, Archive, and Move actions for efficient batch processing
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Managing multiple items individually wastes time—bulk actions transform workflows. This React button group combines shadcn/ui's Button and ButtonGroup components with Lucide React's CheckSquareIcon, Trash2Icon, ArchiveIcon, and FolderIcon for cohesive multi-item operation toolbars. Built on Radix UI with outline variant buttons using size="sm" for compact control bars, the pattern provides both icon-with-text and count-labeled variations for flexible batch operation interfaces. Perfect for email clients where users process messages in batches, file managers offering multi-select operations, task management systems enabling bulk updates, or any data interface where batch actions should feel grouped and powerful—button groups unify operations, count labels communicate scope clearly.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
File Operations
Single-item action controls
Data Table
Tabular data with selection
Checkbox Component
Multi-select controls
Social Actions
Grouped interaction controls
Destructive Dialog
Bulk delete confirmations
Outline Button
Border-style button variant
Questions you might have
React Button Group - File Operations
A button group for file management actions with Download, Share, Edit, and Delete operations in unified controls
React Button Group - Comment Actions
A button group for comment management with Reply, Edit, Delete, and Report controls for threaded discussion interfaces