@element-plus/nightly 0.0.20250703 → 0.0.20250704

package/lib/components/collection/src/collection2.js

@@ -3,15 +3,68 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var vue = require('vue');
-var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
+var collection = require('./collection.js');
+var collectionItem = require('./collection-item.js');
 
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  inheritAttrs: false
-});
-function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  return vue.renderSlot(_ctx.$slots, "default");
-}
-var Collection = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["render", _sfc_render], ["__file", "collection.vue"]]);
+const COLLECTION_ITEM_SIGN = `data-el-collection-item`;
+const createCollectionWithScope = (name) => {
+  const COLLECTION_NAME = `El${name}Collection`;
+  const COLLECTION_ITEM_NAME = `${COLLECTION_NAME}Item`;
+  const COLLECTION_INJECTION_KEY = Symbol(COLLECTION_NAME);
+  const COLLECTION_ITEM_INJECTION_KEY = Symbol(COLLECTION_ITEM_NAME);
+  const ElCollection = {
+    ...collection["default"],
+    name: COLLECTION_NAME,
+    setup() {
+      const collectionRef = vue.ref();
+      const itemMap = /* @__PURE__ */ new Map();
+      const getItems = () => {
+        const collectionEl = vue.unref(collectionRef);
+        if (!collectionEl)
+          return [];
+        const orderedNodes = Array.from(collectionEl.querySelectorAll(`[${COLLECTION_ITEM_SIGN}]`));
+        const items = [...itemMap.values()];
+        return items.sort((a, b) => orderedNodes.indexOf(a.ref) - orderedNodes.indexOf(b.ref));
+      };
+      vue.provide(COLLECTION_INJECTION_KEY, {
+        itemMap,
+        getItems,
+        collectionRef
+      });
+    }
+  };
+  const ElCollectionItem = {
+    ...collectionItem["default"],
+    name: COLLECTION_ITEM_NAME,
+    setup(_, { attrs }) {
+      const collectionItemRef = vue.ref();
+      const collectionInjection = vue.inject(COLLECTION_INJECTION_KEY, void 0);
+      vue.provide(COLLECTION_ITEM_INJECTION_KEY, {
+        collectionItemRef
+      });
+      vue.onMounted(() => {
+        const collectionItemEl = vue.unref(collectionItemRef);
+        if (collectionItemEl) {
+          collectionInjection.itemMap.set(collectionItemEl, {
+            ref: collectionItemEl,
+            ...attrs
+          });
+        }
+      });
+      vue.onBeforeUnmount(() => {
+        const collectionItemEl = vue.unref(collectionItemRef);
+        collectionInjection.itemMap.delete(collectionItemEl);
+      });
+    }
+  };
+  return {
+    COLLECTION_INJECTION_KEY,
+    COLLECTION_ITEM_INJECTION_KEY,
+    ElCollection,
+    ElCollectionItem
+  };
+};
 
-exports["default"] = Collection;
+exports.COLLECTION_ITEM_SIGN = COLLECTION_ITEM_SIGN;
+exports.createCollectionWithScope = createCollectionWithScope;
 //# sourceMappingURL=collection2.js.map

package/lib/components/collection/src/collection2.js.map

@@ -1 +1 @@
-{"version":3,"file":"collection2.js","sources":["../../../../../../packages/components/collection/src/collection.vue"],"sourcesContent":["<template>\n  <slot />\n</template>\n\n<script lang=\"ts\" setup>\ndefineOptions({\n  inheritAttrs: false,\n})\n</script>\n"],"names":["DO_defineComponent","_renderSlot"],"mappings":";;;;;;;kCAKcA,mBAAA,CAAA;AAAA,EACZ,YAAc,EAAA,KAAA;AAChB,CAAA,CAAA,CAAA;;SANEC,cAAQ,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,CAAA,CAAA;;;;;;"}
+{"version":3,"file":"collection2.js","sources":["../../../../../../packages/components/collection/src/collection.ts"],"sourcesContent":["import { inject, onBeforeUnmount, onMounted, provide, ref, unref } from 'vue'\nimport Collection from './collection.vue'\nimport CollectionItem from './collection-item.vue'\n\nimport type { InjectionKey, SetupContext } from 'vue'\nimport type {\n  ElCollectionInjectionContext,\n  ElCollectionItemInjectionContext,\n} from './tokens'\n\nexport const COLLECTION_ITEM_SIGN = `data-el-collection-item`\n\n// Make sure the first letter of name is capitalized\nexport const createCollectionWithScope = (name: string) => {\n  const COLLECTION_NAME = `El${name}Collection`\n  const COLLECTION_ITEM_NAME = `${COLLECTION_NAME}Item`\n  const COLLECTION_INJECTION_KEY: InjectionKey<ElCollectionInjectionContext> =\n    Symbol(COLLECTION_NAME)\n  const COLLECTION_ITEM_INJECTION_KEY: InjectionKey<ElCollectionItemInjectionContext> =\n    Symbol(COLLECTION_ITEM_NAME)\n\n  const ElCollection = {\n    ...Collection,\n    name: COLLECTION_NAME,\n    setup() {\n      const collectionRef = ref<HTMLElement>()\n      const itemMap: ElCollectionInjectionContext['itemMap'] = new Map()\n      const getItems = () => {\n        const collectionEl = unref(collectionRef)\n\n        if (!collectionEl) return []\n        const orderedNodes = Array.from(\n          collectionEl.querySelectorAll(`[${COLLECTION_ITEM_SIGN}]`)\n        )\n\n        const items = [...itemMap.values()]\n\n        return items.sort(\n          (a, b) => orderedNodes.indexOf(a.ref!) - orderedNodes.indexOf(b.ref!)\n        )\n      }\n\n      provide(COLLECTION_INJECTION_KEY, {\n        itemMap,\n        getItems,\n        collectionRef,\n      })\n    },\n  }\n\n  const ElCollectionItem = {\n    ...CollectionItem,\n    name: COLLECTION_ITEM_NAME,\n    setup(_: unknown, { attrs }: SetupContext) {\n      const collectionItemRef = ref<HTMLElement>()\n      const collectionInjection = inject(COLLECTION_INJECTION_KEY, undefined)!\n\n      provide(COLLECTION_ITEM_INJECTION_KEY, {\n        collectionItemRef,\n      })\n\n      onMounted(() => {\n        const collectionItemEl = unref(collectionItemRef)\n        if (collectionItemEl) {\n          collectionInjection.itemMap.set(collectionItemEl, {\n            ref: collectionItemEl,\n            ...attrs,\n          })\n        }\n      })\n\n      onBeforeUnmount(() => {\n        const collectionItemEl = unref(collectionItemRef)!\n        collectionInjection.itemMap.delete(collectionItemEl)\n      })\n    },\n  }\n\n  return {\n    COLLECTION_INJECTION_KEY,\n    COLLECTION_ITEM_INJECTION_KEY,\n    ElCollection,\n    ElCollectionItem,\n  }\n}\n"],"names":["Collection","ref","unref","provide","CollectionItem","inject","onMounted","onBeforeUnmount"],"mappings":"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"}

package/lib/components/dropdown/src/dropdown-item-impl.js

@@ -9,7 +9,7 @@ var tokens = require('./tokens.js');
 var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
 var rovingFocusGroup = require('../../roving-focus-group/src/roving-focus-group.js');
 var tokens$1 = require('../../roving-focus-group/src/tokens.js');
-var collection = require('../../collection/src/collection.js');
+var collection = require('../../collection/src/collection2.js');
 var index$1 = require('../../../hooks/use-namespace/index.js');
 var refs = require('../../../utils/vue/refs.js');
 var event = require('../../../utils/dom/event.js');

package/lib/components/dropdown/src/dropdown.js

@@ -8,7 +8,7 @@ var runtime = require('../../../utils/vue/props/runtime.js');
 var aria = require('../../../constants/aria.js');
 var content = require('../../tooltip/src/content.js');
 var icon = require('../../../utils/vue/icon.js');
-var collection = require('../../collection/src/collection.js');
+var collection = require('../../collection/src/collection2.js');
 
 const dropdownProps = runtime.buildProps({
   trigger: trigger.useTooltipTriggerProps.trigger,

package/lib/components/image-viewer/index.js

@@ -2,8 +2,8 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var imageViewer$1 = require('./src/image-viewer.js');
-var imageViewer = require('./src/image-viewer2.js');
+var imageViewer$1 = require('./src/image-viewer2.js');
+var imageViewer = require('./src/image-viewer.js');
 var install = require('../../utils/vue/install.js');
 
 const ElImageViewer = install.withInstall(imageViewer$1["default"]);

package/lib/components/image-viewer/src/image-viewer.js

@@ -2,455 +2,58 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-var vue = require('vue');
-var core = require('@vueuse/core');
-var lodashUnified = require('lodash-unified');
-var focusTrap = require('../../focus-trap/src/focus-trap.js');
-var index$3 = require('../../teleport/index.js');
-var index$4 = require('../../icon/index.js');
-var iconsVue = require('@element-plus/icons-vue');
-var imageViewer = require('./image-viewer2.js');
-var pluginVue_exportHelper = require('../../../_virtual/plugin-vue_export-helper.js');
-var index = require('../../../hooks/use-locale/index.js');
-var index$1 = require('../../../hooks/use-namespace/index.js');
-var index$2 = require('../../../hooks/use-z-index/index.js');
-var aria = require('../../../constants/aria.js');
-var objects = require('../../../utils/objects.js');
+var runtime = require('../../../utils/vue/props/runtime.js');
+var typescript = require('../../../utils/typescript.js');
+var types = require('../../../utils/types.js');
 
-const __default__ = vue.defineComponent({
-  name: "ElImageViewer"
-});
-const _sfc_main = /* @__PURE__ */ vue.defineComponent({
-  ...__default__,
-  props: imageViewer.imageViewerProps,
-  emits: imageViewer.imageViewerEmits,
-  setup(__props, { expose, emit }) {
-    var _a;
-    const props = __props;
-    const modes = {
-      CONTAIN: {
-        name: "contain",
-        icon: vue.markRaw(iconsVue.FullScreen)
-      },
-      ORIGINAL: {
-        name: "original",
-        icon: vue.markRaw(iconsVue.ScaleToOriginal)
-      }
-    };
-    let stopWheelListener;
-    let prevOverflow = "";
-    const { t } = index.useLocale();
-    const ns = index$1.useNamespace("image-viewer");
-    const { nextZIndex } = index$2.useZIndex();
-    const wrapper = vue.ref();
-    const imgRefs = vue.ref([]);
-    const scopeEventListener = vue.effectScope();
-    const loading = vue.ref(true);
-    const activeIndex = vue.ref(props.initialIndex);
-    const mode = vue.shallowRef(modes.CONTAIN);
-    const transform = vue.ref({
-      scale: 1,
-      deg: 0,
-      offsetX: 0,
-      offsetY: 0,
-      enableTransition: false
-    });
-    const zIndex = vue.ref((_a = props.zIndex) != null ? _a : nextZIndex());
-    const isSingle = vue.computed(() => {
-      const { urlList } = props;
-      return urlList.length <= 1;
-    });
-    const isFirst = vue.computed(() => activeIndex.value === 0);
-    const isLast = vue.computed(() => activeIndex.value === props.urlList.length - 1);
-    const currentImg = vue.computed(() => props.urlList[activeIndex.value]);
-    const arrowPrevKls = vue.computed(() => [
-      ns.e("btn"),
-      ns.e("prev"),
-      ns.is("disabled", !props.infinite && isFirst.value)
-    ]);
-    const arrowNextKls = vue.computed(() => [
-      ns.e("btn"),
-      ns.e("next"),
-      ns.is("disabled", !props.infinite && isLast.value)
-    ]);
-    const imgStyle = vue.computed(() => {
-      const { scale, deg, offsetX, offsetY, enableTransition } = transform.value;
-      let translateX = offsetX / scale;
-      let translateY = offsetY / scale;
-      const radian = deg * Math.PI / 180;
-      const cosRadian = Math.cos(radian);
-      const sinRadian = Math.sin(radian);
-      translateX = translateX * cosRadian + translateY * sinRadian;
-      translateY = translateY * cosRadian - offsetX / scale * sinRadian;
-      const style = {
-        transform: `scale(${scale}) rotate(${deg}deg) translate(${translateX}px, ${translateY}px)`,
-        transition: enableTransition ? "transform .3s" : ""
-      };
-      if (mode.value.name === modes.CONTAIN.name) {
-        style.maxWidth = style.maxHeight = "100%";
-      }
-      return style;
-    });
-    const progress = vue.computed(() => `${activeIndex.value + 1} / ${props.urlList.length}`);
-    function hide() {
-      unregisterEventListener();
-      stopWheelListener == null ? void 0 : stopWheelListener();
-      document.body.style.overflow = prevOverflow;
-      emit("close");
-    }
-    function registerEventListener() {
-      const keydownHandler = lodashUnified.throttle((e) => {
-        switch (e.code) {
-          case aria.EVENT_CODE.esc:
-            props.closeOnPressEscape && hide();
-            break;
-          case aria.EVENT_CODE.space:
-            toggleMode();
-            break;
-          case aria.EVENT_CODE.left:
-            prev();
-            break;
-          case aria.EVENT_CODE.up:
-            handleActions("zoomIn");
-            break;
-          case aria.EVENT_CODE.right:
-            next();
-            break;
-          case aria.EVENT_CODE.down:
-            handleActions("zoomOut");
-            break;
-        }
-      });
-      const mousewheelHandler = lodashUnified.throttle((e) => {
-        const delta = e.deltaY || e.deltaX;
-        handleActions(delta < 0 ? "zoomIn" : "zoomOut", {
-          zoomRate: props.zoomRate,
-          enableTransition: false
-        });
-      });
-      scopeEventListener.run(() => {
-        core.useEventListener(document, "keydown", keydownHandler);
-        core.useEventListener(document, "wheel", mousewheelHandler);
-      });
-    }
-    function unregisterEventListener() {
-      scopeEventListener.stop();
-    }
-    function handleImgLoad() {
-      loading.value = false;
-    }
-    function handleImgError(e) {
-      loading.value = false;
-      e.target.alt = t("el.image.error");
-    }
-    function handleMouseDown(e) {
-      if (loading.value || e.button !== 0 || !wrapper.value)
-        return;
-      transform.value.enableTransition = false;
-      const { offsetX, offsetY } = transform.value;
-      const startX = e.pageX;
-      const startY = e.pageY;
-      const dragHandler = lodashUnified.throttle((ev) => {
-        transform.value = {
-          ...transform.value,
-          offsetX: offsetX + ev.pageX - startX,
-          offsetY: offsetY + ev.pageY - startY
-        };
-      });
-      const removeMousemove = core.useEventListener(document, "mousemove", dragHandler);
-      core.useEventListener(document, "mouseup", () => {
-        removeMousemove();
-      });
-      e.preventDefault();
-    }
-    function reset() {
-      transform.value = {
-        scale: 1,
-        deg: 0,
-        offsetX: 0,
-        offsetY: 0,
-        enableTransition: false
-      };
-    }
-    function toggleMode() {
-      if (loading.value)
-        return;
-      const modeNames = objects.keysOf(modes);
-      const modeValues = Object.values(modes);
-      const currentMode = mode.value.name;
-      const index = modeValues.findIndex((i) => i.name === currentMode);
-      const nextIndex = (index + 1) % modeNames.length;
-      mode.value = modes[modeNames[nextIndex]];
-      reset();
-    }
-    function setActiveItem(index) {
-      const len = props.urlList.length;
-      activeIndex.value = (index + len) % len;
-    }
-    function prev() {
-      if (isFirst.value && !props.infinite)
-        return;
-      setActiveItem(activeIndex.value - 1);
-    }
-    function next() {
-      if (isLast.value && !props.infinite)
-        return;
-      setActiveItem(activeIndex.value + 1);
-    }
-    function handleActions(action, options = {}) {
-      if (loading.value)
-        return;
-      const { minScale, maxScale } = props;
-      const { zoomRate, rotateDeg, enableTransition } = {
-        zoomRate: props.zoomRate,
-        rotateDeg: 90,
-        enableTransition: true,
-        ...options
-      };
-      switch (action) {
-        case "zoomOut":
-          if (transform.value.scale > minScale) {
-            transform.value.scale = Number.parseFloat((transform.value.scale / zoomRate).toFixed(3));
-          }
-          break;
-        case "zoomIn":
-          if (transform.value.scale < maxScale) {
-            transform.value.scale = Number.parseFloat((transform.value.scale * zoomRate).toFixed(3));
-          }
-          break;
-        case "clockwise":
-          transform.value.deg += rotateDeg;
-          emit("rotate", transform.value.deg);
-          break;
-        case "anticlockwise":
-          transform.value.deg -= rotateDeg;
-          emit("rotate", transform.value.deg);
-          break;
-      }
-      transform.value.enableTransition = enableTransition;
-    }
-    function onFocusoutPrevented(event) {
-      var _a2;
-      if (((_a2 = event.detail) == null ? void 0 : _a2.focusReason) === "pointer") {
-        event.preventDefault();
-      }
-    }
-    function onCloseRequested() {
-      if (props.closeOnPressEscape) {
-        hide();
-      }
-    }
-    function wheelHandler(e) {
-      if (!e.ctrlKey)
-        return;
-      if (e.deltaY < 0) {
-        e.preventDefault();
-        return false;
-      } else if (e.deltaY > 0) {
-        e.preventDefault();
-        return false;
-      }
-    }
-    vue.watch(currentImg, () => {
-      vue.nextTick(() => {
-        const $img = imgRefs.value[0];
-        if (!($img == null ? void 0 : $img.complete)) {
-          loading.value = true;
-        }
-      });
-    });
-    vue.watch(activeIndex, (val) => {
-      reset();
-      emit("switch", val);
-    });
-    vue.onMounted(() => {
-      registerEventListener();
-      stopWheelListener = core.useEventListener("wheel", wheelHandler, {
-        passive: false
-      });
-      prevOverflow = document.body.style.overflow;
-      document.body.style.overflow = "hidden";
-    });
-    expose({
-      setActiveItem
-    });
-    return (_ctx, _cache) => {
-      return vue.openBlock(), vue.createBlock(vue.unref(index$3.ElTeleport), {
-        to: "body",
-        disabled: !_ctx.teleported
-      }, {
-        default: vue.withCtx(() => [
-          vue.createVNode(vue.Transition, {
-            name: "viewer-fade",
-            appear: ""
-          }, {
-            default: vue.withCtx(() => [
-              vue.createElementVNode("div", {
-                ref_key: "wrapper",
-                ref: wrapper,
-                tabindex: -1,
-                class: vue.normalizeClass(vue.unref(ns).e("wrapper")),
-                style: vue.normalizeStyle({ zIndex: zIndex.value })
-              }, [
-                vue.createVNode(vue.unref(focusTrap["default"]), {
-                  loop: "",
-                  trapped: "",
-                  "focus-trap-el": wrapper.value,
-                  "focus-start-el": "container",
-                  onFocusoutPrevented,
-                  onReleaseRequested: onCloseRequested
-                }, {
-                  default: vue.withCtx(() => [
-                    vue.createElementVNode("div", {
-                      class: vue.normalizeClass(vue.unref(ns).e("mask")),
-                      onClick: vue.withModifiers(($event) => _ctx.hideOnClickModal && hide(), ["self"])
-                    }, null, 10, ["onClick"]),
-                    vue.createCommentVNode(" CLOSE "),
-                    vue.createElementVNode("span", {
-                      class: vue.normalizeClass([vue.unref(ns).e("btn"), vue.unref(ns).e("close")]),
-                      onClick: hide
-                    }, [
-                      vue.createVNode(vue.unref(index$4.ElIcon), null, {
-                        default: vue.withCtx(() => [
-                          vue.createVNode(vue.unref(iconsVue.Close))
-                        ]),
-                        _: 1
-                      })
-                    ], 2),
-                    vue.createCommentVNode(" ARROW "),
-                    !vue.unref(isSingle) ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 0 }, [
-                      vue.createElementVNode("span", {
-                        class: vue.normalizeClass(vue.unref(arrowPrevKls)),
-                        onClick: prev
-                      }, [
-                        vue.createVNode(vue.unref(index$4.ElIcon), null, {
-                          default: vue.withCtx(() => [
-                            vue.createVNode(vue.unref(iconsVue.ArrowLeft))
-                          ]),
-                          _: 1
-                        })
-                      ], 2),
-                      vue.createElementVNode("span", {
-                        class: vue.normalizeClass(vue.unref(arrowNextKls)),
-                        onClick: next
-                      }, [
-                        vue.createVNode(vue.unref(index$4.ElIcon), null, {
-                          default: vue.withCtx(() => [
-                            vue.createVNode(vue.unref(iconsVue.ArrowRight))
-                          ]),
-                          _: 1
-                        })
-                      ], 2)
-                    ], 64)) : vue.createCommentVNode("v-if", true),
-                    _ctx.$slots.progress || _ctx.showProgress ? (vue.openBlock(), vue.createElementBlock("div", {
-                      key: 1,
-                      class: vue.normalizeClass([vue.unref(ns).e("btn"), vue.unref(ns).e("progress")])
-                    }, [
-                      vue.renderSlot(_ctx.$slots, "progress", {
-                        activeIndex: activeIndex.value,
-                        total: _ctx.urlList.length
-                      }, () => [
-                        vue.createTextVNode(vue.toDisplayString(vue.unref(progress)), 1)
-                      ])
-                    ], 2)) : vue.createCommentVNode("v-if", true),
-                    vue.createCommentVNode(" ACTIONS "),
-                    vue.createElementVNode("div", {
-                      class: vue.normalizeClass([vue.unref(ns).e("btn"), vue.unref(ns).e("actions")])
-                    }, [
-                      vue.createElementVNode("div", {
-                        class: vue.normalizeClass(vue.unref(ns).e("actions__inner"))
-                      }, [
-                        vue.renderSlot(_ctx.$slots, "toolbar", {
-                          actions: handleActions,
-                          prev,
-                          next,
-                          reset: toggleMode,
-                          activeIndex: activeIndex.value,
-                          setActiveItem
-                        }, () => [
-                          vue.createVNode(vue.unref(index$4.ElIcon), {
-                            onClick: ($event) => handleActions("zoomOut")
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(iconsVue.ZoomOut))
-                            ]),
-                            _: 1
-                          }, 8, ["onClick"]),
-                          vue.createVNode(vue.unref(index$4.ElIcon), {
-                            onClick: ($event) => handleActions("zoomIn")
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(iconsVue.ZoomIn))
-                            ]),
-                            _: 1
-                          }, 8, ["onClick"]),
-                          vue.createElementVNode("i", {
-                            class: vue.normalizeClass(vue.unref(ns).e("actions__divider"))
-                          }, null, 2),
-                          vue.createVNode(vue.unref(index$4.ElIcon), { onClick: toggleMode }, {
-                            default: vue.withCtx(() => [
-                              (vue.openBlock(), vue.createBlock(vue.resolveDynamicComponent(vue.unref(mode).icon)))
-                            ]),
-                            _: 1
-                          }),
-                          vue.createElementVNode("i", {
-                            class: vue.normalizeClass(vue.unref(ns).e("actions__divider"))
-                          }, null, 2),
-                          vue.createVNode(vue.unref(index$4.ElIcon), {
-                            onClick: ($event) => handleActions("anticlockwise")
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(iconsVue.RefreshLeft))
-                            ]),
-                            _: 1
-                          }, 8, ["onClick"]),
-                          vue.createVNode(vue.unref(index$4.ElIcon), {
-                            onClick: ($event) => handleActions("clockwise")
-                          }, {
-                            default: vue.withCtx(() => [
-                              vue.createVNode(vue.unref(iconsVue.RefreshRight))
-                            ]),
-                            _: 1
-                          }, 8, ["onClick"])
-                        ])
-                      ], 2)
-                    ], 2),
-                    vue.createCommentVNode(" CANVAS "),
-                    vue.createElementVNode("div", {
-                      class: vue.normalizeClass(vue.unref(ns).e("canvas"))
-                    }, [
-                      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.urlList, (url, i) => {
-                        return vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: i }, [
-                          i === activeIndex.value ? (vue.openBlock(), vue.createElementBlock("img", {
-                            key: 0,
-                            ref_for: true,
-                            ref: (el) => imgRefs.value[i] = el,
-                            src: url,
-                            style: vue.normalizeStyle(vue.unref(imgStyle)),
-                            class: vue.normalizeClass(vue.unref(ns).e("img")),
-                            crossorigin: _ctx.crossorigin,
-                            onLoad: handleImgLoad,
-                            onError: handleImgError,
-                            onMousedown: handleMouseDown
-                          }, null, 46, ["src", "crossorigin"])) : vue.createCommentVNode("v-if", true)
-                        ], 64);
-                      }), 128))
-                    ], 2),
-                    vue.renderSlot(_ctx.$slots, "default")
-                  ]),
-                  _: 3
-                }, 8, ["focus-trap-el"])
-              ], 6)
-            ]),
-            _: 3
-          })
-        ]),
-        _: 3
-      }, 8, ["disabled"]);
-    };
+const imageViewerProps = runtime.buildProps({
+  urlList: {
+    type: runtime.definePropType(Array),
+    default: () => typescript.mutable([])
+  },
+  zIndex: {
+    type: Number
+  },
+  initialIndex: {
+    type: Number,
+    default: 0
+  },
+  infinite: {
+    type: Boolean,
+    default: true
+  },
+  hideOnClickModal: Boolean,
+  teleported: Boolean,
+  closeOnPressEscape: {
+    type: Boolean,
+    default: true
+  },
+  zoomRate: {
+    type: Number,
+    default: 1.2
+  },
+  minScale: {
+    type: Number,
+    default: 0.2
+  },
+  maxScale: {
+    type: Number,
+    default: 7
+  },
+  showProgress: {
+    type: Boolean,
+    default: false
+  },
+  crossorigin: {
+    type: runtime.definePropType(String)
   }
 });
-var ImageViewer = /* @__PURE__ */ pluginVue_exportHelper["default"](_sfc_main, [["__file", "image-viewer.vue"]]);
+const imageViewerEmits = {
+  close: () => true,
+  switch: (index) => types.isNumber(index),
+  rotate: (deg) => types.isNumber(deg)
+};
 
-exports["default"] = ImageViewer;
+exports.imageViewerEmits = imageViewerEmits;
+exports.imageViewerProps = imageViewerProps;
 //# sourceMappingURL=image-viewer.js.map