No Preview

Sorry, but you either have no stories or none are selected somehow.

If the problem persists, check the browser console, or the terminal you've run Storybook from.

Progress

Progress represents the completion progress of a task. This component is not suitable for representing a gauge (e.g. disk space usage or relevance of a query result). To represent a gauge, use the Meter component instead.

Basic

Update the value attribute of the progress bar and the text explaining the action in progress.

() => { const [value, setValue] = useState(0); const increment = () => setValue(value + 5); const className = value < 50 ? 'progress-bar--warning' : 'progress-bar--error'; useEffect(() => { const intervalID = setInterval(increment, 5000); return () => { clearInterval(intervalID); }; }, []); return <Progress value={value} className={className} />; }
No inputs found for this component. Read the docs