Log inGet started
World

Builtin Library

Branchmain
Branchesmainpublish
Commitdd348ac6c3

README.md

progressBar

Horizontal progress bar — a Luau builder over canvas with fillWidth + "N%" coords. Emits two stacked kind = "rect" commands: a full-width track plus a percent-of-width fill clipped to the value. value is clamped to [0, 1] so out-of-range inputs don't paint outside the canvas.

Exports

  • progressBar(value: number?, opts: Opts?) -> any — build the canvas widget node. Returned directly by the module.

Types:

  • Style = { height?: number, color?: string, borderRadius?: number }
  • Opts = { id?: string, classes?: any, color?: string, trackColor?: string, style?: Style }

Usage

local progressBar = require("@builtin::modules.zui.widget.progressBar")

local widget1 = progressBar(0.42)
local widget2 = progressBar(value, { color = "#7BC97B", trackColor = "#222" })

Notes

  • A11y: the canvas declares role = "progressbar" and ARIA value attrs (ariaValueNow, ariaValueMin = 0, ariaValueMax = 1) so the DOM mirror exposes the same shape as a native <progress>.
  • style.borderRadius defaults to height / 2 for a pill silhouette. Override to 0 for a sharp-cornered look.
  • The fill rect's max.x is a "N%" string — width resolves at paint time via fillWidth = true, so the builder doesn't need to know the canvas's pixel width at construction time.