melt_ui/switch/
mod.rs

1mod theme;
2
3use crate::{mount_style, theme::use_theme, utils::maybe_rw_signal::MaybeRwSignal, Theme};
4use leptos::*;
5pub use theme::SwitchTheme;
6
7#[component]
8pub fn Switch(#[prop(optional, into)] value: MaybeRwSignal<bool>) -> impl IntoView {
9    mount_style("switch", include_str!("./switch.css"));
10    let theme = use_theme(Theme::light);
11    let css_vars = create_memo(move |_| {
12        let mut css_vars = String::new();
13        theme.with(|theme| {
14            css_vars.push_str(&format!(
15                "--melt-background-color: {};",
16                theme.switch.background_color
17            ));
18            css_vars.push_str(&format!(
19                "--melt-background-color-active: {};",
20                theme.common.color_primary
21            ));
22        });
23        css_vars
24    });
25    view! {
26        <div
27            class="melt-switch"
28            class=("melt-switch--active", move || value.get())
29            style=move || css_vars.get()
30            on:click=move |_| value.set(!value.get_untracked())
31        >
32            <div class="melt-switch__button"></div>
33        </div>
34    }
35}