You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1 line
14 KiB
1 line
14 KiB
11 months ago
|
{"version":3,"file":"tabs.mjs","sources":["../../../../../../packages/components/tabs/src/tabs.ts"],"sourcesContent":["import {\n defineComponent,\n Fragment,\n getCurrentInstance,\n h,\n nextTick,\n onMounted,\n onUpdated,\n provide,\n ref,\n renderSlot,\n watch,\n} from 'vue'\nimport { isPromise, NOOP } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons-vue'\nimport { buildProps, definePropType } from '@element-plus/utils/props'\nimport { INPUT_EVENT, UPDATE_MODEL_EVENT } from '@element-plus/utils/constants'\nimport { tabsRootContextKey } from '@element-plus/tokens'\nimport TabNav from './tab-nav'\nimport type { TabsPaneContext } from '@element-plus/tokens'\n\nimport type {\n Component,\n ComponentInternalInstance,\n VNode,\n ExtractPropTypes,\n Ref,\n} from 'vue'\n\nexport const tabsProps = buildProps({\n type: {\n type: String,\n values: ['card', 'border-card', ''],\n default: '',\n },\n activeName: {\n type: String,\n default: '',\n },\n closable: Boolean,\n addable: Boolean,\n modelValue: {\n type: String,\n default: '',\n },\n editable: Boolean,\n tabPosition: {\n type: String,\n values: ['top', 'right', 'bottom', 'left'],\n default: 'top',\n },\n beforeLeave: {\n type: definePropType<\n (\n newTabName: string,\n oldTabName: string\n ) => void | boolean | Promise<void | boolean>\n >(Function),\n default: () => true,\n },\n stretch: Boolean,\n} as const)\nexport type TabsProps = ExtractPropTypes<typeof tabsProps>\n\nexport const tabsEmits = {\n [UPDATE_MODEL_EVENT]: (tabName: string) => typeof tabName === 'string',\n [INPUT_EVENT]: (tabName: string) => typeof tabName === 'string',\n 'tab-click': (pane: TabsPaneContext, ev: Event) => ev instanceof Event,\n edit: (paneName: string | null, action: 'remove' | 'add') =>\n action === 'remove' || action === 'add',\n 'tab-remove': (paneName: string) => typeof paneName === 'string',\n 'tab-add': () => true,\n}\nexport type TabsEmits = typeof tabsEmits\n\nconst getPaneInstanceFromSlot = (\n vnode: VNode,\n paneInstanceList: ComponentInternalInstance[] = []\n) => {\n const children = (vnode.children || []) as ArrayLike<VNode>\n Array.from(children).forEach((node) => {\n let type = node.type\n type = (type as Component).name || type\n if (type === 'ElTabPane' && node.component) {\n paneInstanceList.push(node.component)\n } else if (type === Fragment || type === 'template') {\n getPaneInstanceFromSlot(node, paneInstanceList)\n }\n })\n return paneInstanceList\n}\n\nexport default defineComponent({\n name: 'ElTabs',\n\n props: tabsProps,\n emits: tabsEmits,\n\n setup(props, { emit, slots, expose }) {\n const instance = getCurrentInstance()!\n const nav$ = ref<InstanceType<typeof TabNav>>()\n\n const panes: Ref<TabsPaneContext[]> = ref([])\n const currentName = ref(props.modelValue || props.activeName || '0')\n\n const paneStatesMap: Record<number, TabsPaneContext> = {}\n\n const updatePaneInstances = (isForceUpdate = false) => {\n if (slots.default) {\n const children = instance.subTree.children as ArrayLike<VNode>\n const content = Array.from(children).find(\n ({ props }) => props?.class === 'el-tabs__content'\n )\n if (!content) return\n\n const paneInstanceList: TabsPaneContext[] = getPaneInstanceFromSlot(\n content\n ).map((paneComponent) => paneStatesMap[paneComponent.uid])\n\n const panesChanged = !(\n paneInstanceList.length === panes.value.length &&\n paneInstanceList.every(\n (pane, index) => pane.uid === panes.value[index].uid\n )\n )\n\n if (isForceUpdate || panesChanged) {\n panes.value = paneInstanceList\n }\n } else if (panes.value.length !== 0) {\n panes.value = []\n }\n }\n\n const changeCurrentName = (value: string) => {\n curre
|