x-next 1.1.0 → 1.2.0

package/dist/es/components/image/Image.vue2.js

@@ -1,18 +1,18 @@
-import { defineComponent as q, toRefs as D, inject as H, ref as J, computed as i, reactive as Q, watchEffect as F } from "vue";
+import { defineComponent as K, toRefs as T, inject as q, ref as x, computed as t, reactive as D, watchEffect as H, watch as J, onBeforeUnmount as Q } from "vue";
 import W from "../../icons/default/close-circle-fill.js";
 import X from "../../icons/animation/animation-loading.js";
 import Y from "./image-footer.vue.js";
 import Z from "./ImagePreview.vue.js";
 import $ from "./hooks/use-image-load-status.js";
-import { isServerRendering as x } from "../../_utils/dom.js";
-import { normalizeImageSizeProp as j } from "./utils/index.js";
-import { omit as ee } from "../../_utils/omit.js";
+import { isServerRendering as ee } from "../../_utils/dom.js";
+import { normalizeImageSizeProp as V } from "./utils/index.js";
+import { omit as te } from "../../_utils/omit.js";
 import ie from "../../_hooks/use-merge-state.js";
-import { PreviewGroupInjectionKey as te } from "./context.js";
-import { isBoolean as re } from "../../_utils/is.js";
-import { getClassNameMixin as oe } from "../../_utils/config.js";
-let ae = 0;
-const Se = q({
+import { PreviewGroupInjectionKey as re } from "./context.js";
+import { isBoolean as oe } from "../../_utils/is.js";
+import { getClassNameMixin as ae } from "../../_utils/config.js";
+let le = 0;
+const be = K({
   name: "Image",
   components: {
     IconImageClose: W,
@@ -169,91 +169,92 @@ const Se = q({
    * @en Extra content at the bottom
    * @slot extra
    */
-  setup(a, { attrs: l, slots: N, emit: y }) {
+  setup(s, { attrs: u, slots: C, emit: o }) {
     const {
-      height: n,
-      width: s,
-      hideFooter: m,
-      title: u,
-      description: f,
-      src: t,
-      footerPosition: S,
-      defaultPreviewVisible: z,
-      previewVisible: A,
-      preview: v,
-      previewProps: p
-    } = D(a), e = H(te, void 0), r = oe("image"), c = J(), { isLoaded: o, isError: b, isLoading: I, setLoadStatus: d } = $(), h = i(() => ({
-      width: j(s == null ? void 0 : s.value),
-      height: j(n == null ? void 0 : n.value)
-    })), E = i(() => a.fit ? { objectFit: a.fit } : {}), _ = i(() => [
+      height: m,
+      width: f,
+      hideFooter: v,
+      title: p,
+      description: d,
+      src: i,
+      footerPosition: b,
+      defaultPreviewVisible: F,
+      previewVisible: j,
+      preview: c,
+      previewProps: g
+    } = T(s), e = q(re, void 0), r = ae("image"), w = x(), { isLoaded: a, isError: I, isLoading: h, setLoadStatus: y } = $(), P = t(() => ({
+      width: V(f == null ? void 0 : f.value),
+      height: V(m == null ? void 0 : m.value)
+    })), N = t(() => s.fit ? { objectFit: s.fit } : {}), z = t(() => [
       r.block,
       {
-        [r.element("loading")]: I.value,
-        [r.element("loading-error")]: b.value,
+        [r.element("loading")]: h.value,
+        [r.element("loading-error")]: I.value,
         // isLoaded / showFooter 是 ref，这里必须解引用；
         // 直接写对象引用会让条件恒为真，没有 footer 的图片也带上定位类
-        [r.element("with-footer-inner")]: o.value && g.value && S.value === "inner",
-        [r.element("with-footer-outer")]: o.value && g.value && S.value === "outer"
+        [r.element("with-footer-inner")]: a.value && S.value && b.value === "inner",
+        [r.element("with-footer-outer")]: a.value && S.value && b.value === "outer"
       },
-      l.class
-    ]), k = i(() => [
-      h.value,
-      l.style
-    ]), g = i(() => u != null && u.value || f != null && f.value || N.extra ? re(m.value) ? !m.value && o.value : m.value === "never" : !1), C = i(() => ee(l, ["class", "style"])), [M, P] = ie(
-      z.value,
-      Q({
-        value: A
+      u.class
+    ]), A = t(() => [
+      P.value,
+      u.style
+    ]), S = t(() => p != null && p.value || d != null && d.value || C.extra ? oe(v.value) ? !v.value && a.value : v.value === "never" : !1), E = t(() => te(u, ["class", "style"])), [_, B] = ie(
+      F.value,
+      D({
+        value: j
       })
-    ), O = i(() => !(e != null && e.preview) && v.value);
-    F(() => {
-      x || !c.value || (c.value.src = t == null ? void 0 : t.value, d("loading"));
+    ), k = t(() => !(e != null && e.preview) && c.value);
+    H(() => {
+      ee || !w.value || (w.value.src = i == null ? void 0 : i.value, y("loading"));
     });
-    const L = ae++;
-    F((U) => {
-      var B, V;
-      const w = (V = e == null ? void 0 : e.registerImageUrl) == null ? void 0 : V.call(
-        e,
-        L,
-        (((B = p == null ? void 0 : p.value) == null ? void 0 : B.src) ?? (t == null ? void 0 : t.value)) || "",
-        v.value
-      );
-      U(() => {
-        w == null || w();
-      });
-    });
-    function G() {
-      d("loaded");
+    const L = le++;
+    if (e) {
+      let l;
+      J(
+        [() => {
+          var n;
+          return (((n = g == null ? void 0 : g.value) == null ? void 0 : n.src) ?? (i == null ? void 0 : i.value)) || "";
+        }, c],
+        ([n, G]) => {
+          l = e.registerImageUrl(L, n, G);
+        },
+        { immediate: !0 }
+      ), Q(() => l == null ? void 0 : l());
+    }
+    function M() {
+      y("loaded");
     }
-    function K() {
-      d("error");
+    function O() {
+      y("error");
     }
     function R() {
-      v.value && (e != null && e.preview ? e.preview(L) : (y("preview-visible-change", !0), P(!0)));
+      c.value && (e != null && e.preview ? e.preview(L) : (o("preview-visible-change", !0), o("update:previewVisible", !0), B(!0)));
     }
-    function T() {
-      y("preview-visible-change", !1), P(!1);
+    function U() {
+      o("preview-visible-change", !1), o("update:previewVisible", !1), B(!1);
     }
     return {
-      refImg: c,
+      refImg: w,
       className: r,
-      wrapperClassNames: _,
-      wrapperStyles: k,
-      showFooter: g,
-      imgProps: C,
-      imgStyle: h,
-      isLoaded: o,
-      isError: b,
-      isLoading: I,
-      mergedPreviewVisible: M,
-      mergePreview: O,
-      onImgLoaded: G,
-      onImgLoadError: K,
+      wrapperClassNames: z,
+      wrapperStyles: A,
+      showFooter: S,
+      imgProps: E,
+      imgStyle: P,
+      isLoaded: a,
+      isError: I,
+      isLoading: h,
+      mergedPreviewVisible: _,
+      mergePreview: k,
+      onImgLoaded: M,
+      onImgLoadError: O,
       onImgClick: R,
-      onPreviewClose: T,
-      fitStyle: E
+      onPreviewClose: U,
+      fitStyle: N
     };
   }
 });
 export {
-  Se as default
+  be as default
 };

package/dist/es/components/image/ImagePreview.vue.js

@@ -1,10 +1,11 @@
 import b from "./ImagePreview.vue2.js";
-import { resolveComponent as i, openBlock as l, createBlock as m, Teleport as w, createElementVNode as d, normalizeStyle as p, normalizeClass as s, createVNode as t, Transition as u, withCtx as g, withDirectives as C, vShow as L, createElementBlock as r, withModifiers as N, createCommentVNode as n, toDisplayString as E, renderSlot as I, normalizeProps as P, mergeProps as $ } from "vue";
+import { resolveComponent as i, openBlock as l, createBlock as m, Teleport as w, createElementVNode as d, normalizeStyle as p, normalizeClass as s, createVNode as t, Transition as g, withCtx as u, withDirectives as C, vShow as L, createElementBlock as r, withModifiers as N, createCommentVNode as n, toDisplayString as E, renderSlot as I, normalizeProps as P, mergeProps as $ } from "vue";
 import V from "../../_virtual/_plugin-vue_export-helper.js";
 const M = ["aria-label"], S = ["src"], A = ["aria-label"];
-function B(e, a, T, W, c, z) {
-  const k = i("IconLoading"), f = i("PreviewToolbar"), y = i("IconClose"), v = i("PreviewArrow");
-  return l(), m(w, {
+function B(e, a, T, W, z, D) {
+  const k = i("IconLoading"), y = i("PreviewToolbar"), f = i("IconClose"), v = i("PreviewArrow");
+  return e.mounted ? (l(), m(w, {
+    key: 0,
     to: e.container || "body",
     disabled: e.teleportDisabled
   }, [
@@ -12,12 +13,12 @@ function B(e, a, T, W, c, z) {
       class: s(e.classNames),
       style: p(e.wrapperStyles)
     }, [
-      t(u, {
+      t(g, {
         name: "image-fade",
         onBeforeEnter: a[0] || (a[0] = (o) => o.parentElement && (o.parentElement.style.display = "block")),
         onAfterLeave: a[1] || (a[1] = (o) => o.parentElement && (o.parentElement.style.display = ""))
       }, {
-        default: g(() => [
+        default: u(() => [
           C(d("div", {
             class: s(e.className.element("mask"))
           }, null, 2), [
@@ -65,8 +66,8 @@ function B(e, a, T, W, c, z) {
         }, [
           t(k)
         ], 2)) : n("", !0),
-        t(u, { name: "image-fade" }, {
-          default: g(() => [
+        t(g, { name: "image-fade" }, {
+          default: u(() => [
             e.scaleValueVisible ? (l(), r("div", {
               key: 0,
               class: s(e.className.element("scale-value"))
@@ -74,12 +75,12 @@ function B(e, a, T, W, c, z) {
           ]),
           _: 1
         }),
-        e.isLoaded && e.actionsLayout.length ? (l(), m(f, {
+        e.isLoaded && e.actionsLayout.length ? (l(), m(y, {
           key: 1,
           actions: e.actions,
           "actions-layout": e.actionsLayout
         }, {
-          default: g(() => [
+          default: u(() => [
             I(e.$slots, "actions")
           ]),
           _: 3
@@ -91,12 +92,12 @@ function B(e, a, T, W, c, z) {
           "aria-label": e.t("imagePreview.closeLabel"),
           onClick: a[5] || (a[5] = (...o) => e.onCloseClick && e.onCloseClick(...o))
         }, [
-          t(y)
+          t(f)
         ], 10, A)) : n("", !0),
         e.inGroup ? (l(), m(v, P($({ key: 3 }, e.groupArrowProps)), null, 16)) : n("", !0)
       ], 42, M)) : n("", !0)
     ], 6)
-  ], 8, ["to", "disabled"]);
+  ], 8, ["to", "disabled"])) : n("", !0);
 }
 const j = /* @__PURE__ */ V(b, [["render", B]]);
 export {

package/dist/es/components/image/ImagePreview.vue2.js

@@ -1,33 +1,33 @@
-import { defineComponent as le, toRefs as ie, ref as p, reactive as k, computed as v, watch as re, onBeforeUnmount as se, h as m, nextTick as ue } from "vue";
-import ce from "../../_hooks/use-merge-state.js";
-import { useLocale as me } from "../../locale/index.js";
-import { getClassNameMixin as fe } from "../../_utils/config.js";
-import { throttleByRaf as de } from "../../_utils/throttle-by-raf.js";
-import { KEYBOARD_KEY as f } from "../../_utils/keyboard.js";
-import { isServerRendering as z, on as pe, off as ve } from "../../_utils/dom.js";
-import ge from "./preview-arrow.vue.js";
-import ye from "./preview-toolbar.vue.js";
+import { defineComponent as re, toRefs as se, ref as m, onMounted as ue, reactive as k, computed as p, watch as N, onBeforeUnmount as ce, h as f } from "vue";
+import me from "../../_hooks/use-merge-state.js";
+import { useLocale as fe } from "../../locale/index.js";
+import { getClassNameMixin as de } from "../../_utils/config.js";
+import { throttleByRaf as ve } from "../../_utils/throttle-by-raf.js";
+import { KEYBOARD_KEY as d } from "../../_utils/keyboard.js";
+import { isServerRendering as z, on as pe, off as ge } from "../../_utils/dom.js";
+import ye from "./preview-arrow.vue.js";
+import be from "./preview-toolbar.vue.js";
 import we from "./hooks/use-image-load-status.js";
-import be from "./hooks/use-image-drag.js";
-import ke from "../../icons/animation/animation-loading.js";
-import Se from "../../icons/default/close.js";
-import he from "../../icons/_self/zoom-out.js";
-import Re from "../../icons/_self/zoom-in.js";
-import Ie from "../../icons/_self/full-screen.js";
-import Ce from "../../icons/_self/rotate-left.js";
-import Pe from "../../icons/_self/rotate-right.js";
-import ze from "../../icons/_self/original-size.js";
-import Te from "../../_hooks/use-popup-overflow-hidden.js";
-import Oe from "../../_hooks/use-popup-container.js";
-import Le, { getScaleByRate as Ae, maxScale as Be, minScale as Ee } from "./utils/get-scale.js";
-import xe from "../../_hooks/use-popup-manager.js";
-const T = 90, no = /* @__PURE__ */ le({
+import ke from "./hooks/use-image-drag.js";
+import Se from "../../icons/animation/animation-loading.js";
+import he from "../../icons/default/close.js";
+import Re from "../../icons/_self/zoom-out.js";
+import Ie from "../../icons/_self/zoom-in.js";
+import Ce from "../../icons/_self/full-screen.js";
+import Pe from "../../icons/_self/rotate-left.js";
+import ze from "../../icons/_self/rotate-right.js";
+import Te from "../../icons/_self/original-size.js";
+import Oe from "../../_hooks/use-popup-overflow-hidden.js";
+import Le from "../../_hooks/use-popup-container.js";
+import Ae, { getScaleByRate as Be, maxScale as Ee, minScale as xe } from "./utils/get-scale.js";
+import Ne from "../../_hooks/use-popup-manager.js";
+const T = 90, lo = /* @__PURE__ */ re({
   name: "ImagePreview",
   components: {
-    PreviewArrow: ge,
-    PreviewToolbar: ye,
-    IconLoading: ke,
-    IconClose: Se
+    PreviewArrow: ye,
+    PreviewToolbar: be,
+    IconLoading: Se,
+    IconClose: he
   },
   props: {
     renderToBody: {
@@ -156,150 +156,155 @@ const T = 90, no = /* @__PURE__ */ le({
     emit: O
   }) {
     const {
-      t: s
-    } = me(), {
-      src: x,
-      popupContainer: N,
-      visible: D,
-      defaultVisible: _,
-      maskClosable: V,
-      actionsLayout: K,
+      t: r
+    } = fe(), {
+      src: D,
+      popupContainer: _,
+      visible: V,
+      defaultVisible: K,
+      maskClosable: M,
+      actionsLayout: W,
       defaultScale: L,
-      zoomRate: M
-    } = ie(n), l = p(), S = p(), h = fe("image-preview"), [r, G] = ce(_.value, k({
-      value: D
-    })), U = v(() => [h.block, {
-      [h.modifier("hide")]: !r.value
-    }]), W = z ? void 0 : document.body, u = Oe(W, k({
-      popupContainer: N
-    })), Z = v(() => !z && u.value === document.body), F = v(() => z || !n.renderToBody || !u.value), {
-      zIndex: H
-    } = xe("dialog", {
-      visible: r
-    }), Y = v(() => ({
-      ...Z.value ? {
-        zIndex: H.value,
+      zoomRate: G
+    } = se(n), s = m(), S = m(), A = m(!1);
+    ue(() => {
+      A.value = !0;
+    });
+    const h = de("image-preview"), [i, U] = me(K.value, k({
+      value: V
+    })), Z = p(() => [h.block, {
+      [h.modifier("hide")]: !i.value
+    }]), F = z ? void 0 : document.body, u = Le(F, k({
+      popupContainer: _
+    })), H = p(() => !z && u.value === document.body), Y = p(() => z || !n.renderToBody || !u.value), {
+      zIndex: j
+    } = Ne("dialog", {
+      visible: i
+    }), X = p(() => ({
+      ...H.value ? {
+        zIndex: j.value,
         position: "fixed"
       } : {
         zIndex: "inherit",
         position: "absolute"
       }
     })), {
-      isLoading: j,
-      isLoaded: X,
+      isLoading: q,
+      isLoaded: J,
       setLoadStatus: R
-    } = we(), c = p(0), t = p(L.value), {
+    } = we(), c = m(0), t = m(L.value), {
       translate: g,
-      moving: q,
-      resetTranslate: J
-    } = be(k({
-      wrapperEl: l,
+      moving: Q,
+      resetTranslate: $
+    } = ke(k({
+      wrapperEl: s,
       imageEl: S,
-      visible: r,
+      visible: i,
       scale: t
-    })), y = p(!1);
+    })), y = m(!1);
     let I = null;
-    const Q = () => {
+    const ee = () => {
       !y.value && (y.value = !0), I && clearTimeout(I), I = setTimeout(() => {
         y.value = !1;
       }, 1e3);
     };
-    Te(k({
+    Oe(k({
       container: u,
-      hidden: r
+      hidden: i
     }));
-    function $() {
-      c.value = 0, t.value = L.value, J();
+    function oe() {
+      c.value = 0, t.value = L.value, $();
     }
-    const C = (e) => K.value.includes(e), A = (e) => {
-      const o = e.target, i = o && ["BUTTON", "A", "INPUT", "TEXTAREA", "SELECT"].includes(o.tagName);
+    const C = (e) => W.value.includes(e), B = (e) => {
+      const o = e.target, l = o && ["BUTTON", "A", "INPUT", "TEXTAREA", "SELECT"].includes(o.tagName);
       let a = !1;
       switch (e.key) {
-        case f.ESC:
+        case d.ESC:
           n.escToClose && (P(), a = !0);
           break;
-        case f.ARROW_LEFT:
+        case d.ARROW_LEFT:
           n.groupArrowProps.onPrev && (n.groupArrowProps.onPrev(), a = !0);
           break;
-        case f.ARROW_RIGHT:
+        case d.ARROW_RIGHT:
           n.groupArrowProps.onNext && (n.groupArrowProps.onNext(), a = !0);
           break;
-        case f.ARROW_UP:
-          C("zoomIn") && !i && (b("zoomIn"), a = !0);
+        case d.ARROW_UP:
+          C("zoomIn") && !l && (w("zoomIn"), a = !0);
           break;
-        case f.ARROW_DOWN:
-          C("zoomOut") && !i && (b("zoomOut"), a = !0);
+        case d.ARROW_DOWN:
+          C("zoomOut") && !l && (w("zoomOut"), a = !0);
           break;
-        case f.SPACE:
-          C("originalSize") && !i && (d(1), a = !0);
+        case d.SPACE:
+          C("originalSize") && !l && (v(1), a = !0);
           break;
       }
       a && (e.stopPropagation(), e.preventDefault());
-    }, ee = de((e) => {
+    }, te = ve((e) => {
       if (e.preventDefault(), e.stopPropagation(), !n.wheelZoom) return;
-      const i = (e.deltaY || e.deltaX) > 0 ? "zoomOut" : "zoomIn", a = Ae(t.value, M.value, i);
-      d(a);
+      const l = (e.deltaY || e.deltaX) > 0 ? "zoomOut" : "zoomIn", a = Be(t.value, G.value, l);
+      v(a);
+    });
+    let b = !1;
+    N(s, (e) => e == null ? void 0 : e.focus(), {
+      flush: "post"
     });
-    let w = !1;
-    const oe = () => {
-      ue(() => {
-        var e;
-        (e = l == null ? void 0 : l.value) == null || e.focus();
-      }), n.keyboard && !w && (w = !0, pe(u.value, "keydown", A));
-    }, B = () => {
-      w && (w = !1, ve(u.value, "keydown", A));
+    const ae = () => {
+      n.keyboard && !b && (b = !0, pe(u.value, "keydown", B));
+    }, E = () => {
+      b && (b = !1, ge(u.value, "keydown", B));
     };
-    re([x, r], () => {
-      r.value ? ($(), R("loading"), oe()) : B();
+    N([D, i], () => {
+      i.value ? (oe(), R("loading"), ae()) : E();
     }, {
       immediate: !0
     });
     function P() {
-      r.value && (O("close"), O("update:visible", !1), G(!1));
+      i.value && (O("close"), O("update:visible", !1), U(!1));
     }
-    function te(e) {
+    function ne(e) {
       var o;
-      (o = l == null ? void 0 : l.value) == null || o.focus(), V.value && e.target === e.currentTarget && P();
+      (o = s == null ? void 0 : s.value) == null || o.focus(), M.value && e.target === e.currentTarget && P();
     }
-    function d(e) {
+    function v(e) {
       if (t.value !== e) {
         const o = t.value;
-        g.value = [g.value[0] * o / e, g.value[1] * o / e], t.value = e, Q();
+        g.value = [g.value[0] * o / e, g.value[1] * o / e], t.value = e, ee();
       }
     }
-    function ae() {
-      const e = l.value.getBoundingClientRect(), o = S.value.getBoundingClientRect(), i = e.height / (o.height / t.value), a = e.width / (o.width / t.value), ne = Math.max(i, a);
-      d(ne);
+    function le() {
+      const e = s.value.getBoundingClientRect(), o = S.value.getBoundingClientRect(), l = e.height / (o.height / t.value), a = e.width / (o.width / t.value), ie = Math.max(l, a);
+      v(ie);
     }
-    function E(e) {
-      const i = e === "clockwise" ? (c.value + T) % 360 : c.value === 0 ? 360 - T : c.value - T;
-      c.value = i;
+    function x(e) {
+      const l = e === "clockwise" ? (c.value + T) % 360 : c.value === 0 ? 360 - T : c.value - T;
+      c.value = l;
     }
-    function b(e) {
-      const o = Le(t.value, e);
-      d(o);
+    function w(e) {
+      const o = Ae(t.value, e);
+      v(o);
     }
-    return se(() => {
-      B();
+    return ce(() => {
+      E();
     }), {
-      t: s,
+      t: r,
       className: h,
-      classNames: U,
+      classNames: Z,
       container: u,
-      teleportDisabled: F,
-      wrapperStyles: Y,
+      teleportDisabled: Y,
+      wrapperStyles: X,
       scale: t,
       translate: g,
       rotate: c,
-      moving: q,
-      mergedVisible: r,
-      isLoading: j,
-      isLoaded: X,
+      moving: Q,
+      mergedVisible: i,
+      isLoading: q,
+      isLoaded: J,
       scaleValueVisible: y,
-      refWrapper: l,
+      refWrapper: s,
       refImage: S,
-      onWheel: ee,
-      onMaskClick: te,
+      mounted: A,
+      onWheel: te,
+      onMaskClick: ne,
       onCloseClick: P,
       onImgLoad() {
         R("loaded");
@@ -307,55 +312,55 @@ const T = 90, no = /* @__PURE__ */ le({
       onImgError() {
         R("error");
       },
-      actions: v(() => [
+      actions: p(() => [
         /** 满屏 */
         {
           key: "fullScreen",
-          name: s("imagePreview.fullscreen"),
-          content: () => m(Ie),
-          onClick: () => ae()
+          name: r("imagePreview.fullscreen"),
+          content: () => f(Ce),
+          onClick: () => le()
         },
         /** 顺时针旋转 */
         {
           key: "rotateRight",
-          name: s("imagePreview.rotateRight"),
-          content: () => m(Pe),
-          onClick: () => E("clockwise")
+          name: r("imagePreview.rotateRight"),
+          content: () => f(ze),
+          onClick: () => x("clockwise")
         },
         /** 逆时针旋转 */
         {
           key: "rotateLeft",
-          name: s("imagePreview.rotateLeft"),
-          content: () => m(Ce),
-          onClick: () => E("counterclockwise")
+          name: r("imagePreview.rotateLeft"),
+          content: () => f(Pe),
+          onClick: () => x("counterclockwise")
         },
         /** 放大 */
         {
           key: "zoomIn",
-          name: s("imagePreview.zoomIn"),
-          content: () => m(Re),
-          onClick: () => b("zoomIn"),
-          disabled: t.value === Be
+          name: r("imagePreview.zoomIn"),
+          content: () => f(Ie),
+          onClick: () => w("zoomIn"),
+          disabled: t.value === Ee
         },
         /** 缩小 */
         {
           key: "zoomOut",
-          name: s("imagePreview.zoomOut"),
-          content: () => m(he),
-          onClick: () => b("zoomOut"),
-          disabled: t.value === Ee
+          name: r("imagePreview.zoomOut"),
+          content: () => f(Re),
+          onClick: () => w("zoomOut"),
+          disabled: t.value === xe
         },
         /** 缩放到100% */
         {
           key: "originalSize",
-          name: s("imagePreview.originalSize"),
-          content: () => m(ze),
-          onClick: () => d(1)
+          name: r("imagePreview.originalSize"),
+          content: () => f(Te),
+          onClick: () => v(1)
         }
       ])
     };
   }
 });
 export {
-  no as default
+  lo as default
 };

package/dist/es/components/image/ImagePreviewGroup.vue.js

@@ -8,7 +8,7 @@ function d(o, b, f, g, $, v) {
     p(r, i({ ...o.$attrs, groupArrowProps: o.groupArrowProps }, {
       "in-group": "",
       src: o.currentUrl,
-      visible: o.mergedVisible,
+      visible: o.mergedVisible && !!o.currentUrl,
       "mask-closable": o.maskClosable,
       closable: o.closable,
       "actions-layout": o.actionsLayout,