element-plus 1.2.0-beta.3 → 1.2.0-beta.4

package/es/components/tabs/src/tabs.mjs

@@ -1,98 +1,80 @@
-import { defineComponent, ref, getCurrentInstance, provide, watch, nextTick, Fragment, onUpdated, onMounted, h } from 'vue';
-import { isPromise } from '@vue/shared';
+import { Fragment, defineComponent, getCurrentInstance, ref, onUpdated, onMounted, watch, nextTick, provide, h, renderSlot } from 'vue';
+import { isPromise, NOOP } from '@vue/shared';
 import { EVENT_CODE } from '../../../utils/aria.mjs';
 import { ElIcon } from '../../icon/index.mjs';
 import { Plus } from '@element-plus/icons';
-import './tab-nav.mjs';
-import script from './tab-nav.vue_vue&type=script&lang.mjs';
+import { buildProps, definePropType } from '../../../utils/props.mjs';
+import { UPDATE_MODEL_EVENT, INPUT_EVENT } from '../../../utils/constants.mjs';
+import '../../../tokens/index.mjs';
+import TabNav from './tab-nav.mjs';
+import { tabsRootContextKey } from '../../../tokens/tabs.mjs';
 
+const tabsProps = buildProps({
+  type: {
+    type: String,
+    values: ["card", "border-card", ""],
+    default: ""
+  },
+  activeName: {
+    type: String,
+    default: ""
+  },
+  closable: Boolean,
+  addable: Boolean,
+  modelValue: {
+    type: String,
+    default: ""
+  },
+  editable: Boolean,
+  tabPosition: {
+    type: String,
+    values: ["top", "right", "bottom", "left"],
+    default: "top"
+  },
+  beforeLeave: {
+    type: definePropType(Function),
+    default: () => true
+  },
+  stretch: Boolean
+});
+const tabsEmits = {
+  [UPDATE_MODEL_EVENT]: (tabName) => typeof tabName === "string",
+  [INPUT_EVENT]: (tabName) => typeof tabName === "string",
+  "tab-click": (pane, ev) => ev instanceof Event,
+  edit: (paneName, action) => action === "remove" || action === "add",
+  "tab-remove": (paneName) => typeof paneName === "string",
+  "tab-add": () => true
+};
+const getPaneInstanceFromSlot = (vnode, paneInstanceList = []) => {
+  const children = vnode.children || [];
+  Array.from(children).forEach((node) => {
+    let type = node.type;
+    type = type.name || type;
+    if (type === "ElTabPane" && node.component) {
+      paneInstanceList.push(node.component);
+    } else if (type === Fragment || type === "template") {
+      getPaneInstanceFromSlot(node, paneInstanceList);
+    }
+  });
+  return paneInstanceList;
+};
 var Tabs = defineComponent({
   name: "ElTabs",
-  components: { TabNav: script },
-  props: {
-    type: {
-      type: String,
-      default: ""
-    },
-    activeName: {
-      type: String,
-      default: ""
-    },
-    closable: Boolean,
-    addable: Boolean,
-    modelValue: {
-      type: String,
-      default: ""
-    },
-    editable: Boolean,
-    tabPosition: {
-      type: String,
-      default: "top"
-    },
-    beforeLeave: {
-      type: Function,
-      default: null
-    },
-    stretch: Boolean
-  },
-  emits: [
-    "tab-click",
-    "edit",
-    "tab-remove",
-    "tab-add",
-    "input",
-    "update:modelValue"
-  ],
-  setup(props, ctx) {
-    const nav$ = ref(null);
-    const currentName = ref(props.modelValue || props.activeName || "0");
-    const panes = ref([]);
+  props: tabsProps,
+  emits: tabsEmits,
+  setup(props, { emit, slots, expose }) {
     const instance = getCurrentInstance();
+    const nav$ = ref();
+    const panes = ref([]);
+    const currentName = ref(props.modelValue || props.activeName || "0");
     const paneStatesMap = {};
-    provide("rootTabs", {
-      props,
-      currentName
-    });
-    provide("updatePaneState", (pane) => {
-      paneStatesMap[pane.uid] = pane;
-    });
-    watch(() => props.activeName, (modelValue) => {
-      setCurrentName(modelValue);
-    });
-    watch(() => props.modelValue, (modelValue) => {
-      setCurrentName(modelValue);
-    });
-    watch(currentName, () => {
-      nextTick(() => {
-        nav$.value && nav$.value.$nextTick(() => {
-          nav$.value && nav$.value.scrollToActiveTab();
-        });
-      });
-      setPaneInstances(true);
-    });
-    const getPaneInstanceFromSlot = (vnode, paneInstanceList = []) => {
-      Array.from(vnode.children || []).forEach((node) => {
-        let type = node.type;
-        type = type.name || type;
-        if (type === "ElTabPane" && node.component) {
-          paneInstanceList.push(node.component);
-        } else if (type === Fragment || type === "template") {
-          getPaneInstanceFromSlot(node, paneInstanceList);
-        }
-      });
-      return paneInstanceList;
-    };
-    const setPaneInstances = (isForceUpdate = false) => {
-      if (ctx.slots.default) {
+    const updatePaneInstances = (isForceUpdate = false) => {
+      if (slots.default) {
         const children = instance.subTree.children;
-        const content = Array.from(children).find(({ props: props2 }) => {
-          return props2.class === "el-tabs__content";
-        });
+        const content = Array.from(children).find(({ props: props2 }) => (props2 == null ? void 0 : props2.class) === "el-tabs__content");
         if (!content)
           return;
-        const paneInstanceList = getPaneInstanceFromSlot(content).map((paneComponent) => {
-          return paneStatesMap[paneComponent.uid];
-        });
+        const paneInstanceList = getPaneInstanceFromSlot(content).map((paneComponent) => paneStatesMap[paneComponent.uid]);
         const panesChanged = !(paneInstanceList.length === panes.value.length && paneInstanceList.every((pane, index) => pane.uid === panes.value[index].uid));
         if (isForceUpdate || panesChanged) {
           panes.value = paneInstanceList;
@@ -103,22 +85,21 @@ var Tabs = defineComponent({
     };
     const changeCurrentName = (value) => {
       currentName.value = value;
-      ctx.emit("input", value);
-      ctx.emit("update:modelValue", value);
+      emit(INPUT_EVENT, value);
+      emit(UPDATE_MODEL_EVENT, value);
     };
     const setCurrentName = (value) => {
+      var _a;
       if (currentName.value === value)
         return;
-      const beforeLeave = props.beforeLeave;
-      const before = beforeLeave && beforeLeave(value, currentName.value);
-      if (before && isPromise(before)) {
-        before.then(() => {
-          var _a, _b;
+      const canLeave = (_a = props.beforeLeave) == null ? void 0 : _a.call(props, value, currentName.value);
+      if (isPromise(canLeave)) {
+        canLeave.then(() => {
+          var _a2, _b;
           changeCurrentName(value);
-          (_b = (_a = nav$.value).removeFocus) == null ? void 0 : _b.call(_a);
-        }, () => {
-        });
-      } else if (before !== false) {
+          (_b = (_a2 = nav$.value) == null ? void 0 : _a2.removeFocus) == null ? void 0 : _b.call(_a2);
+        }, NOOP);
+      } else if (canLeave !== false) {
         changeCurrentName(value);
       }
     };
@@ -126,86 +107,75 @@ var Tabs = defineComponent({
       if (tab.props.disabled)
         return;
       setCurrentName(tabName);
-      ctx.emit("tab-click", tab, event);
+      emit("tab-click", tab, event);
     };
     const handleTabRemove = (pane, ev) => {
       if (pane.props.disabled)
         return;
       ev.stopPropagation();
-      ctx.emit("edit", pane.props.name, "remove");
-      ctx.emit("tab-remove", pane.props.name);
+      emit("edit", pane.props.name, "remove");
+      emit("tab-remove", pane.props.name);
     };
     const handleTabAdd = () => {
-      ctx.emit("edit", null, "add");
-      ctx.emit("tab-add");
+      emit("edit", null, "add");
+      emit("tab-add");
     };
-    onUpdated(() => {
-      setPaneInstances();
+    onUpdated(() => updatePaneInstances());
+    onMounted(() => updatePaneInstances());
+    watch(() => props.activeName, (modelValue) => setCurrentName(modelValue));
+    watch(() => props.modelValue, (modelValue) => setCurrentName(modelValue));
+    watch(currentName, async () => {
+      var _a, _b;
+      updatePaneInstances(true);
+      await nextTick();
+      await ((_a = nav$.value) == null ? void 0 : _a.$nextTick());
+      (_b = nav$.value) == null ? void 0 : _b.scrollToActiveTab();
     });
-    onMounted(() => {
-      setPaneInstances();
-    });
-    return {
-      nav$,
-      handleTabClick,
-      handleTabRemove,
-      handleTabAdd,
-      currentName,
-      panes
-    };
-  },
-  render() {
-    var _a;
-    const {
-      type,
-      handleTabClick,
-      handleTabRemove,
-      handleTabAdd,
+    provide(tabsRootContextKey, {
+      props,
       currentName,
-      panes,
-      editable,
-      addable,
-      tabPosition,
-      stretch
-    } = this;
-    const newButton = editable || addable ? h("span", {
-      class: "el-tabs__new-tab",
-      tabindex: "0",
-      onClick: handleTabAdd,
-      onKeydown: (ev) => {
-        if (ev.code === EVENT_CODE.enter) {
-          handleTabAdd();
+      updatePaneState: (pane) => paneStatesMap[pane.uid] = pane
+    });
+    expose({
+      currentName
+    });
+    return () => {
+      const newButton = props.editable || props.addable ? h("span", {
+        class: "el-tabs__new-tab",
+        tabindex: "0",
+        onClick: handleTabAdd,
+        onKeydown: (ev) => {
+          if (ev.code === EVENT_CODE.enter)
+            handleTabAdd();
         }
-      }
-    }, [h(ElIcon, { class: "is-icon-plus" }, { default: () => h(Plus) })]) : null;
-    const header = h("div", {
-      class: ["el-tabs__header", `is-${tabPosition}`]
-    }, [
-      newButton,
-      h(script, {
-        currentName,
-        editable,
-        type,
-        panes,
-        stretch,
-        ref: "nav$",
-        onTabClick: handleTabClick,
-        onTabRemove: handleTabRemove
-      })
-    ]);
-    const panels = h("div", {
-      class: "el-tabs__content"
-    }, (_a = this.$slots) == null ? void 0 : _a.default());
-    return h("div", {
-      class: {
-        "el-tabs": true,
-        "el-tabs--card": type === "card",
-        [`el-tabs--${tabPosition}`]: true,
-        "el-tabs--border-card": type === "border-card"
-      }
-    }, tabPosition !== "bottom" ? [header, panels] : [panels, header]);
+      }, [h(ElIcon, { class: "is-icon-plus" }, { default: () => h(Plus) })]) : null;
+      const header = h("div", { class: ["el-tabs__header", `is-${props.tabPosition}`] }, [
+        newButton,
+        h(TabNav, {
+          currentName: currentName.value,
+          editable: props.editable,
+          type: props.type,
+          panes: panes.value,
+          stretch: props.stretch,
+          ref: nav$,
+          onTabClick: handleTabClick,
+          onTabRemove: handleTabRemove
+        })
+      ]);
+      const panels = h("div", { class: "el-tabs__content" }, [
+        renderSlot(slots, "default")
+      ]);
+      return h("div", {
+        class: {
+          "el-tabs": true,
+          "el-tabs--card": props.type === "card",
+          [`el-tabs--${props.tabPosition}`]: true,
+          "el-tabs--border-card": props.type === "border-card"
+        }
+      }, props.tabPosition !== "bottom" ? [header, panels] : [panels, header]);
+    };
   }
 });
 
-export { Tabs as default };
+export { Tabs as default, tabsEmits, tabsProps };
 //# sourceMappingURL=tabs.mjs.map

package/es/components/tabs/src/tabs.mjs.map

@@ -1 +1 @@
-{"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  watch,\n} from 'vue'\nimport { isPromise } from '@vue/shared'\nimport { EVENT_CODE } from '@element-plus/utils/aria'\nimport ElIcon from '@element-plus/components/icon'\nimport { Plus } from '@element-plus/icons'\nimport TabNav from './tab-nav.vue'\n\nimport type { Component, ComponentInternalInstance, PropType, VNode } from 'vue'\nimport type {\n  BeforeLeave,\n  IElTabsProps,\n  ITabType,\n  ITabPosition,\n  Pane,\n  RootTabs,\n  UpdatePaneStateCallback,\n} from './token'\n\nexport default defineComponent({\n  name: 'ElTabs',\n  components: { TabNav },\n  props: {\n    type: {\n      type: String as PropType<ITabType>,\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 as PropType<ITabPosition>,\n      default: 'top',\n    },\n    beforeLeave: {\n      type: Function as PropType<BeforeLeave>,\n      default: null,\n    },\n    stretch: Boolean,\n  },\n  emits: [\n    'tab-click',\n    'edit',\n    'tab-remove',\n    'tab-add',\n    'input',\n    'update:modelValue',\n  ],\n  setup(props: IElTabsProps, ctx) {\n    const nav$ = ref<typeof TabNav>(null)\n    const currentName = ref(props.modelValue || props.activeName || '0')\n    const panes = ref([])\n    const instance = getCurrentInstance()\n    const paneStatesMap = {}\n\n    provide<RootTabs>('rootTabs', {\n      props,\n      currentName,\n    })\n\n    provide<UpdatePaneStateCallback>('updatePaneState', (pane: Pane) => {\n      paneStatesMap[pane.uid] = pane\n    })\n\n    watch(\n      () => props.activeName,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => {\n        setCurrentName(modelValue)\n      }\n    )\n\n    watch(currentName, () => {\n      nextTick(() => {\n        nav$.value &&\n          nav$.value.$nextTick(() => {\n            nav$.value && nav$.value.scrollToActiveTab()\n          })\n      })\n      setPaneInstances(true)\n    })\n\n    const getPaneInstanceFromSlot = (\n      vnode: VNode,\n      paneInstanceList: ComponentInternalInstance[] = []\n    ) => {\n      Array.from((vnode.children || []) as ArrayLike<VNode>).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\n    const setPaneInstances = (isForceUpdate = false) => {\n      if (ctx.slots.default) {\n        const children = instance.subTree.children\n\n        const content = Array.from(children as ArrayLike<VNode>).find(\n          ({ props }) => {\n            return props.class === 'el-tabs__content'\n          }\n        )\n\n        if (!content) return\n\n        const paneInstanceList: Pane[] = getPaneInstanceFromSlot(content).map(\n          (paneComponent) => {\n            return paneStatesMap[paneComponent.uid]\n          }\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) => {\n      currentName.value = value\n      ctx.emit('input', value)\n      ctx.emit('update:modelValue', value)\n    }\n\n    const setCurrentName = (value) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const beforeLeave = props.beforeLeave\n      const before = beforeLeave && beforeLeave(value, currentName.value)\n      if (before && isPromise(before)) {\n        before.then(\n          () => {\n            changeCurrentName(value)\n            nav$.value.removeFocus?.()\n          },\n          () => {\n            // ignore promise rejection in `before-leave` hook\n          }\n        )\n      } else if (before !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (tab, tabName, event) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      ctx.emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane, ev) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      ctx.emit('edit', pane.props.name, 'remove')\n      ctx.emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      ctx.emit('edit', null, 'add')\n      ctx.emit('tab-add')\n    }\n\n    onUpdated(() => {\n      setPaneInstances()\n    })\n\n    onMounted(() => {\n      setPaneInstances()\n    })\n\n    return {\n      nav$,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\n      currentName,\n      panes,\n    }\n  },\n\n  render() {\n    const {\n      type,\n      handleTabClick,\n      handleTabRemove,\n      handleTabAdd,\n      currentName,\n      panes,\n      editable,\n      addable,\n      tabPosition,\n      stretch,\n    } = this\n\n    const newButton =\n      editable || addable\n        ? h(\n            'span',\n            {\n              class: 'el-tabs__new-tab',\n              tabindex: '0',\n              onClick: handleTabAdd,\n              onKeydown: (ev) => {\n                if (ev.code === EVENT_CODE.enter) {\n                  handleTabAdd()\n                }\n              },\n            },\n            [h(ElIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n          )\n        : null\n\n    const header = h(\n      'div',\n      {\n        class: ['el-tabs__header', `is-${tabPosition}`],\n      },\n      [\n        newButton,\n        h(TabNav, {\n          currentName,\n          editable,\n          type,\n          panes,\n          stretch,\n          ref: 'nav$',\n          onTabClick: handleTabClick,\n          onTabRemove: handleTabRemove,\n        }),\n      ]\n    )\n\n    const panels = h(\n      'div',\n      {\n        class: 'el-tabs__content',\n      },\n      this.$slots?.default()\n    )\n\n    return h(\n      'div',\n      {\n        class: {\n          'el-tabs': true,\n          'el-tabs--card': type === 'card',\n          [`el-tabs--${tabPosition}`]: true,\n          'el-tabs--border-card': type === 'border-card',\n        },\n      },\n      tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n    )\n  },\n})\n"],"names":["TabNav"],"mappings":"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"}
+{"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'\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      currentName.value = value\n      emit(INPUT_EVENT, value)\n      emit(UPDATE_MODEL_EVENT, value)\n    }\n\n    const setCurrentName = (value: string) => {\n      // should do nothing.\n      if (currentName.value === value) return\n\n      const canLeave = props.beforeLeave?.(value, currentName.value)\n      if (isPromise(canLeave)) {\n        canLeave.then(\n          () => {\n            changeCurrentName(value)\n\n            // call exposed function, Vue doesn't support expose in typescript yet.\n            // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n            // @ts-expect-error\n            nav$.value?.removeFocus?.()\n          },\n          // ignore promise rejection in `before-leave` hook\n          NOOP\n        )\n      } else if (canLeave !== false) {\n        changeCurrentName(value)\n      }\n    }\n\n    const handleTabClick = (\n      tab: TabsPaneContext,\n      tabName: string,\n      event: Event\n    ) => {\n      if (tab.props.disabled) return\n      setCurrentName(tabName)\n      emit('tab-click', tab, event)\n    }\n\n    const handleTabRemove = (pane: TabsPaneContext, ev: Event) => {\n      if (pane.props.disabled) return\n      ev.stopPropagation()\n      emit('edit', pane.props.name, 'remove')\n      emit('tab-remove', pane.props.name)\n    }\n\n    const handleTabAdd = () => {\n      emit('edit', null, 'add')\n      emit('tab-add')\n    }\n\n    onUpdated(() => updatePaneInstances())\n    onMounted(() => updatePaneInstances())\n\n    watch(\n      () => props.activeName,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(\n      () => props.modelValue,\n      (modelValue) => setCurrentName(modelValue)\n    )\n\n    watch(currentName, async () => {\n      updatePaneInstances(true)\n      await nextTick()\n      await nav$.value?.$nextTick()\n\n      // call exposed function, Vue doesn't support expose in typescript yet.\n      // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n      // @ts-expect-error\n      nav$.value?.scrollToActiveTab()\n    })\n\n    provide(tabsRootContextKey, {\n      props,\n      currentName,\n      updatePaneState: (pane) => (paneStatesMap[pane.uid] = pane),\n    })\n\n    expose({\n      currentName,\n    })\n\n    return () => {\n      const newButton =\n        props.editable || props.addable\n          ? h(\n              'span',\n              {\n                class: 'el-tabs__new-tab',\n                tabindex: '0',\n                onClick: handleTabAdd,\n                onKeydown: (ev: KeyboardEvent) => {\n                  if (ev.code === EVENT_CODE.enter) handleTabAdd()\n                },\n              },\n              [h(ElIcon, { class: 'is-icon-plus' }, { default: () => h(Plus) })]\n            )\n          : null\n\n      const header = h(\n        'div',\n        { class: ['el-tabs__header', `is-${props.tabPosition}`] },\n        [\n          newButton,\n          h(TabNav, {\n            currentName: currentName.value,\n            editable: props.editable,\n            type: props.type,\n            panes: panes.value,\n            stretch: props.stretch,\n            ref: nav$,\n            onTabClick: handleTabClick,\n            onTabRemove: handleTabRemove,\n          }),\n        ]\n      )\n\n      const panels = h('div', { class: 'el-tabs__content' }, [\n        renderSlot(slots, 'default'),\n      ])\n\n      return h(\n        'div',\n        {\n          class: {\n            'el-tabs': true,\n            'el-tabs--card': props.type === 'card',\n            [`el-tabs--${props.tabPosition}`]: true,\n            'el-tabs--border-card': props.type === 'border-card',\n          },\n        },\n        props.tabPosition !== 'bottom' ? [header, panels] : [panels, header]\n      )\n    }\n  },\n})\n"],"names":[],"mappings":"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"}

package/es/components/tag/index.mjs

@@ -1,7 +1,7 @@
 import { withInstall } from '../../utils/with-install.mjs';
 import './src/tag2.mjs';
 export { tagEmits, tagProps } from './src/tag.mjs';
-import script from './src/tag.vue_vue&type=script&lang.mjs';
+import script from './src/tag.vue_vue_type_script_lang.mjs';
 
 const ElTag = withInstall(script);
 

package/es/components/tag/src/tag.vue_vue_type_script_lang.mjs

@@ -0,0 +1,41 @@
+import { defineComponent, computed } from 'vue';
+import { ElIcon } from '../../icon/index.mjs';
+import { useGlobalConfig } from '../../../utils/util.mjs';
+import { Close } from '@element-plus/icons';
+import { tagProps, tagEmits } from './tag.mjs';
+
+var script = defineComponent({
+  name: "ElTag",
+  components: { ElIcon, Close },
+  props: tagProps,
+  emits: tagEmits,
+  setup(props, { emit }) {
+    const ELEMENT = useGlobalConfig();
+    const tagSize = computed(() => props.size || ELEMENT.size);
+    const classes = computed(() => {
+      const { type, hit, effect } = props;
+      return [
+        "el-tag",
+        type ? `el-tag--${type}` : "",
+        tagSize.value ? `el-tag--${tagSize.value}` : "",
+        effect ? `el-tag--${effect}` : "",
+        hit && "is-hit"
+      ];
+    });
+    const handleClose = (event) => {
+      event.stopPropagation();
+      emit("close", event);
+    };
+    const handleClick = (event) => {
+      emit("click", event);
+    };
+    return {
+      classes,
+      handleClose,
+      handleClick
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=tag.vue_vue_type_script_lang.mjs.map

package/es/components/tag/src/tag.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { Close } from '@element-plus/icons'\n\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const ELEMENT = useGlobalConfig()\n\n    const tagSize = computed(() => props.size || ELEMENT.size)\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;AAkCA,aAAe,gBAAgB;AAAA,EAC7B,MAAM;AAAA,EAEN,YAAY,EAAE,QAAQ;AAAA,EAEtB,OAAO;AAAA,EACP,OAAO;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,UAAU;AAEhB,UAAM,UAAU,SAAS,MAAM,MAAM,QAAQ,QAAQ;AACrD,UAAM,UAAU,SAAS,MAAM;AAC7B,YAAM,EAAE,MAAM,KAAK,WAAW;AAC9B,aAAO;AAAA,QACL;AAAA,QACA,OAAO,WAAW,SAAS;AAAA,QAC3B,QAAQ,QAAQ,WAAW,QAAQ,UAAU;AAAA,QAC7C,SAAS,WAAW,WAAW;AAAA,QAC/B,OAAO;AAAA;AAAA;AAKX,UAAM,cAAc,CAAC,UAAsB;AACzC,YAAM;AACN,WAAK,SAAS;AAAA;AAGhB,UAAM,cAAc,CAAC,UAAsB;AACzC,WAAK,SAAS;AAAA;AAGhB,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/tag/src/tag.vue_vue_type_template_id_525996c5_lang.mjs

@@ -0,0 +1,51 @@
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, renderSlot, createBlock, withCtx, createVNode, createCommentVNode, Transition, createElementVNode } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_close = resolveComponent("close");
+  const _component_el_icon = resolveComponent("el-icon");
+  return !_ctx.disableTransitions ? (openBlock(), createElementBlock("span", {
+    key: 0,
+    class: normalizeClass(_ctx.classes),
+    style: normalizeStyle({ backgroundColor: _ctx.color }),
+    onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+  }, [
+    renderSlot(_ctx.$slots, "default"),
+    _ctx.closable ? (openBlock(), createBlock(_component_el_icon, {
+      key: 0,
+      class: "el-tag__close",
+      onClick: _ctx.handleClose
+    }, {
+      default: withCtx(() => [
+        createVNode(_component_close)
+      ]),
+      _: 1
+    }, 8, ["onClick"])) : createCommentVNode("v-if", true)
+  ], 6)) : (openBlock(), createBlock(Transition, {
+    key: 1,
+    name: "el-zoom-in-center"
+  }, {
+    default: withCtx(() => [
+      createElementVNode("span", {
+        class: normalizeClass(_ctx.classes),
+        style: normalizeStyle({ backgroundColor: _ctx.color }),
+        onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleClick && _ctx.handleClick(...args))
+      }, [
+        renderSlot(_ctx.$slots, "default"),
+        _ctx.closable ? (openBlock(), createBlock(_component_el_icon, {
+          key: 0,
+          class: "el-tag__close",
+          onClick: _ctx.handleClose
+        }, {
+          default: withCtx(() => [
+            createVNode(_component_close)
+          ]),
+          _: 1
+        }, 8, ["onClick"])) : createCommentVNode("v-if", true)
+      ], 6)
+    ]),
+    _: 3
+  }));
+}
+
+export { render };
+//# sourceMappingURL=tag.vue_vue_type_template_id_525996c5_lang.mjs.map

package/es/components/tag/src/tag.vue_vue_type_template_id_525996c5_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag.vue_vue_type_template_id_525996c5_lang.mjs","sources":["../../../../../../packages/components/tag/src/tag.vue?vue&type=template&id=525996c5&lang.js"],"sourcesContent":["<template>\n  <span\n    v-if=\"!disableTransitions\"\n    :class=\"classes\"\n    :style=\"{ backgroundColor: color }\"\n    @click=\"handleClick\"\n  >\n    <slot></slot>\n    <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n      <close />\n    </el-icon>\n  </span>\n  <transition v-else name=\"el-zoom-in-center\">\n    <span\n      :class=\"classes\"\n      :style=\"{ backgroundColor: color }\"\n      @click=\"handleClick\"\n    >\n      <slot></slot>\n      <el-icon v-if=\"closable\" class=\"el-tag__close\" @click=\"handleClose\">\n        <close />\n      </el-icon>\n    </span>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport ElIcon from '@element-plus/components/icon'\nimport { useGlobalConfig } from '@element-plus/utils/util'\nimport { Close } from '@element-plus/icons'\n\nimport { tagProps, tagEmits } from './tag'\n\nexport default defineComponent({\n  name: 'ElTag',\n\n  components: { ElIcon, Close },\n\n  props: tagProps,\n  emits: tagEmits,\n\n  setup(props, { emit }) {\n    const ELEMENT = useGlobalConfig()\n\n    const tagSize = computed(() => props.size || ELEMENT.size)\n    const classes = computed(() => {\n      const { type, hit, effect } = props\n      return [\n        'el-tag',\n        type ? `el-tag--${type}` : '',\n        tagSize.value ? `el-tag--${tagSize.value}` : '',\n        effect ? `el-tag--${effect}` : '',\n        hit && 'is-hit',\n      ]\n    })\n\n    // methods\n    const handleClose = (event: MouseEvent) => {\n      event.stopPropagation()\n      emit('close', event)\n    }\n\n    const handleClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      classes,\n      handleClose,\n      handleClick,\n    }\n  },\n})\n</script>\n"],"names":["_createElementBlock","_renderSlot","_createBlock","_createVNode","_createElementVNode"],"mappings":";;;;;UAEW,wCADTA;;IAEG,sBAAO;IACP,yCAA0B;IAC1B,gDAAO;;IAERC;IACe,8BAAfC;;MAAyB,OAAM;AAAA,MAAiB,SAAO;;uBACrD;QAAAC;;;;yBAGJD;;IAAmB,MAAK;AAAA;qBACtB;MAAAE;QACG,sBAAO;QACP,yCAA0B;QAC1B,gDAAO;;QAERH;QACe,8BAAfC;;UAAyB,OAAM;AAAA,UAAiB,SAAO;;2BACrD;YAAAC;;;;;;;;;;;;"}

package/es/components/tag/src/tag2.mjs

@@ -1,6 +1,6 @@
-import script from './tag.vue_vue&type=script&lang.mjs';
-export { default } from './tag.vue_vue&type=script&lang.mjs';
-import { render } from './tag.vue_vue&type=template&id=525996c5&lang.mjs';
+import script from './tag.vue_vue_type_script_lang.mjs';
+export { default } from './tag.vue_vue_type_script_lang.mjs';
+import { render } from './tag.vue_vue_type_template_id_525996c5_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/tag/src/tag.vue";

package/es/components/teleport/index.mjs

@@ -1,7 +1,7 @@
 import { withInstall } from '../../utils/with-install.mjs';
 import './src/teleport2.mjs';
 export { elTeleportProps } from './src/teleport.mjs';
-import script from './src/teleport.vue_vue&type=script&lang.mjs';
+import script from './src/teleport.vue_vue_type_script_lang.mjs';
 
 const ElTeleport = withInstall(script);
 

package/es/components/teleport/src/teleport.vue_vue_type_script_lang.mjs

@@ -0,0 +1,28 @@
+import { defineComponent, ref, computed } from 'vue';
+import isServer from '../../../utils/isServer.mjs';
+import { elTeleportProps } from './teleport.mjs';
+
+var script = defineComponent({
+  props: elTeleportProps,
+  setup(props) {
+    const containerRef = ref();
+    const containerStyle = computed(() => {
+      return props.container === "body" || isServer && props.container === document.body ? [
+        props.style,
+        {
+          position: "absolute",
+          top: `0px`,
+          left: `0px`,
+          zIndex: props.zIndex
+        }
+      ] : {};
+    });
+    return {
+      containerRef,
+      containerStyle
+    };
+  }
+});
+
+export { script as default };
+//# sourceMappingURL=teleport.vue_vue_type_script_lang.mjs.map

package/es/components/teleport/src/teleport.vue_vue_type_script_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"teleport.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/teleport/src/teleport.vue"],"sourcesContent":["<template>\n  <teleport v-if=\"container\" :to=\"container\">\n    <div ref=\"containerRef\" class=\"el-teleport\" :style=\"containerStyle\">\n      <slot />\n    </div>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, ref } from 'vue'\nimport isServer from '@element-plus/utils/isServer'\nimport { elTeleportProps } from './teleport'\n\nexport default defineComponent({\n  props: elTeleportProps,\n  setup(props) {\n    const containerRef = ref<HTMLElement>()\n    const containerStyle = computed(() => {\n      return props.container === 'body' ||\n        (isServer && props.container === document.body)\n        ? [\n            props.style,\n            {\n              position: 'absolute',\n              top: `0px`,\n              left: `0px`,\n              zIndex: props.zIndex,\n            },\n          ]\n        : {}\n    })\n    return {\n      containerRef,\n      containerStyle,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;AAaA,aAAe,gBAAgB;AAAA,EAC7B,OAAO;AAAA,EACP,MAAM,OAAO;AACX,UAAM,eAAe;AACrB,UAAM,iBAAiB,SAAS,MAAM;AACpC,aAAO,MAAM,cAAc,UACxB,YAAY,MAAM,cAAc,SAAS,OACxC;AAAA,QACE,MAAM;AAAA,QACN;AAAA,UACE,UAAU;AAAA,UACV,KAAK;AAAA,UACL,MAAM;AAAA,UACN,QAAQ,MAAM;AAAA;AAAA,UAGlB;AAAA;AAEN,WAAO;AAAA,MACL;AAAA,MACA;AAAA;AAAA;AAAA;;;;"}

package/es/components/teleport/src/teleport.vue_vue_type_template_id_787c6a36_lang.mjs

@@ -0,0 +1,19 @@
+import { openBlock, createBlock, Teleport, createElementVNode, normalizeStyle, renderSlot, createCommentVNode } from 'vue';
+
+function render(_ctx, _cache, $props, $setup, $data, $options) {
+  return _ctx.container ? (openBlock(), createBlock(Teleport, {
+    key: 0,
+    to: _ctx.container
+  }, [
+    createElementVNode("div", {
+      ref: "containerRef",
+      class: "el-teleport",
+      style: normalizeStyle(_ctx.containerStyle)
+    }, [
+      renderSlot(_ctx.$slots, "default")
+    ], 4)
+  ], 8, ["to"])) : createCommentVNode("v-if", true);
+}
+
+export { render };
+//# sourceMappingURL=teleport.vue_vue_type_template_id_787c6a36_lang.mjs.map

package/es/components/teleport/src/teleport.vue_vue_type_template_id_787c6a36_lang.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"teleport.vue_vue_type_template_id_787c6a36_lang.mjs","sources":["../../../../../../packages/components/teleport/src/teleport.vue?vue&type=template&id=787c6a36&lang.js"],"sourcesContent":["<template>\n  <teleport v-if=\"container\" :to=\"container\">\n    <div ref=\"containerRef\" class=\"el-teleport\" :style=\"containerStyle\">\n      <slot />\n    </div>\n  </teleport>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent, ref } from 'vue'\nimport isServer from '@element-plus/utils/isServer'\nimport { elTeleportProps } from './teleport'\n\nexport default defineComponent({\n  props: elTeleportProps,\n  setup(props) {\n    const containerRef = ref<HTMLElement>()\n    const containerStyle = computed(() => {\n      return props.container === 'body' ||\n        (isServer && props.container === document.body)\n        ? [\n            props.style,\n            {\n              position: 'absolute',\n              top: `0px`,\n              left: `0px`,\n              zIndex: props.zIndex,\n            },\n          ]\n        : {}\n    })\n    return {\n      containerRef,\n      containerStyle,\n    }\n  },\n})\n</script>\n"],"names":["_createBlock","_createElementVNode","_renderSlot"],"mappings":";;;SACkB,+BAAhBA;;IAA4B,IAAI;;IAC9BC;MAAK,KAAI;AAAA,MAAe,OAAM;AAAA,MAAe,sBAAO;;MAClDC;;;;;;;"}

package/es/components/teleport/src/teleport2.mjs

@@ -1,6 +1,6 @@
-import script from './teleport.vue_vue&type=script&lang.mjs';
-export { default } from './teleport.vue_vue&type=script&lang.mjs';
-import { render } from './teleport.vue_vue&type=template&id=787c6a36&lang.mjs';
+import script from './teleport.vue_vue_type_script_lang.mjs';
+export { default } from './teleport.vue_vue_type_script_lang.mjs';
+import { render } from './teleport.vue_vue_type_template_id_787c6a36_lang.mjs';
 
 script.render = render;
 script.__file = "packages/components/teleport/src/teleport.vue";