Notify

Notiflix Notify module can be used to send non-blocking alerts/notifications. This module includes 4 types of notifications: "Success", "Failure", "Warning", and "Info".

(A) Import as a Module

import { Notify } from 'notiflix/build/notiflix-notify-aio';

(B) Add to an HTML page (Global)

(B1) Notify Module, only JS (All in One => Internal CSS)<script src="dist/notiflix-notify-aio-X.X.X.min.js"></script>(B2) All Modules, CSS and JS<link rel="stylesheet" href="dist/notiflix-X.X.X.min.css" /><script src="dist/notiflix-X.X.X.min.js"></script>(B3) All Modules, only JS (All in One => Internal CSS)<script src="dist/notiflix-aio-X.X.X.min.js"></script>

Playground

Notify.success();

Options
@param1 {string}: Required, a text in string format.@param2 {function | Object}: Optional, a callback function that will be called when the notification element has been clicked. Or, extending the initialize options with the new options for each notification element.@param3 {Object}: Optional, extending the initialize options with new the options for each notification element. (If the second parameter has been already used for a callback function.)Notify.success('Sol lucet omnibus');

Demo

A text can be typed for the demonstration.

Notify.success('');

Notify.failure();

Options
@param1 {string}: Required, a text in string format.@param2 {function | Object}: Optional, a callback function that will be called when the notification element has been clicked. Or, extending the initialize options with the new options for each notification element.@param3 {Object}: Optional, extending the initialize options with new the options for each notification element. (If the second parameter has been already used for a callback function.)Notify.failure('Qui timide rogat docet negare');

Demo

A text can be typed for the demonstration.

Notify.failure('');

Notify.warning();

Options
@param1 {string}: Required, a text in string format.@param2 {function | Object}: Optional, a callback function that will be called when the notification element has been clicked. Or, extending the initialize options with the new options for each notification element.@param3 {Object}: Optional, extending the initialize options with new the options for each notification element. (If the second parameter has been already used for a callback function.)Notify.warning('Memento te hominem esse');

Demo

A text can be typed for the demonstration.

Notify.warning('');

Notify.info();

Options
@param1 {string}: Required, a text in string format.@param2 {function | Object}: Optional, a callback function that will be called when the notification element has been clicked. Or, extending the initialize options with the new options for each notification element.@param3 {Object}: Optional, extending the initialize options with new the options for each notification element. (If the second parameter has been already used for a callback function.)Notify.info('Cogito ergo sum');

Demo

A text can be typed for the demonstration.

Notify.info('');

Callback Function

A callback function can be added as the second parameter. The callback function can be used for all types of notifications. The notifications with the callback function do not disappear until they were clicked.

Notify.success('Click to show an alert.', () => {alert('');});

Extending the Options

Extending the initialize options with the new options for each notification element. An "options" object can be added as the second parameter. In addition, it has to be the third parameter if the second parameter has been already used for a callback function.

All Options
Notify.success('Peace at home, peace in the world.', {ID: 'MKA',timeout: 1923,showOnlyTheLastOne: true,});