#leptos #toast #toaster

leptos_toaster

A Toaster component for Leptos

8 releases

0.1.7 May 20, 2024
0.1.6 May 2, 2024
0.1.3 Mar 9, 2024
0.1.2 Feb 6, 2024

#9 in #toast

Download history 39/week @ 2024-11-27 60/week @ 2024-12-04 27/week @ 2024-12-11 11/week @ 2024-12-18 7/week @ 2025-01-01 23/week @ 2025-01-08 6/week @ 2025-01-15 17/week @ 2025-01-22 23/week @ 2025-01-29 3/week @ 2025-02-05 33/week @ 2025-02-12 1/week @ 2025-02-19 51/week @ 2025-02-26 1/week @ 2025-03-05 10/week @ 2025-03-12

65 downloads per month

MIT license

525KB
711 lines

Example

leptos_toaster

A Toaster component for Leptos heavily inspired by sonner

SSR

If using SSR don't forget to set the features in your own Project correctly

[features]
ssr = ["leptos_toaster/ssr"]
hydrate = ["leptos_toaster/hydrate"]

Usage

Somewhere, probably near the top of your component tree, add the Toaster component

view! {
	<Toaster
	    position=toaster::ToasterPosition::BottomCenter
	>
		// ...
	</Toaster>
}

and then whenever you need a toast, do

let toast_context = expect_context::<Toasts>();

let create_toast = move || {
	let toast_id = ToastId::new();
	toast_context.toast(
		// This uses the built in toast component that requires the `builtin_toast` feature.
		// You can use your own components here
		view! { 
			<Toast 
				toast_id 
				variant=ToastVariant::Info 
				title=view! {"My toast"}.into_view() 
			/> 
		},
		Some(toast_id),
		None // options
	);
}

Dependencies

~20–33MB
~512K SLoC