Skip to main content

​
Introduction

Use the <Alert> component to display a message to the user. The component can be used to display a success, warning, or error message.

​
Usage

To use <Alert> in your React component, import it from @latitude-data/react and include it in your component as follows: 
import { Alert } from '@latitude-data/react';

const MyComponent = () => (
  <Alert
    type='note'
    secondary={true}
    centerText={false}
    fontWeight='medium'
  >
    Your text here for the alert
  </Alert>
);

​
Properties

​
type
string
required
Change the style of the alert. Options are:
  • note
  • success
  • warning
  • error
​
secondary
boolean
In combination with type it produce a different style for the alert with a softer background when is set to true
​
centerText
boolean
By default text in the alert is centered. If you want to be left aligned set it to false
​
fontWeight
string
Controls how the text inside the alert is presented. Options are:
  • normal
  • medium
  • bold By defaul is set to normal.