shadcn.io is not affiliated with official shadcn/ui
Compliance Updates Changelog Block for React Aria
Regulation changes as rows rail to rail: the law as a title, what changed, its effective date and stage, and a readiness bar that opens a list of its tasks.
Installation
Overview
A regulatory-change tracker for React with React Aria, written for Mandate, a fictional product. A start-aligned header sits over four rows on the page's lines. Each row names a law as its heading (the EU Data Act, the Cyber Resilience Act and the European Accessibility Act, in text only, with no seal or badge), says in a sentence what changed, shows the day it takes effect with an icon and a word (Upcoming or In effect), and a readiness line: a bar and 4 of 5 tasks. That line is a Collapsible trigger that opens the row's tasks, each marked Done or To do. It's built from Collapsible, Progress and Guides. The effective dates are the laws' own; the one-line summaries are short and not legal advice, and the tasks and progress are example data.
FAQ
How do I add a regulation?
Add an entry to REGULATIONS: a name, a one-sentence change, the fixed effective ISO date, a stage and its tasks (each a text and a done flag). The readiness text and the bar are computed from the tasks.
Is this legal advice or a compliance claim?
No. The block names laws as text and says in a quiet line that summaries are examples, not legal advice. It has no seals, logos or certification wording. Check each date and summary against the official text before you publish your own.