Packages
surface
0.1.1
0.12.3
0.12.2
0.12.1
0.12.0
0.11.5
0.11.4
0.11.3
0.11.2
0.11.1
0.11.0
0.10.0
0.9.5
0.9.4
0.9.3
0.9.2
0.9.1
0.9.0
0.8.4
0.8.3
0.8.2
0.8.1
0.8.0
0.7.6
0.7.5
0.7.4
0.7.3
0.7.2
0.7.1
0.7.0
0.6.1
0.6.0
0.5.2
0.5.1
0.5.0
0.4.1
0.4.0
0.3.2
0.3.1
0.3.0
0.2.1
0.2.0
0.1.1
0.1.0
0.1.0-alpha.2
0.1.0-alpha.1
0.1.0-alpha.0
A component based library for Phoenix LiveView
Current section
Files
Jump to
Current section
Files
lib/surface/components/form/range_input.ex
defmodule Surface.Components.Form.RangeInput do
@moduledoc """
An input field that let the user specify a numeric value in a given **range**,
usually using a slider.
Provides a wrapper for Phoenix.HTML.Form's `range_input/3` function.
All options passed via `opts` will be sent to `range_input/3`, `value`, `min`, `max`
and `class` can be set directly and will override anything in `opts`.
## Examples
```
<RangeInput form="volume" field="percent" min="0" max="100" step="5" value="40" opts={{ autofocus: "autofocus" }} />
```
"""
use Surface.Components.Form.Input
import Phoenix.HTML.Form, only: [range_input: 3]
import Surface.Components.Form.Utils
@doc "Minimum value for the input"
prop min, :string
@doc "Maximum value for the input"
prop max, :string
@doc "Sets or returns the value of the step attribute of the slider control"
prop step, :string
def render(assigns) do
props =
get_non_nil_props(assigns, [:value, :min, :max, :step, class: get_config(:default_class)])
event_opts = get_events_to_opts(assigns)
~H"""
<InputContext assigns={{ assigns }} :let={{ form: form, field: field }}>
{{ range_input(form, field, props ++ @opts ++ event_opts) }}
</InputContext>
"""
end
end