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>
|
|
|
|
}
|
|
|
|
```
|