ele-admin-plus 1.1.9 → 1.2.0-beta.2

package/es/ele-tabs/components/tab-title.d.ts

@@ -1,6 +1,6 @@
 import { TabPaneItem, TabEventOption } from '../types';
-import { EleDropdownProps, EleDropdownInstance } from '../../ele-app/plus';
 import { DropdownItem } from '../../ele-dropdown/types';
+import { EleDropdownProps, EleDropdownInstance } from '../../ele-app/plus';
 import { PropType } from 'vue';
 
 declare const _default: import('vue').DefineComponent<{
@@ -20,9 +20,9 @@ declare const _default: import('vue').DefineComponent<{
     handleClick: BooleanConstructor;
 }, {
     dropdownRef: import('vue').Ref<EleDropdownInstance>;
-    onContextMenu: (command: string) => void;
-    onContextVisible: (visible: boolean) => void;
-    onClick: (e: MouseEvent) => void;
+    handleContextMenu: (command: string) => void;
+    handleContextVisible: (visible: boolean) => void;
+    handleTitleClick: (e: MouseEvent) => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     itemClick: (_opt: TabEventOption) => true;
     contextMenu: (_option: TabEventOption) => true;

package/es/ele-tabs/components/tab-title.js

@@ -26,7 +26,7 @@ const _sfc_main = defineComponent({
   },
   setup(props, { emit }) {
     const dropdownRef = ref(null);
-    const onContextMenu = (command) => {
+    const handleContextMenu = (command) => {
       emit("contextMenu", {
         command,
         name: props.tabName,
@@ -34,12 +34,12 @@ const _sfc_main = defineComponent({
         active: props.active
       });
     };
-    const onContextVisible = (visible) => {
+    const handleContextVisible = (visible) => {
       if (visible) {
         emit("contextOpen", dropdownRef.value);
       }
     };
-    const onClick = (e) => {
+    const handleTitleClick = (e) => {
       if (props.handleClick) {
         e.stopPropagation();
       }
@@ -49,7 +49,12 @@ const _sfc_main = defineComponent({
         active: props.active
       });
     };
-    return { dropdownRef, onContextMenu, onContextVisible, onClick };
+    return {
+      dropdownRef,
+      handleContextMenu,
+      handleContextVisible,
+      handleTitleClick
+    };
   }
 });
 const _export_sfc = (sfc, props) => {
@@ -72,17 +77,18 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     trigger: "contextmenu",
     disabled: !_ctx.contextMenu,
     items: _ctx.contextMenus,
-    onCommand: _ctx.onContextMenu,
-    onVisibleChange: _ctx.onContextVisible
+    onCommand: _ctx.handleContextMenu,
+    onVisibleChange: _ctx.handleContextVisible
   }), createSlots({
     default: withCtx(() => [
       createElementVNode("div", {
         class: "ele-tab-title",
-        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClick && _ctx.onClick(...args))
+        onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleTitleClick && _ctx.handleTitleClick(...args))
       }, [
         renderSlot(_ctx.$slots, "label", {
+          label: _ctx.label,
           item: _ctx.item,
-          label: _ctx.label
+          active: _ctx.active
         }, () => [
           createTextVNode(toDisplayString(_ctx.label), 1)
         ])
@@ -94,8 +100,8 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       name: "dropdownMenu",
       fn: withCtx(() => [
         renderSlot(_ctx.$slots, "contextMenu", {
-          item: _ctx.item,
           tabName: _ctx.tabName,
+          item: _ctx.item,
           active: _ctx.active
         })
       ]),

package/es/ele-tabs/index.d.ts

@@ -1,6 +1,5 @@
 import { TabTitleInstance } from './props';
-import { TabPaneItem, TabEventOption } from './types';
-import { DropdownItem } from '../ele-dropdown/types';
+import { TabPaneItem, TabSize, TabType, TabEventOption, ContextMenusFunc } from './types';
 import { EleDropdownInstance } from '../ele-app/plus';
 import { ElTabsProps, ElTabsInstance } from '../ele-app/el';
 import { omit } from '../utils/core';
@@ -12,8 +11,8 @@ declare const _default: import('vue').DefineComponent<{
         type: import('vue').PropType<TabPaneItem[]>;
         required: boolean;
     };
-    size: import('vue').PropType<import('./types').TabSize>;
-    type: import('vue').PropType<import('./types').TabType>;
+    size: import('vue').PropType<TabSize>;
+    type: import('vue').PropType<TabType>;
     center: BooleanConstructor;
     contextMenu: import('vue').PropType<boolean | import('../ele-app/plus').EleDropdownProps>;
     contextMenus: import('vue').PropType<import('./types').ContextMenus>;
@@ -44,22 +43,25 @@ declare const _default: import('vue').DefineComponent<{
     omit: typeof omit;
     tabRef: Ref<ElTabsInstance>;
     itemRefs: Ref<TabTitleInstance[]>;
+    isWrap: import('vue').ComputedRef<boolean>;
+    tabSize: import('vue').ComputedRef<TabSize | undefined>;
+    tabType: import('vue').ComputedRef<TabType | undefined>;
     tabProps: import('vue').ComputedRef<Omit<ElTabsProps, "type">>;
-    getContextMenus: (item: TabPaneItem) => DropdownItem[] | undefined;
-    onUpdateModelValue: (name: TabPaneName) => void;
-    onTabClick: (pane: TabsPaneContext, e: Event) => void;
-    onTabChange: (name: TabPaneName) => void;
-    onTabRemove: (name: TabPaneName) => void;
-    onTabAdd: () => void;
-    onEdit: (name: TabPaneName | undefined, action: 'remove' | 'add') => void;
-    onItemClick: (option: TabEventOption) => void;
-    onItemContextMenu: (option: TabEventOption) => void;
-    onItemContextOpen: (ref: EleDropdownInstance) => void;
-    onContextmenu: (e: MouseEvent) => void;
+    getContextMenus: ContextMenusFunc;
+    updateModelValue: (name: TabPaneName) => void;
+    handleTabClick: (pane: TabsPaneContext, e: Event) => void;
+    handleTabChange: (name: TabPaneName) => void;
+    handleTabRemove: (name: TabPaneName) => void;
+    handleTabAdd: () => void;
+    handleEdit: (name: TabPaneName | undefined, action: 'remove' | 'add') => void;
+    handleItemClick: (option: TabEventOption) => void;
+    handleItemContextMenu: (option: TabEventOption) => void;
+    handleItemContextOpen: (ref: EleDropdownInstance) => void;
+    handleContextmenu: (e: MouseEvent) => void;
     hideAllDropdown: () => void;
     updateActiveBar: () => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
-    tabItemClick: (_opt: TabEventOption) => boolean; /** 页签 */
+    tabItemClick: (_opt: TabEventOption) => boolean;
     tabContextMenu: (_opt: TabEventOption) => boolean;
     tabContextOpen: (_ref: EleDropdownInstance) => boolean;
     tabSortChange: (_data: TabPaneItem[]) => boolean;
@@ -70,9 +72,9 @@ declare const _default: import('vue').DefineComponent<{
             [name: string]: import('vue').Slot<any> | undefined;
         }>;
         props: {
-            readonly disabled: boolean;
             readonly label: string;
             readonly closable: boolean;
+            readonly disabled: boolean;
             readonly lazy: boolean;
             readonly name?: import('element-plus/es/utils/index').EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown> | undefined;
         };
@@ -84,15 +86,14 @@ declare const _default: import('vue').DefineComponent<{
     tabChange: (name: TabPaneName) => boolean;
     edit: (paneName: TabPaneName | undefined, action: "add" | "remove") => boolean;
     tabRemove: (name: TabPaneName) => boolean;
-    /** 页签移除或新增事件 */
     tabAdd: () => boolean;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     items: {
         type: import('vue').PropType<TabPaneItem[]>;
         required: boolean;
     };
-    size: import('vue').PropType<import('./types').TabSize>;
-    type: import('vue').PropType<import('./types').TabType>;
+    size: import('vue').PropType<TabSize>;
+    type: import('vue').PropType<TabType>;
     center: BooleanConstructor;
     contextMenu: import('vue').PropType<boolean | import('../ele-app/plus').EleDropdownProps>;
     contextMenus: import('vue').PropType<import('./types').ContextMenus>;
@@ -127,9 +128,9 @@ declare const _default: import('vue').DefineComponent<{
             [name: string]: import('vue').Slot<any> | undefined;
         }>;
         props: {
-            readonly disabled: boolean;
             readonly label: string;
             readonly closable: boolean;
+            readonly disabled: boolean;
             readonly lazy: boolean;
             readonly name?: import('element-plus/es/utils/index').EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown> | undefined;
         };
@@ -142,19 +143,19 @@ declare const _default: import('vue').DefineComponent<{
     onEdit?: ((paneName: TabPaneName | undefined, action: "add" | "remove") => any) | undefined;
     onTabRemove?: ((name: TabPaneName) => any) | undefined;
     onTabAdd?: (() => any) | undefined;
-    onTabItemClick?: ((_opt: TabEventOption) => any) | undefined;
     onTabContextMenu?: ((_opt: TabEventOption) => any) | undefined;
+    onTabItemClick?: ((_opt: TabEventOption) => any) | undefined;
     onTabContextOpen?: ((_ref: EleDropdownInstance) => any) | undefined;
     onTabSortChange?: ((_data: TabPaneItem[]) => any) | undefined;
 }, {
-    center: boolean;
     closable: boolean;
+    center: boolean;
+    beforeLeave: (newName: TabPaneName, oldName: TabPaneName) => import('element-plus/es/utils/typescript').Awaitable<boolean | void>;
+    sortable: boolean;
     addable: boolean;
     editable: boolean;
     tabPosition: import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "top" | "bottom" | "right" | "left", unknown>;
-    beforeLeave: (newName: TabPaneName, oldName: TabPaneName) => import('element-plus/es/utils/typescript').Awaitable<boolean | void>;
     stretch: boolean;
-    sortable: boolean;
     handleClick: boolean;
     mousewheel: boolean;
 }, {}>;

package/es/ele-tabs/index.js

@@ -1,18 +1,26 @@
-import { defineComponent, ref, computed, onMounted, onBeforeUnmount, watch, resolveComponent, openBlock, createBlock, mergeProps, createSlots, withCtx, createElementBlock, Fragment, renderList, createVNode, renderSlot, normalizeProps, guardReactiveProps } from "vue";
+import { defineComponent, inject, ref, computed, onMounted, onBeforeUnmount, watch, resolveComponent, openBlock, createBlock, mergeProps, createSlots, withCtx, createElementBlock, Fragment, renderList, createVNode, renderSlot, normalizeProps, guardReactiveProps } from "vue";
 import SortableJs from "sortablejs";
 import { ElTabs, ElTabPane } from "element-plus";
 import { pick, omit } from "../utils/core";
 import TabTitle from "./components/tab-title";
-import { tabsProps, tabsEmits, tabPropKeys } from "./props";
+import { tabsProps, tabsEmits, TAB_WRAP_KEY, tabPropKeys } from "./props";
 const _sfc_main = defineComponent({
   name: "EleTabs",
   components: { ElTabs, ElTabPane, TabTitle },
   props: tabsProps,
   emits: tabsEmits,
   setup(props, { emit }) {
+    const wrapProps = inject(TAB_WRAP_KEY, null);
     const current = { sortIns: null, isScroll: false };
     const tabRef = ref(null);
     const itemRefs = ref([]);
+    const isWrap = computed(() => wrapProps == null);
+    const tabSize = computed(
+      () => wrapProps == null ? props.size : wrapProps.size
+    );
+    const tabType = computed(
+      () => wrapProps == null ? props.type : wrapProps.type
+    );
     const tabProps = computed(() => {
       return pick(props, tabPropKeys);
     });
@@ -22,31 +30,31 @@ const _sfc_main = defineComponent({
       }
       return props.contextMenus;
     };
-    const onUpdateModelValue = (name) => {
+    const updateModelValue = (name) => {
       emit("update:modelValue", name);
     };
-    const onTabClick = (pane, e) => {
+    const handleTabClick = (pane, e) => {
       emit("tabClick", pane, e);
     };
-    const onTabChange = (name) => {
+    const handleTabChange = (name) => {
       emit("tabChange", name);
     };
-    const onTabRemove = (name) => {
+    const handleTabRemove = (name) => {
       emit("tabRemove", name);
     };
-    const onTabAdd = () => {
+    const handleTabAdd = () => {
       emit("tabAdd");
     };
-    const onEdit = (name, action) => {
+    const handleEdit = (name, action) => {
       emit("edit", name, action);
     };
-    const onItemClick = (option) => {
+    const handleItemClick = (option) => {
       emit("tabItemClick", option);
     };
-    const onItemContextMenu = (option) => {
+    const handleItemContextMenu = (option) => {
       emit("tabContextMenu", option);
     };
-    const onItemContextOpen = (ref2) => {
+    const handleItemContextOpen = (ref2) => {
       if (itemRefs.value) {
         itemRefs.value.forEach((r) => {
           if ((r == null ? void 0 : r.dropdownRef) && r.dropdownRef !== ref2) {
@@ -56,6 +64,12 @@ const _sfc_main = defineComponent({
       }
       emit("tabContextOpen", ref2);
     };
+    const handleContextmenu = (e) => {
+      const el = e.target;
+      if (el && el.classList.contains("is-icon-close")) {
+        e.preventDefault();
+      }
+    };
     const hideAllDropdown = () => {
       if (itemRefs.value) {
         itemRefs.value.forEach((r) => {
@@ -65,6 +79,24 @@ const _sfc_main = defineComponent({
         });
       }
     };
+    const getHeaderEl = () => {
+      const tabEl = tabRef.value ? tabRef.value.$el : void 0;
+      const el = tabEl ? tabEl.querySelector(".el-tabs__header") : void 0;
+      return el;
+    };
+    const getNavEl = () => {
+      const headerEl = getHeaderEl();
+      return headerEl ? headerEl.querySelector(".el-tabs__nav") : void 0;
+    };
+    const getBtnEl = (el, e, firefox) => {
+      const wheelDelta = e.wheelDelta || e.detail;
+      const delta = firefox ? -wheelDelta : wheelDelta;
+      if (delta > 0) {
+        return el.querySelector(".el-tabs__nav-prev");
+      } else if (delta < 0) {
+        return el.querySelector(".el-tabs__nav-next");
+      }
+    };
     const updateActiveBar = () => {
       const el = getNavEl();
       if (el) {
@@ -85,13 +117,13 @@ const _sfc_main = defineComponent({
         draggable: ".el-tabs__item",
         onUpdate: ({ oldDraggableIndex, newDraggableIndex }) => {
           if (typeof oldDraggableIndex === "number" && typeof newDraggableIndex === "number") {
-            const temp = [...props.items];
-            temp.splice(
+            const data = [...props.items];
+            data.splice(
               newDraggableIndex,
               0,
-              temp.splice(oldDraggableIndex, 1)[0]
+              data.splice(oldDraggableIndex, 1)[0]
             );
-            emit("tabSortChange", temp);
+            emit("tabSortChange", data);
           }
         },
         setData: () => {
@@ -102,22 +134,7 @@ const _sfc_main = defineComponent({
       current.sortIns && current.sortIns.destroy();
       current.sortIns = null;
     };
-    const onContextmenu = (e) => {
-      const el = e.target;
-      if (el && el.classList.contains("is-icon-close")) {
-        e.preventDefault();
-      }
-    };
-    const getBtnEl = (el, e, firefox) => {
-      const wheelDelta = e.wheelDelta || e.detail;
-      const delta = firefox ? -wheelDelta : wheelDelta;
-      if (delta > 0) {
-        return el.querySelector(".el-tabs__nav-prev");
-      } else if (delta < 0) {
-        return el.querySelector(".el-tabs__nav-next");
-      }
-    };
-    const onMousewheel = (e, isFirefox) => {
+    const handleMousewheel = (e, isFirefox) => {
       const tabEl = e.currentTarget;
       if (tabEl && !current.isScroll) {
         const el = getBtnEl(tabEl, e, isFirefox);
@@ -132,40 +149,26 @@ const _sfc_main = defineComponent({
         }
       }
     };
-    const onFMousewheel = (e) => {
-      onMousewheel(e, true);
-    };
-    const getHeaderEl = () => {
-      const tabEl = tabRef.value ? tabRef.value.$el : void 0;
-      const el = tabEl ? tabEl.querySelector(".el-tabs__header") : void 0;
-      return el;
-    };
-    const getNavEl = () => {
-      const headerEl = getHeaderEl();
-      const el = headerEl ? headerEl.querySelector(".el-tabs__nav") : void 0;
-      return el;
+    const handleFirefoxMousewheel = (e) => {
+      handleMousewheel(e, true);
     };
-    const bindEvents = () => {
+    onMounted(() => {
       bindDragSort();
       const el = getHeaderEl();
       if (props.mousewheel && el) {
-        el.addEventListener("mousewheel", onMousewheel, { passive: false });
-        el.addEventListener("DOMMouseScroll", onFMousewheel);
+        el.addEventListener("mousewheel", handleMousewheel, {
+          passive: false
+        });
+        el.addEventListener("DOMMouseScroll", handleFirefoxMousewheel);
       }
-    };
-    const unbindEvents = () => {
+    });
+    onBeforeUnmount(() => {
       const el = getHeaderEl();
       if (el) {
-        el.removeEventListener("mousewheel", onMousewheel);
-        el.removeEventListener("DOMMouseScroll", onFMousewheel);
+        el.removeEventListener("mousewheel", handleMousewheel);
+        el.removeEventListener("DOMMouseScroll", handleFirefoxMousewheel);
       }
       unbindDragSort();
-    };
-    onMounted(() => {
-      bindEvents();
-    });
-    onBeforeUnmount(() => {
-      unbindEvents();
     });
     watch(
       () => props.sortable,
@@ -177,18 +180,21 @@ const _sfc_main = defineComponent({
       omit,
       tabRef,
       itemRefs,
+      isWrap,
+      tabSize,
+      tabType,
       tabProps,
       getContextMenus,
-      onUpdateModelValue,
-      onTabClick,
-      onTabChange,
-      onTabRemove,
-      onTabAdd,
-      onEdit,
-      onItemClick,
-      onItemContextMenu,
-      onItemContextOpen,
-      onContextmenu,
+      updateModelValue,
+      handleTabClick,
+      handleTabChange,
+      handleTabRemove,
+      handleTabAdd,
+      handleEdit,
+      handleItemClick,
+      handleItemContextMenu,
+      handleItemContextOpen,
+      handleContextmenu,
       hideAllDropdown,
       updateActiveBar
     };
@@ -207,26 +213,27 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_ElTabs = resolveComponent("ElTabs");
   return openBlock(), createBlock(_component_ElTabs, mergeProps(_ctx.tabProps, {
     ref: "tabRef",
-    type: _ctx.type === "card" || _ctx.type === "border-card" ? _ctx.type : void 0,
+    type: _ctx.tabType === "card" || _ctx.tabType === "border-card" ? _ctx.tabType : void 0,
     class: [
       "ele-tabs",
-      { "is-small": _ctx.size === "small" },
-      { "is-large": _ctx.size === "large" },
-      { "is-default": !_ctx.type || _ctx.type === "default" },
-      { "is-plain": _ctx.type === "plain" },
-      { "is-simple": _ctx.type === "simple" },
-      { "is-indicator": _ctx.type === "indicator" },
-      { "is-button": _ctx.type === "button" },
-      { "is-tag": _ctx.type === "tag" },
+      { "ele-tabs-wrap": _ctx.isWrap },
+      { "is-small": _ctx.tabSize === "small" },
+      { "is-large": _ctx.tabSize === "large" },
+      { "is-default": !_ctx.tabType || _ctx.tabType === "default" },
+      { "is-plain": _ctx.tabType === "plain" },
+      { "is-simple": _ctx.tabType === "simple" },
+      { "is-indicator": _ctx.tabType === "indicator" },
+      { "is-button": _ctx.tabType === "button" },
+      { "is-tag": _ctx.tabType === "tag" },
       { "is-center": _ctx.center }
     ],
-    "onUpdate:modelValue": _ctx.onUpdateModelValue,
-    onTabClick: _ctx.onTabClick,
-    onTabChange: _ctx.onTabChange,
-    onTabRemove: _ctx.onTabRemove,
-    onTabAdd: _ctx.onTabAdd,
-    onEdit: _ctx.onEdit,
-    onContextmenu: _ctx.onContextmenu
+    "onUpdate:modelValue": _ctx.updateModelValue,
+    onTabClick: _ctx.handleTabClick,
+    onTabChange: _ctx.handleTabChange,
+    onTabRemove: _ctx.handleTabRemove,
+    onTabAdd: _ctx.handleTabAdd,
+    onEdit: _ctx.handleEdit,
+    onContextmenu: _ctx.handleContextmenu
   }), createSlots({
     default: withCtx(() => [
       (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.items, (item, index2) => {
@@ -244,9 +251,9 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
               handleClick: _ctx.handleClick,
               contextMenu: _ctx.contextMenu,
               contextMenus: _ctx.getContextMenus(item),
-              onContextMenu: _ctx.onItemContextMenu,
-              onContextOpen: _ctx.onItemContextOpen,
-              onItemClick: _ctx.onItemClick
+              onContextMenu: _ctx.handleItemContextMenu,
+              onContextOpen: _ctx.handleItemContextOpen,
+              onItemClick: _ctx.handleItemClick
             }, createSlots({ _: 2 }, [
               _ctx.$slots.label ? {
                 name: "label",

package/es/ele-tabs/props.d.ts

@@ -1,8 +1,8 @@
-import { TabPaneItem, TabSize, TabType, TabEventOption, ContextMenus } from './types';
+import { TabPaneItem, TabSize, TabType, ContextMenus, TabEventOption, TabWrapProvide } from './types';
 import { default as TabTitle } from "./components/tab-title";
 import { EleDropdownProps, EleDropdownInstance } from '../ele-app/plus';
 import { tabsProps as elTabsProps } from 'element-plus';
-import { PropType, ExtractPropTypes } from 'vue';
+import { PropType, ExtractPropTypes, InjectionKey } from 'vue';
 
 /**
  * 属性
@@ -70,9 +70,9 @@ export declare const tabsEmits: {
             [name: string]: import('vue').Slot<any> | undefined;
         }>;
         props: {
+            readonly closable: boolean;
             readonly label: string;
             readonly disabled: boolean;
-            readonly closable: boolean;
             readonly lazy: boolean;
             readonly name?: import('element-plus/es/utils/index').EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown> | undefined;
         };
@@ -86,12 +86,16 @@ export declare const tabsEmits: {
     tabRemove: (name: import('element-plus').TabPaneName) => boolean;
     tabAdd: () => boolean;
 };
-export type TabPropKeys = Array<keyof typeof elTabsProps>;
 /**
  * 标签页组件属性名
  */
+export type TabPropKeys = Array<keyof typeof elTabsProps>;
 export declare const tabPropKeys: TabPropKeys;
 /**
  * 页签标题实例
  */
 export type TabTitleInstance = InstanceType<typeof TabTitle> | null;
+/**
+ * 标签页容器依赖注入key
+ */
+export declare const TAB_WRAP_KEY: InjectionKey<TabWrapProvide>;

package/es/ele-tabs/props.js

@@ -35,7 +35,9 @@ const tabsEmits = {
   tabSortChange: (_data) => true
 };
 const tabPropKeys = Object.keys(tabsProps$1);
+const TAB_WRAP_KEY = Symbol("tabWrap");
 export {
+  TAB_WRAP_KEY,
   tabPropKeys,
   tabsEmits,
   tabsProps

package/es/ele-tabs/style/css-var.scss

@@ -2,8 +2,7 @@
 
 /* 标签页主题变量 */
 @mixin set-tab-var($var) {
-  .ele-tabs,
-  .ele-tab-wrap {
+  .ele-tabs-wrap {
     @include set-ele-var('tab', $var);
   }
 }

package/es/ele-tabs/style/index.d.ts

@@ -0,0 +1 @@
+

package/es/ele-tabs/style/index.js

@@ -1,4 +1,5 @@
-import 'element-plus/es/components/tabs/style/index';
-import 'element-plus/es/components/tab-pane/style/index';
-import '../../ele-dropdown/style/index';
-import './index.scss';
+import "element-plus/es/components/tabs/style/index";
+import "element-plus/es/components/tab-pane/style/index";
+import "element-plus/es/components/icon/style/index";
+import "../../ele-dropdown/style/index";
+import "./index.scss";

package/es/ele-tabs/style/index.scss

@@ -37,7 +37,7 @@
     line-height: eleVar('tab', 'height');
     color: eleVar('tab', 'color');
     font-size: eleVar('tab', 'font-size');
-    transition-duration: $ele-transition;
+    transition-duration: $transition-base;
     transition-property: eleVar('tab', 'transition');
     border: none;
     margin: 0;
@@ -99,7 +99,7 @@
     right: calc(#{eleVar('tab', 'padding')} / 2);
     top: 50%;
     transform: translateY(-50%);
-    transition: (color $ele-transition, background-color $ele-transition);
+    transition: (color $transition-base, background-color $transition-base);
 
     & > svg {
       margin: 0;
@@ -135,7 +135,7 @@
     line-height: eleVar('tab', 'height');
     color: eleVar('tab', 'tool-color');
     font-size: eleVar('tab', 'tool-font-size');
-    transition: (color $ele-transition, background-color $ele-transition);
+    transition: (color $transition-base, background-color $transition-base);
     box-sizing: border-box;
     display: flex;
     align-items: center;
@@ -159,7 +159,7 @@
       position: absolute;
       top: 0;
       bottom: -1px;
-      transition: box-shadow $ele-transition;
+      transition: box-shadow $transition-base;
       pointer-events: none;
       z-index: calc(#{eleVar('tab', 'active-index')} + 1);
     }
@@ -456,7 +456,7 @@
       width: $size;
       height: $size;
       display: eleVar('tab', 'simple-angle-display');
-      transition: all $ele-transition;
+      transition: all $transition-base;
       pointer-events: none;
       position: absolute;
       bottom: 0;
@@ -544,7 +544,7 @@
         left: calc(#{$padding} - #{$size} / 2);
         top: 50%;
         transform: translateY(-50%);
-        transition: background-color $ele-transition;
+        transition: background-color $transition-base;
       }
     }
 
@@ -740,7 +740,7 @@
   color: eleVar('tab', 'tool-color');
   font-size: eleVar('tab', 'tool-font-size');
   transition-property: eleVar('tab', 'transition');
-  transition-duration: $ele-transition;
+  transition-duration: $transition-base;
   position: relative;
   cursor: pointer;
 
@@ -884,7 +884,7 @@
           width: $size;
           height: $size;
           display: eleVar('tab', 'simple-angle-display');
-          transition: all $ele-transition;
+          transition: all $transition-base;
           position: absolute;
           bottom: 0;
         }

package/es/ele-tabs/types.d.ts

@@ -63,3 +63,13 @@ export interface TabCurrent {
   /** 鼠标滚轮事件节流 */
   isScroll?: boolean;
 }
+
+/**
+ * 标签页容器属性
+ */
+export interface TabWrapProvide {
+  /** 尺寸 */
+  size?: TabSize;
+  /** 风格类型 */
+  type?: TabType;
+}

package/es/ele-text/style/index.d.ts

@@ -0,0 +1 @@
+