Featured Release Changelog

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its badge dependencies and any missing npm packages, and installs them straight into your project.

Prefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/changelog/changelog8.tsx instead.

Usage

The file also exports changelog8Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.

import { Changelog8, changelog8Demo } from "@/components/blocks/changelog/changelog8";

export default function Page() {
  return <Changelog8 {...changelog8Demo} />;
}

Props

Types

type ChangeType = "added" | "changed" | "fixed" | "removed";

interface Change {
  type: ChangeType;
  text: string;
}

interface Release {
  version: string;
  date: string;
  title?: string;
  description?: string;
  changes: Change[];
}

Behavior notes

• The first item in `releases` is always rendered as the featured card (larger padding, `border-2 border-primary/30 bg-muted/40`, a full change list with tags); the remaining items render as condensed rows below.
• Condensed rows show `description` if present, otherwise fall back to the first change's text, so every previous release always has a one-line summary even if `description` is omitted.
• Change tags follow this category's convention: added is `variant="default"`, changed is `variant="secondary"`, fixed is `variant="outline"`, removed is `variant="destructive"`.
• Fully static: no submit actions or client-side state anywhere in the block.