thaw/demo_markdown/docs/toast/mod.md

65 lines
2 KiB
Markdown
Raw Normal View History

2024-07-02 17:20:58 +08:00
# Toast
2024-07-03 17:27:29 +08:00
```rust demo
2024-07-11 23:30:35 +08:00
let toaster = ToasterInjection::expect_context();
2024-07-03 17:27:29 +08:00
let on_click = move |_| {
2024-07-11 23:30:35 +08:00
toaster.dispatch_toast(view! {
<Toast>
<ToastTitle>"Email sent"</ToastTitle>
<ToastBody>
"This is a toast body"
<ToastBodySubtitle slot>
"Subtitle"
</ToastBodySubtitle>
</ToastBody>
<ToastFooter>
"Footer"
// <Link>Action</Link>
// <Link>Action</Link>
</ToastFooter>
</Toast>
}.into_any(), Default::default());
2024-07-03 17:27:29 +08:00
};
2024-07-02 17:20:58 +08:00
view! {
2024-07-03 17:27:29 +08:00
<Button on_click=on_click>"Make toast"</Button>
2024-07-02 17:20:58 +08:00
}
2024-07-11 23:30:35 +08:00
```
2024-07-02 17:20:58 +08:00
2024-07-11 23:30:35 +08:00
### Toast Positions
```rust demo
2024-07-29 16:09:41 +08:00
let toaster = ToasterInjection::expect_context();
2024-07-11 23:30:35 +08:00
2024-07-29 16:09:41 +08:00
fn dispatch_toast(toaster: ToasterInjection, position: ToastPosition) {
2024-07-11 23:30:35 +08:00
toaster.dispatch_toast(view! {
<Toast>
<ToastTitle>"Email sent"</ToastTitle>
<ToastBody>
"This is a toast body"
<ToastBodySubtitle slot>
"Subtitle"
</ToastBodySubtitle>
</ToastBody>
<ToastFooter>
"Footer"
// <Link>Action</Link>
// <Link>Action</Link>
</ToastFooter>
</Toast>
}.into_any(), ToastOptions::default().with_position(position));
2024-07-29 16:08:12 +08:00
};
2024-07-11 23:30:35 +08:00
view! {
<Space>
2024-07-29 16:09:41 +08:00
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::Bottom)>"Bottom"</Button>
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::BottomStart)>"BottomStart"</Button>
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::BottomEnd)>"BottomEnd"</Button>
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::Top)>"Top"</Button>
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::TopStart)>"Topstart"</Button>
<Button on_click=move |_| dispatch_toast(toaster, ToastPosition::TopEnd)>"TopEnd"</Button>
2024-07-11 23:30:35 +08:00
</Space>
}
```