{"version":3,"file":"C9ZBhyoz.js","sources":["../../../../components/organisms/MapWithInfo.vue"],"sourcesContent":["<template>\n  <div\n    id=\"map-with-info\"\n    :class=\"[\n      'container-' + organism.containerWidth,\n      organism.removeMargin,\n      organism.hideInfo ? 'hide-info' : '',\n      'bg-bc-gray organism map-with-info isolate',\n    ]\"\n  >\n    <header class=\"px-8 pt-14 pb-[69px] -mb-[25px]\">\n      <h2\n        class=\"text-3xl sm:text-[44px] font-archer text-white font-semibold text-center m-0 leading-none\"\n      >\n        {{ organism.title1 }}\n      </h2>\n    </header>\n    <div class=\"relative pointer-events-none min-h-[600px]\">\n      <div\n        id=\"map-wrap\"\n        class=\"absolute top-0 left-0 hidden w-full h-full sm:block -z-10 isolate\"\n      >\n        <div id=\"map\" class=\"w-full h-full pointer-events-auto\"></div>\n      </div>\n      <div v-if=\"!organism.hideInfo\" class=\"grid grid-cols-1 sm:grid-cols-2\">\n        <div\n          class=\"bg-white p-8 max-w-[366px] mr-auto sm:mr-0 ml-auto my-8 sm:my-16 pointer-events-auto\"\n        >\n          <div class=\"mb-4\">\n            <h3 class=\"text-lg font-bold font-arial\">Address</h3>\n            <NuxtLink\n              :to=\"\n                'https://www.google.com/maps/place/' +\n                organism.latitude +\n                ',' +\n                organism.longitude\n              \"\n              target=\"_blank\"\n              class=\"block underline text-bc-dark-blue\"\n            >\n              <span>{{ organism.address1 }}<br /></span>\n              <span v-if=\"organism.address2\"\n                >{{ organism.address2 }}<br\n              /></span>\n              <span v-else>\n                <span v-if=\"organism.city\">{{ organism.city }},&nbsp;</span\n                ><span v-if=\"organism.state\">{{ organism.state }}&nbsp;</span\n                ><span v-if=\"organism.zip\">{{ organism.zip }}</span>\n              </span>\n            </NuxtLink>\n          </div>\n          <div v-if=\"organism.hours\" class=\"mb-4\">\n            <h3 class=\"text-lg font-bold font-arial\">Hours</h3>\n            <div v-html=\"organism.hours\"></div>\n          </div>\n          <div v-if=\"organism.phone\" class=\"mb-4\">\n            <h3 class=\"text-lg font-bold font-arial\">Phone</h3>\n            <NuxtLink\n              :to=\"'tel:' + organism.phone\"\n              class=\"underline text-bc-dark-blue\"\n              >{{ organism.phone }}</NuxtLink\n            >\n          </div>\n          <div v-if=\"organism.salesTeamMembers\" class=\"mb-4\">\n            <h3 class=\"text-lg font-bold font-arial\">Sales Team</h3>\n            <ul\n              class=\"flex flex-wrap items-center justify-center text-center gap-4\"\n            >\n              <li v-for=\"member in organism.salesTeamMembers\">\n                <img\n                  :src=\"getImageSrc(member.image, 'thumbnail')\"\n                  :alt=\"member.name\"\n                  class=\"w-[88px] aspect-square rounded-full mb-2\"\n                />\n                <h4>{{ member.name }}</h4>\n              </li>\n            </ul>\n          </div>\n          <NuxtLink\n            :to=\"\n              'https://www.google.com/maps/place/' +\n              organism.latitude +\n              ',' +\n              organism.longitude\n            \"\n            target=\"_blank\"\n            class=\"block py-3 mb-4 font-semibold text-center text-white px-7 bg-bc-blue\"\n          >\n            Get Directions\n          </NuxtLink>\n          <div class=\"text-[11px] text-gray-400\">{{ organism.legal }}</div>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<style>\n.map-with-info {\n  header {\n    background-image: linear-gradient(101deg, #367ea0 0%, #4dadce 97%);\n    clip-path: polygon(\n      0 0,\n      100% 0,\n      100% calc(100% - 25px),\n      calc(50% - 25px) calc(100% - 25px),\n      50% 100%,\n      calc(50% + 25px) calc(100% - 25px),\n      0 calc(100% - 25px)\n    );\n  }\n\n  &.hide-info {\n    #map-wrap {\n      @apply !block;\n    }\n  }\n}\n</style>\n\n<script setup>\nimport { storeToRefs } from \"pinia\";\nconst overview = useOverview();\nconst { mapInfo } = storeToRefs(overview);\n\nconst props = defineProps({\n  organism: Object,\n});\n\nonMounted(() => {\n  loadMapWithInfoMap();\n  if (props.organism.containerWidth === \"full-width\") {\n    addFullWidthSupport();\n  }\n\n  if (props.organism.mapWithInfoMapType === \"all-neighborhoods\") {\n    loadNeighborhoodsMap();\n  } else {\n    updateMapWithInfoMap(\n      props.organism.latitude,\n      props.organism.longitude,\n      props.organism.markerTitle\n    );\n  }\n});\n\nonUpdated(() => {\n  if (props.organism.mapWithInfoMapType !== \"all-neighborhoods\") {\n    updateMapWithInfoMap(\n      props.organism.latitude,\n      props.organism.longitude,\n      props.organism.markerTitle\n    );\n  }\n});\n\nwatch(mapInfo, () => {\n  if (props.organism.mapWithInfoMapType === \"all-neighborhoods\") {\n    const offsetX = props.organism.hideInfo ? 0 : 250;\n    updateNeighborhoodsMap(mapInfo, offsetX);\n  }\n  // } else {\n  //   updateNeighborhoodsMap(mapInfo, 250);\n  // }\n});\n</script>\n"],"names":["overview","useOverview","mapInfo","storeToRefs","props","__props","onMounted","loadMapWithInfoMap","addFullWidthSupport","loadNeighborhoodsMap","updateMapWithInfoMap","onUpdated","watch","offsetX","updateNeighborhoodsMap"],"mappings":"wqDA0HA,MAAMA,EAAWC,EAAW,EACtB,CAAE,QAAAC,CAAS,EAAGC,EAAYH,CAAQ,EAElCI,EAAQC,EAId,OAAAC,EAAU,IAAM,CACdC,IACIH,EAAM,SAAS,iBAAmB,cACpCI,IAGEJ,EAAM,SAAS,qBAAuB,oBACxCK,IAEAC,EACEN,EAAM,SAAS,SACfA,EAAM,SAAS,UACfA,EAAM,SAAS,WACrB,CAEA,CAAC,EAEDO,EAAU,IAAM,CACVP,EAAM,SAAS,qBAAuB,qBACxCM,EACEN,EAAM,SAAS,SACfA,EAAM,SAAS,UACfA,EAAM,SAAS,WACrB,CAEA,CAAC,EAEDQ,EAAMV,EAAS,IAAM,CACnB,GAAIE,EAAM,SAAS,qBAAuB,oBAAqB,CAC7D,MAAMS,EAAUT,EAAM,SAAS,SAAW,EAAI,IAC9CU,EAAuBZ,EAASW,CAAO,CACxC,CAIH,CAAC"}