Skip to content

co-toast

This content is not available in your language yet.

Ver código
<co-toast></co-toast>

Props

PropAtributoTipoDefaultDescripción
actionsLayoutactions-layout"inline" | "stacked"'inline'Where action-slot content sits: inline with dismiss, or stacked on a new row below.
descriptiondescriptionstring | undefinedOptional description below the message
dismissibledismissiblebooleantrueShow dismiss (X) button
iconiconstring | undefinedLeading icon (Phosphor name). Overrides the variant default.
messagemessagestring''Toast message (title row)
variantvariant"error" | "info" | "neutral" | "success" | "warning"'neutral'Semantic variant — drives left accent color, icon tint, default icon, and announced ARIA role.

Eventos

EventoDetailBubblesCancelableDescripción
coDismissvoidEmitted when dismiss is clicked

Slots

SlotDescripción
actionAction 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

PartDescripción
::part(toast)

CSS Custom Properties

Este componente no expone CSS custom properties.