Alert

Component to display alerts.

Installation

Add the component to your project using the following command:

Usage

Import

Import the component and its related parts.

import { 
  Alert, 
  AlertTitle, 
  AlertDescription, 
  AlertAction 
} from 'components/selia/alert';

Structure

The expected structure and composition of the component.

<Alert>
  <AlertTitle>Alert Title</AlertTitle>
  <AlertDescription>
    Alert description goes here.
  </AlertDescription>
  <AlertAction>
    <Button>Action</Button>
  </AlertAction>
</Alert>

Minimal Usage

<Alert>
  Message goes here.
</Alert>

Props

Each component part, its responsibility, and the props it exposes.

Examples

Variants

You may use different variants of the alert by using the variant prop.

Description

Add a description to the alert by using the AlertDescription component.

Action

Add an action to the alert by using the AlertAction and Button components.