https://galeriebeauchamp.com/cdn/shop/t/82/assets/artist-dropdown.js?v=16760353581419976241742567109

1customElements.define("artist-dropdown",class extends HTMLElement{constructor(){super(),this.config={triggersSelector:".artist-dropdown__letters",triggerSelector:".artist-dropdown__letter",panelSelector:".artist-dropdown__panel",activeTab:0},this.triggers=Array.from(this.querySelectorAll(this.config.triggerSelector)),this.panels=Array.from(this.querySelectorAll(this.config.panelSelector)),this.addAccessibilityAttributes(),this.activatePanel(this.config.activeTab,!1),this.triggers.forEach(trigger=>{trigger.addEventListener("click",this.handleClick.bind(this)),trigger.addEventListener("keydown",this.handleKeydown.bind(this))})}handleClick(event){event.preventDefault();const index=this.triggers.indexOf(event.currentTarget);this.activatePanel(index)}handleKeydown(event){let flag=!1;switch(event.key){case"ArrowLeft":this.activatePrevious(event.currentTarget),flag=!0;break;case"ArrowRight":this.activateNext(event.currentTarget),flag=!0;break;case"Home":this.activatePanel(0),flag=!0;break;case"End":this.activatePanel(this.panels.length-1),flag=!0;break;default:break}flag&&(event.stopPropagation(),event.preventDefault())}activatePrevious(trigger){const index=this.triggers.indexOf(trigger);index===0?this.activatePanel(this.triggers.length-1):this.activatePanel(index-1)}activateNext(trigger){const index=this.triggers.indexOf(trigger);index===this.triggers.length-1?this.activatePanel(0):this.activatePanel(index+1)}activatePanel(index,focus=!0){this.deactivateAllPanels(),this.triggers[index].setAttribute("aria-selected",!0),this.triggers[index].setAttribute("active",!0),this.triggers[index].removeAttribute("tabindex"),this.panels[index].setAttribute("active",!0),focus&&this.triggers[index].focus()}deactivatePanel(index){this.triggers[index].setAttribute("aria-selected",!1),this.triggers[index].setAttribute("active",!1),this.triggers[index].tabIndex=-1,this.panels[index].setAttribute("active",!1)}deactivateAllPanels(){this.triggers.forEach((trigger,index)=>this.deactivatePanel(index))}addAccessibilityAttributes(){this.querySelector(this.config.triggersSelector).setAttribute("role","tablist"),this.triggers.forEach((trigger,index)=>{trigger.id=`tabs-${this.config.id}-trigger-${index}`,trigger.setAttribute("role","tab"),trigger.setAttribute("aria-selected",!1),trigger.setAttribute("aria-controls",`tabs-${this.config.id}-panel-${index}`)}),this.panels.forEach((panel,index)=>{panel.id=`tabs-${this.config.id}-panel-${index}`,panel.setAttribute("role","tabpanel"),panel.tabIndex=0,panel.setAttribute("aria-labelledby",`tabs-${this.config.id}-trigger-${index}`)})}});
2//# sourceMappingURL=/cdn/shop/t/82/assets/artist-dropdown.js.map?v=16760353581419976241742567109