32 lines
1.6 KiB
JavaScript
32 lines
1.6 KiB
JavaScript
import {openModal, closeModal} from "./modalFocus.js";
|
|
|
|
export function createConversationPanel(id, title) {
|
|
const overlay = document.createElement("div");
|
|
overlay.id = id;
|
|
overlay.className = "modal-overlay hidden";
|
|
overlay.innerHTML = `<section class="modal-card conversation-panel" role="dialog" aria-modal="true" aria-labelledby="${id}Title" tabindex="-1">
|
|
<div class="modal-header"><h3 id="${id}Title"></h3><button type="button" class="secondary-action">Close</button></div>
|
|
<p class="panel-notice status" role="status"></p><div class="panel-content"></div></section>`;
|
|
overlay.querySelector("h3").textContent = title;
|
|
document.body.append(overlay);
|
|
const close = () => closeModal(overlay);
|
|
overlay.querySelector("button").onclick = close;
|
|
overlay.onclick = event => { if (event.target === overlay) close(); };
|
|
return {element: overlay, content: overlay.querySelector(".panel-content"), close,
|
|
open() { if (overlay.classList.contains("hidden")) openModal(overlay); },
|
|
notice(text = "", error = false) {
|
|
const notice = overlay.querySelector(".panel-notice");
|
|
notice.textContent = text;
|
|
notice.classList.toggle("error", error);
|
|
}};
|
|
}
|
|
|
|
export function actionButton(label, action) {
|
|
const button = document.createElement("button");
|
|
button.type = "button";
|
|
button.className = "secondary-action";
|
|
button.textContent = label;
|
|
button.onclick = async () => { button.disabled = true; try { await action(); } finally { button.disabled = false; } };
|
|
return button;
|
|
}
|