All pages

Components

Toast

Toasts are Sonner, mounted once in the root layout at bottom centre with a 3s duration — the legacy defaults, high enough above the mobile tab bar not to collide with it.

Usage

Fire toasts through showToast(message, type) from lib/toast.ts — the legacy call signature, kept so ported code reads the same. Four types; info is the default.

import { showToast } from "@/lib/toast";

showToast("List published.", "success");
showToast("Couldn't reach the server.", "error");

Surface

Sonner paints its own surface, so the wrapper hands it the theme explicitly — resolvedTheme, not theme, because “system” is not a value it understands — and maps its CSS variables onto the popover tokens: --popover ground, --border hairline, --radius corner. Icons are the Lucide set at size-4, with the loading state on a spinning Loader2.