ybc/components/
menu.rs

1use yew::prelude::*;
2
3#[derive(Clone, Debug, Properties, PartialEq)]
4pub struct MenuProps {
5    #[prop_or_default]
6    pub children: Children,
7    #[prop_or_default]
8    pub classes: Classes,
9}
10
11/// A simple menu, for any type of vertical navigation.
12///
13/// [https://bulma.io/documentation/components/menu/](https://bulma.io/documentation/components/menu/)
14#[function_component(Menu)]
15pub fn menu(props: &MenuProps) -> Html {
16    html! {
17        <aside class={classes!("menu", props.classes.clone())}>
18            {props.children.clone()}
19        </aside>
20    }
21}
22
23//////////////////////////////////////////////////////////////////////////////
24//////////////////////////////////////////////////////////////////////////////
25
26#[derive(Clone, Debug, Properties, PartialEq)]
27pub struct MenuListProps {
28    /// The child `li` elements of this list.
29    #[prop_or_default]
30    pub children: Children,
31    #[prop_or_default]
32    pub classes: Classes,
33}
34
35/// A container for menu list `li` elements.
36///
37/// [https://bulma.io/documentation/components/menu/](https://bulma.io/documentation/components/menu/)
38#[function_component(MenuList)]
39pub fn menu_list(props: &MenuListProps) -> Html {
40    html! {
41        <ul class={classes!("menu-list", props.classes.clone())}>
42            {props.children.clone()}
43        </ul>
44    }
45}
46
47//////////////////////////////////////////////////////////////////////////////
48//////////////////////////////////////////////////////////////////////////////
49
50#[derive(Clone, Debug, Properties, PartialEq)]
51pub struct MenuLabelProps {
52    #[prop_or_default]
53    pub classes: Classes,
54    /// The text of the label.
55    #[prop_or_default]
56    pub text: String,
57}
58
59/// A label for a section of the menu.
60///
61/// [https://bulma.io/documentation/components/menu/](https://bulma.io/documentation/components/menu/)
62#[function_component(MenuLabel)]
63pub fn menu_label(props: &MenuLabelProps) -> Html {
64    html! {
65        <p class={classes!("menu-label", props.classes.clone())}>
66            {props.text.clone()}
67        </p>
68    }
69}