Ver código
<co-toast></co-toast>
Props
| Prop | Atributo | Tipo | Default | Descripción |
|---|
actionsLayout | actions-layout | "inline" | "stacked" | 'inline' | Where action-slot content sits: inline with dismiss, or stacked on a new row below. |
description | description | string | undefined | — | Optional description below the message |
dismissible | dismissible | boolean | true | Show dismiss (X) button |
icon | icon | string | undefined | — | Leading icon (Phosphor name). Overrides the variant default. |
message | message | string | '' | Toast message (title row) |
variant | variant | "error" | "info" | "neutral" | "success" | "warning" | 'neutral' | Semantic variant — drives left accent color, icon tint, default icon, and announced ARIA role. |
Eventos
| Evento | Detail | Bubbles | Cancelable | Descripción |
|---|
coDismiss | void | ✓ | ✓ | Emitted when dismiss is clicked |
Slots
| Slot | Descripción |
|---|
action | Action area (buttons, icon buttons)
Figma variants (Tipos) are layout choices:
- Tipo=01 → message + description + dismiss
- Tipo=02 → message + dismiss
- Tipo=03 → message + stacked text actions (actionsLayout="stacked", dismissible=false)
- Tipo=04 → message + inline icon action + dismiss
Semantic `variant` adds a colored left accent + tinted icon + default icon when none provided. |
CSS Parts
| Part | Descripción |
|---|
::part(toast) | |
CSS Custom Properties
Este componente no expone CSS custom properties.