Five stacked rows mapping 5–1 stars to amber fill bars and the percentage for each tier.
The import and the props worth knowing about, in one place.
import { Progress13 } from "@/components/beste/piece/progress13";
<Progress13
distribution={[
68,
22,
6,
3,
1
]}
/>Single horizontal bar divided into tinted segments by percentage, with a legend row below.
Row of N equal chunks with the first K filled in the chosen tone. Trailing fraction count.
A row of pill segments fills left to right beside a live percentage, flashes a check at one hundred, holds for a beat, and starts over.