{"version":3,"file":"SectionArticleList-BO2YoQkW.js","sources":["../../src/components/common/SectionArticleList.vue"],"sourcesContent":["<template>\n  <section :class=\"$style.section\">\n    <article v-for=\"(post, index) in postData\" :key=\"index\" :class=\"$style.listArticle\">\n      <router-link\n        :class=\"[$style.image, 'aspect-container']\"\n        :to=\"{\n          name: getPostType,\n          params: {\n            slug: post.slug,\n          },\n        }\"\n      >\n        <picture>\n          <img\n            v-if=\"post.featuredImage\"\n            :alt=\"post.featuredImage.node.altText\"\n            :src=\"proxySource(post.featuredImage.node.sourceUrl, 400)\"\n            :srcset=\"post.imageSrcset\"\n            class=\"aspect-image\"\n            loading=\"lazy\"\n            sizes=\"(min-width: 960px) 470px, 100vw\"\n          />\n        </picture>\n      </router-link>\n      <div :class=\"$style.info\">\n        <header>\n          <h2 class=\"heading-4\">\n            <router-link\n              :to=\"{\n                name: getPostType,\n                params: {\n                  slug: post.slug,\n                },\n              }\"\n              v-html=\"post.title\"\n            ></router-link>\n          </h2>\n          <time :datetime=\"post.date\" class=\"subtitle-2\">\n            {{ post.date }}\n          </time>\n        </header>\n        <section :class=\"$style.show\" v-html=\"post.excerpt\"></section>\n      </div>\n    </article>\n    <GuggenPagination\n      :current-page=\"page\"\n      :per-page=\"limit\"\n      :post-type=\"type\"\n      :total-page-count=\"totalPageCount\"\n    ></GuggenPagination>\n  </section>\n</template>\n\n<script setup lang=\"ts\">\nimport { computed } from 'vue';\nimport GuggenPagination from '@/components/GuggenPagination.vue';\nimport { PostArticle } from '@/types/postarticle.interface';\nimport { useImageProxy } from '@/composables/Common.js';\n\nconst props = defineProps<{\n  limit?: number;\n  page: number;\n  postData: PostArticle;\n  totalPageCount?: number;\n  type: string;\n}>();\n\nconst { proxySource } = useImageProxy();\n\nconst getPostType = computed(() => {\n  return `${props.type\n    .split('_')\n    .map((part) => part.charAt(0).toUpperCase() + part.slice(1))\n    .join('')}Post`;\n});\n</script>\n\n<style lang=\"scss\" module>\n.info {\n  a {\n    text-decoration: none;\n\n    &:hover {\n      text-decoration: underline;\n    }\n  }\n\n  h3 {\n    &.press {\n      margin-top: 0;\n    }\n  }\n\n  time {\n    @include space-12-16-above;\n\n    display: block;\n    line-height: 1.5rem;\n  }\n}\n\n.list-article {\n  @include space-36-48-above;\n\n  &:first-of-type {\n    margin-top: 0;\n  }\n}\n\n.show {\n  display: none;\n}\n\n@media (min-width: $break-point) {\n  .info {\n    h2 {\n      margin-top: 0;\n    }\n  }\n\n  .list-article {\n    @include grid;\n    grid-column: 1 / span 8;\n    grid-template-columns: repeat(8, 1fr);\n\n    a {\n      @include space-5-above;\n    }\n\n    > * {\n      grid-column: span 4;\n    }\n  }\n\n  .section {\n    @include grid;\n\n    nav {\n      grid-column: span 12;\n    }\n  }\n\n  .show {\n    display: block;\n  }\n}\n</style>\n"],"names":["props","__props","proxySource","useImageProxy","getPostType","computed","part"],"mappings":"mZA2DA,MAAMA,EAAQC,EAQR,CAAE,YAAAC,CAAY,EAAIC,EAAc,EAEhCC,EAAcC,EAAS,IACpB,GAAGL,EAAM,KACb,MAAM,GAAG,EACT,IAAKM,GAASA,EAAK,OAAO,CAAC,EAAE,cAAgBA,EAAK,MAAM,CAAC,CAAC,EAC1D,KAAK,EAAE,CAAC,MACZ"}