Catalog Progress

<.progress_bar>

ConnieUI.Progress

HEEx 
<div class="w-sm">
  <ConnieUI.Progress.progress_bar value={40} />
</div>

Variant matrix

Every combination of one or two attributes, side by side.

Controls

:integer
:integer
:integer
:string

If set, shows the percentage label in the given position relative to the bar.

let the browser own the motion, for a bar driven by a stream of server updates. See `progress_bar_base/1`.

Set by the example

class

Docs

Progress bar, based on UntitledUI Progress.ProgressBar. ## Examples <ConnieUI.Progress.progress_bar value={40} /> <ConnieUI.Progress.progress_bar value={40} label_position="right" /> <ConnieUI.Progress.progress_bar value={40} label_position="bottom" />
Attribute Type Default Description
value * :integer
min :integer 0
max :integer 100
label_position :string nil
If set, shows the percentage label in the given position relative to the bar. nil | right | bottom
animated :boolean false
let the browser own the motion, for a bar driven by a stream of server updates. See `progress_bar_base/1`.
class :any nil
rest :global