material_yew/list/
check_list_item.rs

1use crate::bool_to_option;
2use crate::list::request_selected::request_selected_listener;
3use crate::list::{GraphicType, RequestSelectedDetail};
4use gloo::events::EventListener;
5use wasm_bindgen::prelude::*;
6use yew::prelude::*;
7
8#[wasm_bindgen(module = "/build/mwc-check-list-item.js")]
9extern "C" {
10    #[derive(Debug)]
11    type CheckListItem;
12
13    #[wasm_bindgen(getter, static_method_of = CheckListItem)]
14    fn _dummy_loader() -> JsValue;
15}
16
17loader_hack!(CheckListItem);
18
19/// The `mwc-check-list-item` component
20///
21/// [MWC Documentation](https://github.com/material-components/material-components-web-components/tree/v0.27.0/packages/list#checklist)
22pub struct MatCheckListItem {
23    node_ref: NodeRef,
24    request_selected_listener: Option<EventListener>,
25}
26
27/// Props for [`MatCheckListItem`]
28///
29/// MWC Documentation for [properties](https://github.com/material-components/material-components-web-components/tree/v0.27.0/packages/list#mwc-check-list-item)
30/// and [events](https://github.com/material-components/material-components-web-components/tree/v0.27.0/packages/list#mwc-check-list-item-1)
31#[derive(Debug, Properties, PartialEq, Clone)]
32pub struct CheckListItemProps {
33    #[prop_or_default]
34    pub left: bool,
35    #[prop_or(GraphicType::Control)]
36    pub graphic: GraphicType,
37    #[prop_or_default]
38    pub disabled: bool,
39    #[prop_or_default]
40    pub on_request_selected: Callback<RequestSelectedDetail>,
41    #[prop_or_default]
42    pub selected: bool,
43    pub children: Children,
44}
45
46impl Component for MatCheckListItem {
47    type Message = ();
48    type Properties = CheckListItemProps;
49
50    fn create(_: &Context<Self>) -> Self {
51        CheckListItem::ensure_loaded();
52        Self {
53            node_ref: NodeRef::default(),
54            request_selected_listener: None,
55        }
56    }
57
58    fn view(&self, ctx: &Context<Self>) -> Html {
59        let props = ctx.props();
60        html! {
61             <mwc-check-list-item
62                 left={bool_to_option(props.left)}
63                 graphic={props.graphic.as_str()}
64                 disabled={props.disabled}
65                 selected={props.selected}
66                 ref={self.node_ref.clone()}
67             >{props.children.clone()}</mwc-check-list-item>
68        }
69    }
70
71    fn rendered(&mut self, ctx: &Context<Self>, _first_render: bool) {
72        let props = ctx.props();
73        if self.request_selected_listener.is_none() {
74            self.request_selected_listener = Some(request_selected_listener(
75                &self.node_ref,
76                props.on_request_selected.clone(),
77            ));
78        }
79    }
80}
material_yew/list/check_list_item.rs

material_yew/list/
check_list_item.rs
