@unicom-cloud/ui 0.8.90 → 0.8.92

package/modal/Modal.js

@@ -1,22 +1,442 @@
-import "react/jsx-runtime";
-import "@unicom-cloud/icons/IconUiClose";
-import "lodash/isFunction";
-import "react";
-import "../button/index.js";
-import "../chunk/B44Hj5ad.js";
-import "../chunk/oopARUrq.js";
-import "../chunk/BFTV6myl.js";
-import "../chunk/D5wldVRB.js";
-import "../chunk/DU1RCDfh.js";
-import "../portal/index.js";
-import "../chunk/NPajzdOv.js";
-import "@unicom-cloud/utils/class-name";
-import "../utils/dom.js";
-import "@unicom-cloud/utils/constant/keyboardCode";
-import "../chunk/BKKEev13.js";
-import "../chunk/BZ3igxQN.js";
-import { E as k } from "../chunk/BL8tIaO8.js";
-import "./config.js";
+import { jsxs as k, jsx as o, Fragment as Ge } from "react/jsx-runtime";
+import Je from "@unicom-cloud/icons/IconUiClose";
+import be from "lodash/isFunction";
+import Qe, { forwardRef as en, useRef as u, useContext as nn, useState as R, useCallback as I, useEffect as A } from "react";
+import he from "../button/index.js";
+import tn from "../config-provider/ConfigProvider.js";
+import rn from "../components/common/hooks/useIsFirstRender.js";
+import on from "../components/common/hooks/useMergeProps.js";
+import ln from "../components/common/hooks/useMergeValue.js";
+import sn from "../components/common/hooks/useOverflowHidden.js";
+import an from "../icon-hover/index.js";
+import cn from "../portal/index.js";
+import { PqbCSSTransition as xe } from "../components/common/utils/PqbCSSTransition.js";
+import ve from "@unicom-cloud/utils/class-name";
+import { contains as un, isServerRendering as dn } from "../components/common/utils/dom.js";
+import { Esc as mn } from "@unicom-cloud/utils/constant/keyboardCode";
+import { omit as fn } from "../components/common/utils/omit.js";
+import { findDOMNode_ as pn } from "../components/common/utils/reactDOM.js";
+import _ from "./Confirm.js";
+import { setModalConfig as gn, destroyList as Me } from "./config.js";
+import Cn from "./use-modal/index.js";
+import bn from "../config-provider/context.js";
+let K = null, hn = 0;
+dn || document.documentElement.addEventListener(
+  "click",
+  (s) => {
+    K = {
+      left: s.clientX,
+      top: s.clientY
+    }, setTimeout(() => {
+      K = null;
+    }, 100);
+  },
+  !0
+);
+const xn = {
+  mask: !0,
+  maskClosable: !0,
+  mountOnEnter: !0,
+  escToExit: !0,
+  getPopupContainer: () => document.body,
+  alignCenter: !0
+};
+function vn(s, w) {
+  var ge, Ce;
+  w || (w = u());
+  const C = nn(bn), t = on(
+    s,
+    xn,
+    (ge = C.componentConfig) == null ? void 0 : ge.Modal
+  ), {
+    className: we,
+    style: Ee,
+    visible: a,
+    simple: G,
+    title: E,
+    subtitle: X,
+    children: Te,
+    cancelText: ye,
+    okText: Ne,
+    okButtonProps: De,
+    cancelButtonProps: $e,
+    getPopupContainer: Y = () => document.body,
+    footer: T,
+    afterClose: O,
+    confirmLoading: Pe,
+    mountOnEnter: L,
+    unmountOnExit: B,
+    afterOpen: S,
+    hideCancel: ke,
+    maskClosable: Re,
+    mask: y,
+    alignCenter: Ie,
+    getChildrenPopupContainer: J,
+    wrapClassName: Xe,
+    escToExit: H,
+    modalRender: Q,
+    maskStyle: Ye,
+    wrapStyle: Oe,
+    closeIcon: ee,
+    fullscreenable: Mn,
+    okButton: l,
+    ...ne
+  } = t, v = u(null), te = u(null), d = u(null), [re, oe] = R(), [le, Le] = R(), N = u(null), M = u(!1), [Be, se] = R(""), [ie, ae] = R("");
+  rn();
+  const F = u(!0);
+  a && F.current && (F.current = !1);
+  const D = u();
+  D.current || (D.current = hn++);
+  const [Se, V] = ln(!1, {
+    defaultValue: !1,
+    value: Pe
+  }), r = (Ce = C.getPrefixCls) == null ? void 0 : Ce.call(C, "modal", t.prefixCls), { locale: b, rtl: ce } = C, He = !G || ne.noticeType === "show", Fe = "closable" in t ? t.closable : He, Ve = I(() => pn(Y()), [Y]);
+  sn(Ve, { hidden: a && y });
+  function z(e) {
+    e.stopPropagation(), q();
+  }
+  function q() {
+    var e;
+    (e = t.onCancel) == null || e.call(t);
+  }
+  const ze = (e) => {
+    H && a && e.key === mn.key && (e.stopPropagation(), q());
+  }, U = u(!1), qe = (e) => {
+    M.current && (M.current = !1, !U.current && Re && y && e.target === e.currentTarget && setTimeout(() => {
+      q();
+    }, 100));
+  }, Ue = (e) => {
+    var i;
+    const n = (i = t.onOk ?? t.onConfirm) == null ? void 0 : i(e);
+    n != null && n.then && (V(!0), n.then(
+      () => {
+        V(!1);
+      },
+      (c) => {
+        V(!1), console.error(c);
+      }
+    ));
+  };
+  A(() => {
+    let e = null;
+    return H && (e = setTimeout(() => {
+      var n;
+      un(document.body, v.current) && ((n = v.current) == null || n.focus());
+    })), () => {
+      e && clearTimeout(e);
+    };
+  }, [a, H]);
+  const We = () => {
+    var e;
+    if (a && le === void 0 && v.current) {
+      const n = +((e = window.getComputedStyle(v.current, null)) == null ? void 0 : e.zIndex);
+      isNaN(n) || Le(n + 1);
+    }
+  }, Ze = () => {
+    var c, m, f, h, P, p, g;
+    if (T === null)
+      return;
+    const e = ((c = t.cancelButton) == null ? void 0 : c.visible) !== !1 && /* @__PURE__ */ o(
+      he,
+      {
+        onClick: z,
+        ...$e,
+        ...(m = t.cancelButton) == null ? void 0 : m.props,
+        children: ((h = (f = t.cancelButton) == null ? void 0 : f.props) == null ? void 0 : h.children) || ((P = t.cancelButton) == null ? void 0 : P.label) || ((p = t.cancelButton) == null ? void 0 : p.text) || ye || (b == null ? void 0 : b.Modal.cancelText)
+      }
+    ), n = (l == null ? void 0 : l.visible) !== !1 && /* @__PURE__ */ o(
+      he,
+      {
+        loading: Se,
+        onClick: Ue,
+        type: "primary",
+        ...De,
+        ...l == null ? void 0 : l.props,
+        children: ((g = l == null ? void 0 : l.props) == null ? void 0 : g.children) || (l == null ? void 0 : l.label) || (l == null ? void 0 : l.text) || Ne || (b == null ? void 0 : b.Modal.okText)
+      }
+    ), i = be(T) ? T(e, n) : T || /* @__PURE__ */ k(Ge, { children: [
+      !ke && e,
+      n
+    ] });
+    return /* @__PURE__ */ o("div", { className: `${r}-footer`, children: i });
+  }, W = u(
+    me()
+  ), je = I((e) => {
+    var i, c, m, f, h;
+    if (!d.current) return;
+    e.preventDefault();
+    const n = W.current;
+    n.screenX = e.screenX, n.screenY = e.screenY, n.prewTranslateX = n.translateX, n.prewTranslateY = n.translateY, n.boundingClientRect = ((c = (i = d.current) == null ? void 0 : i.getBoundingClientRect) == null ? void 0 : c.call(i)) ?? {}, n.offsetParentBoundingClientRect = ((h = (f = (m = d.current) == null ? void 0 : m.offsetParent) == null ? void 0 : f.getBoundingClientRect) == null ? void 0 : h.call(f)) ?? {}, $(), Ae();
+  }, []), ue = I((e) => {
+    e.preventDefault();
+    const n = W.current, { left: i, right: c, top: m, bottom: f } = n.boundingClientRect ?? {}, { width: h, height: P } = n.offsetParentBoundingClientRect ?? {};
+    let p = Math.max(e.screenX - n.screenX, -i);
+    p = Math.min(p, h - c);
+    let g = Math.max(e.screenY - n.screenY, -m);
+    g = Math.min(g, P - f), p += n.prewTranslateX, g += n.prewTranslateY, n.translateX = p, n.translateY = g, se(`translate(${p}px, ${g}px)`);
+  }, []), de = I((e) => {
+    e.preventDefault(), $();
+  }, []);
+  function Ae() {
+    document.documentElement.addEventListener(
+      "mousemove",
+      ue
+    ), document.documentElement.addEventListener(
+      "mouseup",
+      de
+    );
+  }
+  function $() {
+    document.documentElement.removeEventListener(
+      "mousemove",
+      ue
+    ), document.documentElement.removeEventListener(
+      "mouseup",
+      de
+    );
+  }
+  function me() {
+    return {
+      screenX: 0,
+      screenY: 0,
+      prewTranslateX: 0,
+      prewTranslateY: 0,
+      translateX: 0,
+      translateY: 0,
+      boundingClientRect: null,
+      offsetParentBoundingClientRect: null
+    };
+  }
+  function Z() {
+    W.current = me(), se(""), ae("");
+  }
+  A(() => () => {
+    Z(), $();
+  }, []), A(() => (d.current || (Z(), $()), () => {
+  }), [d.current]);
+  const Ke = /* @__PURE__ */ k(
+    tn,
+    {
+      ...C,
+      childrenName: "Modal",
+      prefixCls: t.prefixCls || C.prefixCls,
+      locale: b,
+      zIndex: le || 1050,
+      getPopupContainer: (e) => typeof J == "function" ? J(e) : te.current,
+      children: [
+        (!!E || !!X) && /* @__PURE__ */ k("div", { className: `${r}-header`, children: [
+          !!E && /* @__PURE__ */ o(
+            "div",
+            {
+              className: `${r}-title`,
+              id: `pqb-dialog-${D.current}`,
+              children: E
+            }
+          ),
+          !!X && /* @__PURE__ */ o("div", { className: `${r}-subtitle`, children: X })
+        ] }),
+        /* @__PURE__ */ o("div", { ref: te, className: `${r}-content`, children: Te }),
+        Ze(),
+        !t.fullscreenable && t.draggable !== !1 && /* @__PURE__ */ o(
+          "div",
+          {
+            className: `${r}-drag-icon`,
+            onMouseDown: je,
+            onDoubleClick: Z
+          }
+        ),
+        (Fe || !!t.fullscreenable) && (ee !== void 0 ? /* @__PURE__ */ o(
+          "span",
+          {
+            className: `${r}-close-icon`,
+            onClick: z,
+            children: ee
+          }
+        ) : /* @__PURE__ */ o(
+          an,
+          {
+            tabIndex: -1,
+            className: `${r}-close-icon`,
+            onClick: z,
+            role: "button",
+            "aria-label": "Close",
+            children: /* @__PURE__ */ o(Je, {})
+          }
+        ))
+      ]
+    }
+  ), _e = E ? { "aria-labelledby": `pqb-dialog-${D.current}` } : {}, fe = /* @__PURE__ */ o(
+    "div",
+    {
+      role: "dialog",
+      "aria-modal": "true",
+      ..._e,
+      className: ve(
+        r,
+        {
+          [`${r}-simple`]: G,
+          [`${r}-rtl`]: ce,
+          [`${r}-fullscreenable`]: t.fullscreenable
+        },
+        we
+      ),
+      style: {
+        ...Ee,
+        transform: Be,
+        transformOrigin: ie
+      },
+      ref: d,
+      children: Ke
+    }
+  ), j = (e) => {
+    if (ie)
+      return;
+    let n = "";
+    if (N.current) {
+      const i = e.getBoundingClientRect(), { left: c, top: m } = N.current;
+      n = `${c - i.left}px ${m - i.top}px`;
+    }
+    ae(n);
+  }, pe = F.current ? !L : !!d.current;
+  return a || pe ? /* @__PURE__ */ o(
+    cn,
+    {
+      visible: a,
+      forceRender: pe,
+      getContainer: Y,
+      children: /* @__PURE__ */ k(
+        "div",
+        {
+          ref: w,
+          className: `${r}-container`,
+          children: [
+            y ? /* @__PURE__ */ o(
+              xe,
+              {
+                in: a,
+                timeout: 400,
+                appear: !0,
+                mountOnEnter: L,
+                classNames: "fadeModal",
+                unmountOnExit: B,
+                onEnter: (e) => {
+                  e && (e.style.display = "block");
+                },
+                onExited: (e) => {
+                  e && (e.style.display = "none");
+                },
+                children: /* @__PURE__ */ o(
+                  "div",
+                  {
+                    "aria-hidden": !0,
+                    className: `${r}-mask`,
+                    style: Ye
+                  }
+                )
+              }
+            ) : null,
+            /* @__PURE__ */ o(
+              "div",
+              {
+                ...fn(ne, [
+                  "content",
+                  "icon",
+                  "showIcon",
+                  "isNotice",
+                  "noticeType",
+                  "onCancel",
+                  "onOk",
+                  "onConfirm",
+                  "closable",
+                  "prefixCls"
+                ]),
+                tabIndex: -1,
+                ref: (e) => {
+                  v.current = e, We();
+                },
+                className: ve(
+                  `${r}-wrapper`,
+                  {
+                    [`${r}-wrapper-no-mask`]: !y,
+                    [`${r}-wrapper-align-center`]: Ie,
+                    [`${r}-wrapper-rtl`]: ce
+                  },
+                  Xe
+                ),
+                style: {
+                  ...Oe || {},
+                  // 必须 visible=false，立即设置display:none，否则modal加载react-monaco-editor的时候，编辑器显示异常
+                  display: a || re ? "block" : "none",
+                  overflow: !a && re ? "hidden" : ""
+                },
+                onKeyDown: ze,
+                onMouseDown: (e) => {
+                  M.current = e.target === e.currentTarget;
+                },
+                onClick: qe,
+                children: /* @__PURE__ */ o(
+                  xe,
+                  {
+                    in: a,
+                    timeout: 400,
+                    appear: !0,
+                    classNames: "zoomModal",
+                    unmountOnExit: B,
+                    mountOnEnter: L,
+                    onEnter: (e) => {
+                      e && (oe(!0), N.current = K, j(e), d.current = e);
+                    },
+                    onEntered: (e) => {
+                      e && (j(e), N.current = null, S == null || S());
+                    },
+                    onExit: () => {
+                      U.current = !0;
+                    },
+                    onExited: (e) => {
+                      e && (oe(!1), j(e), O == null || O(), U.current = !1, B && (d.current = null));
+                    },
+                    children: Qe.cloneElement(
+                      be(Q) ? Q(fe) : fe,
+                      {
+                        onMouseDown: () => {
+                          M.current = !1;
+                        },
+                        onMouseUp: () => {
+                          M.current = !1;
+                        }
+                      }
+                    )
+                  }
+                )
+              }
+            )
+          ]
+        }
+      )
+    }
+  ) : null;
+}
+const x = en(
+  vn
+);
+x.displayName = "Modal";
+x.config = gn;
+x.show = (s) => _({ ...s, noticeType: "show" });
+x.confirm = (s) => _(s);
+x.useModal = Cn;
+["info", "success", "warning", "error"].forEach((s) => {
+  x[s] = (w) => _({
+    ...w,
+    isNotice: !0,
+    noticeType: s
+  });
+});
+x.destroyAll = () => {
+  for (; Me.length; ) {
+    const s = Me.pop();
+    s && s();
+  }
+};
 export {
-  k as default
+  x as default
 };

package/modal/index.js

@@ -1,4 +1,4 @@
-import { E as t } from "../chunk/BL8tIaO8.js";
+import t from "./Modal.js";
 export {
   t as default
 };

package/modal/use-modal/Hook.js

@@ -0,0 +1,52 @@
+import { jsx as d } from "react/jsx-runtime";
+import { forwardRef as p, useState as a, useImperativeHandle as k } from "react";
+import x from "../Modal.js";
+function C(l, i) {
+  const [f, t] = a(!0), [o, n] = a(l);
+  k(i, () => ({
+    update: (e) => {
+      n(e);
+    },
+    close: () => {
+      t(!1);
+    }
+  }));
+  function u() {
+    var s;
+    const e = (s = o.onOk) == null ? void 0 : s.call(o);
+    e && e.then && (n((r) => ({
+      ...r,
+      confirmLoading: !0
+    })), e.then(
+      () => {
+        t(!1);
+      },
+      (r) => {
+        console.error(r), n((m) => ({
+          ...m,
+          confirmLoading: !1
+        }));
+      }
+    )), e || t(!1);
+  }
+  function c() {
+    var e;
+    (e = o.onCancel) == null || e.call(o), t(!1);
+  }
+  return /* @__PURE__ */ d(
+    x,
+    {
+      unmountOnExit: !0,
+      simple: !0,
+      ...o,
+      visible: f,
+      onOk: u,
+      onCancel: c,
+      children: o.content
+    }
+  );
+}
+const O = p(C);
+export {
+  O as default
+};

package/modal/use-modal/index.js

@@ -0,0 +1,68 @@
+import { jsx as m } from "react/jsx-runtime";
+import { useRef as M } from "react";
+import { normalizeConfig as d } from "../Confirm.js";
+import { destroyList as w } from "../config.js";
+import { ContextHolderElement as E } from "../../utils/contextHolder.js";
+import H from "./Hook.js";
+function z() {
+  const t = M(), p = /* @__PURE__ */ m(E, { ref: t });
+  let u = 0;
+  function s(e) {
+    var f;
+    u += 1;
+    let o, n = { ...e };
+    function C() {
+      var r;
+      (r = e.afterClose) == null || r.call(e), h();
+    }
+    const a = /* @__PURE__ */ m(
+      H,
+      {
+        ref: (r) => {
+          o = r;
+        },
+        ...d({ ...e }),
+        afterClose: C
+      },
+      u
+    );
+    (f = t.current) == null || f.addInstance(a);
+    function h() {
+      var r;
+      (r = t.current) == null || r.removeInstance(a);
+    }
+    function l() {
+      o == null || o.close();
+    }
+    function x(r) {
+      n = {
+        ...n,
+        ...r
+      }, o == null || o.update(d({ ...n }));
+    }
+    return w.push(l), {
+      close: l,
+      update: x
+    };
+  }
+  function c(e) {
+    return s({
+      ...e
+    });
+  }
+  const i = {
+    confirm: c,
+    show: c
+    // 潘启宝添加于 2023年10月18日 星期三 10时31分58秒 CST
+  };
+  return ["info", "success", "warning", "error"].forEach((e) => {
+    i[e] = (o) => s({
+      ...o,
+      isNotice: !0,
+      noticeType: e
+    });
+  }), [i, p];
+}
+export {
+  z as default
+};