Overview
Track progress across multiple items.Import
Usage
Live Preview
Run Locally
npm run tsx:core-gallery
Props
- items: Array of
{ label: string; value: number; maxValue?: number; color?: string }— Rows to render. - showPercentages?: boolean — Show % text column (default true).
- showValues?: boolean — Show value/max text (default true).
- barWidth?: number — Internal layout width for bars.
- itemHeight?: number — Row height (default 2).
Methods
- updateProgress(index, value, maxValue?), setItems(items), addItem(item), removeItem(index).
- setItemLabel(index, label), setItemColor(index, color), setAllProgress(values), resetAll().
- getItem(index), getAllItems(), getTotalProgress().
- setShowPercentages(bool), setShowValues(bool), setBarWidth(n), setItemHeight(n).
Installation
Import
Quick Start
Production Examples
Best Practices
- Mantieni
itemHeight= 2 per densità ottimale; usabarWidthper testi lunghi.
