{"version":3,"file":"ArticleList.vue.9574fd2d.js","sources":["../../../../components/articles/ArticleListFeaturedItem.vue","../../../../components/articles/ArticleListItem.vue","../../../../components/feedback/Spinner.vue","../../../../components/articles/ArticleList.vue"],"sourcesContent":["<template>\n  <div\n    class=\"relative pb-32 pt-14 text-neutral-800 before:absolute before:-left-44 before:hidden before:h-full before:w-[calc(100%+200px)] lg:pb-32 lg:pt-16 lg:before:block lg:before:w-[calc(100%+300px)] 2xl:before:-left-80 2xl:before:w-[calc(100%+600px)] hd:before:-left-44 hd:before:w-[calc(100%+300px)]\"\n  >\n    <div class=\"grid-default gap-y-5 lg:items-center\">\n      <NuxtLink\n        v-if=\"data.image\"\n        :to=\"localePathByType(moduleType, data.slug as string)\"\n        class=\"col-span-12 lg:col-span-6\"\n      >\n        <div class=\"overflow-hidden rounded-[32px] lg:rounded-[40px]\">\n          <Image\n            v-if=\"data.image\"\n            class=\"aspect-4/3 rounded-[32px] object-cover !transition-all !duration-300 hover:scale-110 lg:rounded-[40px]\"\n            :src=\"data.image.responsiveImage ? data.image.responsiveImage?.src : data.image.url\"\n            :srcset=\"\n              data.image.responsiveImage ? data.image.responsiveImage?.webpSrcSet : undefined\n            \"\n            :width=\"912\"\n            :height=\"684\"\n            :alt=\"data.image.alt ? data.image.alt : ''\"\n          />\n        </div>\n      </NuxtLink>\n      <div class=\"relative z-10 col-span-12 lg:col-start-8 lg:col-end-13\">\n        <h1 v-if=\"data.title\" class=\"relative z-2 mb-4 text-3xl lg:mb-5 lg:text-5xl\">\n          {{ data.title }}\n        </h1>\n        <div\n          v-if=\"data.excerpt\"\n          class=\"prose relative z-2 mb-6 text-base lg:text-xl\"\n          v-html=\"data.excerpt\"\n        />\n        <Button\n          v-if=\"data.slug\"\n          :label=\"$t('more')\"\n          filled\n          :size=\"isLG ? 'large' : 'medium'\"\n          :to=\"localePathByType(moduleType, data.slug as string)\"\n          theme=\"dark\"\n        />\n      </div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { theme } from '#tailwind-config'\n\nconst { localePathByType } = useLocalePathByType()\nconst breakpoints = useBreakpoints(theme.screens)\nconst isLG = breakpoints.greater('lg')\n\nconst props = defineProps({\n  data: {\n    type: Object,\n    default: () => {}\n  },\n  typeName: {\n    type: String,\n    default: 'SectionArticleListRecord'\n  }\n})\n\nconst moduleType = computed(() =>\n  props.typeName === 'SectionArticleListRecord' ? 'ArticleRecord' : 'ProjectRecord'\n)\n</script>\n","<template>\n  <div class=\"col-span-12 lg:col-span-4\" :class=\"isRelatedArticle && 'flex gap-4 md:block'\">\n    <NuxtLink\n      class=\"relative block w-full basis-1/2\"\n      :to=\"localePathByType(moduleType, data.slug)\"\n      noPrefetch\n    >\n      <div\n        v-if=\"isRelatedArticle\"\n        class=\"absolute left-6 top-6 z-2 transform-gpu text-2xl lg:text-4xl\"\n        :class=\"[\n          index % 2 !== 0 ? 'text-white' : 'text-neutral-900',\n          isRelatedArticle && 'basis-1/2'\n        ]\"\n      >\n        0{{ index + 1 }}\n      </div>\n\n      <div class=\"overflow-hidden rounded-[40px]\">\n        <Image\n          v-if=\"data.image\"\n          loading=\"lazy\"\n          class=\"rounded-[40px] object-cover !transition-all !duration-300 hover:scale-110\"\n          :class=\"isRelatedArticle ? 'aspect-square' : 'aspect-4/3'\"\n          sizes=\"(min-width: 1920px) 597px, (min-width: 1400px) 405px, (min-width: 1040px) calc(26.47vw + 40px), calc(50vw - 24px)\"\n          :src=\"data.image.responsiveImage ? data.image.responsiveImage?.src : data.image.url\"\n          :srcset=\"data.image.responsiveImage ? data.image.responsiveImage?.webpSrcSet : undefined\"\n          :width=\"data.image.responsiveImage ? data.image.responsiveImage.width : data.image.width\"\n          :height=\"\n            data.image.responsiveImage ? data.image.responsiveImage.height : data.image.height\n          \"\n          :alt=\"data.image.alt ? data.image.alt : ''\"\n        />\n      </div>\n    </NuxtLink>\n\n    <NuxtLink\n      :to=\"localePathByType(moduleType, data.slug)\"\n      class=\"block text-xl text-neutral-800 lg:my-7 lg:text-2xl\"\n      :class=\"isRelatedArticle ? 'my-0 basis-1/2 md:mb-4 md:mt-5' : 'mb-4 mt-5'\"\n      noPrefetch\n      >{{ data.title }}</NuxtLink\n    >\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nconst { localePathByType } = useLocalePathByType()\n\nconst props = defineProps({\n  data: {\n    type: Object,\n    default: () => {}\n  },\n  index: {\n    type: Number,\n    required: true\n  },\n  isRelatedArticle: {\n    type: Boolean,\n    default: false\n  },\n  typeName: {\n    type: String,\n    default: 'SectionArticleListRecord'\n  }\n})\n\nconst moduleType = computed(() =>\n  props.typeName === 'SectionArticleListRecord' ? 'ArticleRecord' : 'ProjectRecord'\n)\n</script>\n","<template>\n  <svg class=\"animate-spin\" width=\"42\" height=\"42\" viewBox=\"0 0 42 42\" fill=\"none\">\n    <path\n      d=\"M36.75 32.0709C34.1072 35.8317 30.2061 38.5226 25.7519 39.6573C21.2977 40.7919 16.5845 40.2953 12.4646 38.2573C8.34475 36.2192 5.09007 32.7743 3.28914 28.5454C1.4882 24.3164 1.25988 19.5827 2.64547 15.2001C4.03106 10.8175 6.93908 7.0753 10.8437 4.65023C14.7483 2.22516 19.3918 1.27727 23.9345 1.97796C28.4772 2.67866 32.6193 4.98168 35.6117 8.4706C38.6041 11.9595 40.2494 16.404 40.25 21.0004\"\n      stroke=\"#D70036\"\n      stroke-width=\"2\"\n      stroke-linecap=\"square\"\n      stroke-linejoin=\"round\"\n    />\n  </svg>\n</template>\n","<template>\n  <div>\n    <div class=\"grid grid-cols-12 gap-4 lg:gap-8\">\n      <template v-for=\"(_, idx) in data\" :key=\"idx\">\n        <ArticleListFeaturedItem\n          v-if=\"showFeatured && Number(idx) === 0 && typeName === 'SectionArticleListRecord'\"\n          :data=\"getExposedArticle()\"\n          :class=\"'col-span-12 mb-10 lg:col-span-12 lg:mb-16'\"\n          :type-name=\"typeName\"\n        />\n      </template>\n\n      <template v-for=\"(item, index) in data\" :key=\"item.id\">\n        <ArticleListItem\n          v-if=\"item?.id !== exposedArticleRef?.id && typeName === 'SectionArticleListRecord'\"\n          :data=\"item\"\n          :index=\"index\"\n          :is-related-article=\"isRelatedArticle\"\n          class=\"col-span-12 md:col-span-6 lg:col-span-4\"\n          :type-name=\"typeName\"\n        />\n\n        <ProjectListItem\n          v-if=\"item?.id !== exposedArticleRef?.id && typeName === 'SectionProjectListRecord'\"\n          :data=\"item\"\n          :index=\"index\"\n          :is-related-article=\"isRelatedArticle\"\n          class=\"col-span-12 md:col-span-6 lg:col-span-4\"\n          :type-name=\"typeName\"\n        />\n      </template>\n    </div>\n\n    <div v-if=\"isLoading\" class=\"py-10 text-center\">\n      <Spinner class=\"mx-auto mt-10\" />\n    </div>\n\n    <div v-else-if=\"loadMore\" class=\"text-center\">\n      <hr class=\"text-neutral-100 my-14\" />\n      <Button\n        size=\"large\"\n        variant=\"secondary\"\n        :label=\"$t('articles.more')\"\n        @click=\"store.fetchArticles(locale, categoryID)\"\n      />\n    </div>\n\n    <div v-else-if=\"isEmpty\">\n      <div class=\"my-10 text-center text-4xl\">{{ $t('articles.empty') }}</div>\n    </div>\n  </div>\n</template>\n\n<script setup lang=\"ts\">\nimport { useBlogStore } from '~/stores/BlogStore'\nimport { useProjectStore } from '~/stores/ProjectStore'\n\nenum TYPE_NAMES {\n  PROJECT_LIST = 'SectionProjectListRecord',\n  ARTICLE_LIST = 'SectionArticleListRecord'\n}\n\nconst { locale } = useI18n()\nconst route = useRoute()\n\nconst props = defineProps({\n  data: {\n    type: Object,\n    default: () => {}\n  },\n  isLoading: {\n    type: Boolean,\n    default: false\n  },\n  loadMore: {\n    type: Boolean,\n    default: false\n  },\n  isEmpty: {\n    type: Boolean,\n    default: false\n  },\n  showFeatured: {\n    type: Boolean,\n    default: false\n  },\n  isRelatedArticle: {\n    type: Boolean,\n    default: false\n  },\n  typeName: {\n    type: String,\n    default: 'SectionArticleListRecord'\n  }\n})\n\n// Dynamic store usage based on module type\nconst store = TYPE_NAMES.PROJECT_LIST === props.typeName ? useProjectStore() : useBlogStore()\nconst categoryID = computed(() => store.getCategoryByName(route.query.category)?.id)\n\nconst { data: exposedArticles } = await useAsyncGql('exposedArticles', {\n  // @ts-ignore\n  options: {\n    initialCache: false\n  }\n})\n\nconst allExposedArticles = computed(() => exposedArticles.value?.allExposedArticles)\n\nconst commonExposedArticle = computed(\n  () => allExposedArticles.value?.find(article => !article?.category)\n)\nconst categoryExposedAvailable = computed(\n  () =>\n    allExposedArticles.value?.find(\n      article => article.category && article.category?.name === route.query.category\n    )\n)\nconst allArticlesExposed = computed(() => route.params.slug === 'news' && !route.query.category)\nconst slugArticlesExposed = computed(\n  () =>\n    allExposedArticles.value?.find(article =>\n      route.params.slug.includes(article.category?.name?.toLowerCase() as string)\n    )\n)\nconst exposedArticleRef = ref()\n\nfunction getExposedArticle() {\n  let exposedArticle = props.data[0]\n\n  if (categoryExposedAvailable.value) {\n    exposedArticle = categoryExposedAvailable.value.article\n  } else if (commonExposedArticle.value && allArticlesExposed.value) {\n    exposedArticle = commonExposedArticle.value.article\n  } else if (slugArticlesExposed.value) {\n    exposedArticle = slugArticlesExposed.value.article\n  }\n\n  exposedArticleRef.value = exposedArticle\n\n  return exposedArticle\n}\n</script>\n"],"names":["localePathByType","useLocalePathByType","isLG","useBreakpoints","theme","props","__props","moduleType","computed","_hoisted_1","_hoisted_2","_createElementVNode","_hoisted_3","_sfc_render","_ctx","_cache","locale","useI18n","route","useRoute","store","useProjectStore","useBlogStore","categoryID","_a","exposedArticles","__temp","__restore","_withAsyncContext","useAsyncGql","allExposedArticles","commonExposedArticle","article","categoryExposedAvailable","allArticlesExposed","slugArticlesExposed","_b","exposedArticleRef","ref","getExposedArticle","exposedArticle"],"mappings":"miCAiDM,KAAA,CAAE,iBAAAA,GAAqBC,IAEvBC,EADcC,GAAeC,GAAM,OAAO,EACvB,QAAQ,IAAI,EAE/BC,EAAQC,EAWRC,EAAaC,EAAS,IAC1BH,EAAM,WAAa,2BAA6B,gBAAkB,eAAA,qyCClB9D,KAAA,CAAE,iBAAAL,GAAqBC,IAEvBI,EAAQC,EAmBRC,EAAaC,EAAS,IAC1BH,EAAM,WAAa,2BAA6B,gBAAkB,eAAA,8kHCpE7DI,GAAoB,CAAC,MAAM,eAAK,WAAY,YAAoB,QAAW,yBAEgUC,GAAAC,EAAA,OAAA,CAC5Y,EAAA,2YACA,OAAA,UACA,eAAc,IACd,8DACAC,GAAA,KAPJ,SAAAC,GAAAC,EAAAC,EAAA,omBC6DI,KAAA,CAAE,OAAAC,GAAWC,IACbC,EAAQC,IAERd,EAAQC,EAgCRc,EAAoCf,EAAM,WAAlC,2BAA6CgB,EAAA,EAAoBC,IACzEC,EAAaf,EAAS,IAAA,OAAM,OAAAgB,EAAAJ,EAAM,kBAAkBF,EAAM,MAAM,QAAQ,IAA5C,YAAAM,EAA+C,GAAE,EAE7E,CAAE,KAAMC,CAAA,GAAoB,CAAAC,EAAAC,CAAA,EAAAC,EAAA,IAAMC,EAAY,kBAAmB,CAErE,QAAS,CACP,aAAc,EAChB,CAAA,CACD,CAAA,mBAEKC,EAAqBtB,EAAS,IAAA,OAAM,OAAAgB,EAAAC,EAAgB,QAAhB,YAAAD,EAAuB,mBAAkB,EAE7EO,EAAuBvB,EAC3B,IAAM,OAAA,OAAAgB,EAAAM,EAAmB,QAAnB,YAAAN,EAA0B,KAAgBQ,GAAA,EAACA,GAAA,MAAAA,EAAS,WAAQ,EAE9DC,EAA2BzB,EAC/B,IACE,OAAA,OAAAgB,EAAAM,EAAmB,QAAnB,YAAAN,EAA0B,eACb,OAAAQ,EAAQ,YAAYR,EAAAQ,EAAQ,WAAR,YAAAR,EAAkB,QAASN,EAAM,MAAM,WACxE,EAEEgB,EAAqB1B,EAAS,IAAMU,EAAM,OAAO,OAAS,QAAU,CAACA,EAAM,MAAM,QAAQ,EACzFiB,EAAsB3B,EAC1B,IACE,OAAA,OAAAgB,EAAAM,EAAmB,QAAnB,YAAAN,EAA0B,KAAKQ,GAAA,SAC7B,OAAAd,EAAM,OAAO,KAAK,UAASkB,GAAAZ,EAAAQ,EAAQ,WAAR,YAAAR,EAAkB,OAAlB,YAAAY,EAAwB,aAAuB,IAC5E,EAEEC,EAAoBC,IAE1B,SAASC,GAAoB,CACvB,IAAAC,EAAiBnC,EAAM,KAAK,CAAC,EAEjC,OAAI4B,EAAyB,MAC3BO,EAAiBP,EAAyB,MAAM,QACvCF,EAAqB,OAASG,EAAmB,MAC1DM,EAAiBT,EAAqB,MAAM,QACnCI,EAAoB,QAC7BK,EAAiBL,EAAoB,MAAM,SAG7CE,EAAkB,MAAQG,EAEnBA,CACT"}