https://aguademadre.co.uk/cdn/shop/t/43/assets/product-cards.js?v=75295841786073560841788379153

1import{formatMoney,handle}from"utils";class ProductCardMini extends HTMLElement{#t;constructor(){super(),this.#t=this.#e.bind(this)}connectedCallback(){if(this.image=this.querySelector("img.js-product-card-image"),this.imageContainerRatio=this.getAttribute("image-container-ratio").trim(),this.imageFit=this.hasAttribute("image-fit"),this.quickShopTriggerType=this.getAttribute("quick-shop-trigger"),this.quickShopTriggerHover=this.hasAttribute("quick-shop-trigger-hover"),this.isRendered=this.hasAttribute("rendered"),this.isRendered){if(this.quickShop=this.querySelector("quick-shop"),(this.hasAttribute("move-quick-shop")||this.closest(".modal"))&&this.quickShop){const t=document.getElementById("moved-modal-elements");t&&t.appendChild(this.quickShop)}this.closest("items-scroll")&&this.quickShop&&this.closest("items-scroll").addEventListener("on:items-scroll:change-state",(({detail:{scrollable:t}})=>{if(t){const t=document.getElementById("moved-modal-elements");t&&t.appendChild(this.quickShop)}else this.querySelector("quick-shop")||this.appendChild(this.quickShop)})),this.quickShop&&(this.quickShopTrigger=this.querySelector("[data-trigger-quick-shop]"),this.quickShopTrigger.addEventListener("click",this.#t))}}disconnectedCallback(){this.quickShop&&(this.quickShopTrigger.removeEventListener("click",this.#t),this.quickShop&&!this.querySelector("quick-shop")&&this.appendChild(this.quickShop))}set product(t){this.productData=t,this.isRendered||this.render()}get product(){return this.productData}set id(t){if(this.setAttribute("id",t),this.quickShop){const e=`${t}--quickshop`;this.quickShop.setAttribute("id",e)}}get id(){return this.getAttribute("id")}async#e(t){t.preventDefault();const e=this.closest("modal-dialog");e&&await e.close(),this.quickShop.open(e)}render(){if(this.setAttribute("product-id",this.product.id),this.querySelectorAll("a[product-card-link]").forEach((t=>{t.setAttribute("href",this.product.url);const e=t.querySelector(".visually-hidden");e&&(e.innerHTML=this.product.title)})),this.product.available?this.product.compare_at_price>this.product.price&&this.classList.add("product-card--sale"):this.classList.add("product-card--sold-out"),"natural"===this.imageContainerRatio){this.querySelector("img.js-product-card-image").closest(".o-ratio").style.paddingBottom="100%"}if(this.product.media&&this.product.media.length>0){const t=this.product.media[0].preview_image;this.updateImage(t.src,t.width,t.height,t.alt);const e=this.querySelector("product-card-secondary-image-placeholder");if(e&&this.product.media[1]){const t=this.product.media[1].preview_image,i=this.renderImage(t.src,t.width,t.height,e.getAttribute("class"),t.alt,this.image.getAttribute("sizes"));i.setAttribute("product-card-secondary-image",""),this.image.parentElement.classList.add("product-card__media--hover-image"),e.replaceWith(i)}"zoom"===this.getAttribute("image-hover")&&this.image.parentElement.classList.add("product-card__media--hover-zoom"),"natural"===this.imageContainerRatio?this.image.closest(".o-ratio").style.paddingBottom=1/t.aspect_ratio*100+"%":this.image.closest(".o-ratio").style.paddingBottom=null,this.updateSkeleton()}const t=this.querySelector("product-card-vendor");t&&(t.textContent=this.product.vendor),this.querySelector("product-card-title").textContent=this.product.title;const e=this.querySelector("product-card-price");if(e){const t=`\n        <span class="u-hidden-visually">${window.theme.localize("REGULAR_PRICE")}</span>\n        <span class="price__number ${this.product.compare_at_price>this.product.price?"price__number--sale":""}">\n          <span class="money">\n          ${this.product.price_varies?window.theme.localize("FROM_PRICE"):""}\n          ${formatMoney(this.product.price,window.theme.money_product_price_format)}\n          </span>\n        </span>\n        ${this.product.compare_at_price>this.product.price?`\n              <span class="u-hidden-visually">${window.theme.localize("SALE_PRICE")}</span>\n              <span class="price__compare">\n                <span class="money">${formatMoney(this.product.compare_at_price,window.theme.money_format)}\n                </span>\n              </span>\n            `:""}\n      `;e.innerHTML=t}const i=this.querySelector("product-card-price-notes"),r=this.product.variants.find((t=>t.available));if(i&&r&&r.unit_price_measurement){const t=document.createElement("span");t.classList.add("price__note","price__note--unit");const e=document.getElementById("template-unit-price").content;t.appendChild(e.cloneNode(!0)),i.appendChild(t);const s=`${1!==r.unit_price_measurement.reference_value?r.unit_price_measurement.reference_value:""}${r.unit_price_measurement.reference_unit}`;i.querySelector("unit-price").innerHTML=window.formatMoney(r.unit_price,window.window.theme.money_format),i.querySelector("base-unit").innerHTML=s}if("button"===this.quickShopTriggerType){const t=this.querySelector("product-card-button");if(this.product.available)if(this.product.variants&&this.product.variants.length>1){const e=document.getElementById((this.sectionId?`${this.sectionId}--`:"")+"template-quick-shop-button").content.cloneNode(!0),i=e.querySelector("a");i&&(i.href=this.product.url),t.appendChild(e)}else{const e=document.getElementById((this.sectionId?`${this.sectionId}--`:"")+"template-add-to-cart-form").content.cloneNode(!0);e.querySelector('input[name="id"]').value=this.product.variants[0].id;const i=this.querySelector("product-card-quick-shop");i&&i.remove(),t.appendChild(e)}else{const e=document.getElementById((this.sectionId?`${this.sectionId}--`:"")+"template-sold-out-button").content,i=this.querySelector("product-card-quick-shop");i&&i.remove(),t.appendChild(e.cloneNode(!0))}}const s=this.querySelector("product-card-quick-shop");if(s&&("button"!==this.quickShopTriggerType||this.product.available&&1!==this.product.variants.length)){const t=document.getElementById((this.sectionId?`${this.sectionId}--`:"")+"template-quick-shop").content;if(this.quickShop=t.cloneNode(!0).querySelector("quick-shop"),this.quickShop.hasAttribute("placeholder")&&this.quickShop.setAttribute("data-product-url",this.product.url),this.quickShopTrigger=this.querySelector("[data-trigger-quick-shop]"),this.quickShopTrigger.addEventListener("click",this.#t),this.closest(".modal")||this.closest("items-scroll")){const t=document.getElementById("moved-modal-elements");t&&t.appendChild(this.quickShop)}else s.replaceWith(this.quickShop)}this.setAttribute("rendered",""),this.isRendered=!0}renderImage(t,e,i,r="",s="",c="100vw",o=[180,360,540,720,900,1080,1296,1512]){if(!t||!e||!i)return null;const a=document.createElement("img"),n="natural"!==this.imageContainerRatio?this.imageContainerRatio.split(":").reduce(((t,e)=>0!==t?e/t:e),0):null,d=e/i,h="natural"===this.imageContainerRatio||n&&this.imageFit;let u=e,l=i;h||(l=Math.round(u*n),l>i&&(l=i,u=Math.round(l/n)));const p=o.reduce(((e,i)=>{const r=Math.round(h?i/d:i*n);return i>u||r>l?e:`${e}${t}${t.includes("?")?"&":"?"}width=${i}${h?"":`&height=${r}&crop=center`} ${i}w ${r}h, `}),""),m=h?t:`${t}${t.includes("?")?"&":"?"}width=${u}&height=${l}&crop=center`;return a.setAttribute("src",m),a.setAttribute("srcset",p),a.setAttribute("width",u),a.setAttribute("height",l),a.setAttribute("class",r),a.setAttribute("alt",s),a.setAttribute("sizes",c),a}updateImage(t,e,i,r="",s=[180,360,540,720,900,1080,1296,1512]){if(!(this.image&&t&&e&&i))return;const c="natural"!==this.imageContainerRatio?this.imageContainerRatio.split(":").reduce(((t,e)=>0!==t?e/t:e),0):null,o=e/i,a="natural"===this.imageContainerRatio||c&&this.imageFit;let n=e,d=i;a||(d=Math.round(n*c),d>i&&(d=i,n=Math.round(d/c)));const h=s.reduce(((e,i)=>{const r=Math.round(a?i/o:i*c);return i>n||r>d?e:`${e}${t}${t.includes("?")?"&":"?"}width=${i}${a?"":`&height=${r}&crop=center`} ${i}w ${r}h, `}),""),u=a?t:`${t}${t.includes("?")?"&":"?"}width=${n}&height=${d}

1&crop=center`;this.image.setAttribute("src",u),this.image.setAttribute("srcset",h),this.image.setAttribute("width",n),this.image.setAttribute("height",d),this.image.setAttribute("alt",r)}updateSkeleton(){if(!this.image)return;const t=this.image.nextElementSibling&&"image-skeleton"===this.image.nextElementSibling.tagName.toLowerCase()?this.image.nextElementSibling:null;if(t){const e=t.querySelector("svg"),i=e.querySelector("rect"),r=this.image.getAttribute("width"),s=this.image.getAttribute("height");t.setAttribute("aria-label",`Loading image for ${this.product.title}`),e.setAttribute("width",r),e.setAttribute("height",s),e.setAttribute("viewBox",`0 0 ${r} ${s}`),i.setAttribute("width",r),i.setAttribute("height",s)}}}customElements.define("product-card-mini",ProductCardMini);class ProductCard extends ProductCardMini{#i;#r;#s;constructor(){super(),this.#i=this.setVariant.bind(this)}connectedCallback(){super.connectedCallback(),this.#s=[],this.product&&!this.isRendered&&(this.#r=this.product.url,this.render()),0===this.#s.length&&(this.#s=Array.from(this.querySelectorAll("li[variant-id]"))),this.product||this.#c(),this.#o()}disconnectedCallback(){super.disconnectedCallback(),this.#a()}set product(t){super.productData=t,this.isRendered||(this.#r=this.product.url,this.#o())}get product(){return this.productData}async render(){super.render();const t=this.querySelector("product-card-variant-swatches");if(t){const e=await import("swatch-colors"),i=this.product.options.find((t=>e.triggers.includes(t.name.toLowerCase())));if(i){const e=this.sectionId?`${this.sectionId}--template-swatch`:"template-swatch",r=document.getElementById(e).content;t.innerHTML=`\n          <div class="swatch-wrapper">\n            <div class="product-card__swatch">\n              <ul class="product-card__swatch__items o-list-inline">\n              </ul>\n              ${i.values.length>5?`\n                    <div class="product-card__overflow">\n                      <a product-card-link href="${this.product.url}" class="product-card__overflow__item" title="${this.product.title}">\n                        <span class="">+${i.values.length-5}</span>\n                      </a>\n                    </div>\n                  `:""}\n            </div>\n          </div>\n        `;const s=t.querySelector("ul");i.values.slice(0,5).forEach((t=>{const e=this.product.variants.find((e=>e[`option${i.position}`]===t));if(e){const i=e.id,c=r.cloneNode(!0),o=handle(t),a=c.querySelector("variant-swatch");a.setAttribute("swatch-id",o),a.style.setProperty("--background-graphic",o.replaceAll("-","")),a.setAttribute("aria-label",t.replaceAll('"',""));const n=c.querySelector("li");n.setAttribute("variant-id",i),this.#s.push(n),s.appendChild(c)}}))}}}#c(){const t=this.querySelector("[id^=ProductJson]");t&&(this.product=JSON.parse(t.textContent))}setVariant(t){if(!t.target.hasAttribute("variant-id"))return;const e=t.target.getAttribute("variant-id"),i=this.product.variants.find((t=>t.id.toString()===e));if(i){this.querySelectorAll("li.is-active").forEach((t=>t.classList.remove("is-active"))),t.target.classList.add("is-active"),this.#r=`${this.product.url}${this.product.url.includes("?")?"&":"?"}variant=${e}`;const r=i.featured_media?i.featured_media.preview_image:this.product.media&&this.product.media.length>0?this.product.media[0].preview_image:null;this.querySelectorAll("a[product-card-link]").forEach((t=>t.setAttribute("href",this.#r))),r&&this.updateImage(r.src,r.width,r.height,r.alt);const s=this.querySelector("quick-shop");s&&(s.variantId=e)}}#o(){this.#s.forEach((t=>{t.addEventListener("click",this.#i)}))}#a(){this.#s.forEach((t=>{t.removeEventListener("click",this.#i)}))}}customElements.define("product-card",ProductCard);
2//# sourceMappingURL=product-cards.js.map