if(!customElements.get("custom-select")){class CustomSelect extends HTMLElement{constructor(){super(),this.button=this.querySelector(".custom-select__btn"),this.listbox=this.querySelector(".custom-select__listbox"),this.selectedOption=this.querySelector('[aria-selected="true"]'),this.selectedOption||(this.selectedOption=this.listbox.firstElementChild),this.setButtonWidth(),window.initLazyScript(this,this.init.bind(this))}init(){this.options=this.querySelectorAll(".custom-select__option"),this.nativeSelect=document.getElementById(`${this.id}-native`),this.swatches="swatch"in this.options[0].dataset,this.focusedClass="is-focused",this.searchString="",this.listboxOpen=!1,this.selectedOption=this.querySelector('[aria-selected="true"]'),this.selectedOption||(this.selectedOption=this.listbox.firstElementChild),this.addEventListener("keydown",this.handleKeydown.bind(this)),this.button.addEventListener("mousedown",this.handleMousedown.bind(this))}static getNextVisibleSibling(elem){let sibling=elem.nextElementSibling;for(;sibling;){if(sibling.style.display!=="none")return sibling;sibling=sibling.nextElementSibling}return null}static getPreviousVisibleSibling(elem){let sibling=elem.previousElementSibling;for(;sibling;){if(sibling.style.display!=="none")return sibling;sibling=sibling.previousElementSibling}return null}addListboxOpenListeners(){this.mouseoverHandler=this.handleMouseover.bind(this),this.mouseleaveHandler=this.handleMouseleave.bind(this),this.clickHandler=this.handleClick.bind(this),this.blurHandler=this.handleBlur.bind(this),this.listbox.addEventListener("mouseover",this.mouseoverHandler),this.listbox.addEventListener("mouseleave",this.mouseleaveHandler),this.listbox.addEventListener("click",this.clickHandler),this.listbox.addEventListener("blur",this.blurHandler)}removeListboxOpenListeners(){this.listbox.removeEventListener("mouseover",this.mouseoverHandler),this.listbox.removeEventListener("mouseleave",this.mouseleaveHandler),this.listbox.removeEventListener("click",this.clickHandler),this.listbox.removeEventListener("blur",this.blurHandler)}handleKeydown(evt){this.listboxOpen?this.handleKeyboardNav(evt):(evt.key==="ArrowUp"||evt.key==="ArrowDown"||evt.key===" ")&&(evt.preventDefault(),this.showListbox())}handleMousedown(evt){!this.listboxOpen&&evt.button===0&&this.showListbox()}handleMouseover(evt){evt.target.matches("li")&&this.focusOption(evt.target)}handleMouseleave(){this.focusOption(this.selectedOption)}handleClick(evt){this.selectOption(evt.target)}handleBlur(){this.listboxOpen&&this.hideListbox()}handleKeyboardNav(evt){let optionToFocus;switch(evt.key==="Tab"&&evt.preventDefault(),evt.key){case"ArrowUp":case"ArrowDown":evt.preventDefault(),evt.key==="ArrowUp"?optionToFocus=CustomSelect.getPreviousVisibleSibling(this.focusedOption):optionToFocus=CustomSelect.getNextVisibleSibling(this.focusedOption),optionToFocus&&!optionToFocus.classList.contains("is-disabled")&&this.focusOption(optionToFocus);break;case"Enter":case" ":evt.preventDefault(),this.selectOption(this.focusedOption);break;case"Escape":evt.preventDefault(),this.hideListbox();break;default:optionToFocus=this.findOption(evt.key),optionToFocus&&this.focusOption(optionToFocus);break}}setButtonWidth(){const getUnpaddedWidth=el=>{const elStyle=getComputedStyle(el);return parseFloat(elStyle.paddingLeft)+parseFloat(elStyle.paddingRight)},buttonPadding=getUnpaddedWidth(this.button),optionPadding=getUnpaddedWidth(this.selectedOption),buttonBorder=this.button.offsetWidth-this.button.clientWidth,optionWidth=Math.ceil(this.selectedOption.getBoundingClientRect().width);this.button.style.width=`${optionWidth-optionPadding+buttonPadding+buttonBorder}px`}showListbox(){this.listbox.hidden=!1,this.listboxOpen=!0,this.classList.add("is-open"),this.button.setAttribute("aria-expanded","true"),this.listbox.setAttribute("aria-hidden","false"),setTimeout(()=>{this.focusOption(this.selectedOption),this.listbox.focus(),this.addListboxOpenListeners()})}hideListbox(){this.listboxOpen&&(this.listbox.hidden=!0,this.listboxOpen=!1,this.classList.remove("is-open"),this.button.setAttribute("aria-expanded","false"),this.listbox.setAttribute("aria-hidden","true"),this.focusedOption&&(this.focusedOption.classList.remove(this.focusedClass),this.focusedOption=null),this.button.focus(),this.removeListboxOpenListeners())}findOption(key){return this.searchString+=key,this.searchTimer&&clearTimeout(this.searchTimer),this.searchTimer=setTimeout(()=>{this.searchString=""},500),Array.from(this.options).find(option=>option.innerText.toLowerCase().includes(this.searchString)&&!option.classList.contains("is-disabled"))}focusOption(option){if(this.focusedOption&&this.focusedOption.classList.remove(this.focusedClass),this.focusedOption=option,this.focusedOption.classList.add(this.focusedClass),this.listbox.scrollHeight>this.listbox.clientHeight){const scrollBottom=this.listbox.clientHeight+this.listbox.scrollTop,optionBottom=option.offsetTop+option.offsetHeight;optionBottom>scrollBottom?this.listbox.scrollTop=optionBottom-this.listbox.clientHeight:option.offsetTop<this.listbox.scrollTop&&(this.listbox.scrollTop=option.offsetTop)}}selectOption(option){if(option!==this.selectedOption)if(option.setAttribute("aria-selected","true"),this.selectedOption.setAttribute("aria-selected","false"),this.swatches&&(this.button.dataset.swatch=option.dataset.swatch),this.button.firstElementChild.textContent=option.firstElementChild.textContent,this.listbox.setAttribute("aria-activedescendant",option.id),this.selectedOption=document.getElementById(option.id),this.nativeSelect)this.nativeSelect.value=option.dataset.value,this.nativeSelect.dispatchEvent(new Event("change",{bubbles:!0}));else{const detail={selectedValue:option.dataset.value};this.dispatchEvent(new CustomEvent("change",{bubbles:!0,detail}))}this.hideListbox()}}customElements.define("custom-select",CustomSelect)}
//# sourceMappingURL=/cdn/shop/t/23/assets/custom-select.js.map?v=107842155845539759371737435250