@unicom-cloud/ui 0.8.140 → 0.8.142

package/modal/Modal.js

@@ -1,42 +1,42 @@
-/* 2026-01-12 17:27:20 */
-import { jsxs as y, jsx as n, Fragment as le } from "react/jsx-runtime";
-import Xe from "@unicom-cloud/icons/IconUiClose";
-import se from "@unicom-cloud/ui-common/transition-group/CSSTransition";
-import { getBodyContainer as z, contains as Ye } from "@unicom-cloud/ui-common/utils/dom";
-import { forwardRef as Ge, useContext as Je, useRef as i, useState as H, useEffect as Qe, useImperativeHandle as er } from "react";
-import ie from "../button/Button.js";
-import rr from "../config-provider/ConfigProvider.js";
-import tr from "@unicom-cloud/ui-common/hooks/use-is-first-render";
-import nr from "@unicom-cloud/ui-common/hooks/use-merge-props";
-import or from "@unicom-cloud/ui-common/hooks/use-merge-value";
-import lr from "@unicom-cloud/ui-common/hooks/use-move";
-import sr from "@unicom-cloud/ui-common/hooks/use-overflow-hidden";
-import ir from "../hooks/useUnmountOnExit.js";
-import ar from "../icon-hover/index.js";
-import cr from "../portal/Portal.js";
-import M from "@unicom-cloud/ui-common/utils/className";
-import ur from "@unicom-cloud/ui-common/utils/findRootElement";
-import { isFunction as P, isNaN as fr, isPromise as dr, isServerRendering as mr } from "@unicom-cloud/ui-common/utils/is";
-import { Esc as pr } from "@unicom-cloud/utils/constant/keyboardCode";
-import gr from "@unicom-cloud/ui-common/utils/omit";
-import _ from "./Confirm.js";
-import { setModalConfig as Cr, destroyList as ae } from "./config.js";
-import xr from "./use-modal/index.js";
-import hr from "../config-provider/context.js";
-let L = null, br = 0;
-mr || document.documentElement.addEventListener(
-  "click",
-  (l) => {
+/* 2026-01-19 15:54:51 */
+import { jsxs as N, jsx as t, Fragment as te } from "react/jsx-runtime";
+import _e from "@unicom-cloud/icons/IconUiClose";
+import je from "@unicom-cloud/ui-common/transition-group/CSSTransition";
+import { getBodyContainer as z, contains as De } from "@unicom-cloud/ui-common/utils/dom";
+import { forwardRef as Ue, useContext as Ae, useState as H, useRef as c, useEffect as Ke, useImperativeHandle as Xe } from "react";
+import ne from "../button/Button.js";
+import Ye from "../config-provider/ConfigProvider.js";
+import qe from "@unicom-cloud/ui-common/hooks/use-id";
+import Ge from "@unicom-cloud/ui-common/hooks/use-is-first-render";
+import Je from "@unicom-cloud/ui-common/hooks/use-merge-props";
+import Qe from "@unicom-cloud/ui-common/hooks/use-merge-value";
+import er from "@unicom-cloud/ui-common/hooks/use-move";
+import rr from "@unicom-cloud/ui-common/hooks/use-overflow-hidden";
+import or from "../hooks/useUnmountOnExit.js";
+import tr from "../icon-hover/index.js";
+import nr from "../mask/Mask.js";
+import ir from "../portal/Portal.js";
+import P from "@unicom-cloud/ui-common/utils/className";
+import lr from "@unicom-cloud/ui-common/utils/findRootElement";
+import { isFunction as w, isNaN as sr, isPromise as ar, isServerRendering as cr } from "@unicom-cloud/ui-common/utils/is";
+import { Esc as fr } from "@unicom-cloud/utils/constant/keyboardCode";
+import mr from "@unicom-cloud/ui-common/utils/omit";
+import W from "./Confirm.js";
+import { setModalConfig as ur, destroyList as ie } from "./config.js";
+import dr from "./use-modal/index.js";
+import pr from "../config-provider/context.js";
+let L = null;
+cr || document.documentElement.addEventListener(
+  "mousedown",
+  (n) => {
     L = {
-      left: l.clientX,
-      top: l.clientY
-    }, setTimeout(() => {
-      L = null;
-    }, 100);
+      left: n.clientX,
+      top: n.clientY
+    };
   },
   !0
 );
-const kr = {
+const gr = {
   mask: !0,
   maskClosable: !0,
   mountOnEnter: !0,
@@ -45,274 +45,242 @@ const kr = {
   alignCenter: !0,
   draggable: !0
 };
-function vr(l, w) {
-  const u = Je(hr), a = nr(l, kr, u.componentConfig?.Modal), {
-    className: ce,
-    style: ue,
-    visible: s,
-    simple: U,
-    title: h,
-    subtitle: T,
-    children: fe,
-    cancelText: de,
-    okText: me,
-    okButtonProps: pe,
-    cancelButtonProps: ge,
-    getPopupContainer: W = z,
-    header: f,
+function Cr(n, y) {
+  const m = Ae(pr), a = Je(n, gr, m.componentConfig?.Modal), {
+    className: le,
+    style: se,
+    visible: i,
+    simple: Z,
+    title: b,
+    subtitle: M,
+    children: ae,
+    cancelText: ce,
+    okText: fe,
+    okButtonProps: me,
+    cancelButtonProps: ue,
+    getPopupContainer: _ = z,
+    header: u,
     // 潘启宝添加
     footer: d,
-    afterClose: Ce,
-    confirmLoading: xe,
-    mountOnEnter: b,
-    unmountOnExit: I,
-    afterOpen: he,
-    hideCancel: be,
-    maskClosable: ke,
-    mask: ve,
-    alignCenter: $e,
-    getChildrenPopupContainer: Z,
-    wrapClassName: Ee,
-    escToExit: O,
-    modalRender: j,
-    maskStyle: Ne,
-    wrapStyle: ye,
-    closeIcon: q,
-    fullscreenable: m,
-    cancelButton: p,
-    okButton: g,
-    draggable: Me,
-    closable: Pe,
-    ...we
-  } = a, k = m ? !1 : ve, A = m ? !1 : Me, C = i(null), K = i(null), v = i(null), X = i(null), Y = i(null), [G, J] = H(), [Q, Te] = H(), $ = i(null), x = i(!1), ee = i(null), [Ie, Oe] = H(void 0);
-  tr();
-  const R = i(!0);
-  s && R.current && (R.current = !1);
-  const E = i(void 0);
-  E.current || (E.current = br++);
-  const [Re, B] = or(!1, {
+    afterClose: de,
+    confirmLoading: pe,
+    mountOnEnter: k,
+    unmountOnExit: T,
+    afterOpen: ge,
+    hideCancel: Ce,
+    maskClosable: he,
+    mask: xe,
+    alignCenter: be,
+    getChildrenPopupContainer: j,
+    wrapClassName: ke,
+    escToExit: I,
+    modalRender: D,
+    maskStyle: ve,
+    wrapStyle: $e,
+    closeIcon: U,
+    fullscreenable: g,
+    cancelButton: C,
+    okButton: h,
+    draggable: Ee,
+    closable: Ne,
+    ...Pe
+  } = a, v = g ? !1 : xe, A = g ? !1 : Ee, [K, X] = H(), [Y, we] = H(), [ye, Me] = H(void 0), x = c(null), q = c(null), p = c(null), G = c(null), J = c(null), O = c(!1), Te = qe(), R = c(!0);
+  i && R.current && (R.current = !1), Ge();
+  const [Ie, B] = Qe(!1, {
     defaultValue: !1,
-    value: xe
-  }), t = u.getPrefixCls?.("modal"), Be = u.getPrefixCls?.("modal-var"), { locale: S, rtl: re } = u, Se = lr(
+    value: pe
+  }), e = m.getPrefixCls?.("modal"), Oe = m.getPrefixCls?.("modal-var"), { locale: S, rtl: Q } = m, Re = er(
     {
-      trigger: Y,
-      target: v,
+      trigger: G,
+      target: p,
       draggable: A
     },
     !0
-  ), De = !U, Ve = m ? !0 : "closable" in a ? Pe : De;
-  sr(
-    () => ur(W()),
-    { hidden: s && k }
+  ), Be = !Z, Se = g ? !0 : "closable" in a ? Ne : Be;
+  rr(
+    () => lr(_()),
+    { hidden: i && v }
   );
-  function D(r) {
-    r.stopPropagation(), V();
+  function V(r) {
+    r.stopPropagation(), F();
   }
-  function V() {
+  function F() {
     a.onCancel?.();
   }
-  const Fe = (r) => {
-    O && s && r.key === pr.key && (r.stopPropagation(), V());
-  }, N = (r) => {
-    let o = "";
-    if ($.current) {
-      const e = r.getBoundingClientRect(), { left: Ae, top: Ke } = $.current;
-      o = `${Ae - e.left}px ${Ke - e.top}px`;
+  function Ve(r) {
+    I && i && r.key === fr.key && (r.stopPropagation(), F());
+  }
+  function $(r) {
+    let l = "";
+    if (L) {
+      const s = r.getBoundingClientRect(), { left: o, top: E } = L;
+      l = `${o - s.left}px ${E - s.top}px`;
     }
-    Oe(o);
-  }, te = R.current ? !b : !!v.current, F = i(!1), He = (r) => {
-    x.current && (x.current = !1, !F.current && ke && k && r.target === r.currentTarget && setTimeout(() => {
-      V();
-    }, 100));
-  }, ze = (r) => {
-    const o = (a.onOk ?? a.onConfirm)?.(r);
-    dr(o) && (B(!0), o.then(
+    Me(l);
+  }
+  const ee = R.current ? !k : !!p.current;
+  function Fe(r) {
+    const l = (a.onOk ?? a.onConfirm)?.(r);
+    ar(l) && (B(!0), l.then(
       () => {
         B(!1);
       },
-      (e) => {
-        B(!1), console.error(e);
+      (s) => {
+        B(!1), console.error(s);
       }
     ));
-  };
-  Qe(() => {
+  }
+  Ke(() => {
     let r = null;
-    return O && (r = setTimeout(() => {
-      Ye(z(), C.current) && C.current?.focus();
+    return I && (r = setTimeout(() => {
+      De(z(), x.current) && x.current?.focus();
     })), () => {
       r && clearTimeout(r);
     };
-  }, [s, O]), er(w, () => ({
+  }, [i, I]), Xe(y, () => ({
+    getModalElement() {
+      return p.current;
+    },
     getRootElement() {
-      return ee.current;
+      return J.current;
     }
   }));
-  const Le = () => {
-    if (s && Q === void 0 && C.current) {
-      const r = +window.getComputedStyle(C.current, null)?.zIndex;
-      fr(r) || Te(r + 1);
+  function He() {
+    if (i && Y === void 0 && x.current) {
+      const r = +window.getComputedStyle(x.current, null)?.zIndex;
+      sr(r) || we(r + 1);
     }
-  }, _e = () => {
-    if (f === !1 || f === null || "header" in a && f === void 0 || !(h || T)) return;
-    const r = !!h && /* @__PURE__ */ n(
-      "div",
-      {
-        id: `pqb-dialog-${E.current}`,
-        className: `${t}-title`,
-        children: h
-      }
-    ), o = !!T && /* @__PURE__ */ n("div", { className: `${t}-subtitle`, children: T }), e = P(f) ? f(r, o) : f || /* @__PURE__ */ y(le, { children: [
+  }
+  function ze() {
+    if (u === !1 || u === null || "header" in a && u === void 0 || !(b || M)) return;
+    const r = !!b && /* @__PURE__ */ t("div", { className: `${e}-title`, children: b }), l = !!M && /* @__PURE__ */ t("div", { className: `${e}-subtitle`, children: M }), s = w(u) ? u(r, l) : u || /* @__PURE__ */ N(te, { children: [
       r,
-      o
+      l
     ] });
-    return /* @__PURE__ */ n("div", { className: `${t}-header`, children: e });
-  }, Ue = () => {
+    return /* @__PURE__ */ t("div", { className: `${e}-header`, children: s });
+  }
+  function Le() {
     if (d === !1 || d === null || "footer" in a && d === void 0)
       return;
-    const r = p?.visible !== !1 && /* @__PURE__ */ n(
-      ie,
+    const r = C?.visible !== !1 && /* @__PURE__ */ t(
+      ne,
       {
-        onClick: D,
-        ...ge,
-        ...p?.props,
-        children: p?.props?.children || p?.label || p?.text || de || S?.Modal?.cancelText
+        onClick: V,
+        ...ue,
+        ...C?.props,
+        children: C?.props?.children || C?.label || C?.text || ce || S?.Modal?.cancelText
       }
-    ), o = g?.visible !== !1 && /* @__PURE__ */ n(
-      ie,
+    ), l = h?.visible !== !1 && /* @__PURE__ */ t(
+      ne,
       {
-        loading: Re,
-        onClick: ze,
+        loading: Ie,
+        onClick: Fe,
         type: "primary",
-        ...pe,
-        ...g?.props,
-        children: g?.props?.children || g?.label || g?.text || me || S?.Modal?.okText
+        ...me,
+        ...h?.props,
+        children: h?.props?.children || h?.label || h?.text || fe || S?.Modal?.okText
       }
-    ), e = P(d) ? d(r, o) : d || /* @__PURE__ */ y(le, { children: [
-      !be && r,
-      o
+    ), s = w(d) ? d(r, l) : d || /* @__PURE__ */ N(te, { children: [
+      !Ce && r,
+      l
     ] });
-    if (e)
-      return /* @__PURE__ */ n("div", { className: `${t}-footer`, children: e });
-  }, We = /* @__PURE__ */ y(
-    rr,
-    {
-      ...u,
-      childrenName: "Modal",
-      prefixCls: u.prefixCls,
-      locale: S,
-      zIndex: Q || 1050,
-      getPopupContainer: (r) => P(Z) ? Z(r) : K.current,
-      children: [
-        _e(),
-        /* @__PURE__ */ n("div", { ref: K, className: `${t}-content`, children: fe }),
-        Ue(),
-        A && /* @__PURE__ */ n("div", { ref: Y, className: `${t}-drag-icon` }),
-        Ve && (q !== void 0 ? /* @__PURE__ */ n(
-          "span",
-          {
-            className: `${t}-close-icon`,
-            onClick: D,
-            children: q
-          }
-        ) : /* @__PURE__ */ n(
-          ar,
-          {
-            tabIndex: -1,
-            className: `${t}-close-icon`,
-            onClick: D,
-            role: "button",
-            "aria-label": "Close",
-            children: /* @__PURE__ */ n(Xe, {})
-          }
-        ))
-      ]
-    }
-  ), Ze = h ? { "aria-labelledby": `pqb-dialog-${E.current}` } : {}, je = /* @__PURE__ */ n(
-    "div",
-    {
-      role: "dialog",
-      "aria-modal": "true",
-      ...Ze,
-      style: {
-        [`--${Be}-transform`]: Se?.translate,
-        ...ue,
-        ...m ? { width: "100%", height: "100%" } : {},
-        transformOrigin: Ie
-      },
-      className: M(
-        t,
-        {
-          [`${t}-simple`]: U,
-          [`${t}-rtl`]: re,
-          [`${t}-fullscreenable`]: m
-        },
-        ce
-      ),
-      ref: v,
-      onMouseDown: () => {
-        x.current = !1;
-      },
-      onMouseUp: () => {
-        x.current = !1;
-      },
-      children: We
-    }
-  );
-  let ne;
-  if (s || te) {
-    let r;
-    k && (r = /* @__PURE__ */ n(
-      se,
+    if (s)
+      return /* @__PURE__ */ t("div", { className: `${e}-footer`, children: s });
+  }
+  let re;
+  if (i || ee) {
+    const r = /* @__PURE__ */ N(
+      Ye,
       {
-        in: s,
-        timeout: 400,
-        appear: !0,
-        mountOnEnter: b,
-        classNames: `${t}-fade`,
-        unmountOnExit: I,
-        onEnter: (e) => {
-          e && (e.style.display = "block");
-        },
-        onExited: (e) => {
-          e && (e.style.display = "none");
+        ...m,
+        childrenName: "Modal",
+        prefixCls: m.prefixCls,
+        locale: S,
+        zIndex: Y || 1050,
+        getPopupContainer: (o) => w(j) ? j(o) : q.current,
+        children: [
+          ze(),
+          /* @__PURE__ */ t("div", { ref: q, className: `${e}-content`, children: ae }),
+          Le(),
+          A && /* @__PURE__ */ t("div", { ref: G, className: `${e}-drag-icon` }),
+          Se && (U !== void 0 ? /* @__PURE__ */ t(
+            "span",
+            {
+              className: `${e}-close-icon`,
+              onClick: V,
+              children: U
+            }
+          ) : /* @__PURE__ */ t(
+            tr,
+            {
+              tabIndex: -1,
+              className: `${e}-close-icon`,
+              onClick: V,
+              role: "button",
+              "aria-label": "Close",
+              children: /* @__PURE__ */ t(_e, {})
+            }
+          ))
+        ]
+      }
+    ), l = b ? { "aria-labelledby": `${e}-${Te}` } : {}, s = /* @__PURE__ */ t(
+      "div",
+      {
+        role: "dialog",
+        "aria-modal": "true",
+        ...l,
+        style: {
+          [`--${Oe}-transform`]: Re?.translate,
+          ...se,
+          ...g ? { width: "100%", height: "100%" } : {},
+          transformOrigin: ye
         },
-        refElement: X,
-        children: /* @__PURE__ */ n(
-          "div",
+        className: P(
+          e,
           {
-            ref: X,
-            "aria-hidden": !0,
-            style: Ne,
-            className: M(
-              `${t}-mask`,
-              s ? `${t}-mask-visible` : `${t}-mask-hidden`
-            )
-          }
-        )
+            [`${e}-simple`]: Z,
+            [`${e}-rtl`]: Q,
+            [`${e}-fullscreenable`]: g
+          },
+          le
+        ),
+        ref: p,
+        children: r
       }
-    ));
-    let o = je;
-    P(j) && (o = j(o) ?? o), ne = /* @__PURE__ */ n(
-      cr,
+    );
+    re = /* @__PURE__ */ t(
+      ir,
       {
-        visible: s,
-        forceRender: te,
-        getContainer: W,
-        children: /* @__PURE__ */ y(
+        visible: i,
+        forceRender: ee,
+        getContainer: _,
+        children: /* @__PURE__ */ N(
           "div",
           {
-            ref: ee,
-            className: M(
-              `${t}-container`,
+            ref: J,
+            className: P(
+              `${e}-container`,
               // 潘启宝添加
-              s ? `${t}-container-visible` : `${t}-container-hidden`
+              i ? `${e}-container-visible` : `${e}-container-hidden`
             ),
             children: [
-              r,
-              /* @__PURE__ */ n(
+              !!v && /* @__PURE__ */ t(
+                nr,
+                {
+                  style: ve,
+                  className: P(
+                    `${e}-mask`,
+                    i ? `${e}-mask-visible` : `${e}-mask-hidden`
+                  ),
+                  visible: i,
+                  mountOnEnter: k,
+                  unmountOnExit: T
+                }
+              ),
+              /* @__PURE__ */ t(
                 "div",
                 {
-                  ...gr(we, [
+                  ...mr(Pe, [
                     "content",
                     "icon",
                     "showIcon",
@@ -325,52 +293,52 @@ function vr(l, w) {
                     "prefixCls"
                   ]),
                   tabIndex: -1,
-                  ref: (e) => {
-                    C.current = e, Le();
+                  ref: (o) => {
+                    x.current = o, He();
                   },
                   style: {
-                    ...ye || {},
+                    ...$e || {},
                     // 必须 visible=false，立即设置display:none，否则modal加载react-monaco-editor的时候，编辑器显示异常
-                    display: s || G ? "block" : "none",
-                    overflow: !s && G ? "hidden" : ""
+                    display: i || K ? "block" : "none",
+                    overflow: !i && K ? "hidden" : ""
                   },
-                  className: M(
-                    `${t}-wrapper`,
-                    k ? `${t}-wrapper-mask` : `${t}-wrapper-no-mask`,
+                  className: P(
+                    `${e}-wrapper`,
+                    v ? `${e}-wrapper-mask` : `${e}-wrapper-no-mask`,
                     {
-                      [`${t}-wrapper-align-center`]: $e,
-                      [`${t}-wrapper-rtl`]: re
+                      [`${e}-wrapper-align-center`]: be,
+                      [`${e}-wrapper-rtl`]: Q
                     },
-                    Ee
+                    ke
                   ),
-                  onKeyDown: Fe,
-                  onMouseDown: (e) => {
-                    x.current = e.target === e.currentTarget;
+                  onKeyDown: Ve,
+                  onClick: (o) => {
+                    const E = o.target, Ze = o.currentTarget;
+                    !O.current && he && v && E === Ze && !p.current?.contains(E) && F();
                   },
-                  onClick: He,
-                  children: /* @__PURE__ */ n(
-                    se,
+                  children: /* @__PURE__ */ t(
+                    je,
                     {
-                      in: s,
+                      in: i,
                       timeout: 400,
                       appear: !0,
-                      classNames: `${t}-zoom`,
-                      unmountOnExit: I,
-                      mountOnEnter: b,
-                      onEnter: (e) => {
-                        e && (oe(!1), J(!0), $.current = L, N(e));
+                      classNames: `${e}-zoom`,
+                      unmountOnExit: T,
+                      mountOnEnter: k,
+                      onEnter: (o) => {
+                        o && (oe(!1), X(!0), $(o));
                       },
-                      onEntered: (e) => {
-                        e && (N(e), $.current = null, he?.());
+                      onEntered: (o) => {
+                        o && ($(o), ge?.());
                       },
-                      onExit: (e) => {
-                        e && (N(e), F.current = !0);
+                      onExit: (o) => {
+                        o && ($(o), O.current = !0);
                       },
-                      onExited: (e) => {
-                        e && (oe(!0), J(!1), N(e), Ce?.(), F.current = !1);
+                      onExited: (o) => {
+                        o && (oe(!0), X(!1), $(o), de?.(), O.current = !1);
                       },
-                      refElement: v,
-                      children: o
+                      refElement: p,
+                      children: w(D) ? D(s) ?? s : s
                     }
                   )
                 }
@@ -381,36 +349,36 @@ function vr(l, w) {
       }
     );
   }
-  const { element: qe, setExited: oe } = ir({
-    element: ne,
-    visible: s,
-    mountOnEnter: b,
-    unmountOnExit: I
+  const { element: We, setExited: oe } = or({
+    element: re,
+    visible: i,
+    mountOnEnter: k,
+    unmountOnExit: T
   });
-  return qe;
+  return We;
 }
-const c = Ge(
-  vr
+const f = Ue(
+  Cr
 );
-c.displayName = "Modal";
-c.config = Cr;
-c.show = (l) => _({ ...l, noticeType: "show" });
-c.confirm = (l) => _(l);
-c.useModal = xr;
-["info", "success", "warning", "error"].forEach((l) => {
-  c[l] = (w) => _({
-    ...w,
+f.displayName = "Modal";
+f.config = ur;
+f.show = (n) => W({ ...n, noticeType: "show" });
+f.confirm = (n) => W(n);
+f.useModal = dr;
+["info", "success", "warning", "error"].forEach((n) => {
+  f[n] = (y) => W({
+    ...y,
     isNotice: !0,
-    noticeType: l
+    noticeType: n
   });
 });
-c.destroyAll = () => {
-  for (; ae.length; ) {
-    const l = ae.pop();
-    l && l();
+f.destroyAll = () => {
+  for (; ie.length; ) {
+    const n = ie.pop();
+    n && n();
   }
 };
 export {
-  c as default,
-  xr as useModal
+  f as default,
+  dr as useModal
 };