1class PredictiveSearch extends HTMLElement{constructor(){super(),this.abortController=new AbortController,this.cachedResults={},this.searchTerm="",this.input=this.querySelector('input[type="search"]'),this.resetButton=this.querySelector('button[type="reset"]'),this.predictiveSearchResults=this.querySelector("[data-predictive-search]"),this.allPredictiveSearchInstances=document.querySelectorAll("predictive-search"),this.setupEventListeners()}setupEventListeners(){this.input&&(this.input.form.addEventListener("reset",this.onFormReset.bind(this)),this.input.addEventListener("input",this.debounce(event=>{this.onChange(event)},300).bind(this))),this.input.form.addEventListener("submit",this.onFormSubmit.bind(this)),this.input.addEventListener("focus",this.onFocus.bind(this)),this.input.addEventListener("keydown",this.onKeyup.bind(this))}getQuery(){return this.input.value.trim()}onChange(){if(this.searchTerm=this.getQuery(),!this.searchTerm.length){this.setAttribute("empty-query",!0);return}this.removeAttribute("empty-query"),this.getSearchResults(this.searchTerm)}onFocus(){const currentSearchTerm=this.getQuery();currentSearchTerm.length&&(this.searchTerm!==currentSearchTerm?this.onChange():this.getSearchResults(this.searchTerm))}onKeyup(event){event.key==="Escape"&&(event.preventDefault(),this.input.blur())}onFormReset(event){event.preventDefault(),this.abortController.abort(),this.abortController=new AbortController,this.input.value="",this.input.focus(),this.onChange()}onFormSubmit(event){this.getQuery().length||event.preventDefault()}showLoading(){this.setAttribute("loading",!0)}getSearchResults(searchTerm){const queryKey=searchTerm.replace(" ","-").toLowerCase();if(Tracking.search(searchTerm),this.cachedResults[queryKey]){this.renderSearchResults(this.cachedResults[queryKey]);return}this.showLoading();const options={"resources[type]":"product,collection,article","resources[limit]":"4","resources[limit_scope]":"each","resources[options][fields]":"title,product_type,variants.title,vendor,body",section_id:"predictive-search"},optionsQueryString=Object.keys(options).map(key=>`${encodeURIComponent(key)}=${options[key]}`).join("&");fetch(`${routes.predictive_search_url}?q=${encodeURIComponent(searchTerm)}&${optionsQueryString}`,{signal:this.abortController.signal}).then(response=>{if(!response.ok){var error=new Error(response.status);throw error}return response.text()}).then(text=>{this.removeAttribute("loading");const resultsMarkup=new DOMParser().parseFromString(text,"text/html").querySelector("#shopify-section-predictive-search").innerHTML;this.allPredictiveSearchInstances.forEach(predictiveSearchInstance=>{predictiveSearchInstance.cachedResults[queryKey]=resultsMarkup}),this.renderSearchResults(resultsMarkup)}).catch(error=>{throw this.removeAttribute("loading"),error})}renderSearchResults(resultsMarkup){this.predictiveSearchResults.innerHTML=resultsMarkup,this.setAttribute("results",!0)}debounce(fn,wait){let t;return(...args)=>{clearTimeout(t),t=setTimeout(()=>fn.apply(this,args),wait)}}}customElements.define("predictive-search",PredictiveSearch); 2//# sourceMappingURL=/cdn/shop/t/715/assets/predictive-search.js.map?v=60972588211207284851790165597
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.