A complete alert and warning package in svelte.
Install into the project using npm
npm install @pedrofreit4s/avelte-alerts
Install into the project using yarn
yarn add @pedrofreit4s/avelte-alerts
First, index this link as icon dependency in font
<link
href="https://unpkg.com/[email protected]/css/boxicons.min.css"
rel="stylesheet"
/>
Add the provider to your application's global layout file +layout.svelte
or another file
<AlertProvider options={{...}} />
mode: "auto"
Color mode, automatic light and darksuccess_icon: "bx bx-check-circle"
Success icon. More Icons https://boxicons.com/warn_icon: "bx bx-error"
Warn icon. More Icons https://boxicons.com/error_icon: "bx bx-bug-alt"
Error icon. More Icons https://boxicons.com/info_icon: "bx bx-info-circle"
Info icon. More Icons https://boxicons.com/import { alert } from "@pedrofreit4s/svelte-alert";
function showAlert() {
// params[0] = "success" | "warn" | "error" | "info"
// params[1] = Message
// params[2] = Hidden time in ms
const alertId = alert.push(
"success",
"Your username has been successfully activated!",
1500
);
}
import { alert } from "@pedrofreit4s/svelte-alert";
function removeAlert(alertId: string) {
alert.remove(alertId);
}