Skip to main content

perspective_viewer/components/containers/
dropdown_menu.rs

1// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
2// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
3// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
4// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
5// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
6// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
7// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
8// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
9// ┃ This file is part of the Perspective library, distributed under the terms ┃
10// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
11// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
12
13use std::marker::PhantomData;
14use std::rc::Rc;
15
16use web_sys::*;
17use yew::prelude::*;
18
19use super::select::SelectItem;
20use crate::components::style::LocalStyle;
21use crate::*;
22
23#[derive(Properties, PartialEq)]
24pub struct DropDownMenuProps<T>
25where
26    T: Into<Html> + Clone + PartialEq + 'static,
27{
28    pub values: Rc<Vec<DropDownMenuItem<T>>>,
29    pub callback: Callback<T>,
30}
31
32pub struct DropDownMenu<T>
33where
34    T: Into<Html> + Clone + PartialEq + 'static,
35{
36    _props: PhantomData<T>,
37}
38
39impl<T> Component for DropDownMenu<T>
40where
41    T: Into<Html> + Clone + PartialEq + 'static,
42{
43    type Message = ();
44    type Properties = DropDownMenuProps<T>;
45
46    fn create(_ctx: &Context<Self>) -> Self {
47        Self {
48            _props: Default::default(),
49        }
50    }
51
52    fn update(&mut self, _ctx: &Context<Self>, _msg: Self::Message) -> bool {
53        false
54    }
55
56    fn view(&self, ctx: &Context<Self>) -> Html {
57        let values = &ctx.props().values;
58        let body = if !values.is_empty() {
59            values
60                .iter()
61                .map(|value| match value {
62                    DropDownMenuItem::Option(x) => {
63                        let click = ctx.props().callback.reform({
64                            let value = x.clone();
65                            move |_: MouseEvent| value.clone()
66                        });
67
68                        html! {
69                            <span onmousedown={click} class="selected">{ x.clone().into() }</span>
70                        }
71                    },
72                    DropDownMenuItem::OptGroup(name, xs) => {
73                        html! {
74                            <>
75                                <span class="dropdown-group-label">{ name.as_ref() }</span>
76                                <div class="dropdown-group-container">
77                                    { xs.iter().map(|x| {
78                                    let click = ctx.props().callback.reform({
79                                        let value = x.clone();
80                                        move |_: MouseEvent| value.clone()
81                                    });
82                                    html! {
83                                        <span onmousedown={ click }>
84                                            { x.clone().into() }
85                                        </span>
86                                    }
87                                }).collect::<Html>() }
88                                </div>
89                            </>
90                        }
91                    },
92                })
93                .collect::<Html>()
94        } else {
95            html! { <span class="no-results">{ "No Completions" }</span> }
96        };
97
98        html! { <><LocalStyle href={css!("containers/dropdown-menu")} />{ body }</> }
99    }
100}
101
102pub type DropDownMenuItem<T> = SelectItem<T>;