Compact Inline Bar

Installation

A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its 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/stats/stats12.tsx instead.

Usage

The file also exports stats12Demo, 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 { Stats12, stats12Demo } from "@/components/blocks/stats/stats12";

export default function Page() {
  return <Stats12 {...stats12Demo} />;
}

Props

Types

type InlineStat = { label: string; value: string };

Behavior notes

• This block intentionally uses tighter vertical padding (py-4) than the rest of the stats category's py-16 sm:py-24 sections, since it's designed to sit inline rather than as a standalone page section.
• Dividers are plain border-l elements between items (skipped on the first item); on narrow screens the row wraps and a wrapped item simply loses its leading divider along with its left margin, there is no separate mobile layout.
• Entirely static: no computation, just a direct render of the stats array in order.