# Progress with steps

Progress with steps: a free component, built on your design tokens, to use for long tasks (imports, exports, uploads, migrations) that take more than a few seconds. Progress for a long task: a bar with a percentage, the time left, each step done, now and next, and a way to keep working while it runs.

Prompt: Add the OpenDesigner component progress-steps to this project: https://opendesigner.dev/library/progress-steps.html. Keep its markup and states; map its --ds-* variables to my tokens.

States: step done, current step, next step, in progress, hover, focus.

Accessibility: The bar is a progressbar with a value and a text value; steps are an ordered list with the current one marked aria-current; a polite status line names the current step; update it when the step changes, not on every percent.

File: https://opendesigner.dev/library/progress-steps.html

Catalog entry (parts, data limits, states, tokens): https://opendesigner.dev/library/progress-steps.json

Download: `curl -fsSLo progress-steps.html https://opendesigner.dev/library/progress-steps.html`