sonner.tsx 576 B

123456789101112131415161718192021
  1. import { Toaster as Sonner, ToasterProps } from 'sonner'
  2. import { useTheme } from '@/context/theme-provider'
  3. export function Toaster({ ...props }: ToasterProps) {
  4. const { theme = 'system' } = useTheme()
  5. return (
  6. <Sonner
  7. theme={theme as ToasterProps['theme']}
  8. className='toaster group [&_div[data-content]]:w-full'
  9. style={
  10. {
  11. '--normal-bg': 'var(--popover)',
  12. '--normal-text': 'var(--popover-foreground)',
  13. '--normal-border': 'var(--border)',
  14. } as React.CSSProperties
  15. }
  16. {...props}
  17. />
  18. )
  19. }