{"version":3,"file":"QuickSampleModal-xBqEyGwe.js","sources":["../../../app/javascript/components/shared/QuickSampleModal.vue"],"sourcesContent":["<template>\n  <modal\n    :open=\"open\"\n    :size=\"unpersonalisedSampleEnabled ? 'large' : 'small'\"\n    @closed=\"$emit('closed')\">\n    <template #header>\n      <h3 class=\"typeset-2\">\n        {{ t(\"quick-sample-modal.title\") }}\n      </h3>\n    </template>\n    <template #body>\n      <p class=\"typeset-6 mb-3\">\n        {{ t(\"quick-sample-modal.free-sample-title\") }}\n      </p>\n      <p\n        class=\"mb-3\"\n        v-html=\"t('quick-sample-modal.free-sample-html')\"></p>\n      <div class=\"flex items-center gap-2 mb-4\">\n        <div\n          class=\"h-5 w-5 relative cursor-pointer\"\n          data-cy=\"copy-discount-code\">\n          <fade-transition>\n            <div\n              v-if=\"copied\"\n              class=\"h-5 w-5 absolute top-0 left-0 flex\">\n              <svg-icon\n                class=\"m-auto\"\n                name=\"tick\" />\n            </div>\n            <div\n              v-else\n              class=\"h-5 w-5 absolute top-0 left-0 flex\"\n              @click=\"copyCode\">\n              <svg-icon\n                name=\"copy\"\n                class=\"m-auto\" />\n            </div>\n          </fade-transition>\n        </div>\n        <a\n          href=\"#\"\n          class=\"underline\"\n          @click.prevent=\"copyCode\">\n          {{ t(\"quick-sample-modal.free-sample-copy\") }}\n        </a>\n      </div>\n      <div class=\"flex flex-col md:flex-row gap-4 items-stretch mb-2\">\n        <div\n          v-if=\"!showsSamplePack\"\n          class=\"flex-1 p-5 bg-paper\">\n          <h5 class=\"typeset-4 text-ink-4 mb-2\">\n            {{ t(\"quick-sample-modal.personalised.price\") }}\n          </h5>\n          <h4 class=\"typeset-6 mb-3\">\n            {{ t(\"quick-sample-modal.personalised.title\") }}\n          </h4>\n          <p\n            class=\"mb-5\"\n            v-html=\"t('quick-sample-modal.personalised.description-html')\"></p>\n          <template v-if=\"editor\">\n            <a\n              :href=\"customiseSamplePath\"\n              class=\"btn btn-large btn-secondary block w-full mb-3\"\n              data-cy=\"customise-sample\"\n              @click=\"trackCustomiseClick\">\n              {{ t(\"quick-sample-modal.personalised.customise\") }}\n            </a>\n            <btn\n              class=\"btn-large block\"\n              data-cy=\"add-customised-sample-to-basket\"\n              :promise=\"addPersonalisedSampleToCart()\">\n              {{ t(\"quick-sample-modal.personalised.add-to-cart\") }}\n            </btn>\n          </template>\n          <a\n            v-else\n            :href=\"customiseSamplePath\"\n            class=\"btn btn-large btn-primary block\"\n            data-cy=\"customise-sample\"\n            @click=\"trackCustomiseClick\">\n            {{ t(\"quick-sample-modal.personalised.customise\") }}\n          </a>\n        </div>\n        <div\n          v-if=\"unpersonalisedSampleEnabled\"\n          class=\"flex-1 p-5 bg-paper flex flex-col\">\n          <h5 class=\"typeset-4 text-ink-4 mb-2\">\n            {{ t(\"quick-sample-modal.unpersonalised.price\") }}\n          </h5>\n          <h4 class=\"typeset-6 mb-3\">\n            {{ t(\"quick-sample-modal.unpersonalised.title\") }}\n          </h4>\n          <p\n            class=\"mb-5\"\n            v-html=\"\n              t('quick-sample-modal.unpersonalised.description-html')\n            \"></p>\n          <btn\n            class=\"btn-large block mt-auto\"\n            data-cy=\"add-uncustomised-sample-to-basket\"\n            :promise=\"addUnpersonalisedSampleToCart()\">\n            {{ t(\"quick-sample-modal.unpersonalised.add-to-cart\") }}\n          </btn>\n        </div>\n        <div\n          v-if=\"showsSamplePack\"\n          class=\"flex-1 p-5 bg-paper flex flex-col\">\n          <h5 class=\"typeset-4 text-ink-4 mb-2\">\n            {{ t(\"quick-sample-modal.sample-pack.price\") }}\n          </h5>\n          <h4 class=\"typeset-6 mb-3\">\n            {{ t(\"quick-sample-modal.sample-pack.title\") }}\n          </h4>\n          <p\n            class=\"mb-5\"\n            v-html=\"t('quick-sample-modal.sample-pack.description-html')\"></p>\n          <a\n            :href=\"samplePackUrl\"\n            class=\"btn btn-primary btn-large block mt-auto\">\n            {{ t(\"quick-sample-modal.sample-pack.find-out-more\") }}\n          </a>\n        </div>\n      </div>\n      <p\n        v-if=\"showThicknessMessage\"\n        class=\"mt-4\"\n        v-html=\"\n          t('quick-sample-modal.thickness-message-html', {\n            link: samplePackLink\n          })\n        \"></p>\n    </template>\n  </modal>\n</template>\n\n<script>\nimport Btn from \"@/app/javascript/components/shared/Btn.vue\";\nimport Modal from \"@/app/javascript/components/shared/Modal.vue\";\nimport SvgIcon from \"@/app/javascript/components/shared/SvgIcon.vue\";\nimport api from \"@/app/javascript/api\";\nimport {\n  cartPath,\n  quickAddSampleSavedDesignsPath\n} from \"@/app/javascript/routes\";\nimport FadeTransition from \"../transitions/FadeTransition.vue\";\n\nexport default {\n  name: \"QuickSampleModal\",\n  components: {\n    Btn,\n    FadeTransition,\n    Modal,\n    SvgIcon\n  },\n  inject: {\n    unpersonalisedSampleEnabled: {\n      default: true\n    },\n    unpersonalisedLink: {\n      default: null\n    },\n    listingSlug: {\n      default: null\n    },\n    customiseSamplePath: {\n      default: null\n    },\n    showsSamplePack: {\n      default: false\n    },\n    samplePackUrl: {\n      default: null\n    }\n  },\n  props: {\n    open: {\n      type: Boolean,\n      default: false\n    },\n    editor: {\n      type: Boolean,\n      default: false\n    }\n  },\n  emits: [\"closed\", \"addToCart\"],\n  data() {\n    return {\n      copied: false,\n      showThicknessMessage: false\n    };\n  },\n  computed: {\n    mainDesignable() {\n      if (this.editor) {\n        return this.$store.state.design.designables[0];\n      }\n\n      return null;\n    },\n    samplePackLink() {\n      if (this.editor) {\n        return this.$store.state.design.product.sample.sample_pack_link;\n      }\n\n      return false;\n    },\n    mainDesignableIsThick() {\n      if (this.mainDesignable) {\n        return this.mainDesignable.thick;\n      }\n\n      return false;\n    },\n    eventProps() {\n      return {\n        location: this.location\n      };\n    },\n    location() {\n      return this.editor ? \"Editor\" : \"PLP\";\n    },\n    countryCodeWithoutSlash() {\n      return window.countryCode.replace(\"/\", \"\");\n    }\n  },\n  watch: {\n    open(newValue) {\n      if (newValue) {\n        analytics.track(\"Quick Sample Modal Opened\", this.eventProps);\n\n        if (this.editor && this.mainDesignableIsThick) {\n          this.$store.commit(\"design/setThicknessForDesignable\", {\n            designable: this.mainDesignable,\n            thickness: false\n          });\n\n          this.showThicknessMessage = !!this.samplePackLink;\n        }\n      } else {\n        this.showThicknessMessage = false;\n      }\n    }\n  },\n  mounted() {\n    window.addEventListener(\"showLoginModal\", () => this.$emit(\"closed\"));\n  },\n  methods: {\n    addPersonalisedSampleToCart() {\n      return async () => {\n        try {\n          analytics.track(\"Add Personalised Sample To Cart\", this.eventProps);\n          await this.$store.dispatch(\"design/addSample\");\n        } catch (error) {\n          console.log(error);\n        }\n      };\n    },\n    addUnpersonalisedSampleToCart() {\n      return async () => {\n        try {\n          analytics.track(\"Add Unpersonalised Sample To Cart\", this.eventProps);\n          await api.post(\n            quickAddSampleSavedDesignsPath(null, this.listingSlug)\n          );\n          window.location = cartPath(this.countryCodeWithoutSlash);\n        } catch (error) {\n          console.log(error);\n        }\n      };\n    },\n    copyCode() {\n      navigator.clipboard.writeText(\n        this.t(\"quick-sample-modal.free-sample-code\")\n      );\n      analytics.track(\"Copied Free Sample Code\", this.eventProps);\n      this.copied = true;\n      setTimeout(() => {\n        this.copied = false;\n      }, 3000);\n    },\n    trackCustomiseClick() {\n      analytics.track(\"Clicked Customise Sample\", this.eventProps);\n    }\n  }\n};\n</script>\n"],"names":["_sfc_main","Btn","FadeTransition","Modal","SvgIcon","newValue","error","api","quickAddSampleSavedDesignsPath","cartPath","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_7","_hoisted_9","_hoisted_10","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_15","_hoisted_16","_hoisted_17","_hoisted_19","_hoisted_20","_hoisted_21","_hoisted_22","_hoisted_23","_createBlock","_component_modal","$props","$options","_ctx","_createElementVNode","_toDisplayString","_hoisted_5","_createVNode","_component_fade_transition","_withCtx","$data","_openBlock","_createElementBlock","_hoisted_6","_component_svg_icon","args","_cache","_withModifiers","_createCommentVNode","_hoisted_8","_Fragment","_component_btn","_createTextVNode","_hoisted_14","_hoisted_18"],"mappings":"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"}