ele-admin-plus 1.2.1-beta.1 → 1.2.1-beta.3

package/es/utils/hook.js

@@ -1,23 +1,28 @@
-import { onBeforeUnmount } from "vue";
+import { ref, onBeforeUnmount } from "vue";
 function useTimer(ms, cb) {
   let timer = null;
+  const waiting = ref(false);
   const stopTimer = () => {
     if (timer != null) {
       clearTimeout(timer);
       timer = null;
     }
+    waiting.value = false;
   };
   const startTimer = (callback, timeout) => {
     stopTimer();
-    timer = setTimeout(
-      callback ?? cb,
-      timeout ?? (typeof ms === "function" ? ms() : ms)
-    );
+    waiting.value = true;
+    const to = timeout ?? (typeof ms === "function" ? ms() : ms);
+    timer = setTimeout(() => {
+      const func = callback ?? cb;
+      func && func();
+      waiting.value = false;
+    }, to);
   };
   onBeforeUnmount(() => {
     stopTimer();
   });
-  return [startTimer, stopTimer];
+  return [startTimer, stopTimer, waiting];
 }
 function useMediaQuery(query, onChange) {
   const mediaQuery = window.matchMedia(query);
@@ -103,9 +108,153 @@ function useCollapseAnim() {
     handleAfterLeave
   };
 }
+function useMousewheel(cb) {
+  const handleMousewheel = (e) => {
+    const delta = e.wheelDelta || e.detail;
+    cb && cb({ e, direction: delta > 0 ? "up" : "down" });
+  };
+  const handleFirefoxMousewheel = (e) => {
+    const delta = e.wheelDelta || e.detail;
+    cb && cb({ e, direction: delta < 0 ? "up" : "down" });
+  };
+  const bindMousewheel = (el) => {
+    el.addEventListener("mousewheel", handleMousewheel, { passive: false });
+    el.addEventListener("DOMMouseScroll", handleFirefoxMousewheel);
+  };
+  const unbindMousewheel = (el) => {
+    el.removeEventListener("mousewheel", handleMousewheel);
+    el.removeEventListener("DOMMouseScroll", handleFirefoxMousewheel);
+  };
+  return {
+    handleMousewheel,
+    handleFirefoxMousewheel,
+    bindMousewheel,
+    unbindMousewheel
+  };
+}
+function useTouchEvent(option) {
+  let startX = null;
+  let startY = null;
+  let distanceX = null;
+  let distanceY = null;
+  const handleTouchStart = (e) => {
+    startX = e.touches[0].clientX;
+    startY = e.touches[0].clientY;
+    if (option && option.start) {
+      option.start({ e, startX, startY });
+    }
+  };
+  const handleTouchMove = (e) => {
+    if (startX != null && startY != null) {
+      const currentX = e.touches[0].clientX;
+      const currentY = e.touches[0].clientY;
+      distanceX = currentX - startX;
+      distanceY = currentY - startY;
+      if (option && option.move) {
+        option.move({ e, startX, startY, distanceX, distanceY });
+      }
+    }
+  };
+  const handleTouchEnd = (e) => {
+    if (option && option.end) {
+      option.end({ e, startX, startY, distanceX, distanceY });
+    }
+    startX = null;
+    startY = null;
+    distanceX = null;
+    distanceY = null;
+  };
+  const bindTouchEvent = (el) => {
+    el.addEventListener("touchstart", handleTouchStart);
+    el.addEventListener("touchmove", handleTouchMove);
+    el.addEventListener("touchend", handleTouchEnd);
+  };
+  const unbindTouchEvent = (el) => {
+    el.removeEventListener("touchstart", handleTouchStart);
+    el.removeEventListener("touchmove", handleTouchMove);
+    el.removeEventListener("touchend", handleTouchEnd);
+  };
+  return {
+    handleTouchStart,
+    handleTouchMove,
+    handleTouchEnd,
+    bindTouchEvent,
+    unbindTouchEvent
+  };
+}
+function useMoveEvent(option) {
+  let startX = null;
+  let startY = null;
+  let distanceX = null;
+  let distanceY = null;
+  const unbindEvent = () => {
+    document.removeEventListener("mousemove", mousemoveFn);
+    document.removeEventListener("mouseup", mouseupFn);
+    document.removeEventListener("touchmove", touchmoveFn);
+    document.removeEventListener("touchend", touchendFn);
+  };
+  const emitStart = (clientX, clientY, e) => {
+    startX = clientX;
+    startY = clientY;
+    if (option && option.start) {
+      option.start({ e, startX, startY });
+    }
+  };
+  const emitMove = (currentX, currentY, e) => {
+    if (startX != null && startY != null) {
+      distanceX = currentX - startX;
+      distanceY = currentY - startY;
+      if (option && option.move) {
+        option.move({ e, startX, startY, distanceX, distanceY });
+      }
+    }
+  };
+  const emitEnd = (e) => {
+    unbindEvent();
+    if (option && option.end) {
+      option.end({ e, startX, startY, distanceX, distanceY });
+    }
+    startX = null;
+    startY = null;
+    distanceX = null;
+    distanceY = null;
+  };
+  const mousemoveFn = function(e) {
+    emitMove(e.clientX, e.clientY, e);
+  };
+  const touchmoveFn = function(e) {
+    emitMove(e.touches[0].clientX, e.touches[0].clientY, e);
+  };
+  const mouseupFn = (e) => {
+    emitEnd(e);
+  };
+  const touchendFn = (e) => {
+    emitEnd(e);
+  };
+  const handleMousedown = (e) => {
+    emitStart(e.clientX, e.clientY, e);
+    document.addEventListener("mousemove", mousemoveFn);
+    document.addEventListener("mouseup", mouseupFn);
+  };
+  const handleTouchstart = (e) => {
+    emitStart(e.touches[0].clientX, e.touches[0].clientY, e);
+    document.addEventListener("touchmove", touchmoveFn);
+    document.addEventListener("touchend", touchendFn);
+  };
+  onBeforeUnmount(() => {
+    unbindEvent();
+  });
+  return {
+    handleMousedown,
+    handleTouchstart
+  };
+}
 export {
   useCollapseAnim,
   useMediaQuery,
+  useMousewheel,
+  useMoveEvent,
   useTimer,
+  useTouchEvent,
   useWindowListener
 };

package/lib/ele-admin-layout/index.d.ts

@@ -3,7 +3,10 @@ import { MenuItem } from '../ele-menus/types';
 import { TabPaneItem, TabEventOption } from '../ele-tabs/types';
 
 declare const _default: import('vue').DefineComponent<{
-    height: (StringConstructor | NumberConstructor)[];
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
     headerMenus: import('vue').PropType<MenuItem[]>;
     headerActive: StringConstructor;
     sidebarMenus: import('vue').PropType<MenuItem[]>;
@@ -56,7 +59,6 @@ declare const _default: import('vue').DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    /** 是否双侧栏布局 */
     sideboxTitleSlot: {
         type: StringConstructor;
         default: string;
@@ -65,16 +67,16 @@ declare const _default: import('vue').DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    headerCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sidebarCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sideboxCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    tabsCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    contentCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    logoStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    logoTitleStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    headerMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sidebarMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sideboxMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    headerCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sidebarCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sideboxCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    tabsCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    contentCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    logoStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    logoTitleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    headerMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sidebarMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sideboxMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     logoSrc: StringConstructor;
     logoTitle: StringConstructor;
     menuScrollToActive: {
@@ -161,7 +163,10 @@ declare const _default: import('vue').DefineComponent<{
     tabSortChange: (_data: TabPaneItem[]) => boolean;
     contentMounted: (_contentEl: HTMLElement, _modalsEl: HTMLElement) => boolean;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
-    height: (StringConstructor | NumberConstructor)[];
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
     headerMenus: import('vue').PropType<MenuItem[]>;
     headerActive: StringConstructor;
     sidebarMenus: import('vue').PropType<MenuItem[]>;
@@ -214,7 +219,6 @@ declare const _default: import('vue').DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    /** 是否双侧栏布局 */
     sideboxTitleSlot: {
         type: StringConstructor;
         default: string;
@@ -223,16 +227,16 @@ declare const _default: import('vue').DefineComponent<{
         type: StringConstructor;
         default: string;
     };
-    headerCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sidebarCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sideboxCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    tabsCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    contentCustomStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    logoStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    logoTitleStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    headerMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sidebarMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    sideboxMenusStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    headerCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sidebarCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sideboxCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    tabsCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    contentCustomStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    logoStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    logoTitleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    headerMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sidebarMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    sideboxMenusStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     logoSrc: StringConstructor;
     logoTitle: StringConstructor;
     menuScrollToActive: {
@@ -266,6 +270,7 @@ declare const _default: import('vue').DefineComponent<{
     onSideMouseleave?: ((_e: MouseEvent) => any) | undefined;
     onContentMounted?: ((_contentEl: HTMLElement, _modalsEl: HTMLElement) => any) | undefined;
 }, {
+    height: string | number;
     collapse: boolean;
     compact: boolean;
     tabStyle: import('./types').TabStyle;

package/lib/ele-admin-layout/props.cjs

@@ -2,7 +2,10 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const adminLayoutProps = {
   /** 高度 */
-  height: [String, Number],
+  height: {
+    type: [String, Number],
+    default: "100%"
+  },
   /** 顶栏菜单数据 */
   headerMenus: Array,
   /** 顶栏菜单选中 */

package/lib/ele-admin-layout/props.d.ts

@@ -1,4 +1,5 @@
 import { PropType, ExtractPropTypes, InjectionKey } from 'vue';
+import { StyleValue } from '../ele-app/types';
 import { EleMenusProps, EleBreadcrumbProps, EleBacktopProps, EleDropdownProps } from '../ele-app/plus';
 import { MenuItem } from '../ele-menus/types';
 import { BreadcrumbItem } from '../ele-breadcrumb/types';
@@ -10,7 +11,10 @@ import { Layout, SidebarLayout, HeaderStyle, SidebarStyle, TabStyle, TabBar, Max
  */
 export declare const adminLayoutProps: {
     /** 高度 */
-    height: (StringConstructor | NumberConstructor)[];
+    height: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: string;
+    };
     /** 顶栏菜单数据 */
     headerMenus: PropType<MenuItem[]>;
     /** 顶栏菜单选中 */
@@ -111,25 +115,25 @@ export declare const adminLayoutProps: {
         default: string;
     };
     /** 顶栏样式 */
-    headerCustomStyle: PropType<Partial<import('vue').CSSProperties>>;
+    headerCustomStyle: PropType<StyleValue>;
     /** 侧栏样式 */
-    sidebarCustomStyle: PropType<Partial<import('vue').CSSProperties>>;
+    sidebarCustomStyle: PropType<StyleValue>;
     /** 双侧栏一级样式 */
-    sideboxCustomStyle: PropType<Partial<import('vue').CSSProperties>>;
+    sideboxCustomStyle: PropType<StyleValue>;
     /** 页签栏样式 */
-    tabsCustomStyle: PropType<Partial<import('vue').CSSProperties>>;
+    tabsCustomStyle: PropType<StyleValue>;
     /** 内容区样式 */
-    contentCustomStyle: PropType<Partial<import('vue').CSSProperties>>;
+    contentCustomStyle: PropType<StyleValue>;
     /** logo样式 */
-    logoStyle: PropType<Partial<import('vue').CSSProperties>>;
+    logoStyle: PropType<StyleValue>;
     /** logo文字样式 */
-    logoTitleStyle: PropType<Partial<import('vue').CSSProperties>>;
+    logoTitleStyle: PropType<StyleValue>;
     /** 顶栏菜单样式 */
-    headerMenusStyle: PropType<Partial<import('vue').CSSProperties>>;
+    headerMenusStyle: PropType<StyleValue>;
     /** 侧栏菜单样式 */
-    sidebarMenusStyle: PropType<Partial<import('vue').CSSProperties>>;
+    sidebarMenusStyle: PropType<StyleValue>;
     /** 双侧栏一级菜单样式 */
-    sideboxMenusStyle: PropType<Partial<import('vue').CSSProperties>>;
+    sideboxMenusStyle: PropType<StyleValue>;
     /** logo图片地址 */
     logoSrc: StringConstructor;
     /** logo文字 */

package/lib/ele-admin-layout/style/index.scss

@@ -14,7 +14,8 @@
   background: eleVar('layout', 'bg');
   box-sizing: border-box;
   position: relative;
-  min-height: 100%;
+  min-height: 100vh;
+  min-height: 100dvh;
 
   & > .ele-admin-header {
     z-index: calc(#{eleVar('layout', 'index')} + 4);
@@ -103,7 +104,11 @@
 
 .ele-admin-layout {
   /* 固定主体 */
-  &.is-fixed-body,
+  &.is-fixed-body {
+    height: 100vh;
+    height: 100dvh;
+  }
+
   &.is-fixed-body > .ele-admin-main,
   &.is-fixed-body > .ele-admin-main > .ele-admin-body,
   &.is-fixed-body > .ele-admin-main > .ele-admin-side,

package/lib/ele-admin-layout/style/sidebar.scss

@@ -139,6 +139,8 @@
   position: sticky;
   left: 0;
   top: 0;
+  height: 100vh;
+  height: 100dvh;
 }
 
 .ele-admin-side.show-placeholder {

package/lib/ele-alert/index.cjs

@@ -20,7 +20,7 @@ const _sfc_main = vue.defineComponent({
     const isRich = vue.computed(() => {
       return !!props2.description || !!slots.default;
     });
-    const onClose = (e) => {
+    const handleClose = (e) => {
       if (!visible.value || !props2.closable) {
         return;
       }
@@ -32,7 +32,7 @@ const _sfc_main = vue.defineComponent({
         visible.value = true;
       }
     };
-    return { visible, isRich, onClose, open };
+    return { visible, isRich, handleClose, open };
   }
 });
 const _export_sfc = (sfc, props2) => {
@@ -106,7 +106,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           key: 1,
           class: "ele-alert-close",
           style: vue.normalizeStyle(_ctx.closeIconStyle),
-          onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClose && _ctx.onClose(...args))
+          onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClose && _ctx.handleClose(...args))
         }, [
           vue.renderSlot(_ctx.$slots, "closeIcon", {}, () => [
             _ctx.closeText ? (vue.openBlock(), vue.createElementBlock("span", _hoisted_1, vue.toDisplayString(_ctx.closeText), 1)) : (vue.openBlock(), vue.createBlock(_component_ElIcon, vue.normalizeProps(vue.mergeProps({ key: 1 }, _ctx.closeIconProps || {})), {

package/lib/ele-alert/index.d.ts

@@ -1,6 +1,6 @@
 declare const _default: import('vue').DefineComponent<{
     title: StringConstructor;
-    type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "success" | "warning" | "error" | "info", unknown> | undefined>;
+    type: import('vue').PropType<import('../ele-app/el').ElAlertProps["type"]>;
     description: StringConstructor;
     closable: {
         type: BooleanConstructor;
@@ -9,14 +9,14 @@ declare const _default: import('vue').DefineComponent<{
     center: BooleanConstructor;
     closeText: StringConstructor;
     showIcon: BooleanConstructor;
-    effect: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "light" | "dark", unknown> | undefined>;
-    iconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    effect: import('vue').PropType<import('../ele-app/el').ElAlertProps["effect"]>;
+    iconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     iconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    closeIconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    closeIconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     closeIconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    bodyStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    titleStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    descriptionStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    bodyStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    titleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    descriptionStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     transitionName: {
         type: StringConstructor;
         default: string;
@@ -24,13 +24,13 @@ declare const _default: import('vue').DefineComponent<{
 }, {
     visible: import('vue').Ref<boolean>;
     isRich: import('vue').ComputedRef<boolean>;
-    onClose: (e: MouseEvent) => void;
+    handleClose: (e: MouseEvent) => void;
     open: () => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     close: (_e: MouseEvent) => boolean;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     title: StringConstructor;
-    type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "success" | "warning" | "error" | "info", unknown> | undefined>;
+    type: import('vue').PropType<import('../ele-app/el').ElAlertProps["type"]>;
     description: StringConstructor;
     closable: {
         type: BooleanConstructor;
@@ -39,14 +39,14 @@ declare const _default: import('vue').DefineComponent<{
     center: BooleanConstructor;
     closeText: StringConstructor;
     showIcon: BooleanConstructor;
-    effect: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "light" | "dark", unknown> | undefined>;
-    iconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    effect: import('vue').PropType<import('../ele-app/el').ElAlertProps["effect"]>;
+    iconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     iconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    closeIconStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    closeIconStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     closeIconProps: import('vue').PropType<import('../ele-app/el').ElIconProps>;
-    bodyStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    titleStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
-    descriptionStyle: import('vue').PropType<Partial<import('vue').CSSProperties>>;
+    bodyStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    titleStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
+    descriptionStyle: import('vue').PropType<import('../ele-app/types').StyleValue>;
     transitionName: {
         type: StringConstructor;
         default: string;

package/lib/ele-alert/props.d.ts

@@ -1,5 +1,6 @@
 import { PropType, ExtractPropTypes } from 'vue';
-import { ElIconProps } from '../ele-app/el';
+import { StyleValue } from '../ele-app/types';
+import { ElAlertProps, ElIconProps } from '../ele-app/el';
 
 /**
  * 属性
@@ -8,7 +9,7 @@ export declare const alertProps: {
     /** 标题 */
     title: StringConstructor;
     /** 类型 */
-    type: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "success" | "warning" | "error" | "info", unknown> | undefined>;
+    type: PropType<ElAlertProps["type"]>;
     /** 描述 */
     description: StringConstructor;
     /** 是否可关闭 */
@@ -23,21 +24,21 @@ export declare const alertProps: {
     /** 是否显示图标 */
     showIcon: BooleanConstructor;
     /** 主题 */
-    effect: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "light" | "dark", unknown> | undefined>;
+    effect: PropType<ElAlertProps["effect"]>;
     /** 图标样式 */
-    iconStyle: PropType<Partial<import('vue').CSSProperties>>;
+    iconStyle: PropType<StyleValue>;
     /** 图标组件属性 */
     iconProps: PropType<ElIconProps>;
     /** 关闭图标样式 */
-    closeIconStyle: PropType<Partial<import('vue').CSSProperties>>;
+    closeIconStyle: PropType<StyleValue>;
     /** 关闭图标组件属性 */
     closeIconProps: PropType<ElIconProps>;
     /** 内容区样式 */
-    bodyStyle: PropType<Partial<import('vue').CSSProperties>>;
+    bodyStyle: PropType<StyleValue>;
     /** 标题样式 */
-    titleStyle: PropType<Partial<import('vue').CSSProperties>>;
+    titleStyle: PropType<StyleValue>;
     /** 描述样式 */
-    descriptionStyle: PropType<Partial<import('vue').CSSProperties>>;
+    descriptionStyle: PropType<StyleValue>;
     /** 过渡动画名称 */
     transitionName: {
         type: StringConstructor;

package/lib/ele-app/components/message-body.cjs

@@ -37,7 +37,7 @@ const _sfc_main = vue.defineComponent({
     vue.onBeforeUnmount(() => {
       emit("messageDestroy", props.messageId);
     });
-    return { onClose: () => emit("close") };
+    return { handleClose: () => emit("close") };
   }
 });
 const _export_sfc = (sfc, props) => {
@@ -82,7 +82,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _ctx.showClose ? (vue.openBlock(), vue.createElementBlock("div", {
       key: 0,
       class: "ele-message-close",
-      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.onClose && _ctx.onClose(...args))
+      onClick: _cache[0] || (_cache[0] = (...args) => _ctx.handleClose && _ctx.handleClose(...args))
     }, [
       vue.createVNode(_component_ElIcon, null, {
         default: vue.withCtx(() => [

package/lib/ele-app/components/message-body.d.ts

@@ -1,12 +1,13 @@
 import { PropType } from 'vue';
+import { ElMessageOptions } from '../el';
 
 declare const _default: import('vue').DefineComponent<{
     /** 内容 */
     message: StringConstructor;
     /** 类型 */
-    type: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "success" | "warning" | "error" | "info", unknown> | undefined>;
+    type: PropType<ElMessageOptions["type"]>;
     /** 图标 */
-    icon: PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) | ((new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>))[], unknown, unknown> | undefined>;
+    icon: PropType<ElMessageOptions["icon"]>;
     /** 是否显示关闭按钮 */
     showClose: BooleanConstructor;
     /** 内容是否是富文本 */
@@ -16,7 +17,7 @@ declare const _default: import('vue').DefineComponent<{
     /** 标识id */
     messageId: StringConstructor;
 }, {
-    onClose: () => void;
+    handleClose: () => void;
 }, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     close: () => true;
     messageDestroy: (_messageId?: string) => true;
@@ -24,9 +25,9 @@ declare const _default: import('vue').DefineComponent<{
     /** 内容 */
     message: StringConstructor;
     /** 类型 */
-    type: PropType<import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "success" | "warning" | "error" | "info", unknown> | undefined>;
+    type: PropType<ElMessageOptions["type"]>;
     /** 图标 */
-    icon: PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) | ((new (...args: any[]) => (string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>) & {}) | (() => string | import('vue').Component<any, any, any, import('vue').ComputedOptions, import('vue').MethodOptions, {}, any>))[], unknown, unknown> | undefined>;
+    icon: PropType<ElMessageOptions["icon"]>;
     /** 是否显示关闭按钮 */
     showClose: BooleanConstructor;
     /** 内容是否是富文本 */

package/lib/ele-app/components/message-box-icon.d.ts

@@ -1,10 +1,11 @@
 import { PropType } from 'vue';
+import { ElMessageBoxOptions } from '../el';
 
 declare const _default: import('vue').DefineComponent<{
     /** 类型 */
-    type: PropType<("" | "success" | "warning" | "error" | "info") | undefined>;
+    type: PropType<ElMessageBoxOptions["type"]>;
     /** 图标 */
-    icon: PropType<string | import('vue').Component | undefined>;
+    icon: PropType<ElMessageBoxOptions["icon"]>;
     /** 标识id */
     boxId: StringConstructor;
 }, {}, unknown, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
@@ -15,16 +16,16 @@ declare const _default: import('vue').DefineComponent<{
     }) => true;
 }, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
     /** 类型 */
-    type: PropType<("" | "success" | "warning" | "error" | "info") | undefined>;
+    type: PropType<ElMessageBoxOptions["type"]>;
     /** 图标 */
-    icon: PropType<string | import('vue').Component | undefined>;
+    icon: PropType<ElMessageBoxOptions["icon"]>;
     /** 标识id */
     boxId: StringConstructor;
 }>> & {
     onBoxDestroy?: ((_boxId?: string | undefined) => any) | undefined;
     onBoxMounted?: ((_: {
-        boxId?: string | undefined;
-        doClose?: (() => void) | undefined;
+        boxId?: string;
+        doClose?: () => void;
     }) => any) | undefined;
 }, {}, {}>;
 export default _default;

package/lib/ele-app/plus.d.ts

@@ -23,6 +23,7 @@ import type { TableProps } from '../ele-table/props';
 import type EleTabs from '../ele-tabs/index';
 import type EleText from '../ele-text/index';
 import type { TextProps } from '../ele-text/props';
+import type EleTool from '../ele-tool/index';
 import type { ToolProps } from '../ele-tool/props';
 import type { ToolbarProps } from '../ele-toolbar/props';
 import type EleTooltip from '../ele-tooltip/index';
@@ -137,6 +138,8 @@ export type EleTextProps = ComponentProps<TextProps>;
 /**
  * EleTool
  */
+export type EleToolInstance = InstanceType<typeof EleTool> | null;
+
 export type EleToolProps = Partial<ToolProps>;
 
 /**