38 lines
1.3 KiB
JavaScript
38 lines
1.3 KiB
JavaScript
/******/ (() => { // webpackBootstrap
|
|
/*!*******************************!*\
|
|
!*** ./src/tab-group/view.js ***!
|
|
\*******************************/
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
document.querySelectorAll(".tab-group").forEach(TabGroup => {
|
|
const toolbar = TabGroup.querySelector(".tab-group__toolbar");
|
|
const tabs = toolbar.querySelectorAll("button");
|
|
function setActiveTab(currentTab) {
|
|
tabs.forEach(tab => {
|
|
tab.setAttribute("aria-selected", "false");
|
|
});
|
|
currentTab.setAttribute("aria-selected", "true");
|
|
}
|
|
function setActiveTabPanel(currentTabButton) {
|
|
const currentTabPanelId = currentTabButton.getAttribute("aria-controls");
|
|
const currentTabPanel = TabGroup.querySelector(`#${currentTabPanelId}`);
|
|
console.log(currentTabPanel);
|
|
hideAllTabPanels();
|
|
currentTabPanel.setAttribute("data-active", "true");
|
|
}
|
|
function hideAllTabPanels() {
|
|
const tabPanels = TabGroup.querySelectorAll(".tab-group__innerblocks .tab");
|
|
tabPanels.forEach(tabPanel => {
|
|
tabPanel.setAttribute("data-active", "false");
|
|
});
|
|
}
|
|
tabs.forEach(tab => {
|
|
tab.addEventListener("click", () => {
|
|
setActiveTab(tab);
|
|
setActiveTabPanel(tab);
|
|
});
|
|
});
|
|
});
|
|
});
|
|
/******/ })()
|
|
;
|
|
//# sourceMappingURL=view.js.map
|