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

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,151 @@
 
 @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 {
+  &.ele-popper.ele-popover {
+    min-width: auto;
+    width: max-content;
+  }
+
   & > .el-scrollbar {
     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;
+  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');
+  }
+
+  &: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');
+  }
+}
+
+/* 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 +196,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 +231,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 +250,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,4 @@ export interface DropdownItem extends ElDropdownItemProps {
   slot?: Exclude<string, 'default'>;
   /** 是否为危险样式 */
   danger?: boolean;
-  /** 显示条件 */
-  vIf?: any;
 }

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;

package/lib/ele-file-list/components/file-grid-item.cjs

@@ -1,9 +1,7 @@
 "use strict";
 const vue = require("vue");
-const EleDropdown = require("../../ele-dropdown/index");
 const _sfc_main = vue.defineComponent({
   name: "FileGridItem",
-  components: { EleDropdown },
   props: {
     /** 数据 */
     item: {
@@ -18,20 +16,16 @@ const _sfc_main = vue.defineComponent({
     current: Object,
     /** 后缀对应的图标 */
     icons: Array,
-    /** 右键菜单 */
-    contextMenus: Array,
-    /** 右键菜单属性 */
-    contextMenuProps: Object
+    /** 右键下拉菜单是否显示 */
+    ctxMenuDropdownVisible: Boolean
   },
   emits: {
     click: (_item) => true,
     checkChange: (_item) => true,
-    contextMenu: (_option) => true,
-    contextOpen: (_ref) => true
+    contextOpen: (_option) => true
   },
   setup(props, { emit }) {
-    const dropdownRef = vue.ref(null);
-    const dropdownVisible = vue.ref(false);
+    const dropdownTriggerRef = vue.ref(null);
     const selectable = vue.computed(() => {
       return props.selectionType === "checkbox" || props.selectionType === "radio";
     });
@@ -75,32 +69,22 @@ const _sfc_main = vue.defineComponent({
       emit("checkChange", props.item);
     };
     const handleContextmenu = (e) => {
-      e.preventDefault();
-      e.stopPropagation();
-      if (dropdownRef.value) {
-        dropdownRef.value.handleOpen();
-      }
-    };
-    const handleItemContextMenu = (command) => {
-      emit("contextMenu", { key: command, item: props.item });
-    };
-    const handleContextVisibleChange = (visible) => {
-      dropdownVisible.value = visible;
-      if (visible) {
-        emit("contextOpen", dropdownRef.value);
+      if (dropdownTriggerRef.value != null) {
+        emit("contextOpen", {
+          item: props.item,
+          triggerEl: dropdownTriggerRef.value,
+          e
+        });
       }
     };
     return {
-      dropdownRef,
-      dropdownVisible,
+      dropdownTriggerRef,
       selectable,
       selected,
       icon,
       handleClick,
       handleCheckChange,
-      handleContextmenu,
-      handleItemContextMenu,
-      handleContextVisibleChange
+      handleContextmenu
     };
   }
 });
@@ -119,12 +103,11 @@ const _hoisted_5 = [
   _hoisted_4
 ];
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_EleDropdown = vue.resolveComponent("EleDropdown");
   return vue.openBlock(), vue.createElementBlock("div", {
     class: vue.normalizeClass([
       "ele-file-list-item",
       { "is-checked": _ctx.selected },
-      { "is-active": _ctx.dropdownVisible }
+      { "is-active": _ctx.ctxMenuDropdownVisible }
     ]),
     onClick: _cache[3] || (_cache[3] = vue.withModifiers((...args) => _ctx.handleClick && _ctx.handleClick(...args), ["stop"]))
   }, [
@@ -155,34 +138,12 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
       class: "ele-file-list-item-checkbox",
       onClick: _cache[1] || (_cache[1] = vue.withModifiers((...args) => _ctx.handleCheckChange && _ctx.handleCheckChange(...args), ["stop"]))
     }, _hoisted_5)) : vue.createCommentVNode("", true),
-    _ctx.contextMenus || _ctx.$slots.contextMenu ? (vue.openBlock(), vue.createBlock(_component_EleDropdown, vue.mergeProps({
-      key: 1,
-      placement: "bottom-start",
-      popperClass: "ele-file-list-item-context"
-    }, _ctx.contextMenuProps || {}, {
-      ref: "dropdownRef",
-      trigger: "click",
+    vue.createElementVNode("div", {
+      ref: "dropdownTriggerRef",
       class: "ele-file-list-item-dropdown",
-      items: _ctx.contextMenus,
-      onCommand: _ctx.handleItemContextMenu,
-      onVisibleChange: _ctx.handleContextVisibleChange
-    }), vue.createSlots({
-      default: vue.withCtx(() => [
-        vue.createElementVNode("div", {
-          onClick: _cache[2] || (_cache[2] = vue.withModifiers(() => {
-          }, ["stop"]))
-        })
-      ]),
-      _: 2
-    }, [
-      _ctx.$slots.contextMenu ? {
-        name: "dropdownMenu",
-        fn: vue.withCtx(() => [
-          vue.renderSlot(_ctx.$slots, "contextMenu", { item: _ctx.item })
-        ]),
-        key: "0"
-      } : void 0
-    ]), 1040, ["items", "onCommand", "onVisibleChange"])) : vue.createCommentVNode("", true)
+      onClick: _cache[2] || (_cache[2] = vue.withModifiers(() => {
+      }, ["stop"]))
+    }, null, 512)
   ], 2);
 }
 const fileGridItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);