Pre Toast

Installation

npm install --save pre-toast

Usage

import React from 'react';
import Toast from "pre-toast/lib/Toast";
 
class Example extends React.Component {
 
  createToast = (type) => {
    return () => {
      switch (type) {
        case 'info':
          Toast.info('Info message');
          break;
        case 'success':
          Toast.success('Success message', 'Title here');
          break;
        case 'warning':
          Toast.warning('Warning message', 'Close after 3000ms', 3000);
          break;
        case 'error':
          Toast.error('Error message', 'Click me!', 5000, () => {
            alert('callback');
          });
          break;
      }
    };
  };
 
  render() {
    return ( 
        <div>
            <button className='btn btn-info'
              onClick={this.createToast('info')}>Info
            </button>
            <hr/>
            <button className='btn btn-success'
              onClick={this.createToast('success')}>Success
            </button>
            <hr/>
            <button className='btn btn-warning'
              onClick={this.createToast('warning')}>Warning
            </button>
            <hr/>
            <button className='btn btn-danger'
              onClick={this.createToast('error')}>Error
            </button>
      </div>
    );
  }
}
 
export default Example;
 

Toast Props

Name	Type	Default	Required	Description
position	string	"top-right"	false	Desired position of toast to be shown on screen - "top-right" , "top-left" , "bottom-left" , "bottom-right"
maxVisible	number	5	false	any number
timeBar	bool	true	false	Toast timeout duration bar

 
let config={
    position:"top-left",
    maxVisible:5,
    timeBar: false
}
 
Toast.configuration(conf);

Toast API

• Toast.info(message, title, timeOut, callback);
• Toast.success(message, title, timeOut, callback);
• Toast.warning(message, title, timeOut, callback);
• Toast.error(message, title, timeOut, callback);

Name	Type	Description
message	string	The message string
title	string	The title string
timeOut	integer	The popup timeout in milliseconds
callback	function	A function that gets fired when the popup is clicked

Quick Start

1. Get the latest version

You can start by cloning the latest version of pre-toast.

2. Run npm install

This will install both run-time project dependencies and developer tools listed in package.json file.

3. How to start project in Development Mode

This will start the development server and serve site application.

$ npm start

Open Browser and enter http://localhost:3000 (default)

How to Build for Production

If you need just to build the app (without running a dev server), simply run:

$ npm run build

How to Build for Site

If you need just to build the app (without running a dev server), simply run:

$ npm run site