https://babynetic.com/cdn/shop/t/15/assets/product-card-swatch.js?v=81823148496065419911783701506

1if(!customElements.get("pcard-swatch")){class t extends HTMLElement{constructor(){super(),this.selectors={container:"[data-pcard-variant-picker]",optionNodes:[".m-product-option--node__label"],featuredImage:".m-product-card__main-image",pcard:".m-product-card",variantDropdown:".m-product-option--dropdown-select",priceWrapper:".m-price",salePrice:".m-price-item--sale",compareAtPrice:[".m-price-item--regular"],unitPrice:".m-price__unit",soldOutBadge:".m-product-tag--soldout"},this.container=this.closest(this.selectors.container),this.pcard=this.closest(this.selectors.pcard),this.variantIdNode=this.pcard&&this.pcard.querySelector('[name="id"]'),this.featuredImage=this.pcard&&this.pcard.querySelector(this.selectors.featuredImage),this.domNodes=queryDomNodes(this.selectors,this.pcard),this.setupData()}async setupData(){this.variantData=this.getVariantData(),this.productHandle=this.container.dataset.productHandle,this.productData=await this.getProductJson(),this.activeOptionNodeByPosition={},this.hide_unavailable_product_options=MinimogSettings.hide_unavailable_product_options;const{variantIdNode:t2,productData:e,productData:{variants:a}={}}=this;if(e){let i=t2&&Number(t2.value);i||(i=e.selected_or_first_available_variant&&e.selected_or_first_available_variant.id);const s=a.find(t3=>t3.id===i)||a[0];this.productData.initialVariant=s,!this.productData.selected_variant&&t2&&t2.dataset.selectedVariant&&(this.productData.selected_variant=a.find(e2=>e2.id===Number(t2&&t2.dataset.selectedVariant))),this.updateOptionByVariant(s),this.updateProductCardSoldOutBadge(s)}this.initOptionSwatches(),this.domNodes.optionNodes&&this.domNodes.optionNodes.forEach(t3=>t3.addEventListener("click",this.handleSelectVariant.bind(this))),this.domNodes.variantDropdown&&this.domNodes.variantDropdown.addEventListener("change",this.handleSelectVariant.bind(this))}getVariantData(){return this.variantData=this.variantData||JSON.parse(this.container&&this.container.querySelector('[type="application/json"]').textContent),this.variantData}getProductJson(){let t2=`${window.MinimogSettings.routes.root}/products/${this.productHandle}.js`;return t2=t2.replace("//","/"),fetch(t2).then(function(t3){return t3.json()})}initOptionSwatches(){const{_colorSwatches:t2=[],_imageSwatches:e=[]}=window.MinimogSettings;this.domNodes.optionNodes.forEach(a=>{const{optionType:i,optionPosition:s,value:o}=a&&a.dataset,r=o&&o.toLowerCase(),n=this.variantData.find(t3=>t3[`option${s}`]===o),c=n&&n.featured_image&&n.featured_image.src&&!n.featured_image.src.includes(".webp")?getSizedImageUrl(n.featured_image.src,"60x"):n.featured_image?n.featured_image.src:null,d=e.find(t3=>t3.key===r)&&e.find(t3=>t3.key===r).value,u=t2.find(t3=>t3.key===r)&&t2.find(t3=>t3.key===r).value;switch((c||d)&&a.classList.add("has-bg-img"),i){case"default":(d||c)&&(a.style.backgroundImage=`url(${d||c||""})`);break;case"image":(c||d)&&(a.style.backgroundImage=`url(${c||d||""})`);break;case"color":a.style.background=`${u||r}`,d&&(a.style.backgroundImage=`url(${d})`)}})}toggleOptionNodeActive(t2,e){if(t2)if(e){const{optionPosition:e2,value:a}=t2.dataset;switch(this.activeOptionNodeByPosition[e2]=t2,t2.tagName){case"INPUT":t2.checked="checked",t2.dataset.selected="true";break;case"OPTION":t2.dataset.selected="true";const e3=t2.closest("select");e3&&(e3.value=t2.value);break;case"LABEL":t2.dataset.selected="true";break;default:t2.classList.contains("m-product-quickview-button")}}else{["default","image","color"].includes(t2.dataset.optionType)||(t2.style.border=""),t2.checked=!1,delete t2.dataset.selected;const e2=t2.closest("select");e2&&(e2.value="")}}updateOptionByVariant(t2){Object.values(this.activeOptionNodeByPosition).forEach(t3=>this.toggleOptionNodeActive(t3,!1));const{optionNodes:e}=this.domNodes,{options:a=[]}=t2||{};a.forEach((t3,a2)=>{const i=a2+1;e.forEach(e2=>{const a3=Number(e2.dataset.optionPosition),s=e2.dataset.value;a3===i&&t3===s&&this.toggleOptionNodeActive(e2,!0)})}),this.updatePrice(t2)}getVariantFromActiveOptions=()=>{const{productData:t2,productData:{initialVariant:e},activeOptionNodeByPosition:a}=this;let i;const s={1:e.option1,2:e.option2,3:e.option3};

1Object.values(a).forEach(t3=>{const{optionPosition:e2,value:a2}=t3.dataset;s[e2]=a2}),i=Object.values(s),i=i.filter(Boolean);let o=getVariantFromOptionArray(t2,i);return!o&&this.hide_unavailable_product_options&&(i.pop(),o=getVariantFromOptionArray(t2,i),o||(i.pop(),o=getVariantFromOptionArray(t2,i))),this.currentVariant=o,o};handleSelectVariant(t2){let e,{target:a}=t2;if(a.classList.contains("combined-variant")){const a2=Number(t2.target.value);e=this.productData&&this.productData.variants&&this.productData.variants.find(t3=>t3.id===a2)}else{a.tagName==="SELECT"&&(a=a.querySelectorAll("option")[a.selectedIndex]),a.classList.contains("m-product-option--node__label")||(a=a.closest(".m-product-option--node__label"));const{optionPosition:t3}=a.dataset,i2=this.activeOptionNodeByPosition[t3];this.toggleOptionNodeActive(i2,!1),this.toggleOptionNodeActive(a,!0),e=this.getVariantFromActiveOptions()}const{variantIdNode:i}=this;i&&(i.setAttribute("value",String(e.id)),i.value=String(e.id)),this.updateBySelectedVariant(e)}updateBySelectedVariant(t2){t2&&(this.changeProductImage(t2),this.updatePrice(t2),this.updateProductCardSoldOutBadge(t2))}updateProductCardSoldOutBadge(t2){this.domNodes.soldOutBadge&&(this.domNodes.soldOutBadge.style.display=t2.available?"none":"flex")}changeProductImage(t2){const e=t2&&t2.featured_image&&t2.featured_image.src,{featuredImage:a}=this,i=a&&a.querySelector("img");i&&e&&(i.src=e,i.removeAttribute("srcset"))}updatePrice(t2){if(MinimogSettings.pcard_show_lowest_prices)return;const e="m-price--on-sale",a="m-price--sold-out",i=window.MinimogSettings.money_format,{priceWrapper:s,salePrice:o,unitPrice:r,compareAtPrice:n}=this.domNodes,{compare_at_price:c,price:d,unit_price_measurement:u}=t2,l=c&&c>d,p=!t2.available;if(l?s.classList.add(e):s.classList.remove(e),p?s.classList.add(a):s.classList.remove(a),s&&s.classList.remove("visibility-hidden"),o&&(o.innerHTML=formatMoney(d,i)),n&&n.length&&c>d?n.forEach(t3=>t3.innerHTML=formatMoney(c,i)):n.forEach(t3=>t3.innerHTML=formatMoney(d,i)),u&&r&&this.currentVariant){r.classList.remove("f-hidden");const t3=`<span>${formatMoney(this.currentVariant.unit_price,i)}</span>/<span data-unit-price-base-unit>${this._getBaseUnit()}</span>`;r.innerHTML=t3}else r&&r.classList.add("f-hidden")}_getBaseUnit=()=>this.currentVariant.unit_price_measurement.reference_value===1?this.currentVariant.unit_price_measurement.reference_unit:this.currentVariant.unit_price_measurement.reference_value+this.currentVariant.unit_price_measurement.reference_unit}if(customElements.define("pcard-swatch",t),!customElements.get("swatch-button")){class t2 extends HTMLElement{constructor(){super()}}if(customElements.define("swatch-button",t2),!customElements.get("swatch-dropdown")){class e extends t2{constructor(){super()}}customElements.define("swatch-dropdown",e)}if(!customElements.get("swatch-image")){class e extends t2{constructor(){super()}}customElements.define("swatch-image",e)}if(!customElements.get("swatch-color")){class e extends t2{constructor(){super()}}customElements.define("swatch-color",e)}}}
2//# sourceMappingURL=/cdn/shop/t/15/assets/product-card-swatch.js.map?v=81823148496065419911783701506