Alert Component

Basic Alert

The simplest way to display alert information

<Alert type="info">This is an information alert</Alert>

Alert with Title

Add a title using the title attribute to make the alert more prominent

<Alert type="success" title="Operation Successful">Your operation has been completed successfully</Alert>

Closeable Alert

Add the closeable attribute to allow the alert to be manually closed

<Alert type="warning" closeable={true}>Please note this warning message</Alert>

Auto-close Alert

Set the autoClose attribute to automatically close the alert after a specified time

<Alert type="success" autoClose={5000}>Closes automatically after 5 seconds</Alert>

Complete Example

Demonstrates all features of the Alert component used together

<Alert 
type="error" 
title="Submission Failed" 
closeable={true} 
autoClose={10000}
class="my-custom-class"
>
Please check the form and submit again
</Alert>