{"version":3,"file":"Country-BCqOfZ2W.js","sources":["../../../app/javascript/src/components/Theme/Rating.vue","../../../app/assets/images/heroDashboard/question.svg","../../../app/assets/images/pages/trip-vibe-crew.png","../../../app/javascript/src/metaInfo.js","../../../app/javascript/src/utils/countryUtils.js","../../../app/assets/images/heroDashboard/check.svg","../../../app/javascript/src/stores/planTrip.js","../../../app/javascript/src/modules/ExploreDestinations/Country.vue"],"sourcesContent":["<template>\n  <div class=\"theme-rating\">\n    <i class=\"icon icon-star icon-star__marked\" v-for=\"i in value\" :key=\"i\" />\n    <i class=\"icon icon-star icon-star__hidden\" v-for=\"i in remaining\" :key=\"i\" />\n  </div>\n</template>\n\n<script setup>\nimport { computed } from \"vue\";\n\nconst props = defineProps({\n  value: Number,\n  max: {type: Number, default: 0}\n});\n\nconst remaining = computed(() => Math.max(props.max - props.value, 0));\n</script>\n\n<style lang=\"scss\" scoped>\n.theme-rating {\n  display: flex;\n  gap: 6px;\n\n  .icon-star {\n    font-size: 19px;\n    color: $gray;\n\n    &__marked {\n      color: $yellow;\n    }\n    &__hidden {\n      visibility: hidden;\n    }\n  }\n}\n\n</style>\n","export default \"data:image/svg+xml,%3csvg%20width='12'%20height='21'%20viewBox='0%200%2012%2021'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M1.5625%206.06165C1.56266%205.24815%201.78643%204.45035%202.20937%203.75544C2.63231%203.06052%203.23814%202.49525%203.96064%202.12138C4.68314%201.74752%205.49451%201.57946%206.30608%201.63557C7.11764%201.69168%207.89816%201.9698%208.56234%202.43954C9.22651%202.90928%209.74878%203.55256%2010.0721%204.29906C10.3953%205.04557%2010.5072%205.86658%2010.3954%206.67236C10.2836%207.47814%209.95244%208.23768%209.43813%208.86798C8.92382%209.49827%208.24614%209.97505%207.47917%2010.2462C7.04639%2010.3992%206.67173%2010.6827%206.40681%2011.0576C6.14189%2011.4324%205.99976%2011.8802%206%2012.3392V13.8273'%20stroke='%231C355E'%20stroke-width='2.21875'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M6%2018.2656C5.89029%2018.2656%205.78305%2018.2982%205.69183%2018.3591C5.60061%2018.4201%205.52952%2018.5067%205.48754%2018.608C5.44555%2018.7094%205.43457%2018.8209%205.45597%2018.9285C5.47737%2019.0361%205.5302%2019.135%205.60778%2019.2125C5.68535%2019.2901%205.78419%2019.3429%205.89179%2019.3643C5.99938%2019.3857%206.11091%2019.3748%206.21227%2019.3328C6.31362%2019.2908%206.40026%2019.2197%206.46121%2019.1285C6.52216%2019.0373%206.55469%2018.93%206.55469%2018.8203C6.55469%2018.6732%206.49625%2018.5321%206.39222%2018.4281C6.2882%2018.3241%206.14711%2018.2656%206%2018.2656Z'%20fill='%231C355E'%20stroke='%231C355E'%20stroke-width='2.21875'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/svg%3e\"","export default \"__VITE_ASSET__DyzPN9rp__\"","import tripViteCrew from 'app/assets/images/pages/trip-vibe-crew.png';\n\nconst tripVibeCrewOg = [\n  { property: 'og:image', content: tripViteCrew },\n  { property: 'og:image:alt', content: 'Your trip, your vibe, your crew | TourHero' }\n];\n\nexport default {\n  Home: {\n    title: 'Dashboard Home',\n    meta: [\n      { name: 'description', content: 'TourHero is a social travel platform that enables you to travel with with like-minded individuals.' },\n      ...tripVibeCrewOg\n    ]\n  },\n  VerifyEmail: {\n    title: 'Verify Your Email',\n    meta: [\n      { name: 'description', content: 'Verify your email address to continue your access in TourHero' },\n      ...tripVibeCrewOg\n    ]\n  },\n  PlanTrip: {\n    title: 'Plan a Trip',\n    meta: [\n      { name: 'description', content: 'Plan a trip with TourHero' },\n      ...tripVibeCrewOg\n    ]\n  },\n  TripDetail: {\n    title: 'Your TourHero Trips',\n    meta: [\n      { name: 'description', content: 'Get excited with your upcoming trips with TourHero!' },\n      ...tripVibeCrewOg\n    ]\n  },\n  ExploreDestinations: {\n    title: 'Explore the best travel destinations',\n    meta: [\n      { name: 'description', content: 'Explore the best travel destinations with TourHero. See the best things to do, the best time to travel and popular travel spots in the destinations' },\n      ...tripVibeCrewOg\n    ]\n  },\n  ProfileSetup: {\n    title: 'Setup Your Profile',\n    meta: [\n      { name: 'description', content: 'Setup your profile on TourHero' },\n      ...tripVibeCrewOg\n    ]\n  },\n  createItineraryDate: (countryName) => {\n    return {\n      title: `Travel Date to Create Itinerary in ${countryName}`,\n      meta: [\n        { name: 'description', content: `Tell us your preferred travel date for ${countryName}` },\n        ...tripVibeCrewOg\n      ]\n    }\n  },\n  createItineraryBudget: (countryName) => {\n    return {\n      title: `Budget to Create Itinerary in ${countryName}`,\n      meta: [\n        { name: 'description', content: `Tell us your budget for ${countryName}` },\n        ...tripVibeCrewOg\n      ]\n    }\n  },\n  createItineraryVibes: (countryName) => {\n    return {\n      title: `Vibes to Create Itinerary in ${countryName}`,\n      meta: [\n        { name: 'description', content: `Tell us the vibe you like for ${countryName}` },\n        ...tripVibeCrewOg\n      ]\n    }\n  },\n  createItineraryActivities: (countryName) => {\n    return {\n      title: `Activities to Create Itinerary in ${countryName}`,\n      meta: [\n        { name: 'description', content: `Tell us your preferred activities for ${countryName}` },\n        ...tripVibeCrewOg\n      ]\n    }\n  },\n  createItinerarySuccess: (countryName) => {\n    return {\n      title: `Create itinerary in ${countryName} success`,\n      meta: [\n        { name: 'description', content: `You have successfully created your ${countryName} itinerary with TourHero` },\n        ...tripVibeCrewOg\n      ]\n    }\n  },\n};\n","export const dasherize = value => value.normalize('NFD').replace(/[\\u0300-\\u036f]/g, '').toLowerCase().replace(/ /g, '-').replace(/[^0-9a-z\\-]/g, '');\n","export default \"data:image/svg+xml,%3csvg%20width='16'%20height='17'%20viewBox='0%200%2016%2017'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cg%20clip-path='url(%23clip0_4026_1509)'%3e%3cpath%20d='M8%2015.999C12.1421%2015.999%2015.5%2012.6412%2015.5%208.49902C15.5%204.35689%2012.1421%200.999023%208%200.999023C3.85786%200.999023%200.5%204.35689%200.5%208.49902C0.5%2012.6412%203.85786%2015.999%208%2015.999Z'%20fill='%23307582'%20stroke='%23307582'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3cpath%20d='M4%209.31509L5.63333%2011.6331C5.69529%2011.7256%205.77845%2011.802%205.8759%2011.856C5.97335%2011.9099%206.08226%2011.9397%206.19358%2011.9431C6.3049%2011.9464%206.4154%2011.9231%206.5159%2011.8751C6.61639%2011.8271%206.70396%2011.7558%206.77133%2011.6671L12%205.05176'%20stroke='white'%20stroke-linecap='round'%20stroke-linejoin='round'/%3e%3c/g%3e%3cdefs%3e%3cclipPath%20id='clip0_4026_1509'%3e%3crect%20width='16'%20height='16'%20fill='white'%20transform='translate(0%200.5)'/%3e%3c/clipPath%3e%3c/defs%3e%3c/svg%3e\"","import { defineStore } from \"pinia\";\nimport { apiFetchContinents, apiFetchCountries } from \"@/utils/http\";\nconst createFilters = () => ({\n  continents: [],\n  vibes: [],\n  budget: null\n});\nexport const usePlanTripStore = defineStore('plan-trip', {\n  state: () => ({\n    compares: [],\n    countries: [],\n    continents: [],\n    loading: false,\n    filters: createFilters(),\n  }),\n\n  actions: {\n    async loadContinents() {\n      this.continents = await apiFetchContinents();\n    },\n    async searchCountries() {\n      this.loading = true;\n      this.countries = await apiFetchCountries(this.filters);\n      this.loading = false;\n    },\n    clearFilters() {\n      this.filters = createFilters();\n    }\n  }\n})","<template>\n  <div class=\"explore-destinations-country\" @click=\"evt => emit('click', evt)\">\n    <a :href=\"countryLink\">\n      <div class=\"explore-destinations-country__image\">\n        <img :src=\"imageUrl\" v-if=\"imageUrl\" alt=\"Feature image\" />\n      </div>\n    </a>\n    <div class=\"explore-destinations-country__body\">\n      <H4 class=\"explore-destinations-country__name\">\n        <a :href=\"countryLink\">\n          <Country :code=\"country.countryCode\" :name=\"country.name\" />\n        </a>\n        <div v-if=\"comparable\" class=\"explore-destinations-country__option\" @click=\"selectCountry()\">\n          <img\n            v-if=\"isSelected\"\n            class=\"explore-destinations-country__option-on\"\n            :src=\"checkSvg\"\n          />\n          <div v-else class=\"explore-destinations-country__option-check explore-destinations-country__option-off\" />\n          <div class=\"explore-destinations-country__option-label\">\n            Add to compare\n          </div>\n        </div>\n      </H4>\n      <a :href=\"countryLink\">\n        <div class=\"explore-destinations-country__facts\">\n          <div class=\"explore-destinations-country__facts-column\">\n            <div v-if=\"country.price.cents > 0\" class=\"explore-destinations-country__fact\">\n              <div class=\"explore-destinations-country__fact-label\">\n                {{ t('from') }}\n              </div>\n              <div class=\"explore-destinations-country__fact-value\">\n                <Money :value=\"country.price.cents\" :currency=\"country.price.currencyIso\" />\n              </div>\n            </div>\n            <div class=\"explore-destinations-country__fact\">\n              <div class=\"explore-destinations-country__fact-label\">\n                {{ t('weather') }}\n              </div>\n              <div class=\"explore-destinations-country__fact-value\">\n                {{ country.minTemperature }}-{{country.maxTemperature}}°F\n              </div>\n            </div>\n          </div>\n          <slot name=\"rightColumn\" />\n          <div v-if=\"!$slots.rightColumn\" class=\"explore-destinations-country__facts-column\">\n            <div class=\"explore-destinations-country__fact\">\n              <div class=\"explore-destinations-country__fact-label\">\n                {{ t('nature') }}\n              </div>\n              <div class=\"explore-destinations-country__fact-value\">\n                <Rating :value=\"country.nature\" :max=\"5\" />\n              </div>\n            </div>\n            <div class=\"explore-destinations-country__fact\">\n              <div class=\"explore-destinations-country__fact-label\">\n                {{ t('safety') }}\n              </div>\n              <div class=\"explore-destinations-country__fact-value\">\n                {{ country.safety }}\n              </div>\n            </div>\n          </div>\n        </div>\n      </a>\n    </div>\n  </div>\n</template>\n\n<script setup>\nimport { Country, H4, Rating } from '@/components/Theme';\nimport Money from '@/components/Money.vue';\nimport { dasherize } from '@/utils/countryUtils.js';\nimport checkSvg from 'app/assets/images/heroDashboard/check.svg';\nimport { usePlanTripStore } from \"@/stores/planTrip\";\nimport { computed } from \"vue\";\nimport { storeToRefs } from \"pinia\";\nimport { useShared } from \"@/helpers/vueHelpers.js\";\n\nconst { t } = useShared();\nconst store = usePlanTripStore();\nconst { compares } = storeToRefs(store);\nconst { country, comparable, clickable } = defineProps({\n  country: { type: Object, required: true },\n  comparable: { type: Boolean, default: true },\n  clickable: { type: Boolean, default: true }\n});\nconst emit = defineEmits(['click']);\n\nconst imageUrl = computed(() => country.featureImages[0]?.url);\nconst countryLink = computed(() => clickable ? `/en/country/${dasherize(country.name)}` : {});\nconst isSelected = computed(() => compares.value.find(x => x.countryCode === country.countryCode && x.name === country.name));\n\nfunction selectCountry() {\n  if (isSelected.value) {\n    const _countries = store.compares.filter(item => {\n      return item.countryCode !== country.countryCode && item.name !== country.name;\n    });\n    store.compares = [];\n    _countries.map(item => {\n      store.compares.push(item);\n    });\n  }\n  else if (store.compares.length < 3) {\n    store.compares.push(country)\n  }\n}\n</script>\n\n<style lang=\"scss\" scoped>\n$line-height: 22px;\n\n.explore-destinations-country {\n  border: 1px solid $gray-lighter;\n  border-radius: $spacing-1;\n  overflow: hidden;\n  display: block;\n}\n.explore-destinations-country__image {\n  position: relative;\n  padding-top: 56.27%; /* 327 x 184 */\n  img {\n    position: absolute;\n    top: 0;\n    left: 0;\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n  }\n}\n.explore-destinations-country__body {\n  padding: $spacing-3;\n}\n.explore-destinations-country__facts {\n  margin-top: $spacing-3;\n  display: flex;\n  justify-content: space-between;\n  row-gap: $spacing-1;\n  flex-wrap: wrap;\n  font-size: $text-sm;\n\n  &:deep(.theme-rating) {\n    font-size: $text-sm;\n    gap: 2px;\n  }\n  &:deep(.icon-star) {\n    font-size: $text-sm;\n  }\n}\n.explore-destinations-country__facts-column {\n  @include flex-column($spacing-1);\n}\n.explore-destinations-country__fact {\n  display: flex;\n  gap: $spacing-2;\n}\n.explore-destinations-country__fact-label {\n  width: $spacing-16;\n  color: $gray;\n}\n.explore-destinations-country__name {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n}\n.explore-destinations-country__option {\n  display: flex;\n  gap: $spacing-2;\n  cursor: pointer;\n}\n.explore-destinations-country__option-check {\n  position: relative;\n  margin-top: auto;\n  margin-bottom: auto;\n  width: $spacing-4;\n  height: $spacing-4;\n  @media (min-width: $breakpoint-m) {\n    width: $spacing-5;\n    height: $spacing-5;\n  }\n  border-radius: 100%;\n  border: 1px solid $brand-tertiary;\n  box-sizing: border-box;\n  flex-shrink: 0;\n}\n.explore-destinations-country__option-on {\n  width: $spacing-4;\n  height: $spacing-4;\n  @media (min-width: $breakpoint-m) {\n    width: $spacing-5;\n    height: $spacing-5;\n  }\n  margin-top: auto;\n  margin-bottom: auto;\n}\n.explore-destinations-country__option-off {\n  background: $white;\n}\n.explore-destinations-country__option-label {\n  margin-top: auto;\n  margin-bottom: auto;\n  font-size: $text-sm;\n  font-weight: $font-semibold;\n  line-height: $line-height;\n  @media (min-width: $breakpoint-m) {\n    font-size: $text-base;\n    font-weight: $font-semibold;\n  }\n}\n</style>\n\n<i18n lang=\"yaml\">\nen:\n  from: From\n  nature: Nature\n  weather: Weather\n  safety: Safety\n</i18n>\n"],"names":["props","__props","remaining","computed","question","tripViteCrew","tripVibeCrewOg","meta","countryName","dasherize","value","checkSvg","createFilters","usePlanTripStore","defineStore","apiFetchContinents","apiFetchCountries","t","useShared","store","compares","storeToRefs","emit","__emit","imageUrl","_a","countryLink","isSelected","x","selectCountry","_countries","item"],"mappings":"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"}