{"version":3,"file":"CTgZC9vp.js","sources":["../../../../components/Base/Tabs/Tabs.vue"],"sourcesContent":["<template>\n  <div class=\"flex flex-col gap-8 w-full\">\n    <ul\n      class=\"flex flex-row flex-wrap md:w-full border-b border-b-cadet-gray border-opacity-10\"\n    >\n      <li v-for=\"tab in tabs\" :key=\"tab.id\" aria-current=\"page\">\n        <BaseButton\n          class=\"tab\"\n          :class=\"{\n            'border-b-2 border-white': tab.id === activeTab\n          }\"\n          @click=\"setActiveTab(tab.id)\"\n        >\n          <span\n            class=\"label\"\n            :class=\"{\n              'text-white': tab.id === activeTab\n            }\"\n            >{{ tab.label }}</span\n          >\n          <span v-if=\"tab.postfix\" class=\"postfix\">{{ tab.postfix }}</span>\n        </BaseButton>\n      </li>\n    </ul>\n\n    <div class=\"pb-4\">\n      <Transition name=\"fade\" mode=\"out-in\">\n        <slot :name=\"`tab-${tabs[activeTab]?.id}`\"></slot>\n      </Transition>\n    </div>\n  </div>\n</template>\n<script setup lang=\"ts\">\n  import { useQueryParams } from '@/composables';\n  import { ref } from 'vue';\n\n  type Tab = { id: number; label: string; postfix?: number };\n  interface Props {\n    tabs: Tab[];\n  }\n\n  defineProps<Props>();\n  const { resetQuery, queryParams } = useQueryParams();\n\n  const getActiveTab = computed(() => {\n    const tab = queryParams.value?.tab;\n    return tab === 'pending' ? 2 : 0;\n  });\n\n  const activeTab = ref(getActiveTab.value);\n\n  const setActiveTab = (tabId: number) => {\n    activeTab.value = tabId;\n    if (queryParams.value) {\n      resetQuery();\n    }\n  };\n</script>\n<style lang=\"scss\" scoped>\n  .fade-enter-active,\n  .fade-leave-active {\n    transition: opacity 0.2s ease;\n  }\n\n  .fade-enter-from,\n  .fade-leave-to {\n    opacity: 0;\n  }\n  .tab {\n    @apply p-2 md:p-4 text-dark4 cursor-pointer flex gap-2 w-full;\n  }\n  .label {\n    @apply text-[11px] md:text-xl;\n  }\n  .postfix {\n    @apply bg-cadet-gray p-1 text-white bg-opacity-10 rounded-sm text-xs;\n  }\n</style>\n"],"names":["resetQuery","queryParams","useQueryParams","getActiveTab","computed","_a","activeTab","ref","setActiveTab","tabId"],"mappings":"+wBA0CE,KAAM,CAAE,WAAAA,EAAY,YAAAC,CAAY,EAAIC,EAAe,EAE7CC,EAAeC,EAAS,IAAM,OAE3B,QADKC,EAAAJ,EAAY,QAAZ,YAAAI,EAAmB,OAChB,UAAY,EAAI,CAAA,CAChC,EAEKC,EAAYC,EAAIJ,EAAa,KAAK,EAElCK,EAAgBC,GAAkB,CACtCH,EAAU,MAAQG,EACdR,EAAY,OACHD,EAAA,CAEf"}