https://www.cambridgesatchel.com/cdn/shop/t/628/assets/search-dropdown.min.js

1import{S as s,N as r}from"./vendor.min.js";import{f as o,O as n}from"./utilities.min.js";class c extends HTMLElement{constructor(){super(),this._visibility=!1,this.searchTerm="",this.form=this.querySelector("form"),this.input=this.querySelector('input[type="search"]'),this.productsEl=this.querySelector("[data-search-products]"),this.config=JSON.parse(this.querySelector("#config").textContent)}connectedCallback(){document.addEventListener("click",this.onInputClick.bind(this)),this.querySelector("[data-search-cancel]").addEventListener("click",this.onCancelClick.bind(this)),this.form.reset()}onInputClick(e){e.target.closest("[data-search-open]")!==null&&(this.visibility=!0)}onCancelClick(){this.close(),window.overlay&&window.overlay.close()}close(){this.visibility=!1,this.reset()}reset(){this.form.reset(),o(`${window.location.pathname}?section_id=search-dropdown`).then(e=>{this.productsEl.innerHTML=e.querySelector("[data-search-products]").innerHTML,window.shopifyWishlist&&window.shopifyWishlist.initButtons(this.productsEl),window.sal.update(),this.initCarousel()})}async onInputChange(){const e=this.getQuery();!this.searchTerm||e.startsWith(this.searchTerm),this.searchTerm=e,this.getSearchResults(this.searchTerm)}getSearchResults(e){this.productsEl.innerHTML=`
2      <h3 class="font-sans mb-4 md:mb-8 text-[#979797]">Products</h3>
3
4      <div class="flex items-center justify-center flex-1 py-20">
5        <svg class="w-10 h-10 text-black animate-spin" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48">
6          <g fill="currentColor"><g><path d="M24 47a23 23 0 1 1 23-23 23.025 23.025 0 0 1-23 23zm0-42a19 19 0 1 0 19 19A19.021 19.021 0 0 0 24 5z" opacity=".4"></path><path d="M47 24h-4A19.021 19.021 0 0 0 24 5V1a23.025 23.025 0 0 1 23 23z"></path></g></g>
7        </svg>
8      </div>
9    `,fetch(`${window.routes.predictive_search_url}?q=${encodeURIComponent(e)}&section_id=search-dropdown-results&resources[type]=product`).then(t=>{if(!t.ok)throw new Error(t.status);return t.text()}).then(t=>{const i=new DOMParser().parseFromString(t,"text/html").querySelector(".shopify-section").innerHTML;this.productsEl.innerHTML=i,window.shopifyWishlist&&window.shopifyWishlist.initButtons(this.productsEl),window.sal.update(),this.initCarousel()}).catch(t=>{if((t==null?void 0:t.code)!==20)throw this.closeResults(),t})}initCarousel(){this.swiper=new s(this.querySelector(".swiper"),{slidesPerView:1.5,spaceBetween:20,navigation:{nextEl:this.querySelector("[data-carousel-next]"),prevEl:this.querySelector("[data-carousel-prev]")},modules:[r],breakpoints:{480:{slidesPerView:2},768:{slidesPerView:2.5},1024:{slidesPerView:3},1280:{slidesPerView:4}}})}getQuery(){return this.input.value.trim()}get visibility(){return this._visibility}set visibility(e){this._visibility=e,document.querySelector('[class*="group/searchdropdown"]').classList.toggle("active",e),document.body.classList.toggle("site-overflowed",e),e&&(window.overlay=new n,window.setTimeout(()=>{this.querySelector("input").focus()},500),document.querySelector("mobile-menu").visibility&&(document.querySelector("mobile-menu").visibility=!1))}}customElements.define("search-dropdown",c);