@unicom-cloud/ui 0.8.115 → 0.8.116

package/image/ImagePreview.js

@@ -1,51 +1,495 @@
-import "react/jsx-runtime";
-import "@unicom-cloud/icons/IconUiClose";
-import "@unicom-cloud/icons/IconUiCopy";
-import "@unicom-cloud/icons/IconUiFullscreen";
-import "@unicom-cloud/icons/IconUiLeft";
-import "@unicom-cloud/icons/IconUiLoading";
-import "@unicom-cloud/icons/IconUiOriginalSize";
-import "@unicom-cloud/icons/IconUiRight";
-import "@unicom-cloud/icons/IconUiRotateLeft";
-import "@unicom-cloud/icons/IconUiRotateRight";
-import "@unicom-cloud/icons/IconUiZoomIn";
-import "@unicom-cloud/icons/IconUiZoomOut";
-import "lodash/isUndefined";
-import "react";
-import "../chunk/DstheLSK.js";
-import "../chunk/DsaQZE4X.js";
+/* 2025-10-30 15:47:58 */
+import { jsx as o, jsxs as P } from "react/jsx-runtime";
+import le from "@unicom-cloud/icons/IconUiClose";
+import pt from "@unicom-cloud/icons/IconUiCopy";
+import dt from "@unicom-cloud/icons/IconUiFullscreen";
+import gt from "@unicom-cloud/icons/IconUiLeft";
+import vt from "@unicom-cloud/icons/IconUiLoading";
+import yt from "@unicom-cloud/icons/IconUiOriginalSize";
+import kt from "@unicom-cloud/icons/IconUiRight";
+import wt from "@unicom-cloud/icons/IconUiRotateLeft";
+import Ct from "@unicom-cloud/icons/IconUiRotateRight";
+import ht from "@unicom-cloud/icons/IconUiZoomIn";
+import bt from "@unicom-cloud/icons/IconUiZoomOut";
+import { PqbCSSTransition as ue } from "../dist/ui-common/transition-group/PqbCSSTransition.js";
+import { forwardRef as xt, useContext as fe, useState as l, useRef as d, useMemo as pe, useImperativeHandle as It, useCallback as St, useEffect as u } from "react";
+import Rt from "../config-provider/ConfigProvider.js";
+import "../dist/ui-common/utils/is.js";
+import { isUndefined as Pt } from "@unicom-cloud/utils/is";
 import "@unicom-cloud/utils/constant/platform";
-import "../chunk/CdXR6dj7.js";
+import "../dist/ui-common/hooks/utils/isDev.js";
 import "@unicom-cloud/utils/js-cookie";
 import "dayjs";
 import "lodash/debounce";
-import "../chunk/DfChiMIE.js";
+import Nt from "../dist/ui-common/hooks/use-update-effect/index.js";
 import "@unicom-cloud/utils/screenfull";
-import "../chunk/ClNkxEcR.js";
+import "../dist/ui-common/hooks/use-request/src/plugins/useAutoRunPlugin.js";
+import "../dist/ui-common/hooks/use-request/src/utils/subscribeReVisible.js";
+import "../dist/ui-common/hooks/use-request/src/utils/subscribeFocus.js";
 import "lodash/throttle";
-import "lodash/isPlainObject";
+import "../dist/ui-common/hooks/use-text-selection/index.js";
 import "@unicom-cloud/utils/query-string";
 import "react-router";
-import "lodash/isEqualWith";
-import "../chunk/2vdCeheu.js";
-import "@unicom-cloud/utils/constant/keyboardCode";
-import "lodash/isNumber";
-import "lodash/merge";
-import "../chunk/BcdTSJks.js";
-import "../chunk/CEAeR6xB.js";
-import "../chunk/FgWHhRFz.js";
-import "../chunk/BqWBaRtM.js";
-import "../chunk/exc7v_Hl.js";
+import "../dist/ui-common/hooks/use-intersection-observer/index.js";
+import { ArrowDown as zt, ArrowUp as Lt, ArrowLeft as Tt, ArrowRight as $t, Esc as Mt } from "@unicom-cloud/utils/constant/keyboardCode";
+import Et from "../dist/ui-common/hooks/use-merge-props/index.js";
+import Ot from "../dist/ui-common/hooks/use-merge-value/index.js";
+import Ut from "../dist/ui-common/hooks/use-overflow-hidden/index.js";
+import { findDOMNode as Dt } from "../dist/ui-common/utils/reactDOM.js";
 import "@unicom-cloud/utils/constant";
-import "../portal/index.js";
-import "../chunk/DQ8_XXrH.js";
-import "@unicom-cloud/utils/class-name";
-import "@unicom-cloud/utils/clipboard-copy";
-import "../chunk/CHQ8c547.js";
-import "./ImagePreviewArrow.js";
-import "./ImagePreviewToolbar.js";
-import "./previewGroupContext.js";
-import { P as X } from "../chunk/Cs9GrNJa.js";
+import "lodash/merge";
+import { isServerRendering as At, on as B, off as F } from "../dist/ui-common/utils/dom.js";
+import Yt from "../portal/index.js";
+import de from "@unicom-cloud/utils/class-name";
+import Vt from "@unicom-cloud/utils/clipboard-copy";
+import Xt from "../dist/ui-common/utils/resizeObserver.js";
+import Wt from "./ImagePreviewArrow.js";
+import Bt from "./ImagePreviewToolbar.js";
+import { PreviewGroupContext as Ft } from "./previewGroupContext.js";
+import Zt from "./utils/getFixTranslate.js";
+import jt, { defaultScales as Gt } from "./utils/getScale.js";
+import Ht from "./utils/hook/useImageStatus.js";
+import qt from "../config-provider/context.js";
+const Z = 90, Kt = {
+  maskClosable: !0,
+  closable: !0,
+  breakPoint: 316,
+  actionsLayout: [
+    // 'fullScreen', // 潘启宝注释于2023年9月16日
+    "zoomOut",
+    "zoomIn",
+    "maximize",
+    "originalSize",
+    "rotateLeft",
+    "rotateRight",
+    "prev",
+    "next",
+    "copy",
+    "extra",
+    // 潘启宝更改
+    "close"
+  ],
+  getPopupContainer: () => document.body,
+  escToExit: !0,
+  scales: Gt,
+  resetTranslate: !0
+};
+function _t(ge, ve) {
+  const {
+    previewGroup: v,
+    previewUrlMap: w,
+    currentIndex: a,
+    setCurrentIndex: ye,
+    infinite: C,
+    previewPropsMap: ke
+  } = fe(Ft), we = v ? ke.get(a) : {}, N = Et(
+    ge,
+    Kt,
+    we
+  ), {
+    className: Ce,
+    style: he,
+    src: be,
+    defaultVisible: xe,
+    maskClosable: Ie,
+    closable: Se,
+    breakPoint: Re,
+    actions: Pe,
+    actionsLayout: Ne,
+    getPopupContainer: j,
+    onVisibleChange: ze,
+    scales: z,
+    escToExit: G,
+    imgAttributes: Le = {},
+    imageRender: Te,
+    extra: $e = null,
+    resetTranslate: H
+  } = N, h = v ? w.get(a) : be, [L, Me] = l(h), [r, Ee] = Ot(!1, {
+    defaultValue: xe,
+    value: N.visible
+  }), q = fe(qt), { getPrefixCls: Oe, locale: y, rtl: Ue } = q, K = Oe?.("image"), i = `${K}-preview`, De = de(
+    i,
+    {
+      [`${i}-hide`]: !r,
+      [`${i}-rtl`]: Ue
+    },
+    Ce
+  ), b = d(void 0), Ae = d(void 0), f = d(void 0), _ = d(void 0), T = d(!1), k = d({
+    pageX: 0,
+    pageY: 0,
+    originX: 0,
+    originY: 0
+  }), { isLoading: Ye, isLoaded: Ve, setStatus: $ } = Ht("loading"), [Xe, We] = l(!1), [s, M] = l({ x: 0, y: 0 }), [n, E] = l(1), [J, Q] = l(!1), [x, O] = l(0), [c, ee] = l(!1), p = pe(() => new jt(z), []), {
+    onLoad: Be,
+    onError: Fe,
+    onMouseDown: Ze,
+    style: je,
+    className: Ge,
+    ...He
+  } = Le, te = !C && a <= 0, oe = !C && a >= w.size - 1;
+  function U() {
+    M({ x: 0, y: 0 }), E(1), O(0);
+  }
+  It(ve, () => ({
+    reset: U,
+    getRootDOMNode: () => _.current
+  }));
+  const [I, qe] = l(), ne = St(() => I, [I]);
+  u(() => {
+    const e = j?.(), t = Dt(e) || document.body;
+    qe(t);
+  }, [j]), Ut(ne, { hidden: r });
+  const Ke = pe(
+    () => !At && I === document.body,
+    [I]
+  );
+  function re(e) {
+    const t = w.size;
+    C && (e %= t, e < 0 && (e = t - Math.abs(e))), e !== a && e >= 0 && e <= t - 1 && ye(e);
+  }
+  function D() {
+    re(a - 1);
+  }
+  function A() {
+    re(a + 1);
+  }
+  function _e() {
+    O(x === 0 ? 360 - Z : x - Z);
+  }
+  function Je() {
+    O((x + Z) % 360);
+  }
+  const Y = d(null), Qe = () => {
+    !J && Q(!0), Y.current && clearTimeout(Y.current), Y.current = setTimeout(() => {
+      Q(!1);
+    }, 1e3);
+  }, S = (e) => {
+    n !== e && (E(e), Qe());
+  };
+  function V() {
+    const e = p.getNextScale(n, "zoomIn");
+    S(e);
+  }
+  function X() {
+    const e = p.getNextScale(n, "zoomOut");
+    S(e);
+  }
+  function et(e) {
+    e.deltaY > 0 ? n >= p.minScale && X() : n <= p.maxScale && V();
+  }
+  function tt() {
+    S(1);
+  }
+  function ot() {
+    const e = f.current.getBoundingClientRect(), t = b.current.getBoundingClientRect(), m = e.height / (t.height / n), g = e.width / (t.width / n), W = Math.max(m, g);
+    S(W);
+  }
+  function ie(e) {
+    e.target === e.currentTarget && Ie && R();
+  }
+  function nt() {
+    Vt(L);
+  }
+  function ae() {
+    R();
+  }
+  function rt(e) {
+    R();
+  }
+  function R() {
+    r && (ze?.(!1, r), Pt(N.visible) && Ee(!1));
+  }
+  function it(e) {
+    if (e && e.length) {
+      const m = e[0].contentRect.width < Re;
+      We(m);
+    }
+  }
+  const se = () => {
+    if (!f.current || !b.current)
+      return;
+    const e = f.current.getBoundingClientRect(), t = b.current.getBoundingClientRect(), [m, g] = Zt(
+      e,
+      t,
+      s.x,
+      s.y,
+      n
+    );
+    (m !== s.x || g !== s.y) && M({
+      x: m,
+      y: g
+    });
+  }, ce = (e) => {
+    if (r && c) {
+      e.preventDefault?.();
+      const { originX: t, originY: m, pageX: g, pageY: W } = k.current, ut = t + (e.pageX - g) / n, ft = m + (e.pageY - W) / n;
+      M({
+        x: ut,
+        y: ft
+      });
+    }
+  }, me = (e) => {
+    e.preventDefault?.(), ee(!1);
+  };
+  function at(e) {
+    $("loaded"), Be?.(e);
+  }
+  function st(e) {
+    $("error"), Fe?.(e);
+  }
+  const ct = (e) => {
+    e.preventDefault?.(), ee(!0);
+    const t = e.type === "touchstart" ? e.touches[0] : e;
+    k.current.pageX = t.pageX, k.current.pageY = t.pageY, k.current.originX = s.x, k.current.originY = s.y, Ze?.(e);
+  };
+  u(() => (r && c && (B(document, "mousemove", ce, !1), B(document, "mouseup", me, !1)), () => {
+    F(document, "mousemove", ce, !1), F(document, "mouseup", me, !1);
+  }), [r, c]), u(() => {
+    H && !c && se();
+  }, [c, s]), u(() => {
+    H && se();
+  }, [n]), u(() => {
+    r && U();
+  }, [r]), u(() => {
+    Me(h), $(h ? "loading" : "loaded"), U();
+  }, [h]), Nt(() => {
+    p.updateScale(z), E(1);
+  }, [z]), u(() => {
+    const e = (t) => {
+      if (t)
+        switch (t.key) {
+          case Mt.key:
+            G && R();
+            break;
+          case $t.key:
+            A();
+            break;
+          case Tt.key:
+            D();
+            break;
+          case Lt.key:
+            V();
+            break;
+          case zt.key:
+            X();
+            break;
+        }
+    };
+    return r && !c && !T.current && (T.current = !0, B(document, "keydown", e)), () => {
+      T.current = !1, F(document, "keydown", e);
+    };
+  }, [r, G, c, a, n]);
+  const mt = [
+    !1,
+    {
+      key: "rotateRight",
+      name: y?.ImagePreview.rotateRight,
+      content: /* @__PURE__ */ o(Ct, {}),
+      onClick: Je
+    },
+    {
+      key: "rotateLeft",
+      name: y?.ImagePreview.rotateLeft,
+      content: /* @__PURE__ */ o(wt, {}),
+      onClick: _e
+    },
+    {
+      key: "zoomIn",
+      name: y?.ImagePreview.zoomIn,
+      content: /* @__PURE__ */ o(ht, {}),
+      onClick: V,
+      disabled: n === p.maxScale
+    },
+    {
+      key: "zoomOut",
+      name: y?.ImagePreview.zoomOut,
+      content: /* @__PURE__ */ o(bt, {}),
+      onClick: X,
+      disabled: n === p.minScale
+    },
+    {
+      key: "originalSize",
+      name: y?.ImagePreview.originalSize,
+      content: /* @__PURE__ */ o(yt, {}),
+      onClick: tt
+    },
+    {
+      key: "maximize",
+      name: "最大化",
+      content: /* @__PURE__ */ o(dt, {}),
+      onClick: ot
+    },
+    !!v && {
+      key: "next",
+      name: "下一张",
+      content: /* @__PURE__ */ o(kt, {}),
+      disabled: oe,
+      onClick: A
+    },
+    !!v && {
+      key: "prev",
+      name: "上一张",
+      content: /* @__PURE__ */ o(gt, {}),
+      disabled: te,
+      onClick: D
+    },
+    {
+      key: "copy",
+      name: "复制",
+      content: /* @__PURE__ */ o(pt, {}),
+      onClick: nt
+    },
+    {
+      key: "close",
+      name: "关闭",
+      content: /* @__PURE__ */ o(le, {}),
+      onClick: ae
+    }
+  ].filter(Boolean);
+  u(() => {
+    const e = Xt([f.current], it);
+    return () => {
+      e();
+    };
+  }, [f.current]);
+  const lt = () => {
+    const e = /* @__PURE__ */ o(
+      "img",
+      {
+        onWheel: et,
+        ref: b,
+        className: de(Ge, `${i}-img`, {
+          [`${i}-img-moving`]: c
+        }),
+        style: {
+          ...je,
+          transform: `translate(${s.x}px, ${s.y}px) rotate(${x}deg)`
+        },
+        src: L,
+        ...He,
+        onLoad: at,
+        onError: st,
+        onMouseDown: (t) => {
+          t.button === 0 && ct(t);
+        }
+      },
+      L
+    );
+    return Te?.(e) ?? e;
+  };
+  return /* @__PURE__ */ o(Yt, { visible: r, forceRender: !1, getContainer: ne, children: /* @__PURE__ */ o(
+    Rt,
+    {
+      ...q,
+      childrenName: "ImagePreview",
+      getPopupContainer: () => f.current,
+      children: /* @__PURE__ */ P(
+        "div",
+        {
+          className: De,
+          style: {
+            ...he || {},
+            ...Ke ? {} : { zIndex: "inherit", position: "absolute" }
+          },
+          ref: _,
+          children: [
+            /* @__PURE__ */ o(
+              ue,
+              {
+                in: r,
+                timeout: 400,
+                appear: !0,
+                classNames: `${i}-fade`,
+                mountOnEnter: !0,
+                unmountOnExit: !1,
+                onEnter: (e) => {
+                  e && (e.parentNode.style.display = "block", e.style.display = "block");
+                },
+                onExited: (e) => {
+                  e && (e.parentNode.style.display = "", e.style.display = "none");
+                },
+                children: /* @__PURE__ */ o("div", { className: `${i}-mask`, onClick: rt })
+              }
+            ),
+            r && /* @__PURE__ */ P(
+              "div",
+              {
+                ref: f,
+                className: `${i}-wrapper`,
+                onClick: ie,
+                children: [
+                  /* @__PURE__ */ P(
+                    "div",
+                    {
+                      ref: Ae,
+                      className: `${i}-img-container`,
+                      style: { transform: `scale(${n}, ${n})` },
+                      onClick: ie,
+                      children: [
+                        lt(),
+                        Ye && /* @__PURE__ */ o("div", { className: `${i}-loading`, children: /* @__PURE__ */ o(vt, {}) })
+                      ]
+                    }
+                  ),
+                  /* @__PURE__ */ o(
+                    ue,
+                    {
+                      in: J,
+                      timeout: 400,
+                      appear: !0,
+                      classNames: `${i}-fade`,
+                      unmountOnExit: !0,
+                      children: /* @__PURE__ */ P("div", { className: `${i}-scale-value`, children: [
+                        (n * 100).toFixed(0),
+                        "%"
+                      ] })
+                    }
+                  ),
+                  Ve && /* @__PURE__ */ o(
+                    Bt,
+                    {
+                      prefixCls: K,
+                      previewPrefixCls: i,
+                      actions: Pe,
+                      actionsLayout: Ne,
+                      defaultActions: mt,
+                      simple: Xe
+                    }
+                  ),
+                  Se && /* @__PURE__ */ o(
+                    "div",
+                    {
+                      className: `${i}-close-btn`,
+                      onClick: ae,
+                      children: /* @__PURE__ */ o(le, {})
+                    }
+                  ),
+                  v && /* @__PURE__ */ o(
+                    Wt,
+                    {
+                      previewCount: w.size,
+                      current: a,
+                      infinite: C,
+                      disableLeft: te,
+                      disableRight: oe,
+                      onPrev: D,
+                      onNext: A
+                    }
+                  ),
+                  $e
+                ]
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) });
+}
+const Jt = xt(
+  _t
+);
+Jt.displayName = "ImagePreview";
 export {
-  X as default
+  Jt as default
 };

package/image/ImagePreviewArrow.js

@@ -1,20 +1,22 @@
-import { jsxs as f, jsx as r } from "react/jsx-runtime";
+/* 2025-10-30 15:47:58 */
+import { jsxs as c, jsx as r } from "react/jsx-runtime";
 import d from "@unicom-cloud/icons/IconUiLeft";
 import p from "@unicom-cloud/icons/IconUiRight";
 import { useContext as v } from "react";
-import { a as w } from "../chunk/DstheLSK.js";
+import "../config-provider/ConfigProvider.js";
 import o from "@unicom-cloud/utils/class-name";
-function P(s) {
+import w from "../config-provider/context.js";
+function j(s) {
   const {
     current: u,
     previewCount: x,
     infinite: C = !1,
     disableLeft: t,
-    disableRight: a,
-    onPrev: n,
+    disableRight: n,
+    onPrev: a,
     onNext: l
-  } = s, { getPrefixCls: m } = v(w), e = m?.("image-preview"), c = o(`${e}-arrow`);
-  return /* @__PURE__ */ f("div", { className: c, children: [
+  } = s, { getPrefixCls: m } = v(w), e = m?.("image-preview"), f = o(`${e}-arrow`);
+  return /* @__PURE__ */ c("div", { className: f, children: [
     /* @__PURE__ */ r(
       "div",
       {
@@ -22,7 +24,7 @@ function P(s) {
           [`${e}-arrow-disabled`]: t
         }),
         onClick: (i) => {
-          i.preventDefault(), !t && n?.();
+          i.preventDefault(), !t && a?.();
         },
         children: /* @__PURE__ */ r(d, {})
       }
@@ -31,10 +33,10 @@ function P(s) {
       "div",
       {
         className: o(`${e}-arrow-right`, {
-          [`${e}-arrow-disabled`]: a
+          [`${e}-arrow-disabled`]: n
         }),
         onClick: (i) => {
-          i.preventDefault(), !a && l?.();
+          i.preventDefault(), !n && l?.();
         },
         children: /* @__PURE__ */ r(p, {})
       }
@@ -42,5 +44,5 @@ function P(s) {
   ] });
 }
 export {
-  P as default
+  j as default
 };