@element-plus/nightly 0.0.20220114 → 0.0.20220118

package/es/components/dropdown/src/dropdown.vue.d.ts

@@ -2,6 +2,7 @@ import type { CSSProperties } from 'vue';
 declare const _default: import("vue").DefineComponent<{
     readonly type: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<import("../../../utils/props").BuildPropType<StringConstructor, "" | "default" | "primary" | "success" | "warning" | "info" | "danger" | "text", unknown>>, unknown, unknown, unknown, unknown>;
     readonly placement: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<import("@popperjs/core").Placement>, "bottom", unknown, unknown, unknown>;
+    readonly popperOptions: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<Partial<import("@popperjs/core").Options>>, () => {}, unknown, unknown, unknown>;
     readonly size: import("../../../utils/props").BuildPropReturn<StringConstructor, "", unknown, unknown, unknown>;
     readonly splitButton: BooleanConstructor;
     readonly hideOnClick: import("../../../utils/props").BuildPropReturn<BooleanConstructor, true, unknown, unknown, unknown>;
@@ -41,9 +42,8 @@ declare const _default: import("vue").DefineComponent<{
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -106,6 +106,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -159,9 +160,8 @@ declare const _default: import("vue").DefineComponent<{
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -224,6 +224,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -241,7 +242,7 @@ declare const _default: import("vue").DefineComponent<{
             virtualTriggering?: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown> | undefined;
         }> & {
             [x: string & `on${string}`]: ((...args: any[]) => any) | undefined;
-        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "visible" | "content" | "effect" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
+        } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, "disabled" | "style" | "transition" | "offset" | "effect" | "visible" | "arrowOffset" | "boundariesPadding" | "fallbackPlacements" | "gpuAcceleration" | "placement" | "popperOptions" | "strategy" | "className" | "enterable" | "pure" | "popperClass" | "popperStyle" | "referenceEl" | "stopPopperMouseEvent" | "content" | "showAfter" | "hideAfter" | "appendTo" | "rawContent" | "persistent" | "teleported" | "trigger" | "virtualRef" | "virtualTriggering" | "openDelay" | "visibleArrow" | "showArrow">;
         $attrs: {
             [x: string]: unknown;
         };
@@ -296,9 +297,8 @@ declare const _default: import("vue").DefineComponent<{
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -361,6 +361,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -420,6 +421,7 @@ declare const _default: import("vue").DefineComponent<{
                 $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
             } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("../..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
             open: import("vue").Ref<boolean>;
+            hide: () => void;
             updatePopper: () => void;
             onOpen: () => void;
             onClose: () => void;
@@ -428,9 +430,8 @@ declare const _default: import("vue").DefineComponent<{
             style: import("vue").StyleValue;
             transition: string;
             offset: number;
-            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-            content: string;
             effect: string;
+            visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
             arrowOffset: number;
             boundariesPadding: number;
             fallbackPlacements: import("@popperjs/core").Placement[];
@@ -493,6 +494,7 @@ declare const _default: import("vue").DefineComponent<{
             popperStyle: import("vue").StyleValue;
             referenceEl: HTMLElement;
             stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+            content: string;
             showAfter: number;
             hideAfter: number;
             appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -566,9 +568,8 @@ declare const _default: import("vue").DefineComponent<{
         style: import("vue").StyleValue;
         transition: string;
         offset: number;
-        visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
-        content: string;
         effect: string;
+        visible: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<boolean | null>, unknown, unknown>;
         arrowOffset: number;
         boundariesPadding: number;
         fallbackPlacements: import("@popperjs/core").Placement[];
@@ -631,6 +632,7 @@ declare const _default: import("vue").DefineComponent<{
         popperStyle: import("vue").StyleValue;
         referenceEl: HTMLElement;
         stopPopperMouseEvent: import("../../../utils/props").BuildPropType<BooleanConstructor, unknown, unknown>;
+        content: string;
         showAfter: number;
         hideAfter: number;
         appendTo: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | HTMLElement>, unknown, unknown>;
@@ -690,6 +692,7 @@ declare const _default: import("vue").DefineComponent<{
             $watch(source: string | Function, cb: Function, options?: import("vue").WatchOptions<boolean> | undefined): import("vue").WatchStopHandle;
         } & Readonly<{} & {} & {}> & import("vue").ShallowUnwrapRef<import("../..").ElPopperInjectionContext> & {} & {} & import("vue").ComponentCustomProperties) | null>;
         open: import("vue").Ref<boolean>;
+        hide: () => void;
         updatePopper: () => void;
         onOpen: () => void;
         onClose: () => void;
@@ -699,6 +702,7 @@ declare const _default: import("vue").DefineComponent<{
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("click" | "visible-change" | "command")[], "click" | "visible-change" | "command", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly type?: unknown;
     readonly placement?: unknown;
+    readonly popperOptions?: unknown;
     readonly size?: unknown;
     readonly splitButton?: unknown;
     readonly hideOnClick?: unknown;
@@ -714,6 +718,7 @@ declare const _default: import("vue").DefineComponent<{
     size: string;
     effect: string;
     placement: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<import("@popperjs/core").Placement>, unknown, unknown>;
+    popperOptions: Partial<import("@popperjs/core").Options>;
     popperClass: string;
     maxHeight: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number>, unknown, unknown>;
     trigger: "click" | "contextmenu" | "focus" | "hover" | ("click" | "contextmenu" | "focus" | "hover")[];
@@ -734,6 +739,7 @@ declare const _default: import("vue").DefineComponent<{
     size: string;
     effect: string;
     placement: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<import("@popperjs/core").Placement>, unknown, unknown>;
+    popperOptions: Partial<import("@popperjs/core").Options>;
     popperClass: string;
     maxHeight: import("../../../utils/props").BuildPropType<import("../../../utils/props").PropWrapper<string | number>, unknown, unknown>;
     trigger: "click" | "contextmenu" | "focus" | "hover" | ("click" | "contextmenu" | "focus" | "hover")[];

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

@@ -1 +1 @@
-{"version":3,"file":"dropdown.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/dropdown/src/dropdown.vue"],"sourcesContent":["<template>\n  <div class=\"el-dropdown\">\n    <el-tooltip\n      ref=\"popperRef\"\n      :effect=\"effect\"\n      :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n      :gpu-acceleration=\"false\"\n      :hide-after=\"hideTimeout\"\n      :manual-mode=\"true\"\n      :placement=\"placement\"\n      :popper-class=\"`el-dropdown__popper ${popperClass}`\"\n      :reference-element=\"referenceElementRef?.$el\"\n      :trigger=\"trigger\"\n      :show-after=\"showTimeout\"\n      :stop-popper-mouse-event=\"false\"\n      :virtual-ref=\"triggeringElementRef\"\n      :virtual-triggering=\"splitButton\"\n      append-to-body\n      pure\n      transition=\"el-zoom-in-top\"\n      persistent\n      @show=\"$emit('visible-change', true)\"\n      @hide=\"$emit('visible-change', false)\"\n    >\n      <template #content>\n        <el-scrollbar\n          ref=\"scrollbar\"\n          :wrap-style=\"wrapStyle\"\n          tag=\"ul\"\n          view-class=\"el-dropdown__list\"\n        >\n          <el-focus-trap trapped @mount-on-focus=\"onMountOnFocus\">\n            <el-roving-focus-group\n              :loop=\"loop\"\n              :current-tab-id=\"currentTabId\"\n              orientation=\"horizontal\"\n              @current-tab-id-change=\"handleCurrentTabIdChange\"\n              @entry-focus=\"handleEntryFocus\"\n            >\n              <el-dropdown-collection>\n                <slot name=\"dropdown\"></slot>\n              </el-dropdown-collection>\n            </el-roving-focus-group>\n          </el-focus-trap>\n        </el-scrollbar>\n      </template>\n      <template v-if=\"!splitButton\" #default>\n        <div :class=\"dropdownTriggerKls\">\n          <slot name=\"default\" />\n        </div>\n      </template>\n    </el-tooltip>\n    <template v-if=\"splitButton\">\n      <el-button-group>\n        <el-button\n          ref=\"referenceElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          @click=\"handlerMainButtonClick\"\n        >\n          <slot name=\"default\" />\n        </el-button>\n        <el-button\n          ref=\"triggeringElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          class=\"el-dropdown__caret-button\"\n        >\n          <el-icon class=\"el-dropdown__icon\"><arrow-down /></el-icon>\n        </el-button>\n      </el-button-group>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  provide,\n  ref,\n  toRef,\n  unref,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElRovingFocusGroup from '@element-plus/components/roving-focus-group'\nimport { addUnit } from '@element-plus/utils/util'\nimport { ArrowDown } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { ElCollection as ElDropdownCollection, dropdownProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nimport type { CSSProperties } from 'vue'\n\nconst { ButtonGroup: ElButtonGroup } = ElButton\n\nexport default defineComponent({\n  name: 'ElDropdown',\n  components: {\n    ElButton,\n    ElFocusTrap,\n    ElButtonGroup,\n    ElScrollbar,\n    ElDropdownCollection,\n    ElTooltip,\n    ElRovingFocusGroup,\n    ElIcon,\n    ArrowDown,\n  },\n  props: dropdownProps,\n  emits: ['visible-change', 'click', 'command'],\n  setup(props, { emit }) {\n    const _instance = getCurrentInstance()\n\n    const triggeringElementRef = ref()\n    const referenceElementRef = ref()\n    const popperRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const contentRef = ref<HTMLElement | null>(null)\n    const visible = ref(false)\n    const scrollbar = ref(null)\n    const currentTabId = ref<string | null>(null)\n    const isUsingKeyboard = ref(false)\n\n    const wrapStyle = computed<CSSProperties>(() => ({\n      maxHeight: addUnit(props.maxHeight),\n    }))\n    const dropdownTriggerKls = computed(() => [\n      [dropdownSize.value ? `el-dropdown--${dropdownSize.value}` : ''],\n    ])\n\n    function handleClick() {\n      popperRef.value?.onClose()\n    }\n\n    const dropdownSize = useSize()\n\n    function commandHandler(...args: any[]) {\n      emit('command', ...args)\n    }\n\n    function onItemEnter() {\n      // NOOP for now\n    }\n\n    function onItemLeave() {\n      const contentEl = unref(contentRef)\n\n      contentEl?.focus()\n      currentTabId.value = null\n    }\n\n    function handleCurrentTabIdChange(id: string) {\n      currentTabId.value = id\n    }\n\n    function handleEntryFocus(e: Event) {\n      if (!isUsingKeyboard.value) {\n        e.preventDefault()\n        e.stopImmediatePropagation()\n      }\n    }\n\n    provide(DROPDOWN_INJECTION_KEY, {\n      contentRef,\n      isUsingKeyboard,\n      onItemEnter,\n      onItemLeave,\n    })\n\n    provide('elDropdown', {\n      instance: _instance,\n      dropdownSize,\n      visible,\n      handleClick,\n      commandHandler,\n      trigger: toRef(props, 'trigger'),\n      hideOnClick: toRef(props, 'hideOnClick'),\n    })\n\n    const onMountOnFocus = (e: Event) => {\n      e.preventDefault()\n      contentRef.value?.focus?.({\n        preventScroll: true,\n      })\n    }\n\n    const handlerMainButtonClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      visible,\n      scrollbar,\n      wrapStyle,\n      dropdownTriggerKls,\n      dropdownSize,\n      currentTabId,\n      handleCurrentTabIdChange,\n      handlerMainButtonClick,\n      handleEntryFocus,\n      onMountOnFocus,\n      popperRef,\n      triggeringElementRef,\n      referenceElementRef,\n    }\n  },\n})\n</script>\n"],"names":["ElDropdownCollection","ElRovingFocusGroup"],"mappings":";;;;;;;;;;;;;;;;AA8FA,mBAAmB,EAAE,aAAa,EAAE,GAAG,QAAQ,CAAC;;AAEhD,EAAE,MAAM,YAAY;;AAEpB,IAAI,QAAQ;;AAEZ,IAAI,aAAa;IACb,WAAW;0BACXA;IACA;wBACAC;IACA,MAAM;IACN,SAAS;;OAEN,EAAE;OACF,EAAE,CAAC;OACH,CAAC;IACJ,MAAM;;IAEN,MAAM;IACN,MAAM,SAAS,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5B,MAAM,UAAU,GAAG;IACnB,MAAM,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;;IAE3B,MAAM,YAAY,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,eAAe,GAAG,IAAI;IAC5B,MAAM,YAAY,QAAQ,CAAC,OAAO;MAChC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,UAAU;KACpC,CAAC,CAAC,CAAC;IACJ,MAAM,kBAAkB;MACtB,CAAC,YAAY,CAAC,KAAK,GAAG,CAAC,aAAa,EAAE;KACvC,CAAC,CAAC;;MAED,IAAI,EAAE,CAAC;MACP,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,KAAK,IAAI,GAAG;KAClC;IACD,MAAM,YAAY,GAAG,OAAO,EAAE,CAAC;aACtB,eAAe,GAAG,IAAI,EAAE;;;IAGjC,SAAS,WAAW,GAAG;;IAEvB;;MAEE,SAAS,IAAI,IAAI,GAAG,KAAK,CAAC;;KAE3B;aACQ;;;IAGT,SAAS;MACP,IAAI,CAAC;;;OAGJ;;;MAGD,UAAU;MACV,eAAe;;;KAGhB,CAAC,CAAC;WACI,CAAC;;;MAGN,OAAO;MACP,WAAW;oBACG;aACP,EAAE,KAAK,CAAC,KAAK,EAAE;MACtB;;;MAGA,IAAI,EAAE,EAAE,EAAE,CAAC;MACX,CAAC,CAAC;MACF,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG;QACV;OACD,CAAC,CAAC;KACJ;;MAEC,IAAI,CAAC,OAAO,EAAE,MAAM;MACpB;WACK;MACL,OAAO;MACP,SAAS;MACT,SAAS;MACT,kBAAkB;MAClB;;;MAGA,sBAAsB;MACtB,gBAAgB;MAChB,cAAc;eACL;MACT;;;;;;;;"}
+{"version":3,"file":"dropdown.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/dropdown/src/dropdown.vue"],"sourcesContent":["<template>\n  <div class=\"el-dropdown\">\n    <el-tooltip\n      ref=\"popperRef\"\n      :effect=\"effect\"\n      :fallback-placements=\"['bottom', 'top']\"\n      :popper-options=\"popperOptions\"\n      :gpu-acceleration=\"false\"\n      :hide-after=\"hideTimeout\"\n      :manual-mode=\"true\"\n      :placement=\"placement\"\n      :popper-class=\"`el-dropdown__popper ${popperClass}`\"\n      :reference-element=\"referenceElementRef?.$el\"\n      :trigger=\"trigger\"\n      :show-after=\"showTimeout\"\n      :stop-popper-mouse-event=\"false\"\n      :virtual-ref=\"triggeringElementRef\"\n      :virtual-triggering=\"splitButton\"\n      append-to-body\n      pure\n      transition=\"el-zoom-in-top\"\n      persistent\n      @show=\"$emit('visible-change', true)\"\n      @hide=\"$emit('visible-change', false)\"\n    >\n      <template #content>\n        <el-scrollbar\n          ref=\"scrollbar\"\n          :wrap-style=\"wrapStyle\"\n          tag=\"ul\"\n          view-class=\"el-dropdown__list\"\n        >\n          <el-focus-trap trapped @mount-on-focus=\"onMountOnFocus\">\n            <el-roving-focus-group\n              :loop=\"loop\"\n              :current-tab-id=\"currentTabId\"\n              orientation=\"horizontal\"\n              @current-tab-id-change=\"handleCurrentTabIdChange\"\n              @entry-focus=\"handleEntryFocus\"\n            >\n              <el-dropdown-collection>\n                <slot name=\"dropdown\"></slot>\n              </el-dropdown-collection>\n            </el-roving-focus-group>\n          </el-focus-trap>\n        </el-scrollbar>\n      </template>\n      <template v-if=\"!splitButton\" #default>\n        <div :class=\"dropdownTriggerKls\">\n          <slot name=\"default\" />\n        </div>\n      </template>\n    </el-tooltip>\n    <template v-if=\"splitButton\">\n      <el-button-group>\n        <el-button\n          ref=\"referenceElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          @click=\"handlerMainButtonClick\"\n        >\n          <slot name=\"default\" />\n        </el-button>\n        <el-button\n          ref=\"triggeringElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          class=\"el-dropdown__caret-button\"\n        >\n          <el-icon class=\"el-dropdown__icon\"><arrow-down /></el-icon>\n        </el-button>\n      </el-button-group>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  provide,\n  ref,\n  toRef,\n  unref,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElRovingFocusGroup from '@element-plus/components/roving-focus-group'\nimport { addUnit } from '@element-plus/utils/util'\nimport { ArrowDown } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { ElCollection as ElDropdownCollection, dropdownProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nimport type { CSSProperties } from 'vue'\n\nconst { ButtonGroup: ElButtonGroup } = ElButton\n\nexport default defineComponent({\n  name: 'ElDropdown',\n  components: {\n    ElButton,\n    ElFocusTrap,\n    ElButtonGroup,\n    ElScrollbar,\n    ElDropdownCollection,\n    ElTooltip,\n    ElRovingFocusGroup,\n    ElIcon,\n    ArrowDown,\n  },\n  props: dropdownProps,\n  emits: ['visible-change', 'click', 'command'],\n  setup(props, { emit }) {\n    const _instance = getCurrentInstance()\n\n    const triggeringElementRef = ref()\n    const referenceElementRef = ref()\n    const popperRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const contentRef = ref<HTMLElement | null>(null)\n    const visible = ref(false)\n    const scrollbar = ref(null)\n    const currentTabId = ref<string | null>(null)\n    const isUsingKeyboard = ref(false)\n\n    const wrapStyle = computed<CSSProperties>(() => ({\n      maxHeight: addUnit(props.maxHeight),\n    }))\n    const dropdownTriggerKls = computed(() => [\n      [dropdownSize.value ? `el-dropdown--${dropdownSize.value}` : ''],\n    ])\n\n    function handleClick() {\n      popperRef.value?.onClose()\n    }\n\n    const dropdownSize = useSize()\n\n    function commandHandler(...args: any[]) {\n      emit('command', ...args)\n    }\n\n    function onItemEnter() {\n      // NOOP for now\n    }\n\n    function onItemLeave() {\n      const contentEl = unref(contentRef)\n\n      contentEl?.focus()\n      currentTabId.value = null\n    }\n\n    function handleCurrentTabIdChange(id: string) {\n      currentTabId.value = id\n    }\n\n    function handleEntryFocus(e: Event) {\n      if (!isUsingKeyboard.value) {\n        e.preventDefault()\n        e.stopImmediatePropagation()\n      }\n    }\n\n    provide(DROPDOWN_INJECTION_KEY, {\n      contentRef,\n      isUsingKeyboard,\n      onItemEnter,\n      onItemLeave,\n    })\n\n    provide('elDropdown', {\n      instance: _instance,\n      dropdownSize,\n      visible,\n      handleClick,\n      commandHandler,\n      trigger: toRef(props, 'trigger'),\n      hideOnClick: toRef(props, 'hideOnClick'),\n    })\n\n    const onMountOnFocus = (e: Event) => {\n      e.preventDefault()\n      contentRef.value?.focus?.({\n        preventScroll: true,\n      })\n    }\n\n    const handlerMainButtonClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      visible,\n      scrollbar,\n      wrapStyle,\n      dropdownTriggerKls,\n      dropdownSize,\n      currentTabId,\n      handleCurrentTabIdChange,\n      handlerMainButtonClick,\n      handleEntryFocus,\n      onMountOnFocus,\n      popperRef,\n      triggeringElementRef,\n      referenceElementRef,\n    }\n  },\n})\n</script>\n"],"names":["ElDropdownCollection","ElRovingFocusGroup"],"mappings":";;;;;;;;;;;;;;;;AA+FA,mBAAmB,EAAE,aAAa,EAAE,GAAG,QAAQ,CAAC;;AAEhD,EAAE,MAAM,YAAY;;AAEpB,IAAI,QAAQ;;AAEZ,IAAI,aAAa;IACb,WAAW;0BACXA;IACA;wBACAC;IACA,MAAM;IACN,SAAS;;OAEN,EAAE;OACF,EAAE,CAAC;OACH,CAAC;IACJ,MAAM;;IAEN,MAAM;IACN,MAAM,SAAS,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;IAC5B,MAAM,UAAU,GAAG;IACnB,MAAM,OAAO,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;;IAE3B,MAAM,YAAY,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC;IAC/B,MAAM,eAAe,GAAG,IAAI;IAC5B,MAAM,YAAY,QAAQ,CAAC,OAAO;MAChC,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,UAAU;KACpC,CAAC,CAAC,CAAC;IACJ,MAAM,kBAAkB;MACtB,CAAC,YAAY,CAAC,KAAK,GAAG,CAAC,aAAa,EAAE;KACvC,CAAC,CAAC;;MAED,IAAI,EAAE,CAAC;MACP,CAAC,EAAE,GAAG,SAAS,CAAC,KAAK,KAAK,IAAI,GAAG;KAClC;IACD,MAAM,YAAY,GAAG,OAAO,EAAE,CAAC;aACtB,eAAe,GAAG,IAAI,EAAE;;;IAGjC,SAAS,WAAW,GAAG;;IAEvB;;MAEE,SAAS,IAAI,IAAI,GAAG,KAAK,CAAC;;KAE3B;aACQ;;;IAGT,SAAS;MACP,IAAI,CAAC;;;OAGJ;;;MAGD,UAAU;MACV,eAAe;;;KAGhB,CAAC,CAAC;WACI,CAAC;;;MAGN,OAAO;MACP,WAAW;oBACG;aACP,EAAE,KAAK,CAAC,KAAK,EAAE;MACtB;;;MAGA,IAAI,EAAE,EAAE,EAAE,CAAC;MACX,CAAC,CAAC;MACF,CAAC,EAAE,GAAG,CAAC,EAAE,GAAG;QACV;OACD,CAAC,CAAC;KACJ;;MAEC,IAAI,CAAC,OAAO,EAAE,MAAM;MACpB;WACK;MACL,OAAO;MACP,SAAS;MACT,SAAS;MACT,kBAAkB;MAClB;;;MAGA,sBAAsB;MACtB,gBAAgB;MAChB,cAAc;eACL;MACT;;;;;;;;"}

package/es/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs

@@ -16,7 +16,8 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
     createVNode(_component_el_tooltip, {
       ref: "popperRef",
       effect: _ctx.effect,
-      "fallback-placements": ["bottom", "top", "right", "left"],
+      "fallback-placements": ["bottom", "top"],
+      "popper-options": _ctx.popperOptions,
       "gpu-acceleration": false,
       "hide-after": _ctx.hideTimeout,
       "manual-mode": true,
@@ -84,7 +85,7 @@ function render(_ctx, _cache, $props, $setup, $data, $options) {
           ], 2)
         ])
       } : void 0
-    ]), 1032, ["effect", "hide-after", "placement", "popper-class", "reference-element", "trigger", "show-after", "virtual-ref", "virtual-triggering"]),
+    ]), 1032, ["effect", "popper-options", "hide-after", "placement", "popper-class", "reference-element", "trigger", "show-after", "virtual-ref", "virtual-triggering"]),
     _ctx.splitButton ? (openBlock(), createBlock(_component_el_button_group, { key: 0 }, {
       default: withCtx(() => [
         createVNode(_component_el_button, {

package/es/components/dropdown/src/dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs","sources":["../../../../../../packages/components/dropdown/src/dropdown.vue?vue&type=template&id=3ed790a5&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-dropdown\">\n    <el-tooltip\n      ref=\"popperRef\"\n      :effect=\"effect\"\n      :fallback-placements=\"['bottom', 'top', 'right', 'left']\"\n      :gpu-acceleration=\"false\"\n      :hide-after=\"hideTimeout\"\n      :manual-mode=\"true\"\n      :placement=\"placement\"\n      :popper-class=\"`el-dropdown__popper ${popperClass}`\"\n      :reference-element=\"referenceElementRef?.$el\"\n      :trigger=\"trigger\"\n      :show-after=\"showTimeout\"\n      :stop-popper-mouse-event=\"false\"\n      :virtual-ref=\"triggeringElementRef\"\n      :virtual-triggering=\"splitButton\"\n      append-to-body\n      pure\n      transition=\"el-zoom-in-top\"\n      persistent\n      @show=\"$emit('visible-change', true)\"\n      @hide=\"$emit('visible-change', false)\"\n    >\n      <template #content>\n        <el-scrollbar\n          ref=\"scrollbar\"\n          :wrap-style=\"wrapStyle\"\n          tag=\"ul\"\n          view-class=\"el-dropdown__list\"\n        >\n          <el-focus-trap trapped @mount-on-focus=\"onMountOnFocus\">\n            <el-roving-focus-group\n              :loop=\"loop\"\n              :current-tab-id=\"currentTabId\"\n              orientation=\"horizontal\"\n              @current-tab-id-change=\"handleCurrentTabIdChange\"\n              @entry-focus=\"handleEntryFocus\"\n            >\n              <el-dropdown-collection>\n                <slot name=\"dropdown\"></slot>\n              </el-dropdown-collection>\n            </el-roving-focus-group>\n          </el-focus-trap>\n        </el-scrollbar>\n      </template>\n      <template v-if=\"!splitButton\" #default>\n        <div :class=\"dropdownTriggerKls\">\n          <slot name=\"default\" />\n        </div>\n      </template>\n    </el-tooltip>\n    <template v-if=\"splitButton\">\n      <el-button-group>\n        <el-button\n          ref=\"referenceElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          @click=\"handlerMainButtonClick\"\n        >\n          <slot name=\"default\" />\n        </el-button>\n        <el-button\n          ref=\"triggeringElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          class=\"el-dropdown__caret-button\"\n        >\n          <el-icon class=\"el-dropdown__icon\"><arrow-down /></el-icon>\n        </el-button>\n      </el-button-group>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  provide,\n  ref,\n  toRef,\n  unref,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElRovingFocusGroup from '@element-plus/components/roving-focus-group'\nimport { addUnit } from '@element-plus/utils/util'\nimport { ArrowDown } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { ElCollection as ElDropdownCollection, dropdownProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nimport type { CSSProperties } from 'vue'\n\nconst { ButtonGroup: ElButtonGroup } = ElButton\n\nexport default defineComponent({\n  name: 'ElDropdown',\n  components: {\n    ElButton,\n    ElFocusTrap,\n    ElButtonGroup,\n    ElScrollbar,\n    ElDropdownCollection,\n    ElTooltip,\n    ElRovingFocusGroup,\n    ElIcon,\n    ArrowDown,\n  },\n  props: dropdownProps,\n  emits: ['visible-change', 'click', 'command'],\n  setup(props, { emit }) {\n    const _instance = getCurrentInstance()\n\n    const triggeringElementRef = ref()\n    const referenceElementRef = ref()\n    const popperRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const contentRef = ref<HTMLElement | null>(null)\n    const visible = ref(false)\n    const scrollbar = ref(null)\n    const currentTabId = ref<string | null>(null)\n    const isUsingKeyboard = ref(false)\n\n    const wrapStyle = computed<CSSProperties>(() => ({\n      maxHeight: addUnit(props.maxHeight),\n    }))\n    const dropdownTriggerKls = computed(() => [\n      [dropdownSize.value ? `el-dropdown--${dropdownSize.value}` : ''],\n    ])\n\n    function handleClick() {\n      popperRef.value?.onClose()\n    }\n\n    const dropdownSize = useSize()\n\n    function commandHandler(...args: any[]) {\n      emit('command', ...args)\n    }\n\n    function onItemEnter() {\n      // NOOP for now\n    }\n\n    function onItemLeave() {\n      const contentEl = unref(contentRef)\n\n      contentEl?.focus()\n      currentTabId.value = null\n    }\n\n    function handleCurrentTabIdChange(id: string) {\n      currentTabId.value = id\n    }\n\n    function handleEntryFocus(e: Event) {\n      if (!isUsingKeyboard.value) {\n        e.preventDefault()\n        e.stopImmediatePropagation()\n      }\n    }\n\n    provide(DROPDOWN_INJECTION_KEY, {\n      contentRef,\n      isUsingKeyboard,\n      onItemEnter,\n      onItemLeave,\n    })\n\n    provide('elDropdown', {\n      instance: _instance,\n      dropdownSize,\n      visible,\n      handleClick,\n      commandHandler,\n      trigger: toRef(props, 'trigger'),\n      hideOnClick: toRef(props, 'hideOnClick'),\n    })\n\n    const onMountOnFocus = (e: Event) => {\n      e.preventDefault()\n      contentRef.value?.focus?.({\n        preventScroll: true,\n      })\n    }\n\n    const handlerMainButtonClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      visible,\n      scrollbar,\n      wrapStyle,\n      dropdownTriggerKls,\n      dropdownSize,\n      currentTabId,\n      handleCurrentTabIdChange,\n      handlerMainButtonClick,\n      handleEntryFocus,\n      onMountOnFocus,\n      popperRef,\n      triggeringElementRef,\n      referenceElementRef,\n    }\n  },\n})\n</script>\n"],"names":["_withCtx"],"mappings":";;;;;;;;;;;;;;;;;;MAGM;MACC;MACA;MACA;MACA;MACA;MACA;MACA,cAAY;MACZ,mBAAiB;MACjB;MACA;MACA,2BAAyB;MACzB;MACA;MACD;MACA;MACA;MACA;;MAEC;;aAEiB;;UAEd,GAAG,EAAC;UACH,YAAU,EAAE;;UAEb;;;;;cAEwB;;;;kBAEnB;kBACA;kBACD;;kBAEC;;;;;;;;;;;;;;;;;;;;;QASQ;;;;;;;gBAEb;;;;;;qBAIqB;;;;iBAGlB,EAACA;oCACe;;cAElB;;;;;;;;iBAKE,EAACA;;cAEH;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"dropdown.vue_vue_type_template_id_3ed790a5_lang.mjs","sources":["../../../../../../packages/components/dropdown/src/dropdown.vue?vue&type=template&id=3ed790a5&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-dropdown\">\n    <el-tooltip\n      ref=\"popperRef\"\n      :effect=\"effect\"\n      :fallback-placements=\"['bottom', 'top']\"\n      :popper-options=\"popperOptions\"\n      :gpu-acceleration=\"false\"\n      :hide-after=\"hideTimeout\"\n      :manual-mode=\"true\"\n      :placement=\"placement\"\n      :popper-class=\"`el-dropdown__popper ${popperClass}`\"\n      :reference-element=\"referenceElementRef?.$el\"\n      :trigger=\"trigger\"\n      :show-after=\"showTimeout\"\n      :stop-popper-mouse-event=\"false\"\n      :virtual-ref=\"triggeringElementRef\"\n      :virtual-triggering=\"splitButton\"\n      append-to-body\n      pure\n      transition=\"el-zoom-in-top\"\n      persistent\n      @show=\"$emit('visible-change', true)\"\n      @hide=\"$emit('visible-change', false)\"\n    >\n      <template #content>\n        <el-scrollbar\n          ref=\"scrollbar\"\n          :wrap-style=\"wrapStyle\"\n          tag=\"ul\"\n          view-class=\"el-dropdown__list\"\n        >\n          <el-focus-trap trapped @mount-on-focus=\"onMountOnFocus\">\n            <el-roving-focus-group\n              :loop=\"loop\"\n              :current-tab-id=\"currentTabId\"\n              orientation=\"horizontal\"\n              @current-tab-id-change=\"handleCurrentTabIdChange\"\n              @entry-focus=\"handleEntryFocus\"\n            >\n              <el-dropdown-collection>\n                <slot name=\"dropdown\"></slot>\n              </el-dropdown-collection>\n            </el-roving-focus-group>\n          </el-focus-trap>\n        </el-scrollbar>\n      </template>\n      <template v-if=\"!splitButton\" #default>\n        <div :class=\"dropdownTriggerKls\">\n          <slot name=\"default\" />\n        </div>\n      </template>\n    </el-tooltip>\n    <template v-if=\"splitButton\">\n      <el-button-group>\n        <el-button\n          ref=\"referenceElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          @click=\"handlerMainButtonClick\"\n        >\n          <slot name=\"default\" />\n        </el-button>\n        <el-button\n          ref=\"triggeringElementRef\"\n          :size=\"dropdownSize\"\n          :type=\"type\"\n          class=\"el-dropdown__caret-button\"\n        >\n          <el-icon class=\"el-dropdown__icon\"><arrow-down /></el-icon>\n        </el-button>\n      </el-button-group>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  getCurrentInstance,\n  provide,\n  ref,\n  toRef,\n  unref,\n} from 'vue'\nimport ElButton from '@element-plus/components/button'\nimport ElTooltip from '@element-plus/components/tooltip'\nimport ElScrollbar from '@element-plus/components/scrollbar'\nimport ElIcon from '@element-plus/components/icon'\nimport ElFocusTrap from '@element-plus/components/focus-trap'\nimport ElRovingFocusGroup from '@element-plus/components/roving-focus-group'\nimport { addUnit } from '@element-plus/utils/util'\nimport { ArrowDown } from '@element-plus/icons-vue'\nimport { useSize } from '@element-plus/hooks'\nimport { ElCollection as ElDropdownCollection, dropdownProps } from './dropdown'\nimport { DROPDOWN_INJECTION_KEY } from './tokens'\n\nimport type { CSSProperties } from 'vue'\n\nconst { ButtonGroup: ElButtonGroup } = ElButton\n\nexport default defineComponent({\n  name: 'ElDropdown',\n  components: {\n    ElButton,\n    ElFocusTrap,\n    ElButtonGroup,\n    ElScrollbar,\n    ElDropdownCollection,\n    ElTooltip,\n    ElRovingFocusGroup,\n    ElIcon,\n    ArrowDown,\n  },\n  props: dropdownProps,\n  emits: ['visible-change', 'click', 'command'],\n  setup(props, { emit }) {\n    const _instance = getCurrentInstance()\n\n    const triggeringElementRef = ref()\n    const referenceElementRef = ref()\n    const popperRef = ref<InstanceType<typeof ElTooltip> | null>(null)\n    const contentRef = ref<HTMLElement | null>(null)\n    const visible = ref(false)\n    const scrollbar = ref(null)\n    const currentTabId = ref<string | null>(null)\n    const isUsingKeyboard = ref(false)\n\n    const wrapStyle = computed<CSSProperties>(() => ({\n      maxHeight: addUnit(props.maxHeight),\n    }))\n    const dropdownTriggerKls = computed(() => [\n      [dropdownSize.value ? `el-dropdown--${dropdownSize.value}` : ''],\n    ])\n\n    function handleClick() {\n      popperRef.value?.onClose()\n    }\n\n    const dropdownSize = useSize()\n\n    function commandHandler(...args: any[]) {\n      emit('command', ...args)\n    }\n\n    function onItemEnter() {\n      // NOOP for now\n    }\n\n    function onItemLeave() {\n      const contentEl = unref(contentRef)\n\n      contentEl?.focus()\n      currentTabId.value = null\n    }\n\n    function handleCurrentTabIdChange(id: string) {\n      currentTabId.value = id\n    }\n\n    function handleEntryFocus(e: Event) {\n      if (!isUsingKeyboard.value) {\n        e.preventDefault()\n        e.stopImmediatePropagation()\n      }\n    }\n\n    provide(DROPDOWN_INJECTION_KEY, {\n      contentRef,\n      isUsingKeyboard,\n      onItemEnter,\n      onItemLeave,\n    })\n\n    provide('elDropdown', {\n      instance: _instance,\n      dropdownSize,\n      visible,\n      handleClick,\n      commandHandler,\n      trigger: toRef(props, 'trigger'),\n      hideOnClick: toRef(props, 'hideOnClick'),\n    })\n\n    const onMountOnFocus = (e: Event) => {\n      e.preventDefault()\n      contentRef.value?.focus?.({\n        preventScroll: true,\n      })\n    }\n\n    const handlerMainButtonClick = (event: MouseEvent) => {\n      emit('click', event)\n    }\n\n    return {\n      visible,\n      scrollbar,\n      wrapStyle,\n      dropdownTriggerKls,\n      dropdownSize,\n      currentTabId,\n      handleCurrentTabIdChange,\n      handlerMainButtonClick,\n      handleEntryFocus,\n      onMountOnFocus,\n      popperRef,\n      triggeringElementRef,\n      referenceElementRef,\n    }\n  },\n})\n</script>\n"],"names":["_withCtx"],"mappings":";;;;;;;;;;;;;;;;;;MAGM;MACC;MACA;MACA,kBAAgB;MAChB;MACA;MACA;MACA;MACA,cAAY;MACZ,mBAAiB;MACjB;MACA;MACA,2BAAyB;MACzB;MACA;MACD;MACA;MACA;MACA;;MAEC;;aAEiB;;UAEd,GAAG,EAAC;UACH,YAAU,EAAE;;UAEb;;;;;cAEwB;;;;kBAEnB;kBACA;kBACD;;kBAEC;;;;;;;;;;;;;;;;;;;;;QASQ;;;;;;;gBAEb;;;;;;qBAIqB;;;;iBAGlB,EAACA;oCACe;;cAElB;;;;;;;;iBAKE,EAACA;;cAEH;;;;;;;;;;;;;;;;"}

package/es/components/empty/index.d.ts

@@ -9,6 +9,17 @@ export declare const ElEmpty: import("../../utils/types").SFCWithInstall<import(
         readonly default: "";
     };
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     emptyDescription: import("vue").ComputedRef<string>;
     imageStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

package/es/components/empty/src/empty.d.ts

@@ -1,4 +1,5 @@
 import type { ExtractPropTypes } from 'vue';
+import type Empty from './empty.vue';
 export declare const emptyProps: {
     readonly image: {
         readonly type: StringConstructor;
@@ -11,3 +12,4 @@ export declare const emptyProps: {
     };
 };
 export declare type EmptyProps = ExtractPropTypes<typeof emptyProps>;
+export declare type EmptyInstance = InstanceType<typeof Empty>;

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

@@ -1 +1 @@
-{"version":3,"file":"empty.mjs","sources":["../../../../../../packages/components/empty/src/empty.ts"],"sourcesContent":["import type { ExtractPropTypes } from 'vue'\n\nexport const emptyProps = {\n  image: {\n    type: String,\n    default: '',\n  },\n  imageSize: Number,\n  description: {\n    type: String,\n    default: '',\n  },\n} as const\nexport type EmptyProps = ExtractPropTypes<typeof emptyProps>\n"],"names":[],"mappings":"AAAY,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH;;;;"}
+{"version":3,"file":"empty.mjs","sources":["../../../../../../packages/components/empty/src/empty.ts"],"sourcesContent":["import type { ExtractPropTypes } from 'vue'\nimport type Empty from './empty.vue'\n\nexport const emptyProps = {\n  image: {\n    type: String,\n    default: '',\n  },\n  imageSize: Number,\n  description: {\n    type: String,\n    default: '',\n  },\n} as const\nexport type EmptyProps = ExtractPropTypes<typeof emptyProps>\n\nexport type EmptyInstance = InstanceType<typeof Empty>\n"],"names":[],"mappings":"AAAY,MAAC,UAAU,GAAG;AAC1B,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE,MAAM;AACnB,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH;;;;"}

package/es/components/empty/src/empty.vue.d.ts

@@ -10,6 +10,17 @@ declare const _default: import("vue").DefineComponent<{
         readonly default: "";
     };
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     emptyDescription: import("vue").ComputedRef<string>;
     imageStyle: import("vue").ComputedRef<CSSProperties>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{

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

@@ -4,6 +4,7 @@ import './img-empty.mjs';
 import { emptyProps } from './empty.mjs';
 import script$1 from './img-empty.vue_vue_type_script_lang.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
 var script = defineComponent({
   name: "ElEmpty",
@@ -13,11 +14,13 @@ var script = defineComponent({
   props: emptyProps,
   setup(props) {
     const { t } = useLocale();
+    const ns = useNamespace("empty");
     const emptyDescription = computed(() => props.description || t("el.table.emptyText"));
     const imageStyle = computed(() => ({
       width: props.imageSize ? `${props.imageSize}px` : ""
     }));
     return {
+      ns,
       emptyDescription,
       imageStyle
     };

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

@@ -1 +1 @@
-{"version":3,"file":"empty.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/empty/src/empty.vue"],"sourcesContent":["<template>\n  <div class=\"el-empty\">\n    <div class=\"el-empty__image\" :style=\"imageStyle\">\n      <img v-if=\"image\" :src=\"image\" ondragstart=\"return false\" />\n      <slot v-else name=\"image\">\n        <img-empty />\n      </slot>\n    </div>\n    <div class=\"el-empty__description\">\n      <slot v-if=\"$slots.description\" name=\"description\"></slot>\n      <p v-else>{{ emptyDescription }}</p>\n    </div>\n    <div v-if=\"$slots.default\" class=\"el-empty__bottom\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport ImgEmpty from './img-empty.vue'\nimport { emptyProps } from './empty'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElEmpty',\n  components: {\n    ImgEmpty,\n  },\n\n  props: emptyProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const emptyDescription = computed(\n      () => props.description || t('el.table.emptyText')\n    )\n    const imageStyle = computed<CSSProperties>(() => ({\n      width: props.imageSize ? `${props.imageSize}px` : '',\n    }))\n\n    return {\n      emptyDescription,\n      imageStyle,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;AAsBA,aAAe,eAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;;AAEd,GAAG;EACD,OAAO;EACP,KAAK,CAAC;IACJ,MAAM,EAAE;;;MAGN,KAAK,EAAE,KAAK,CAAC;;IAEf,OAAO;MACL,gBAAgB;MAChB,UAAU;MACV;;;;;;"}
+{"version":3,"file":"empty.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/empty/src/empty.vue"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('image')\" :style=\"imageStyle\">\n      <img v-if=\"image\" :src=\"image\" ondragstart=\"return false\" />\n      <slot v-else name=\"image\">\n        <img-empty />\n      </slot>\n    </div>\n    <div :class=\"ns.e('description')\">\n      <slot v-if=\"$slots.description\" name=\"description\"></slot>\n      <p v-else>{{ emptyDescription }}</p>\n    </div>\n    <div v-if=\"$slots.default\" :class=\"ns.e('bottom')\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport ImgEmpty from './img-empty.vue'\nimport { emptyProps } from './empty'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElEmpty',\n  components: {\n    ImgEmpty,\n  },\n\n  props: emptyProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const ns = useNamespace('empty')\n    const emptyDescription = computed(\n      () => props.description || t('el.table.emptyText')\n    )\n    const imageStyle = computed<CSSProperties>(() => ({\n      width: props.imageSize ? `${props.imageSize}px` : '',\n    }))\n\n    return {\n      ns,\n      emptyDescription,\n      imageStyle,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;AAsBA,aAAe,eAAe,CAAC;;AAE/B,EAAE,UAAU,EAAE;;AAEd,GAAG;EACD,OAAO;EACP,KAAK,CAAC;IACJ,MAAM,EAAE;;;IAGR,MAAM;;KAEL,CAAC,CAAC,CAAC;IACJ;MACE,EAAE;MACF,gBAAgB;MAChB,UAAU;;;;;;;"}

package/es/components/empty/src/empty.vue_vue_type_template_id_10d211eb_lang.mjs

@@ -1,35 +1,36 @@
-import { resolveComponent, openBlock, createElementBlock, createElementVNode, normalizeStyle, renderSlot, createVNode, toDisplayString, createCommentVNode } from 'vue';
+import { resolveComponent, openBlock, createElementBlock, normalizeClass, createElementVNode, normalizeStyle, renderSlot, createVNode, toDisplayString, createCommentVNode } from 'vue';
 
-const _hoisted_1 = { class: "el-empty" };
-const _hoisted_2 = ["src"];
-const _hoisted_3 = { class: "el-empty__description" };
-const _hoisted_4 = { key: 1 };
-const _hoisted_5 = {
-  key: 0,
-  class: "el-empty__bottom"
-};
+const _hoisted_1 = ["src"];
+const _hoisted_2 = { key: 1 };
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_img_empty = resolveComponent("img-empty");
-  return openBlock(), createElementBlock("div", _hoisted_1, [
+  return openBlock(), createElementBlock("div", {
+    class: normalizeClass(_ctx.ns.b())
+  }, [
     createElementVNode("div", {
-      class: "el-empty__image",
+      class: normalizeClass(_ctx.ns.e("image")),
       style: normalizeStyle(_ctx.imageStyle)
     }, [
       _ctx.image ? (openBlock(), createElementBlock("img", {
         key: 0,
         src: _ctx.image,
         ondragstart: "return false"
-      }, null, 8, _hoisted_2)) : renderSlot(_ctx.$slots, "image", { key: 1 }, () => [
+      }, null, 8, _hoisted_1)) : renderSlot(_ctx.$slots, "image", { key: 1 }, () => [
         createVNode(_component_img_empty)
       ])
-    ], 4),
-    createElementVNode("div", _hoisted_3, [
-      _ctx.$slots.description ? renderSlot(_ctx.$slots, "description", { key: 0 }) : (openBlock(), createElementBlock("p", _hoisted_4, toDisplayString(_ctx.emptyDescription), 1))
-    ]),
-    _ctx.$slots.default ? (openBlock(), createElementBlock("div", _hoisted_5, [
+    ], 6),
+    createElementVNode("div", {
+      class: normalizeClass(_ctx.ns.e("description"))
+    }, [
+      _ctx.$slots.description ? renderSlot(_ctx.$slots, "description", { key: 0 }) : (openBlock(), createElementBlock("p", _hoisted_2, toDisplayString(_ctx.emptyDescription), 1))
+    ], 2),
+    _ctx.$slots.default ? (openBlock(), createElementBlock("div", {
+      key: 0,
+      class: normalizeClass(_ctx.ns.e("bottom"))
+    }, [
       renderSlot(_ctx.$slots, "default")
-    ])) : createCommentVNode("v-if", true)
-  ]);
+    ], 2)) : createCommentVNode("v-if", true)
+  ], 2);
 }
 
 export { render };

package/es/components/empty/src/empty.vue_vue_type_template_id_10d211eb_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"empty.vue_vue_type_template_id_10d211eb_lang.mjs","sources":["../../../../../../packages/components/empty/src/empty.vue?vue&type=template&id=10d211eb&lang.js"],"sourcesContent":["<template>\n  <div class=\"el-empty\">\n    <div class=\"el-empty__image\" :style=\"imageStyle\">\n      <img v-if=\"image\" :src=\"image\" ondragstart=\"return false\" />\n      <slot v-else name=\"image\">\n        <img-empty />\n      </slot>\n    </div>\n    <div class=\"el-empty__description\">\n      <slot v-if=\"$slots.description\" name=\"description\"></slot>\n      <p v-else>{{ emptyDescription }}</p>\n    </div>\n    <div v-if=\"$slots.default\" class=\"el-empty__bottom\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useLocale } from '@element-plus/hooks'\nimport ImgEmpty from './img-empty.vue'\nimport { emptyProps } from './empty'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElEmpty',\n  components: {\n    ImgEmpty,\n  },\n\n  props: emptyProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const emptyDescription = computed(\n      () => props.description || t('el.table.emptyText')\n    )\n    const imageStyle = computed<CSSProperties>(() => ({\n      width: props.imageSize ? `${props.imageSize}px` : '',\n    }))\n\n    return {\n      emptyDescription,\n      imageStyle,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;0BACY;;qBAOH,KAAK;;;;EAIiB;;;;;;;;MAVtB,KAAK;WAAyB;;;;;;;;UAEjC;;;;;;;;;;"}
+{"version":3,"file":"empty.vue_vue_type_template_id_10d211eb_lang.mjs","sources":["../../../../../../packages/components/empty/src/empty.vue?vue&type=template&id=10d211eb&lang.js"],"sourcesContent":["<template>\n  <div :class=\"ns.b()\">\n    <div :class=\"ns.e('image')\" :style=\"imageStyle\">\n      <img v-if=\"image\" :src=\"image\" ondragstart=\"return false\" />\n      <slot v-else name=\"image\">\n        <img-empty />\n      </slot>\n    </div>\n    <div :class=\"ns.e('description')\">\n      <slot v-if=\"$slots.description\" name=\"description\"></slot>\n      <p v-else>{{ emptyDescription }}</p>\n    </div>\n    <div v-if=\"$slots.default\" :class=\"ns.e('bottom')\">\n      <slot></slot>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { computed, defineComponent } from 'vue'\nimport { useLocale, useNamespace } from '@element-plus/hooks'\nimport ImgEmpty from './img-empty.vue'\nimport { emptyProps } from './empty'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElEmpty',\n  components: {\n    ImgEmpty,\n  },\n\n  props: emptyProps,\n\n  setup(props) {\n    const { t } = useLocale()\n    const ns = useNamespace('empty')\n    const emptyDescription = computed(\n      () => props.description || t('el.table.emptyText')\n    )\n    const imageStyle = computed<CSSProperties>(() => ({\n      width: props.imageSize ? `${props.imageSize}px` : '',\n    }))\n\n    return {\n      ns,\n      emptyDescription,\n      imageStyle,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;;;;uBACE;iCAAe,EAAE;;;MACT,KAAK;WAAuB;;;;;;;;;;;;IAMlC;MAAM,KAAK;;OACG;;;;;;;;"}

package/es/components/icon/index.d.ts

@@ -2,6 +2,17 @@ export declare const ElIcon: import("../../utils/types").SFCWithInstall<import("
     readonly size: import("../../utils/props").BuildPropReturn<import("../../utils/props").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
     readonly color: import("../../utils/props").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     style: import("vue").ComputedRef<import("vue").CSSProperties>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;

package/es/components/icon/src/icon.d.ts

@@ -1,6 +1,8 @@
 import type { ExtractPropTypes } from 'vue';
+import type Icon from './icon.vue';
 export declare const iconProps: {
     readonly size: import("element-plus/es/utils/props").BuildPropReturn<import("element-plus/es/utils/props").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
     readonly color: import("element-plus/es/utils/props").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
 };
 export declare type IconProps = ExtractPropTypes<typeof iconProps>;
+export declare type IconInstance = InstanceType<typeof Icon>;

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

@@ -1 +1 @@
-{"version":3,"file":"icon.mjs","sources":["../../../../../../packages/components/icon/src/icon.ts"],"sourcesContent":["import { definePropType, buildProps } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const iconProps = buildProps({\n  size: {\n    type: definePropType<number | string>([Number, String]),\n  },\n  color: {\n    type: String,\n  },\n} as const)\nexport type IconProps = ExtractPropTypes<typeof iconProps>\n"],"names":[],"mappings":";;AACY,MAAC,SAAS,GAAG,UAAU,CAAC;AACpC,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"icon.mjs","sources":["../../../../../../packages/components/icon/src/icon.ts"],"sourcesContent":["import { definePropType, buildProps } from '@element-plus/utils/props'\nimport type { ExtractPropTypes } from 'vue'\nimport type Icon from './icon.vue'\n\nexport const iconProps = buildProps({\n  size: {\n    type: definePropType<number | string>([Number, String]),\n  },\n  color: {\n    type: String,\n  },\n} as const)\nexport type IconProps = ExtractPropTypes<typeof iconProps>\nexport type IconInstance = InstanceType<typeof Icon>\n"],"names":[],"mappings":";;AACY,MAAC,SAAS,GAAG,UAAU,CAAC;AACpC,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,CAAC;;;;"}

package/es/components/icon/src/icon.vue.d.ts

@@ -3,6 +3,17 @@ declare const _default: import("vue").DefineComponent<{
     readonly size: import("../../../utils/props").BuildPropReturn<import("../../../utils/props").PropWrapper<string | number>, unknown, unknown, unknown, unknown>;
     readonly color: import("../../../utils/props").BuildPropReturn<StringConstructor, unknown, unknown, unknown, unknown>;
 }, {
+    ns: {
+        namespace: import("vue").ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: (name: string, state?: boolean) => string;
+    };
     style: import("vue").ComputedRef<CSSProperties>;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<{
     readonly size?: unknown;

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

@@ -1,27 +1,26 @@
 import { defineComponent, computed } from 'vue';
-import { isNumber } from '../../../utils/util.mjs';
+import { isUndefined, addUnit } from '../../../utils/util.mjs';
+import '../../../hooks/index.mjs';
 import { iconProps } from './icon.mjs';
-import { isString } from '@vue/shared';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
 var script = defineComponent({
   name: "ElIcon",
   inheritAttrs: false,
   props: iconProps,
   setup(props) {
+    const ns = useNamespace("icon");
+    const style = computed(() => {
+      if (!props.size && !props.color)
+        return {};
+      return {
+        fontSize: isUndefined(props.size) ? void 0 : addUnit(props.size),
+        "--color": props.color
+      };
+    });
     return {
-      style: computed(() => {
-        if (!props.size && !props.color) {
-          return {};
-        }
-        let size = props.size;
-        if (isNumber(size) || isString(size) && !size.endsWith("px")) {
-          size = `${size}px`;
-        }
-        return {
-          ...props.size ? { fontSize: size } : {},
-          ...props.color ? { "--color": props.color } : {}
-        };
-      })
+      ns,
+      style
     };
   }
 });

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

@@ -1 +1 @@
-{"version":3,"file":"icon.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/icon/src/icon.vue"],"sourcesContent":["<template>\n  <i class=\"el-icon\" :style=\"style\" v-bind=\"$attrs\">\n    <slot></slot>\n  </i>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\nimport { isNumber, isString } from '@element-plus/utils/util'\nimport { iconProps } from './icon'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElIcon',\n  inheritAttrs: false,\n\n  props: iconProps,\n\n  setup(props) {\n    return {\n      style: computed<CSSProperties>(() => {\n        if (!props.size && !props.color) {\n          return {}\n        }\n        let size = props.size\n        if (isNumber(size) || (isString(size) && !size.endsWith('px'))) {\n          size = `${size}px`\n        }\n        return {\n          ...(props.size ? { fontSize: size } : {}),\n          ...(props.color ? { '--color': props.color } : {}),\n        } as CSSProperties\n      }),\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;AASA,aAAe,eAAe,CAAC;;AAE/B,EAAE,YAAY,EAAE,KAAK;;AAErB,EAAE,KAAK,CAAC,KAAK,EAAE;IACX,OAAO;MACL,KAAK,EAAE,QAAQ;;UAEX,OAAO;;QAET,IAAI;QACJ;UACE,IAAI,GAAG,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC;SACpB;eACM;;UAEL,GAAG,MAAM,KAAK,GAAG;SAClB;;;;;;;;"}
+{"version":3,"file":"icon.vue_vue_type_script_lang.mjs","sources":["../../../../../../packages/components/icon/src/icon.vue"],"sourcesContent":["<template>\n  <i :class=\"ns.b()\" :style=\"style\" v-bind=\"$attrs\">\n    <slot></slot>\n  </i>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\nimport { addUnit, isUndefined } from '@element-plus/utils/util'\nimport { useNamespace } from '@element-plus/hooks'\nimport { iconProps } from './icon'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElIcon',\n  inheritAttrs: false,\n\n  props: iconProps,\n\n  setup(props) {\n    const ns = useNamespace('icon')\n\n    const style = computed<CSSProperties>(() => {\n      if (!props.size && !props.color) return {}\n\n      return {\n        fontSize: isUndefined(props.size) ? undefined : addUnit(props.size),\n        '--color': props.color,\n      }\n    })\n\n    return {\n      ns,\n      style,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;;AAUA,aAAe,eAAe,CAAC;;AAE/B,EAAE,YAAY,EAAE,KAAK;;AAErB,EAAE,KAAK,CAAC,KAAK,EAAE;IACX,MAAM,EAAE,GAAG;IACX,MAAM,QAAQ;;eAEH,EAAE,CAAC;;QAEV;QACA,SAAS,EAAE,KAAK,CAAC,KAAK;;KAEzB,CAAC,CAAC;WACI;;MAEL,KAAK;;;;;;;"}

package/es/components/icon/src/icon.vue_vue_type_template_id_89b755b6_lang.mjs

@@ -2,7 +2,7 @@ import { openBlock, createElementBlock, mergeProps, renderSlot } from 'vue';
 
 function render(_ctx, _cache, $props, $setup, $data, $options) {
   return openBlock(), createElementBlock("i", mergeProps({
-    class: "el-icon",
+    class: _ctx.ns.b(),
     style: _ctx.style
   }, _ctx.$attrs), [
     renderSlot(_ctx.$slots, "default")

package/es/components/icon/src/icon.vue_vue_type_template_id_89b755b6_lang.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"icon.vue_vue_type_template_id_89b755b6_lang.mjs","sources":["../../../../../../packages/components/icon/src/icon.vue?vue&type=template&id=89b755b6&lang.js"],"sourcesContent":["<template>\n  <i class=\"el-icon\" :style=\"style\" v-bind=\"$attrs\">\n    <slot></slot>\n  </i>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\nimport { isNumber, isString } from '@element-plus/utils/util'\nimport { iconProps } from './icon'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElIcon',\n  inheritAttrs: false,\n\n  props: iconProps,\n\n  setup(props) {\n    return {\n      style: computed<CSSProperties>(() => {\n        if (!props.size && !props.color) {\n          return {}\n        }\n        let size = props.size\n        if (isNumber(size) || (isString(size) && !size.endsWith('px'))) {\n          size = `${size}px`\n        }\n        return {\n          ...(props.size ? { fontSize: size } : {}),\n          ...(props.color ? { '--color': props.color } : {}),\n        } as CSSProperties\n      }),\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;IACK,KAAK,EAAC;SAAgB;eAAuB;;;;;;"}
+{"version":3,"file":"icon.vue_vue_type_template_id_89b755b6_lang.mjs","sources":["../../../../../../packages/components/icon/src/icon.vue?vue&type=template&id=89b755b6&lang.js"],"sourcesContent":["<template>\n  <i :class=\"ns.b()\" :style=\"style\" v-bind=\"$attrs\">\n    <slot></slot>\n  </i>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, computed } from 'vue'\nimport { addUnit, isUndefined } from '@element-plus/utils/util'\nimport { useNamespace } from '@element-plus/hooks'\nimport { iconProps } from './icon'\n\nimport type { CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElIcon',\n  inheritAttrs: false,\n\n  props: iconProps,\n\n  setup(props) {\n    const ns = useNamespace('icon')\n\n    const style = computed<CSSProperties>(() => {\n      if (!props.size && !props.color) return {}\n\n      return {\n        fontSize: isUndefined(props.size) ? undefined : addUnit(props.size),\n        '--color': props.color,\n      }\n    })\n\n    return {\n      ns,\n      style,\n    }\n  },\n})\n</script>\n"],"names":[],"mappings":";;;;;IACM,KAAK,EAAE;SAAc;eAAuB;;;;;;"}

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

@@ -57,14 +57,25 @@ var script = defineComponent({
       loading.value = true;
       hasLoadError.value = false;
       const img = new Image();
-      img.addEventListener("load", (e) => handleLoad(e, img));
-      img.addEventListener("error", handleError);
+      const currentImageSrc = props.src;
+      img.addEventListener("load", (e) => {
+        if (currentImageSrc !== props.src) {
+          return;
+        }
+        handleLoad(e, img);
+      });
+      img.addEventListener("error", (e) => {
+        if (currentImageSrc !== props.src) {
+          return;
+        }
+        handleError(e);
+      });
       Object.entries(attrs.value).forEach(([key, value]) => {
         if (key.toLowerCase() === "onload")
           return;
         img.setAttribute(key, value);
       });
-      img.src = props.src;
+      img.src = currentImageSrc;
     };
     function handleLoad(e, img) {
       imgWidth.value = img.width;