26 lines
881 B
JavaScript
26 lines
881 B
JavaScript
|
import { escapeHtml } from '/static/portal/common/formatters.js';
|
||
|
|
|
||
|
|
function region() {
|
||
|
|
let target = document.querySelector('[data-toast-region]');
|
||
|
|
if (!target) {
|
||
|
|
target = document.createElement('div');
|
||
|
|
target.className = 'toast-region';
|
||
|
|
target.dataset.toastRegion = '';
|
||
|
|
target.setAttribute('aria-live', 'polite');
|
||
|
|
document.body.append(target);
|
||
|
|
}
|
||
|
|
return target;
|
||
|
|
}
|
||
|
|
|
||
|
|
export function showToast(message, tone = 'success') {
|
||
|
|
const item = document.createElement('div');
|
||
|
|
item.className = `toast toast--${tone}`;
|
||
|
|
item.innerHTML = `<span class="toast__indicator" aria-hidden="true"></span><span>${escapeHtml(message)}</span>`;
|
||
|
|
region().append(item);
|
||
|
|
requestAnimationFrame(() => item.classList.add('toast--visible'));
|
||
|
|
window.setTimeout(() => {
|
||
|
|
item.classList.remove('toast--visible');
|
||
|
|
window.setTimeout(() => item.remove(), 220);
|
||
|
|
}, 3600);
|
||
|
|
}
|