impulse_thaw/drawer/
inline_drawer.rs

1use super::{DrawerPosition, DrawerSize};
2use leptos::prelude::*;
3use thaw_components::CSSTransition;
4use thaw_utils::{class_list, mount_style, Model};
5
6#[component]
7pub fn InlineDrawer(
8    #[prop(optional, into)] class: MaybeProp<String>,
9    /// Controls the open state of the Drawer.
10    #[prop(into)]
11    open: Model<bool>,
12    /// Position of the drawer.
13    #[prop(optional, into)]
14    position: Signal<DrawerPosition>,
15    /// Size of the drawer.
16    #[prop(optional, into)]
17    size: Signal<DrawerSize>,
18    children: Children,
19) -> impl IntoView {
20    mount_style("drawer", include_str!("./drawer.css"));
21    mount_style("inline-drawer", include_str!("./inline-drawer.css"));
22    let open_drawer: RwSignal<bool> = RwSignal::new(open.get_untracked());
23
24    Effect::new(move |_| {
25        let is_open = open.get();
26        open_drawer.set(is_open);
27    });
28
29    view! {
30        <CSSTransition
31            appear=open_drawer.get_untracked()
32            show=open_drawer
33            name=Memo::new(move |_| {
34                format!("slide-in-from-{}-transition", position.get().as_str())
35            })
36        >
37            <div
38                class=class_list![
39                    "thaw-inline-drawer",
40                    move || format!("thaw-inline-drawer--position-{}", position.get().as_str()),
41                    class
42                ]
43                style=move || format!("--thaw-drawer--size: {}", size.get().as_size_str(position))
44            >
45                {children()}
46            </div>
47        </CSSTransition>
48    }
49}