/*! Copyright (c) Safe As Milk. All rights reserved. */import{debounce,removeTrapFocus,trapFocus}from"utils";class DrawerMenu extends HTMLElement{#boundCloseAllOpenPanels;constructor(){super(),this.#boundCloseAllOpenPanels=this.closeAllOpenPanels.bind(this)}connectedCallback(){this.modal=this.closest("modal-dialog"),this.bannerHeightObserver=null,this.setCurrentPanelId(),this.bindEvents(),this.modal.addEventListener("on:modal:closed",this.#boundCloseAllOpenPanels)}disconnectedCallback(){this.modal.removeEventListener("on:modal:closed",this.#boundCloseAllOpenPanels)}setCurrentPanelId(){const currentPanel=Array.from(this.querySelectorAll("details[open]")).pop();this.currentPanelId=currentPanel?currentPanel.id:null}bindEvents(){this.querySelectorAll("summary").forEach(summary=>summary.addEventListener("click",this.onSummaryClick.bind(this))),this.querySelectorAll("button").forEach(button=>button.addEventListener("click",this.onCloseButtonClick.bind(this)))}enableBannerHeightControl(banner){banner&&(this.bannerHeightObserver=new ResizeObserver(debounce(entries=>{entries.forEach(entry=>{entry.target.style.setProperty("--banner-height",`${Math.round(entry.contentRect.height)}px`)})},10)),this.bannerHeightObserver.observe(banner))}disableBannerHeightControl(){this.bannerHeightObserver&&(this.bannerHeightObserver.disconnect(),this.bannerHeightObserver=null)}onSummaryClick(event){const summaryElement=event.currentTarget,detailsElement=summaryElement.parentNode,isOpen=detailsElement.hasAttribute("open");detailsElement===this.mainDetailsToggle?(isOpen&&event.preventDefault(),isOpen?this.closeMenuDrawer(event,summaryElement):this.openMenuDrawer(summaryElement)):setTimeout(()=>{this.currentPanelId=this.openPanel(detailsElement)},100)}onCloseButtonClick(event){const detailsElement=event.currentTarget.closest("details");this.closeSubmenu(detailsElement)}closeSubmenu(detailsElement,animate=!0){detailsElement.classList.remove("is-opening"),detailsElement.querySelector("summary").setAttribute("aria-expanded",!1);const openParent=detailsElement.parentElement.closest("details[open]"),parentBanner=openParent?document.getElementById(`${openParent.id}-banner`):null;this.disableBannerHeightControl(),parentBanner?(detailsElement.closest(".modal").classList.add("has-banner"),this.enableBannerHeightControl(parentBanner)):detailsElement.closest(".modal").classList.remove("has-banner"),removeTrapFocus(detailsElement.querySelector("summary")),animate?DrawerMenu.closeAnimation(detailsElement):(detailsElement.removeAttribute("open"),detailsElement.closest("details[open]")&&trapFocus(detailsElement.closest("details[open]"),detailsElement.querySelector("summary"))),this.currentPanelId=openParent?openParent.id:null}static closeAnimation(detailsElement){let animationStart;const handleAnimation=time=>{animationStart===void 0&&(animationStart=time),time-animationStart<400?window.requestAnimationFrame(handleAnimation):(detailsElement.removeAttribute("open"),detailsElement.closest("details[open]")&&trapFocus(detailsElement.closest("details[open]"),detailsElement.querySelector("summary")))};window.requestAnimationFrame(handleAnimation)}openMenuPanelById(id,animate=!0,focus=!0){const detailsElement=document.getElementById(id);if(!detailsElement)return;this.closeAllOpenPanels();const parentPanel=detailsElement.parentElement.closest("details");parentPanel&&(parentPanel.setAttribute("open",""),animate?setTimeout(()=>{this.openPanel(parentPanel,!1)},100):this.openPanel(parentPanel,!1)),detailsElement.setAttribute("open",""),animate?setTimeout(()=>{this.currentPanelId=this.openPanel(detailsElement,focus)},100):this.currentPanelId=this.openPanel(detailsElement,focus)}openPanel(detailsElement,focus=!0){const summaryElement=detailsElement.querySelector("summary"),banner=document.getElementById(`${detailsElement.id}-banner`),reducedMotion=window.matchMedia("(prefers-reduced-motion: reduce)");function addTrapFocus(){trapFocus(summaryElement.nextElementSibling,detailsElement.querySelector("button")),summaryElement.nextElementSibling.removeEventListener("transitionend",addTrapFocus)}return this.disableBannerHeightControl(),banner?(this.enableBannerHeightControl(banner),detailsElement.closest(".modal").classList.add("has-banner")):detailsElement.closest(".modal").classList.remove("has-banner"),detailsElement.classList.add("is-opening"),summaryElement.setAttribute("aria-expanded",!0),focus&&(!reducedMotion||reducedMotion.matches?addTrapFocus():summaryElement.nextElementSibling.addEventListener("transitionend",addTrapFocus)),detailsElement.id}closeAllOpenPanels(){this.querySelectorAll("details[open]").forEach(panel=>{this.closeSubmenu(panel,!1)})}}customElements.define("drawer-menu",DrawerMenu);
//# sourceMappingURL=/cdn/shop/t/100/assets/drawer-menu.js.map?v=112278693327509456951751575324