toasts-manager

0.1.17 • Public • Published

Toasts Manager

React toasts manager library.

Usage:

Import:

import ToastsManager, { Toast } from 'toasts-manager';
 
ReactDOM.render(
  <div>
    ...
    <ToastsManager renderToast={({ type, text, onClose }) => (
      <Toast onClick={onClose}>
        {type}: {text}
      </Toast>
    )} />
  </div>,
  document.getElementById('root')
)

ToastsManager props:

  • anchor - values: ["left", "right"] default: "left"

Show standard info/warn/error toasts:

// Show toast rendered by renderToast function with params type = 'info' and text
ToastsManager.info('Post sent success');
 
// Show toast rendered by renderToast function with params type = 'warn' and text
ToastsManager.warn('Comments depth exceeded');
 
// Show toast rendered by renderToast function with params type = 'error' and text
ToastsManager.error('Network Error');

Use with custom component:

import ToastsManager, { Toast } from 'toasts-manager';
 
ToastsManager.show(({ onClose }) => (
  <Toast>
    CUSTOM INNER HTML
    <button type="button" onClick={onClose}>
      DISMISS
    </button>
  </Toast>
));

Dependencies (0)

    Dev Dependencies (22)

    Package Sidebar

    Install

    npm i toasts-manager

    Weekly Downloads

    2

    Version

    0.1.17

    License

    ISC

    Unpacked Size

    229 kB

    Total Files

    14

    Last publish

    Collaborators

    • bacher
    • beautyfree