shadcn.io is not affiliated with official shadcn/ui
Release Checklist Music Block for React Aria
A release checklist whose due dates count back from the release date you set, with a progress bar, due words against the page's date, and tasks that stay locked until the ones they wait on are ticked.
Installation
Overview
Keep a release on schedule, with this release checklist for React with React Aria. The header holds the one control, a release date Input, and a sentence that says "On track" or "2 overdue" with the count. Debutlist, a release planner, lists eight tasks in a hairline frame with a plus mark on each corner: each is due the release date minus a typed lead (Master the tracks 28 days, Cover art 21, Metadata 14, Submit to stores 10, down to the press push at 3), shown as a date and a word worked out against the page's date ("Overdue by 3 days", "Due in 4 days", "Done"). A Progress bar counts the done tasks. Tasks wait on each other: Submit to stores shows a lock and "Waiting for: Cover art" until Mastering, Cover art and Metadata are ticked, and a task others rely on can't be reopened while they are done. It's built from Input, Progress and Guides with native checkboxes and a CSS entrance only. For release planners, label operations and any list with dependencies.
FAQ
How do I change the tasks and their leads?
Edit TASKS: each has an id, a name, a hint, lead (days before the release) and needs, the ids that must be done first. FIRST_DONE is what is ticked on load and FIRST_RELEASE the date. The due dates, the words, the progress count and the verdict are worked out from those, so nothing is typed twice.
How are due dates and words worked out?
A task's due day is the release day minus its lead, in whole UTC days. The word compares that day with the page's fixed date (AS_OF), never the clock: overdue by N days, due today or due in N days. A done task just says Done. Pick a nearer release date and tasks turn overdue at once; a date that has passed is refused with a message and the checklist keeps the last good date.
How do the locked tasks work?
A task with unfinished prerequisites is not a checkbox: it shows a lock and names what it waits for. Ticking its prerequisites opens it. The other way round, unticking a task that a done task relies on is refused with "Reopen … first." in the status line, so a locked task can never be done.
What stays local, and how do I make it real?
The ticks and the date live in the page. To make it real, store each task's state with the release and let the date field update the release's date in your API, then derive the same words from the stored dates.