Progress

Progress::bar($value) renders a linear progress bar and Progress::circle($value) a radial ring. Values count against ->max() (default 100) and are clamped into that range, so a completed import with Progress::bar(340)->max(340) fills exactly once.

Stack::make()->gap(Gap::Small)->schema([
  Progress::bar(65)->showValue(),
  Progress::bar(80)->color(Color::success())->size(Size::Lg),
  Stack::make()->direction(StackDirection::Row)->gap(Gap::Medium)->schema([
      Progress::circle(65)->showValue(),
      Progress::circle(35)->max(50)->color(Color::warning())->size(Size::Xl)->showValue(),
  ]),
]);

Value and readout

->value($value) and the constructor argument set the current value; ->max($max) sets the scale. Values clamp into 0..max.
->showValue() adds a percent readout — right of the bar, centered in the circle. The percentage is formatted for the active locale.
Screen readers get the same state through role="progressbar" with aria-valuenow/aria-valuemax and the formatted percent as aria-valuetext.

Color and size

->color() tints the fill — a colour name (Color::danger(), 'danger') or any CSS colour — and defaults to the primary color; ->size(Size $size) scales bar height or circle diameter and defaults to Size::Md.

Progress::circle(90)->color(Color::danger())->size(Size::Lg);