#toast #dioxus #component #toast-manager #toast-info

dioxus-toast

Add toast support in your dioxus project

11 unstable releases (5 breaking)

0.6.0 Feb 10, 2025
0.5.0 Dec 11, 2024
0.4.0 Sep 9, 2024
0.3.0 Dec 12, 2023
0.1.3 Mar 10, 2022

#714 in GUI

Download history 1/week @ 2024-12-03 169/week @ 2024-12-10 6/week @ 2024-12-17 14/week @ 2024-12-24 6/week @ 2025-01-07 1/week @ 2025-01-14 60/week @ 2025-02-04 58/week @ 2025-02-11 48/week @ 2025-02-18 42/week @ 2025-02-25 61/week @ 2025-03-04 44/week @ 2025-03-11

198 downloads per month

MIT license

41KB
246 lines

Dioxus Toast

Add toast support for your dioxus project.

use dioxus::prelude::*;
use dioxus_toast::{ToastInfo, ToastManager};

fn main() {
    launch(app)
}

fn app() -> Element {
    std::panic::set_hook(Box::new(|info| {
        println!("Panic: {}", info);
    }));

    let mut toast = use_signal(|| ToastManager::default());

    rsx! {
        dioxus_toast::ToastFrame {
            manager: toast
        }
        div {
            button {
                onclick: move |_| {
                    let _id = toast.write().popup(ToastInfo::simple("hello world"));
                    println!("New Toast ID: {}", _id);
                },
                "Normal Toast"
            }
            button {
                onclick: move |_| {
                    let _id = toast.write().popup(ToastInfo::success("Hello World!", "Success"));
                    println!("New Toast ID: {}", _id);
                },
                "Success Toast"
            }
            button {
                onclick: move |_| {
                    let _id = toast.write().popup(ToastInfo {
                        heading: Some("top-right".into()),
                        context: "Top Right Toast".into(),
                        allow_toast_close: true,
                        position: dioxus_toast::Position::TopRight,
                        icon: None,
                        hide_after: None
                    });
                },
                "Top Right"
            }
        }
    }
}

Use Toast for different component

use dioxus::prelude::*;

fn main() {
    launch(app)
}

fn app() -> Element {
    let toast = use_context_provider(|| Signal::new(ToastManager::default()));
    rsx! {
        ToastFrame { manager: toast }
        div {
            hello {}
        }
    }
}

#[component]
fn hello() -> Element {
    // use_context can help you pass toast-manager to different components
    let mut toast: Signal<ToastManager> = use_context();
    rsx! {
        button {
            onclick: move |_| {
                let _ = toast.write().popup(ToastInfo::simple("hello world"));
            }
            "Click here!"
        }
    }
}

Dependencies

~4–48MB
~697K SLoC