xdesign-vue-next/es/tabs/tab-nav-bar.mjs.map

XDesign Component for vue-next

{"version":3,"file":"tab-nav-bar.mjs","sources":["../../src/tabs/tab-nav-bar.tsx"],"sourcesContent":["import { defineComponent, PropType, computed, VNode, nextTick, ref, watch, onMounted } from 'vue';\nimport { firstUpperCase } from '../utils/helper';\nimport tabProps from './props';\n\n// hooks\nimport { usePrefixClass } from '../hooks/useConfig';\n\nexport default defineComponent({\n  props: {\n    navs: {\n      type: Array as PropType<VNode[]>,\n    },\n    placement: tabProps.placement,\n    value: tabProps.value,\n  },\n  setup(props) {\n    const COMPONENT_NAME = usePrefixClass('tabs');\n    const classPrefix = usePrefixClass();\n    const navBarClass = computed(() => {\n      return [`${COMPONENT_NAME.value}__bar`, `${classPrefix.value}-is-${props.placement}`];\n    });\n    const navBarStyle = ref(null);\n    const getStyle = () => {\n      const isVertical = ['left', 'right'].includes(props.placement.toLowerCase());\n      const [sizePropName, offsetPropName] = isVertical ? ['height', 'top'] : ['width', 'left'];\n      let offset = 0;\n      let i = 0;\n      for (; i < props.navs.length; i++) {\n        if (props.navs[i].props.value === props.value) {\n          break;\n        }\n        offset += props.navs[i]?.el?.[`client${firstUpperCase(sizePropName)}`] || 0;\n      }\n      if (!props.navs[i]) return {};\n      return {\n        [offsetPropName]: `${offset}px`,\n        [sizePropName]: `${props.navs[i].el?.[`client${firstUpperCase(sizePropName)}`] || 0}px`,\n      };\n    };\n\n    onMounted(() => {\n      nextTick(() => {\n        navBarStyle.value = getStyle();\n      });\n    });\n\n    watch([() => props.navs, () => props.value, () => props.placement], () => {\n      nextTick(() => {\n        navBarStyle.value = getStyle();\n      });\n    });\n\n    return () => {\n      return <div class={navBarClass.value} style={navBarStyle.value}></div>;\n    };\n  },\n});\n"],"names":["props","navs","type","sizePropName","offsetPropName","offset","onMounted","nextTick","navBarStyle","watch","_createVNode"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,iBAAA,eAAA,CAAA;AACEA,EAAAA,KAAAA,EAAAA;AACEC,IAAAA,IAAAA,EAAAA;AACEC,MAAAA,IAAAA,EAAAA,KAAAA;;;;;;AAMI,IAAA,IAAA,cAAA,GAAA,cAAA,CAAA,MAAA,CAAA,CAAA;AACN,IAAA,IAAA,WAAA,GAAA,cAAA,EAAA,CAAA;AACM,IAAA,IAAA,WAAA,GAAA,QAAA,CAAA,YAAA;AACG,MAAA,OAAA,CAAA,EAAA,CAAA,MAAA,CAAA,cAAA,CAAA,KAAA,EAAA,OAAA,CAAA,EAAA,EAAA,CAAA,MAAA,CAAA,WAAA,CAAA,KAAA,EAAA,MAAA,CAAA,CAAA,MAAA,CAAA,KAAA,CAAA,SAAA,CAAA,CAAA,CAAA;AACT,KAAA,CAAA,CAAA;AACM,IAAA,IAAA,WAAA,GAAA,GAAA,CAAA,IAAA,CAAA,CAAA;AACN,IAAA,IAAA,QAAA,GAAA,SAAA,QAAA,GAAA;;AACQ,MAAA,IAAA,UAAA,GAAA,CAAA,MAAA,EAAA,OAAA,CAAA,CAAA,QAAA,CAAA,KAAA,CAAA,SAAA,CAAA,WAAA,EAAA,CAAA,CAAA;AACA,MAAA,IAAA,IAAA,GAAA,UAAA,GAAA,CAAA,QAAA,EAAA,KAAA,CAAA,GAAA,CAAA,OAAA,EAAA,MAAA,CAAA;;AAACC,QAAAA,YAAAA,GAAAA,KAAAA,CAAAA,CAAAA,CAAAA;AAAcC,QAAAA,cAAAA,GAAAA,KAAAA,CAAAA,CAAAA,CAAAA,CAAAA;;;;AAGc,QAAA,IAAA,aAAA,CAAA;AACjC,QAAA,IAAA,KAAA,CAAA,IAAA,CAAA,CAAA,CAAA,CAAA,KAAA,CAAA,KAAA,KAAA,KAAA,CAAA,KAAA,EAAA;AACE,UAAA,MAAA;AACF,SAAA;AACAC,QAAAA,MAAAA,IAAAA,CAAAA,CAAAA,aAAAA,GAAAA,KAAAA,CAAAA,IAAAA,CAAAA,CAAAA,CAAAA,MAAAA,IAAAA,IAAAA,aAAAA,KAAAA,KAAAA,CAAAA,IAAAA,CAAAA,aAAAA,GAAAA,aAAAA,CAAAA,EAAAA,MAAAA,IAAAA,IAAAA,aAAAA,KAAAA,KAAAA,CAAAA,GAAAA,KAAAA,CAAAA,GAAAA,aAAAA,CAAAA,QAAAA,CAAAA,MAAAA,CAAAA,cAAAA,CAAAA,YAAAA,CAAAA,CAAAA,CAAAA,KAAAA,CAAAA,CAAAA;AACF,OAAA;;;;AAQFC,IAAAA,SAAAA,CAAAA,YAAAA;AACEC,MAAAA,QAAAA,CAAAA,YAAAA;AACEC,QAAAA,WAAAA,CAAAA,KAAAA,GAAAA,QAAAA,EAAAA,CAAAA;AACF,OAAA,CAAA,CAAA;AACF,KAAA,CAAA,CAAA;AAEMC,IAAAA,KAAAA,CAAAA,CAAAA,YAAAA;;;;;;AAA2D,KAAA,CAAA,EAAA,YAAA;AAC/DF,MAAAA,QAAAA,CAAAA,YAAAA;AACEC,QAAAA,WAAAA,CAAAA,KAAAA,GAAAA,QAAAA,EAAAA,CAAAA;AACF,OAAA,CAAA,CAAA;AACF,KAAA,CAAA,CAAA;AAEA,IAAA,OAAA,YAAA;AACE,MAAA,OAAAE,WAAA,CAAA,KAAA,EAAA;;AAAsC,QAAA,OAAA,EAAA,WAAA,CAAA,KAAA;AAA0B,OAAA,EAAA,IAAA,CAAA,CAAA;;AAEpE,GAAA;AACF,CAAA,CAAA;;;;"}