shadcn.io is not affiliated with official shadcn/ui
Expandable Release Entries Block for Solid
Four release rows that each open to a sentence and a copyable migration snippet in a focusable code region; the newest is open on load and any number can be open.
Installation
Overview
Expandable release entries for Solid with Ark UI, written for Foldnote, a fictional data-import SDK. A start-aligned header sits over four rows rail to rail, each its own Collapsible: a chevron, the version, the title and the date. Opened, a row shows a sentence and a migration snippet in a labelled, focusable code region with a Copy button above it, so a long line scrolls inside its box. The newest is open on load and any number can be open at once. View all releases ends the block. It's built from Guides, Collapsible, Copy Button and Button, with your theme's tokens for every colour. For SDKs, libraries and any changelog whose entries come with code. The releases are example data.
FAQ
How do I change which entries start open?
The block holds the open rows in one list, opened, which starts with the newest version. Change that list to open others, or leave it empty to start closed.
How do I change a snippet?
Each release has a file name and lines, one string per line; the same lines are shown and copied. The snippet sits in a section named "v3.0.0 migration snippet" that takes focus, so the keyboard can scroll a long line. The Copy button announces "Copied" politely.
Can the keyboard reach a closed row's snippet?
No. A closed row's content is inert, so its code region and Copy button are out of the tab order on every base.
Where does View all releases go?
It's a link (href="#"): point it at your full changelog.
The button's asChild receives its props: spread them onto your router's link.