Sonner

feedback

An opinionated toast notification component built on Sonner.

Preview

Installation

npm install @launchapp/design-system
Import
import { SonnerToaster, sonnerToast } from "@launchapp/design-system";

Examples

Toast Notifications

<SonnerToaster /><Button  variant="outline"  onClick={() => sonnerToast("Event has been created")}>  Show Toast</Button>

Props

PropTypeDefaultDescription
position
"top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right""bottom-right"Position of the toast container.
expand
booleanfalseWhether toasts expand to full width.
richColors
booleanfalseWhether to use rich colors for success/error/etc.
theme
"light" | "dark" | "system""system"Color theme.