Sonner
An opinionated toast notification, powered by svelte-sonner.
Installation
Installs the style saved in lily.json. For a new Diamond project,
run lily-svelte init --style diamond first.
Install the lily base and `utils` (run once per project).
npx lily-svelte@latest init Add the `svelte-sonner`
dependency and copy the source into $lib/components/ui/sonner.
Usage
Add the Toaster to your root layout once:
<script lang="ts">
import { Toaster } from '$lib/components/ui/sonner';
</script>
<Toaster /> Then trigger toasts from anywhere:
<script lang="ts">
import { toast } from 'svelte-sonner';
import { Button } from '$lib/components/ui/button';
</script>
<Button onclick={() => toast('Event created')}>Show toast</Button>