Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 | 7x 7x 14x 9x 9x 9x 9x 9x 9x 9x 8x 8x 8x 1x 7x 7x 7x 7x 7x 7x 7x 2x 2x 7x 7x 7x 48x 48x 48x 48x 48x 42x 2x 2x 2x 7x | function handleTogglePanels() {
const panelToggleButtons = document.querySelectorAll(".js-panel-toggle");
panelToggleButtons.forEach((panelToggleButton) => {
panelToggleButton.addEventListener("click", (e) => {
const target = e.target as HTMLElement;
const panelId = target.getAttribute("aria-controls") || "";
const panel = document.getElementById(panelId);
Eif (panelId && panel) {
target.classList.toggle("is-active");
panel.classList.toggle("is-open");
if (panel.classList.contains("is-open")) {
const panelInput = panel.querySelector("[readonly]") as HTMLElement;
panelInput.focus();
panel.setAttribute("role", "dialog");
} else {
panel.removeAttribute("role");
}
}
});
});
document.addEventListener("keydown", (e) => {
const escKeyCode = 27;
const tabKeyCode = 9;
const openPanelToggle = document.querySelector(
".js-panel-toggle.is-active"
) as HTMLElement;
const openPanel = document.querySelector("[readonly]");
Eif (e.keyCode === escKeyCode || e.keyCode === tabKeyCode) {
if (openPanelToggle) {
openPanelToggle.focus();
openPanelToggle.classList.remove("is-active");
}
Eif (openPanel) {
openPanel?.parentElement?.classList.remove("is-open");
}
}
});
document.addEventListener("click", (e) => {
const target = e.target;
const openPanelToggle = document.querySelector(
".js-panel-toggle.is-active"
);
const openPanel = document.querySelector(".p-inline-list__panel.is-open");
const openPanelInput = document.querySelector("[readonly]");
if (openPanel) {
if (target !== openPanelToggle && target !== openPanelInput) {
openPanelToggle?.classList.remove("is-active");
openPanel.classList.remove("is-open");
openPanel.removeAttribute("role");
}
}
});
}
function init() {
handleTogglePanels();
}
export { init };
|