Alert

An inline notice bar for success, info, warning, or error messages, with support for a custom title and a close button.

Basic usage

Four types

This is a regular info messageThe operation completed successfullyPlease save your current progressOperation failed, please try again later

Example

No title

No title

An alert with only body content and no title line.

Example

Closable

Closable

Click the ✕ on the right to close this alertA closable alert without a title

Example

Event feedback

Event feedback

Dispatches the oas-close event when closed

Example

API

Attributes

Attribute	Description	Type	Default
closeable	Whether to show the close button	boolean	—
title	Title text	string	—
type	Alert type	string	info

Events

Event	Description
oas-close	Dispatched after the close button is clicked; the component then hides

Slots

Name	Description
default	—

error uses role="alert", other types use role="status".