DevactionUI.Slider (devaction_ui v0.1.0)

A slider for a value inside a range, and a range slider for two (a from and a to). Both are native <input type="range">, so the keyboard (arrows, Home, End, Page keys) and assistive technology work as the browser does them; the look is the canvas's. The value is shown beside the track and is the LiveView's, sent by the form's phx-change.

The range slider is two inputs on one track: the low one can never go above the high one and the other way round, which range/3 enforces on the server too.

Summary

Functions

percent(value, min, max)

Where value sits between min and max, from 0 to 100.

range(min, max, arg)

A pair {low, high} put in order and inside min and max.

range_slider(assigns)

slider(assigns)

Functions

percent(value, min, max)

@spec percent(number(), number(), number()) :: float()

Where value sits between min and max, from 0 to 100.

range(min, max, arg)

@spec range(number(), number(), {number(), number()}) :: {number(), number()}

A pair {low, high} put in order and inside min and max.

range_slider(assigns)

Attributes

id (:string) (required)
name_low (:string) (required)
name_high (:string) (required)
low (:integer) (required)
high (:integer) (required)
label (:string) - what the range is for, written above the track. Defaults to nil.
label_low (:string) (required) - names the low thumb for assistive technology.
label_high (:string) (required) - names the high thumb for assistive technology.
min (:integer) - Defaults to 0.
max (:integer) - Defaults to 100.
step (:integer) - Defaults to 1.
format (:any) - Defaults to nil.
class (:any) - Defaults to nil.
Global attributes are accepted.

slider(assigns)

Attributes

id (:string) (required)
name (:string) (required)
value (:integer) (required)
label (:string) (required)
min (:integer) - Defaults to 0.
max (:integer) - Defaults to 100.
step (:integer) - Defaults to 1.
format (:any) - number to text, for the value beside the label. Defaults to nil.
ticks (:list) - names under the track, first at the minimum and last at the maximum. Defaults to [].
disabled (:boolean) - Defaults to false.
class (:any) - Defaults to nil.
Global attributes are accepted.