@evancnavarro/changelog-react

A drop-in React changelog page: grouped entries, deep-link highlight, copy-link, search, and back-to-top. Portable by design — semantic class names + a themeable stylesheet, no Tailwind required. Built on @evancnavarro/changelog-core and @evancnavarro/anchor-highlight.

Install

npm install @evancnavarro/changelog-react

react and react-dom (>=18) are peer dependencies.

Usage

import { ChangelogView } from "@evancnavarro/changelog-react";
import "@evancnavarro/changelog-react/styles.css";
import type { ChangelogEntry } from "@evancnavarro/changelog-core";

const entries: ChangelogEntry[] = [/* … */];

export function ChangelogPage() {
  return <ChangelogView entries={entries} />;
}

Props

| prop | type | default | notes | | --- | --- | --- | --- | | entries | readonly ChangelogEntry[] | — | already scoped to the app/feature-space you want | | showFab | boolean | true | floating back-to-top after 400px scroll | | emptyLabel | string | "No changes match your search." | shown when a search/filter matches nothing |

Also exports HighlightedText for rendering search-match highlighting on your own.

Theming

The stylesheet is driven by CSS custom properties and inherits from @basemorph/tokens when present (e.g. --color-accent), with standalone fallbacks so it also works on its own. Override the --ecn-cl-* variables to restyle.

License

MIT © Evan C. Navarro