Todo List Batch Edit
A todo list block with inline batch editing mode for React and Next.js featuring edit mode toggle, inline text inputs, change highlighting, per-row undo, and batch save/cancel actions built with shadcn/ui and Tailwind CSS
Edit multiple tasks at once with this batch-editing todo list block for React and Next.js. Toggle Edit Mode in the header to transform each task row into an inline text input. Changed rows are highlighted with a subtle amber left border, and each modified row has an undo button. Batch Save and Cancel buttons appear during editing. Built with TypeScript, shadcn/ui Checkbox, Button, Input, and Badge components, motion staggered animations, and Tailwind CSS. Ideal for sprint grooming sessions, bulk task renaming, and administrative task management interfaces.
Related Components
Notes Todo List
Todo list with expandable notes
Bulk Actions Todo List
Todo list with multi-select operations
Archive Todo List
Todo list with archive functionality
Template Todo List
Todo list with task templates
Time Tracking Todo List
Todo list with time logging
Dependencies Todo List
Todo list with task dependencies
FAQ
Was this page helpful?
Sign in to leave feedback.
Basic
A basic todo list block for React and Next.js with checkbox completion, add task input, and completion counter built with shadcn/ui and Tailwind CSS
Bug Tracker
A bug tracking list block for React and Next.js with severity filtering, expandable reproduction steps, status management, and reporter info built with shadcn/ui and Tailwind CSS