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

use leptos::prelude::*;

use super::BaseButton;

#[derive(Clone, Copy, Debug, Default, PartialEq, Eq)]
pub enum CompoundButtonIconPosition {
    #[default]
    Before,
    After,
}

#[component]
pub fn BaseCompoundButton(
    #[prop(optional, into)] class: MaybeProp<String>,
    #[prop(optional, into)] appearance: MaybeProp<String>,
    #[prop(optional, into)] shape: MaybeProp<String>,
    #[prop(optional, into)] size: MaybeProp<String>,
    #[prop(optional, into)] disabled: Signal<bool>,
    #[prop(optional, into)] disabled_focusable: Signal<bool>,
    #[prop(optional, into)] secondary_content: MaybeProp<String>,
    #[prop(optional)] on_click: Option<Callback<leptos::ev::MouseEvent>>,
    #[prop(optional)] icon_before: Option<Children>,
    #[prop(optional)] icon_after: Option<Children>,
    children: Children,
) -> impl IntoView {
    view! {
        <BaseButton
            class=class
            appearance=appearance
            shape=shape
            size=size
            disabled=disabled
            disabled_focusable=disabled_focusable
            nostrip:on_click=on_click
        >
            <span class="orbital-compound-button__content">
                {icon_before.map(|c| c())}
                <span class="orbital-compound-button__text">
                    <span class="orbital-compound-button__primary">{children()}</span>
                    {move || secondary_content.get().map(|text| view! {
                        <span class="orbital-compound-button__secondary">{text}</span>
                    })}
                </span>
                {icon_after.map(|c| c())}
            </span>
        </BaseButton>
    }
}