Bar list

Ranked rows with a bar behind each name, for top pages, sources or countries.

Installation

npx plankui@latest add bar-list

import { BarList } from "@/components/ui/bar-list";

<BarList columns={["Page", "Visits"]} items={[{ name: "/pricing", value: 3210 }]} limit={5} />

Prop	Type	Default	Description
items	{ name; value; icon?; href? }[]	required	The rows.
sorted	boolean	true	Largest first.
limit	number		Show this many, with a toggle for the rest.
columns	[string, string]		Header labels.
format	(n: number) => string		Value format.