{"version":3,"file":"quickAdd-DdVOwqM3.js","sources":["../../../app/javascript/components/listings/QuickAddItem.vue","../../../app/javascript/components/listings/QuickAddItems.vue","../../../app/javascript/modules/quickAdd.js"],"sourcesContent":["<template>\n  <div class=\"quick-add-item-container\">\n    <div class=\"js-quick-add-item-container w-4/5 px-4\">\n      <div class=\"flex flex-row-reverse gap-x-4 items-start py-3\">\n        <input\n          id=\"quick-add-checkbox\"\n          name=\"quick-add-pdp\"\n          :data-quick-add-id=\"item.id\"\n          type=\"checkbox\"\n          class=\"quick-add-checkboxes\"\n          autocomplete=\"off\"\n          @change=\"handleCheckboxChange(item.id)\" />\n        <div class=\"flex flex-col w-full\">\n          <div class=\"flex items-center justify-between mb-1\">\n            <p>{{ item.name }}</p>\n            <div\n              v-if=\"item.price.has_discount\"\n              class=\"flex gap-2 whitespace-no-wrap items-center my-1\">\n              <span class=\"mr-2\">\n                <strong>(+{{ item.price.actual }})</strong>\n              </span>\n              <span\n                class=\"typeset-8 p-1 strikethrough bg-sunflower flex-no-shrink\">\n                +{{ item.price.base }}\n              </span>\n            </div>\n            <span\n              v-else\n              class=\"typeset-10\">\n              +{{ item.price.actual }}\n            </span>\n          </div>\n          <a\n            href=\"#\"\n            class=\"underline\"\n            @click.prevent=\"setActiveQuickAddItem(item)\">\n            {{ t(\"stock-items.perfect-partners.see-more\") }}\n          </a>\n        </div>\n        <upsell-modal\n          v-if=\"activeQuickAddItem\"\n          :upsell=\"activeQuickAddItem\"\n          :close-modal=\"closeModal\"\n          perfect-partners />\n      </div>\n    </div>\n    <div class=\"p-3 flex items-center\">\n      <img\n        height=\"72\"\n        width=\"72\"\n        :src=\"item.carousel_images[0].thumb\"\n        class=\"cursor-pointer\"\n        @click.prevent=\"setActiveQuickAddItem(item)\" />\n    </div>\n  </div>\n</template>\n\n<script>\nimport UpsellModal from \"@/app/javascript/components/addOns/extras/multiple/UpsellModal.vue\";\n\nexport default {\n  name: \"QuickAddItem\",\n  components: {\n    UpsellModal\n  },\n  props: {\n    item: {\n      type: Object,\n      required: true\n    },\n    quickAddItemsLength: {\n      type: Number,\n      required: true\n    },\n    index: {\n      type: Number,\n      required: true\n    }\n  },\n  emits: [\"update:modelValue\"],\n  data() {\n    return {\n      activeQuickAddItem: null\n    };\n  },\n  mounted() {\n    if (this.quickAddItemsLength > 1) {\n      const el = this.$el;\n      const observer = new IntersectionObserver(\n        observations => {\n          observations.forEach(observation => {\n            if (observation.isIntersecting) {\n              this.$emit(\"update:modelValue\", this.index);\n            }\n          });\n        },\n        {\n          root: document.querySelector(\".js-quick-add-container\"),\n          threshold: 0.6\n        }\n      );\n\n      observer.observe(el);\n    }\n  },\n  methods: {\n    setActiveQuickAddItem(item) {\n      this.activeQuickAddItem = item;\n    },\n    closeModal() {\n      this.activeQuickAddItem = null;\n    },\n    handleCheckboxChange(id) {\n      window.dispatchEvent(\n        new CustomEvent(\"emitUpsellId\", {\n          detail: id\n        })\n      );\n    }\n  }\n};\n</script>\n","<template>\n  <div\n    class=\"quick-add-carousel\"\n    :class=\"quickAddCarouselClasses\">\n    <div\n      class=\"w-full flex justify-between items-center pr-2 md:pr-0 mb-3\"\n      :class=\"quickAddItemControlsClasses\">\n      <h3 class=\"typeset-6\">\n        {{ t(\"stock-items.perfect-partners.checkbox-title\") }}\n      </h3>\n      <div v-if=\"quickAddItems?.length > 1\">\n        <svg-icon\n          class=\"cursor-pointer\"\n          :class=\"\n            disableLeftArrow\n              ? 'text-ink-2 pointer-events-none'\n              : 'pointer-events-auto'\n          \"\n          name=\"leftarrow\"\n          height=\"12px\"\n          width=\"12px\"\n          @click=\"scrollElementIntoView('left')\" />\n        <svg-icon\n          class=\"ml-3 cursor-pointer\"\n          :class=\"\n            disableRightArrow\n              ? 'text-ink-2 pointer-events-none'\n              : 'pointer-events-auto'\n          \"\n          name=\"rightarrow\"\n          height=\"12px\"\n          width=\"12px\"\n          @click=\"scrollElementIntoView('right')\" />\n      </div>\n    </div>\n\n    <div\n      class=\"flex overflow-x-auto gap-x-4 hide-scrollbar snap-x snap-mandatory js-quick-add-container\">\n      <quick-add-item\n        v-for=\"(item, index) in quickAddItems\"\n        :key=\"item.id\"\n        v-model=\"inViewIndex\"\n        :item=\"item\"\n        :index=\"index\"\n        :quick-add-items-length=\"quickAddItems.length\"\n        class=\"flex item-stretch bg-paper snap-start justify-between\" />\n    </div>\n  </div>\n</template>\n\n<script>\nimport SvgIcon from \"@/app/javascript/components/shared/SvgIcon.vue\";\nimport QuickAddItem from \"@/app/javascript/components/listings/QuickAddItem.vue\";\n\nexport default {\n  name: \"QuickAddItems\",\n  components: {\n    SvgIcon,\n    QuickAddItem\n  },\n  props: {\n    quickAddItems: {\n      type: Array,\n      required: true\n    }\n  },\n  data() {\n    return {\n      modalOpen: false,\n      inViewIndex: 0\n    };\n  },\n  computed: {\n    disableLeftArrow() {\n      return this.inViewIndex === 0;\n    },\n    disableRightArrow() {\n      return this.inViewIndex === this.quickAddItems.length - 1;\n    },\n    quickAddCarouselClasses() {\n      if (this.quickAddItems?.length > 1) {\n        return \"quick-add-carousel relative\";\n      }\n      return null;\n    }\n  },\n  methods: {\n    scrollElementIntoView(direction) {\n      if (direction === \"left\" && this.inViewIndex > 0) {\n        this.inViewIndex -= 1;\n      } else if (\n        direction === \"right\" &&\n        this.inViewIndex < this.quickAddItems.length - 1\n      ) {\n        this.inViewIndex += 1;\n      }\n      document\n        .querySelectorAll(\".js-quick-add-item-container\")\n        [this.inViewIndex].scrollIntoView({\n          behavior: \"smooth\",\n          block: \"nearest\",\n          inline: \"center\"\n        });\n    }\n  }\n};\n</script>\n","import { createApp } from \"vue\";\nimport QuickAddItems from \"@/app/javascript/components/listings/QuickAddItems.vue\";\nimport I18n from \"../plugins/i18n\";\nimport { on } from \"../utils/listeners\";\n\nconst quickAdd = () => {\n  window.setupQuickAdd = () => {\n    const node = document.querySelector(\"#quick-add-app\");\n    if (!node) return;\n    if (node.hasAttribute(\"data-v-app\")) return;\n\n    const translations = JSON.parse(node.dataset.translations);\n    const props = JSON.parse(node.dataset.props);\n    const app = createApp(QuickAddItems, props);\n\n    const customiseButton = document.querySelector(\".js-listing-customise-cta\");\n\n    const changeCustomiseUrlQuickAdd = quickAddIds => {\n      if (customiseButton && customiseButton.href) {\n        const customiseUrl = new URL(customiseButton.href);\n        quickAddIds.forEach(id => {\n          customiseUrl.searchParams.append(\"quick_add_ids[]\", id);\n        });\n        customiseButton.href = customiseUrl.toString();\n      }\n    };\n\n    // For adding a quick add item from a stock item PDP\n    const changeQuickAddField = quickAddIds => {\n      const quickAddForm = document.querySelector(\n        \"#js-stock-item-add-to-cart-form\"\n      );\n\n      if (quickAddForm) {\n        quickAddIds.forEach(id => {\n          const input = document.createElement(\"input\");\n\n          input.setAttribute(\"type\", \"hidden\");\n          input.setAttribute(\"name\", \"quick_add_ids[]\");\n          input.setAttribute(\"value\", id);\n\n          quickAddForm.appendChild(input);\n        });\n      }\n    };\n\n    on(\"click\", \".js-listing-customise-cta\", () => {\n      const checkboxes = document.querySelectorAll(\".quick-add-checkboxes\");\n      const quickAddIds = [];\n\n      checkboxes.forEach(checkbox => {\n        if (checkbox.checked) {\n          quickAddIds.push(checkbox.dataset.quickAddId);\n        }\n      });\n\n      const quickAddItemAdded = Array.from(checkboxes).some(\n        checkbox => checkbox.checked\n      );\n      if (quickAddItemAdded) {\n        analytics.track(\"PDP Quick Upsell Added to Cart\");\n        changeCustomiseUrlQuickAdd(quickAddIds);\n        changeQuickAddField(quickAddIds);\n      }\n    });\n\n    const setQuickAddIds = () => {\n      const checkboxes = document.querySelectorAll(\".quick-add-checkboxes\");\n      const quickAddIds = [];\n\n      checkboxes.forEach(checkbox => {\n        if (checkbox.checked) {\n          quickAddIds.push(checkbox.dataset.quickAddId);\n        }\n      });\n\n      if (customiseButton) {\n        if (quickAddIds.length) {\n          customiseButton.setAttribute(\n            \"data-quick-add-ids\",\n            quickAddIds.join(\",\")\n          );\n        } else {\n          customiseButton.removeAttribute(\"data-quick-add-ids\");\n        }\n      }\n    };\n\n    window.addEventListener(\"emitUpsellId\", setQuickAddIds);\n\n    app.use(I18n, translations);\n    app.mount(node);\n    window.vueApps.push(app);\n  };\n\n  window.setupQuickAdd();\n};\n\nexport default quickAdd;\n"],"names":["_sfc_main","UpsellModal","el","observations","observation","item","id","_hoisted_1","_hoisted_2","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_hoisted_8","_hoisted_9","_hoisted_11","_hoisted_12","_openBlock","_createElementBlock","_createElementVNode","$props","_cache","$event","$options","_toDisplayString","_hoisted_7","_hoisted_10","_withModifiers","_ctx","$data","_createBlock","_component_upsell_modal","_createCommentVNode","SvgIcon","QuickAddItem","_a","direction","_normalizeClass","_createVNode","_component_svg_icon","_Fragment","_renderList","index","_component_quick_add_item","quickAdd","node","translations","props","app","createApp","QuickAddItems","customiseButton","changeCustomiseUrlQuickAdd","quickAddIds","customiseUrl","changeQuickAddField","quickAddForm","input","on","checkboxes","checkbox","setQuickAddIds","I18n"],"mappings":"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"}