Simple Toast JS

Simple Toast JS is a lightweight and customizable JavaScript library for creating toast messages in web applications. It can be used with any frontend framework or library, such as React, Angular, and Vue.

Installation

To install Simple Toast JS using npm, run the following command:

npm install simple-toast-js

Usage

To use Simple Toast JS, import it into your JavaScript file:

import SimpleToast from "simple-toast-js";

Import the CSS stylesheet to include Simple Toast JS styles:

import "simple-toast-js/styles/toast.css";

Code Example

Here's an example of how to use Simple Toast JS:

import SimpleToast from "simple-toast-js";
import "simple-toast-js/styles/toast.css";

const showToast = () => {
  new SimpleToast({
    position: "top-right",
    autoClose: 5000,
    closeOnClick: true,
    showProgressBar: true,
    pauseOnHover: false,
    type: "success",
  });
};

<button onclick="showToast()">Show Toast</button>;

Options

When creating a toast message, you need to pass an Options object with the following keys:

key	type	default	values
animation	string	'shrink'	'shrink', 'slide'
autoClose	number | boolean	5000
closeOnClick	boolean	true	true, false
message	string	''
onClose	function	()=>{}
pauseOnHover	boolean	false	true, false
position	string	'top-right'	'top-left', 'top-right', 'top-center', bottom-left', 'bottom-right', 'bottom-center', 'center'
showProgressBar	boolean	true	true, false
styleToast	object	{}	{width: '500px', color: 'white', and so on... }
theme	string	'light'	'light', 'dark', 'colored'
type	string	'default'	'default', 'info', 'success', 'warning', 'error'

Methods

The following methods are available on the toast object:

    const toast new SimpleToast({
            message: "A simple test toast!"
            position: "top-right",
            autoClose: 5000,
            closeOnClick: true,
            showProgressBar: true,
            pauseOnHover: false,
            type: "success",
        });

• update()

  toast.update({
    ...updatedOptionsObj,
  });

• remove()

  toast.remove();

License

Simple Toast JS is licensed under the MIT License. See the LICENSE file for more information.