👋 This is a community-driven shadcn/ui resource. For the official documentation, visit ui.shadcn.com
Status Workflow
CRUD status workflow interface showing record state transitions with visual timeline, allowed next states, and validation requirements
Looking to implement shadcn/ui blocks?
Join our Discord community for help from other developers.
Managing record lifecycles needs structure. This React CRUD component displays current status with visual timeline, available status transitions based on workflow rules, required fields for each transition, and confirmation dialogs. Built with shadcn/ui Badge, Button, Dialog components with status history timeline and validation checks, users can transition records through draft, review, approved, published states. Workflow enforcement, audit trail, and rollback options—perfect for content management, order processing, or approval systems where controlled state transitions ensure data integrity and business process compliance.
Installation
npx shadcn@latest add https://www.shadcn.io/registry/crud-status-workflow-01.jsonnpx shadcn@latest add https://www.shadcn.io/registry/crud-status-workflow-01.jsonpnpm dlx shadcn@latest add https://www.shadcn.io/registry/crud-status-workflow-01.jsonbunx shadcn@latest add https://www.shadcn.io/registry/crud-status-workflow-01.jsonRelated blocks you will also like
Edit Product Form
CRUD form for product inventory
Product Detail View
Comprehensive detail view with tabs
Activity Feed
Timeline of all record changes
User List Management
User list with search and actions
Delete Confirmation
Confirmation dialog for deletions
Bulk Edit Products
Update multiple items simultaneously
Questions you might have
Manage Relationships
CRUD relationship manager for linking records with search, selection, and management of foreign key associations and many-to-many relationships
Product Detail View
CRUD detail view with tabs for overview, activity history, related items, and settings, displaying comprehensive item information