Skip to content
shadcn.io

shadcn.io is not affiliated with official shadcn/ui

Changelog CRUD Block for Solid

Release notes with the entry form always open: semver that must be above the latest, a type toggle, notes, an edit dialog per entry and a delete that raises a real toast with Undo.

Framework
UI library

Preview

Preview width

Installation

Part of Pro
Pro unlocks the code and one-line install of every Pro button and text effect, plus the MCP for your AI editor.
Have Pro already? Sign in to open it.Opens here as soon as you're Pro.

Overview

Write a product's release notes in the same screen you read them, with this changelog editor for Solid with Ark UI. The entries sit at the start, newest version first, each with its version, a type Badge, the date and the notes. The form sits at the end and never closes: a version Input that must be semver and above the latest ("2.5.0 must be above 2.4.1" is the problem it shows), a type Toggle Group of Feature, Fix, Breaking and Security, and notes in a Textarea. Add entry is the one Shine Button. Edit opens the same fields in a Dialog and Delete raises a real Toast, "Removed 2.4.1", whose Undo puts the entry back in its place. On a phone the form comes first. For release notes, public changelogs and any list where a number must only go up.

FAQ

How do I load my own entries?

Edit ENTRIES: each has an id, a version, a kind (one of KINDS), a date as an ISO day and the notes. Entries are always shown newest version first, sorted by the three numbers of the version, so the order of the array does not matter.

What counts as a valid version?

Three numbers separated by dots, such as 2.5.0. A new entry must be above the latest entry: the problem names both, for example "2.4.0 must be above 2.4.1". When you edit an entry the version can be anything valid that no other entry has, so you can fix a typo in an old one.

How does the Undo toast work?

Delete takes the entry out and raises a real toast through the block's own createToaster and Toaster. Its Undo puts that entry back, sorted into place, and takes the toast away. Because a toast with an action never times out, it stays until you use it or close it; several deletions raise several toasts, up to three at once. If your app keeps its own toaster, drop the one here and call your raise.

How does Edit differ from the form?

It is the same set of fields in a dialog with Save and Cancel, so the rules are the same except the version rule. Closing the dialog, with Cancel, Escape or the backdrop, drops the changes. After Save focus returns to the entry's Edit button.

What stays local, and how do I wire it for real?

Entries live in state in this tab and a reload brings the six shown back; nothing is published. In your app post the form in add, save the dialog in save, and have the toast's Undo call a restore endpoint instead of the local trash.

How does the keyboard work?

The type toggle is a radio-like group: arrow keys move through Feature, Fix, Breaking and Security. A failed Add entry focuses the first field with a problem. The toast's Undo and close buttons are reachable by Tab, and the toaster pauses while the pointer or focus is on it.