shadcn.io is not affiliated with official shadcn/ui
Accessibility Log Changelog Block for Radix UI
An accordion of the accessibility fixes in a release by WCAG conformance level, each with a count and share, and each fix with its criterion, what changed for whom, and the components it touched.
Installation
Overview
An accessibility log for React with Radix UI, written for Reachwell, a fictional accessibility-testing tool. A start-aligned header counts the 12 fixes in release 4.6 from the data, and an Accordion runs rail to rail under it with a row for each WCAG 2.2 conformance level: A, AA and AAA. A row's trigger shows the level, what it means, how many fixes it holds and its share of all of them as a number and a small bar. Opened, each fix is a line: the success criterion in mono (1.4.3), its name, what changed and for whom, and the components it touched as outline chips. It's built from Accordion, Badge and Guides. The standard is named in text only; the fixes are example data.
FAQ
How do I add a fix?
Add it to a level's fixes in LEVELS: a criterion number, a name, a sentence on what changed and for whom, and the components. The header's total, each row's count and its share come from the data, and shares use whole numbers that add to 100.
How do the rows open?
One level is open at a time and level A is open on load. Each trigger sits inside its own level-three heading.