A release section with the latest version card, highlights and download buttons per platform, next to a changelog timeline that draws in, with collapsible releases, typed notes and filters for new, improved and fixed.
Free for personal use. Updates install in the background and never touch your files.
npx shadcn@latest add https://hyperblur.dev/r/download-changelog.jsonWorks in any React project set up with the shadcn CLI. The file lands in components/hyperblur/download-changelog.tsx.
import { DownloadChangelog } from "@/components/hyperblur/download-changelog"
<DownloadChangelog onDownload={(d) => track(d.os)} />| Prop | Type | Default | Description |
|---|---|---|---|
| eyebrow | string | "Released November 3, 2026" | Line above the title in the release card. |
| title | string | "Download Quill 4.2" | Release card heading. |
| summary | string | Short release summary | Paragraph under the heading. |
| highlights | string[] | Three highlights | Checked bullet points in the release card. |
| releases | DownloadChangelogRelease[] | 4.2.0, 4.1.2, 4.1.0, 4.0.0 | Newest first. Each has version, date, optional name and notes with type (new, improved, fixed) and text. The first one is marked as latest. |
| downloads | DownloadChangelogDownload[] | macOS Apple Silicon, macOS Intel, Windows, Linux | Download rows with label, detail, size, href and os (mac, windows, linux). The first row is the primary button. |
| defaultExpanded | number | 2 | How many releases start expanded. |
| onDownload | (item: DownloadChangelogDownload) => void | Called when a download row is clicked. | |
| allReleasesHref | string | "#" | Link under the timeline. Pass an empty string to hide it. |
| accent | string | "#10b981" | Color of the version chip, timeline, new tags and focus rings. |