39 lines
1.0 KiB
JavaScript
39 lines
1.0 KiB
JavaScript
(() => {
|
||
let container;
|
||
|
||
function ensureContainer() {
|
||
if (!container) {
|
||
container = document.createElement("div");
|
||
container.className = "toast-container";
|
||
document.body.appendChild(container);
|
||
}
|
||
return container;
|
||
}
|
||
|
||
function show({ message, level = "info", timeout = 5000 } = {}) {
|
||
const root = ensureContainer();
|
||
const toast = document.createElement("div");
|
||
toast.className = `toast toast--${level}`;
|
||
toast.setAttribute("role", "alert");
|
||
toast.innerHTML = `
|
||
<span class="toast__icon" aria-hidden="true"></span>
|
||
<p class="toast__message">${message}</p>
|
||
<button type="button" class="toast__close" aria-label="Dismiss">×</button>
|
||
`;
|
||
root.appendChild(toast);
|
||
|
||
const close = () => {
|
||
toast.classList.add("hidden");
|
||
setTimeout(() => toast.remove(), 200);
|
||
};
|
||
|
||
toast.querySelector(".toast__close").addEventListener("click", close);
|
||
|
||
if (timeout > 0) {
|
||
setTimeout(close, timeout);
|
||
}
|
||
}
|
||
|
||
window.NotificationCenter = { show };
|
||
})();
|