noty-noty

Noty, A customizable Javascript notification library

Noty is a small javascript notification library that doesn't depend on jQuery. It can easily be used in your client side applications regardless of the framework

Installation

Add the package npm package into your project directory like so:

$ yarn add noty-noty

Usage

Just use it by importing the library

import Noty from 'noty-noty';

const ExampleComponent = (props) => {

  const handleClick = () => {
    Noty({
      type: 'primary',
      message: 'Hi there, Welcome back to our app',
    });
  };

  return (
    <button onClick={handleClick}>Click me!</button>
  );
}

Options

Below shows a list of options you can pass to Noty

Option	Description	Example Values
type	Sets the type of alert to show it. (default: primary)	primary, success, info, danger
icon	Sets an icon for the alert. You can pass it any icon classes you have configured (default: "")	fa fa-info-circle, glyphicon glyphicon-envelope
html	Option to pass html content. When option is set, title and message options are not used (default: null)	<h3>Example</h3>
title	Sets a heading for the alert (default: "")	-
message	Sets a message body (default: "")	-
closeBtn	Shows a close button that allows users to close alert (default: true)	-
timer	Set timer delay to show alert before disappearing (default: 500)	-
onShow	Set handler to run right before alert is shown	-
onShown	Set handler to run after alert is shown	-
onHide	Set handler function to run right before it is hidden	-
onHidden	Set handler function to run after it is hidden	-

TODO

• option for page banner alert
• option for panel level alert

Contributing

Feel free to create an issue or pull request if there's something you wish to be added to it