import { Toaster as SonnerToaster, toast } from 'sonner'
import { useTheme } from '@/stores/ThemeProvider'

/**
 * Toast notification provider — sonner с handoff Toast styling (Screen 4).
 *
 * <p>Handoff spec: navy bg (or Claude-orange в dark theme), "OK" cap header в
 * toast-cap color (orange-cream), then message text, then × dismiss button.
 * Auto-dismiss после 4s. Slide-up bottom-right.
 *
 * <p>Sonner = headless library. Кастомизируем через CSS overrides — наша
 * navy color tokens применяются к bg/text/border.
 *
 * Использование:
 * <pre>
 * import { toast } from '@/ui'
 * toast.success('Запись сохранена')
 * toast.error('Ошибка валидации', { description: '...' })
 * toast.promise(mutateAsync(), {loading, success, error})
 * </pre>
 */
export function Toaster() {
  const { resolved } = useTheme()

  return (
    <SonnerToaster
      position="bottom-right"
      // richColors=false — наши custom colors из tokens, не sonner default.
      closeButton
      theme={resolved}
      duration={4000}
      toastOptions={{
        // Handoff toast — navy bg, on-accent text (cream/white), no border.
        // Cap-style "OK / ERROR / INFO" header идёт через title classname.
        style: {
          background: 'var(--color-navy)',
          color: 'var(--color-on-accent)',
          border: 'none',
          borderRadius: 'var(--radius-lg)',
          fontFamily: 'var(--font-sans)',
          fontSize: '13px',
          padding: '12px 16px',
          boxShadow: '0 12px 30px -10px rgba(40,25,10,0.38)',
        },
        classNames: {
          // Title всегда выше description; cap-style для статуса/labels.
          title: 'text-body font-medium',
          description: 'text-cell opacity-80 mt-0.5',
          // success/error/info variants — accent через left border (handoff).
          success: '!border-l-4 !border-l-[var(--color-green)]',
          error: '!border-l-4 !border-l-[var(--color-pink)]',
          info: '!border-l-4 !border-l-[var(--color-accent)]',
          warning: '!border-l-4 !border-l-[var(--color-warn)]',
        },
      }}
    />
  )
}

// Re-export для удобства: `import { toast } from '@/ui'`.
export { toast }
