Simply notify

This is a basic notifier that you can use in your es6 projects or you can use it directly in browser.

Demo

⚙️ Installation

yarn add simply-notify

If you want to use it directly in browser check the sample.html file in project root directory.

📑 Browser support

It is build for browsers that support all modern features. Please feel free to adapt it to your custom needs.

🔌 Dependencies

Check package.json file.

📝 Documentation

import simplyNotifyObject from 'simply-notify'
simplyNotifyObject.addDanger('Danger message')
simplyNotifyObject.addInfo('Info message')
simplyNotifyObject.addSuccess('Success message')
simplyNotifyObject.addWarning('Warning message')

This code will display 4 toasts on screen. Clicking on one toast will make it disappear.

You can initialize the module to display auto-closing toast by setting a value greater then zero to timer property.

import simplyNotifyObject from 'simply-notify'
simplyNotifyObject.setTimer(2)
simplyNotifyObject.addDanger('Danger message')

This will make any toast displayed to disappear after 2 seconds.

There are four position for your messages:

BOTTOM_LEFT 
BOTTOM_RIGHT // default
TOP_LEFT
TOP_RIGHT

To set a position run

import simplyNotifyObject from 'simply-notify'
import { TOP_RIGHT } from './src/toast/Position'
simplyNotifyObject.setPosition(TOP_RIGHT)
simplyNotifyObject.addDanger('Danger message')

Then all your messages will be displayed top right position.

Defaults:

• Position: TOP_RIGHT
• No timer

When new position is set, toasts container is remove and recreated to the new position. Toasts are preserved and displayed in the new container at new location.

To see the behavior of this library please check the demo.

Development

To start webpack dev server run

yarn start

To build the project run

yarn build

To run linter run

yarn lint

✔️ Run tests

In project root directory run

yarn test

or

yarn test-watch

📜 License

See the LICENSE file for license rights and limitations.