{"version":3,"sources":["webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?18fb","webpack:///resources/js/src/app/components/item/ItemImageCarousel.vue","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?f260"],"names":["render","_vm","this","_c","_self","staticClass","class","showOverlay","showBackgroundOverlay","topItemTags","length","_l","tag","key","selectionId","_v","_s","value","_e","attrs","id","on","mouseenter","stopCarousel","mouseleave","startCarousel","staticStyle","mousemove","handleMouseMove","handleMouseLeave","previewImages","item","index","active","click","$event","openOverlay","_defineProperty","src","alt","name","loading","fetchpriority","showHoverBox","style","hoverBoxStyle","width","height","viewBox","fill","xmlns","d","stroke","_","_objectSpread","backgroundImage","selectedImage","zoomImageStyle","videoId","href","target","rel","filter","cx","cy","r","x","y","filterUnits","result","in","type","values","dy","stdDeviation","in2","operator","mode","carouselImages","selectedIndex","decoding","bottomItemTags","directives","rawName","itemId","openBackgroundOverlay","multiLanguage","ProductBackgroundVariations","visible","closeOverlay","closeBackgroundOverlay","_withStripped","components","props","imageUrlsData","Array","required","String","default","Object","data","computed","$props","map","urlPreview","url","variation","$store","getters","concat","variationProperties","_variation$variationP","vidProp","properties","substring","getItemTags","methods","document","body","classList","add","remove","$","carousel","event","_event$target$getBoun","getBoundingClientRect","left","top","hoverBoxLeft","clientX","hoverBoxSize","hoverBoxTop","clientY","xPercentage","Math","max","min","yPercentage","backgroundPosition","backgroundSize","selectionIds","_variation$variationP2","_properties$find","find","includes","mounted","_this","$nextTick","activeItem","relatedTarget","attr","watch","handler","newVal","immediate","component"],"mappings":"y5CAAA,IAAIA,EAAS,WACX,IAAIC,EAAMC,KACRC,EAAKF,EAAIG,MAAMD,GACjB,OAAOA,EACL,MACA,CACEE,YAAa,6BACbC,MAAO,CACL,uBAAwBL,EAAIM,aAAeN,EAAIO,wBAGnD,CACEL,EAAG,MAAO,CAAEE,YAAa,sBAAwB,CAC/CF,EAAG,MAAO,CAAEE,YAAa,gCAAkC,CACzDJ,EAAIQ,YAAYC,OAAS,EACrBP,EAAG,MAAO,CAAEE,YAAa,mCAAqC,CAC5DF,EACE,MACA,CAAEE,YAAa,4CACfJ,EAAIU,GAAGV,EAAIQ,aAAa,SAAUG,GAChC,OAAOT,EACL,OACA,CAAEU,IAAKD,EAAIE,YAAaT,YAAa,kBACrC,CACEJ,EAAIc,GACF,iBAAmBd,EAAIe,GAAGJ,EAAIK,OAAS,qBAK/C,KAGJhB,EAAIiB,KACRjB,EAAIc,GAAG,KACPZ,EACE,MACA,CACEE,YAAa,iBACbc,MAAO,CACLC,GAAI,2BACJ,YAAa,WACb,gBAAiB,KAEnBC,GAAI,CACFC,WAAYrB,EAAIsB,aAChBC,WAAYvB,EAAIwB,gBAGpB,CACEtB,EACE,MACA,CACEE,YAAa,4BACbqB,YAAa,CAAE,YAAa,gBAE9B,CACEvB,EACE,MACA,CACEE,YAAa,iBACbgB,GAAI,CACFM,UAAW1B,EAAI2B,gBACfJ,WAAYvB,EAAI4B,mBAGpB,CACE5B,EAAIU,GAAGV,EAAI6B,eAAe,SAAUC,EAAMC,GACxC,OAAO7B,EACL,MACA,CACEU,IAAKmB,EACL1B,MAAO,CACL,iBAAiB,EACjB2B,OAAkB,IAAVD,GAEVX,GAAI,CACFa,MAAO,SAAUC,GACf,OAAOlC,EAAImC,YAAYJ,MAI7B,CACE7B,EAAG,MAAO,CACRE,YAAa,gBACbc,MAAKkB,IAAA,CACHC,IAAKP,EACLQ,IAAKtC,EAAIuC,KACTC,QAAmB,IAAVT,EAAc,QAAU,OACjCU,cAAe,QAAM,UACZ,QAAM,WACL,gBAMpBzC,EAAIc,GAAG,KACPd,EAAI0C,aACAxC,EAAG,MAAO,CACRE,YAAa,YACbuC,MAAO3C,EAAI4C,gBAEb5C,EAAIiB,MAEV,KAINjB,EAAIc,GAAG,KACPZ,EACE,SACA,CACEE,YAAa,yCACbc,MAAO,CACL,cAAe,4BACf,aAAc,OACd,aAAc,aAGlB,CACEhB,EACE,MACA,CACEgB,MAAO,CACL2B,MAAO,KACPC,OAAQ,KACRC,QAAS,YACTC,KAAM,OACNC,MAAO,+BAGX,CACE/C,EAAG,OAAQ,CACTgB,MAAO,CACLgC,EAAG,mBACHC,OAAQ,UACR,eAAgB,IAChB,iBAAkB,QAClB,kBAAmB,eAO/BnD,EAAIc,GAAG,KACPZ,EACE,SACA,CACEE,YAAa,yCACbc,MAAO,CACL,cAAe,4BACf,aAAc,OACd,aAAc,SAGlB,CACEhB,EACE,MACA,CACEgB,MAAO,CACL2B,MAAO,KACPC,OAAQ,KACRC,QAAS,YACTC,KAAM,OACNC,MAAO,+BAGX,CACE/C,EAAG,OAAQ,CACTgB,MAAO,CACLgC,EAAG,kBACHC,OAAQ,UACR,eAAgB,IAChB,iBAAkB,QAClB,kBAAmB,eAO/BnD,EAAIc,GAAG,KACPZ,EACE,KACA,CAAEE,YAAa,uBACfJ,EAAIU,GAAGV,EAAI6B,eAAe,SAAUuB,EAAGrB,GACrC,OAAO7B,EAAG,KAAM,CACdU,IAAKmB,EACL1B,MAAO,CAAE2B,OAAkB,IAAVD,GACjBb,MAAO,CACL,cAAe,4BACf,gBAAiBa,QAIvB,KAIN/B,EAAIc,GAAG,KACPd,EAAI0C,aACAxC,EAAG,MAAO,CACRE,YAAa,aACbuC,MAAKU,EAAA,CACHC,gBAAiB,OAAStD,EAAIuD,cAAgB,KAC3CvD,EAAIwD,kBAGXxD,EAAIiB,KACRjB,EAAIc,GAAG,KACPd,EAAIyD,QACAvD,EACE,IACA,CACEE,YAAa,gBACbc,MAAO,CACLwC,KAAM,iCAAmC1D,EAAIyD,QAC7CE,OAAQ,SACRC,IAAK,sBACL,aAAc,kBAGlB,CACE1D,EACE,MACA,CACEgB,MAAO,CACL2B,MAAO,KACPC,OAAQ,KACRC,QAAS,YACTC,KAAM,OACNC,MAAO,+BAGX,CACE/C,EACE,IACA,CAAEgB,MAAO,CAAE2C,OAAQ,8BACnB,CACE3D,EAAG,SAAU,CACXgB,MAAO,CACL4C,GAAI,KACJC,GAAI,KACJC,EAAG,KACHhB,KAAM,eAKdhD,EAAIc,GAAG,KACPZ,EAAG,OAAQ,CACTgB,MAAO,CACLgC,EAAG,4LACHF,KAAM,aAGVhD,EAAIc,GAAG,KACPZ,EAAG,OAAQ,CACTA,EACE,SACA,CACEgB,MAAO,CACLC,GAAI,sBACJ8C,EAAG,IACHC,EAAG,IACHrB,MAAO,KACPC,OAAQ,KACRqB,YAAa,iBACb,8BAA+B,SAGnC,CACEjE,EAAG,UAAW,CACZgB,MAAO,CACL,gBAAiB,IACjBkD,OAAQ,wBAGZpE,EAAIc,GAAG,KACPZ,EAAG,gBAAiB,CAClBgB,MAAO,CACLmD,GAAI,cACJC,KAAM,SACNC,OACE,4CACFH,OAAQ,eAGZpE,EAAIc,GAAG,KACPZ,EAAG,WAAY,CAAEgB,MAAO,CAAEsD,GAAI,OAC9BxE,EAAIc,GAAG,KACPZ,EAAG,iBAAkB,CACnBgB,MAAO,CAAEuD,aAAc,OAEzBzE,EAAIc,GAAG,KACPZ,EAAG,cAAe,CAChBgB,MAAO,CAAEwD,IAAK,YAAaC,SAAU,SAEvC3E,EAAIc,GAAG,KACPZ,EAAG,gBAAiB,CAClBgB,MAAO,CACLoD,KAAM,SACNC,OACE,gDAGNvE,EAAIc,GAAG,KACPZ,EAAG,UAAW,CACZgB,MAAO,CACL0D,KAAM,SACNF,IAAK,qBACLN,OAAQ,kCAGZpE,EAAIc,GAAG,KACPZ,EAAG,UAAW,CACZgB,MAAO,CACL0D,KAAM,SACNP,GAAI,gBACJK,IAAK,+BACLN,OAAQ,YAId,SAOZpE,EAAIiB,OAEVjB,EAAIc,GAAG,KACPZ,EACE,MACA,CACEE,YACE,uEAEJJ,EAAIU,GAAGV,EAAI6E,gBAAgB,SAAU/C,EAAMC,GACzC,OAAO7B,EACL,MACA,CACEU,IAAKmB,EACL3B,YAAa,kCACbC,MAAO,CAAE2B,OAAQD,IAAU/B,EAAI8E,eAC/B5D,MAAO,CACL,cAAe,4BACf,gBAAiBa,IAGrB,CACE7B,EAAG,MAAO,CACRE,YAAa,YACbc,MAAO,CACLmB,IAAKP,EACLQ,IAAKtC,EAAIuC,KACTC,QAAS,OACTuC,SAAU,gBAMpB,KAGJ/E,EAAIc,GAAG,KACPd,EAAIgF,eAAevE,OAAS,EACxBP,EACE,MACA,CACEE,YACE,yFAEJJ,EAAIU,GAAGV,EAAIgF,gBAAgB,SAAUrE,GACnC,OAAOT,EACL,MACA,CACEU,IAAKD,EAAIE,YACTT,YACE,oEAEJ,CACqB,MAAnBO,EAAIE,YACAX,EAAG,MAAO,CACR+E,WAAY,CACV,CAAE1C,KAAM,eAAgB2C,QAAS,mBAEnChE,MAAO,CACLmB,IAAK,GACL,WACE,mFACFC,IAAK3B,EAAIK,MACTwB,QAAS,OACTuC,SAAU,QACVlC,MAAO,KACPC,OAAQ,QAGZ9C,EAAIiB,KACRjB,EAAIc,GAAG,KACY,MAAnBH,EAAIE,YACAX,EAAG,MAAO,CACR+E,WAAY,CACV,CAAE1C,KAAM,eAAgB2C,QAAS,mBAEnChE,MAAO,CACLmB,IAAK,GACL,WACE,kFACFC,IAAK3B,EAAIK,MACTwB,QAAS,OACTuC,SAAU,QACVlC,MAAO,KACPC,OAAQ,QAGZ9C,EAAIiB,KACRjB,EAAIc,GAAG,KACY,MAAnBH,EAAIE,YACAX,EAAG,MAAO,CACR+E,WAAY,CACV,CAAE1C,KAAM,eAAgB2C,QAAS,mBAEnChE,MAAO,CACLmB,IAAK,GACL,WACE,8EACFC,IAAK3B,EAAIK,MACTwB,QAAS,OACTuC,SAAU,QACVlC,MAAO,KACPC,OAAQ,QAGZ9C,EAAIiB,KACRjB,EAAIc,GAAG,KACY,MAAnBH,EAAIE,YACAX,EAAG,MAAO,CACR+E,WAAY,CACV,CAAE1C,KAAM,eAAgB2C,QAAS,mBAEnChE,MAAO,CACLmB,IAAK,GACL,WACE,+EACFC,IAAK3B,EAAIK,MACTwB,QAAS,OACTuC,SAAU,QACVlC,MAAO,KACPC,OAAQ,QAGZ9C,EAAIiB,KACRjB,EAAIc,GAAG,KACPZ,EAAG,OAAQ,CAAEE,YAAa,SAAW,CACnCJ,EAAIc,GAAGd,EAAIe,GAAGJ,EAAIK,eAK1B,GAEFhB,EAAIiB,KACRjB,EAAIc,GAAG,KACPZ,EACE,MACA,CACEE,YACE,oEAEJ,CACEF,EAAG,eAAgB,CAAEgB,MAAO,CAAE,UAAWlB,EAAImF,UAC7CnF,EAAIc,GAAG,KACPZ,EACE,SACA,CACEE,YACE,qEACFgB,GAAI,CAAEa,MAAOjC,EAAIoF,wBAEnB,CACElF,EACE,MACA,CACEgB,MAAO,CACL,cAAe,OACf+B,MAAO,6BACPJ,MAAO,KACPC,OAAQ,KACRE,KAAM,OACND,QAAS,cAGb,CACE7C,EAAG,OAAQ,CACTgB,MAAO,CACLiC,OAAQ,eACR,iBAAkB,QAClB,kBAAmB,QACnB,eAAgB,IAChBD,EAAG,gIAKXlD,EAAIc,GAAG,KACPZ,EAAG,OAAQ,CAAEE,YAAa,cAAgB,CACxCJ,EAAIc,GACF,aACEd,EAAIe,GAAGf,EAAIqF,cAAcC,6BACzB,iBAMZ,GAEFtF,EAAIc,GAAG,KACPd,EAAIM,YACAJ,EACE,MACA,CAAEE,YAAa,mBACf,CACEF,EAAG,qBAAsB,CACvBgB,MAAO,CACLqE,QAASvF,EAAIM,YACb,kBAAmBN,EAAI6E,eACvB,iBAAkB7E,EAAI6B,cACtB,iBAAkB7B,EAAI8E,cACtBvC,KAAMvC,EAAIuC,MAEZnB,GAAI,CAAE,gBAAiBpB,EAAIwF,iBAG/B,GAEFxF,EAAIiB,KACRjB,EAAIc,GAAG,KACPd,EAAIO,sBACAL,EACE,MACA,CAAEE,YAAa,mBACf,CACEF,EAAG,0BAA2B,CAC5BgB,MAAO,CACLqE,QAASvF,EAAIO,sBACb,iBAAkBP,EAAI6B,cAAc,GACpCU,KAAMvC,EAAIuC,MAEZnB,GAAI,CAAE,2BAA4BpB,EAAIyF,2BAG1C,GAEFzF,EAAIiB,QAKdlB,EAAO2F,eAAgB,E,0CCrjBiM,EC2TzM,CACfnD,KAAA,sBACAoD,WAAA,CACA,gEACA,uEACA,mGAEAC,MAAA,CACAC,cAAA,CACAvB,KAAAwB,MACAC,UAAA,GAEAxD,KAAA,CACA+B,KAAA0B,OACAD,UAAA,GAEAZ,OAAA,CACAc,QAAA,MAEAZ,cAAAa,QAEAC,KAAA,WACA,OACA5C,cAAA,KACAuB,cAAA,EACAtB,eAAA,GACAd,cAAA,EACAE,cAAA,GACAtC,aAAA,EACAC,uBAAA,IAGA6F,SAAA,CACAvB,eAAA,WACA,YAAAwB,OAAAR,cAAAS,KAAA,SAAAxE,GAAA,OAAAA,EAAAyE,eAEA1E,cAAA,WACA,YAAAwE,OAAAR,cAAAS,KAAA,SAAAxE,GAAA,OAAAA,EAAA0E,QAEA/C,QAAA,WACA,IAAAgD,EACA,KAAAC,OAAAC,QAAA,GAAAC,OAAA,KAAAP,OAAAlB,OAAA,0BACA,GACAsB,GACAA,EAAAI,qBACAJ,EAAAI,oBAAApG,OAAA,EACA,KAAAqG,EACAC,EAAA,QAAAD,EAAAL,EAAAI,oBAAA,cAAAC,OAAA,EAAAA,EAAAE,WAAAnD,QACA,SAAA/B,GAAA,aAAAA,EAAAX,MAGA,OAAA4F,EAAAtG,OAAA,GAAAsG,EAAA,GAAAxC,OAAAvD,MACA+F,EAAA,GAAAxC,OAAAvD,MAAAiG,UAAA,GAEA,KAEA,aAEAzG,YAAA,WACA,YAAA0G,YAAA,6BAEAlC,eAAA,WACA,YAAAkC,YAAA,yBAGAC,QAAA,CACAhF,YAAA,SAAAJ,GACA,KAAA+C,cAAA/C,EACA,KAAAzB,aAAA,EACA8G,SAAAC,KAAAC,UAAAC,IAAA,iBAEA/B,aAAA,WACA,KAAAlF,aAAA,EACA8G,SAAAC,KAAAC,UAAAE,OAAA,iBAEApC,sBAAA,WACA,KAAA7E,uBAAA,EACA6G,SAAAC,KAAAC,UAAAC,IAAA,iBAEA9B,uBAAA,WACA,KAAAlF,uBAAA,EACA6G,SAAAC,KAAAC,UAAAE,OAAA,iBAEAlG,aAAA,WACAmG,EAAA,6BAAAC,SAAA,UAEAlG,cAAA,WACAiG,EAAA,6BAAAC,SAAA,UAEA/F,gBAAA,SAAAgG,GACA,IAAAC,EAAAD,EAAAhE,OAAAkE,wBAAAC,EAAAF,EAAAE,KAAAC,EAAAH,EAAAG,IAAAlF,EAAA+E,EAAA/E,MAAAC,EAAA8E,EAAA9E,OAKAkF,EAJAL,EAAAM,QAIAC,GAAAJ,EACAK,EALAR,EAAAS,QAKAF,GAAAH,EAKAM,GAHAL,EAAAM,KAAAC,IAAA,EAAAD,KAAAE,IAAAR,EAAAnF,EALA,QAQAA,EARA,KAQA,IACA4F,GAHAN,EAAAG,KAAAC,IAAA,EAAAD,KAAAE,IAAAL,EAAArF,EANA,QASAA,EATA,KASA,IAEA,KAAAF,cAAA,CACAkF,KAAA,GAAAlB,OAAAoB,EAAA,MACAD,IAAA,GAAAnB,OAAAuB,EAAA,MACAtF,MAAA,GAAA+D,OAdA,IAcA,MACA9D,OAAA,GAAA8D,OAfA,IAeA,OAGA,KAAAlE,cAAA,EAEA,KAAAc,eAAA,CACAkF,mBAAA,GAAA9B,OAAAyB,EAAA,MAAAzB,OAAA6B,EAAA,KACAE,eAAA,GAAA/B,OAAA/D,EAAA,UAAA+D,OAAA9D,EAAA,WAGAlB,iBAAA,WACA,KAAAc,cAAA,GAEAwE,YAAA,SAAA0B,GAAA,IAAAC,EAAAC,EACArC,EACA,KAAAC,OAAAC,QAAA,GAAAC,OAAA,KAAAP,OAAAlB,OAAA,0BAGA,QADA,QAAA2D,IADArC,SAAA,QAAAoC,EAAApC,EAAAI,2BAAA,IAAAgC,GAAA,QAAAA,IAAA,cAAAA,OAAA,EAAAA,EAAA7B,aAAA,IACA+B,MAAA,SAAAjH,GAAA,aAAAA,EAAAX,aAAA,IAAA2H,OAAA,EAAAA,EAAAvE,SAAA,IACAV,QAAA,SAAAlD,GAAA,OAAAiI,EAAAI,SAAArI,EAAAE,kBAGAoI,QAAA,eAAAC,EAAA,KACA,KAAAC,WAAA,WACA1B,EAAA,6BAAAC,WAEAwB,EAAA3F,cAAA2F,EAAArH,cAAA,GAEA4F,EAAA,6BAAArG,GAAA,6BAAAuG,GACA,IAAAyB,EAAA3B,EAAAE,EAAA0B,eACAH,EAAA3F,cAAA6F,EAAAL,KAAA,OAAAO,KAAA,OACAJ,EAAApE,cAAAsE,EAAArH,eAIAwH,MAAA,CACA1D,cAAA,CACA2D,QAAA,SAAAC,GACA,KAAAlG,cAAAkG,EAAA,KAAA3E,eAAA0B,KAEAkD,WAAA,K,SCvcIC,EAAY,YACd,EACA5J,EH2iBoB,IGziBpB,EACA,KACA,KACA,MAIa,UAAA4J,E","file":"chunks/ceres-client-47.min.js","sourcesContent":["var render = function render() {\n  var _vm = this,\n    _c = _vm._self._c\n  return _c(\n    \"div\",\n    {\n      staticClass: \"single-item-images-wrapper\",\n      class: {\n        \"overlay-image-opened\": _vm.showOverlay || _vm.showBackgroundOverlay,\n      },\n    },\n    [\n      _c(\"div\", { staticClass: \"single-item-images\" }, [\n        _c(\"div\", { staticClass: \"main-image position-relative\" }, [\n          _vm.topItemTags.length > 0\n            ? _c(\"div\", { staticClass: \"position-absolute item-tags-top\" }, [\n                _c(\n                  \"div\",\n                  { staticClass: \"d-flex flex-column text-center item-tags\" },\n                  _vm._l(_vm.topItemTags, function (tag) {\n                    return _c(\n                      \"span\",\n                      { key: tag.selectionId, staticClass: \"item-tag small\" },\n                      [\n                        _vm._v(\n                          \"\\n            \" + _vm._s(tag.value) + \"\\n          \"\n                        ),\n                      ]\n                    )\n                  }),\n                  0\n                ),\n              ])\n            : _vm._e(),\n          _vm._v(\" \"),\n          _c(\n            \"div\",\n            {\n              staticClass: \"carousel slide\",\n              attrs: {\n                id: \"singleItemCarouselImages\",\n                \"data-ride\": \"carousel\",\n                \"data-interval\": 5000,\n              },\n              on: {\n                mouseenter: _vm.stopCarousel,\n                mouseleave: _vm.startCarousel,\n              },\n            },\n            [\n              _c(\n                \"div\",\n                {\n                  staticClass: \"position-relative mx-auto\",\n                  staticStyle: { \"max-width\": \"fit-content\" },\n                },\n                [\n                  _c(\n                    \"div\",\n                    {\n                      staticClass: \"carousel-inner\",\n                      on: {\n                        mousemove: _vm.handleMouseMove,\n                        mouseleave: _vm.handleMouseLeave,\n                      },\n                    },\n                    [\n                      _vm._l(_vm.previewImages, function (item, index) {\n                        return _c(\n                          \"div\",\n                          {\n                            key: index,\n                            class: {\n                              \"carousel-item\": true,\n                              active: index === 0,\n                            },\n                            on: {\n                              click: function ($event) {\n                                return _vm.openOverlay(index)\n                              },\n                            },\n                          },\n                          [\n                            _c(\"img\", {\n                              staticClass: \"d-block w-100\",\n                              attrs: {\n                                src: item,\n                                alt: _vm.name,\n                                loading: index === 0 ? \"eager\" : \"lazy\",\n                                fetchpriority: \"high\",\n                                loading: \"lazy\",\n                                decoding: \"async\",\n                              },\n                            }),\n                          ]\n                        )\n                      }),\n                      _vm._v(\" \"),\n                      _vm.showHoverBox\n                        ? _c(\"div\", {\n                            staticClass: \"hover-box\",\n                            style: _vm.hoverBoxStyle,\n                          })\n                        : _vm._e(),\n                    ],\n                    2\n                  ),\n                ]\n              ),\n              _vm._v(\" \"),\n              _c(\n                \"button\",\n                {\n                  staticClass: \"carousel-control carousel-control-prev\",\n                  attrs: {\n                    \"data-target\": \"#singleItemCarouselImages\",\n                    \"data-slide\": \"prev\",\n                    \"aria-label\": \"Previous\",\n                  },\n                },\n                [\n                  _c(\n                    \"svg\",\n                    {\n                      attrs: {\n                        width: \"24\",\n                        height: \"24\",\n                        viewBox: \"0 0 24 24\",\n                        fill: \"none\",\n                        xmlns: \"http://www.w3.org/2000/svg\",\n                      },\n                    },\n                    [\n                      _c(\"path\", {\n                        attrs: {\n                          d: \"M15 18L9 12L15 6\",\n                          stroke: \"#121926\",\n                          \"stroke-width\": \"2\",\n                          \"stroke-linecap\": \"round\",\n                          \"stroke-linejoin\": \"round\",\n                        },\n                      }),\n                    ]\n                  ),\n                ]\n              ),\n              _vm._v(\" \"),\n              _c(\n                \"button\",\n                {\n                  staticClass: \"carousel-control carousel-control-next\",\n                  attrs: {\n                    \"data-target\": \"#singleItemCarouselImages\",\n                    \"data-slide\": \"next\",\n                    \"aria-label\": \"Next\",\n                  },\n                },\n                [\n                  _c(\n                    \"svg\",\n                    {\n                      attrs: {\n                        width: \"24\",\n                        height: \"24\",\n                        viewBox: \"0 0 24 24\",\n                        fill: \"none\",\n                        xmlns: \"http://www.w3.org/2000/svg\",\n                      },\n                    },\n                    [\n                      _c(\"path\", {\n                        attrs: {\n                          d: \"M9 18L15 12L9 6\",\n                          stroke: \"#121926\",\n                          \"stroke-width\": \"2\",\n                          \"stroke-linecap\": \"round\",\n                          \"stroke-linejoin\": \"round\",\n                        },\n                      }),\n                    ]\n                  ),\n                ]\n              ),\n              _vm._v(\" \"),\n              _c(\n                \"ol\",\n                { staticClass: \"carousel-indicators\" },\n                _vm._l(_vm.previewImages, function (_, index) {\n                  return _c(\"li\", {\n                    key: index,\n                    class: { active: index === 0 },\n                    attrs: {\n                      \"data-target\": \"#singleItemCarouselImages\",\n                      \"data-slide-to\": index,\n                    },\n                  })\n                }),\n                0\n              ),\n            ]\n          ),\n          _vm._v(\" \"),\n          _vm.showHoverBox\n            ? _c(\"div\", {\n                staticClass: \"zoom-image\",\n                style: {\n                  backgroundImage: \"url(\" + _vm.selectedImage + \")\",\n                  ..._vm.zoomImageStyle,\n                },\n              })\n            : _vm._e(),\n          _vm._v(\" \"),\n          _vm.videoId\n            ? _c(\n                \"a\",\n                {\n                  staticClass: \"video-preview\",\n                  attrs: {\n                    href: \"https://www.youtube.com/embed/\" + _vm.videoId,\n                    target: \"_blank\",\n                    rel: \"noopener noreferrer\",\n                    \"aria-label\": \"video preview\",\n                  },\n                },\n                [\n                  _c(\n                    \"svg\",\n                    {\n                      attrs: {\n                        width: \"50\",\n                        height: \"50\",\n                        viewBox: \"0 0 64 64\",\n                        fill: \"none\",\n                        xmlns: \"http://www.w3.org/2000/svg\",\n                      },\n                    },\n                    [\n                      _c(\n                        \"g\",\n                        { attrs: { filter: \"url(#filter0_d_567_26611)\" } },\n                        [\n                          _c(\"circle\", {\n                            attrs: {\n                              cx: \"32\",\n                              cy: \"28\",\n                              r: \"24\",\n                              fill: \"#f53d3d\",\n                            },\n                          }),\n                        ]\n                      ),\n                      _vm._v(\" \"),\n                      _c(\"path\", {\n                        attrs: {\n                          d: \"M39.7199 27.663C40.3236 28.0577 40.3236 28.9422 39.7199 29.3369L29.5473 35.9883C28.8821 36.4232 28 35.946 28 35.1514L28 21.8486C28 21.054 28.8821 20.5768 29.5472 21.0117L39.7199 27.663Z\",\n                          fill: \"#ffffff\",\n                        },\n                      }),\n                      _vm._v(\" \"),\n                      _c(\"defs\", [\n                        _c(\n                          \"filter\",\n                          {\n                            attrs: {\n                              id: \"filter0_d_567_26611\",\n                              x: \"0\",\n                              y: \"0\",\n                              width: \"64\",\n                              height: \"64\",\n                              filterUnits: \"userSpaceOnUse\",\n                              \"color-interpolation-filters\": \"sRGB\",\n                            },\n                          },\n                          [\n                            _c(\"feFlood\", {\n                              attrs: {\n                                \"flood-opacity\": \"0\",\n                                result: \"BackgroundImageFix\",\n                              },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feColorMatrix\", {\n                              attrs: {\n                                in: \"SourceAlpha\",\n                                type: \"matrix\",\n                                values:\n                                  \"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\",\n                                result: \"hardAlpha\",\n                              },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feOffset\", { attrs: { dy: \"4\" } }),\n                            _vm._v(\" \"),\n                            _c(\"feGaussianBlur\", {\n                              attrs: { stdDeviation: \"4\" },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feComposite\", {\n                              attrs: { in2: \"hardAlpha\", operator: \"out\" },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feColorMatrix\", {\n                              attrs: {\n                                type: \"matrix\",\n                                values:\n                                  \"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0\",\n                              },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feBlend\", {\n                              attrs: {\n                                mode: \"normal\",\n                                in2: \"BackgroundImageFix\",\n                                result: \"effect1_dropShadow_567_26611\",\n                              },\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"feBlend\", {\n                              attrs: {\n                                mode: \"normal\",\n                                in: \"SourceGraphic\",\n                                in2: \"effect1_dropShadow_567_26611\",\n                                result: \"shape\",\n                              },\n                            }),\n                          ],\n                          1\n                        ),\n                      ]),\n                    ]\n                  ),\n                ]\n              )\n            : _vm._e(),\n        ]),\n        _vm._v(\" \"),\n        _c(\n          \"div\",\n          {\n            staticClass:\n              \"thumbnail-images justify-content-md-center justify-content-lg-start\",\n          },\n          _vm._l(_vm.carouselImages, function (item, index) {\n            return _c(\n              \"div\",\n              {\n                key: index,\n                staticClass: \"thumbnail-image overflow-hidden\",\n                class: { active: index === _vm.selectedIndex },\n                attrs: {\n                  \"data-target\": \"#singleItemCarouselImages\",\n                  \"data-slide-to\": index,\n                },\n              },\n              [\n                _c(\"img\", {\n                  staticClass: \"img-fluid\",\n                  attrs: {\n                    src: item,\n                    alt: _vm.name,\n                    loading: \"lazy\",\n                    decoding: \"async\",\n                  },\n                }),\n              ]\n            )\n          }),\n          0\n        ),\n      ]),\n      _vm._v(\" \"),\n      _vm.bottomItemTags.length > 0\n        ? _c(\n            \"div\",\n            {\n              staticClass:\n                \"d-flex align-items-center justify-content-center flex-wrap text-center item-tags my-3\",\n            },\n            _vm._l(_vm.bottomItemTags, function (tag) {\n              return _c(\n                \"div\",\n                {\n                  key: tag.selectionId,\n                  staticClass:\n                    \"d-inline-flex align-items-center justify-content-center item-tag\",\n                },\n                [\n                  tag.selectionId == 2809\n                    ? _c(\"img\", {\n                        directives: [\n                          { name: \"lazyload-img\", rawName: \"v-lazyload-img\" },\n                        ],\n                        attrs: {\n                          src: \"\",\n                          \"data-src\":\n                            \"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/hand-palm.png\",\n                          alt: tag.value,\n                          loading: \"lazy\",\n                          decoding: \"async\",\n                          width: \"20\",\n                          height: \"20\",\n                        },\n                      })\n                    : _vm._e(),\n                  _vm._v(\" \"),\n                  tag.selectionId == 2810\n                    ? _c(\"img\", {\n                        directives: [\n                          { name: \"lazyload-img\", rawName: \"v-lazyload-img\" },\n                        ],\n                        attrs: {\n                          src: \"\",\n                          \"data-src\":\n                            \"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/hand-tap.png\",\n                          alt: tag.value,\n                          loading: \"lazy\",\n                          decoding: \"async\",\n                          width: \"20\",\n                          height: \"20\",\n                        },\n                      })\n                    : _vm._e(),\n                  _vm._v(\" \"),\n                  tag.selectionId == 2811\n                    ? _c(\"img\", {\n                        directives: [\n                          { name: \"lazyload-img\", rawName: \"v-lazyload-img\" },\n                        ],\n                        attrs: {\n                          src: \"\",\n                          \"data-src\":\n                            \"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/wool.png\",\n                          alt: tag.value,\n                          loading: \"lazy\",\n                          decoding: \"async\",\n                          width: \"20\",\n                          height: \"20\",\n                        },\n                      })\n                    : _vm._e(),\n                  _vm._v(\" \"),\n                  tag.selectionId == 2812\n                    ? _c(\"img\", {\n                        directives: [\n                          { name: \"lazyload-img\", rawName: \"v-lazyload-img\" },\n                        ],\n                        attrs: {\n                          src: \"\",\n                          \"data-src\":\n                            \"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/towel.png\",\n                          alt: tag.value,\n                          loading: \"lazy\",\n                          decoding: \"async\",\n                          width: \"20\",\n                          height: \"20\",\n                        },\n                      })\n                    : _vm._e(),\n                  _vm._v(\" \"),\n                  _c(\"span\", { staticClass: \"small\" }, [\n                    _vm._v(_vm._s(tag.value)),\n                  ]),\n                ]\n              )\n            }),\n            0\n          )\n        : _vm._e(),\n      _vm._v(\" \"),\n      _c(\n        \"div\",\n        {\n          staticClass:\n            \"d-flex justify-content-between align-items-center mb-2 mr-2 mt-1\",\n        },\n        [\n          _c(\"series-badge\", { attrs: { \"item-id\": _vm.itemId } }),\n          _vm._v(\" \"),\n          _c(\n            \"button\",\n            {\n              staticClass:\n                \"button-overlay-background d-inline-flex ml-auto align-items-center\",\n              on: { click: _vm.openBackgroundOverlay },\n            },\n            [\n              _c(\n                \"svg\",\n                {\n                  attrs: {\n                    \"aria-hidden\": \"true\",\n                    xmlns: \"http://www.w3.org/2000/svg\",\n                    width: \"20\",\n                    height: \"20\",\n                    fill: \"none\",\n                    viewBox: \"0 0 24 24\",\n                  },\n                },\n                [\n                  _c(\"path\", {\n                    attrs: {\n                      stroke: \"currentColor\",\n                      \"stroke-linecap\": \"round\",\n                      \"stroke-linejoin\": \"round\",\n                      \"stroke-width\": \"2\",\n                      d: \"m3 16 5-7 6 6.5m6.5 2.5L16 13l-4.286 6M14 10h.01M4 19h16a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1Z\",\n                    },\n                  }),\n                ]\n              ),\n              _vm._v(\" \"),\n              _c(\"span\", { staticClass: \"ml-2 small\" }, [\n                _vm._v(\n                  \"\\n        \" +\n                    _vm._s(_vm.multiLanguage.ProductBackgroundVariations) +\n                    \"\\n      \"\n                ),\n              ]),\n            ]\n          ),\n        ],\n        1\n      ),\n      _vm._v(\" \"),\n      _vm.showOverlay\n        ? _c(\n            \"div\",\n            { staticClass: \"overlay-wrapper\" },\n            [\n              _c(\"item-image-overlay\", {\n                attrs: {\n                  visible: _vm.showOverlay,\n                  \"carousel-images\": _vm.carouselImages,\n                  \"preview-images\": _vm.previewImages,\n                  \"selected-index\": _vm.selectedIndex,\n                  name: _vm.name,\n                },\n                on: { \"close-overlay\": _vm.closeOverlay },\n              }),\n            ],\n            1\n          )\n        : _vm._e(),\n      _vm._v(\" \"),\n      _vm.showBackgroundOverlay\n        ? _c(\n            \"div\",\n            { staticClass: \"overlay-wrapper\" },\n            [\n              _c(\"item-background-overlay\", {\n                attrs: {\n                  visible: _vm.showBackgroundOverlay,\n                  \"selected-image\": _vm.previewImages[0],\n                  name: _vm.name,\n                },\n                on: { \"close-background-overlay\": _vm.closeBackgroundOverlay },\n              }),\n            ],\n            1\n          )\n        : _vm._e(),\n    ]\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }","import mod from \"-!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ItemImageCarousel.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ItemImageCarousel.vue?vue&type=script&lang=js\"","<template>\n  <div\n    class=\"single-item-images-wrapper\"\n    :class=\"{ 'overlay-image-opened': showOverlay || showBackgroundOverlay }\"\n  >\n    <div class=\"single-item-images\">\n      <div class=\"main-image position-relative\">\n        <div\n          v-if=\"topItemTags.length > 0\"\n          class=\"position-absolute item-tags-top\"\n        >\n          <div class=\"d-flex flex-column text-center item-tags\">\n            <span\n              class=\"item-tag small\"\n              v-for=\"tag in topItemTags\"\n              :key=\"tag.selectionId\"\n            >\n              {{ tag.value }}\n            </span>\n          </div>\n        </div>\n        <div\n          id=\"singleItemCarouselImages\"\n          class=\"carousel slide\"\n          data-ride=\"carousel\"\n          :data-interval=\"5000\"\n          @mouseenter=\"stopCarousel\"\n          @mouseleave=\"startCarousel\"\n        >\n          <div class=\"position-relative mx-auto\" style=\"max-width: fit-content\">\n            <div\n              class=\"carousel-inner\"\n              @mousemove=\"handleMouseMove\"\n              @mouseleave=\"handleMouseLeave\"\n            >\n              <div\n                v-for=\"(item, index) in previewImages\"\n                :key=\"index\"\n                :class=\"{ 'carousel-item': true, active: index === 0 }\"\n                @click=\"openOverlay(index)\"\n              >\n                <img\n                  class=\"d-block w-100\"\n                  :src=\"item\"\n                  :alt=\"name\"\n                  :loading=\"index === 0 ? 'eager' : 'lazy'\"\n                  fetchpriority=\"high\"\n                  loading=\"lazy\"\n                  decoding=\"async\"\n                />\n              </div>\n\n              <div\n                class=\"hover-box\"\n                v-if=\"showHoverBox\"\n                :style=\"hoverBoxStyle\"\n              ></div>\n            </div>\n          </div>\n          <button\n            class=\"carousel-control carousel-control-prev\"\n            data-target=\"#singleItemCarouselImages\"\n            data-slide=\"prev\"\n            aria-label=\"Previous\"\n          >\n            <svg\n              width=\"24\"\n              height=\"24\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M15 18L9 12L15 6\"\n                stroke=\"#121926\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n          <button\n            class=\"carousel-control carousel-control-next\"\n            data-target=\"#singleItemCarouselImages\"\n            data-slide=\"next\"\n            aria-label=\"Next\"\n          >\n            <svg\n              width=\"24\"\n              height=\"24\"\n              viewBox=\"0 0 24 24\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <path\n                d=\"M9 18L15 12L9 6\"\n                stroke=\"#121926\"\n                stroke-width=\"2\"\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n              />\n            </svg>\n          </button>\n          <ol class=\"carousel-indicators\">\n            <li\n              v-for=\"(_, index) in previewImages\"\n              :key=\"index\"\n              data-target=\"#singleItemCarouselImages\"\n              :data-slide-to=\"index\"\n              :class=\"{ active: index === 0 }\"\n            ></li>\n          </ol>\n        </div>\n        <div\n          v-if=\"showHoverBox\"\n          class=\"zoom-image\"\n          :style=\"{\n            backgroundImage: 'url(' + selectedImage + ')',\n            ...zoomImageStyle,\n          }\"\n        ></div>\n        <a\n          v-if=\"videoId\"\n          :href=\"'https://www.youtube.com/embed/' + videoId\"\n          target=\"_blank\"\n          rel=\"noopener noreferrer\"\n          class=\"video-preview\"\n          aria-label=\"video preview\"\n        >\n          <svg\n            width=\"50\"\n            height=\"50\"\n            viewBox=\"0 0 64 64\"\n            fill=\"none\"\n            xmlns=\"http://www.w3.org/2000/svg\"\n          >\n            <g filter=\"url(#filter0_d_567_26611)\">\n              <circle cx=\"32\" cy=\"28\" r=\"24\" fill=\"#f53d3d\"></circle>\n            </g>\n            <path\n              d=\"M39.7199 27.663C40.3236 28.0577 40.3236 28.9422 39.7199 29.3369L29.5473 35.9883C28.8821 36.4232 28 35.946 28 35.1514L28 21.8486C28 21.054 28.8821 20.5768 29.5472 21.0117L39.7199 27.663Z\"\n              fill=\"#ffffff\"\n            ></path>\n            <defs>\n              <filter\n                id=\"filter0_d_567_26611\"\n                x=\"0\"\n                y=\"0\"\n                width=\"64\"\n                height=\"64\"\n                filterUnits=\"userSpaceOnUse\"\n                color-interpolation-filters=\"sRGB\"\n              >\n                <feFlood\n                  flood-opacity=\"0\"\n                  result=\"BackgroundImageFix\"\n                ></feFlood>\n                <feColorMatrix\n                  in=\"SourceAlpha\"\n                  type=\"matrix\"\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0\"\n                  result=\"hardAlpha\"\n                ></feColorMatrix>\n                <feOffset dy=\"4\"></feOffset>\n                <feGaussianBlur stdDeviation=\"4\"></feGaussianBlur>\n                <feComposite in2=\"hardAlpha\" operator=\"out\"></feComposite>\n                <feColorMatrix\n                  type=\"matrix\"\n                  values=\"0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.15 0\"\n                ></feColorMatrix>\n                <feBlend\n                  mode=\"normal\"\n                  in2=\"BackgroundImageFix\"\n                  result=\"effect1_dropShadow_567_26611\"\n                ></feBlend>\n                <feBlend\n                  mode=\"normal\"\n                  in=\"SourceGraphic\"\n                  in2=\"effect1_dropShadow_567_26611\"\n                  result=\"shape\"\n                ></feBlend>\n              </filter>\n            </defs>\n          </svg>\n        </a>\n      </div>\n      <div\n        class=\"thumbnail-images justify-content-md-center justify-content-lg-start\"\n      >\n        <div\n          v-for=\"(item, index) in carouselImages\"\n          :key=\"index\"\n          class=\"thumbnail-image overflow-hidden\"\n          data-target=\"#singleItemCarouselImages\"\n          :data-slide-to=\"index\"\n          :class=\"{ active: index === selectedIndex }\"\n        >\n          <img\n            class=\"img-fluid\"\n            :src=\"item\"\n            :alt=\"name\"\n            loading=\"lazy\"\n            decoding=\"async\"\n          />\n        </div>\n      </div>\n    </div>\n    <div\n      v-if=\"bottomItemTags.length > 0\"\n      class=\"d-flex align-items-center justify-content-center flex-wrap text-center item-tags my-3\"\n    >\n      <div\n        class=\"d-inline-flex align-items-center justify-content-center item-tag\"\n        v-for=\"tag in bottomItemTags\"\n        :key=\"tag.selectionId\"\n      >\n        <img\n          v-if=\"tag.selectionId == 2809\"\n          src=\"\"\n          v-lazyload-img\n          data-src=\"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/hand-palm.png\"\n          :alt=\"tag.value\"\n          loading=\"lazy\"\n          decoding=\"async\"\n          width=\"20\"\n          height=\"20\"\n        />\n        <img\n          v-if=\"tag.selectionId == 2810\"\n          src=\"\"\n          v-lazyload-img\n          data-src=\"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/hand-tap.png\"\n          :alt=\"tag.value\"\n          loading=\"lazy\"\n          decoding=\"async\"\n          width=\"20\"\n          height=\"20\"\n        />\n        <img\n          v-if=\"tag.selectionId == 2811\"\n          src=\"\"\n          v-lazyload-img\n          data-src=\"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/wool.png\"\n          :alt=\"tag.value\"\n          loading=\"lazy\"\n          decoding=\"async\"\n          width=\"20\"\n          height=\"20\"\n        />\n        <img\n          v-if=\"tag.selectionId == 2812\"\n          src=\"\"\n          v-lazyload-img\n          data-src=\"https://cdn02.plentymarkets.com/6wg68w8zahno/frontend/assets/icons/towel.png\"\n          :alt=\"tag.value\"\n          loading=\"lazy\"\n          decoding=\"async\"\n          width=\"20\"\n          height=\"20\"\n        />\n        <span class=\"small\">{{ tag.value }}</span>\n      </div>\n    </div>\n    <div\n      class=\"d-flex justify-content-between align-items-center mb-2 mr-2 mt-1\"\n    >\n      <series-badge :item-id=\"itemId\"></series-badge>\n      <button\n        @click=\"openBackgroundOverlay\"\n        class=\"button-overlay-background d-inline-flex ml-auto align-items-center\"\n      >\n        <svg\n          aria-hidden=\"true\"\n          xmlns=\"http://www.w3.org/2000/svg\"\n          width=\"20\"\n          height=\"20\"\n          fill=\"none\"\n          viewBox=\"0 0 24 24\"\n        >\n          <path\n            stroke=\"currentColor\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            stroke-width=\"2\"\n            d=\"m3 16 5-7 6 6.5m6.5 2.5L16 13l-4.286 6M14 10h.01M4 19h16a1 1 0 0 0 1-1V6a1 1 0 0 0-1-1H4a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1Z\"\n          />\n        </svg>\n        <span class=\"ml-2 small\">\n          {{ multiLanguage.ProductBackgroundVariations }}\n        </span>\n      </button>\n    </div>\n\n    <div v-if=\"showOverlay\" class=\"overlay-wrapper\">\n      <item-image-overlay\n        :visible=\"showOverlay\"\n        :carousel-images=\"carouselImages\"\n        :preview-images=\"previewImages\"\n        :selected-index=\"selectedIndex\"\n        :name=\"name\"\n        @close-overlay=\"closeOverlay\"\n      ></item-image-overlay>\n    </div>\n    <div v-if=\"showBackgroundOverlay\" class=\"overlay-wrapper\">\n      <item-background-overlay\n        :visible=\"showBackgroundOverlay\"\n        :selected-image=\"previewImages[0]\"\n        :name=\"name\"\n        @close-background-overlay=\"closeBackgroundOverlay\"\n      ></item-background-overlay>\n    </div>\n  </div>\n</template>\n\n<script>\nexport default {\n  name: \"item-image-carousel\",\n  components: {\n    \"series-badge\": () => import(\"./SeriesBadge.vue\"),\n    \"item-image-overlay\": () => import(\"./ItemImageOverlay.vue\"),\n    \"item-background-overlay\": () => import(\"./ItemBackgroundOverlay.vue\"),\n  },\n  props: {\n    imageUrlsData: {\n      type: Array,\n      required: true,\n    },\n    name: {\n      type: String,\n      required: true,\n    },\n    itemId: {\n      default: null,\n    },\n    multiLanguage: Object,\n  },\n  data() {\n    return {\n      selectedImage: null,\n      selectedIndex: 0,\n      zoomImageStyle: {},\n      showHoverBox: false,\n      hoverBoxStyle: {},\n      showOverlay: false,\n      showBackgroundOverlay: false,\n    };\n  },\n  computed: {\n    carouselImages() {\n      return this.$props.imageUrlsData.map((item) => item.urlPreview);\n    },\n    previewImages() {\n      return this.$props.imageUrlsData.map((item) => item.url);\n    },\n    videoId() {\n      const variation =\n        this.$store.getters[`${this.$props.itemId}/currentItemVariation`];\n      if (\n        variation &&\n        variation.variationProperties &&\n        variation.variationProperties.length > 0\n      ) {\n        const vidProp = variation.variationProperties[0]?.properties.filter(\n          (item) => item.id === 690\n        );\n\n        if (vidProp.length > 0 && vidProp[0].values.value) {\n          return vidProp[0].values.value.substring(2);\n        }\n        return null;\n      }\n      return null;\n    },\n    topItemTags() {\n      return this.getItemTags([2806, 2807, 2808, 2813, 2814]);\n    },\n    bottomItemTags() {\n      return this.getItemTags([2809, 2810, 2811, 2812]);\n    },\n  },\n  methods: {\n    openOverlay(index) {\n      this.selectedIndex = index;\n      this.showOverlay = true;\n      document.body.classList.add(\"fixed-active\");\n    },\n    closeOverlay() {\n      this.showOverlay = false;\n      document.body.classList.remove(\"fixed-active\");\n    },\n    openBackgroundOverlay() {\n      this.showBackgroundOverlay = true;\n      document.body.classList.add(\"fixed-active\");\n    },\n    closeBackgroundOverlay() {\n      this.showBackgroundOverlay = false;\n      document.body.classList.remove(\"fixed-active\");\n    },\n    stopCarousel() {\n      $(\"#singleItemCarouselImages\").carousel(\"pause\");\n    },\n    startCarousel() {\n      $(\"#singleItemCarouselImages\").carousel(\"cycle\");\n    },\n    handleMouseMove(event) {\n      const { left, top, width, height } = event.target.getBoundingClientRect();\n      const { clientX, clientY } = event;\n\n      const hoverBoxSize = 150;\n\n      let hoverBoxLeft = clientX - hoverBoxSize / 2 - left;\n      let hoverBoxTop = clientY - hoverBoxSize / 2 - top;\n\n      hoverBoxLeft = Math.max(0, Math.min(hoverBoxLeft, width - hoverBoxSize));\n      hoverBoxTop = Math.max(0, Math.min(hoverBoxTop, height - hoverBoxSize));\n\n      const xPercentage = (hoverBoxLeft / (width - hoverBoxSize)) * 100;\n      const yPercentage = (hoverBoxTop / (height - hoverBoxSize)) * 100;\n\n      this.hoverBoxStyle = {\n        left: `${hoverBoxLeft}px`,\n        top: `${hoverBoxTop}px`,\n        width: `${hoverBoxSize}px`,\n        height: `${hoverBoxSize}px`,\n      };\n\n      this.showHoverBox = true;\n\n      this.zoomImageStyle = {\n        backgroundPosition: `${xPercentage}% ${yPercentage}%`,\n        backgroundSize: `${width / 1.5}% ${height / 1.5}%`,\n      };\n    },\n    handleMouseLeave() {\n      this.showHoverBox = false;\n    },\n    getItemTags(selectionIds) {\n      const variation =\n        this.$store.getters[`${this.$props.itemId}/currentItemVariation`];\n      const properties = variation?.variationProperties?.[1]?.properties || [];\n      const itemTags = properties.find((item) => item.id === 830)?.values || [];\n      return itemTags.filter((tag) => selectionIds.includes(tag.selectionId));\n    },\n  },\n  mounted() {\n    this.$nextTick(() => {\n      $(\"#singleItemCarouselImages\").carousel();\n\n      this.selectedImage = this.previewImages[0];\n\n      $(\"#singleItemCarouselImages\").on(\"slid.bs.carousel\", (event) => {\n        const activeItem = $(event.relatedTarget);\n        this.selectedImage = activeItem.find(\"img\").attr(\"src\");\n        this.selectedIndex = activeItem.index();\n      });\n    });\n  },\n  watch: {\n    imageUrlsData: {\n      handler(newVal) {\n        this.selectedImage = newVal[this.selectedIndex].url;\n      },\n      immediate: true,\n    },\n  },\n};\n</script>\n","import { render, staticRenderFns } from \"./ItemImageCarousel.vue?vue&type=template&id=5a13e371\"\nimport script from \"./ItemImageCarousel.vue?vue&type=script&lang=js\"\nexport * from \"./ItemImageCarousel.vue?vue&type=script&lang=js\"\n\n\n/* normalize component */\nimport normalizer from \"!../../../../../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  null,\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}