1import{utils}from"@hh/global.js";const{debounce}=utils;class HHFiltersWrapper extends HTMLElement{constructor(){super(),this.filterData=[],this.onActiveFilterClick=this.onActiveFilterClick.bind(this),this.debouncedOnSubmit=debounce(event=>{this.onSubmitHandler(event)},1e3),this.querySelector("form").addEventListener("input",this.debouncedOnSubmit.bind(this));const sortRadios=this.querySelectorAll("[data-mobile-sort-radio]");sortRadios.length>0&&sortRadios.forEach(radio=>{radio.addEventListener("change",e=>{this.syncDesktopSortDropdown(e.target.value),this.debouncedOnSubmit(e)})}),window.addEventListener("popstate",this.onHistoryChange.bind(this)),this.bindActiveFacetButtonEvents(),setTimeout(()=>this.setDefaultInStockFilter(),0)}setDefaultInStockFilter(){const form=this.querySelector("form");if(!form||!this.hasAttribute("data-enable-in-stock-filter-on-page-load"))return;const inStockCheckbox=form.querySelector('#filter-in-stock, input[name="filter.v.availability"][value="1"]');if(!inStockCheckbox||inStockCheckbox.disabled||new URLSearchParams(window.location.search).has("filter.v.availability"))return;inStockCheckbox.checked=!0;const toggle=inStockCheckbox.closest("component-toggle");toggle&&(toggle.checked=!0,toggle.querySelector("button")?.setAttribute("aria-checked","true")),this.onSubmitHandler({preventDefault:()=>{},target:inStockCheckbox})}onSubmitHandler(event){event.preventDefault();const formData=new FormData(event.target.closest("form")),searchParams=new URLSearchParams(formData).toString();this.renderPage(searchParams,event)}onActiveFilterClick(event){event.preventDefault(),this.toggleActiveFacets(),this.renderPage(new URL(event.currentTarget.href).searchParams.toString())}onHistoryChange(event){const searchParams=event.state?.searchParams||"";this.renderPage(searchParams,null,!1);const handleFiltersRendered=()=>
1{this.updateQuickFiltersComponent(),document.removeEventListener("filters-rendered",handleFiltersRendered)};document.addEventListener("filters-rendered",handleFiltersRendered,{once:!0})}toggleActiveFacets(disable=!0){document.querySelectorAll(".js-facet-remove").forEach(element=>{element.classList.toggle("disabled",disable),element.classList.toggle("disabled-link",disable)})}renderPage(searchParams,event,updateURLHash=!0){let currentParams=new URLSearchParams(window.location.search);for(const[key]of[...currentParams])(key.includes("filter.")||key==="sort_by"||key==="page")&¤tParams.delete(key);new URLSearchParams(searchParams).forEach((value,key)=>{currentParams.append(key,value)});const currentParamsString=currentParams.toString(),url=`${window.location.pathname}?`+this.getSections().map(section=>`sections[]=${section.section}`).join("&")+`&${currentParamsString}`,filterDataUrl=element=>element.url===url;this.filterData.some(filterDataUrl)?this.renderSectionFromCache(filterDataUrl,event):this.renderSectionFromFetch(url,event),updateURLHash&&this.updateURLHash(currentParamsString)}renderSectionContent(html,event,source){this.rerenderElement(".js-product-count",html),this.rerenderElement(".js-filter-count",html),this.rerenderElement(".js-product-grid-list",html),this.rerenderElement(".js-collection-load-more",html),this.rerenderElement(".js-load-more-container",html),this.rerenderElement(".js-filter-drawer-header",html),this.rerenderElement(".js-filter-drawer-footer",html),this.rerenderQuickFilters(html),this.renderFilters(html,event),requestAnimationFrame(()=>{document.dispatchEvent(new CustomEvent("filters-rendered",{bubbles:!0,detail:{source}}
1)),this.updateQuickFiltersComponent()})}renderSectionFromFetch(url,event){fetch(url).then(response=>response.json()).then(parsed=>{const html=Object.values(parsed).join("");this.filterData=[...this.filterData,{html,url}],this.renderSectionContent(html,event,"renderSectionFromFetch")})}renderSectionFromCache(filterDataUrl,event){const html=this.filterData.find(filterDataUrl).html;this.renderSectionContent(html,event,"renderSectionFromCache")}rerenderElement(className,html){const sourceElement=new DOMParser().parseFromString(html,"text/html").querySelector(className);if(!sourceElement)return;const data=sourceElement.innerHTML;document.querySelectorAll(className).forEach(el=>el.innerHTML=data)}updateQuickFiltersComponent(){const quickFiltersComponent=document.querySelector("quick-filters");quickFiltersComponent&&quickFiltersComponent.syncWithMainFilters&&quickFiltersComponent.syncWithMainFilters()}rerenderQuickFilters(html){const mainQuickFilters=document.querySelector("quick-filters");if(mainQuickFilters){const sourceMainQuickFilters=new DOMParser().parseFromString(html,"text/html").querySelector("quick-filters");if(sourceMainQuickFilters){mainQuickFilters.innerHTML=sourceMainQuickFilters.innerHTML;const quickFiltersComponent=document.querySelector("quick-filters");if(quickFiltersComponent){const observer=new MutationObserver(()=>{quickFiltersComponent.checkboxes=quickFiltersComponent.querySelectorAll("[data-quick-filter-checkbox]"),quickFiltersComponent.attachEventListeners&&quickFiltersComponent.attachEventListeners(),quickFiltersComponent.configureSlider();const freeSlider=quickFiltersComponent.querySelector("free-slider"),handleSliderReady=()=>
1{this.updateQuickFiltersComponent(),quickFiltersComponent.removeEventListener("quick-filters-slider-ready",handleSliderReady)};quickFiltersComponent.addEventListener("quick-filters-slider-ready",handleSliderReady,{once:!0}),requestAnimationFrame(()=>{freeSlider?.slider&&handleSliderReady()}),observer.disconnect()});observer.observe(mainQuickFilters,{childList:!0,subtree:!0})}}}}renderFilters(...args){this.renderSingleFormFilters("#CollectionFiltersForm",...args),document.dispatchEvent(new CustomEvent("plp:filter-update",{bubbles:!0,composed:!0})),this.updateQuickFiltersComponent()}renderSingleFormFilters(form,html,event){const parsedHTML=new DOMParser().parseFromString(html,"text/html"),facetDetailsElements=parsedHTML.querySelectorAll(`${form} .js-filter`),newFilterIds=new Set(Array.from(facetDetailsElements).map(el=>el.dataset.filterId).filter(Boolean)),matchesFilterId=element=>element.dataset.filterId===event?.target.closest(".js-filter")?.dataset.filterId,facetsToRender=Array.from(facetDetailsElements).filter(element=>!matchesFilterId(element)),countsToRender=Array.from(facetDetailsElements).find(matchesFilterId);facetsToRender.forEach(element=>{const target=document.querySelector(`${form} .js-filter[data-filter-id="${element.dataset.filterId}"]`);target&&(target.hidden=!1,target.innerHTML=element.innerHTML)}),document.querySelectorAll(`${form} .js-filter[data-filter-id]`).forEach(el=>{const id=el.dataset.filterId;id&&!newFilterIds.has(id)&&(el.hidden=!0)}),this.renderActiveFacets(parsedHTML);const targetFilter=event?.target?.closest?.(".js-filter");countsToRender&&targetFilter&&this.renderCounts(countsToRender,targetFilter)}renderActiveFacets(html){[".js-facets--mobile",".js-facets--desktop"].forEach(selector=>{const activeFacetsElement=html.querySelector(selector);activeFacetsElement&&(document.querySelector(selector).innerHTML=activeFacetsElement.innerHTML)}),this.bindActiveFacetButtonEvents()}renderCounts(source,target){[".js-bubble",".js-selected"].forEach(selector=>{const targetElement=target.querySelector(selector);source.querySelector(selector)&&targetElement&&(target.querySelector(selector).outerHTML=source.querySelector(selector).outerHTML)})}bindActiveFacetButtonEvents(){document.querySelectorAll(".js-facet-remove").forEach(element=>{element.addEventListener("click",this.onActiveFilterClick,{once:!0})})}syncDesktopSortDropdown(value){document.querySelectorAll("[data-desktop-sort-radio]").forEach(radio=>{radio.value===value&&!radio.checked&&(radio.checked=!0,radio.dispatchEvent(new Event("change",{bubbles:!0})))})}updateURLHash(searchParams){history.pushState({searchParams},"",`${window.location.pathname}${searchParams&&"?".concat(searchParams)}
1`),this.updateQuickFiltersComponent()}getSections(){return[{id:"main-collection-filters",section:document.getElementById("main-collection-filters").dataset.id},{id:"main-collection-product-grid",section:document.getElementById("CollectionProductGrid").dataset.id}]}}customElements.define("hh-filters-wrapper",HHFiltersWrapper); 2//# sourceMappingURL=/cdn/shop/t/1782/assets/component-filters-wrapper.js.map?v=88483614326361513931790746150
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.