{"version":3,"sources":["webpack:///resources/js/src/app/components/item/ImageZoom.vue","webpack:///resources/js/src/app/components/item/ItemImageCarousel.vue","webpack:///./resources/js/src/app/components/item/ImageZoom.vue?f30b","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?55b3","webpack:///./resources/js/src/app/components/item/ImageZoom.vue","webpack:///./resources/js/src/app/components/item/ImageZoom.vue?fee2","webpack:///./resources/js/src/app/components/item/ImageZoom.vue?3004","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?df97","webpack:///./resources/js/src/app/components/item/ItemImageCarousel.vue?00e4"],"names":[],"mappings":"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A,sCAAsC;AACtC,6BAA6B;AAC7B;AACA,uCAAuC,uCAAuC;AAC9E;AACA;AACA,uBAAuB;AACvB;AACA;AACA;AACA;AACA;AACA,qBAAqB;AACrB;AACA,+BAA+B,oCAAoC;AACnE;AACA,+BAA+B,oCAAoC;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,KAAK;AACL;AACA;AACA;AACA;;;;;;;;;;;;;;AC1FA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,cAAc;AACd,KAAK;AACL;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,WAAW;AACX;AACA,8BAA8B,0BAA0B;AACxD;AACA;AACA;AACA,0BAA0B,kBAAkB;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mBAAmB;AACnB;AACA;AACA;AACA,WAAW;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,wBAAwB;AACxB,eAAe;AACf;AACA,kCAAkC,0BAA0B;AAC5D;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,qBAAqB;AACrB;AACA;AACA,gCAAgC,oCAAoC;AACpE;AACA;AACA;AACA;AACA;AACA;AACA,uBAAuB;AACvB;AACA;AACA;AACA;AACA,eAAe;AACf;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,eAAe;AACf,mBAAmB;AACnB,aAAa;AACb;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,aAAa;AACb;AACA,yBAAyB,0BAA0B;AACnD;AACA;AACA;AACA;AACA;AACA;AACA;AACA,iBAAiB;AACjB;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;;;;;;;;;;;;;AClIA;AAAA;AAAA;AAAA;AAAwF;AAC3B;AACL;;;AAGxD;AACsG;AACtG,gBAAgB,2GAAU;AAC1B,EAAE,+EAAM;AACR,EAAE,oFAAM;AACR,EAAE,6FAAe;AACjB;AACA;AACA;AACA;;AAEA;;AAEA;AACA,IAAI,KAAU,EAAE,YAiBf;AACD;AACe,gF;;;;;;;;;;;;ACtCf;AAAA;AAAA,wCAAiM,CAAgB,6OAAG,EAAC,C;;;;;;;;;;;;ACArN;AAAA;AAAA;AAAA;AAAA;AAAA;;;;;;;;;;;;;ACAA;AAAA;AAAA;AAAA;AAAgG;AAC3B;AACL;;;AAGhE;AACsG;AACtG,gBAAgB,2GAAU;AAC1B,EAAE,uFAAM;AACR,EAAE,4FAAM;AACR,EAAE,qGAAe;AACjB;AACA;AACA;AACA;;AAEA;;AAEA;AACA,IAAI,KAAU,EAAE,YAiBf;AACD;AACe,gF;;;;;;;;;;;;ACtCf;AAAA;AAAA,wCAAyM,CAAgB,qPAAG,EAAC,C;;;;;;;;;;;;ACA7N;AAAA;AAAA;AAAA;AAAA;AAAA","file":"chunks/ceres-client-13.js","sourcesContent":["<template>\n    <div class=\"product-detail__zoom\">\n        <div class=\"product-detail__zoom-wrapper\" v-if=\"zoomActive\">\n            <div class=\"product-detail__zoom-modal\" id=\"swiper-zoom\">\n                <div class=\"product-detail__zoom-head\">\n                    <div class=\"modal-title h3\">{{ $translate(\"eConnect::Template.singleZoomHeadline\") }}</div>\n                    <button type=\"button\" @click=\"close()\" class=\"close\" aria-hidden=\"true\">&times;</button>\n                </div>\n                <div class=\"product-detail__zoom-body\" :class=\"{ 'opacity-1' : showSwiper }\">\n                    <div class=\"swiper-container\" >\n                        <div class=\"swiper-wrapper\">\n                            <div v-for=\"image in singleImages\" class=\"swiper-slide\">\n                                <div class=\"swiper-zoom-container\">\n                                    <img :data-src=\"image.url\" class=\"swiper-lazy\" />\n                                    <div class=\"swiper-lazy-preloader\"></div>\n                                </div>\n                            </div>\n                        </div>\n                        <!-- Add Pagination -->\n                        <div class=\"swiper-pagination swiper-pagination-white\"></div>\n                        <!-- Add Navigation -->\n                        <div class=\"swiper-button-prev\"></div>\n                        <div class=\"swiper-button-next\"></div>\n                    </div>\n                </div>\n            </div>\n        </div>\n        <div class=\"product-detail__zoom-backdrop\" @click=\"close()\"></div>\n    </div>\n</template>\n<script>\n    import { Swiper } from 'swiper';\n\nexport default {\n\n    name: \"image-zoom\",\n    props: {\n        maxQuantity:\n            {\n                type: Number,\n                default: 10\n            },\n        imageUrlAccessor:\n            {\n                type: String,\n                default: \"url\"\n            },\n        showThumbs:\n            {\n                type: Boolean,\n                default: true\n            },\n        showDots:\n            {\n                type: Boolean,\n                default: true\n            },\n        animationStyle:\n            {\n                type: String,\n                default: \"standard\"\n            },\n        pluginPath:\n            {\n                type: String,\n                default: \"\"\n            },\n        zoomIndex:{\n            type: Number,\n            default: 0\n        }\n    },\n\n    inject: {\n        itemId: {\n            default: null\n        }\n    },\n\n    data()\n    {\n        return {\n            zoomActive: false,\n            zoomSwiper: null,\n            showSwiper: false\n        };\n    },\n    computed:\n        {\n            currentVariation() {\n                return this.$store.getters[`${this.itemId}/currentItemVariation`]\n            },\n\n            singleImages()\n            {\n                return this.$options.filters.itemImages(\n                    this.currentVariation.images,\n                    this.imageUrlAccessor\n                ).slice(0, this.maxQuantity);\n            }\n        },\n\n    mounted()\n    {\n        this.$nextTick(() =>\n        {\n            let that = this;\n            this.zoomActive=true;\n            window.setTimeout(function(){\n                that.initCarousel();\n            },1);\n        })\n    },\n\n    methods:{\n        initCarousel(){\n            let that = this;\n\n            //setTimeout(function(){\n            this.$nextTick(() => {\n                that.zoomSwiper = new Swiper('.product-detail__zoom .swiper-container', {\n                    zoom: {\n                        maxRatio: 3,\n                        toggle: true,\n                        containerClass: 'swiper-zoom-container',\n                        zoomedSlideClass: 'swiper-slide-zoomed',\n                    },\n                    lazy: true,\n                    sliderPerView: 1,\n                    pagination: {\n                        el: '.product-detail__zoom .swiper-pagination',\n                    },\n                    navigation: {\n                        nextEl: '.product-detail__zoom .swiper-button-next',\n                        prevEl: '.product-detail__zoom .swiper-button-prev',\n                    },\n                    on: {\n                        afterInit: function (thisSwiper) {\n                            thisSwiper.slideTo(that.zoomIndex);\n                            that.showSwiper = true;\n                            window.dispatchEvent(new Event('resize'));\n                            window.dispatchEvent(new Event('resize'));\n                        },\n                    },\n                });\n            });\n            //}, 250);\n\n        },\n\n        emitCloseToParent (event) {\n            this.$emit('getCloseCall', true)\n        },\n\n        close(){\n            this.showSwiper = false;\n            this.emitCloseToParent()\n        },\n    }\n}\n</script>\n","<template>\n    <!-- TODO: Wie können wir kleinere Bilder auslesen? Und die Höhe anpassen -->\n    <div class=\"product-detail-carousel\" itemscope itemtype=\"http://schema.org/Thing\">\n        <template>\n            <div class=\"single-carousel owl-carousel owl-theme owl-single-item mt-0\" ref=\"single\">\n                <div v-for=\"image in singleImages\" class=\"prop-1-1\">\n                    <a :href=\"image.url\" @click.prevent=\"openZoom()\">\n                        <img class=\"owl-lazy\" :data-src=\"image.url\" :alt=\"getAltText(image)\" :title=\"getImageName(image)\">\n                    </a>\n                </div>\n            </div>\n            <div v-if=\"showThumbs\" id=\"thumb-carousel\" class=\"owl-thumbs owl-carousel owl-theme owl-single-item\" ref=\"thumbs\">\n                <div class=\"prop-1-1\" v-for=\"(imagePreview, index) in carouselImages\">\n                    <div class=\"image-container\" @click=\"goTo(index)\">\n                        <lazy-img\n                                picture-class=\"owl-thumb border-appearance\"\n                                :class=\"{ 'active': currentItem === index}\"\n                                :image-url=\"imagePreview.url\"\n                                :alt=\"getAltText(imagePreview)\"\n                                :title=\"getImageName(imagePreview)\">\n                        </lazy-img>\n                    </div>\n                </div>\n            </div>\n            <image-zoom v-if=\"showZoom\"\n                        @getCloseCall=\"closeZoom\"\n                        :max-quantity=\"maxQuantity\"\n                        :image-url-accessor=\"imageUrlAccessor\"\n                        :show-thumbs=\"showThumbs\"\n                        :show-dots=\"showDots\"\n                        :zoom-index=\"currentItem\"\n                        :animation-style=\"animationStyle\"\n                        :plugin-path=\"pluginPath\"/>\n        </template>\n        <div v-if=\"!initialized\" class=\"single-carousel owl-carousel owl-theme owl-single-item mt-0 d-block\">\n            <div class=\"prop-1-1\">\n                <img class=\"owl-placeholder\"\n                     :src=\"singleImages[0].url\"\n                     :alt=\"getAltText(singleImages[0].url)\"\n                     :title=\"getImageName(singleImages[0].url)\">\n            </div>\n        </div>\n    </div>\n</template>\n\n<script>\nimport { isNullOrUndefined } from \"ceres/app/helper/utils\";\nimport ImageZoom from \"./ImageZoom.vue\";\n\nexport default {\n    components: {\n        ImageZoom\n    },\n\n    props: {\n        maxQuantity:\n        {\n            type: Number,\n            default: 10\n        },\n        imageUrlAccessor:\n        {\n            type: String,\n            default: \"url\"\n        },\n        showThumbs:\n        {\n            type: Boolean,\n            default: true\n        },\n        showDots:\n        {\n            type: Boolean,\n            default: true\n        },\n        animationStyle:\n        {\n            type: String,\n            default: \"standard\"\n        },\n        pluginPath:\n        {\n            type: String,\n            default: \"\"\n        }\n    },\n\n    inject: {\n        itemId: {\n            default: null\n        }\n    },\n\n    data()\n    {\n        return {\n            currentItem: 0,\n            initialized: false,\n            showZoom: false\n        };\n    },\n\n    computed:\n    {\n        currentVariation()\n        {\n            return this.$store.getters[`${this.itemId}/currentItemVariation`]\n        },\n\n        carouselImages()\n        {\n            return this.$options.filters.itemImages(\n                    this.currentVariation.images,\n                    \"urlPreview\"\n                ).slice(0, this.maxQuantity);\n        },\n\n        singleImages()\n        {\n            return this.$options.filters.itemImages(\n                    this.currentVariation.images,\n                    this.imageUrlAccessor\n            ).slice(0, this.maxQuantity);\n        }\n    },\n\n    watch: {\n        currentVariation:\n        {\n            handler(val, oldVal)\n            {\n                if (val !== oldVal)\n                {\n                    setTimeout(() =>\n                    {\n                        this.reInitialize();\n                    }, 1);\n                }\n            },\n            deep: true\n        }\n    },\n\n    mounted()\n    {\n        this.$nextTick(() =>\n        {\n            this.initCarousel();\n            this.initThumbCarousel();\n        });\n    },\n\n    methods:\n    {\n        openZoom(){\n            this.showZoom = true;\n        },\n\n        closeZoom(){\n            this.showZoom = false;\n        },\n\n        getImageCount()\n        {\n            return this.carouselImages.length > this.maxQuantity ? this.maxQuantity : this.carouselImages.length;\n        },\n\n        reInitialize()\n        {\n            const $owl = $(this.$refs.single);\n\n            $owl.trigger(\"destroy.owl.carousel\");\n            $owl.html($owl.find(\".owl-stage-outer\").html()).removeClass(\"owl-loaded\");\n            $owl.find(\".owl-item\").remove();\n\n            const $thumbs = $(this.$refs.thumbs);\n\n            $thumbs.trigger(\"destroy.owl.carousel\");\n            $thumbs.html($thumbs.find(\".owl-stage-outer\").html()).removeClass(\"owl-loaded\");\n            $thumbs.find(\".owl-item\").remove();\n\n            this.initCarousel();\n            this.initThumbCarousel();\n        },\n\n        initCarousel()\n        {\n            const imageCount = this.getImageCount();\n            const carouselSettings = {\n                autoHeight       : true,\n                dots             : this.showDots,\n                items            : 1,\n                lazyLoad         : true,\n                rewind           : true,\n                margin           : 10,\n                mouseDrag        : imageCount > 1,\n                nav              : imageCount > 1,\n                navClass         : [\n                    \"owl-single-item-nav left carousel-control\",\n                    \"owl-single-item-nav right carousel-control\"\n                ],\n                navContainerClass: \"\",\n                navText          : [\n                    \"<i class=\\\"owl-single-item-control fa fa-chevron-left\\\" aria-hidden=\\\"true\\\"></i>\",\n                    \"<i class=\\\"owl-single-item-control fa fa-chevron-right\\\" aria-hidden=\\\"true\\\"></i>\"\n                ],\n                smartSpeed       : 350,\n                onChanged: event =>\n                {\n                    const $thumb = $(this.$refs.thumbs);\n\n                    $thumb.trigger(\"to.owl.carousel\", [\n                        event.page.index,\n                        350\n                    ]);\n                },\n                onInitialized: event =>\n                {\n                    this.initialized = true;\n                }\n            };\n\n            if (this.animationStyle !== \"standard\")\n            {\n                carouselSettings.animateOut = this.animationStyle;\n            }\n\n            $(this.$refs.single).owlCarousel(carouselSettings);\n\n            if (!isNullOrUndefined(window.lightbox))\n            {\n                lightbox.option({\n                    wrapAround: true,\n                    albumLabel: this.$translate(\"Ceres::Template.singleItemLightboxImageShown\")\n                });\n            }\n\n            $(this.$refs.single).on(\"changed.owl.carousel\", event =>\n            {\n                this.currentItem = event.page.index;\n            });\n        },\n\n        initThumbCarousel()\n        {\n            $(this.$refs.thumbs).owlCarousel({\n                autoHeight       : true,\n                dots             : false,\n                items            : 5,\n                lazyLoad         : true,\n                loop             : false,\n                margin           : 10,\n                mouseDrag        : false,\n                center           : false,\n                nav              : true,\n                navClass         : [\n                    \"owl-single-item-nav left carousel-control\",\n                    \"owl-single-item-nav right carousel-control\"\n                ],\n                navContainerClass: \"\",\n                navText          : [\n                    \"<i class=\\\"owl-single-item-control fa fa-chevron-left\\\" aria-hidden=\\\"true\\\"></i>\",\n                    \"<i class=\\\"owl-single-item-control fa fa-chevron-right\\\" aria-hidden=\\\"true\\\"></i>\"\n                ],\n                smartSpeed       : 350,\n                responsive: {\n                    0: {\n                        items: 5\n                    },\n                    992: {\n                        items: 6\n                    },\n                    1200: {\n                        items: 7\n                    }\n                }\n            });\n        },\n\n        goTo(index)\n        {\n            const $owl = $(this.$refs.single);\n\n            $owl.trigger(\"to.owl.carousel\", [\n                index,\n                350\n            ]);\n        },\n\n        getAltText(image)\n        {\n            return image && image.alternate ? image.alternate : this.$options.filters.itemName(this.currentVariation);\n        },\n\n        getImageName(image)\n        {\n            return image && image.name ? image.name : this.$options.filters.itemName(this.currentVariation);\n        },\n\n        loadLightbox()\n        {\n            return new Promise((resolve, reject) =>\n            {\n                const script = document.querySelector(\"script#lightboxscript\");\n\n                if (!isNullOrUndefined(script))\n                {\n                    resolve();\n                }\n                else\n                {\n                    const script = document.createElement(\"script\");\n\n                    script.type = \"text/javascript\";\n                    script.id = \"lightboxscript\";\n                    script.src = `${ this.pluginPath }/js/dist/lightbox.min.js`;\n\n                    script.addEventListener(\"load\", () => resolve(), false);\n                    script.addEventListener(\"error\", event => reject(event), false);\n\n                    document.body.appendChild(script);\n                }\n            });\n        }\n    }\n}\n</script>\n","var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\"div\", { staticClass: \"product-detail__zoom\" }, [\n    _vm.zoomActive\n      ? _c(\"div\", { staticClass: \"product-detail__zoom-wrapper\" }, [\n          _c(\n            \"div\",\n            {\n              staticClass: \"product-detail__zoom-modal\",\n              attrs: { id: \"swiper-zoom\" }\n            },\n            [\n              _c(\"div\", { staticClass: \"product-detail__zoom-head\" }, [\n                _c(\"div\", { staticClass: \"modal-title h3\" }, [\n                  _vm._v(\n                    _vm._s(\n                      _vm.$translate(\"eConnect::Template.singleZoomHeadline\")\n                    )\n                  )\n                ]),\n                _vm._v(\" \"),\n                _c(\n                  \"button\",\n                  {\n                    staticClass: \"close\",\n                    attrs: { type: \"button\", \"aria-hidden\": \"true\" },\n                    on: {\n                      click: function($event) {\n                        return _vm.close()\n                      }\n                    }\n                  },\n                  [_vm._v(\"×\")]\n                )\n              ]),\n              _vm._v(\" \"),\n              _c(\n                \"div\",\n                {\n                  staticClass: \"product-detail__zoom-body\",\n                  class: { \"opacity-1\": _vm.showSwiper }\n                },\n                [\n                  _c(\"div\", { staticClass: \"swiper-container\" }, [\n                    _c(\n                      \"div\",\n                      { staticClass: \"swiper-wrapper\" },\n                      _vm._l(_vm.singleImages, function(image) {\n                        return _c(\"div\", { staticClass: \"swiper-slide\" }, [\n                          _c(\"div\", { staticClass: \"swiper-zoom-container\" }, [\n                            _c(\"img\", {\n                              staticClass: \"swiper-lazy\",\n                              attrs: { \"data-src\": image.url }\n                            }),\n                            _vm._v(\" \"),\n                            _c(\"div\", { staticClass: \"swiper-lazy-preloader\" })\n                          ])\n                        ])\n                      }),\n                      0\n                    ),\n                    _vm._v(\" \"),\n                    _c(\"div\", {\n                      staticClass: \"swiper-pagination swiper-pagination-white\"\n                    }),\n                    _vm._v(\" \"),\n                    _c(\"div\", { staticClass: \"swiper-button-prev\" }),\n                    _vm._v(\" \"),\n                    _c(\"div\", { staticClass: \"swiper-button-next\" })\n                  ])\n                ]\n              )\n            ]\n          )\n        ])\n      : _vm._e(),\n    _vm._v(\" \"),\n    _c(\"div\", {\n      staticClass: \"product-detail__zoom-backdrop\",\n      on: {\n        click: function($event) {\n          return _vm.close()\n        }\n      }\n    })\n  ])\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }","var render = function() {\n  var _vm = this\n  var _h = _vm.$createElement\n  var _c = _vm._self._c || _h\n  return _c(\n    \"div\",\n    {\n      staticClass: \"product-detail-carousel\",\n      attrs: { itemscope: \"\", itemtype: \"http://schema.org/Thing\" }\n    },\n    [\n      [\n        _c(\n          \"div\",\n          {\n            ref: \"single\",\n            staticClass:\n              \"single-carousel owl-carousel owl-theme owl-single-item mt-0\"\n          },\n          _vm._l(_vm.singleImages, function(image) {\n            return _c(\"div\", { staticClass: \"prop-1-1\" }, [\n              _c(\n                \"a\",\n                {\n                  attrs: { href: image.url },\n                  on: {\n                    click: function($event) {\n                      $event.preventDefault()\n                      return _vm.openZoom()\n                    }\n                  }\n                },\n                [\n                  _c(\"img\", {\n                    staticClass: \"owl-lazy\",\n                    attrs: {\n                      \"data-src\": image.url,\n                      alt: _vm.getAltText(image),\n                      title: _vm.getImageName(image)\n                    }\n                  })\n                ]\n              )\n            ])\n          }),\n          0\n        ),\n        _vm._v(\" \"),\n        _vm.showThumbs\n          ? _c(\n              \"div\",\n              {\n                ref: \"thumbs\",\n                staticClass:\n                  \"owl-thumbs owl-carousel owl-theme owl-single-item\",\n                attrs: { id: \"thumb-carousel\" }\n              },\n              _vm._l(_vm.carouselImages, function(imagePreview, index) {\n                return _c(\"div\", { staticClass: \"prop-1-1\" }, [\n                  _c(\n                    \"div\",\n                    {\n                      staticClass: \"image-container\",\n                      on: {\n                        click: function($event) {\n                          return _vm.goTo(index)\n                        }\n                      }\n                    },\n                    [\n                      _c(\"lazy-img\", {\n                        class: { active: _vm.currentItem === index },\n                        attrs: {\n                          \"picture-class\": \"owl-thumb border-appearance\",\n                          \"image-url\": imagePreview.url,\n                          alt: _vm.getAltText(imagePreview),\n                          title: _vm.getImageName(imagePreview)\n                        }\n                      })\n                    ],\n                    1\n                  )\n                ])\n              }),\n              0\n            )\n          : _vm._e(),\n        _vm._v(\" \"),\n        _vm.showZoom\n          ? _c(\"image-zoom\", {\n              attrs: {\n                \"max-quantity\": _vm.maxQuantity,\n                \"image-url-accessor\": _vm.imageUrlAccessor,\n                \"show-thumbs\": _vm.showThumbs,\n                \"show-dots\": _vm.showDots,\n                \"zoom-index\": _vm.currentItem,\n                \"animation-style\": _vm.animationStyle,\n                \"plugin-path\": _vm.pluginPath\n              },\n              on: { getCloseCall: _vm.closeZoom }\n            })\n          : _vm._e()\n      ],\n      _vm._v(\" \"),\n      !_vm.initialized\n        ? _c(\n            \"div\",\n            {\n              staticClass:\n                \"single-carousel owl-carousel owl-theme owl-single-item mt-0 d-block\"\n            },\n            [\n              _c(\"div\", { staticClass: \"prop-1-1\" }, [\n                _c(\"img\", {\n                  staticClass: \"owl-placeholder\",\n                  attrs: {\n                    src: _vm.singleImages[0].url,\n                    alt: _vm.getAltText(_vm.singleImages[0].url),\n                    title: _vm.getImageName(_vm.singleImages[0].url)\n                  }\n                })\n              ])\n            ]\n          )\n        : _vm._e()\n    ],\n    2\n  )\n}\nvar staticRenderFns = []\nrender._withStripped = true\n\nexport { render, staticRenderFns }","import { render, staticRenderFns } from \"./ImageZoom.vue?vue&type=template&id=67fd9ee4&\"\nimport script from \"./ImageZoom.vue?vue&type=script&lang=js&\"\nexport * from \"./ImageZoom.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\n/* hot reload */\nif (module.hot) {\n  var api = require(\"/Applications/XAMPP/xamppfiles/htdocs/DIA-econnect/node_modules/vue-hot-reload-api/dist/index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('67fd9ee4')) {\n      api.createRecord('67fd9ee4', component.options)\n    } else {\n      api.reload('67fd9ee4', component.options)\n    }\n    module.hot.accept(\"./ImageZoom.vue?vue&type=template&id=67fd9ee4&\", function () {\n      api.rerender('67fd9ee4', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"resources/js/src/app/components/item/ImageZoom.vue\"\nexport default component.exports","import mod from \"-!../../../../../../node_modules/babel-loader/lib/index.js!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ImageZoom.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!./ImageZoom.vue?vue&type=script&lang=js&\"","export * from \"-!../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ImageZoom.vue?vue&type=template&id=67fd9ee4&\"","import { render, staticRenderFns } from \"./ItemImageCarousel.vue?vue&type=template&id=5285279e&\"\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\n/* hot reload */\nif (module.hot) {\n  var api = require(\"/Applications/XAMPP/xamppfiles/htdocs/DIA-econnect/node_modules/vue-hot-reload-api/dist/index.js\")\n  api.install(require('vue'))\n  if (api.compatible) {\n    module.hot.accept()\n    if (!api.isRecorded('5285279e')) {\n      api.createRecord('5285279e', component.options)\n    } else {\n      api.reload('5285279e', component.options)\n    }\n    module.hot.accept(\"./ItemImageCarousel.vue?vue&type=template&id=5285279e&\", function () {\n      api.rerender('5285279e', {\n        render: render,\n        staticRenderFns: staticRenderFns\n      })\n    })\n  }\n}\ncomponent.options.__file = \"resources/js/src/app/components/item/ItemImageCarousel.vue\"\nexport default component.exports","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&\"","export * from \"-!../../../../../../node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!../../../../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./ItemImageCarousel.vue?vue&type=template&id=5285279e&\""],"sourceRoot":""}