{"version":3,"file":"tab-panel.vue2.cjs","sources":["../../../components/tabs/tab-panel.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { computed, inject, onBeforeUnmount, reactive, ref, toRef, watch } from 'vue'\n\nimport { emitEvent, useNameHelper, useProps } from '@vexip-ui/config'\nimport { tabPanelProps } from './props'\nimport { TABS_STATE } from './symbol'\n\nimport type { ItemState } from './symbol'\n\ndefineOptions({ name: 'TabPanel' })\n\nconst _props = defineProps(tabPanelProps)\nconst props = useProps('tabPanel', _props, {\n  lazy: null,\n})\n\nconst slots = defineSlots<{\n  default?: () => any,\n  label?: (params: { label: string | number }) => any\n}>()\n\nconst tabsState = inject(TABS_STATE, null)\n\nconst nh = useNameHelper('tabs')\nconst active = ref(false)\nconst currentLabel = ref(props.label)\n\nconst lazy = computed(() => props.lazy ?? tabsState?.lazy ?? false)\nconst className = computed(() => {\n  const baseClass = nh.be('panel')\n\n  return {\n    [baseClass]: true,\n    [`${baseClass}--disabled`]: props.disabled,\n    [`${baseClass}--lazy`]: lazy.value,\n    [`${baseClass}--active`]: !props.disabled && active.value,\n  }\n})\n\nwatch(\n  () => props.label,\n  value => {\n    currentLabel.value = value\n    tabsState?.refreshLabels()\n  },\n)\nwatch(active, value => {\n  emitEvent(props.onToggle!, value)\n})\n\nif (tabsState) {\n  const state = reactive({\n    label: currentLabel,\n    name: toRef(props, 'name'),\n    icon: toRef(props, 'icon'),\n    disabled: toRef(props, 'disabled'),\n    closable: toRef(props, 'closable'),\n    labelRenderer: null,\n  }) as ItemState\n\n  watch(\n    () => slots.label,\n    value => {\n      state.labelRenderer = value ? data => value(data) : null\n    },\n    { immediate: true },\n  )\n  watch(currentLabel, () => {\n    active.value = currentLabel.value === tabsState.currentActive\n  })\n  watch(\n    () => tabsState.currentActive,\n    value => {\n      active.value = currentLabel.value === value\n    },\n    { immediate: true },\n  )\n\n  tabsState.increaseItem(state)\n\n  onBeforeUnmount(() => {\n    tabsState.decreaseItem(state)\n  })\n}\n</script>\n\n<template>\n  <div\n    v-if=\"!lazy || active\"\n    :class=\"className\"\n    role=\"tabpanel\"\n    :aria-hidden=\"!active\"\n  >\n    <slot></slot>\n  </div>\n</template>\n"],"names":["_props","__props","props","useProps","slots","_useSlots","tabsState","inject","TABS_STATE","nh","useNameHelper","active","ref","currentLabel","lazy","computed","className","baseClass","watch","value","emitEvent","state","reactive","toRef","data","onBeforeUnmount","_createElementBlock","_renderSlot","_ctx"],"mappings":"8NAWA,MAAMA,EAASC,EACTC,EAAQC,EAAAA,SAAS,WAAYH,EAAQ,CACzC,KAAM,IAAA,CACP,EAEKI,EAAQC,EAAAA,SAAA,EAKRC,EAAYC,EAAAA,OAAOC,EAAA,WAAY,IAAI,EAEnCC,EAAKC,gBAAc,MAAM,EACzBC,EAASC,MAAI,EAAK,EAClBC,EAAeD,EAAAA,IAAIV,EAAM,KAAK,EAE9BY,EAAOC,EAAAA,SAAS,IAAMb,EAAM,OAAQI,GAAA,YAAAA,EAAW,OAAQ,EAAK,EAC5DU,EAAYD,EAAAA,SAAS,IAAM,CACzB,MAAAE,EAAYR,EAAG,GAAG,OAAO,EAExB,MAAA,CACL,CAACQ,CAAS,EAAG,GACb,CAAC,GAAGA,CAAS,YAAY,EAAGf,EAAM,SAClC,CAAC,GAAGe,CAAS,QAAQ,EAAGH,EAAK,MAC7B,CAAC,GAAGG,CAAS,UAAU,EAAG,CAACf,EAAM,UAAYS,EAAO,KACtD,CAAA,CACD,EAaD,GAXAO,EAAA,MACE,IAAMhB,EAAM,MACHiB,GAAA,CACPN,EAAa,MAAQM,EACrBb,GAAA,MAAAA,EAAW,eAAc,CAE7B,EACAY,QAAMP,EAAiBQ,GAAA,CACXC,YAAAlB,EAAM,SAAWiB,CAAK,CAAA,CACjC,EAEGb,EAAW,CACb,MAAMe,EAAQC,EAAAA,SAAS,CACrB,MAAOT,EACP,KAAMU,EAAAA,MAAMrB,EAAO,MAAM,EACzB,KAAMqB,EAAAA,MAAMrB,EAAO,MAAM,EACzB,SAAUqB,EAAAA,MAAMrB,EAAO,UAAU,EACjC,SAAUqB,EAAAA,MAAMrB,EAAO,UAAU,EACjC,cAAe,IAAA,CAChB,EAEDgB,EAAA,MACE,IAAMd,EAAM,MACHe,GAAA,CACPE,EAAM,cAAgBF,EAAgBK,GAAAL,EAAMK,CAAI,EAAI,IACtD,EACA,CAAE,UAAW,EAAK,CACpB,EACAN,EAAA,MAAML,EAAc,IAAM,CACjBF,EAAA,MAAQE,EAAa,QAAUP,EAAU,aAAA,CACjD,EACDY,EAAA,MACE,IAAMZ,EAAU,cACPa,GAAA,CACAR,EAAA,MAAQE,EAAa,QAAUM,CACxC,EACA,CAAE,UAAW,EAAK,CACpB,EAEAb,EAAU,aAAae,CAAK,EAE5BI,EAAAA,gBAAgB,IAAM,CACpBnB,EAAU,aAAae,CAAK,CAAA,CAC7B,CAAA,cAMQ,CAAAP,EAAA,OAAQH,EAAM,qBADvBe,qBAOM,MAAA,OALH,uBAAOV,EAAS,KAAA,EACjB,KAAK,WACJ,eAAcL,EAAM,KAAA,GAErBgB,aAAaC,EAAA,OAAA,SAAA"}