LineaUI.Components.Range (linea_ui v0.1.1)

Copy Markdown View Source

LineOne's range slider: a rounded track with a round thumb in the theme color, in three sizes.

<.range name="volume" value={50} color="primary" />
<.range field={@form[:level]} label="Level" min={0} max={10} size="lg" />
<.range name="opacity" phx-debounce="100" />

It is a native <input type="range">, so it submits with its form and fires phx-change as it is dragged.

Summary

Functions

range(assigns)

Renders a range slider.

Functions

range(assigns)

Renders a range slider.

Attributes

  • field (Phoenix.HTML.FormField) - Defaults to nil.
  • id (:string) - Defaults to the field's id.
  • name (:string) - Defaults to the field's name.
  • value (:any)
  • min (:any) - Defaults to nil.
  • max (:any) - Defaults to nil.
  • step (:any) - Defaults to nil.
  • color (:string) - Defaults to "neutral". Must be one of "neutral", "primary", "secondary", "info", "success", "warning", or "error".
  • size (:string) - Defaults to "md". Must be one of "sm", "md", or "lg".
  • label (:string) - The caption. Defaults to nil.
  • label_class (:any) - Classes of the caption text. Defaults to nil.
  • help (:string) - The small line under the control. Defaults to nil.
  • errors (:list) - Messages to show; field adds its own once the input was used. Defaults to [].
  • disabled (:boolean) - Defaults to false.
  • wrapper_class (:any) - Classes of the outer block (grid placement, spacing). Defaults to nil.
  • class (:any) - Defaults to nil.
  • Global attributes are accepted. Supports all globals plus: ["form", "list"].