@paper-development/vtoast v1.0.0

Vanilla Toasts (also refered to as vtoast) is a lightweight VanillaJS toast library. It does not require any framework to run. It is inspired from toastr but removes the dependency to jQuery.

It's also lighter and has fewer lines of code.

It is currently in active development thus some features mentioned below might not be (yet) implemented. Additional features may also be developed.

Current version: 1.0.0

Known issues with the current code:

• None

States

A toast has 3 states

• Hidden: The toast is either in the process of being created or deleted.
• Shown: The toast is visible for the time set in the duration option.
• Focused: The toast is frozen in time (the auto-remove is cancelled). Happens when the cursor enters the toast. Once the cursor leaves the toast, the toast will remain in a "shown" state for the time set in the unfocus-duration option.

Usage

To start with, include the CSS and the JavaScript (where PATH is the installation path or URL)

<link rel="stylesheet" href="PATH/vtoast.css">
<script src="PATH/vtoast.js"></script>

And you are ready to bring quality toasts to your website.

Consider the 3 variables below:

let title;
let content;
let options;

title and content are strings, options is a JSON.

Content only

If you pass only one parameter to the show method, it will be used as content and the default options set will be used.

vtoast.show(content);

Title and content

You can pass the title and the content to the show method, the default options set will be used.

vtoast.show(title, content);

Title, content and options

You can take full control and pass the title, the content and the options to the show method.

vtoast.show(title, content, options);

Options

Options are passed to the show method as a "one depth" JSON object.