https://www.maccosmetics.com/cdn/shop/t/182/assets/core-nosto-products-carousel.DYUlhFHV.min.js

1import{a as t}from"./BaseElement.wji90fuE.min.js";import{h as e,u as r,x as s,n as i,t as o}from"./vendor-lit.2u3dzq2T.min.js";var d=Object.defineProperty,n=Object.getOwnPropertyDescriptor,l=(t,e,r,s)=>{for(var i,o=s>1?void 0:s?n(e,r):e,l=t.length-1;l>=0;l--)(i=t[l])&&(o=(s?i(e,r,o):i(o))||o);return s&&o&&d(e,r,o),o};let p=class extends t{constructor(){super(...arguments),this.title="",this.products="",this.resultId="",this.nostoProductsTask=new e(this,{task:([t])=>{if("string"==typeof t)return JSON.parse(decodeURIComponent(t))},args:()=>[this.products]})}_renderProductsHTML(t){return s`<swiper-container
2      slides-per-view="auto"
3      navigation="true"
4      class="-mr-2 flex overflow-hidden"
5    >
6      ${r(t,t=>t.product_id,t=>s`
7            <swiper-slide
8              class="h-auto w-7/12 flex-none justify-center px-2 md:w-4/12 lg:w-3/12"
9            >
10              <dynamic-product-card
11                handle="${t.url.split("/").slice(-1)}"
12                template="product-card"
13                url-postfix="nosto=${this.resultId}"
14                product-id="${t.product_id}"
15              ></dynamic-product-card>
16            </swiper-slide>
17          `)}
18    </swiper-container>`}render(){return s`
19      <div class="py-md container">
20        ${this.title&&s`
21          <div class="md:flex md:items-center md:justify-between">
22            <h2 class="h2 text-gray-900">${this.title}</h2>
23          </div>
24        `}
25
26        <div class="py-md">
27          ${this.nostoProductsTask.render({initial:()=>s`<slot></slot>`,pending:()=>s`<slot></slot>`,complete:t=>this._renderProductsHTML(t),error:()=>s`<slot></slot>`})}
28        </div>
29      </div>
30    `}};l([i({type:String})],p.prototype,"title",2),l([i({type:String})],p.prototype,"products",2),l([i({type:String,attribute:"result-id"})],p.prototype,"resultId",2),p=l([o("nosto-products-carousel")],p);export{p as NostoProductsCarousel};