@perspective-dev/viewer 4.0.0

package/src/rust/components/form/select_field.rs

@@ -0,0 +1,104 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+use std::fmt::{Debug, Display};
+use std::rc::Rc;
+
+use itertools::Itertools;
+use strum::IntoEnumIterator;
+use yew::{Callback, Properties, function_component, html};
+
+use crate::components::containers::select::{Select, SelectItem};
+use crate::components::form::optional_field::OptionalField;
+
+#[derive(Properties, Debug, PartialEq, Clone)]
+pub struct SelectEnumFieldProps<T>
+where
+    T: IntoEnumIterator + Display + Default + PartialEq + Clone + 'static,
+{
+    pub label: String,
+    pub current_value: Option<T>,
+    pub on_change: Callback<Option<T>>,
+
+    #[prop_or_default]
+    pub default_value: Option<T>,
+
+    #[prop_or_default]
+    pub disabled: bool,
+}
+
+#[function_component(SelectEnumField)]
+pub fn select_enum_field<T>(props: &SelectEnumFieldProps<T>) -> yew::Html
+where
+    T: IntoEnumIterator + Debug + Display + Default + PartialEq + Clone + 'static,
+{
+    let values = yew::use_memo((), |_| T::iter().map(SelectItem::Option).collect_vec());
+    let selected = props.current_value.clone().unwrap_or_default();
+    let checked = selected != props.default_value.clone().unwrap_or_default();
+    let reset_value = props.default_value.clone();
+    html! {
+        <div class="row">
+            <OptionalField
+                label={props.label.clone()}
+                on_check={props.on_change.reform(move |_| reset_value.clone())}
+                {checked}
+                disabled={props.disabled}
+            >
+                <Select<T> {values} {selected} on_select={props.on_change.reform(Option::Some)} />
+            </OptionalField>
+        </div>
+    }
+}
+
+#[derive(Properties, Debug, PartialEq, Clone)]
+pub struct SelectValueFieldProps<T>
+where
+    T: Display + PartialEq + Clone + 'static,
+{
+    pub label: String,
+    pub current_value: Option<T>,
+    pub default_value: T,
+    pub values: Rc<Vec<T>>,
+    pub on_change: Callback<Option<T>>,
+
+    #[prop_or_default]
+    pub disabled: bool,
+}
+
+#[function_component(SelectValueField)]
+pub fn select_value_field<T>(props: &SelectValueFieldProps<T>) -> yew::Html
+where
+    T: Display + PartialEq + Clone + 'static,
+{
+    let values = yew::use_memo(props.values.clone(), |values| {
+        values.iter().cloned().map(SelectItem::Option).collect_vec()
+    });
+
+    let selected = props
+        .current_value
+        .clone()
+        .unwrap_or_else(|| props.default_value.clone());
+
+    let checked = selected != props.default_value;
+    html! {
+        <div class="row">
+            <OptionalField
+                label={props.label.clone()}
+                on_check={props.on_change.reform(|_| None)}
+                {checked}
+                disabled={props.disabled}
+            >
+                <Select<T> {values} {selected} on_select={props.on_change.reform(Option::Some)} />
+            </OptionalField>
+        </div>
+    }
+}

package/src/rust/components/function_dropdown.rs

@@ -0,0 +1,151 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+use perspective_client::config::CompletionItemSuggestion;
+use web_sys::*;
+use yew::prelude::*;
+
+use super::modal::*;
+use crate::utils::WeakScope;
+
+static CSS: &str = include_str!(concat!(env!("OUT_DIR"), "/css/function-dropdown.css"));
+
+pub enum FunctionDropDownMsg {
+    SetValues(Vec<CompletionItemSuggestion>),
+    SetCallback(Callback<CompletionItemSuggestion>),
+    ItemDown,
+    ItemUp,
+    ItemSelect,
+}
+
+pub struct FunctionDropDown {
+    values: Option<Vec<CompletionItemSuggestion>>,
+    selected: usize,
+    on_select: Option<Callback<CompletionItemSuggestion>>,
+}
+
+#[derive(Properties, PartialEq)]
+pub struct FunctionDropDownProps {
+    #[prop_or_default]
+    pub weak_link: WeakScope<FunctionDropDown>,
+}
+
+impl ModalLink<FunctionDropDown> for FunctionDropDownProps {
+    fn weak_link(&self) -> &'_ WeakScope<FunctionDropDown> {
+        &self.weak_link
+    }
+}
+
+impl Component for FunctionDropDown {
+    type Message = FunctionDropDownMsg;
+    type Properties = FunctionDropDownProps;
+
+    fn create(ctx: &Context<Self>) -> Self {
+        ctx.set_modal_link();
+        Self {
+            values: Some(vec![]),
+            selected: 0,
+            on_select: None,
+        }
+    }
+
+    fn update(&mut self, _ctx: &Context<Self>, msg: Self::Message) -> bool {
+        match msg {
+            FunctionDropDownMsg::SetCallback(callback) => {
+                self.on_select = Some(callback);
+                false
+            },
+            FunctionDropDownMsg::SetValues(values) => {
+                self.values = Some(values);
+                self.selected = 0;
+                true
+            },
+            FunctionDropDownMsg::ItemSelect => {
+                if let Some(ref values) = self.values {
+                    match values.get(self.selected) {
+                        None => {
+                            console::error_1(&"Selected out-of-bounds".into());
+                            false
+                        },
+                        Some(x) => {
+                            self.on_select.as_ref().unwrap().emit(*x);
+                            false
+                        },
+                    }
+                } else {
+                    console::error_1(&"No Values".into());
+                    false
+                }
+            },
+            FunctionDropDownMsg::ItemDown => {
+                self.selected += 1;
+                if let Some(ref values) = self.values
+                    && self.selected >= values.len()
+                {
+                    self.selected = 0;
+                };
+
+                true
+            },
+            FunctionDropDownMsg::ItemUp => {
+                if let Some(ref values) = self.values
+                    && self.selected < 1
+                {
+                    self.selected = values.len();
+                }
+
+                self.selected -= 1;
+                true
+            },
+        }
+    }
+
+    fn changed(&mut self, _ctx: &Context<Self>, _old: &Self::Properties) -> bool {
+        false
+    }
+
+    fn view(&self, _ctx: &Context<Self>) -> Html {
+        let body = html! {
+            if let Some(ref values) = self.values {
+                if !values.is_empty() {
+                    { for values
+                            .iter()
+                            .enumerate()
+                            .map(|(idx, value)| {
+                                let click = self.on_select.as_ref().unwrap().reform({
+                                    let value = *value;
+                                    move |_: MouseEvent| value
+                                });
+
+                                html! {
+                                    if idx == self.selected {
+                                        <div onmousedown={ click } class="selected">
+                                            <span style="font-weight:500">{ value.label }</span>
+                                            <br/>
+                                            <span style="padding-left:12px">{ value.documentation }</span>
+                                        </div>
+                                    } else {
+                                        <div onmousedown={ click }>
+                                            <span style="font-weight:500">{ value.label }</span>
+                                            <br/>
+                                            <span style="padding-left:12px">{ value.documentation }</span>
+                                        </div>
+                                    }
+                                }
+                            }) }
+                }
+            }
+        };
+
+        html! { <><style>{ &CSS }</style>{ body }</> }
+    }
+}

package/src/rust/components/mod.rs

@@ -0,0 +1,45 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+//! `components` contains all Yew `Component` types, but only exports the 4
+//! necessary for public Custom Elements.  The rest are internal components of
+//! these 4.
+
+pub mod column_dropdown;
+pub mod column_selector;
+pub mod containers;
+pub mod copy_dropdown;
+pub mod datetime_column_style;
+pub mod error_message;
+pub mod export_dropdown;
+pub mod expression_editor;
+pub mod filter_dropdown;
+pub mod font_loader;
+pub mod form;
+pub mod function_dropdown;
+pub mod modal;
+pub mod number_column_style;
+pub mod plugin_selector;
+pub mod render_warning;
+pub mod status_bar;
+pub mod status_bar_counter;
+pub mod status_indicator;
+pub mod string_column_style;
+pub mod style;
+pub mod type_icon;
+pub mod viewer;
+
+pub mod column_settings_sidebar;
+pub mod style_controls;
+// pub mod empty_row;
+pub mod editable_header;
+pub mod empty_row;

package/src/rust/components/modal.rs

@@ -0,0 +1,171 @@
+// ┏━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┓
+// ┃ ██████ ██████ ██████       █      █      █      █      █ █▄  ▀███ █       ┃
+// ┃ ▄▄▄▄▄█ █▄▄▄▄▄ ▄▄▄▄▄█  ▀▀▀▀▀█▀▀▀▀▀ █ ▀▀▀▀▀█ ████████▌▐███ ███▄  ▀█ █ ▀▀▀▀▀ ┃
+// ┃ █▀▀▀▀▀ █▀▀▀▀▀ █▀██▀▀ ▄▄▄▄▄ █ ▄▄▄▄▄█ ▄▄▄▄▄█ ████████▌▐███ █████▄   █ ▄▄▄▄▄ ┃
+// ┃ █      ██████ █  ▀█▄       █ ██████      █      ███▌▐███ ███████▄ █       ┃
+// ┣━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┫
+// ┃ Copyright (c) 2017, the Perspective Authors.                              ┃
+// ┃ ╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌╌ ┃
+// ┃ This file is part of the Perspective library, distributed under the terms ┃
+// ┃ of the [Apache License 2.0](https://www.apache.org/licenses/LICENSE-2.0). ┃
+// ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛
+
+use std::cell::Cell;
+use std::marker::PhantomData;
+use std::rc::Rc;
+
+use derivative::Derivative;
+use yew::html::*;
+use yew::prelude::*;
+use yew::virtual_dom::VChild;
+
+use crate::utils::WeakScope;
+
+#[derive(Clone, Default, Eq, PartialEq)]
+pub struct ModalOrientation(Rc<Cell<bool>>);
+
+impl ImplicitClone for ModalOrientation {}
+
+impl From<ModalOrientation> for bool {
+    fn from(x: ModalOrientation) -> Self {
+        x.0.get()
+    }
+}
+
+pub trait ModalLink<T>
+where
+    T: Component,
+{
+    fn weak_link(&self) -> &'_ WeakScope<T>;
+}
+
+pub trait SetModalLink {
+    fn set_modal_link(&self);
+}
+
+impl<T> SetModalLink for &Context<T>
+where
+    T: Component,
+    T::Properties: ModalLink<T>,
+{
+    fn set_modal_link(&self) {
+        *self.props().weak_link().borrow_mut() = Some(self.link().clone());
+    }
+}
+
+#[derive(Debug)]
+pub enum ModalMsg<T>
+where
+    T: Component,
+{
+    SetPos {
+        top: f64,
+        left: f64,
+        visible: bool,
+        rev_vert: bool,
+    },
+    SubMsg(T::Message),
+}
+
+#[derive(Properties, Derivative)]
+#[derivative(PartialEq(bound = ""))]
+pub struct ModalProps<T>
+where
+    T: Component,
+    T::Properties: ModalLink<T>,
+{
+    pub child: Option<VChild<T>>,
+}
+
+#[derive(Default)]
+pub struct Modal<T> {
+    css: String,
+    rev_vert: ModalOrientation,
+    _comp: PhantomData<T>,
+}
+
+impl<T> Component for Modal<T>
+where
+    T: Component,
+    T::Properties: ModalLink<T>,
+{
+    type Message = ModalMsg<T>;
+    type Properties = ModalProps<T>;
+
+    fn create(_ctx: &Context<Self>) -> Self {
+        Self {
+            css: ":host{{top:0px;left:0px;opacity:0}}".to_owned(),
+            rev_vert: Default::default(),
+            _comp: PhantomData,
+        }
+    }
+
+    fn update(&mut self, ctx: &Context<Self>, msg: ModalMsg<T>) -> bool {
+        match msg {
+            ModalMsg::SetPos {
+                top,
+                left,
+                visible,
+                rev_vert,
+            } => {
+                let opacity = if visible { "" } else { ";opacity:0" };
+                self.css = format!(":host{{top:{top}px;left:{left}px{opacity}}}");
+                self.rev_vert.0.set(rev_vert);
+                true
+            },
+            ModalMsg::SubMsg(msg) => {
+                if let Some(child) = &ctx.props().child
+                    && let Some(link) = child.props.weak_link().borrow().as_ref()
+                {
+                    link.send_message(msg);
+                }
+
+                false
+            },
+        }
+    }
+
+    fn view(&self, ctx: &Context<Self>) -> Html {
+        let child = ctx
+            .props()
+            .child
+            .clone()
+            .map(Html::from)
+            .unwrap_or_default();
+
+        html! {
+            <>
+                <style>{ self.css.to_owned() }</style>
+                <ContextProvider<ModalOrientation> context={&self.rev_vert}>
+                    <NoRender>{ child }</NoRender>
+                </ContextProvider<ModalOrientation>>
+            </>
+        }
+    }
+}
+
+#[derive(Properties, Clone)]
+pub struct NoRenderProps {
+    pub children: Children,
+}
+
+impl PartialEq for NoRenderProps {
+    fn eq(&self, _other: &Self) -> bool {
+        true
+    }
+}
+
+pub struct NoRender {}
+
+impl Component for NoRender {
+    type Message = ();
+    type Properties = NoRenderProps;
+
+    fn create(_ctx: &Context<Self>) -> Self {
+        Self {}
+    }
+
+    fn view(&self, ctx: &Context<Self>) -> Html {
+        html! { { ctx.props().children.iter().collect::<Html>() } }
+    }
+}