LanternUI.Components.Progress (LanternUI v0.8.1)

Copy Markdown View Source

Progress bar / meter — determinate or indeterminate. Pure server-render + CSS.

<.progress value={40} />
<.progress indeterminate label="Loading" />
<.progress value={72} color="success" shimmer label="Uploading" />

Summary

Functions

progress(assigns)

Attributes

  • value (:integer) - Percent complete 0–100; nil is indeterminate. Defaults to nil.
  • indeterminate (:boolean) - Force indeterminate state (also true when value is nil). Defaults to false.
  • size (:string) - Track height (sm ~0.375rem … lg ~0.75rem). Defaults to "md". Must be one of "sm", "md", or "lg".
  • color (:string) - Semantic fill color token. Defaults to "accent". Must be one of "primary", "accent", "success", "warning", "danger", "info", or "neutral".
  • shimmer (:boolean) - Animated sheen on the determinate fill (e.g. active upload). Defaults to false.
  • label (:string) - Accessible name for aria-label. Defaults to "Progress".
  • class (:any) - Extra classes merged onto the root element. Defaults to nil.
  • Global attributes are accepted. Arbitrary HTML/phx-* attributes passed through.