Componentes

Toast

Feedback efêmero (alias do padrão Sonner; Toast Base UI ausente).

Feedback e estadospadrão de documentação

Carregando demonstração…

Código da demo
"use client";

import { toast } from "sonner";
import { Button } from "@/components/ui/button";

export function Demo() {
  return (
    <div className="flex flex-col gap-fe-3">
      <p className="fe-caption text-muted-foreground">
        Toast (Base UI) indisponível — demo via Sonner (Toaster no layout).
      </p>
      <div className="flex flex-wrap gap-fe-2">
        <Button onClick={() => toast("Notificação toast")}>Mostrar toast</Button>
        <Button variant="outline" onClick={() => toast.info("Info")}>
          Info
        </Button>
      </div>
    </div>
  );
}
Acessibilidade
Mesmas regras do Sonner; Toaster no layout.
Importar

Composição do app — não é exportada pelo pacote.

Neste repositório:

import { toast } from "sonner"
import { Toaster } from "@/components/ui/sonner"
Dependências
sonner