leptos-material 0.6.1

A Leptos component wrapper for Material Web Components.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48

use leptos::{
    component,
    html::{self, Input},
    slot, view, Attribute, AttributeValue, Binding, Children, IntoAttribute, IntoView, NodeRef,
    ReadSignal, RwSignal, SignalGet,
};

#[derive(Default)]
pub enum SelectStyle {
    #[default]
    Filled,
    Outlined,
}

impl SelectStyle {
    pub fn get_element_name(&self) -> String {
        match self {
            SelectStyle::Filled => "md-filled-select",
            SelectStyle::Outlined => "md-outlined-select",
        }
        .into()
    }
}

/// [MWC Docs](https://material-web.dev/components/select/)
#[component]
pub fn Select(
    #[prop(optional)] style: SelectStyle,
    children: Children,
    // #[prop(optional)] text_field_icon: Option<TextFieldIcon>,
    // #[prop(optional)] props: Vec<TextFieldProperty>,
) -> impl IntoView {
    html::custom(html::Custom::new(style.get_element_name())).child(children())
}

/// [MWC Docs](https://material-web.dev/components/select/)
#[component]
pub fn SelectOption(
    #[prop(into)] value: String,
    #[prop(attrs)] attr: Vec<(&'static str, Attribute)>,
    children: Children,
) -> impl IntoView {
    view! {
        <md-select-option value={ move || value }() {..attr}>
            {children()}
        </md-select-option>
    }
}