Notiflix for React

Import All In One (Internal CSS)

import React, { Component } from "react"; ... ... import Notiflix from "notiflix-react"; ...

Or import CSS and JS separately

import React, { Component } from "react"; ... ... import "notiflix-react/dist/notiflix-react-X.X.X.css"; import Notiflix from "notiflix-react/dist/notiflix-react-X.X.X"; ...

import React, { Component } from "react"; ... import Notiflix from "notiflix-react"; ... class YourClass extends Component { ... componentDidMount() { ... // Init the module you want to use. e.g. Notify Module Notiflix.Notify.Init({}); // Or init the module with some options. e.g. Notify Module Notiflix.Notify.Init({ width:'300px', position:'right-top', distance:'15px', }); ... ... } ... }

// Notiflix Notify Notiflix.Notify.Success('Success Message'); Notiflix.Notify.Failure('Failure Message'); Notiflix.Notify.Warning('Warning Message'); Notiflix.Notify.Info('Info Message Text'); // Notiflix Notify with a callback. e.g. Notify Success Notiflix.Notify.Success('Click Me', function(){ // Callback console.log('Notiflix!'); }); // Notiflix Report Notiflix.Report.Success('Success Tittle','Success Message','Success Button Text'); Notiflix.Report.Failure('Failure Tittle','Failure Message','Failure Button Text'); Notiflix.Report.Warning('Warning Tittle','Warning Message','Warning Button Text'); Notiflix.Report.Info('Info Tittle','Info Message','Info Button Text'); // Notiflix Report with a callback. e.g. Report Failure Notiflix.Report.Failure( 'Title', 'Message', 'Button Text', function(){ // Callback console.log('Notiflix!'); } ); // Notiflix Confirm Notiflix.Confirm.Show( 'Notiflix Confirm', 'Do you agree with me?', 'Yes' ); // Notiflix Confirm with a callback. Notiflix.Confirm.Show( 'Notiflix Confirm', 'Do you agree with me?', 'Yes', 'No', function(){ // Callback console.log('Thank you.'); } ); // Notiflix Loading // Only loading indicator Notiflix.Loading.Standard(); Notiflix.Loading.Hourglass(); Notiflix.Loading.Circle(); Notiflix.Loading.Arrows(); Notiflix.Loading.Dots(); Notiflix.Loading.Pulse(); // Loading indicator with message. e.g. Standard Notiflix.Loading.Standard('Loading...'); // Remove immediately Notiflix.Loading.Remove(); // Remove after delay - e.g. 600ms Notiflix.Loading.Remove(600);