ProgressBar is used with the value property.

Value is reactive so updating it dynamically changes the bar as well.

Custom content inside the ProgressBar is defined with the default slot.

For progresses with no value to track, set the mode property to indeterminate.

Screen Reader

ProgressBar components uses progressbar role along with aria-valuemin, aria-valuemax and aria-valuenow attributes. Value to describe the component can be defined using aria-labelledby and aria-label props.

<span id="label_status" />
<ProgressBar aria-labelledby="label_status" />

<ProgressBar aria-label="Status" />

Keyboard Support

Not applicable.

Defines valid properties in ProgressBar component.

Defines valid slots in ProgressBar component.

Defines the custom interfaces used by the module.

Custom passthrough(pt) option method.

Custom passthrough(pt) options.

Custom passthrough attributes for each DOM elements

Defines the custom types used by the module.