103 lines
3.1 KiB
Rust
103 lines
3.1 KiB
Rust
use dioxus::prelude::*;
|
|
use dioxus_core::prelude::fc_to_builder;
|
|
use dioxus_html::FormData;
|
|
|
|
use crate::widgets::button::Button;
|
|
use crate::widgets::checkbox::CheckBox;
|
|
use crate::widgets::number::NumbericInput;
|
|
use crate::widgets::password::Password;
|
|
use crate::widgets::slider::Slider;
|
|
use crate::widgets::textbox::TextBox;
|
|
|
|
#[derive(Props)]
|
|
pub struct InputProps<'a> {
|
|
r#type: Option<&'static str>,
|
|
oninput: Option<EventHandler<'a, FormData>>,
|
|
onclick: Option<EventHandler<'a, FormData>>,
|
|
value: Option<&'a str>,
|
|
size: Option<&'a str>,
|
|
maxlength: Option<&'a str>,
|
|
width: Option<&'a str>,
|
|
height: Option<&'a str>,
|
|
min: Option<&'a str>,
|
|
max: Option<&'a str>,
|
|
step: Option<&'a str>,
|
|
checked: Option<&'a str>,
|
|
}
|
|
|
|
#[allow(non_snake_case)]
|
|
pub fn Input<'a>(cx: Scope<'a, InputProps<'a>>) -> Element<'a> {
|
|
cx.render(match cx.props.r#type {
|
|
Some("checkbox") => {
|
|
rsx! {
|
|
CheckBox{
|
|
raw_oninput: cx.props.oninput.as_ref(),
|
|
value: cx.props.value,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
checked: cx.props.checked,
|
|
}
|
|
}
|
|
}
|
|
Some("range") => {
|
|
rsx! {
|
|
Slider{
|
|
raw_oninput: cx.props.oninput.as_ref(),
|
|
value: cx.props.value,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
max: cx.props.max,
|
|
min: cx.props.min,
|
|
step: cx.props.step,
|
|
}
|
|
}
|
|
}
|
|
Some("button") => {
|
|
rsx! {
|
|
Button{
|
|
raw_onclick: cx.props.onclick.as_ref(),
|
|
value: cx.props.value,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
}
|
|
}
|
|
}
|
|
Some("number") => {
|
|
rsx! {
|
|
NumbericInput{
|
|
raw_oninput: cx.props.oninput.as_ref(),
|
|
value: cx.props.value,
|
|
size: cx.props.size,
|
|
max_length: cx.props.maxlength,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
}
|
|
}
|
|
}
|
|
Some("password") => {
|
|
rsx! {
|
|
Password{
|
|
raw_oninput: cx.props.oninput.as_ref(),
|
|
value: cx.props.value,
|
|
size: cx.props.size,
|
|
max_length: cx.props.maxlength,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
}
|
|
}
|
|
}
|
|
_ => {
|
|
rsx! {
|
|
TextBox{
|
|
raw_oninput: cx.props.oninput.as_ref(),
|
|
value: cx.props.value,
|
|
size: cx.props.size,
|
|
max_length: cx.props.maxlength,
|
|
width: cx.props.width,
|
|
height: cx.props.height,
|
|
}
|
|
}
|
|
}
|
|
})
|
|
}
|