https://www.granngarden.se/dist/Component.CustomProductList.a0591b7c.js

1"use strict";(self.fkaWebpackJsonp=self.fkaWebpackJsonp||[]).push([[945,3896,4456],{3773:(t,e,l)=>{l.r(e),l.d(e,{default:()=>f});var r=l(641),o=l(33);const n={key:0,class:"custom-product-list"},a={key:0,class:"custom-product-list__heading"},c=["data-count","data-scroll-pointer"];var s=l(2124),u=l(1724),i=l(9898),d=l(1626),p=l(9901),v=l(9635);const h=(0,r.pM)({name:"CustomProductList",components:{ProductCard:u.default,ScrollPointer:i.default},props:{products:{type:Array,required:!0},heading:{type:String,default:void 0},gridClass:{type:String,default:void 0},variant:{type:Number,default:void 0},showScrollPointer:{type:Boolean,default:!1},scrollDesktop:{type:Boolean,default:!1},disableTracking:{type:Boolean,default:!1}},setup(t){const e=(0,s.Pj)(),l="manual_rec_panel",o=(0,r.EW)((()=>["product-grid",t.gridClass,{"product-grid--scroll-desktop":t.scrollDesktop}])),n=(0,r.EW)((()=>void 0!==t.variant?t.variant:t.products.length<=3?d.S.Double:d.S.Grid)),a=(0,r.EW)((()=>{if(t.disableTracking)return[];const l=(0,v.RP)(e);return t.products.map((t=>{const e=l.find((e=>e.productNumber===t.productNumber));return{productNumber:t.productNumber,name:t.name,link:t.link,price:e,variantNumber:t.variantNumber}}))}));return(0,r.sV)((()=>{!t.disableTracking&&e&&a.value.length&&(0,p.aK)(e,{listName:t.heading||l,products:a.value})})),{gridClasses:o,computedVariant:n,ProductListTrackingName:l}}});const g=(0,l(6262).A)(h,[["render",function(t,e,l,s,u,i){const d=(0,r.g2)("scroll-pointer"),p=(0,r.g2)("product-card");return t.products?.length>0?((0,r.uX)(),(0,r.CE)("div",n,[t.heading?((0,r.uX)(),(0,r.CE)("h2",a,(0,o.v_)(t.heading),1)):(0,r.Q3)("",!0),(0,r.Lk)("div",{class:(0,o.C4)(t.gridClasses),"data-count":t.products.length,"data-scroll-pointer":t.showScrollPointer?"":void 0,"data-test":"product-grid"},[t.showScrollPointer?((0,r.uX)(),(0,r.Wv)(d,{key:0,"product-count":t.products.length},null,8,["product-count"])):(0,r.Q3)("",!0),((0,r.uX)(!0),(0,r.CE)(r.FK,null,(0,r.pI)(t.products,((e,l)=>((0,r.uX)(),(0,r.Wv)(p,(0,r.v6)({key:`${e.productNumber}:${e.variantNumber??""}`,ref_for:!0},e,{variant:t.computedVariant,"list-name":t.heading||t.ProductListTrackingName,"list-index":l,"heading-level":t.heading?"h3":"h2"}),null,16,["variant","list-name","list-index","heading-level"])))),128))],10,c)])):(0,r.Q3)("",!0)}]]),f=g},9898:(t,e,l)=>{l.r(e),l.d(e,{default:()=>s});var r=l(641);const o={class:"scroll-pointer__root-hidden-reference",ref:"rootEl"};var n=l(5052),a=l(953);const c=(0,r.pM)({name:"ScrollPointer",components:{Icon:n.A},props:{productCount:{type:Number,default:0}},setup(t){const e=(0,a.KR)(!1),l=(0,a.KR)(!1),o=(0,a.KR)(null);let n=null;const c=(0,a.KR)(null),s=(0,r.EW)((()=>c.value?c.value:null)),u=(0,r.EW)((()=>s.value?.getElementsByClassName("product-card")[0]?.getBoundingClientRect().width??0)),i=(0,r.EW)((()=>{if(!s.value||!u.value||t.productCount<=1)return 0;const e=u.value*t.productCount;return(s.value.scrollWidth-e)/(t.productCount-1)})),d=()=>{if(!s.value)return;const t=s.value;e.value=t.scrollLeft>0,l.value=t.scrollLeft+t.clientWidth<t.scrollWidth};return(0,r.sV)((async()=>{await(0,r.dY)(),c.value=o.value?.closest("[data-scroll-pointer]")||null,s.value?.addEventListener("scroll",d),d(),s.value&&(n=new ResizeObserver((()=>{d()})),n.observe(s.value))})),(0,r.hi)((()=>{s.value?.removeEventListener("scroll",d),n&&s.value&&(n.unobserve(s.value),n.disconnect())})),{cardWidth:u,cardGap:i,scrollContainer:s,handleScrollDirection:t=>{if(!s.value)return;const e=u.value+i.value;s.value.scrollBy({left:"right"===t?e:-e,behavior:"smooth"})},canScroll:()=>!!s.value&&s.value.scrollWidth>s.value.clientWidth,showRight:l,showLeft:e,rootEl:o}}});const s=(0,l(6262).A)(c,[["render",function(t,e,l,n,a,c){const s=(0,r.g2)("icon");return(0,r.uX)(),(0,r.CE)(r.FK,null,[(0,r.Lk)("div",o,null,512),t.canScroll()&&t.showRight?((0,r.uX)(),(0,r.CE)("button",{key:0,class:"scroll-pointer__button scroll-pointer--right",type:"button","data-right-pointer-tracking":"",onClick:e[0]||(e[0]=e=>t.handleScrollDirection("right"))},[e[2]||(e[2]=(0,r.Lk)("span",{class:"sr-only"},"Scrolla till höger",-1)),(0,r.bF)(s,{icon:"chevron-down",width:"20",height:"20",class:"scroll-pointer__icon"})])):(0,r.Q3)("",!0),t.canScroll()&&t.showLeft?((0,r.uX)(),(0,r.CE)("button",{key:1,class:"scroll-pointer__button scroll-pointer--left",type:"button","data-left-pointer-tracking":"",onClick:e[1]||(e[1]=e=>t.handleScrollDirection("left"))},[e[3]||(e[3]=(0,r.Lk)("span",{class:"sr-only"},"Scrolla till vänster",-1)),(0,r.bF)(s,{icon:"chevron-down",width:"20",height:"20",class:"scroll-pointer__icon"})])):(0,r.Q3)("",!0)],64)}]])}}]);