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

package/lib/ele-dropdown/props.cjs

@@ -1,28 +1,75 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const elementPlus = require("element-plus");
+const core = require("../utils/core");
+const props = require("../ele-popover/props");
+const normalizePopoverProps = core.omit(props.popoverProps, [
+  "title",
+  "effect",
+  "content",
+  "width",
+  "placement",
+  "disabled",
+  "popperOptions",
+  "popperClass",
+  "showAfter",
+  "hideAfter",
+  "autoClose",
+  "tabindex",
+  "teleported",
+  "bodyClass",
+  "bodyStyle",
+  "titleStyle",
+  "contentStyle"
+]);
+const normalizeDropdownProps = core.omit(elementPlus.dropdownProps, [
+  "onCommand",
+  "onClick",
+  "onVisibleChange",
+  "onVisible-change"
+]);
 const dropdownProps = {
-  ...elementPlus.dropdownProps,
+  ...normalizePopoverProps,
+  size: String,
+  ...normalizeDropdownProps,
+  /** 下拉框渐变动画 */
+  transition: {
+    type: String,
+    default: "el-zoom-in-top"
+  },
   /** 下拉菜单数据 */
   items: Array,
   /** 选中的菜单 */
-  modelValue: String,
+  modelValue: [String, Number, Object],
   /** 自定义下拉菜单样式 */
   menuStyle: Object,
   /** 自定义图标属性 */
-  iconProps: Object
+  iconProps: Object,
+  /** 下拉菜单使用的组件类型 */
+  componentType: String,
+  /** 是否阻止下拉菜单的右键事件 */
+  preventContextmenu: Boolean,
+  /** 内容按钮属性 */
+  splitButtonProps: Object,
+  /** 箭头按钮属性 */
+  caretButtonProps: Object
 };
 const dropdownEmits = {
-  /** SplitButton 点击事件 */
-  click: () => true,
+  ...props.popoverEmits,
+  /** 内容按钮点击事件 */
+  click: (_e) => true,
   /** 菜单项点击事件 */
   command: (_command) => true,
-  /** 下拉框出现/隐藏事件 */
+  /** 下拉框显示状态改变事件 */
   visibleChange: (_visible) => true,
   /** 更新选中值 */
   "update:modelValue": (_value) => true,
   /** 选中改变的事件 */
   change: (_active) => true
 };
+const elDropdownPropKeys = Object.keys(
+  normalizeDropdownProps
+);
 exports.dropdownEmits = dropdownEmits;
 exports.dropdownProps = dropdownProps;
+exports.elDropdownPropKeys = elDropdownPropKeys;

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

@@ -1,12 +1,54 @@
 import { PropType, ExtractPropTypes } from 'vue';
 import { StyleValue } from '../ele-app/types';
-import { ElIconProps } from '../ele-app/el';
+import { ElIconProps, ElButtonProps } from '../ele-app/el';
 import { DropdownItem } from './types';
 
+declare const normalizeDropdownProps: import('../ele-app/types').Mutable<Omit<{
+    readonly trigger: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>) | ((new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
+    readonly effect: {
+        readonly default: "light";
+        readonly type: import('vue').PropType<string>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        readonly __epPropKey: true;
+    };
+    readonly type: {
+        readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown>) | ((new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown>))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly placement: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => import('element-plus').Placement & {}) | (() => import('element-plus').Placement) | ((new (...args: any[]) => import('element-plus').Placement & {}) | (() => import('element-plus').Placement))[], unknown, unknown, "bottom", boolean>;
+    readonly popperOptions: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => Partial<import('element-plus').Options>) | (() => Partial<import('element-plus').Options>) | ((new (...args: any[]) => Partial<import('element-plus').Options>) | (() => Partial<import('element-plus').Options>))[], unknown, unknown, () => {}, boolean>;
+    readonly id: StringConstructor;
+    readonly size: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly splitButton: BooleanConstructor;
+    readonly hideOnClick: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly loop: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly showTimeout: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
+    readonly hideTimeout: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
+    readonly tabindex: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, 0, boolean>;
+    readonly maxHeight: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, "", boolean>;
+    readonly popperClass: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly disabled: BooleanConstructor;
+    readonly role: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "menu", boolean>;
+    readonly buttonProps: {
+        readonly type: import('vue').PropType<import('element-plus').ButtonProps>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly teleported: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+}, "size" | "trigger">>;
 /**
  * 属性
  */
 export declare const dropdownProps: {
+    /** 下拉框渐变动画 */
+    transition: {
+        type: StringConstructor;
+        default: string;
+    };
     /** 下拉菜单数据 */
     items: PropType<DropdownItem[]>;
     /** 选中的菜单 */
@@ -15,7 +57,20 @@ export declare const dropdownProps: {
     menuStyle: PropType<StyleValue>;
     /** 自定义图标属性 */
     iconProps: PropType<ElIconProps>;
-    trigger: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>) | ((new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
+    /** 下拉菜单使用的组件类型 */
+    componentType: PropType<"pro">;
+    /** 是否阻止下拉菜单的右键事件 */
+    preventContextmenu: BooleanConstructor;
+    /** 内容按钮属性 */
+    splitButtonProps: PropType<ElButtonProps>;
+    /** 箭头按钮属性 */
+    caretButtonProps: PropType<ElButtonProps>;
+    type: {
+        readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown>) | ((new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "text" | "default" | "success" | "warning" | "info" | "primary" | "danger", unknown>))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
     effect: {
         readonly default: "light";
         readonly type: import('vue').PropType<string>;
@@ -23,16 +78,12 @@ export declare const dropdownProps: {
         readonly validator: ((val: unknown) => boolean) | undefined;
         readonly __epPropKey: true;
     };
-    type: {
-        readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger", unknown>) | ((new (...args: any[]) => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger", unknown> & {}) | (() => import('element-plus/es/utils/index').EpPropMergeType<StringConstructor, "" | "default" | "success" | "warning" | "info" | "text" | "primary" | "danger", unknown>))[], unknown, unknown>>;
-        readonly required: false;
-        readonly validator: ((val: unknown) => boolean) | undefined;
-        __epPropKey: true;
-    };
     placement: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => import('element-plus').Placement & {}) | (() => import('element-plus').Placement) | ((new (...args: any[]) => import('element-plus').Placement & {}) | (() => import('element-plus').Placement))[], unknown, unknown, "bottom", boolean>;
+    popperClass: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    teleported: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    disabled: BooleanConstructor;
     popperOptions: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => Partial<import('element-plus').Options>) | (() => Partial<import('element-plus').Options>) | ((new (...args: any[]) => Partial<import('element-plus').Options>) | (() => Partial<import('element-plus').Options>))[], unknown, unknown, () => {}, boolean>;
     id: StringConstructor;
-    size: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
     splitButton: BooleanConstructor;
     hideOnClick: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
     loop: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
@@ -40,8 +91,6 @@ export declare const dropdownProps: {
     hideTimeout: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 150, boolean>;
     tabindex: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, 0, boolean>;
     maxHeight: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (string | number) & {}) | (() => string | number) | ((new (...args: any[]) => (string | number) & {}) | (() => string | number))[], unknown, unknown, "", boolean>;
-    popperClass: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
-    disabled: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
     role: import('element-plus/es/utils/index').EpPropFinalized<StringConstructor, unknown, unknown, "menu", boolean>;
     buttonProps: {
         readonly type: import('vue').PropType<import('element-plus').ButtonProps>;
@@ -49,21 +98,66 @@ export declare const dropdownProps: {
         readonly validator: ((val: unknown) => boolean) | undefined;
         __epPropKey: true;
     };
-    teleported: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    size: PropType<ElButtonProps["size"]>;
+    ariaLabel: StringConstructor;
+    offset: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, undefined, boolean>;
+    bg: StringConstructor;
+    persistent: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    appendTo: {
+        readonly type: import('vue').PropType<import('element-plus/es/utils/index').EpPropMergeType<(new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement) | ((new (...args: any[]) => (string | HTMLElement) & {}) | (() => string | HTMLElement))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    zIndex: NumberConstructor;
+    visible: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => (boolean | null) & {}) | (() => boolean | null) | ((new (...args: any[]) => (boolean | null) & {}) | (() => boolean | null))[], unknown, unknown, null, boolean>;
+    trigger: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>) | ((new (...args: any[]) => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType> & {}) | (() => import('element-plus/es/utils/typescript').Arrayable<import('element-plus').TooltipTriggerType>))[], unknown, unknown, "hover", boolean>;
+    triggerKeys: import('element-plus/es/utils/index').EpPropFinalized<(new (...args: any[]) => string[]) | (() => string[]) | ((new (...args: any[]) => string[]) | (() => string[]))[], unknown, unknown, () => string[], boolean>;
+    popperStyle: PropType<StyleValue>;
+    enterable: {
+        readonly default: true;
+        readonly type: PropType<import('element-plus/es/utils/index').EpPropMergeType<BooleanConstructor, unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        readonly __epPropKey: true;
+    };
+    showArrow: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    arrowOffset: import('element-plus/es/utils/index').EpPropFinalized<NumberConstructor, unknown, unknown, 5, boolean>;
+    virtualRef: {
+        readonly type: import('vue').PropType<import('element-plus').Measurable>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    virtualTriggering: BooleanConstructor;
+    className: StringConstructor;
+    gpuAcceleration: import('element-plus/es/utils/index').EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    arrowBg: StringConstructor;
 };
 export type DropdownProps = ExtractPropTypes<typeof dropdownProps>;
 /**
  * 事件
  */
 export declare const dropdownEmits: {
-    /** SplitButton 点击事件 */
-    click: () => boolean;
+    /** 内容按钮点击事件 */
+    click: (_e: MouseEvent) => boolean;
     /** 菜单项点击事件 */
     command: (_command: DropdownItem["command"]) => boolean;
-    /** 下拉框出现/隐藏事件 */
+    /** 下拉框显示状态改变事件 */
     visibleChange: (_visible: boolean) => boolean;
     /** 更新选中值 */
     'update:modelValue': (_value: DropdownItem["command"]) => boolean;
     /** 选中改变的事件 */
     change: (_active: DropdownItem["command"]) => boolean;
+    'update:visible': (value: boolean) => boolean;
+    'before-enter': () => boolean;
+    'before-leave': () => boolean;
+    'after-enter': () => boolean;
+    'after-leave': () => boolean;
 };
+/**
+ * 属性名
+ */
+export type ElDropdownPropKeys = Array<keyof typeof normalizeDropdownProps>;
+export declare const elDropdownPropKeys: ElDropdownPropKeys;
+export {};

package/lib/ele-dropdown/style/index.cjs

@@ -3,5 +3,8 @@ require("element-plus/es/components/dropdown/style/index");
 require("element-plus/es/components/dropdown-menu/style/index");
 require("element-plus/es/components/dropdown-item/style/index");
 require("element-plus/es/components/icon/style/index");
-require("../../ele-popover/style/index");
+require("element-plus/es/components/scrollbar/style/index");
+require("element-plus/es/components/button-group/style/index");
+require("element-plus/es/components/button/style/index");
+require("../../ele-tooltip/style/index");
 require("./index.scss");

package/lib/ele-dropdown/style/index.scss

@@ -4,22 +4,202 @@
 
 @include set-dropdown-var($ele);
 
-.el-dropdown.ele-dropdown-trigger {
-  color: inherit;
-  font-size: inherit;
-  line-height: inherit;
-}
-
 .ele-dropdown-trigger > .el-tooltip__trigger {
   outline: none;
 }
 
 .ele-dropdown {
-  & > .el-scrollbar {
+  &.ele-popper.ele-popover {
+    min-width: auto;
+    width: max-content;
+  }
+
+  & > .el-scrollbar,
+  & > .ele-dropdown-wrapper {
     background: inherit;
     border-radius: inherit;
   }
+}
+
+.ele-dropdown-menu {
+  padding: eleVar('dropdown', 'padding');
+  box-sizing: border-box;
+}
+
+.ele-dropdown-menu-item {
+  display: flex;
+  align-items: center;
+  height: eleVar('dropdown', 'item-height');
+  line-height: eleVar('dropdown', 'item-height');
+  color: eleVar('dropdown', 'item-color');
+  font-size: eleVar('dropdown', 'item-font-size');
+  padding: eleVar('dropdown', 'item-padding');
+  border-radius: eleVar('dropdown', 'item-radius');
+  transition: (color $transition-base, background-color $transition-base);
+  box-sizing: border-box;
+  position: relative;
+  cursor: pointer;
+
+  & + .ele-dropdown-menu-item {
+    margin-top: eleVar('dropdown', 'item-margin');
+  }
+
+  & > .el-icon {
+    font-size: eleVar('dropdown', 'icon-size');
+    margin: eleVar('dropdown', 'icon-margin');
+  }
+
+  & > .ele-dropdown-menu-item-arrow {
+    color: eleVar('dropdown', 'arrow-color');
+    font-size: eleVar('dropdown', 'arrow-size');
+    padding: eleVar('dropdown', 'arrow-padding');
+    margin: eleVar('dropdown', 'arrow-margin');
+  }
+
+  &:hover,
+  &:focus {
+    color: eleVar('dropdown', 'item-hover-color');
+    background: eleVar('dropdown', 'item-hover-bg');
+  }
+
+  &.is-active {
+    color: eleVar('dropdown', 'item-active-color');
+    background: eleVar('dropdown', 'item-active-bg');
+    font-weight: eleVar('dropdown', 'item-active-font-weight');
+
+    &:hover,
+    &:focus {
+      background: eleVar('dropdown', 'item-active-hover-bg');
+    }
+  }
+
+  &.is-danger {
+    color: eleVar('dropdown', 'item-danger-color');
+
+    &.is-active {
+      background: eleVar('dropdown', 'item-danger-bg');
+
+      &:hover,
+      &:focus {
+        background: eleVar('dropdown', 'item-danger-hover-bg');
+      }
+    }
+  }
+
+  &.is-disabled {
+    color: eleVar('dropdown', 'item-disabled-color');
+    background: none;
+    cursor: not-allowed;
+
+    &.is-active,
+    &.is-active:hover,
+    &.is-active:focus {
+      background: eleVar('dropdown', 'item-disabled-bg');
+    }
+  }
+}
+
+.ele-dropdown-menu-divider {
+  border-top: eleVar('dropdown', 'divider');
+  margin: eleVar('dropdown', 'divider-margin');
+}
+
+.ele-dropdown-caret-button {
+  width: 32px;
+  padding-left: 0;
+  padding-right: 0;
+}
+
+/* 小尺寸 */
+.ele-dropdown-menu.is-small {
+  padding: eleVar('dropdown', 'sm-padding');
+
+  .ele-dropdown-menu-item {
+    height: eleVar('dropdown', 'sm-item-height');
+    line-height: eleVar('dropdown', 'sm-item-height');
+    font-size: eleVar('dropdown', 'sm-item-font-size');
+    padding: eleVar('dropdown', 'sm-item-padding');
+
+    & > .el-icon {
+      font-size: eleVar('dropdown', 'sm-icon-size');
+    }
+  }
+
+  .ele-dropdown-menu-divider {
+    margin: eleVar('dropdown', 'sm-divider-margin');
+  }
+}
+
+/* 大尺寸 */
+.ele-dropdown-menu.is-large {
+  padding: eleVar('dropdown', 'lg-padding');
+
+  .ele-dropdown-menu-item {
+    height: eleVar('dropdown', 'lg-item-height');
+    line-height: eleVar('dropdown', 'lg-item-height');
+    font-size: eleVar('dropdown', 'lg-item-font-size');
+    padding: eleVar('dropdown', 'lg-item-padding');
+
+    & > .el-icon {
+      font-size: eleVar('dropdown', 'lg-icon-size');
+    }
+  }
 
+  .ele-dropdown-menu-divider {
+    margin: eleVar('dropdown', 'lg-divider-margin');
+  }
+}
+
+/* 子菜单 */
+.ele-dropdown-wrapper.is-sub-menu {
+  width: max-content;
+  background: eleVar('popper', 'bg');
+  border: eleVar('popper', 'border');
+  box-shadow: eleVar('popper', 'shadow');
+  border-radius: eleVar('popper', 'radius');
+  position: absolute;
+  left: 100%;
+  top: 0;
+  transform-origin: top left;
+  transition: all $transition-slow;
+
+  &.is-right-end {
+    top: auto;
+    bottom: 0;
+    transform-origin: bottom left;
+  }
+
+  &.is-left-start {
+    left: auto;
+    right: 100%;
+    transform-origin: top right;
+  }
+
+  &.is-left-end {
+    top: auto;
+    bottom: 0;
+    left: auto;
+    right: 100%;
+    transform-origin: bottom right;
+  }
+}
+
+.ele-dropdown-menu-item:not(:hover) > .ele-dropdown-wrapper,
+.ele-dropdown-menu-item.is-disabled > .ele-dropdown-wrapper {
+  opacity: 0;
+  transform: scale(0.6);
+  pointer-events: none;
+  visibility: hidden;
+}
+
+/* ElDropdown */
+.ele-dropdown-trigger.el-dropdown {
+  color: inherit;
+  font-size: inherit;
+  line-height: inherit;
+}
+
+.ele-dropdown {
   .el-dropdown-menu {
     background: none;
     border-radius: 0;
@@ -67,10 +247,33 @@
 
       &.is-active {
         background: eleVar('dropdown', 'item-danger-bg');
+
+        &:hover,
+        &:focus {
+          background: eleVar('dropdown', 'item-danger-hover-bg');
+        }
+      }
+    }
+
+    &.is-disabled {
+      color: eleVar('dropdown', 'item-disabled-color');
+      background: none;
+      cursor: not-allowed;
+
+      &.is-active,
+      &.is-active:hover,
+      &.is-active:focus {
+        background: eleVar('dropdown', 'item-disabled-bg');
+        font-weight: eleVar('dropdown', 'item-active-font-weight');
       }
     }
   }
 
+  .el-dropdown-menu__item--divided {
+    border-top: eleVar('dropdown', 'divider');
+    margin: eleVar('dropdown', 'divider-margin');
+  }
+
   .el-dropdown-menu--small {
     padding: eleVar('dropdown', 'sm-padding');
 
@@ -79,6 +282,14 @@
       line-height: eleVar('dropdown', 'sm-item-height');
       font-size: eleVar('dropdown', 'sm-item-font-size');
       padding: eleVar('dropdown', 'sm-item-padding');
+
+      & > .el-icon {
+        font-size: eleVar('dropdown', 'sm-icon-size');
+      }
+    }
+
+    .el-dropdown-menu__item--divided {
+      margin: eleVar('dropdown', 'sm-divider-margin');
     }
   }
 
@@ -90,6 +301,14 @@
       line-height: eleVar('dropdown', 'lg-item-height');
       font-size: eleVar('dropdown', 'lg-item-font-size');
       padding: eleVar('dropdown', 'lg-item-padding');
+
+      & > .el-icon {
+        font-size: eleVar('dropdown', 'lg-icon-size');
+      }
+    }
+
+    .el-dropdown-menu__item--divided {
+      margin: eleVar('dropdown', 'lg-divider-margin');
     }
   }
 }

package/lib/ele-dropdown/types.d.ts

@@ -17,6 +17,6 @@ export interface DropdownItem extends ElDropdownItemProps {
   slot?: Exclude<string, 'default'>;
   /** 是否为危险样式 */
   danger?: boolean;
-  /** 显示条件 */
-  vIf?: any;
+  /** 子菜单 */
+  children?: DropdownItem[];
 }

package/lib/ele-edit-tag/index.d.ts

@@ -54,12 +54,12 @@ declare const _default: import('vue').DefineComponent<{
     readonly: BooleanConstructor;
     disabled: BooleanConstructor;
 }>> & {
-    onChange?: ((_value?: string[] | undefined) => any) | undefined;
     "onUpdate:modelValue"?: ((_value?: string[] | undefined) => any) | undefined;
+    onChange?: ((_value?: string[] | undefined) => any) | undefined;
 }, {
     disabled: boolean;
-    readonly: boolean;
     round: boolean;
+    readonly: boolean;
     hit: boolean;
 }, {}>;
 export default _default;