flams_web_utils/components/
drawer.rs

1use leptos::prelude::*;
2use crate::inject_css;
3
4use super::Header;
5
6#[derive(Copy,Clone,Default)]
7pub enum DrawerSize {
8  Small,Medium,
9  #[default]
10  Wide
11}
12
13impl DrawerSize {
14  fn css(self) -> &'static str {
15    //inject_css("flams-drawer",include_str!("./drawer.css"));
16    let (cls,csstr) = match self {
17      Self::Small => ("flams-drawer-absolute-small", ".flams-drawer-absolute-small {--thaw-drawer--size:20vw !important;z-index:5;}"),
18      Self::Medium => ("flams-drawer-absolute-medium", ".flams-drawer-absolute-medium {--thaw-drawer--size:50vw !important;z-index:5;}"),
19      Self::Wide => ("flams-drawer-absolute-wide", ".flams-drawer-absolute-wide {--thaw-drawer--size:80vw !important;z-index:5;}"),
20    };
21    inject_css(cls,csstr);
22    cls
23  }
24}
25
26#[component]
27pub fn Drawer<Ch:IntoView+'static>(
28  lazy:bool,
29  trigger:super::Trigger,
30  #[prop(optional)] header:Option<Header>,
31  #[prop(optional)] size:DrawerSize,
32  children:TypedChildrenMut<Ch>
33) -> impl IntoView {
34  use thaw::{Button,ButtonAppearance,DrawerBody,OverlayDrawer,DrawerHeaderTitle,DrawerHeader,DrawerPosition,DrawerHeaderTitleAction};
35  let mut children = children.into_inner();
36  //inject_css("flams-drawer", ".flams-wide-drawer { z-index:5;}");
37  let open = RwSignal::new(false);
38  view!{
39    <span on:click=move |_| open.set(true)>{(trigger.children)()}</span>
40    <OverlayDrawer class=size.css() open position=DrawerPosition::Right>
41      <DrawerHeader><DrawerHeaderTitle>
42        <DrawerHeaderTitleAction slot>
43          <Button
44            appearance=ButtonAppearance::Subtle
45            on_click=move |_| open.set(false)>
46            "x"
47          </Button>
48        </DrawerHeaderTitleAction>
49        {header.map(|h| (h.children)())}
50      </DrawerHeaderTitle></DrawerHeader>
51      <DrawerBody>{move ||
52        if !lazy || open.get() { Some(children())}
53        else { None }
54      }</DrawerBody>
55    </OverlayDrawer>
56  }
57}
flams_web_utils/components/drawer.rs

flams_web_utils/components/
drawer.rs
