patternfly_dioxus/
dropdown.rs

1use dioxus::prelude::*;
2
3#[allow(non_snake_case,dead_code)]
4#[inline_props]
5pub fn PfDropDownRaw<'a>(
6    cx: Scope<'a>,
7    children: Element<'a>,
8    selected: UseState<String>,
9) -> Element {
10    let is_hide = use_state(&cx, || true);
11    let buttoncss = if *is_hide.get() {
12        "pf-c-dropdown__toggle"
13    } else {
14        "pf-c-dropdown__toggle pf-m-expanded"
15    };
16    cx.render(rsx! {
17        div { class: "pf-c-dropdown",
18            button { class: "{buttoncss}", aria_expanded: "false",
19                onclick: move |_| { is_hide.set(!is_hide.get()); },
20                span { class: "pf-c-dropdown__toggle-text", "{selected}" },
21                span { class: "pf-c-dropdown__toggle-icon",
22                    i { class: "fas fa-angle-down", aria_hidden: "false" }
23                }
24            }
25            div { class: "pf-c-dropdown__menu", hidden: "{is_hide}", onclick:  |_| {is_hide.set(!is_hide.get());},
26                children
27            }
28        }
29    })
30}
31
32#[allow(non_snake_case,dead_code)]
33#[inline_props]
34pub fn PfDropDownItem<'a>(
35    cx: Scope<'a>,
36    children: Element<'a>,
37    item_str: String,
38    selected: UseState<String>,
39) -> Element {
40    cx.render(rsx! {
41        span { class: "pf-c-dropdown__menu-item",
42            onclick: move |_| { selected.set(item_str.clone()) },
43            children
44        }
45    })
46}
47
48#[allow(non_snake_case,dead_code)]
49#[inline_props]
50pub fn PfDropDown(cx: Scope, list: Vec<String>, selected: UseState<String>) -> Element {
51    let is_hide = use_state(&cx, || true);
52    let buttoncss = if *is_hide.get() {
53        "pf-c-dropdown__toggle"
54    } else {
55        "pf-c-dropdown__toggle pf-m-expanded"
56    };
57    cx.render(rsx! {
58        div { class: "pf-c-dropdown",
59            button { class: "{buttoncss}", aria_expanded: "false",
60                onclick: move |_| { is_hide.set(!is_hide.get()); },
61                span { class: "pf-c-dropdown__toggle-text", "{selected}" },
62                span { class: "pf-c-dropdown__toggle-icon",
63                    i { class: "fas fa-angle-down", aria_hidden: "false" }
64                }
65            }
66            div { class: "pf-c-dropdown__menu", hidden: "{is_hide}",
67                list.iter().map(|data|{ rsx!{
68                    a { class: "pf-c-dropdown__menu-item", onclick: move |_| { selected.set(data.clone()); is_hide.set(!is_hide.get()); },
69                        "{data}"
70                    }
71                }})
72            }
73        }
74    })
75}
76
77#[allow(non_snake_case,dead_code)]
78#[inline_props]
79pub fn PfDropDownWithId(cx: Scope, list: Vec<(u64, String)>, selected: UseState<u64>) -> Element {
80    let is_hide = use_state(&cx, || true);
81    let selected_str = use_state(&cx, || "".to_string());
82    let buttoncss = if *is_hide.get() {
83        "pf-c-dropdown__toggle"
84    } else {
85        "pf-c-dropdown__toggle pf-m-expanded"
86    };
87    cx.render(rsx! {
88        div { class: "pf-c-dropdown",
89            button { class: "{buttoncss}",  aria_expanded: "false",
90                onclick: move |_| { is_hide.set(!is_hide.get()); },
91                span { class: "pf-c-dropdown__toggle-text", "{selected_str}" },
92                span { class: "pf-c-dropdown__toggle-icon",
93                    i { class: "fas fa-angle-down", aria_hidden: "false" }
94                }
95            }
96            div { class: "pf-c-dropdown__menu", hidden: "{is_hide}",
97            // list
98            list.iter().map(|data|{ rsx!{
99                a { class: "pf-c-dropdown__menu-item", onclick: move |_| { selected_str.set(data.1.clone()) ;selected.set(data.0); is_hide.set(!is_hide.get()); },
100                    "{data.1}"
101                }
102            }}),
103            }
104        }
105    })
106}
patternfly_dioxus/dropdown.rs

patternfly_dioxus/
dropdown.rs
