shadcn.io is not affiliated with official shadcn/ui
Changelog Notification Block for Ark UI
A what-is-new widget for a product changelog: four area chips set what you want to hear about, eight dated entries narrow to those areas with a New, Improved or Fixed word, unseen dots and a Mark all seen button, in a scroll region of fixed height.
Installation
Overview
Show the changes that matter to each person, with this changelog widget for React with Ark UI. It is Notchlog, a product-changelog widget, showing "What's new in 3.4" in one hairline frame with a plus mark on each corner. A multiple Toggle Group labelled "Notify me about" holds four chips (Editor, API, Billing, Mobile) that scroll sideways on a narrow screen. Below, eight typed entries narrow to the chosen areas, each with a type word in a Badge (New, Improved or Fixed), a title, a line, its area and its day, and a dot with a heavier title while it is unseen. Pressing a title marks it seen; Mark all seen marks every shown entry. Choosing no area shows an Empty state. The list lives in a region of fixed height, and a status line counts what is shown and hidden. Guides draw the lines. For SaaS products, apps and developer tools.
FAQ
What stays in the page?
Which areas are chosen and which entries are seen. Nothing is subscribed, stored or sent, and a reload puts both back. In your app save the areas as the person's preference, filter the feed on the server if it is long, and record the seen entries so the dots stay off.
How does choosing areas change the list?
The entries are typed with an area each; the list shows those in the chosen areas, and the status line says "4 of 8 shown, 4 hidden by your areas. 3 unseen." The region has a fixed height and scrolls inside itself, so choosing never moves the panel, and choosing none shows the empty state at the same height.
How do I tell unseen from seen without colour?
An unseen entry has a filled dot, a bolder title and a hidden "Unseen:" before the title; a seen one has none of these. Mark all seen only marks the entries you can see, and its button stays focusable and says so when there is nothing left.
Where do the dates come from?
Each entry has a typed ISO day shown as a time element, around a fixed "now". The widget says "3.4" from a constant. In your app fill the entries from your changelog source.