Path Stages

ProNew

A guided path of chevron stages for pipelines and approvals: completed stages with a check, the current stage, upcoming ones, all clickable.

Customize

This item has no props to tune. Use the lens above to change theme, density, direction and more.


pnpm dlx shadcn@latest add @tealmac/path-stages

Prop	Type	Default	Description
`stages`	`{ id, label }[]`	`-`	The stages in order.
`current / defaultCurrent`	`string`	`first`	Current stage id.
`onCurrentChange`	`(id: string) => void`	`-`	Called on select.
`reached`	`string`	`current`	The furthest stage reached; earlier ones are complete.
`label`	`string`	`-`	Names the nav.