Skip to main content

dioxus_tw_components/components/
slider.rs

1use dioxus::prelude::*;
2
3#[derive(Default, Clone, PartialEq, Props)]
4pub struct SliderProps {
5    #[props(extends = input, extends = GlobalAttributes)]
6    attributes: Vec<Attribute>,
7
8    #[props(optional)]
9    default_value: i64,
10    #[props(optional, default = 0)]
11    min: i64,
12    #[props(optional, default = 100)]
13    max: i64,
14    #[props(optional, default = 10)]
15    step: i64,
16
17    #[props(optional)]
18    value: Signal<i64>,
19
20    #[props(optional)]
21    onchange: EventHandler<FormEvent>,
22}
23
24#[component]
25pub fn Slider(mut props: SliderProps) -> Element {
26    let default_classes = "slider";
27    crate::setup_class_attribute(&mut props.attributes, default_classes);
28
29    let oninput = move |event: FormEvent| {
30        props.value.set(event.data.value().parse().unwrap_or(0));
31        props.onchange.call(event);
32    };
33
34    rsx! {
35        input {
36            class: "slider",
37            r#type: "range",
38            min: props.min.to_string(),
39            max: props.max.to_string(),
40            step: props.step.to_string(),
41            value: props.default_value.to_string(),
42            oninput,
43            ..props.attributes
44        }
45    }
46}
47
48#[derive(Clone, PartialEq, Props)]
49pub struct SliderLabelProps {
50    #[props(extends = div, extends = GlobalAttributes)]
51    attributes: Vec<Attribute>,
52
53    #[props(optional, default = 0)]
54    value: i64,
55    #[props(optional, default = 100)]
56    max: i64,
57}
58
59#[component]
60pub fn SliderLabel(mut props: SliderLabelProps) -> Element {
61    let default_classes = "slider-label";
62    crate::setup_class_attribute(&mut props.attributes, default_classes);
63
64    rsx! {
65        div {..props.attributes,
66            {props.value.to_string()}
67            " / "
68            {props.max.to_string()}
69        }
70    }
71}