LanternUI.Components.Meter (LanternUI v0.8.2)

Copy Markdown View Source

Meter — a scalar measurement within a known range (role="meter", WAI-ARIA APG Meter pattern). Distinct from progress, which conveys task completion. Pure server-render + CSS; no Fluxon equivalent.

<.meter value={68} label="Battery" />
<.meter value={7.2} min={0} max={14} label="pH" value_text="7.2 pH" />
<.meter value={92} low={20} high={80} optimum={50} label="CPU load" />

Summary

Functions

meter(assigns)

Functions

meter(assigns)

Attributes

  • value (:any) (required) - Current measurement (number).
  • min (:any) - Lower bound of the range. Defaults to 0.
  • max (:any) - Upper bound of the range. Defaults to 100.
  • low (:any) - Upper bound of the low region; enables optimum-based state coloring. Defaults to nil.
  • high (:any) - Lower bound of the high region; enables optimum-based state coloring. Defaults to nil.
  • optimum (:any) - Optimal value; region distance drives data-state (optimal/suboptimal/critical). Defaults to the range midpoint, (min + max) / 2, per HTML <meter>. Defaults to nil.
  • value_text (:string) - Human-readable value for aria-valuetext (e.g. "7.2 pH"). Defaults to nil.
  • size (:string) - Track height (sm ~0.375rem … lg ~0.75rem). Defaults to "md". Must be one of "sm", "md", or "lg".
  • label (:string) - Accessible name for aria-label. Defaults to "Meter".
  • class (:any) - Extra classes merged onto the root element. Defaults to nil.
  • Global attributes are accepted. Arbitrary HTML/phx-* attributes passed through.