Bookmark Saves Changelog Block for React

Edit RELEASES at the top of the file, newest first: each has a version, a date as an ISO day, an href, its kinds, a title and a summary. SAVED_AT_START lists the versions saved when the page loads; empty it to start with none, and the Saved tab opens on its empty state. The counts on the tabs come from the same lists, so they can't disagree with the rows.

In the page's own state, so in this demo they reset on reload and are not shared across tabs or devices. To make them real, send the version from toggle to your own API (for signed-in readers) or write the list to localStorage after the first render, and keep the header's honest line only while that is true.

Each bookmark is a toggle button named "Save v8.3.0: Highlights sync across your devices" that says whether it is pressed, and each title is a link inside its own h3. Tab moves through the tabs, then the links and bookmarks in order; Space or Enter presses a bookmark, and a polite line says, for example, "Saved v8.3.0. 3 saved." The two tabs are a real tab list: the arrow keys move between them. The unseen copy of the full list that holds the frame's height is hidden from assistive technology and the keyboard.

An empty state with a bookmark icon, "Nothing saved yet" and one sentence that says to press the bookmark on a release. It has no button: the way to fill it is the bookmark in the All tab. The frame keeps its height, so the page doesn't jump when you switch tabs.

The header and the frame fade up once on load, with CSS transitions. With reduced motion they are off and the block simply appears. Pressing a bookmark and switching tabs change the page at once, with no animation.

Below the lg breakpoint the tabs sit under the title, and each row stacks: the version, date and tags and the bookmark share the first line, with the title and sentence below. Nothing scrolls sideways at 320 pixels, and in a right-to-left layout the rows mirror while the version numbers stay left to right.