forever components

Dev Status

Release Changelog

A release changelog feed: dated semver cards stream in at the top of a thin vertical timeline rail with connecting dots, each listing Feature (green), Fix (amber) and Perf (rust) changes on small colored chips, looping with plausible invented copy.

cssmedium complexitysubtle motion

Open on the canvas to copy the code → Free account · 3 copies a day · membership goes unlimited

Live demo — the real component, running in a sandbox. One self-contained HTML file, zero dependencies. Open it on the canvas →
Worth keeping? Votes steer what gets built next — sign in to cast one, free to read

When to use it

Product update panels, "What's new" widgets, dev/ops status pages, release or deploy dashboards, and changelog sidebars that need a live, self-animating timeline.

When not to

When you need a full paginated/searchable release history, real commit or deploy data wiring, or a static single release note — the entries here are synthesized invented copy on a loop.

Working with an AI agent

Every component ships agent-ready metadata. An example instruction for this one:

Edit the TPL array (change lines as [kind,text] where kind is feat/fix/perf) and the CHIP map to set your own changelog copy; nextVer() and the day counter drive the semver badges and dates, and the setInterval (3400ms) sets how often a new release slides in. Re-theme to light by setting --pro-bg:#f6f8fa; --pro-surface:#ffffff; --pro-border:rgba(0,0,0,.08); --pro-text:#1f2328; --pro-muted:#59636e (keep --pro-accent), and update the catalog bg field to match. Theme: dark tokens live in :root, the light variant in :root[data-theme="light"]; ?theme=light or a {type:'forever:theme'} postMessage switches at runtime.

Safe to edit

  • theme tokens (:root --pro-bg, --pro-surface, --pro-border, --pro-text, --pro-muted, --pro-accent)
  • changelog copy (TPL array of [kind,text] change lines; CHIP kind→label/color map)
  • version + date roll (nextVer() start maj/mnr/pat, day counter)
  • release cadence (setInterval 3400ms) and visible count (MAX=4)
  • entry cadence (setInterval add(), 2300 ms; list capped and recycled)
  • theme tokens (:root dark defaults + [data-theme=light] overrides)

Keep intact

  • :root --pro-* token block (renaming breaks the shared pro theming API)
  • role=img + aria-label on .rcl-stage
  • IIFE wrapper
  • prefers-reduced-motion early return to the seeded populated feed
  • visibilitychange pause
  • ambient changelog feed (capped list; paused on visibilitychange)
  • theme hook (?theme= bootstrap + forever:theme message listener + theme tokens)

Known limitations

  • Light re-theme via the --pro-* block; catalog bg/accent describe the dark default
  • Changelog entries are synthesized from invented copy on a loop, not wired to a real release/commit source
  • At the 180px minimum size only the newest one or two entries stay fully visible; lower entries are clipped by the feed

changelogrelease-notestimelinesemverdev-statusfeedversioningchipsci-cd

More Dev Status components

  • Status PageA public service status page: six services, each with an Operational state pill and a compact 90-day uptime strip carrying past-incident marks; on a loop…