## Changelog Timeline (S—035)

A changelog with sticky release dates, New/Improved/Fixed filters and collapsible notes.

- URL: https://sundaeui.dev/components/changelog-timeline
- Category: Page sections · Art direction: Editorial
- Access: Sundae Pro (authenticated install)
- Stack: React 18+, TypeScript, Tailwind CSS; dependencies: none
- Install: `npx shadcn@latest add https://sundaeui.dev/r/changelog-timeline.json`
- Tags: timeline, tailwind, release-notes, changelog, section, content, react

A changelog people actually read. Each release has a date and version that stay pinned while you scroll through its notes, a short title and summary, and changes labelled New, Improved or Fixed in a consistent column so they scan like a list.
Filter pills show counts per type and hide releases with nothing matching. Long releases collapse after a few lines with a Show all link. On mobile the date sits above each release.
Use it for product changelogs, release notes and “what’s new” pages. Feed it from Markdown front matter or your CMS.

### Usage

```tsx
import { ChangelogTimeline } from '@/components/sundae/changelog-timeline'

<ChangelogTimeline releases={[{ version: '3.4.0', date: '2026-10-28', title: 'Shared views', changes: [{ kind: 'new', text: 'Save filters as views.' }] }]} />
```

### Props

- `releases` (`Release[]`, required): { version, date (ISO), title, summary?, changes: { kind: new|improved|fixed, text }[] }.
- `collapseAfter` (`number`, default `4`): Lines shown before Show all.

### Accessibility

- Releases are an ordered list with real <time> elements.
- Filters are a labelled radio group with counts.
- Change types are written out, not shown by colour alone.