Notification

Notifications inform or alert users about important events.

Examples

import React from 'react';
import ReactDOM from 'react-dom';
import { Notification, NotificationCenter, Button } from 'furl-components';

const notificationCenterRef = React.createRef();

ReactDOM.render(
  <div>
    <NotificationCenter 
      ref={notificationCenterRef} 
      verticalPosition='top' 
      horizontalPosition='right' 
    />
    <Button onClick={() => notificationCenterRef.current.addNotification(
      <Notification color='primary' size='large' textAlign='left'>
        This is an important notification.
      </Notification>
    )}>Add notification
    </Button>
  </div>, 
  document.getElementById('root')
);

API

Notes

• It is highly recommended to provide a ref for your NotificationCenter via the use of React.createRef(). NotificationCenter should only be used once in your app and it should be reused via ref.current for multiple modal dialogs.
• A NotificationCenter only accepts children of the Notification component type, set either normally or via the addNotification method.
• verticalPosition can be one of the following: 'top', 'centerr' or 'bottom'.
• horizontalPosition can be one of the following: 'left', 'center' or 'right'.
• color can be any of the predefined color palettes ('plain', 'primary', 'secondary', 'success', 'warning' or 'danger').
• size can be one of the following: 'small', 'normal' or 'large'.
• textAlign can be one of the following: 'left', 'center' or 'right'.