Skip to main content
Sentivel Endorsed by RayfieldStatus pages and uptime monitoring for whatever you ship. Free to start.Take a look
Preview only. This is on the preview channel and is not in the stable release. It can change or be dropped before it lands there.
A progress bar shows how far through a range a value sits. It takes a range the way a slider does, reads as a percentage unless you say otherwise, and is read-only - it carries no flag and saves nothing.
Set steps to draw the track as a row of segments instead of one continuous fill, for something that moves through stages rather than a distance.
Set indeterminate when you don’t know how long the work will take. The bar sweeps instead of filling, and the first Set ends the sweep.

​
Properties

​
string
The label.
​
string
Hint text under the label. Optional.
​
string | number
An icon shown beside the label. Optional.
​
{ number }
default:"{ 0, 1 }"
The bounds, as { min, max }. With steps set and no range given, it defaults to { 0, steps } so the value counts stages.
​
number
default:"min"
The initial value. Anything outside the range is clamped.
​
number
Draw the track as this many segments. Needs at least 2; anything less is ignored and the bar stays continuous.
​
string
A fixed readout beside the label, in place of the percentage.
​
function
Build the readout yourself: (value, min, max) -> string. Ignored while text is set.
​
boolean
default:"true"
Set false to hide the readout and show the track alone.
​
boolean
default:"false"
Sweep instead of filling, for work of unknown length.

​
Handle

​
number
The current value.
​
Set the value. Ends the sweep if the bar was indeterminate.
​
number
The current value.
​
number
Where the value sits in its range, 0 to 1.
​
Move the bounds. The value comes with them, clamped to whatever the new range allows.
​
Replace the readout, or pass nothing to go back to the formatter or the percentage.
​
Switch between a real value and the waiting sweep.