<baht-alert>
Inline alert / callout.
Tones
Events (baht-dismiss, name)
<baht-alert tone="info" heading="Heads up" message="A new version is available."></baht-alert>
<baht-alert tone="success" message="Saved."></baht-alert>
<baht-alert tone="warning" message="Trial ends in 3 days."></baht-alert>
<baht-alert tone="danger" heading="Payment failed" message="Card was declined." dismissible="true"></baht-alert>| Name | Type | Default | Description |
|---|---|---|---|
tone | 'info' | 'success' | 'warning' | 'danger' | 'info' | Color (info | success | warning | danger) |
heading | string | '' | Bold first line |
message | string | '' | Body text |
dismissible | boolean | false | Show × button |
hidden | boolean | false | Plain HTML hidden attribute — not a component prop. Dismissing uses internal state and a new message/heading reshows the alert |
Events
Section titled “Events”| Event | detail | Description |
|---|---|---|
baht-dismiss | none | Close clicked (host hides it) |
name | CustomEvent |