Search blocks by description or jump to a page.
Static blueprint of an open task detail panel with meta rows, a subtask checklist with Progress, an activity strip, and a comment composer.
The source for every Application block is included with Pro and Team. Start a plan to copy the code.
Already on a plan? Log in
Task Detail Blueprint is the expanded task panel rendered as static markup over a scrim so the preview iframe captures every section. The card shows task ACM-294 Add rate-limit headers to API responses, status In Progress, assignee Jordan Lee, due Jun 15 2026, and a description naming the three headers integrators need. Below the description sits a four-item subtask checklist at 2 of 4 with a Progress bar, an activity strip with a status change by Priya Nair and a comment from Maya Chen, and a comment composer.
No Radix Dialog or portal is used; a scrim div wraps a centered bg-background card. That is the rule for all dialog blueprints in this collection.
Reach for this block to show stakeholders the full task detail surface before wiring a real Dialog. Replace the static markup with your Dialog component once the layout is approved, keeping the same section order.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the bug or feature detail overlay. Other detail blueprint shapes:
Tip: render every section in the blueprint even if some will be conditionally hidden later; reviewers need to see the full layout to give useful feedback.