Toast

Toasts são componentes utilizados para prover feedback breve e notificações não intrusivas sobre o status de uma ação ou evento do sistema.

---

Quando usar:

• Para exibir mensagens de feedback temporárias (ex: "Item salvo com sucesso", "Erro ao processar solicitação").
• Para notificar o usuário sobre eventos do sistema que não exigem ação imediata (ex: "Arquivo processado com sucesso").
• Quando a informação a ser exibida é importante, mas não crítica a ponto de interromper o fluxo do usuário.

Quando não usar:

• Para mensagens críticas que exigem a atenção e confirmação imediata do usuário (considere usar Alert ou DialogModal).
• Quando a mensagem precisa permanecer visível indefinidamente até que o usuário a dispense manualmente (considere usar Alert).

⚠️ Observações:

Evite usar o Toast diretamente. Em vez disso, utilize-o programaticamente através do composable useToast (disponível em src/utils/composables/useToast.js) em conjunto com o componente ToastContainer. Essa abordagem centraliza o gerenciamento de múltiplos toasts e evita conflitos de renderização vários toasts são disparados simultaneamente na mesma interface.

---

Uso

<CdsToast
	variant="green"
	size="md"
	text="Lorem Ipsum"
	@click="toastClick = true"
/>

---

Preview

Mostrar log

⚡Nenhum evento foi disparado

---

Props

Nome	Tipo	Default	Opções	Descrição
title	string	'Título do toast'	--	Título do toast.
description	string	'Descrição do toast, exibida abaixo do título'	--	Texto opcional apresentado abaixo do título do toast.
dismissible	boolean	false	--	Quando true, apresenta ícone para fechar o toast.
autoDismissible	boolean	false	--	Quando true, o toast fecha-se automaticamente após o tempo definido no `dismissAfter`.
dismissAfter	number	4000	--	Tempo em milisegundos para que o toast seja automaticamente fechado. O valor padrão é 4s (4000ms).
variant	string	'info'	success info warning danger	Variante do toast. São 4 variantes implementadas: 'success', 'info', 'warning', 'danger'.
light	boolean	false	--	Especifica o tema do toast. Quando true, o toast terá o tema claro. O tema escuro é o padrão.

Events

Nome	Descrição
@dismiss
@update:modelValue	Controla a visibilidade do componente.