{"version":3,"file":"component.product-gallery-modal.js?v=1733414201140","mappings":"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","sources":["webpack:///../../../../../src/components/async/product-gallery-modal/product-gallery-modal.vue","webpack:///../../../../../src/components/async/product-gallery-modal/product-gallery-modal.vue?f34f"],"sourcesContent":["<template>\n  <div\n    class=\"product-gallery-modal\"\n    :class=\"{ 'is-model-option': showModelToggle }\"\n  >\n    <div class=\"product-gallery-modal__heading\">\n      <button\n        v-if=\"showModelToggle\"\n        class=\"product-gallery-modal__mode-button\"\n        @click.prevent=\"setComponents(true)\"\n      >\n        <span\n          class=\"product-gallery-modal__button-icon\"\n          v-html=\"$icon(modeButtonIcon)\"\n        />\n        <span\n          class=\"product-gallery-modal__button-label\"\n          v-text=\"$string(modeButtonText)\"\n        />\n      </button>\n\n      <button\n        class=\"product-gallery-modal__close-button icon-button overlay__close\"\n        :aria-label=\"$string('accessibility.close')\"\n        @click.prevent=\"handleCloseClick\"\n      >\n        <slot name=\"close\">\n          <div v-html=\"$icon('misc.close')\" />\n        </slot>\n      </button>\n    </div>\n\n    <transition name=\"fade\">\n      <component\n        :is=\"currentGalleryComponent\"\n        v-if=\"getComponentVisible(subComponentHandle)\"\n        v-cloak\n        :current-index=\"currentIndex\"\n        :modal-active=\"isActive\"\n        :models=\"models\"\n        :images=\"images\"\n        @update-gallery-index=\"handleZoomGalleryIndexUpdate\"\n      />\n    </transition>\n  </div>\n</template>\n\n<script>\n\n/**\n * Vue: Product gallery modal (product-gallery-modal)\n * -----------------------------------------------------------------------------\n * Product Gallery overlay housing 'Zoomed' state and the 3D model viewer.\n * @param {Number} currentIndex - default/current images index for the carousel.\n * @param {Boolean} isActive - Overlay drawer is active.\n * @param {Array} [images] - Array of images from a formatted product object.\n * @param {String} mode - zoom/model - dictates if the modal is showing 3D model or gallery.\n * @param {Boolean|Array} models - Array of 3D models from a formatted product object.\n * @param {Boolean} showModelButton - Decides if to show the 'View 3D model' button.\n */\nimport { defineAsyncComponent } from 'vue'\nimport { mapActions } from 'vuex'\n\nimport { convertToHandle } from '~/helpers/convert'\n\nexport default {\n  name: 'ProductGalleryModal',\n\n  components: {\n    ProductGalleryModelViewer: defineAsyncComponent({\n      loader: () => import(\n        /* webpackPrefetch: true */\n        '~async/product-gallery-model-viewer/product-gallery-model-viewer'\n      ),\n    }),\n    ProductGalleryZoom: defineAsyncComponent({\n      loader: () => import(\n        /* webpackPrefetch: true */\n        '~async/product-gallery-zoom/product-gallery-zoom'\n      ),\n    }),\n  },\n\n  props: {\n    currentIndex: {\n      type: Number,\n      default: 0,\n    },\n    images: {\n      type: [Boolean, Array],\n      default: false,\n    },\n    isActive: {\n      type: Boolean,\n      default: false,\n    },\n    mode: {\n      type: String,\n      default: 'zoom',\n    },\n    models: {\n      type: [Boolean, Array],\n      default: false,\n    },\n    showModelButton: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  emits: [\n    'update-gallery-index',\n    'update-gallery-mode',\n  ],\n\n  data() {\n    return {\n      currentGalleryComponent: 'ProductGalleryZoom',\n      toggleButtonText: '',\n    }\n  },\n\n  computed: {\n\n    /**\n     * Return a handleised version of the subcomponent (either Zoom or\n     * 3D Gallery) - to be used to render the component.\n     * @returns {String}\n     */\n    subComponentHandle() {\n      return convertToHandle(this.currentGalleryComponent)\n    },\n\n    /**\n     * Calculate the icon for the 'Toggle modes' button.\n     * @returns {String}\n     */\n    modeButtonIcon() {\n      return this.mode === 'zoom' ? 'misc.model_view' : 'misc.gallery'\n    },\n\n    /**\n     * Calculate the text for the 'Toggle modes' button.\n     * @returns {String}\n     */\n    modeButtonText() {\n      return this.mode === 'zoom' ? 'product.model.button' : 'product.gallery.toggle_gallery'\n    },\n\n    /**\n     * Calculate if to show the 'View in 3D' button.\n     * @returns {Boolean}\n     */\n    showModelToggle() {\n      return Boolean(this.showModelButton)\n    },\n  },\n\n  watch: {\n\n    /**\n     * The Gallery 'mode' has changed.\n     * - Initially `mode` is passed in as prop\n     * - User can update `mode` via the Modal button press\n     * - On button press, state is emitted upto parent component and then\n     *   trickled back down to child components (this one)\n     */\n    mode: {\n      handler() {\n        this.setComponents()\n      },\n      immediate: true,\n    },\n  },\n\n  methods: {\n\n    /**\n     * Map Vuex actions.\n     */\n    ...mapActions({\n      closeOverlay: 'overlays/close',\n      loadComponent: 'components/load',\n    }),\n\n    /**\n     * Events for when the 'Close' button is clicked.\n     */\n    handleCloseClick() {\n      this.closeOverlay('productGalleryModal')\n    },\n\n    /**\n     * The user has modified the active slide in the 'Zoom modal'.\n     * - Notify parent component.\n     */\n    handleZoomGalleryIndexUpdate(index) {\n      this.$emit('update-gallery-index', index)\n    },\n\n    /**\n     * Set the child components to be displayed.\n     * - Triggered on component mount, watcher, or manual toggle.\n     * @param {Boolean} toggle - If true, swap existing components around.\n     */\n    setComponents(toggle = false) {\n      let newComponent = ''\n      let newMode = ''\n\n      const components = ['ProductGalleryZoom', 'ProductGalleryModelViewer']\n      const modes = ['zoom', 'model']\n\n      switch (this.mode) {\n        case 'zoom':\n          newComponent = toggle ? components[1] : components[0]\n          newMode = toggle ? modes[1] : modes[0]\n\n          break\n\n        case 'model':\n          newComponent = toggle ? components[0] : components[1]\n          newMode = toggle ? modes[0] : modes[1]\n\n        default:\n          break\n      }\n\n      /**\n       * Prevent an empty component.\n       */\n      if (!newMode) {\n        newComponent = components[0]\n        newMode = modes[0]\n      }\n\n      /**\n       * - Update the sub-component in the state\n       * - Load the component via CANVAS using computed property\n       * - Emit change to the parent component\n       */\n      this.currentGalleryComponent = newComponent\n\n      this.loadComponent(this.subComponentHandle)\n\n      this.$emit('update-gallery-mode', newMode)\n    },\n  },\n}\n</script>\n\n<style lang=\"scss\">\n@import './product-gallery-modal';\n</style>\n","import { render } from \"./product-gallery-modal.vue?vue&type=template&id=06cb375c\"\nimport script from \"./product-gallery-modal.vue?vue&type=script&lang=js\"\nexport * from \"./product-gallery-modal.vue?vue&type=script&lang=js\"\n\nimport \"./product-gallery-modal.vue?vue&type=style&index=0&id=06cb375c&lang=scss\"\n\nimport exportComponent from \"/Users/LucaPerini/Documents/MOLOTOF/BIPOD/bipod-feature-BIPOD-371-offboarding/bipod-feature-BIPOD-371-offboarding/node_modules/vue-loader/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render]])\n\nexport default __exports__"],"names":["class","name","components","ProductGalleryModelViewer","defineAsyncComponent","loader","ProductGalleryZoom","props","currentIndex","type","Number","default","images","Boolean","Array","isActive","mode","String","models","showModelButton","emits","data","currentGalleryComponent","toggleButtonText","computed","subComponentHandle","convertToHandle","this","modeButtonIcon","modeButtonText","showModelToggle","watch","handler","setComponents","immediate","methods","mapActions","closeOverlay","loadComponent","handleCloseClick","handleZoomGalleryIndexUpdate","index","$emit","toggle","newComponent","newMode","modes","_createElementBlock","$options","_createElementVNode","onClick","innerHTML","_ctx","_toDisplayString","aria-label","_renderSlot","_createVNode","_Transition","_createBlock","_resolveDynamicComponent","$data","current-index","$props","modal-active","onUpdateGalleryIndex"],"sourceRoot":""}