toast

Installation

Import Toaster and useToast from `@/components/kamod-ui/toast` and mount Toaster once near your app root.

pnpm add @kamod-ch/ui

Trigger toasts with useToast and choose variant, duration and optional actionLabel. Use Toaster position to control placement.

import { Toast } from "@/components/kamod-ui/toast";

<Toast />

Trigger a toast with title and optional description.

Dismiss notifications programmatically when workflow changes.

Show the available Sonner-style variants: default, success, info, warning and error.

Switch between all supported Toaster positions and trigger a notification.

Props, slots and variants for this component.

Toast component props and accepted values.

Prop	Type	Default
toast	`(args: { title: string; description?: string; variant?: 'default' \| 'success' \| 'info' \| 'warning' \| 'error' \| 'destructive'; actionLabel?: string; onAction?: () => void; duration?: number }) => string`	`hook function`
dismiss	`(id: string) => void`	`hook function`
Toaster	`notification outlet component`	`mounted once`
Toaster.position	`'top-left' \| 'top-center' \| 'top-right' \| 'bottom-left' \| 'bottom-center' \| 'bottom-right'`	`'bottom-right'`

Ensure critical outcomes are not communicated by toast-only messaging; keep important status visible in page content.