nes_yew/components/
text_input.rs1use std::borrow::Cow;
2use web_sys::HtmlInputElement;
3use yew::prelude::*;
4
5#[derive(Properties, PartialEq)]
6pub struct TextInputProps {
7 pub label: Option<AttrValue>,
8 pub placeholder: Option<AttrValue>,
9 #[prop_or(AttrValue::from(""))]
10 pub value: AttrValue,
11 pub on_change: Option<Callback<HtmlInputElement>>,
12 #[prop_or_default]
13 pub success: bool,
14 #[prop_or_default]
15 pub warning: bool,
16 #[prop_or_default]
17 pub error: bool,
18 #[prop_or_default]
19 pub label_inline: bool,
20 pub class: Option<Cow<'static, str>>,
21 pub style: Option<AttrValue>,
22}
23
24#[function_component(TextInput)]
25pub fn text_input(
26 TextInputProps {
27 label,
28 placeholder,
29 success,
30 warning,
31 error,
32 value,
33 on_change,
34 label_inline,
35 class,
36 style,
37 }: &TextInputProps,
38) -> Html {
39 let on_change = on_change.clone();
40 html! {
41 <div class={classes!("nes-field", if *label_inline { Some("is-inline") } else { None })}>
42 {label.as_ref().map(|l| html!{<label for="name">{l}</label>})}
43 <input
44 type="text"
45 value={value.clone()}
46 onchange={Callback::from(move |e: Event| if let Some(on_change) = on_change.clone() { on_change.emit(e.target_dyn_into::<HtmlInputElement>().unwrap()) })}
47 placeholder={placeholder.clone()}
48 class={classes!(
49 class,
50 "nes-input",
51 if *success { Some("is-success") } else { None },
52 if *warning { Some("is-warning") } else { None },
53 if *error { Some("is-error") } else { None },
54 )}
55 style={style.clone()}
56 />
57 </div>
58 }
59}