{"version":3,"file":"DndyhBgN.js","sources":["../../../../../domains/commerce/components/bopis/Stores.vue","../../../../../domains/commerce/components/form/bopis-store-search/BopisStoreSearch.vue"],"sourcesContent":["<template>\n  <ul>\n    <define-store-address v-slot=\"{ store }\">\n      <span>\n        {{ store.address1 }}<br>\n        <template v-if=\"store.address2\">{{ store.address2 }}<br></template>\n        {{ store.city }} {{ store.state }}. {{ store.postalcode }}, {{ store.country }}<br>\n      </span>\n    </define-store-address>\n    <li v-for=\"store in stores\" :key=\"store.storeid\" class=\"mt-4 b-t b-grey-70 pt-4 px-4 lg:px-6\">\n      <div class=\"w-full gap-x-4 align-top i-flex\">\n        <base-button\n          :aria-label=\"store.name\"\n          :aria-pressed=\"store.storeid === selectedStore?.storeid\"\n          class=\"h-6 w-6 shrink-0 rounded-full p-1 ring ring-grey-40 ring-inset duration peer-focus-visible:outline-auto peer-focus-within:ring-grey-10 !mt-1 !h-4 !w-4\"\n          @click=\"selectedStore = store\"\n        >\n          <span\n            class=\"block full rounded-full duration bg-brand-1\"\n            :class=\"store.storeid === selectedStore?.storeid ? 'op-100 ' : 'op-0'\"\n          />\n        </base-button>\n        <div class=\"w-full text-base c-grey-10\">\n          <base-collapse class-toggle=\"w-full\">\n            <template #toggle=\"{ expanded }\">\n              <span class=\"flex between\">\n                <span class=\"subtitle-4\">{{ store.name }}</span>\n                <vf-icon :dir=\"expanded ? 'up' : 'down'\" name=\"chevron\" size=\"md\" />\n              </span>\n              <span class=\"flex text-sm between c-grey-20\">\n                <slot name=\"store-body-collapsed\" :store>\n                  <store-address v-if=\"showAddressPreview\" class=\"mt-2 \" :store />\n                  <template v-else>\n                    <span v-if=\"store.quantity && store.bopis_enabled === '1'\">{{ $t.readyIn24hours }}.</span>\n                    <span v-else-if=\"store.sts_enabled === '1'\">{{ $t.readyIn3Days }}.</span>\n                  </template>\n                  <span>({{ store._distance }} {{ store._distanceuom }})</span>\n                </slot>\n              </span>\n              <span v-if=\"store.quantity && store.quantity < qtyThreshold\" class=\"text-sm c-grey-20\">\n                {{ replaceAll($t.qtyLimitLow, { limit: store.quantity }) }}\n              </span>\n            </template>\n            <div class=\"pt-4 space-y-6\">\n              <address class=\"text-sm\">\n                <store-address v-if=\"!showAddressPreview\"  :store />\n                <span class=\"mt-4 flex items-center gap-2\">\n                  <vf-icon name=\"location\" size=\"lg\" />\n                  <vf-link :to=\"`http://maps.google.com/?q=${store.latitude},${store.longitude}`\">\n                    {{ $t.getDirections }}\n                  </vf-link>\n                </span>\n                <span class=\"mt-4 flex items-center gap-2\">\n                  <vf-icon name=\"phone\" size=\"lg\" />\n                  <vf-link :to=\"`tel:${store.phone}`\">\n                    {{ store.phone }}\n                  </vf-link>\n                </span>\n              </address>\n              <div>\n                <div class=\"mb-2 fw-medium\">\n                  {{ $t.storeHours }}\n                </div>\n                <ul >\n                  <li>{{ $t.weekday }}: {{ store.m }}</li>\n                  <li>{{ $t.saturday }}: {{ store.sa }}</li>\n                  <li>{{ $t.sunday }}: {{ store.su }}</li>\n                </ul>\n              </div>\n              <div v-if=\"store.store_description\">\n                <div class=\"mb-2 fw-medium\">\n                  {{ $t.getStoreInstruction }}\n                </div>\n                <span >\n                  {{ store.store_description }}\n                </span>\n              </div>\n            </div>\n          </base-collapse>\n        </div>\n      </div>\n    </li>\n  </ul>\n</template>\n\n<script lang=\"ts\" setup>\nimport type { LocatorSearchItem } from '#types/brandify'\n\ndefineProps<{\n  stores: LocatorSearchItem[]\n  showAddressPreview?: boolean\n}>()\n\nconst [DefineStoreAddress, StoreAddress] = createReusableTemplate()\n\nconst selectedStore = defineModel<LocatorSearchItem>()\nconst { qtyThreshold } = useAppConfig().components.form.bopisStoreSearch\n</script>\n","<template>\n  <div v-show=\"visible\">\n    <div class=\"flex center between\">\n      <p :class=\"brandClasses.heading\">\n        {{ $t.storeSearch.enterLocation }}\n      </p>\n      <base-button v-if=\"showCloseButton\" :aria-label=\"$t.close\" @click=\"$emit('close')\">\n        <vf-icon name=\"close\" size=\"md\" />\n      </base-button>\n    </div>\n    <base-form\n      ref=\"formRef\"\n      :class=\"brandClasses.form\"\n      :form\n      validate-on=\"submit\"\n      @submit=\"submit\"\n    >\n      <vf-form-field v-slot=\"{ invalid }\" name=\"postalCode\" :rule=\"searchValidation\">\n        <div class=\"group flex\">\n          <vf-input\n            v-model=\"form.postalCode\"\n            class=\"grow rounded-r-0 group-focus-within:b-grey-10\"\n            :disabled=\"loading\"\n            :invalid\n            required\n            @change=\"searchAsyncMessage = ''\"\n          >\n            {{ $t.cityStateOrZipCode }}\n          </vf-input>\n          <base-button\n            :aria-label=\"$t.searchLabel\"\n            class=\"w-12 flex center b b-l-0 rounded-l-0 rounded-r-sm c-grey-30 group-focus-within:b-grey-10\"\n            :class=\"[loading ? 'bg-grey-90 b-grey-50' : 'bg-white b-grey-40', {\n              'b-red-30': !loading && invalid,\n            }]\"\n            :disabled=\"loading\"\n            type=\"submit\"\n          >\n            <vf-icon name=\"search\" size=\"lg\" />\n          </base-button>\n        </div>\n      </vf-form-field>\n      <vf-checkbox v-if=\"!filterBopisStores\" v-model=\"form.onlyStoresWithAvailability\" :size=\"availabilityCheckboxSize\">\n        {{ $t.storeSearch.sortByAvailability }}\n      </vf-checkbox>\n      <p v-if=\"showNoStoresMessage && !noStoreExtendedDescription\" >\n        {{ replaceAll($t.storeSearch[filterBopisStores ? 'noStoresFilter' : 'noStores'], { distance }) }}\n      </p>\n      <p v-else-if=\"visibleStores.length && visibleStores.length < limitStores\" >\n        {{ replaceAll($t.storeSearch.lessStores, { distance }) }}\n      </p>\n    </base-form>\n    <bopis-stores\n      v-if=\"visibleStores.length\"\n      :class=\"[{ '<lg:mb-4': showSaveButton }, brandClasses.list]\"\n      :model-value=\"showSaveButton ? preselectedStore : selectedStore\"\n      :show-address-preview=\"filterBopisStores\"\n      :stores=\"visibleStores\"\n      @update:model-value=\"changeStore\"\n    >\n      <template #store-body-collapsed=\"{ store }\">\n        <slot name=\"store-body-collapsed\" :store />\n      </template>\n    </bopis-stores>\n    <template v-if=\"showSaveButton\">\n      <div v-if=\"visibleStores.length\" :class=\"brandClasses.footer\">\n        <vf-button\n          :class=\"brandClasses.submitButton\"\n          :disabled=\"loading || !preselectedStore\"\n          @click=\"applyPreselectedStore\"\n        >\n          {{ $t.selectStore }}\n        </vf-button>\n      </div>\n      <div v-else-if=\"showNoStoresMessage && noStoreExtendedDescription\" class=\"mt-4 subtitle-3 <md:px-4 \">\n        {{ replaceAll($t.storeSearch[filterBopisStores ? 'noStoresFilter' : 'noStores'], { distance }) }}\n      </div>\n      <div v-else class=\"mt-4\" />\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport type { LocatorSearchItem } from '#types/brandify'\nimport type { BaseForm as BaseFormType } from '#components'\nimport type { SearchPayload } from '#root/api/clients/stores/data-contracts'\n\nconst props = defineProps<{\n  /**\n   * Injection point for modified store objects;\n   * The parent has the option to read the stores from the Pinia store,\n   * modify them and pass them in this prop for visibility checks.\n   * If the prop is not provided, the Pinia store values will be used directly\n   */\n  stores?: LocatorSearchItem[]\n  /**\n   * Hides the content of the form if there is no selected store until a round of geolocation has been done\n   */\n  initiallyHidden?: boolean\n  /**\n   * If true, the store search will be filtered\n   * and the checkbox that allows stores to be filtered by availability will be removed\n   */\n  filterBopisStores?: boolean\n  /**\n   * Displays save button on BOPIS PLP only\n   */\n  showSaveButton?: boolean\n  /**\n   * Displays close button\n   */\n  showCloseButton?: boolean\n}>()\n\nconst emit = defineEmits<{\n  close: []\n}>()\n\nconst enum ApiErrorCode {\n  INVALID_CRITERIA = 8009,\n  NO_STORES = 5001,\n}\n\nconst { stores: storesApi } = useApi()\nconst {\n  availabilityCheckboxSize,\n  brandClasses,\n  distance,\n  limitStores,\n  noStoreExtendedDescription\n} = useAppConfig().components.form.bopisStoreSearch\nconst { validateMaxLength, validateRequired } = useLocalizedValidators()\nconst { $t } = useNuxtApp()\nconst toast = useToaster()\n\nconst { form, stores: _stores, selectedStore } = storeToRefs(useBopisStore())\nconst stores = computed(() => props.stores || _stores.value)\nconst preselectedStore = ref(selectedStore.value)\nconst formRef = ref<InstanceType<typeof BaseFormType>>()\nconst visible = ref(!props.initiallyHidden || !!selectedStore.value)\nconst loading = ref(false)\nconst noStores = ref(false)\nconst searched = ref(false)\nlet searchAsyncMessage = ''\n\nconst isSTS = ({ sts_enabled }: LocatorSearchItem) => sts_enabled === '1'\nconst isBopis = ({ bopis_enabled, quantity }: LocatorSearchItem) => (props.filterBopisStores || quantity) && bopis_enabled === '1'\n\nconst visibleStores = computed(() => {\n  if (!props.filterBopisStores && form.value.onlyStoresWithAvailability) {\n    const bopisStores: LocatorSearchItem[] = []\n    const stsStores: LocatorSearchItem[] = []\n\n    for (const store of stores.value) {\n      if (isBopis(store)) bopisStores.push(store)\n      else if (isSTS(store)) stsStores.push(store)\n\n      if (bopisStores.length === limitStores)\n        return bopisStores\n    }\n    return bopisStores.concat(\n      stsStores.slice(0, limitStores - bopisStores.length)\n    )\n  }\n  else {\n    return stores.value.filter((store) => isSTS(store) || isBopis(store)).slice(0, limitStores)\n  }\n})\n\nconst showNoStoresMessage = computed(() => noStores.value || (searched.value && !visibleStores.value.length))\n\nconst searchValidation: Record<string, Validator> = {\n  searchRequired: validateRequired($t.cityStateOrZipCode),\n  searchMaxLength: validateMaxLength(256),\n  searchAsyncError: () => searchAsyncMessage\n}\n\nconst setErrorMessage = (code: ApiErrorCode) => {\n  if (code === ApiErrorCode.INVALID_CRITERIA) {\n    searchAsyncMessage = $t.storeSearch.locationNotRecognized\n    formRef.value?.validate(true)\n  }\n  else if (code === ApiErrorCode.NO_STORES) {\n    noStores.value = true\n  }\n}\n\nconst getStores = async (payload: SearchPayload) => {\n  let _stores: LocatorSearchItem[] = []\n  noStores.value = false\n  loading.value = true\n  try {\n    const { response: storeCollection, code } = await storesApi.$search(payload, {\n      enhancedStoreSearch: true,\n      ...(props.filterBopisStores ? { filterBOPISStores: true } : {})\n    }).then((res) => ({\n      response: res.response.collection.map((store) => ({\n        ...store,\n        display_url: store.url,\n        storeid: store.enterprise_store_identifier,\n        store_description: store.localpagedescription\n      })),\n      code: null\n    })).catch((res) => {\n      return { response: [], code: res.response._data.errorDetails?.[0]?.code }\n    })\n\n    _stores = storeCollection\n\n    if (!_stores.length)\n      setErrorMessage(code)\n  }\n  catch (error) {\n    log.warn(error)\n  }\n  finally {\n    loading.value = false\n    searched.value = true\n  }\n  return _stores\n}\n\nconst showSuccessToast = (store: LocatorSearchItem) => {\n  toast.add({ props: {\n    title: $t.storeSearch.toastTitle,\n    message: replaceAll($t.storeSearch.toastMessage, { name: store.name })\n  }, delay: 2000 })\n}\n\nconst changeStore = (store: LocatorSearchItem, background?: boolean) => {\n  if (props.showSaveButton) {\n    preselectedStore.value = store\n    return\n  }\n\n  selectedStore.value = store\n  if (!background)\n    showSuccessToast(store)\n}\n\nlet unwatchVisibleStores = () => {}\nconst presetStore = () => {\n  unwatchVisibleStores()\n  if (!selectedStore.value) {\n    unwatchVisibleStores = watchImmediate(visibleStores, () => {\n      if (visibleStores.value.length) {\n        changeStore(visibleStores.value[0], true)\n        unwatchVisibleStores()\n      }\n    })\n  }\n  else if (selectedStore.value && props.showSaveButton) {\n    preselectedStore.value = selectedStore.value\n  }\n}\n\nconst applyPreselectedStore = () => {\n  if (preselectedStore.value) {\n    selectedStore.value = preselectedStore.value\n    showSuccessToast(selectedStore.value)\n    closeDialogs()\n  }\n}\n\nconst searchByGeolocation = () => {\n  if (!(navigator && 'geolocation' in navigator))\n    return\n\n  loading.value = true\n\n  navigator.geolocation.getCurrentPosition(\n    async ({ coords: { latitude, longitude } }) => {\n      _stores.value = await getStores({\n        distance,\n        unitOfMeasure: 'mile',\n        lat: latitude,\n        lng: longitude,\n      })\n      presetStore()\n      loading.value = false\n\n      if (visibleStores.value.length)\n        emit('close')\n      else\n        visible.value = true\n    },\n    (error) => {\n      log.warn(error)\n      visible.value = true\n      loading.value = false\n    }\n  )\n}\n\nconst submit = async () => {\n  preselectedStore.value = undefined\n\n  _stores.value = await getStores({\n    postalCode: form.value.postalCode,\n    distance,\n    unitOfMeasure: 'mile',\n  })\n  presetStore()\n}\n\nonMounted(() => {\n  if (form.value.postalCode && !stores.value.length)\n    submit()\n  else if (!selectedStore.value)\n    searchByGeolocation()\n})\n\ndefineExpose({\n  loading,\n})\n</script>\n"],"names":["DefineStoreAddress","StoreAddress","createReusableTemplate","selectedStore","_useModel","qtyThreshold","useAppConfig","props","__props","emit","__emit","storesApi","useApi","availabilityCheckboxSize","brandClasses","distance","limitStores","noStoreExtendedDescription","validateMaxLength","validateRequired","useLocalizedValidators","$t","useNuxtApp","toast","useToaster","form","_stores","storeToRefs","useBopisStore","stores","computed","preselectedStore","ref","formRef","visible","loading","noStores","searched","searchAsyncMessage","isSTS","sts_enabled","isBopis","bopis_enabled","quantity","visibleStores","bopisStores","stsStores","store","showNoStoresMessage","searchValidation","setErrorMessage","code","_a","getStores","payload","storeCollection","res","_b","error","log","showSuccessToast","replaceAll","changeStore","background","unwatchVisibleStores","presetStore","watchImmediate","applyPreselectedStore","closeDialogs","searchByGeolocation","latitude","longitude","submit","onMounted","__expose"],"mappings":"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"}