{"version":3,"file":"hobbii-product-1db18957.min.js","sources":["../frontend/components/CartActions/ButtonAddToCart.vue","../frontend/shared/components/Icons/IconInfo.vue","../frontend/components/CartActions/CartErrorModal.vue","../frontend/shared/components/Icons/IconCart.vue","../frontend/components/CartActions/CartActions.vue","../frontend/shared/utils/tracking.ts","../frontend/shared/constants/campaignTypes.js","../frontend/shared/components/patterns/PatternDownload.vue","../frontend/components/QuantitySelector/QuantityBasicSelector.vue","../frontend/components/QuantitySelector/QuantityBulkSelector.vue","../frontend/shared/composables/useProductMeta.js","../frontend/shared/instances/quantity-selector.js","../frontend/entrypoints/product.js","../frontend/shared/instances/pattern-download-button.js","../frontend/shared/instances/cart-button.js"],"sourcesContent":["<template>\n  <button\n    ref=\"addToCartBtn\"\n    :class=\"classes\"\n    class=\"[&.is-adding>.custom-label]:wv-hidden group flex h-[62px] w-full cursor-pointer items-center justify-center rounded-lg bg-pink text-center text-lg font-bold text-white transition-all duration-300 ease-in-out hover:bg-pink-darker md:h-[52px] md:text-base\"\n    @click=\"$emit('click')\"\n  >\n    <slot />\n    <span class=\"custom-label transition-all\">{{\n      t('product.quantity.button_cart')\n    }}</span>\n  </button>\n</template>\n\n<script setup>\nimport { computed, ref } from 'vue';\nimport { useTranslations } from '@/shared/composables/useTranslations.ts';\n\ndefineEmits(['click']);\n\nconst { t } = useTranslations();\n\nconst props = defineProps({\n  disabled: {\n    type: Boolean,\n    default: false\n  },\n  adding: {\n    type: Boolean,\n    default: false\n  },\n  isWebview: {\n    type: Boolean,\n    default: false\n  }\n});\n\nconst addToCartBtn = ref(null);\n\nconst classes = computed(() => [\n  props.disabled ? 'pointer-events-none opacity-50' : 'cursor-pointer',\n  props.adding\n    ? 'is-adding opacity-80 pointer-events-none wv-w-[62px] wv-opacity-100 wv-rounded-full wv-m-auto'\n    : '',\n  props.adding && props.isWebview ? 'text-pink' : ''\n]);\n</script>\n","<template>\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n  >\n    <g fill=\"none\" strokeLinecap=\"round\" strokeLinejoin=\"round\" strokeWidth=\"2\">\n      <path d=\"M0 0h24v24H0z\"></path>\n      <path\n        fill=\"currentColor\"\n        d=\"M12 2c5.523 0 10 4.477 10 10a10 10 0 0 1-19.995.324L2 12l.004-.28C2.152 6.327 6.57 2 12 2zm0 9h-1l-.117.007a1 1 0 0 0 0 1.986L11 13v3l.007.117a1 1 0 0 0 .876.876L12 17h1l.117-.007a1 1 0 0 0 .876-.876L14 16l-.007-.117a1 1 0 0 0-.764-.857l-.112-.02L13 15v-3l-.007-.117a1 1 0 0 0-.876-.876L12 11zm.01-3l-.127.007a1 1 0 0 0 0 1.986L12 10l.127-.007a1 1 0 0 0 0-1.986L12.01 8z\"\n      ></path>\n    </g>\n  </svg>\n</template>\n","<template>\n  <AppModal\n    ref=\"cartErrorModal\"\n    transition=\"slide-bottom-fade\"\n    class-name=\"[&>.modal__dialog]:bg-pink\"\n    :classes=\"{\n      body: 'h-[100px] flex items-center justify-center gap-2',\n      header: 'b-0'\n    }\"\n    close-by-swipe-header\n    @on-close=\"cartErrorMessage = null\"\n  >\n    <template #header></template>\n    <template #body>\n      <div\n        v-if=\"cartErrorMessage\"\n        class=\"mx-[20px] mb-[20px] flex items-start justify-center gap-2 text-center\"\n      >\n        <IconInfo class=\"text-3xl text-black/70\" />\n        {{ cartErrorMessage }}\n      </div>\n    </template>\n  </AppModal>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref } from 'vue';\nimport AppModal from '@/shared/components/Legacy/AppModal.vue';\nimport IconInfo from '@/shared/components/Icons/IconInfo.vue';\n\nconst cartErrorModal = ref<typeof AppModal | null>(null);\nconst cartErrorMessage = ref<string | null>(null);\n\nconst display = (errorMessage: string) => {\n  cartErrorMessage.value = errorMessage;\n  cartErrorModal.value?.openModal();\n};\n\ndefineExpose({\n  display\n});\n</script>\n","<template>\n  <svg\n    xmlns=\"http://www.w3.org/2000/svg\"\n    width=\"1em\"\n    height=\"1em\"\n    viewBox=\"0 0 24 24\"\n  >\n    <path\n      fill=\"currentColor\"\n      d=\"M2.25 2.25a.75.75 0 0 0 0 1.5h1.386c.17 0 .318.114.362.278l2.558 9.592a3.752 3.752 0 0 0-2.806 3.63c0 .414.336.75.75.75h15.75a.75.75 0 0 0 0-1.5H5.378A2.25 2.25 0 0 1 7.5 15h11.218a.75.75 0 0 0 .674-.421a60.358 60.358 0 0 0 2.96-7.228a.75.75 0 0 0-.525-.965A60.864 60.864 0 0 0 5.68 4.509l-.232-.867A1.875 1.875 0 0 0 3.636 2.25H2.25Zm1.5 18a1.5 1.5 0 1 1 3 0a1.5 1.5 0 0 1-3 0Zm12.75 0a1.5 1.5 0 1 1 3 0a1.5 1.5 0 0 1-3 0Z\"\n    />\n  </svg>\n</template>\n","<template>\n  <div class=\"relative flex items-start\">\n    <div\n      ref=\"flyingItem\"\n      class=\"custom-flying-item invisible absolute z-50 flex size-[30px] items-center justify-center rounded-full bg-pink text-center text-sm font-bold text-white opacity-0\"\n      :class=\"{ 'is-flying !visible': !isWebview && isAdding }\"\n    >\n      >\n      <IconCart />\n    </div>\n    <div class=\"relative flex-auto\">\n      <ButtonAddToCart\n        v-if=\"isPurchasable\"\n        :disabled=\"(isProduct && !productInStock) || (isWebview && isPattern)\"\n        :adding=\"isAdding\"\n        :is-webview=\"isWebview\"\n        @click=\"onAddToCartClick\"\n      >\n        <template v-if=\"isWebview && isAdding\">\n          <svg\n            class=\"size-5 animate-spin rounded-full border-r border-t text-white\"\n            viewBox=\"0 0 24 24\"\n          ></svg>\n        </template>\n      </ButtonAddToCart>\n      <template v-if=\"isWebview && isPattern\">\n        <div class=\"mt-2 items-center text-center text-sm leading-none\">\n          <em>{{ t('cart.webview_patterns_block') }}</em>\n        </div>\n      </template>\n    </div>\n  </div>\n  <CartErrorModal ref=\"cartErrorModal\" />\n</template>\n\n<script setup lang=\"ts\">\nimport { computed, ref } from 'vue';\nimport ButtonAddToCart from './ButtonAddToCart.vue';\nimport CartErrorModal from './CartErrorModal.vue';\nimport { useCartStore } from '../../shared/pinia/modules/cart';\nimport { useWebviewStore } from '../../shared/pinia/modules/webview';\nimport { useProductOptionsStore } from '../../shared/pinia/modules/product-options';\nimport { useProductQuantitiesStore } from '../../shared/pinia/modules/product-quantities';\nimport { useProductStore } from '../../shared/pinia/modules/product';\nimport IconCart from '../../shared/components/Icons/IconCart.vue';\n\nimport { useTranslations } from '@/shared/composables/useTranslations.ts';\n\nconst { t } = useTranslations();\n\nconst cartStore = useCartStore();\nconst webviewStore = useWebviewStore();\nconst productStore = useProductStore();\nconst quantityStore = useProductQuantitiesStore();\nconst optionsStore = useProductOptionsStore();\n\nconst flyingItem = ref<typeof HTMLDivElement | null>(null);\nconst cartErrorModal = ref<typeof CartErrorModal | null>(null);\n\nconst selectedQuantity = computed(() => quantityStore.quantity);\nconst isOptionSelected = computed(() => optionsStore.isOptionSelected);\nconst isQuantitySelected = computed(() => selectedQuantity.value > 0);\nconst isPurchasable = computed(() => productStore.purchasable);\n\nconst isAdding = computed(() => cartStore.adding);\nconst isWebview = computed(() => webviewStore.isWebview);\nconst isProduct = computed(() => productStore.isProduct);\nconst productInStock = computed(() => optionsStore.productInStock);\nconst isPattern = computed(() => productStore.isPattern);\n\nconst onAddToCartClick = async () => {\n  if (!isOptionSelected.value) {\n    optionsStore.showOptionsModal = true;\n  } else if (!isQuantitySelected.value) {\n    quantityStore.showQuantityModal = true;\n  } else {\n    try {\n      await cartStore.addToCart();\n    } catch (err) {\n      cartErrorModal.value?.display(\n        ('message' in (err as Error) && (err as Error).message) ||\n          window.Hobbii?.errorMessages.unknownErrorOccurred\n      );\n    }\n  }\n};\n</script>\n\n<style lang=\"scss\" scoped>\n.fade-move,\n.fade-enter-active,\n.fade-leave-active {\n  left: 0;\n  top: 0;\n  width: 100%;\n  position: absolute;\n}\n\n.custom-flying-item {\n  &.is-flying {\n    animation: flyingMobile 1s ease-out;\n\n    @media screen and (min-width: 1024px) {\n      animation: flying 1s ease-out;\n    }\n  }\n}\n\n@keyframes flying {\n  0% {\n    opacity: 0;\n  }\n  8% {\n    opacity: 1;\n    transform: translate(100px, -140px);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(500px, -700px);\n  }\n}\n@keyframes flyingMobile {\n  0% {\n    opacity: 0;\n  }\n  15% {\n    opacity: 1;\n    transform: translate(50px, -200px);\n  }\n  100% {\n    opacity: 0;\n    transform: translate(300px, -700px);\n  }\n}\n</style>\n","import { sha256 } from 'js-sha256';\n\ninterface UserEventDefinitions {\n  generic_user_event: {\n    action: string;\n    category: string;\n    label?: string;\n    value?: string | number;\n    [key: string]: unknown;\n  };\n  download_pattern: {\n    action: string;\n    category: string;\n    label: string;\n    item_id: string | number;\n    [key: string]: unknown;\n  };\n}\n\ntype EventNames = keyof UserEventDefinitions;\n\ntype TrackUserEvent = <T extends EventNames>(\n  event: T,\n  data: UserEventDefinitions[T]\n) => void;\n\nconst trackUserEvent: TrackUserEvent = (event, data) => {\n  window.dataLayer.push({\n    event,\n    user_event_data: data\n  });\n};\n\n// We use the algorithm sha256 for encoding according to Meta Pixel documentation\n// https://developers.facebook.com/docs/meta-pixel/advanced/advanced-matching/\n// https://developers.google.com/google-ads/api/docs/conversions/enhanced-conversions/web#prepare-data\nconst hashUserData = (value: string) => {\n  return sha256(value);\n};\n\nexport { trackUserEvent, hashUserData };\n","export const campaignType = {\n  HOBBII: 'hobbii'\n};\n","<template>\n  <button\n    v-if=\"patternPurchasable && patternDownloadUrl\"\n    class=\"[&.adding>.custom-label]:wv-hidden md:mt-0md:h-[72px] group mt-4 flex h-[82px] w-full cursor-pointer flex-col items-center justify-center rounded-lg bg-pink text-center text-lg font-bold text-white transition-all duration-300 ease-in-out hover:bg-pink-darker md:text-base\"\n    @click=\"startDownload\"\n  >\n    <span class=\"custom-label transition-all\">{{\n      t('patterns.download.download_pattern')\n    }}</span>\n    <span class=\"custom-label mt-1 text-sm font-normal transition-all\">{{\n      t('patterns.download.already_purchased')\n    }}</span>\n  </button>\n\n  <button\n    v-if=\"!patternPurchasable\"\n    class=\"[&.adding>.custom-label]:wv-hidden group flex h-[62px] w-full cursor-pointer items-center justify-center rounded-lg bg-primary text-center text-lg font-bold text-white transition-all duration-300 ease-in-out hover:bg-primary-600 md:h-[52px] md:text-base\"\n    @click=\"handleDownloadButtonClick\"\n  >\n    <span class=\"custom-label transition-all\"\n      >{{ t('patterns.download.download_pattern') }}\n      {{ t('patterns.download.free') }}</span\n    >\n  </button>\n\n  <Modal\n    v-model:active=\"showPatternDownloadModal\"\n    name=\"signup-modal\"\n    size=\"lg\"\n  >\n    <template #body>\n      <div\n        class=\"mx-2 mb-[20px] flex items-start justify-center gap-2 pt-base text-center\"\n      >\n        <form\n          class=\"m-4 flex flex-col items-center gap-4\"\n          @submit.prevent=\"onNewsletterSignupFormSubmit\"\n        >\n          <div class=\"mx-auto max-w-lg text-sm\">{{ productName }}</div>\n          <h2 class=\"mb-4 text-xl font-bold\">\n            {{ t('patterns.download.signup_get_free') }}\n          </h2>\n          <div class=\"max-w-lg text-sm\">\n            {{ t('patterns.download.modal_description1') }}\n          </div>\n          <div class=\"m-2 max-w-lg text-sm font-bold\">\n            {{ t('patterns.download.modal_description2') }}\n          </div>\n          <div class=\"max-w-lg text-sm\">\n            {{ t('patterns.download.modal_description3') }}\n          </div>\n\n          <div class=\"flex w-full flex-col justify-evenly gap-4 md:flex-row\">\n            <div class=\"relative h-10 w-full\">\n              <input\n                id=\"pattern-download-first-name\"\n                v-model=\"customerName\"\n                placeholder=\"\"\n                type=\"text\"\n                autocomplete=\"given-name\"\n                required\n                class=\"peer block w-full appearance-none rounded border border-gray px-2.5 pb-1 pt-4 text-sm text-gray-900 transition focus:border-primary-600 focus:outline-none focus:ring-0\"\n              />\n              <label\n                for=\"pattern-download-first-name\"\n                class=\"absolute left-1 top-4 z-10 origin-[0] -translate-y-4 scale-75 px-2 text-sm text-gray-500 duration-300 peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:scale-100 peer-focus:top-4 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:px-2\"\n                >{{ t('patterns.download.name') }}</label\n              >\n            </div>\n            <div class=\"relative flex w-full flex-col gap-2\">\n              <div class=\"relative h-10\">\n                <input\n                  id=\"pattern-download-email\"\n                  v-model=\"customerEmail\"\n                  placeholder=\"\"\n                  type=\"email\"\n                  autocomplete=\"email\"\n                  required\n                  class=\"peer block w-full appearance-none rounded border border-gray px-2.5 pb-1 pt-4 text-sm text-gray-900 transition focus:border-primary-600 focus:outline-none focus:ring-0\"\n                  :class=\"{\n                    'border-error-300 bg-error-100 text-error-400':\n                      emailIsValid === false\n                  }\"\n                  @blur=\"validateEmailInput\"\n                  @input=\"validateEmailInput\"\n                />\n                <label\n                  for=\"pattern-download-email\"\n                  class=\"absolute left-1 top-4 z-10 origin-[0] -translate-y-4 scale-75 px-2 text-sm text-gray-500 duration-300 peer-placeholder-shown:top-1/2 peer-placeholder-shown:-translate-y-1/2 peer-placeholder-shown:scale-100 peer-focus:top-4 peer-focus:-translate-y-4 peer-focus:scale-75 peer-focus:px-2\"\n                  >{{ t('patterns.download.email') }}</label\n                >\n              </div>\n              <div v-if=\"emailIsValid === false\" class=\"text-error\">\n                <ul role=\"list\" class=\"space-y-1 text-left text-xs\">\n                  <li>\n                    {{ t('global_errors.form_validation.invalid_email') }}\n                  </li>\n                </ul>\n              </div>\n            </div>\n          </div>\n          <div class=\"col-span-2 w-full\">\n            <button\n              type=\"submit\"\n              class=\"flex w-full justify-center rounded bg-green px-3 py-2 text-sm font-semibold leading-6 text-white shadow-sm hover:bg-green-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-orange-400 disabled:pointer-events-none disabled:opacity-50\"\n              :disabled=\"!formIsValid\"\n            >\n              {{ t('patterns.download.signup') }}\n            </button>\n          </div>\n          <div class=\"col-span-2 text-xs\">\n            {{ t('patterns.download.tos_link_description') }}\n            <a\n              href=\"/policies/privacy-policy\"\n              target=\"_blank\"\n              class=\"text-primary decoration-solid hover:text-pink\"\n              >{{ t('patterns.download.tos_link_text') }}</a\n            >\n          </div>\n          <div class=\"col-span-2 text-xs\">\n            {{ t('patterns.download.already_signed_up') }}\n            <a\n              href=\"#\"\n              class=\"text-primary decoration-solid hover:text-pink\"\n              @click=\"alreadySubscribedDownload\"\n              >{{ t('patterns.download.download_pattern_here') }}</a\n            >\n          </div>\n        </form>\n      </div>\n    </template>\n  </Modal>\n\n  <Modal\n    v-model:active=\"showThankYouModal\"\n    name=\"thank-you-modal\"\n    :close-button=\"false\"\n  >\n    <template #body>\n      <div\n        class=\"flex min-h-full items-center justify-center p-4 text-center sm:items-center sm:p-0\"\n      >\n        <div class=\"\">\n          <div>\n            <div\n              class=\"mx-auto flex size-12 items-center justify-center rounded-full bg-green-100\"\n            >\n              <svg\n                class=\"size-6 text-green-600\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke-width=\"1.5\"\n                stroke=\"currentColor\"\n                aria-hidden=\"true\"\n              >\n                <path\n                  stroke-linecap=\"round\"\n                  stroke-linejoin=\"round\"\n                  d=\"M4.5 12.75l6 6 9-13.5\"\n                />\n              </svg>\n            </div>\n            <div class=\"mt-3 text-center sm:mt-5\">\n              <h3\n                id=\"modal-title\"\n                class=\"text-base font-semibold leading-6 text-gray-900\"\n              >\n                {{ t('patterns.download.success_title') }}\n              </h3>\n              <div class=\"mt-2\">\n                <div class=\"flex flex-col gap-2\">\n                  <p class=\"text-sm text-gray-500\">\n                    {{ t('patterns.download.success_content.sentence1') }}\n                  </p>\n                  <p class=\"text-sm text-gray-500\">\n                    {{ t('patterns.download.success_content.sentence2') }}\n                  </p>\n                  <br />\n                  <p class=\"text-sm text-gray-500\">\n                    {{ t('patterns.download.success_content.sentence3') }}\n                  </p>\n                </div>\n                <div class=\"mt-5 text-sm text-gray-500\">\n                  {{\n                    t('patterns.download.countdown', {\n                      countdown: countdownValue\n                    })\n                  }}\n                </div>\n                <button\n                  class=\"mt-5 inline-block text-sm text-primary decoration-solid hover:text-pink\"\n                  @click=\"startDownload\"\n                >\n                  {{ t('patterns.download.download_pattern_here') }}\n                </button>\n              </div>\n            </div>\n          </div>\n          <div class=\"mt-5 sm:mt-6\">\n            <button\n              class=\"btn-md w-full bg-primary text-white\"\n              @click=\"showThankYouModal = false\"\n            >\n              {{ t('patterns.download.success_close') }}\n            </button>\n          </div>\n        </div>\n      </div>\n    </template>\n  </Modal>\n</template>\n\n<script setup lang=\"ts\">\nimport { ref, onBeforeMount, computed, watch } from 'vue';\nimport { Modal } from '@hobbii/hobbii-ui';\nimport { useProductStore } from '@/shared/pinia/modules/product.js';\nimport { useWebviewStore } from '@/shared/pinia/modules/webview';\nimport { setCookie, getCookie } from '@/shared/utils/cookie';\nimport { isEmailValid } from '@/shared/utils/email';\nimport { hashUserData, trackUserEvent } from '@/shared/utils/tracking';\nimport { campaignType } from '@/shared/constants/campaignTypes';\nimport { useTranslations } from '@/shared/composables/useTranslations.ts';\nimport { v5 } from 'uuid';\nimport { useUserStore } from '@/shared/pinia/modules/user';\n\nconst { t } = useTranslations();\n\nconst props = defineProps<{\n  productName: string;\n  productSku: string;\n  patternPurchasable: boolean;\n}>();\n\nconst productStore = useProductStore();\nconst { isWebview, downloadPattern } = useWebviewStore();\nconst userStore = useUserStore();\n\nconst showPatternDownloadModal = ref(false);\nconst showThankYouModal = ref(false);\nconst countdownValue = ref(0);\n\nconst customerEmail = ref('');\nconst customerName = ref('');\nconst patternDownloadUrl = ref<string | null>(null);\nconst emailIsValid = ref<boolean | null>(null);\n\nconst formIsValid = computed(() => emailIsValid.value && customerName.value);\n\nconst emarsysUUIDKey = 'emarsysUUID';\n\nonBeforeMount(async () => {\n  patternDownloadUrl.value = await setUpPatternDownloadTracking();\n  if (patternDownloadUrl.value) {\n    productStore.purchasable = false;\n    const priceBlock =\n      document.querySelector<HTMLElement>('.hb-pp-price-block');\n    if (priceBlock) {\n      priceBlock.hidden = true;\n    }\n  }\n\n  if (\n    sessionStorage.getItem('signupForm') ===\n    'pattern-download-newsletter-signup-form'\n  ) {\n    setAsSignedUp();\n    showThankYouDialog();\n  }\n});\n\nasync function setUpPatternDownloadTracking(): Promise<string> {\n  let contactUUID = sessionStorage.getItem(emarsysUUIDKey);\n  if (userStore.isLogged) {\n    setAsSignedUp();\n  } else if (!contactUUID) {\n    // We need to prompt them for their email again so we can track the pattern\n    // download. (They can always skip it by clicking \"already signed up\")\n    setAsNotSignedUp();\n  }\n  return await productStore.patternDownloadUrl(\n    props.productSku,\n    contactUUID,\n    getCookie('localization')\n  );\n}\n\nwatch(showPatternDownloadModal, (newVal) => {\n  trackUserEvent('generic_user_event', {\n    category: `pattern content locking ${campaignType.HOBBII}`,\n    action: newVal ? 'show popup' : 'close popup',\n    label: props.productName\n  });\n});\n\nconst alreadySubscribedDownload = () => {\n  trackUserEvent('generic_user_event', {\n    category: `pattern content locking ${campaignType.HOBBII}`,\n    action: 'clicked on already a subscriber',\n    label: props.productName\n  });\n  setAsSignedUp(); // To avoid annoying users by asking for email every time\n  startDownload();\n};\n\nconst startDownload = () => {\n  if (!patternDownloadUrl.value) return;\n\n  if (isWebview) {\n    downloadPattern(patternDownloadUrl.value, productStore.legacyId);\n  } else {\n    location.href = patternDownloadUrl.value;\n    closeDownloadModal();\n  }\n\n  trackUserEvent('download_pattern', {\n    category: props.patternPurchasable ? 'plus_pattern' : 'free_pattern',\n    action: 'download_pattern',\n    label: props.productName,\n    item_id: productStore.legacyId || ''\n  });\n};\n\nconst handleDownloadButtonClick = () => {\n  if (isWebview || isSignedUp()) {\n    startDownload();\n  } else {\n    openDownloadModal();\n  }\n};\n\nconst openDownloadModal = () => {\n  showPatternDownloadModal.value = true;\n};\n\nconst closeDownloadModal = () => {\n  showPatternDownloadModal.value = false;\n};\n\nconst validateEmailInput = (e: Event) => {\n  // if user has typed invalid number before, use validation on keyup else: only validate on blur\n  if (e.type === 'input' && emailIsValid.value !== false) {\n    return;\n  }\n\n  // Hide error when field is empty\n  if (!customerEmail.value) {\n    emailIsValid.value = null;\n  } else if (isEmailValid(customerEmail.value)) {\n    emailIsValid.value = true;\n  } else {\n    emailIsValid.value = false;\n  }\n};\n\nconst onNewsletterSignupFormSubmit = async () => {\n  const patternDownloadSignupForm = document.querySelector<HTMLFormElement>(\n    '#pattern-download-newsletter-signup-form'\n  );\n\n  if (!patternDownloadSignupForm) return;\n\n  const firstNameInput =\n    patternDownloadSignupForm.querySelector<HTMLInputElement>(\n      'input[name=\"contact[first_name]\"]'\n    );\n  const emailInput = patternDownloadSignupForm.querySelector<HTMLInputElement>(\n    'input[name=\"contact[email]\"]'\n  );\n\n  if (firstNameInput) firstNameInput.value = customerName.value;\n  if (emailInput) {\n    emailInput.value = customerEmail.value;\n    sessionStorage.setItem(\n      emarsysUUIDKey,\n      // This is the same hashing function Emarsys uses. Don't change this.\n      v5(emailInput.value, '64525bc0-03a1-4d1f-b342-1f53a5061697')\n    );\n  }\n\n  sessionStorage.setItem(\n    'signupForm',\n    'pattern-download-newsletter-signup-form'\n  );\n\n  trackUserEvent('generic_user_event', {\n    category: 'newsletter',\n    action: 'pattern_download_signup',\n    customer_name_hash:\n      firstNameInput?.value && hashUserData(firstNameInput.value),\n    customer_email_hash: emailInput?.value && hashUserData(emailInput.value),\n    currency_code: window.Shopify.currency.active\n  });\n\n  trackUserEvent('generic_user_event', {\n    category: `pattern content locking ${campaignType.HOBBII}`,\n    action: 'clicked on signup',\n    label: props.productName\n  });\n\n  patternDownloadSignupForm.submit();\n};\n\nfunction setAsSignedUp() {\n  setCookie('newsletter_signup', '1', 400);\n}\nfunction setAsNotSignedUp() {\n  setCookie('newsletter_signup', '0', 400);\n}\n\nfunction isSignedUp() {\n  return getCookie('newsletter_signup') === '1';\n}\n\n// Show newsletter signup success message if needed\nfunction showThankYouDialog() {\n  showThankYouModal.value = true;\n  startCountdown(5, startDownload);\n}\n\nconst startCountdown = (seconds: number, onDone: () => void) => {\n  countdownValue.value = seconds;\n\n  const countdownInterval = setInterval(() => {\n    countdownValue.value--;\n\n    if (countdownValue.value === 0) {\n      clearInterval(countdownInterval);\n\n      if (onDone) {\n        onDone();\n      }\n    }\n  }, 1000);\n};\n</script>\n","<template>\n  <div\n    class=\"p-[15px_0_10px] text-base font-bold text-gray-darkest md:pt-0 md:text-sm\"\n  >\n    {{ t('product.quantity.entry_qty') }}\n  </div>\n  <NumberSpinner v-model=\"value\" :min=\"1\" :max=\"9999\" />\n</template>\n\n<script setup>\nimport { computed } from 'vue';\nimport { useProductQuantitiesStore } from '@/shared/pinia/modules/product-quantities';\nimport { NumberSpinner } from '@hobbii/hobbii-ui';\nimport { useTranslations } from '@/shared/composables/useTranslations.ts';\n\nconst { t } = useTranslations();\n\nconst quantityStore = useProductQuantitiesStore();\nconst value = computed({\n  get() {\n    return quantityStore.quantity;\n  },\n  set(value) {\n    quantityStore.updateQuantity(value);\n  }\n});\n</script>\n","<template>\n  <div>\n    <BulkDiscountButton @click=\"openModal\">\n      <span v-if=\"quantityStore.quantity\">{{\n        t('product.quantity.pcs', quantityStore.quantity)\n      }}</span>\n      <span v-else>{{ t('product.quantity.text_select_quantity') }}</span>\n\n      <template\n        v-if=\"selectedBulkDiscountPct || !quantityStore.quantity\"\n        #highlight\n      >\n        <template v-if=\"highestDiscountItemPct && !quantityStore.quantity\">{{\n          t('product.quantity.text_save_up_to', {\n            value: highestDiscountItemPct\n          })\n        }}</template>\n        <template v-else-if=\"selectedBulkDiscountPct\">{{\n          t('product.quantity.text_save', { value: selectedBulkDiscountPct })\n        }}</template>\n      </template>\n    </BulkDiscountButton>\n\n    <BulkDiscountModal v-model:active=\"quantityStore.showQuantityModal\">\n      <template #header>\n        <ModalHeader>{{ modalTitle }}</ModalHeader>\n        <ModalSubheader>\n          <Tag v-if=\"tag\" color=\"gray\">{{ tag }}</Tag>\n          <span v-if=\"shortDescription\"> {{ shortDescription }}</span>\n        </ModalSubheader>\n      </template>\n      <template #header-mobile>\n        <ModalHeader>{{ modalTitle }}</ModalHeader>\n      </template>\n      <template v-if=\"image\" #image>\n        <img :src=\"image\" class=\"h-auto w-full\" :alt=\"modalTitle\" />\n      </template>\n\n      <div class=\"mb-1 grid grid-cols-3 gap-2 md:grid-cols-4\">\n        <div class=\"pl-4 text-sm font-bold\">\n          {{ t('product.quantity.entry_qty') }}\n        </div>\n        <div class=\"pl-2 text-sm font-bold\">\n          {{ t('product.quantity.text_discount') }}\n        </div>\n        <div class=\"text-right text-sm font-bold\">\n          {{ t('product.quantity.text_discount_each') }}\n        </div>\n        <div\n          class=\"hidden pr-4 text-right text-sm font-bold text-pink md:block\"\n        >\n          {{ t('product.quantity.text_label_yousave') }}\n        </div>\n      </div>\n\n      <template v-for=\"(bulk, index) in bulkDiscounts\">\n        <RadioInputBar\n          v-if=\"bulk.quantity\"\n          :key=\"index\"\n          v-model:modelValue=\"qty\"\n          class=\"grid grid-cols-3 odd:bg-white even:bg-gray-100/50 md:grid-cols-4\"\n          :value=\"bulk.quantity\"\n        >\n          <template #label>\n            <span>{{ t('product.quantity.pcs', bulk.quantity) }}</span>\n          </template>\n          <span>\n            <Tag\n              v-if=\"bulk.discount_percentage\"\n              color=\"yellow\"\n              class=\"font-semibold\"\n              >{{\n                t('product.quantity.text_save', {\n                  value: bulk.discount_percentage\n                })\n              }}</Tag\n            >\n          </span>\n          <span class=\"text-right\">{{ formattedPrice(bulk.price_unit) }}</span>\n          <span\n            v-if=\"getDiscountFormatted(bulk)\"\n            class=\"hidden text-right text-pink md:block\"\n            >{{ getDiscountFormatted(bulk) }}</span\n          ><span v-else class=\"hidden text-right md:block\">-</span>\n        </RadioInputBar>\n      </template>\n\n      <template #controls>\n        <NumberSpinner v-model=\"qty\" :min=\"0\" :max=\"9999\" />\n\n        <BulkDiscountPrice\n          v-if=\"closestQuantityItem && qty > 0\"\n          :prefix=\"t('product.quantity.text_total_price')\"\n          :sales-price=\"salesPrice\"\n          :regular-price=\"regularPrice\"\n        ></BulkDiscountPrice>\n      </template>\n\n      <template #footer>\n        <ButtonAddToCart\n          v-if=\"inStock && isOptionSelected\"\n          :disabled=\"qty <= 0 || !inStock || !isOptionSelected\"\n          class=\"w-full min-w-80 p-4 md:w-auto\"\n          :adding=\"cartStore.adding\"\n          @click=\"addToCart\"\n        >\n        </ButtonAddToCart>\n        <ButtonText\n          v-else\n          theme=\"primary\"\n          size=\"lg\"\n          class=\"mt-4 w-full rounded p-4 md:w-auto\"\n          :disabled=\"qty <= 0\"\n          @click=\"submitQuantityAndClose\"\n        >\n          {{ t('product.quantity.text_select_quantity') }}\n        </ButtonText>\n      </template>\n    </BulkDiscountModal>\n\n    <CartErrorModal ref=\"cartErrorModal\" />\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { getProductDataFromHTML } from '@/shared/utils/product.js';\nimport { useProductMeta } from '@/shared/composables/useProductMeta.js';\nimport CartErrorModal from '@/components/CartActions/CartErrorModal.vue';\n\nimport {\n  BulkDiscountButton,\n  BulkDiscountModal,\n  ModalHeader,\n  ModalSubheader,\n  ButtonText,\n  BulkDiscountPrice,\n  NumberSpinner,\n  RadioInputBar,\n  Tag\n} from '@hobbii/hobbii-ui';\n\nimport { ref, computed, onBeforeMount } from 'vue';\nimport { useProductQuantitiesStore } from '@/shared/pinia/modules/product-quantities';\nimport { useProductOptionsStore } from '@/shared/pinia/modules/product-options';\nimport { useProductStore } from '@/shared/pinia/modules/product';\nimport { useCartStore } from '@/shared/pinia/modules/cart';\nimport { useConfigStore } from '@/shared/pinia/modules/config';\nimport ButtonAddToCart from '../CartActions/ButtonAddToCart.vue';\n\nimport { useTranslations } from '@/shared/composables/useTranslations.ts';\n\nconst { t } = useTranslations();\n\n// We have no way to ensure that this is what the store returns\ntype MaybeStoreBulkDiscount = {\n  quantity?: number;\n  discount_percentage?: number;\n  price_before?: number;\n  price_unit?: number;\n};\n\ntype MaybeStoreSelectedVariant = {\n  title?: string;\n  inStock: boolean;\n};\n\nconst productStore = useProductStore();\nconst cartStore = useCartStore();\nconst optionsStore = useProductOptionsStore();\nconst quantityStore = useProductQuantitiesStore();\nconst { formattedPrice } = useConfigStore();\n\nconst qty = ref(0);\nconst cartErrorModal = ref<typeof CartErrorModal | null>(null);\n\nconst addToCart = async () => {\n  try {\n    quantityStore.updateQuantity(qty.value);\n    quantityStore.showQuantityModal = false;\n    await cartStore.addToCart();\n  } catch (err) {\n    cartErrorModal.value?.display(\n      ('message' in (err as Error) && (err as Error).message) ||\n        window.Hobbii?.errorMessages.unknownErrorOccurred\n    );\n  }\n};\n\nconst {\n  productName,\n  entityType,\n  metaSubtitle,\n  metaYarnComposition,\n  metaYarnWeight\n}: {\n  productName?: string;\n  entityType?: string;\n  metaSubtitle?: string;\n  metaYarnComposition?: string;\n  metaYarnWeight?: string;\n} = getProductDataFromHTML();\n\nonBeforeMount(() => {\n  productStore.setInitialPriceFromDOM();\n});\n\nconst { getHighlight, getShortDescription } = useProductMeta(\n  {\n    entity_type: entityType,\n    yarn_weight_category: metaYarnWeight,\n    yarn_composition: metaYarnComposition,\n    subtitle: metaSubtitle\n  },\n  true\n);\n\nconst tag = getHighlight();\nconst shortDescription = getShortDescription();\n\nconst inStock = computed<boolean>(\n  () => !!(optionsStore.activeOption as { inStock?: boolean } | null)?.inStock\n);\nconst isOptionSelected = computed<boolean>(() => optionsStore.isOptionSelected);\n\n// First option with quantity=1 to bulk discount array\nconst defaultItem = computed<MaybeStoreBulkDiscount>(() => {\n  return {\n    quantity: 1,\n    price_before: productStore.price.before || undefined,\n    price_unit: productStore.price.initial_unit || undefined\n  };\n});\n\nconst bulkDiscounts = computed<MaybeStoreBulkDiscount[]>(() => {\n  return [defaultItem.value, ...quantityStore.bulkDiscounts];\n});\n\n// Calculate discount on item\nconst getDiscountFormatted = (item: MaybeStoreBulkDiscount) => {\n  const discount =\n    item.price_before! * item.quantity! - item.price_unit! * item.quantity!;\n\n  // We're not sure we'll get a number out because of... JS...\n  if (isNaN(discount) || !discount) return '';\n\n  return formattedPrice(discount);\n};\n\nconst modalTitle = computed(() => {\n  const selectedVariant =\n    optionsStore.activeOption as MaybeStoreSelectedVariant | null;\n\n  if (selectedVariant?.title) {\n    return `${productName} - ${selectedVariant.title}`;\n  }\n  return productName;\n});\n\nconst closestQuantityItem = computed<MaybeStoreBulkDiscount | undefined>(\n  () => quantityStore.selectedBulkDiscount(qty.value) ?? defaultItem.value\n);\n\nconst selectedBulkDiscountPct = computed<MaybeStoreBulkDiscount | undefined>(\n  () => {\n    const bulk =\n      qty.value === 1\n        ? defaultItem.value\n        : quantityStore.selectedBulkDiscount(qty.value);\n\n    return bulk?.discount_percentage;\n  }\n);\n\nconst highestDiscountItemPct = computed(() => {\n  const bulk = quantityStore.highestDiscountItem;\n  return bulk && bulk.discount_percentage;\n});\n\nconst salesPrice = computed(() =>\n  closestQuantityItem.value && closestQuantityItem.value.price_unit\n    ? formattedPrice(closestQuantityItem.value.price_unit * qty.value)\n    : ''\n);\n\nconst regularPrice = computed(() =>\n  closestQuantityItem.value && closestQuantityItem.value.price_before\n    ? formattedPrice(closestQuantityItem.value.price_before * qty.value)\n    : ''\n);\n\nconst image = computed<string | null | undefined>(() => {\n  return (\n    (\n      optionsStore.activeOption as {\n        consolidatedImageUrl?: string;\n      } | null\n    )?.consolidatedImageUrl ||\n    productStore.mainImageUrl ||\n    window.Hobbii?.fallbackImageUrl\n  );\n});\n\nconst openModal = () => {\n  quantityStore.showQuantityModal = true;\n  qty.value = quantityStore.quantity;\n};\n\nconst submitQuantityAndClose = () => {\n  quantityStore.showQuantityModal = false;\n  quantityStore.updateQuantity(qty.value);\n};\n</script>\n","import { useI18n } from 'vue-i18n';\n\nexport const useProductMeta = (meta = {}, alreadyTranslated) => {\n  const { t } = useI18n();\n  let yarnWeight = '';\n  let patternType = '';\n  let yarnComposition = '';\n  let subtitle = '';\n  let designers = '';\n\n  const isAPattern = meta.entity_type === 'pattern';\n\n  const getHighlight = () => {\n    if (isAPattern) {\n      return patternType;\n    } else {\n      return yarnWeight;\n    }\n  };\n\n  const getShortDescription = () => {\n    if (isAPattern) {\n      return designers || subtitle;\n    } else {\n      return subtitle || yarnComposition;\n    }\n  };\n\n  const setYarnWeight = () => {\n    const yarnWeightCategory = meta?.yarn_weight_category;\n\n    if (yarnWeightCategory) {\n      if (alreadyTranslated) {\n        yarnWeight = yarnWeightCategory;\n      } else {\n        yarnWeight = t(`product.yarn_weight.${yarnWeightCategory}`);\n      }\n    }\n  };\n\n  const setPatternMeta = () => {\n    if (isAPattern) {\n      if (meta.designer) {\n        designers = Array.isArray(meta.designer)\n          ? meta.designer.join(', ')\n          : meta.designer;\n      }\n\n      if (meta.pattern_kind) {\n        patternType = Array.isArray(meta.pattern_kind)\n          ? meta.pattern_kind.join(', ')\n          : meta.pattern_kind;\n      }\n    }\n  };\n\n  const setProductMeta = () => {\n    if (!isAPattern) {\n      yarnComposition = meta.yarn_composition;\n      subtitle = meta.subtitle;\n    }\n  };\n\n  setYarnWeight();\n  setPatternMeta();\n  setProductMeta();\n\n  return {\n    yarnWeight,\n    patternType,\n    yarnComposition,\n    subtitle,\n    designers,\n    getHighlight,\n    getShortDescription\n  };\n};\n","import GlobalKeyDownDirective from '@/shared/directives/globalKeyDown';\nimport QuantityBasicSelector from '@/components/QuantitySelector/QuantityBasicSelector.vue';\nimport QuantityBulkSelector from '@/components/QuantitySelector/QuantityBulkSelector.vue';\n\nimport { useProductQuantitiesStore } from '@/shared/pinia/modules/product-quantities';\nimport { useProductOptionsStore } from '@/shared/pinia/modules/product-options';\nimport { setupI18n } from '@/shared/utils/i18n';\n\nexport const initQuantitySelector = async (createApp, mountSelector) => {\n  const script = document.getElementById(mountSelector);\n\n  if (!script) return;\n\n  // extract and convert data\n  const price = Number(script.dataset.price);\n  const compareAtPrice = Number(script.dataset.compareAtPrice ?? null);\n  const hasDifferentPrices = script.dataset.hasDifferentPrices === 'true';\n\n  const isOnSale = compareAtPrice > price;\n  const hasBulkDiscountsConfig = !!script.dataset.discounts;\n  const useBulkDiscounts = !isOnSale && hasBulkDiscountsConfig;\n\n  const bulkDiscounts = useBulkDiscounts\n    ? JSON.parse(script.dataset.discounts).map((b) => {\n        // calculate the discounted price\n        const discountAmount = (price * b.discount_percentage) / 100;\n\n        // TODO: Avoid mutating this, there must be a better way...\n        return {\n          ...b,\n          price_before: price,\n          price_unit: price - discountAmount\n        };\n      })\n    : [];\n\n  const quantityStore = useProductQuantitiesStore();\n  const optionsStore = useProductOptionsStore();\n\n  quantityStore.setBulkDiscounts(bulkDiscounts);\n\n  const quantityComponent = useBulkDiscounts\n    ? QuantityBulkSelector\n    : QuantityBasicSelector;\n  const defaultValue = useBulkDiscounts ? 0 : 1;\n\n  const vueApp = createApp(quantityComponent);\n\n  quantityStore.quantity = defaultValue;\n  optionsStore.haveDifferentPrices = hasDifferentPrices;\n\n  const i18n = await setupI18n(window.Shopify.locale);\n\n  vueApp.use(window.hobbiiStore);\n\n  vueApp\n    .use(i18n)\n    .directive('global-keydown', GlobalKeyDownDirective)\n    .mount(`#${mountSelector}`);\n\n  // TODO update stock\n};\n","import { createApp } from 'vue';\nimport { initCartActions } from '@/shared/instances/cart-button.js';\nimport { initHobbiiStarter } from '@/shared/instances/hobbii-starter';\nimport { initPatternDownload } from '@/shared/instances/pattern-download-button.js';\nimport { initQuantitySelector } from '@/shared/instances/quantity-selector.js';\n\nimport { useProductStore } from '@/shared/pinia/modules/product.js';\nimport { getProductDataFromHTML } from '@/shared/utils/product.js';\n\nimport { initTabCounters } from './shared/product-tab-counters.js';\nimport { initProductInfoTabs } from './shared/product-info-tabs.js';\nimport { setReadMoreListeners } from './shared/read-more.js';\nimport {\n  initGalleryOptions,\n  initDropdownOptions,\n  initSingleOption\n} from './shared/product-options.js';\nimport { entityTypes } from '@/shared/constants/product.js';\n\nconst optionsMountId = 'product-options';\nconst cartActionsMountId = 'product-cart-actions';\nconst quantityPickerMountId = 'product-quantity-selector';\n\n// set option selector\nconst initOptionsSelector = () => {\n  const elem = document.getElementById(optionsMountId);\n\n  const type = JSON.parse(elem.dataset.optionKind);\n\n  switch (type?.layout) {\n    case 'gallery':\n      initGalleryOptions(createApp, optionsMountId);\n      break;\n    case 'dropdown':\n      initDropdownOptions(createApp, optionsMountId);\n      break;\n    default: {\n      initSingleOption(optionsMountId);\n    }\n  }\n};\n\nconst initProductPageApps = async () => {\n  const { productId, variantId, legacyId, entityType, productMainImageUrl } =\n    getProductDataFromHTML();\n\n  const productStore = useProductStore();\n\n  if (entityType) {\n    productStore.entityType = entityType;\n  }\n  if (productId) {\n    productStore.productId = productId;\n  }\n  if (variantId) {\n    productStore.variantId = variantId;\n  }\n  if (legacyId) {\n    productStore.legacyId = legacyId;\n  }\n\n  if (productMainImageUrl) {\n    productStore.mainImageUrl = productMainImageUrl;\n  }\n\n  if (productStore.entityType == entityTypes.PATTERN) {\n    const { isFreePattern } = getProductDataFromHTML();\n    if (isFreePattern === 'true') {\n      productStore.purchasable = false;\n    }\n  }\n\n  // TODO Check store\n  // TODO set cart item preview / modal\n  // TODO set Q&A\n  // TODO set photo gallery\n\n  // TODO perhaps use hide / show on the product page instead of this\n  if (productStore.isPattern) {\n    initPatternDownload(createApp, 'pattern-download-button');\n  } else {\n    initOptionsSelector();\n  }\n\n  initCartActions(createApp, cartActionsMountId);\n  initQuantitySelector(createApp, quantityPickerMountId);\n  initProductInfoTabs();\n  initTabCounters();\n\n  setReadMoreListeners();\n};\n\ninitHobbiiStarter();\ninitProductPageApps();\n","import PatternDownload from '../components/patterns/PatternDownload.vue';\nimport GlobalKeyDownDirective from '../directives/globalKeyDown.js';\nimport { getProductDataFromHTML } from '@/shared/utils/product.js';\nimport { useProductStore } from '../pinia/modules/product.js';\nimport { setupI18n } from '@/shared/utils/i18n';\n\nexport const initPatternDownload = async (createApp, mountId) => {\n  const mountElement = document.getElementById(mountId);\n\n  if (!mountElement) {\n    console.error(`Element with id: \"${mountId}\" not found.`);\n    return;\n  }\n\n  const { productName, legacyId } = getProductDataFromHTML();\n  const { productSku, freePattern } = mountElement.dataset;\n\n  if (!productName || !productSku || !freePattern) return;\n\n  const i18n = await setupI18n(window.Shopify.locale);\n\n  const productStore = useProductStore();\n  productStore.legacyId = legacyId;\n\n  createApp(PatternDownload, {\n    productName,\n    productSku,\n    patternPurchasable: freePattern === 'false'\n  })\n    .use(i18n)\n    .directive('global-keydown', GlobalKeyDownDirective)\n    .mount(`#${mountId}`);\n};\n","import GlobalKeyDownDirective from '../../shared/directives/globalKeyDown';\nimport CartActions from '../../components/CartActions/CartActions.vue';\nimport { setupI18n } from '@/shared/utils/i18n';\n\nexport const initCartActions = async (createApp, mountId) => {\n  if (!document.getElementById(mountId)) {\n    console.error(`Element with id: \"${mountId}\" not found.`);\n    return;\n  }\n\n  const i18n = await setupI18n(window.Shopify.locale);\n\n  const vueApp = createApp(CartActions);\n  vueApp.use(window.hobbiiStore);\n\n  vueApp\n    .use(i18n)\n    .directive('global-keydown', GlobalKeyDownDirective)\n    .mount(`#${mountId}`);\n};\n"],"names":["t","useTranslations","props","__props","addToCartBtn","ref","classes","computed","disabled","adding","isWebview","_hoisted_1","xmlns","width","height","_hoisted_3","fill","strokeLinecap","strokeLinejoin","createBaseVNode","d","_sfc_render","_ctx","_cache","cartErrorModal","cartErrorMessage","__expose","display","errorMessage","value","_a","openModal","cartStore","useCartStore","webviewStore","useWebviewStore","productStore","useProductStore","quantityStore","useProductQuantitiesStore","optionsStore","useProductOptionsStore","flyingItem","selectedQuantity","quantity","isOptionSelected","isQuantitySelected","isPurchasable","purchasable","isAdding","isProduct","productInStock","isPattern","onAddToCartClick","__async","this","addToCart","err","_b","message","window","Hobbii","errorMessages","unknownErrorOccurred","showQuantityModal","showOptionsModal","trackUserEvent","event","data","dataLayer","push","user_event_data","hashUserData","sha256","campaignType","emarsysUUIDKey","downloadPattern","userStore","useUserStore","showPatternDownloadModal","showThankYouModal","countdownValue","customerEmail","customerName","patternDownloadUrl","emailIsValid","formIsValid","onBeforeMount","contactUUID","sessionStorage","getItem","isLogged","setCookie","productSku","getCookie","setUpPatternDownloadTracking","priceBlock","document","querySelector","hidden","startCountdown","startDownload","watch","newVal","category","action","label","productName","alreadySubscribedDownload","legacyId","location","href","patternPurchasable","item_id","handleDownloadButtonClick","openDownloadModal","closeDownloadModal","validateEmailInput","e","type","isEmailValid","onNewsletterSignupFormSubmit","patternDownloadSignupForm","firstNameInput","emailInput","setItem","v5","customer_name_hash","customer_email_hash","currency_code","Shopify","currency","active","submit","setAsSignedUp","seconds","onDone","countdownInterval","setInterval","clearInterval","get","set","updateQuantity","formattedPrice","useConfigStore","qty","entityType","metaSubtitle","metaYarnComposition","metaYarnWeight","getProductDataFromHTML","setInitialPriceFromDOM","getHighlight","getShortDescription","meta","alreadyTranslated","useI18n","yarnWeight","patternType","yarnComposition","subtitle","designers","isAPattern","entity_type","yarnWeightCategory","yarn_weight_category","designer","Array","isArray","join","pattern_kind","yarn_composition","useProductMeta","tag","shortDescription","inStock","activeOption","defaultItem","price_before","price","before","price_unit","initial_unit","bulkDiscounts","getDiscountFormatted","item","discount","isNaN","modalTitle","selectedVariant","title","closestQuantityItem","selectedBulkDiscount","selectedBulkDiscountPct","bulk","discount_percentage","highestDiscountItemPct","highestDiscountItem","salesPrice","regularPrice","image","consolidatedImageUrl","mainImageUrl","fallbackImageUrl","submitQuantityAndClose","initQuantitySelector","createApp","mountSelector","exports","script","getElementById","Number","dataset","compareAtPrice","hasDifferentPrices","isOnSale","hasBulkDiscountsConfig","discounts","useBulkDiscounts","JSON","parse","map","b","discountAmount","__spreadProps","setBulkDiscounts","defaultValue","vueApp","QuantityBulkSelector","QuantityBasicSelector","haveDifferentPrices","i18n","setupI18n","locale","use","hobbiiStore","directive","GlobalKeyDownDirective","mount","optionsMountId","productId","variantId","productMainImageUrl","entityTypes","PATTERN","isFreePattern","mountId","mountElement","console","error","freePattern","PatternDownload","elem","optionKind","layout","initGalleryOptions","initDropdownOptions","initSingleOption","CartActions","initCartActions"],"mappings":"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"}