orbital-base-components 0.1.1

Headless base primitives for Orbital — structure, semantics, and accessibility
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51

use leptos::prelude::*;

use super::injection::FloatingActionsMenuInjection;

#[component]
pub fn BaseFloatingActionsMenuItem(
    #[prop(into)] tooltip: String,
    #[prop(optional)] on_click: Option<Callback<()>>,
    #[prop(optional, into)] testid: MaybeProp<String>,
    children: Children,
) -> impl IntoView {
    let ctx = FloatingActionsMenuInjection::expect_context();
    let aria_label = tooltip.clone();
    let tooltip_text = tooltip;
    let on_click = move |_| {
        if let Some(on_click) = on_click.as_ref() {
            on_click.run(());
        }
        ctx.open.set(false);
    };

    view! {
        <div
            class="orbital-floating-actions-menu__item"
            style:display=move || if ctx.open.get() { "flex" } else { "none" }
        >
            <span
                class="orbital-floating-actions-menu__tooltip"
                style:display=move || {
                    if ctx.open.get() && ctx.persistent_tooltips.get() {
                        "inline"
                    } else {
                        "none"
                    }
                }
            >
                {tooltip_text.clone()}
            </span>
            <button
                type="button"
                class="orbital-floating-actions-menu__action"
                aria-label=aria_label.clone()
                title=tooltip_text
                data-testid=move || testid.get()
                on:click=on_click
            >
                {children()}
            </button>
        </div>
    }
}