Progress Indicators

The MDC Progress Indicator component exposes common foundation and component interfaces for a progress indicator. Components that implement these interfaces include linear progress and circular progress. Material Design progress & activity requirements.

Installation

npm install @material/progress-indicator

Basic Usage

MDCProgressIndicatorFoundation API

MDC Progress Indicator Foundation exposes the following methods:

Method Signature	Description
`setDeterminate(value: boolean) => void`	Toggles the component between the determinate and indeterminate state.
`isDeterminate() => boolean`	Whether or not the component is in determinate state.
`setProgress(value: number) => void`	Sets the progress to this value. Value should be between [0, 1].
`getProgress() => number`	The current progress value in the interval [0,1].
`open() => void`	Puts the component in the open state.
`close() => void`	Puts the component in the closed state.
`isClosed() => boolean`	Whether or not the progress indicator is closed.

MDCProgressIndicator Component API

MDC Progress Indicator exposes the following API:

Method Signature	Description
`determinate: boolean`	Whether the indicator is in the determinate or indeterminate state.
`progress: number`	The current progress. Value should be between [0, 1].
`open() => void`	Puts the component in the open state.
`close() => void`	Puts the component in the closed state.