Files
Momento/memento-note/components/ui/toast.tsx

39 lines
1.3 KiB
TypeScript

'use client'
import { Toaster as SonnerToaster, toast as sonnerToast } from 'sonner'
// Re-export toast functions from Sonner
export const toast = sonnerToast
// Toaster component — styled for Memento paper/ink design system
export function Toaster() {
return (
<SonnerToaster
position="bottom-right"
expand={false}
richColors={false}
closeButton
duration={3500}
className="toaster font-sans"
toastOptions={{
classNames: {
toast: [
'toast pointer-events-auto border-none',
'bg-[var(--color-memento-ink)] text-[var(--color-memento-paper)]',
'rounded-xl shadow-acrylic',
'text-[13px] font-medium py-3 px-4',
].join(' '),
description: 'text-[var(--color-memento-paper)]/70 text-[12px]',
actionButton: 'bg-[var(--color-memento-paper)] text-[var(--color-memento-ink)] text-[11px] font-bold rounded-lg px-4 py-1.5 hover:opacity-90 transition-opacity',
closeButton: 'bg-white/10 text-[var(--color-memento-paper)]/70 border-white/10 hover:bg-white/20',
success: 'border-l-4 border-l-emerald-400',
error: 'border-l-4 border-l-red-400',
warning: 'border-l-4 border-l-amber-400',
info: 'border-l-4 border-l-zinc-400',
},
}}
/>
)
}