Atoms

Alert

Displays a callout for important messages.

shadcn/uiBased on shadcn/ui with Formance brand styling.

Docs

Heads up!

You can add components using the CLI.

Error

Your session has expired. Please log in again.

Installation#

npx shadcn@latest add @formance/alert

Install the following dependencies:

npm install class-variance-authority

Copy and paste the following code into your project.

Update the import paths to match your project setup.

Usage#

import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert'

<Alert>
  <AlertTitle>Transaction processing paused</AlertTitle>
  <AlertDescription>
    Payments to this ledger have been temporarily suspended. Check your
    connector configuration for details.
  </AlertDescription>
</Alert>