@element-plus/nightly 0.0.20240111 → 0.0.20240113

package/es/components/breadcrumb/src/breadcrumb2.mjs

@@ -1,16 +1,41 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
-import { iconPropType } from '../../../utils/vue/icon.mjs';
+import { defineComponent, ref, provide, onMounted, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from 'vue';
+import '../../../hooks/index.mjs';
+import { breadcrumbKey } from './constants.mjs';
+import { breadcrumbProps } from './breadcrumb.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const breadcrumbProps = buildProps({
-  separator: {
-    type: String,
-    default: "/"
-  },
-  separatorIcon: {
-    type: iconPropType
+const __default__ = defineComponent({
+  name: "ElBreadcrumb"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: breadcrumbProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("breadcrumb");
+    const breadcrumb = ref();
+    provide(breadcrumbKey, props);
+    onMounted(() => {
+      const items = breadcrumb.value.querySelectorAll(`.${ns.e("item")}`);
+      if (items.length) {
+        items[items.length - 1].setAttribute("aria-current", "page");
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "breadcrumb",
+        ref: breadcrumb,
+        class: normalizeClass(unref(ns).b()),
+        "aria-label": "Breadcrumb",
+        role: "navigation"
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 2);
+    };
   }
 });
+var Breadcrumb = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "breadcrumb.vue"]]);
 
-export { breadcrumbProps };
+export { Breadcrumb as default };
 //# sourceMappingURL=breadcrumb2.mjs.map

package/es/components/breadcrumb/src/breadcrumb2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"breadcrumb2.mjs","sources":["../../../../../../packages/components/breadcrumb/src/breadcrumb.ts"],"sourcesContent":["import { buildProps, iconPropType } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\n\nexport const breadcrumbProps = buildProps({\n  /**\n   * @description separator character\n   */\n  separator: {\n    type: String,\n    default: '/',\n  },\n  /**\n   * @description icon component of icon separator\n   */\n  separatorIcon: {\n    type: iconPropType,\n  },\n} as const)\nexport type BreadcrumbProps = ExtractPropTypes<typeof breadcrumbProps>\n"],"names":[],"mappings":";;;;AACY,MAAC,eAAe,GAAG,UAAU,CAAC;AAC1C,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,aAAa,EAAE;AACjB,IAAI,IAAI,EAAE,YAAY;AACtB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"breadcrumb2.mjs","sources":["../../../../../../packages/components/breadcrumb/src/breadcrumb.vue"],"sourcesContent":["<template>\n  <div\n    ref=\"breadcrumb\"\n    :class=\"ns.b()\"\n    aria-label=\"Breadcrumb\"\n    role=\"navigation\"\n  >\n    <slot />\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport { onMounted, provide, ref } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { breadcrumbKey } from './constants'\nimport { breadcrumbProps } from './breadcrumb'\n\ndefineOptions({\n  name: 'ElBreadcrumb',\n})\n\nconst props = defineProps(breadcrumbProps)\n\nconst ns = useNamespace('breadcrumb')\nconst breadcrumb = ref<HTMLDivElement>()\n\nprovide(breadcrumbKey, props)\n\nonMounted(() => {\n  const items = breadcrumb.value!.querySelectorAll(`.${ns.e('item')}`)\n  if (items.length) {\n    items[items.length - 1].setAttribute('aria-current', 'page')\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;;mCAiBc,CAAA;AAAA,EACZ,IAAM,EAAA,cAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,YAAY,CAAA,CAAA;AACpC,IAAA,MAAM,aAAa,GAAoB,EAAA,CAAA;AAEvC,IAAA,OAAA,CAAQ,eAAe,KAAK,CAAA,CAAA;AAE5B,IAAA,SAAA,CAAU,MAAM;AACd,MAAM,MAAA,KAAA,GAAQ,WAAW,KAAO,CAAA,gBAAA,CAAiB,IAAI,EAAG,CAAA,CAAA,CAAE,MAAM,CAAG,CAAA,CAAA,CAAA,CAAA;AACnE,MAAA,IAAI,MAAM,MAAQ,EAAA;AAChB,QAAA,KAAA,CAAM,KAAM,CAAA,MAAA,GAAS,CAAG,CAAA,CAAA,YAAA,CAAa,gBAAgB,MAAM,CAAA,CAAA;AAAA,OAC7D;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}

package/es/components/button/index.mjs

@@ -1,6 +1,6 @@
 import '../../utils/index.mjs';
 import Button from './src/button2.mjs';
-import ButtonGroup from './src/button-group2.mjs';
+import ButtonGroup from './src/button-group.mjs';
 export { buttonEmits, buttonNativeTypes, buttonProps, buttonTypes } from './src/button.mjs';
 export { buttonGroupContextKey } from './src/constants.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';

package/es/components/button/src/button-group.mjs

@@ -1,9 +1,33 @@
-import { buttonProps } from './button.mjs';
+import { defineComponent, provide, reactive, toRef, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from 'vue';
+import '../../../hooks/index.mjs';
+import { buttonGroupProps } from './button-group2.mjs';
+import { buttonGroupContextKey } from './constants.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const buttonGroupProps = {
-  size: buttonProps.size,
-  type: buttonProps.type
-};
+const __default__ = defineComponent({
+  name: "ElButtonGroup"
+});
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: buttonGroupProps,
+  setup(__props) {
+    const props = __props;
+    provide(buttonGroupContextKey, reactive({
+      size: toRef(props, "size"),
+      type: toRef(props, "type")
+    }));
+    const ns = useNamespace("button");
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(`${unref(ns).b("group")}`)
+      }, [
+        renderSlot(_ctx.$slots, "default")
+      ], 2);
+    };
+  }
+});
+var ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "button-group.vue"]]);
 
-export { buttonGroupProps };
+export { ButtonGroup as default };
 //# sourceMappingURL=button-group.mjs.map

package/es/components/button/src/button-group.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button-group.mjs","sources":["../../../../../../packages/components/button/src/button-group.ts"],"sourcesContent":["import { buttonProps } from './button'\n\nimport type { ExtractPropTypes } from 'vue'\n\nexport const buttonGroupProps = {\n  /**\n   * @description control the size of buttons in this button-group\n   */\n  size: buttonProps.size,\n  /**\n   * @description control the type of buttons in this button-group\n   */\n  type: buttonProps.type,\n} as const\nexport type ButtonGroupProps = ExtractPropTypes<typeof buttonGroupProps>\n"],"names":[],"mappings":";;AACY,MAAC,gBAAgB,GAAG;AAChC,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI;AACxB,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI;AACxB;;;;"}
+{"version":3,"file":"button-group.mjs","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div :class=\"`${ns.b('group')}`\">\n    <slot />\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { provide, reactive, toRef } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { buttonGroupProps } from './button-group'\nimport { buttonGroupContextKey } from './constants'\n\ndefineOptions({\n  name: 'ElButtonGroup',\n})\nconst props = defineProps(buttonGroupProps)\nprovide(\n  buttonGroupContextKey,\n  reactive({\n    size: toRef(props, 'size'),\n    type: toRef(props, 'type'),\n  })\n)\nconst ns = useNamespace('button')\n</script>\n"],"names":[],"mappings":";;;;;;;mCAWc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAEA,IAAA,OAAA,CACE,uBACA,QAAS,CAAA;AAAA,MACP,IAAA,EAAM,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,MACzB,IAAA,EAAM,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,KAC1B,CACH,CAAA,CAAA;AACA,IAAM,MAAA,EAAA,GAAK,aAAa,QAAQ,CAAA,CAAA;;;;;;;;;;;;;;"}

package/es/components/button/src/button-group2.mjs

@@ -1,33 +1,9 @@
-import { defineComponent, provide, reactive, toRef, openBlock, createElementBlock, normalizeClass, unref, renderSlot } from 'vue';
-import '../../../hooks/index.mjs';
-import { buttonGroupProps } from './button-group.mjs';
-import { buttonGroupContextKey } from './constants.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { buttonProps } from './button.mjs';
 
-const __default__ = defineComponent({
-  name: "ElButtonGroup"
-});
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: buttonGroupProps,
-  setup(__props) {
-    const props = __props;
-    provide(buttonGroupContextKey, reactive({
-      size: toRef(props, "size"),
-      type: toRef(props, "type")
-    }));
-    const ns = useNamespace("button");
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: normalizeClass(`${unref(ns).b("group")}`)
-      }, [
-        renderSlot(_ctx.$slots, "default")
-      ], 2);
-    };
-  }
-});
-var ButtonGroup = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "button-group.vue"]]);
+const buttonGroupProps = {
+  size: buttonProps.size,
+  type: buttonProps.type
+};
 
-export { ButtonGroup as default };
+export { buttonGroupProps };
 //# sourceMappingURL=button-group2.mjs.map

package/es/components/button/src/button-group2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"button-group2.mjs","sources":["../../../../../../packages/components/button/src/button-group.vue"],"sourcesContent":["<template>\n  <div :class=\"`${ns.b('group')}`\">\n    <slot />\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport { provide, reactive, toRef } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { buttonGroupProps } from './button-group'\nimport { buttonGroupContextKey } from './constants'\n\ndefineOptions({\n  name: 'ElButtonGroup',\n})\nconst props = defineProps(buttonGroupProps)\nprovide(\n  buttonGroupContextKey,\n  reactive({\n    size: toRef(props, 'size'),\n    type: toRef(props, 'type'),\n  })\n)\nconst ns = useNamespace('button')\n</script>\n"],"names":[],"mappings":";;;;;;;mCAWc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAEA,IAAA,OAAA,CACE,uBACA,QAAS,CAAA;AAAA,MACP,IAAA,EAAM,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,MACzB,IAAA,EAAM,KAAM,CAAA,KAAA,EAAO,MAAM,CAAA;AAAA,KAC1B,CACH,CAAA,CAAA;AACA,IAAM,MAAA,EAAA,GAAK,aAAa,QAAQ,CAAA,CAAA;;;;;;;;;;;;;;"}
+{"version":3,"file":"button-group2.mjs","sources":["../../../../../../packages/components/button/src/button-group.ts"],"sourcesContent":["import { buttonProps } from './button'\n\nimport type { ExtractPropTypes } from 'vue'\n\nexport const buttonGroupProps = {\n  /**\n   * @description control the size of buttons in this button-group\n   */\n  size: buttonProps.size,\n  /**\n   * @description control the type of buttons in this button-group\n   */\n  type: buttonProps.type,\n} as const\nexport type ButtonGroupProps = ExtractPropTypes<typeof buttonGroupProps>\n"],"names":[],"mappings":";;AACY,MAAC,gBAAgB,GAAG;AAChC,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI;AACxB,EAAE,IAAI,EAAE,WAAW,CAAC,IAAI;AACxB;;;;"}

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

@@ -29,7 +29,12 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
     readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
     readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
     readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+    readonly crossorigin: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         readonly hideOnClickModal: BooleanConstructor;
@@ -62,7 +67,12 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
         readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
         readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
         readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-        readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+        readonly crossorigin: {
+            readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
     }>> & {
         onClose?: (() => any) | undefined;
         onShow?: (() => any) | undefined;
@@ -96,7 +106,7 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
     };
     attrs: import("vue").ComputedRef<Record<string, unknown>>;
     imageSrc: import("vue").Ref<string | undefined>;
-    crossorigin: import("vue").Ref<string>;
+    crossorigin: import("vue").Ref<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown> | undefined>;
     hasLoadError: import("vue").Ref<boolean>;
     isLoading: import("vue").Ref<boolean>;
     showViewer: import("vue").Ref<boolean>;
@@ -198,6 +208,7 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
             offsetY: number;
             enableTransition: boolean;
         }>;
+        zIndex: import("vue").Ref<number>;
         isSingle: import("vue").ComputedRef<boolean>;
         isFirst: import("vue").ComputedRef<boolean>;
         isLast: import("vue").ComputedRef<boolean>;
@@ -205,7 +216,6 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
         arrowPrevKls: import("vue").ComputedRef<string[]>;
         arrowNextKls: import("vue").ComputedRef<string[]>;
         imgStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
-        computedZIndex: import("vue").ComputedRef<number>;
         hide: () => void;
         registerEventListener: () => void;
         unregisterEventListener: () => void;
@@ -362,7 +372,12 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
     readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
     readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
     readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+    readonly crossorigin: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }>> & {
     onClose?: (() => any) | undefined;
     onShow?: (() => any) | undefined;
@@ -380,7 +395,6 @@ export declare const ElImage: import("@element-plus/nightly/es/utils").SFCWithIn
     readonly zoomRate: number;
     readonly minScale: number;
     readonly maxScale: number;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>;
     readonly hideOnClickModal: boolean;
     readonly previewTeleported: boolean;
 }>> & Record<string, any>;

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

@@ -30,7 +30,12 @@ export declare const imageProps: {
     readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
     readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
     readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+    readonly crossorigin: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 };
 export declare type ImageProps = ExtractPropTypes<typeof imageProps>;
 export declare const imageEmits: {

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

@@ -55,8 +55,7 @@ const imageProps = buildProps({
     default: 7
   },
   crossorigin: {
-    type: definePropType(String),
-    default: "anonymous"
+    type: definePropType(String)
   }
 });
 const imageEmits = {

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

@@ -1 +1 @@
-{"version":3,"file":"image.mjs","sources":["../../../../../../packages/components/image/src/image.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  isNumber,\n  mutable,\n} from '@element-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\n\nexport const imageProps = buildProps({\n  /**\n   * @description when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode.\n   */\n  hideOnClickModal: Boolean,\n  /**\n   * @description image source, same as native.\n   */\n  src: {\n    type: String,\n    default: '',\n  },\n  /**\n   * @description indicate how the image should be resized to fit its container, same as [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).\n   */\n  fit: {\n    type: String,\n    values: ['', 'contain', 'cover', 'fill', 'none', 'scale-down'],\n    default: '',\n  },\n  /**\n   * @description Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading)\n   */\n  loading: {\n    type: String,\n    values: ['eager', 'lazy'],\n  },\n  /**\n   * @description whether to use lazy load.\n   */\n  lazy: Boolean,\n  /**\n   * @description the container to add scroll listener when using lazy load.\n   */\n  scrollContainer: {\n    type: definePropType<string | HTMLElement | undefined>([String, Object]),\n  },\n  /**\n   * @description allow big image preview.\n   */\n  previewSrcList: {\n    type: definePropType<string[]>(Array),\n    default: () => mutable([] as const),\n  },\n  /**\n   * @description whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`.\n   */\n  previewTeleported: Boolean,\n  /**\n   * @description set image preview z-index.\n   */\n  zIndex: {\n    type: Number,\n  },\n  /**\n   * @description initial preview image index, less than the length of `url-list`.\n   */\n  initialIndex: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description whether the viewer preview is infinite.\n   */\n  infinite: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description whether the image-viewer can be closed by pressing ESC.\n   */\n  closeOnPressEscape: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description the zoom rate of the image viewer zoom event\n   */\n  zoomRate: {\n    type: Number,\n    default: 1.2,\n  },\n  /**\n   * @description the min scale of the image viewer zoom event.\n   */\n  minScale: {\n    type: Number,\n    default: 0.2,\n  },\n  /**\n   * @description the max scale of the image viewer zoom event.\n   */\n  maxScale: {\n    type: Number,\n    default: 7,\n  },\n  /**\n   * @description set HTML attribute: crossorigin.\n   */\n  crossorigin: {\n    type: definePropType<'anonymous' | 'use-credentials' | ''>(String),\n    default: 'anonymous',\n  },\n} as const)\nexport type ImageProps = ExtractPropTypes<typeof imageProps>\n\nexport const imageEmits = {\n  load: (evt: Event) => evt instanceof Event,\n  error: (evt: Event) => evt instanceof Event,\n  switch: (val: number) => isNumber(val),\n  close: () => true,\n  show: () => true,\n}\nexport type ImageEmits = typeof imageEmits\n"],"names":[],"mappings":";;;;;AAMY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,gBAAgB,EAAE,OAAO;AAC3B,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,CAAC;AAClE,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC7B,GAAG;AACH,EAAE,IAAI,EAAE,OAAO;AACf,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,cAAc,EAAE;AAClB,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC,EAAE,CAAC;AAC9B,GAAG;AACH,EAAE,iBAAiB,EAAE,OAAO;AAC5B,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,kBAAkB,EAAE;AACtB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,WAAW;AACxB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,KAAK;AACrC,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,KAAK;AACtC,EAAE,MAAM,EAAE,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC;AAChC,EAAE,KAAK,EAAE,MAAM,IAAI;AACnB,EAAE,IAAI,EAAE,MAAM,IAAI;AAClB;;;;"}
+{"version":3,"file":"image.mjs","sources":["../../../../../../packages/components/image/src/image.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  isNumber,\n  mutable,\n} from '@element-plus/utils'\n\nimport type { ExtractPropTypes } from 'vue'\n\nexport const imageProps = buildProps({\n  /**\n   * @description when enabling preview, use this flag to control whether clicking on backdrop can exit preview mode.\n   */\n  hideOnClickModal: Boolean,\n  /**\n   * @description image source, same as native.\n   */\n  src: {\n    type: String,\n    default: '',\n  },\n  /**\n   * @description indicate how the image should be resized to fit its container, same as [object-fit](https://developer.mozilla.org/en-US/docs/Web/CSS/object-fit).\n   */\n  fit: {\n    type: String,\n    values: ['', 'contain', 'cover', 'fill', 'none', 'scale-down'],\n    default: '',\n  },\n  /**\n   * @description Indicates how the browser should load the image, same as [native](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/img#attr-loading)\n   */\n  loading: {\n    type: String,\n    values: ['eager', 'lazy'],\n  },\n  /**\n   * @description whether to use lazy load.\n   */\n  lazy: Boolean,\n  /**\n   * @description the container to add scroll listener when using lazy load.\n   */\n  scrollContainer: {\n    type: definePropType<string | HTMLElement | undefined>([String, Object]),\n  },\n  /**\n   * @description allow big image preview.\n   */\n  previewSrcList: {\n    type: definePropType<string[]>(Array),\n    default: () => mutable([] as const),\n  },\n  /**\n   * @description whether to append image-viewer to body. A nested parent element attribute transform should have this attribute set to `true`.\n   */\n  previewTeleported: Boolean,\n  /**\n   * @description set image preview z-index.\n   */\n  zIndex: {\n    type: Number,\n  },\n  /**\n   * @description initial preview image index, less than the length of `url-list`.\n   */\n  initialIndex: {\n    type: Number,\n    default: 0,\n  },\n  /**\n   * @description whether the viewer preview is infinite.\n   */\n  infinite: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description whether the image-viewer can be closed by pressing ESC.\n   */\n  closeOnPressEscape: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description the zoom rate of the image viewer zoom event\n   */\n  zoomRate: {\n    type: Number,\n    default: 1.2,\n  },\n  /**\n   * @description the min scale of the image viewer zoom event.\n   */\n  minScale: {\n    type: Number,\n    default: 0.2,\n  },\n  /**\n   * @description the max scale of the image viewer zoom event.\n   */\n  maxScale: {\n    type: Number,\n    default: 7,\n  },\n  /**\n   * @description set HTML attribute: crossorigin.\n   */\n  crossorigin: {\n    type: definePropType<'anonymous' | 'use-credentials' | ''>(String),\n  },\n} as const)\nexport type ImageProps = ExtractPropTypes<typeof imageProps>\n\nexport const imageEmits = {\n  load: (evt: Event) => evt instanceof Event,\n  error: (evt: Event) => evt instanceof Event,\n  switch: (val: number) => isNumber(val),\n  close: () => true,\n  show: () => true,\n}\nexport type ImageEmits = typeof imageEmits\n"],"names":[],"mappings":";;;;;AAMY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,gBAAgB,EAAE,OAAO;AAC3B,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,EAAE,EAAE,SAAS,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,CAAC;AAClE,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;AAC7B,GAAG;AACH,EAAE,IAAI,EAAE,OAAO;AACf,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,GAAG;AACH,EAAE,cAAc,EAAE;AAClB,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC,EAAE,CAAC;AAC9B,GAAG;AACH,EAAE,iBAAiB,EAAE,OAAO;AAC5B,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,kBAAkB,EAAE;AACtB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,GAAG;AAChB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,WAAW,EAAE;AACf,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,GAAG;AACH,CAAC,EAAE;AACS,MAAC,UAAU,GAAG;AAC1B,EAAE,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,KAAK;AACrC,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,KAAK;AACtC,EAAE,MAAM,EAAE,CAAC,GAAG,KAAK,QAAQ,CAAC,GAAG,CAAC;AAChC,EAAE,KAAK,EAAE,MAAM,IAAI;AACnB,EAAE,IAAI,EAAE,MAAM,IAAI;AAClB;;;;"}

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

@@ -30,7 +30,12 @@ declare const _default: import("vue").DefineComponent<{
     readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
     readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
     readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+    readonly crossorigin: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }, {
     props: Readonly<import("@vue/shared").LooseRequired<Readonly<import("vue").ExtractPropTypes<{
         readonly hideOnClickModal: BooleanConstructor;
@@ -63,7 +68,12 @@ declare const _default: import("vue").DefineComponent<{
         readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
         readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
         readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-        readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+        readonly crossorigin: {
+            readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+            readonly required: false;
+            readonly validator: ((val: unknown) => boolean) | undefined;
+            __epPropKey: true;
+        };
     }>> & {
         onClose?: (() => any) | undefined;
         onShow?: (() => any) | undefined;
@@ -97,7 +107,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     attrs: import("vue").ComputedRef<Record<string, unknown>>;
     imageSrc: import("vue").Ref<string | undefined>;
-    crossorigin: import("vue").Ref<string>;
+    crossorigin: import("vue").Ref<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown> | undefined>;
     hasLoadError: import("vue").Ref<boolean>;
     isLoading: import("vue").Ref<boolean>;
     showViewer: import("vue").Ref<boolean>;
@@ -199,6 +209,7 @@ declare const _default: import("vue").DefineComponent<{
             offsetY: number;
             enableTransition: boolean;
         }>;
+        zIndex: import("vue").Ref<number>;
         isSingle: import("vue").ComputedRef<boolean>;
         isFirst: import("vue").ComputedRef<boolean>;
         isLast: import("vue").ComputedRef<boolean>;
@@ -206,7 +217,6 @@ declare const _default: import("vue").DefineComponent<{
         arrowPrevKls: import("vue").ComputedRef<string[]>;
         arrowNextKls: import("vue").ComputedRef<string[]>;
         imgStyle: import("vue").ComputedRef<CSSProperties>;
-        computedZIndex: import("vue").ComputedRef<number>;
         hide: () => void;
         registerEventListener: () => void;
         unregisterEventListener: () => void;
@@ -363,7 +373,12 @@ declare const _default: import("vue").DefineComponent<{
     readonly zoomRate: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 1.2, boolean>;
     readonly minScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0.2, boolean>;
     readonly maxScale: import("@element-plus/nightly/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 7, boolean>;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown, "anonymous", boolean>;
+    readonly crossorigin: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
 }>> & {
     onClose?: (() => any) | undefined;
     onShow?: (() => any) | undefined;
@@ -381,7 +396,6 @@ declare const _default: import("vue").DefineComponent<{
     readonly zoomRate: number;
     readonly minScale: number;
     readonly maxScale: number;
-    readonly crossorigin: import("@element-plus/nightly/es/utils").EpPropMergeType<(new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials") | ((new (...args: any[]) => ("" | "anonymous" | "use-credentials") & {}) | (() => "" | "anonymous" | "use-credentials"))[], unknown, unknown>;
     readonly hideOnClickModal: boolean;
     readonly previewTeleported: boolean;
 }>;

package/es/components/image/src/image2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"image2.mjs","sources":["../../../../../../packages/components/image/src/image.vue"],"sourcesContent":["<template>\n  <div ref=\"container\" :class=\"[ns.b(), $attrs.class]\" :style=\"containerStyle\">\n    <slot v-if=\"hasLoadError\" name=\"error\">\n      <div :class=\"ns.e('error')\">{{ t('el.image.error') }}</div>\n    </slot>\n    <template v-else>\n      <img\n        v-if=\"imageSrc !== undefined\"\n        v-bind=\"attrs\"\n        :src=\"imageSrc\"\n        :loading=\"loading\"\n        :style=\"imageStyle\"\n        :class=\"imageKls\"\n        :crossorigin=\"crossorigin\"\n        @click=\"clickHandler\"\n        @load=\"handleLoad\"\n        @error=\"handleError\"\n      />\n      <div v-if=\"isLoading\" :class=\"ns.e('wrapper')\">\n        <slot name=\"placeholder\">\n          <div :class=\"ns.e('placeholder')\" />\n        </slot>\n      </div>\n    </template>\n    <template v-if=\"preview\">\n      <image-viewer\n        v-if=\"showViewer\"\n        :z-index=\"zIndex\"\n        :initial-index=\"imageIndex\"\n        :infinite=\"infinite\"\n        :zoom-rate=\"zoomRate\"\n        :min-scale=\"minScale\"\n        :max-scale=\"maxScale\"\n        :url-list=\"previewSrcList\"\n        :hide-on-click-modal=\"hideOnClickModal\"\n        :teleported=\"previewTeleported\"\n        :close-on-press-escape=\"closeOnPressEscape\"\n        @close=\"closeViewer\"\n        @switch=\"switchViewer\"\n      >\n        <div v-if=\"$slots.viewer\">\n          <slot name=\"viewer\" />\n        </div>\n      </image-viewer>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onMounted,\n  ref,\n  useAttrs as useRawAttrs,\n  watch,\n} from 'vue'\nimport { useEventListener, useThrottleFn } from '@vueuse/core'\nimport { useAttrs, useLocale, useNamespace } from '@element-plus/hooks'\nimport ImageViewer from '@element-plus/components/image-viewer'\nimport {\n  getScrollContainer,\n  isClient,\n  isElement,\n  isInContainer,\n  isString,\n} from '@element-plus/utils'\nimport { imageEmits, imageProps } from './image'\n\nimport type { CSSProperties, StyleValue } from 'vue'\n\ndefineOptions({\n  name: 'ElImage',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(imageProps)\nconst emit = defineEmits(imageEmits)\n\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image')\nconst rawAttrs = useRawAttrs()\nconst attrs = useAttrs()\n\nconst imageSrc = ref<string | undefined>()\nconst crossorigin = ref<string>(props.crossorigin)\nconst hasLoadError = ref(false)\nconst isLoading = ref(true)\nconst showViewer = ref(false)\nconst container = ref<HTMLElement>()\nconst _scrollContainer = ref<HTMLElement | Window>()\n\nconst supportLoading = isClient && 'loading' in HTMLImageElement.prototype\nlet stopScrollListener: (() => void) | undefined\nlet stopWheelListener: (() => void) | undefined\n\nconst imageKls = computed(() => [\n  ns.e('inner'),\n  preview.value && ns.e('preview'),\n  isLoading.value && ns.is('loading'),\n])\n\nconst containerStyle = computed(() => rawAttrs.style as StyleValue)\n\nconst imageStyle = computed<CSSProperties>(() => {\n  const { fit } = props\n  if (isClient && fit) {\n    return { objectFit: fit }\n  }\n  return {}\n})\n\nconst preview = computed(() => {\n  const { previewSrcList } = props\n  return Array.isArray(previewSrcList) && previewSrcList.length > 0\n})\n\nconst imageIndex = computed(() => {\n  const { previewSrcList, initialIndex } = props\n  let previewIndex = initialIndex\n  if (initialIndex > previewSrcList.length - 1) {\n    previewIndex = 0\n  }\n  return previewIndex\n})\n\nconst isManual = computed(() => {\n  if (props.loading === 'eager') return false\n  return (!supportLoading && props.loading === 'lazy') || props.lazy\n})\n\nconst loadImage = () => {\n  if (!isClient) return\n\n  // reset status\n  isLoading.value = true\n  hasLoadError.value = false\n  imageSrc.value = props.src\n}\n\nfunction handleLoad(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = false\n  emit('load', event)\n}\n\nfunction handleError(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = true\n  emit('error', event)\n}\n\nfunction handleLazyLoad() {\n  if (isInContainer(container.value, _scrollContainer.value)) {\n    loadImage()\n    removeLazyLoadListener()\n  }\n}\n\nconst lazyLoadHandler = useThrottleFn(handleLazyLoad, 200, true)\n\nasync function addLazyLoadListener() {\n  if (!isClient) return\n\n  await nextTick()\n\n  const { scrollContainer } = props\n  if (isElement(scrollContainer)) {\n    _scrollContainer.value = scrollContainer\n  } else if (isString(scrollContainer) && scrollContainer !== '') {\n    _scrollContainer.value =\n      document.querySelector<HTMLElement>(scrollContainer) ?? undefined\n  } else if (container.value) {\n    _scrollContainer.value = getScrollContainer(container.value)\n  }\n\n  if (_scrollContainer.value) {\n    stopScrollListener = useEventListener(\n      _scrollContainer,\n      'scroll',\n      lazyLoadHandler\n    )\n    setTimeout(() => handleLazyLoad(), 100)\n  }\n}\n\nfunction removeLazyLoadListener() {\n  if (!isClient || !_scrollContainer.value || !lazyLoadHandler) return\n\n  stopScrollListener?.()\n  _scrollContainer.value = undefined\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nfunction clickHandler() {\n  // don't show viewer when preview is false\n  if (!preview.value) return\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n  showViewer.value = true\n  emit('show')\n}\n\nfunction closeViewer() {\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  showViewer.value = false\n  emit('close')\n}\n\nfunction switchViewer(val: number) {\n  emit('switch', val)\n}\n\nwatch(\n  () => props.src,\n  () => {\n    if (isManual.value) {\n      // reset status\n      isLoading.value = true\n      hasLoadError.value = false\n      removeLazyLoadListener()\n      addLazyLoadListener()\n    } else {\n      loadImage()\n    }\n  }\n)\n\nonMounted(() => {\n  if (isManual.value) {\n    addLazyLoadListener()\n  } else {\n    loadImage()\n  }\n})\n</script>\n"],"names":["useRawAttrs","useAttrs"],"mappings":";;;;;;;;;;;;;;;;;mCAuEc,CAAA;AAAA,EACZ,IAAM,EAAA,SAAA;AAAA,EACN,YAAc,EAAA,KAAA;AAChB,CAAA,CAAA,CAAA;;;;;;;AAKA,IAAA,IAAI,YAAe,GAAA,EAAA,CAAA;AAEnB,IAAM,MAAA,EAAE,MAAM,SAAU,EAAA,CAAA;AACxB,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAC/B,IAAA,MAAM,WAAWA,QAAY,EAAA,CAAA;AAC7B,IAAA,MAAM,QAAQC,UAAS,EAAA,CAAA;AAEvB,IAAA,MAAM,WAAW,GAAwB,EAAA,CAAA;AACzC,IAAM,MAAA,WAAA,GAAc,GAAY,CAAA,KAAA,CAAM,WAAW,CAAA,CAAA;AACjD,IAAM,MAAA,YAAA,GAAe,IAAI,KAAK,CAAA,CAAA;AAC9B,IAAM,MAAA,SAAA,GAAY,IAAI,IAAI,CAAA,CAAA;AAC1B,IAAM,MAAA,UAAA,GAAa,IAAI,KAAK,CAAA,CAAA;AAC5B,IAAA,MAAM,YAAY,GAAiB,EAAA,CAAA;AACnC,IAAA,MAAM,mBAAmB,GAA0B,EAAA,CAAA;AAEnD,IAAM,MAAA,cAAA,GAAiB,QAAY,IAAA,SAAA,IAAa,gBAAiB,CAAA,SAAA,CAAA;AACjE,IAAI,IAAA,kBAAA,CAAA;AACJ,IAAI,IAAA,iBAAA,CAAA;AAEJ,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAAA,MAC9B,EAAA,CAAG,EAAE,OAAO,CAAA;AAAA,MACZ,OAAQ,CAAA,KAAA,IAAS,EAAG,CAAA,CAAA,CAAE,SAAS,CAAA;AAAA,MAC/B,SAAU,CAAA,KAAA,IAAS,EAAG,CAAA,EAAA,CAAG,SAAS,CAAA;AAAA,KACnC,CAAA,CAAA;AAED,IAAA,MAAM,cAAiB,GAAA,QAAA,CAAS,MAAM,QAAA,CAAS,KAAmB,CAAA,CAAA;AAElE,IAAM,MAAA,UAAA,GAAa,SAAwB,MAAM;AAC/C,MAAA,MAAM,EAAE,GAAQ,EAAA,GAAA,KAAA,CAAA;AAChB,MAAA,IAAI,YAAY,GAAK,EAAA;AACnB,QAAO,OAAA,EAAE,WAAW,GAAI,EAAA,CAAA;AAAA,OAC1B;AACA,MAAA,OAAO,EAAC,CAAA;AAAA,KACT,CAAA,CAAA;AAED,IAAM,MAAA,OAAA,GAAU,SAAS,MAAM;AAC7B,MAAA,MAAM,EAAE,cAAmB,EAAA,GAAA,KAAA,CAAA;AAC3B,MAAA,OAAO,KAAM,CAAA,OAAA,CAAQ,cAAc,CAAA,IAAK,eAAe,MAAS,GAAA,CAAA,CAAA;AAAA,KACjE,CAAA,CAAA;AAED,IAAM,MAAA,UAAA,GAAa,SAAS,MAAM;AAChC,MAAM,MAAA,EAAE,gBAAgB,YAAiB,EAAA,GAAA,KAAA,CAAA;AACzC,MAAA,IAAI,YAAe,GAAA,YAAA,CAAA;AACnB,MAAI,IAAA,YAAA,GAAe,cAAe,CAAA,MAAA,GAAS,CAAG,EAAA;AAC5C,QAAe,YAAA,GAAA,CAAA,CAAA;AAAA,OACjB;AACA,MAAO,OAAA,YAAA,CAAA;AAAA,KACR,CAAA,CAAA;AAED,IAAM,MAAA,QAAA,GAAW,SAAS,MAAM;AAC9B,MAAA,IAAI,MAAM,OAAY,KAAA,OAAA;AAAS,QAAO,OAAA,KAAA,CAAA;AACtC,MAAA,OAAQ,CAAC,cAAA,IAAkB,KAAM,CAAA,OAAA,KAAY,UAAW,KAAM,CAAA,IAAA,CAAA;AAAA,KAC/D,CAAA,CAAA;AAED,IAAA,MAAM,YAAY,MAAM;AACtB,MAAA,IAAI,CAAC,QAAA;AAAU,QAAA,OAAA;AAGf,MAAA,SAAA,CAAU,KAAQ,GAAA,IAAA,CAAA;AAClB,MAAA,YAAA,CAAa,KAAQ,GAAA,KAAA,CAAA;AACrB,MAAA,QAAA,CAAS,QAAQ,KAAM,CAAA,GAAA,CAAA;AAAA,KACzB,CAAA;AAEA,IAAA,SAAA,UAAA,CAAoB,KAAc,EAAA;AAChC,MAAA,SAAA,CAAU,KAAQ,GAAA,KAAA,CAAA;AAClB,MAAA,YAAA,CAAa,KAAQ,GAAA,KAAA,CAAA;AACrB,MAAA,IAAA,CAAK,QAAQ,KAAK,CAAA,CAAA;AAAA,KACpB;AAEA,IAAA,SAAA,WAAA,CAAqB,KAAc,EAAA;AACjC,MAAA,SAAA,CAAU,KAAQ,GAAA,KAAA,CAAA;AAClB,MAAA,YAAA,CAAa,KAAQ,GAAA,IAAA,CAAA;AACrB,MAAA,IAAA,CAAK,SAAS,KAAK,CAAA,CAAA;AAAA,KACrB;AAEA,IAA0B,SAAA,cAAA,GAAA;AACxB,MAAA,IAAI,aAAc,CAAA,SAAA,CAAU,KAAO,EAAA,gBAAA,CAAiB,KAAK,CAAG,EAAA;AAC1D,QAAU,SAAA,EAAA,CAAA;AACV,QAAuB,sBAAA,EAAA,CAAA;AAAA,OACzB;AAAA,KACF;AAEA,IAAA,MAAM,eAAkB,GAAA,aAAA,CAAc,cAAgB,EAAA,GAAA,EAAK,IAAI,CAAA,CAAA;AAE/D,IAAqC,eAAA,mBAAA,GAAA;AACnC,MAAA,IAAI,EAAC,CAAA;AAAU,MAAA,IAAA,CAAA,QAAA;AAEf,QAAA,OAAe;AAEf,MAAA,MAAM,QAAsB,EAAA,CAAA;AAC5B,MAAI,MAAA,EAAA,yBAA4B,CAAA;AAC9B,MAAA,IAAA,SAAA,CAAA,eAAyB,CAAA,EAAA;AAAA,QAChB,gBAAA,CAAA,KAAwB,GAAA;AACjC,OAAA,MAAA,IAAA,QAAiB,CACf,eAAA,CAAS,IAA2B,eAAA,KAAA,EAAA,EAAA;AAAoB,QAC5D,sBAA4B,GAAA,CAAA,EAAA,GAAA,QAAA,CAAA,aAAA,CAAA,eAAA,CAAA,KAAA,IAAA,GAAA,EAAA,GAAA,KAAA,CAAA,CAAA;AAC1B,OAAiB,MAAA,IAAA,SAAA,CAAA,KAAA,EAA2B;AAAe,QAC7D,gBAAA,CAAA,KAAA,GAAA,kBAAA,CAAA,SAAA,CAAA,KAAA,CAAA,CAAA;AAEA,OAAA;AACE,MAAqB,IAAA,gBAAA,CAAA,KAAA,EAAA;AAKrB,QAAW,kBAAqB,GAAA,gBAAM,CAAA,gBAAA,EAAA,QAAA,EAAA,eAAA,CAAA,CAAA;AAAA,QACxC,UAAA,CAAA,MAAA,cAAA,EAAA,EAAA,GAAA,CAAA,CAAA;AAAA,OACF;AAEA,KAAkC;AAChC,IAAA,SAAK,sBAAa,GAAA;AAA4C,MAAA,IAAA,CAAA,QAAA,IAAA,CAAA,gBAAA,CAAA,KAAA,IAAA,CAAA,eAAA;AAE9D,QAAqB,OAAA;AACrB,MAAA,kBAAyB,IAAA,IAAA,GAAA,KAAA,CAAA,GAAA,kBAAA,EAAA,CAAA;AAAA,MAC3B,gBAAA,CAAA,KAAA,GAAA,KAAA,CAAA,CAAA;AAEA,KAAA;AACE,IAAA,SAAO,YAAA,CAAA,CAAA,EAAA;AAAS,MAAA,IAAA,CAAA,CAAA,CAAA,OAAA;AAEhB,QAAI;AACF,MAAA,IAAE,CAAe,CAAA,MAAA,GAAA,CAAA,EAAA;AACjB,QAAO,CAAA,CAAA,cAAA,EAAA,CAAA;AAAA,QACT,OAAA,KAAa,CAAA;AACX,OAAA,MAAiB,IAAA,CAAA,CAAA,MAAA,GAAA,CAAA,EAAA;AACjB,QAAO,CAAA,CAAA,cAAA,EAAA,CAAA;AAAA,QACT,OAAA,KAAA,CAAA;AAAA,OACF;AAEA,KAAwB;AAEtB,IAAA,SAAa,YAAA,GAAA;AAAO,MAAA,IAAA,CAAA,OAAA,CAAA,KAAA;AAEpB,QAAoB,OAAA;AAAwC,MAAA,iBACjD,GAAA,gBAAA,CAAA,OAAA,EAAA,YAAA,EAAA;AAAA,QACV,OAAA,EAAA,KAAA;AAGD,OAAe,CAAA,CAAA;AACf,MAAS,YAAA,WAAsB,CAAA,IAAA,CAAA,KAAA,CAAA,QAAA,CAAA;AAC/B,MAAA,QAAA,CAAA,IAAmB,CAAA,KAAA,CAAA,QAAA,GAAA,QAAA,CAAA;AACnB,MAAA,UAAW,CAAA,KAAA,GAAA,IAAA,CAAA;AAAA,MACb,IAAA,CAAA,MAAA,CAAA,CAAA;AAEA,KAAuB;AACrB,IAAoB,SAAA,WAAA,GAAA;AACpB,MAAS,qBAAsB,IAAA,GAAA,KAAA,CAAA,GAAA,iBAAA,EAAA,CAAA;AAC/B,MAAA,QAAA,CAAA,IAAmB,CAAA,KAAA,CAAA,QAAA,GAAA,YAAA,CAAA;AACnB,MAAA,UAAY,CAAA,KAAA,GAAA,KAAA,CAAA;AAAA,MACd,IAAA,CAAA,OAAA,CAAA,CAAA;AAEA,KAAA;AACE,IAAA,qBAAkB,CAAA,GAAA,EAAA;AAAA,MACpB,IAAA,CAAA,QAAA,EAAA,GAAA,CAAA,CAAA;AAEA,KACE;AAEE,IAAA,KAAA,CAAI,WAAgB,CAAA,GAAA,EAAA,MAAA;AAElB,MAAA,IAAA,QAAU,CAAQ,KAAA,EAAA;AAClB,QAAA,SAAA,CAAA,KAAqB,GAAA,IAAA,CAAA;AACrB,QAAuB,YAAA,CAAA,KAAA,GAAA,KAAA,CAAA;AACvB,QAAoB,sBAAA,EAAA,CAAA;AAAA,QACf,mBAAA,EAAA,CAAA;AACL,OAAU,MAAA;AAAA,QACZ,SAAA,EAAA,CAAA;AAAA,OAEJ;AAEA,KAAA,CAAA,CAAA;AACE,IAAA,gBAAoB;AAClB,MAAoB,IAAA,QAAA,CAAA,KAAA,EAAA;AAAA,QACf,mBAAA,EAAA,CAAA;AACL,OAAU,MAAA;AAAA,QACZ,SAAA,EAAA,CAAA;AAAA,OACD;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"image2.mjs","sources":["../../../../../../packages/components/image/src/image.vue"],"sourcesContent":["<template>\n  <div ref=\"container\" :class=\"[ns.b(), $attrs.class]\" :style=\"containerStyle\">\n    <slot v-if=\"hasLoadError\" name=\"error\">\n      <div :class=\"ns.e('error')\">{{ t('el.image.error') }}</div>\n    </slot>\n    <template v-else>\n      <img\n        v-if=\"imageSrc !== undefined\"\n        v-bind=\"attrs\"\n        :src=\"imageSrc\"\n        :loading=\"loading\"\n        :style=\"imageStyle\"\n        :class=\"imageKls\"\n        :crossorigin=\"crossorigin\"\n        @click=\"clickHandler\"\n        @load=\"handleLoad\"\n        @error=\"handleError\"\n      />\n      <div v-if=\"isLoading\" :class=\"ns.e('wrapper')\">\n        <slot name=\"placeholder\">\n          <div :class=\"ns.e('placeholder')\" />\n        </slot>\n      </div>\n    </template>\n    <template v-if=\"preview\">\n      <image-viewer\n        v-if=\"showViewer\"\n        :z-index=\"zIndex\"\n        :initial-index=\"imageIndex\"\n        :infinite=\"infinite\"\n        :zoom-rate=\"zoomRate\"\n        :min-scale=\"minScale\"\n        :max-scale=\"maxScale\"\n        :url-list=\"previewSrcList\"\n        :hide-on-click-modal=\"hideOnClickModal\"\n        :teleported=\"previewTeleported\"\n        :close-on-press-escape=\"closeOnPressEscape\"\n        @close=\"closeViewer\"\n        @switch=\"switchViewer\"\n      >\n        <div v-if=\"$slots.viewer\">\n          <slot name=\"viewer\" />\n        </div>\n      </image-viewer>\n    </template>\n  </div>\n</template>\n\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onMounted,\n  ref,\n  useAttrs as useRawAttrs,\n  watch,\n} from 'vue'\nimport { useEventListener, useThrottleFn } from '@vueuse/core'\nimport { useAttrs, useLocale, useNamespace } from '@element-plus/hooks'\nimport ImageViewer from '@element-plus/components/image-viewer'\nimport {\n  getScrollContainer,\n  isClient,\n  isElement,\n  isInContainer,\n  isString,\n} from '@element-plus/utils'\nimport { imageEmits, imageProps } from './image'\n\nimport type { CSSProperties, StyleValue } from 'vue'\n\ndefineOptions({\n  name: 'ElImage',\n  inheritAttrs: false,\n})\n\nconst props = defineProps(imageProps)\nconst emit = defineEmits(imageEmits)\n\nlet prevOverflow = ''\n\nconst { t } = useLocale()\nconst ns = useNamespace('image')\nconst rawAttrs = useRawAttrs()\nconst attrs = useAttrs()\n\nconst imageSrc = ref<string | undefined>()\nconst crossorigin = ref(props.crossorigin)\nconst hasLoadError = ref(false)\nconst isLoading = ref(true)\nconst showViewer = ref(false)\nconst container = ref<HTMLElement>()\nconst _scrollContainer = ref<HTMLElement | Window>()\n\nconst supportLoading = isClient && 'loading' in HTMLImageElement.prototype\nlet stopScrollListener: (() => void) | undefined\nlet stopWheelListener: (() => void) | undefined\n\nconst imageKls = computed(() => [\n  ns.e('inner'),\n  preview.value && ns.e('preview'),\n  isLoading.value && ns.is('loading'),\n])\n\nconst containerStyle = computed(() => rawAttrs.style as StyleValue)\n\nconst imageStyle = computed<CSSProperties>(() => {\n  const { fit } = props\n  if (isClient && fit) {\n    return { objectFit: fit }\n  }\n  return {}\n})\n\nconst preview = computed(() => {\n  const { previewSrcList } = props\n  return Array.isArray(previewSrcList) && previewSrcList.length > 0\n})\n\nconst imageIndex = computed(() => {\n  const { previewSrcList, initialIndex } = props\n  let previewIndex = initialIndex\n  if (initialIndex > previewSrcList.length - 1) {\n    previewIndex = 0\n  }\n  return previewIndex\n})\n\nconst isManual = computed(() => {\n  if (props.loading === 'eager') return false\n  return (!supportLoading && props.loading === 'lazy') || props.lazy\n})\n\nconst loadImage = () => {\n  if (!isClient) return\n\n  // reset status\n  isLoading.value = true\n  hasLoadError.value = false\n  imageSrc.value = props.src\n}\n\nfunction handleLoad(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = false\n  emit('load', event)\n}\n\nfunction handleError(event: Event) {\n  isLoading.value = false\n  hasLoadError.value = true\n  emit('error', event)\n}\n\nfunction handleLazyLoad() {\n  if (isInContainer(container.value, _scrollContainer.value)) {\n    loadImage()\n    removeLazyLoadListener()\n  }\n}\n\nconst lazyLoadHandler = useThrottleFn(handleLazyLoad, 200, true)\n\nasync function addLazyLoadListener() {\n  if (!isClient) return\n\n  await nextTick()\n\n  const { scrollContainer } = props\n  if (isElement(scrollContainer)) {\n    _scrollContainer.value = scrollContainer\n  } else if (isString(scrollContainer) && scrollContainer !== '') {\n    _scrollContainer.value =\n      document.querySelector<HTMLElement>(scrollContainer) ?? undefined\n  } else if (container.value) {\n    _scrollContainer.value = getScrollContainer(container.value)\n  }\n\n  if (_scrollContainer.value) {\n    stopScrollListener = useEventListener(\n      _scrollContainer,\n      'scroll',\n      lazyLoadHandler\n    )\n    setTimeout(() => handleLazyLoad(), 100)\n  }\n}\n\nfunction removeLazyLoadListener() {\n  if (!isClient || !_scrollContainer.value || !lazyLoadHandler) return\n\n  stopScrollListener?.()\n  _scrollContainer.value = undefined\n}\n\nfunction wheelHandler(e: WheelEvent) {\n  if (!e.ctrlKey) return\n\n  if (e.deltaY < 0) {\n    e.preventDefault()\n    return false\n  } else if (e.deltaY > 0) {\n    e.preventDefault()\n    return false\n  }\n}\n\nfunction clickHandler() {\n  // don't show viewer when preview is false\n  if (!preview.value) return\n\n  stopWheelListener = useEventListener('wheel', wheelHandler, {\n    passive: false,\n  })\n\n  // prevent body scroll\n  prevOverflow = document.body.style.overflow\n  document.body.style.overflow = 'hidden'\n  showViewer.value = true\n  emit('show')\n}\n\nfunction closeViewer() {\n  stopWheelListener?.()\n  document.body.style.overflow = prevOverflow\n  showViewer.value = false\n  emit('close')\n}\n\nfunction switchViewer(val: number) {\n  emit('switch', val)\n}\n\nwatch(\n  () => props.src,\n  () => {\n    if (isManual.value) {\n      // reset status\n      isLoading.value = true\n      hasLoadError.value = false\n      removeLazyLoadListener()\n      addLazyLoadListener()\n    } else {\n      loadImage()\n    }\n  }\n)\n\nonMounted(() => {\n  if (isManual.value) {\n    addLazyLoadListener()\n  } else {\n    loadImage()\n  }\n})\n</script>\n"],"names":["useRawAttrs","useAttrs"],"mappings":"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"}

package/es/components/image-viewer/index.d.ts

@@ -74,6 +74,7 @@ export declare const ElImageViewer: import("@element-plus/nightly/es/utils").SFC
         offsetY: number;
         enableTransition: boolean;
     }>;
+    zIndex: import("vue").Ref<number>;
     isSingle: import("vue").ComputedRef<boolean>;
     isFirst: import("vue").ComputedRef<boolean>;
     isLast: import("vue").ComputedRef<boolean>;
@@ -81,7 +82,6 @@ export declare const ElImageViewer: import("@element-plus/nightly/es/utils").SFC
     arrowPrevKls: import("vue").ComputedRef<string[]>;
     arrowNextKls: import("vue").ComputedRef<string[]>;
     imgStyle: import("vue").ComputedRef<import("vue").CSSProperties>;
-    computedZIndex: import("vue").ComputedRef<number>;
     hide: () => void;
     registerEventListener: () => void;
     unregisterEventListener: () => void;

package/es/components/image-viewer/src/image-viewer.vue.d.ts

@@ -76,6 +76,7 @@ declare const _default: import("vue").DefineComponent<{
         offsetY: number;
         enableTransition: boolean;
     }>;
+    zIndex: import("vue").Ref<number>;
     isSingle: import("vue").ComputedRef<boolean>;
     isFirst: import("vue").ComputedRef<boolean>;
     isLast: import("vue").ComputedRef<boolean>;
@@ -83,7 +84,6 @@ declare const _default: import("vue").DefineComponent<{
     arrowPrevKls: import("vue").ComputedRef<string[]>;
     arrowNextKls: import("vue").ComputedRef<string[]>;
     imgStyle: import("vue").ComputedRef<CSSProperties>;
-    computedZIndex: import("vue").ComputedRef<number>;
     hide: () => void;
     registerEventListener: () => void;
     unregisterEventListener: () => void;

package/es/components/image-viewer/src/image-viewer2.mjs

@@ -11,7 +11,6 @@ import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 import { useLocale } from '../../../hooks/use-locale/index.mjs';
 import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 import { useZIndex } from '../../../hooks/use-z-index/index.mjs';
-import { isNumber } from '../../../utils/types.mjs';
 import { EVENT_CODE } from '../../../constants/aria.mjs';
 import { keysOf } from '../../../utils/objects.mjs';
 
@@ -24,6 +23,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   props: imageViewerProps,
   emits: imageViewerEmits,
   setup(__props, { expose, emit }) {
+    var _a;
     const props = __props;
     const modes = {
       CONTAIN: {
@@ -52,6 +52,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       offsetY: 0,
       enableTransition: false
     });
+    const zIndex = ref((_a = props.zIndex) != null ? _a : nextZIndex());
     const isSingle = computed(() => {
       const { urlList } = props;
       return urlList.length <= 1;
@@ -105,9 +106,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       }
       return style;
     });
-    const computedZIndex = computed(() => {
-      return isNumber(props.zIndex) ? props.zIndex : nextZIndex();
-    });
     function hide() {
       unregisterEventListener();
       emit("close");
@@ -256,9 +254,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       emit("switch", val);
     });
     onMounted(() => {
-      var _a, _b;
+      var _a2, _b;
       registerEventListener();
-      (_b = (_a = wrapper.value) == null ? void 0 : _a.focus) == null ? void 0 : _b.call(_a);
+      (_b = (_a2 = wrapper.value) == null ? void 0 : _a2.focus) == null ? void 0 : _b.call(_a2);
     });
     expose({
       setActiveItem
@@ -278,7 +276,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
               ref: wrapper,
               tabindex: -1,
               class: normalizeClass(unref(ns).e("wrapper")),
-              style: normalizeStyle({ zIndex: unref(computedZIndex) })
+              style: normalizeStyle({ zIndex: zIndex.value })
             }, [
               createElementVNode("div", {
                 class: normalizeClass(unref(ns).e("mask")),