https://www.granngarden.se/dist/Component.CartRecommendations.1fda7865.js

1"use strict";(self.fkaWebpackJsonp=self.fkaWebpackJsonp||[]).push([[945,4456,8424],{9356:(e,t,o)=>{o.r(t),o.d(t,{default:()=>f});var n=o(641),l=o(33);const r={key:0,class:"cart__recommendations"},c={class:"cart__recommendations-heading"},a={class:"product-grid product-grid--scroll","data-scroll-pointer":""};var s=o(4324),i=o(6998),u=o(1724),d=o(9898),m=o(9901),p=o(5862),v=o(953),h=o(2124);const g=(0,n.pM)({name:"CartRecommendations",mixins:[(0,s.m)()],components:{ProductCard:u.default,ScrollPointer:d.default},props:{initialRecommendations:Object},setup(e){const t=(0,h.Pj)(),o=(0,v.KR)(null),l=(0,n.EW)((()=>t?(0,i.v)(t):void 0));return(0,n.wB)(l,(e=>{e?.products?.length&&(0,m.aK)(t,{listName:e.heading||"Andra tittade också på",products:e.products.slice(0,6),recommendations:p.l.Cart})}),{immediate:!0}),(0,n.sV)((()=>{t&&e.initialRecommendations&&(0,i.SK)(t,e.initialRecommendations)})),{recommendations:l,CartRecommendationType:p.l,cartProductRecRef:o}}});const f=(0,o(6262).A)(g,[["render",function(e,t,o,s,i,u){const d=(0,n.g2)("scroll-pointer"),m=(0,n.g2)("product-card");return e.recommendations&&e.recommendations.products&&e.recommendations.products.length?((0,n.uX)(),(0,n.CE)("div",r,[(0,n.Lk)("h2",c,(0,l.v_)(e.recommendations.heading||e.translate("recommendations")),1),(0,n.Lk)("div",a,[(0,n.bF)(d,{"product-count":e.recommendations.products.length},null,8,["product-count"]),((0,n.uX)(!0),(0,n.CE)(n.FK,null,(0,n.pI)(e.recommendations.products.slice(0,e.recommendations.products.length),((t,o)=>((0,n.uX)(),(0,n.Wv)(m,(0,n.v6)({key:t.productNumber,variant:5,lang:e.translate("productCard"),recommendations:e.CartRecommendationType.Cart,listName:e.recommendations?.heading||e.translate("recommendations"),listIndex:o,ref_for:!0},t),null,16,["lang","recommendations","listName","listIndex"])))),128))])])):(0,n.Q3)("",!0)}]])},9898:(e,t,o)=>{o.r(t),o.d(t,{default:()=>s});var n=o(641);const l={class:"scroll-pointer__root-hidden-reference",ref:"rootEl"};var r=o(5052),c=o(953);const a=(0,n.pM)({name:"ScrollPointer",components:{Icon:r.A},props:{productCount:{type:Number,default:0}},setup(e){const t=(0,c.KR)(!1),o=(0,c.KR)(!1),l=(0,c.KR)(null);let r=null;const a=(0,c.KR)(null),s=(0,n.EW)((()=>a.value?a.value:null)),i=(0,n.EW)((()=>s.value?.getElementsByClassName("product-card")[0]?.getBoundingClientRect().width??0)),u=(0,n.EW)((()=>{if(!s.value||!i.value||e.productCount<=1)return 0;const t=i.value*e.productCount;return(s.value.scrollWidth-t)/(e.productCount-1)})),d=()=>{if(!s.value)return;const e=s.value;t.value=e.scrollLeft>0,o.value=e.scrollLeft+e.clientWidth<e.scrollWidth};return(0,n.sV)((async()=>{await(0,n.dY)(),a.value=l.value?.closest("[data-scroll-pointer]")||null,s.value?.addEventListener("scroll",d),d(),s.value&&(r=new ResizeObserver((()=>{d()})),r.observe(s.value))})),(0,n.hi)((()=>{s.value?.removeEventListener("scroll",d),r&&s.value&&(r.unobserve(s.value),r.disconnect())})),{cardWidth:i,cardGap:u,scrollContainer:s,handleScrollDirection:e=>{if(!s.value)return;const t=i.value+u.value;s.value.scrollBy({left:"right"===e?t:-t,behavior:"smooth"})},canScroll:()=>!!s.value&&s.value.scrollWidth>s.value.clientWidth,showRight:o,showLeft:t,rootEl:l}}});const s=(0,o(6262).A)(a,[["render",function(e,t,o,r,c,a){const s=(0,n.g2)("icon");return(0,n.uX)(),(0,n.CE)(n.FK,null,[(0,n.Lk)("div",l,null,512),e.canScroll()&&e.showRight?((0,n.uX)(),(0,n.CE)("button",{key:0,class:"scroll-pointer__button scroll-pointer--right",type:"button","data-right-pointer-tracking":"",onClick:t[0]||(t[0]=t=>e.handleScrollDirection("right"))},[t[2]||(t[2]=(0,n.Lk)("span",{class:"sr-only"},"Scrolla till höger",-1)),(0,n.bF)(s,{icon:"chevron-down",width:"20",height:"20",class:"scroll-pointer__icon"})])):(0,n.Q3)("",!0),e.canScroll()&&e.showLeft?((0,n.uX)(),(0,n.CE)("button",{key:1,class:"scroll-pointer__button scroll-pointer--left",type:"button","data-left-pointer-tracking":"",onClick:t[1]||(t[1]=t=>e.handleScrollDirection("left"))},[t[3]||(t[3]=(0,n.Lk)("span",{class:"sr-only"},"Scrolla till vänster",-1)),(0,n.bF)(s,{icon:"chevron-down",width:"20",height:"20",class:"scroll-pointer__icon"})])):(0,n.Q3)("",!0)],64)}]])}}]);