Nauseating Pumpkin Mush

    react-notifier-system

    0.0.7 • Public • Published

    React Notifier System

    npm version Dependency Status devDependency Status Build Status Coverage Status

    An extension of react-notification-system for showing notifications with much simpler approach.

    Screenshot

    Installing

    npm install react-notifier-system
    

    Important

    For complete documentation, please go to react-notification-system.

    Using

    For optimal appearance, this component must be rendered on a top level HTML element in your application to avoid position conflicts.

    import * as React from 'react'
    import Notifier from 'react-notifier-system'
     
    const App = class extends React.Component<{}> {
      addOrUpdateMyNotification = () => this.notifier.showNotification({
        message: 'My Notification',
        level: 'info',
        title: 'My Notification Title',
        id: 'mynotification',
      })
     
      addNotification = () => this.notifier.showNotification({
        message: 'New Notification',
        level: 'info',
        title: 'New Notification Title',
      })
     
      removeMyNotification = () => this.notifier.removeNotificationById('mynotification')
     
      notifier: any
      render() {
        return (
          <div>
            <Notifier ref={notifier => this.notifier = notifier} />
            <button onClick={this.addOrUpdateMyNotification}>Add or update my notification</button>
            <button onClick={this.removeMyNotification}>Remove my notification</button>
            <button onClick={this.addNotification}>Add new notification</button>
          </div>
        )
      }
    }
     
    ReactDOM.render(
      React.createElement(App),
      document.getElementById('app')
    );

    Methods

    showNotification(notification)

    Add or update a notification object. This displays the notification based on the object you passed. It updates the notification if save id' found in current notification list, otherwise it adds this notification.

    removeNotificationById(notificationId)

    Remove the notification by id.

    Roadmap

    • Redux implementation

    Install

    npm i react-notifier-system

    DownloadsWeekly Downloads

    3

    Version

    0.0.7

    License

    MIT

    Unpacked Size

    8.15 kB

    Total Files

    5

    Last publish

    Collaborators

    • abdul.wahid