Elemental.Feedback.Progress (elemental v0.3.0)
Display progress via Daisy's progress component.
Summary
Functions
The primary progress component.
Functions
The primary progress component.
Supports both normal <progress>
HTML element as well as a radially
designed variant (backed by <div>
).
This will display as content of <progress>
(or shown inside radial)
the rounded percentage of the progress based on the value and
the max defined.
If value
is not given (or is nil
) in radial
mode then it'll be
defaulted to 0
while in the non-radial mode will trigger the
intermediate state which shows a progress bar animating.
Attributes
value
(:any
) - The current value in the progress. Must be an integer, a floating number, or a string that can be parsed as an integer or a floating number.Caveats
- If
radial
attribute is enabled this defaults to zero. - If
radial
is disabled this will trigger the intermediate state defined for the<progress>
HTML element.
Defaults to
nil
.- If
max
(:any
) - The maximum value to use. Must be an integer, a floating number, or a string that can be parsed as an integer or a floating number.Defaults to
100
.radial
(:boolean
) - Enables the radial view of the progress. Defaults tofalse
.color
(:string
) - The style to use for the progress.Caveats
If
radial
attribute is not enabled then the-content
variants of Daisy' colors are all ignored/ineffective.
Must be one of "ghost"
, "neutral"
, "primary"
, "secondary"
, "accent"
, "info"
, "success"
, "warning"
, "error"
, "neutral-content"
, "primary-content"
, "secondary-content"
, "accent-content"
, "info-content"
, "success-content"
, "warning-content"
, or "error-content"
.
class
(:any
) - Additional CSS classes to pass to the component. Defaults tonil
.- Global attributes are accepted.