Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
77 lines
2.7 KiB
JavaScript
77 lines
2.7 KiB
JavaScript
(function () {
|
|
var host = document.getElementById("toastHost");
|
|
if (!host) return;
|
|
|
|
var ICONS = {
|
|
info:
|
|
'<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><circle cx="8" cy="8" r="6.25" stroke="currentColor" stroke-width="1.5"/><path d="M8 7.2V11" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"/><circle cx="8" cy="5" r="0.9" fill="currentColor"/></svg>',
|
|
success:
|
|
'<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M3.5 8.2l3 3.1 6-6.3" stroke="currentColor" stroke-width="1.7" stroke-linecap="round" stroke-linejoin="round"/></svg>',
|
|
error:
|
|
'<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M5 5l6 6M11 5l-6 6" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/></svg>',
|
|
warning:
|
|
'<svg viewBox="0 0 16 16" fill="none" aria-hidden="true"><path d="M8 4.2v5.2" stroke="currentColor" stroke-width="1.7" stroke-linecap="round"/><circle cx="8" cy="11.4" r="0.95" fill="currentColor"/></svg>',
|
|
};
|
|
|
|
var DEFAULT_DURATION = 2400;
|
|
var MAX_VISIBLE = 3;
|
|
|
|
function normalizeType(type) {
|
|
if (type === "success" || type === "error" || type === "warning" || type === "info") {
|
|
return type;
|
|
}
|
|
return "info";
|
|
}
|
|
|
|
function showToast(message, options) {
|
|
if (!message) return null;
|
|
|
|
var opts = typeof options === "string" ? { type: options } : options || {};
|
|
var type = normalizeType(opts.type);
|
|
var duration = typeof opts.duration === "number" ? opts.duration : DEFAULT_DURATION;
|
|
|
|
while (host.children.length >= MAX_VISIBLE) {
|
|
var oldest = host.firstElementChild;
|
|
if (oldest) oldest.remove();
|
|
}
|
|
|
|
var item = document.createElement("div");
|
|
item.className = "toast-item toast-item--" + type;
|
|
item.setAttribute("role", "status");
|
|
|
|
var icon = document.createElement("span");
|
|
icon.className = "toast-icon";
|
|
icon.setAttribute("aria-hidden", "true");
|
|
icon.innerHTML = ICONS[type] || ICONS.info;
|
|
|
|
var text = document.createElement("span");
|
|
text.className = "toast-text";
|
|
text.textContent = String(message);
|
|
|
|
item.appendChild(icon);
|
|
item.appendChild(text);
|
|
host.appendChild(item);
|
|
|
|
requestAnimationFrame(function () {
|
|
item.classList.add("is-visible");
|
|
});
|
|
|
|
var hideTimer = setTimeout(function () {
|
|
item.classList.add("is-leaving");
|
|
item.classList.remove("is-visible");
|
|
setTimeout(function () {
|
|
if (item.parentNode) item.parentNode.removeChild(item);
|
|
}, 260);
|
|
}, Math.max(800, duration));
|
|
|
|
return {
|
|
close: function () {
|
|
clearTimeout(hideTimer);
|
|
if (item.parentNode) item.parentNode.removeChild(item);
|
|
},
|
|
};
|
|
}
|
|
|
|
window.showToast = showToast;
|
|
})();
|