@frontle/toast
Toast UI
Usage
import { Toast } from "../../browser_modules/@frontle/toast/index.js";
const toast = new Toast("#app", "<div>this is a toast<div>");
toast.open();
Install
Frontle
frontle install @frontle/toast --noBuild
Download files
https://github.com/Frontle-Foundation/Toast
API
new Toast(parents, html)
Create a toast object
const toast = new Toast("#app", "<div>this is a toast<div>");
.toastClass
Set the css class of a toast
toast.toastClass = 'cssClassName';
.transitionSeconds
Set the toast animation time
toast.transitionSeconds = 0.3;
.holdSeconds
Set the toast hold time
toast.holdSeconds = 3;
.beforeOpen
This lifecycle is executed before the toast is opened
toast.beforeOpen = (toastID) => { console.log('before opened') }
.afterOpen
This lifecycle is executed after the toast is opened
toast.afterOpen = (toastID) => { console.log('after opened') }
.beforeEnd
This lifecycle is executed before the toast closes
toast.beforeEnd = (toastID) => { console.log('before closed') }
.afterEnd
This lifecycle is executed after the toast is closed
toast.afterEnd = (toastID) => { console.log('after closed') }
.open()
Open toast
const toastID = await toast.open();
.close(toastID)
Close toast
await toast.close(toastID);
People
The original author of @frontle/toast is MushStory