Changelog feed
Release notes you can filter, open in place, and scroll through month by month.
pnpm dlx shadcn@latest add @uiarc/changelog-feedChangelog
Halden 4.12 shipped on September 18, 2026
September 2026
- Choose two to five columns for each breakpoint.
- Drag an image and the columns rebalance while you move it.
- Captions fall back to the image alt text.
Gallery by Oda Lindqvist Ceramics, Bergen
August 2026
July 2026
June 2026
That is everything since Halden 4.5 in June.
- A product changelog or release notes page grouped by month.
- Release notes with type filters such as features, fixes, and improvements.
- Changelogs that should offer an email subscribe action in the header.
- Use timeline for a short vertical list of events without filters.
- Use accordion for plain expandable content that is not dated.
- Use release-console when the page manages a release rather than announcing it.
Installation
Add Changelog feed with the shadcn CLI, or copy the source by hand.
pnpm dlx shadcn@latest add @uiarc/changelog-feedAdds the block and its local dependencies, and installs motion, lucide-react. First time? Add the @uiarc registry to components.json, or use the full URL:
Usage
Use this for a product changelog page. Load entries from your release notes source and connect the subscribe control to your mailing list.
import { ChangelogFeed } from "@/registry/blocks/changelog-feed/changelog-feed"; export default function ChangelogPage() { return ( <main> <ChangelogFeed /> </main> );}ChangelogFeed
Release notes grouped by month, with type filter chips, expandable entries with media, a month jump nav, and an inline subscribe form. Entries, images, and the webhook snippet are sample data.
No props.
- Escape
- Cancels the subscribe form and returns to the Subscribe button.
- Each entry row is a button with aria-expanded and aria-controls pointing at its detail panel.
- Filter chips are toggle buttons with aria-pressed, and the visible count is announced in a polite status region.
- The month nav marks the current month with aria-current, and the scroll area is focusable with an aria-label.
- Entries open in place on a spring while the chevron rotates; the month label slides in the scroll direction.
- The subscribe control morphs from button to form to a drawn check with a short blur crossfade.
- Reduced motion makes these changes instant.
- Below 640px the header stacks, rows move date and type above the text, and the scroller drops from 560px to 520px.
- Below 480px month counts and the shown count are hidden so the month nav fits on one line.
- Hover styles apply only on hover-capable fine pointers.
- The feed scrolls inside a fixed-height area; entries are not virtualized, so paginate or load older months on demand.
- Scroll tracking for the month bar is batched to one requestAnimationFrame, and a ResizeObserver resyncs it on resize.
Notes for AI
Give your coding assistant the Markdown reference instead of screenshots.
- Use for a product changelog or release notes page.
- Replace the entries array and the imported sample images with data from your release notes source or CMS.
- The subscribe submit only changes local state; post the email to your mailing list provider.
The full library index for assistants is at /llms.txt.