{"version":3,"file":"BreadcrumbNavigation-0bfe6bf1.js","sources":["../../../app/frontend/components/_core/BreadcrumbNavigation.vue"],"sourcesContent":["<script lang=\"ts\">\nimport { defineComponent, PropType } from 'vue'\n\nexport default defineComponent({\n  name: 'BreadcrumbNavigation',\n\n  props: {\n    items: {\n      type: Array as PropType<Record<'label' | 'to', string>[]>,\n      required: true,\n    },\n  },\n\n  setup(props) {\n    /**\n     * 指定されたパンくずアイテムが現在ページかどうか\n     * @param index パンくずアイテムの判定対象の index\n     */\n    const isCurrent = (index: number): boolean => {\n      return index === (props.items.length - 1)\n    }\n\n    return {\n      // methods\n      isCurrent,\n    }\n  },\n})\n</script>\n\n<template>\n  <nav class=\"o-list__breadcrumb\">\n    <ol class=\"o-list__breadcrumb--items\">\n      <li\n        v-for=\"(item, index) in items\"\n        :key=\"index\"\n        :class=\"[\n          'o-list__breadcrumb--item',\n          { 'is-current': isCurrent(index) },\n        ]\">\n        <template v-if=\"isCurrent(index)\">\n          {{ item.label }}\n        </template>\n        <template v-else>\n          <div class=\"o-action__breadcrumb\">\n            <a\n              class=\"o-action__breadcrumb--item\"\n              :href=\"item.to\">\n              {{ item.label }}\n            </a>\n          <!-- /.o-action__breadcrumb --></div>\n        </template>\n      </li>\n    </ol>\n  <!-- /.o-list__breadcrumb --></nav>\n</template>\n\n<style lang=\"sass\" scoped>\n// object\n.o-list__breadcrumb\n  $root: &\n\n  & &--items\n    display: flex\n\n  $arrow-size: 0.25em\n  $margin-size: 0.7em\n  & &--item\n    position: relative\n    line-height: 1\n    color: $font-gray\n    font-size: $font-x-small\n    margin-left: 0.5em\n    padding-left: $arrow-size * 2 + $margin-size\n\n    &::before\n      content: \"\"\n      width: $arrow-size\n      height: $arrow-size\n      display: block\n      position: absolute\n      left: 0\n      top: 50%\n      transform: rotate(45deg) translateY(-50%)\n      border-top: 1px solid $border-x-dark-gray\n      border-right: 1px solid $border-x-dark-gray\n\n    &:first-child\n      margin-left: 0\n      padding-left: 0\n\n      &::before\n        display: none\n\n    &.is-current\n      font-weight: bold\n\n.o-action__breadcrumb\n  & &--item\n    color: $font-gray\n    text-decoration: none\n</style>\n\n"],"names":["_sfc_main","defineComponent","props","index","_hoisted_3","_sfc_render","_ctx","_cache","$props","$setup","$data","$options","_hoisted_1","_createElementVNode","_hoisted_2","_openBlock","_createElementBlock","_Fragment","_renderList","item","_normalizeClass","_createTextVNode","_toDisplayString"],"mappings":"wGAGA,MAAAA,EAAeC,EAAgB,CAC7B,KAAM,uBAEN,MAAO,CACL,MAAO,CACL,KAAM,MACN,SAAU,EACZ,CACF,EAEA,MAAMC,EAAO,CASJ,MAAA,CAEL,UANiBC,GACVA,IAAWD,EAAM,MAAM,OAAS,CAKvC,CAEJ,CACF,CAAC,6EAiBcE,EAAM,CAAA,IAAA,2CAZjB,SAAAC,EAAAC,EAqBKC,EArBLC,EAqBKC,EAAAC,EAAAC,EAAA,cApBH,MAmBKC,EAAA,CAnBLC,EAAA,KAAAC,EAAA,EAAAC,EAEQ,EAAK,EAAAC,EAAAC,EAAA,KAAAC,EAAAZ,EAAA,MAAA,CAAAa,EAAAhB,KACLY,EAAA,EAAAC,EAAA,KAAA,CAAA,IAAAb,EAAoE,MAAAiB,EAAA,CAAA,8FAQxEC,EAAAC,EAMqCH,EANrC,KAAA,EAAA,CAAA,CAAA,EACE,UACoCH,EAAA,MAAAZ,EAAA,CACpBS,EAAA,IAAA,CAAA,MAAA"}