Progress tracker

Progress tracker tracks a users progress throughout a task.

☝️ Research insight: During progress tracker testing, users would attempt to click on a CTA or dashboard tile prior to reaching that stage. They needed extra instruction in these areas, including dates helped users to feel more confident about next steps.

Steps can take a child component which is rendered to the right of the text (can wrap below on mobile devices), this is a pretty useful place to put a button. Supports any icon available from the iconography. If ticked prop is set, the icon is replaced with a tick.

For greater customisation, an iconSize prop can be passed to ProgressTracker.

If label and title don't satisfy your requirements, you can pass a component as the body of a Step:

You can adjust the spacing between the steps by passing a stepVerticalSpacing prop:

Matthew James Cowlishaw, Matthew David Smith and Daniel Francis Butters, each Insolvency Practitioners of Teneo Restructuring Ltd, were appointed Joint Energy Administrators of Bulb Energy Limited on 24 November 2021. The affairs, business and property of the Company are managed by the Joint Energy Administrators. The Joint Energy Administrators act as agents of the Company and contract without personal liability.