V Vaylan UI
Feedback

Alert

Communicate important information and outcomes.

Preview

Example

<.alert color={:info} variant={:soft}>Your report is being prepared.</.alert>

API contract

alert/1 uses declared Phoenix attributes and slots. This table is generated from the compiled component metadata.

AttributeTypeRequiredDefaultAccepted values
color :atom No nil [nil, :info, :success, :warning, :error]
variant :atom No nil [nil, :outline, :dash, :soft]
class :any No nil Any value matching the declared type
rest :global No Any value matching the declared type
SlotRequiredSlot attributes
icon No No slot attributes
inner_block Yes No slot attributes
actions No No slot attributes

States and behavior

Semantic text accompanies visual treatment so status is not conveyed through color or motion alone.

Keyboard and accessibility