@unicom-cloud/ui 0.8.156 → 0.8.158

package/modal/Modal.js

@@ -1,301 +1,306 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
-import { isFunction as e, isHTMLElement as t, isNaN as n, isPromise as r, isServerRendering as i } from "../utils/is.js";
-import { Esc as ee } from "../utils/keyboardCode.js";
-import te from "../hooks/use-merge-value/index.js";
-import a from "../utils/className.js";
-import ne from "../hooks/use-merge-props/index.js";
-import { contains as re } from "../utils/dom.js";
-import ie from "../config-provider/context.js";
-import ae from "../utils/omit.js";
-import oe from "../icon-hover/index.js";
-import { destroyList as o, setModalConfig as s } from "./config.js";
-import se from "../config-provider/index.js";
-import ce from "../utils/findRootElement.js";
-import le from "../hooks/use-is-first-render/index.js";
-import ue from "../button/index.js";
-import de from "../hooks/use-id/index.js";
-import fe from "../hooks/use-move/index.js";
-import pe from "../hooks/use-overflow-hidden/index.js";
-import me from "../hooks/useUnmountOnExit.js";
-import he from "../mask/index.js";
-import ge from "../portal/index.js";
-import c from "./Confirm.js";
-import l from "./use-modal/index.js";
-import { forwardRef as u, useContext as _e, useEffect as ve, useImperativeHandle as ye, useRef as d, useState as f } from "react";
-import { getBodyContainer as p } from "@unicom-cloud/ui-common/utils/dom";
-import { Fragment as m, jsx as h, jsxs as g } from "react/jsx-runtime";
-import be from "@unicom-cloud/ui-common/transition/TransitionCSS";
-import xe from "@unicom-cloud/icons/IconUiClose";
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
+import { isFunction as e, isHTMLElement as t, isNaN as n, isNull as r, isPromise as i, isServerRendering as ee, isUndefined as a } from "../utils/is.js";
+import { Esc as te } from "../utils/keyboardCode.js";
+import ne from "../hooks/use-controllable-value/index.js";
+import o from "../utils/className.js";
+import re from "../hooks/use-merge-props/index.js";
+import { contains as ie, getBodyContainer as s } from "../utils/dom.js";
+import ae from "../config-provider/context.js";
+import oe from "../utils/omit.js";
+import se from "../icon-hover/index.js";
+import { TransitionCSS as ce } from "../transition/index.js";
+import { destroyList as c, setModalConfig as l } from "./config.js";
+import le from "../config-provider/index.js";
+import ue from "../utils/findRootElement.js";
+import de from "../hooks/use-is-first-render/index.js";
+import u from "../button/index.js";
+import fe from "../hooks/use-id/index.js";
+import pe from "../hooks/use-move/index.js";
+import me from "../hooks/use-overflow-hidden/index.js";
+import he from "../hooks/useUnmountOnExit.js";
+import { MASK_TRANSITION_DURATION as d } from "../mask/constant.js";
+import ge from "../mask/index.js";
+import _e from "../portal/index.js";
+import f from "./Confirm.js";
+import p from "./use-modal/index.js";
+import { forwardRef as m, useContext as ve, useEffect as ye, useImperativeHandle as be, useRef as h, useState as g } from "react";
+import { Fragment as xe, jsx as _, jsxs as v } from "react/jsx-runtime";
+import Se from "@unicom-cloud/icons/IconUiClose";
 //#region components/pc/modal/Modal.tsx
-var _ = null;
-i || document.documentElement.addEventListener("mousedown", (e) => {
-	_ = {
+var y = null;
+ee || document.documentElement.addEventListener("mousedown", (e) => {
+	y = {
 		left: e.clientX,
 		top: e.clientY
 	};
 }, !0);
-var Se = {
+var b = "Modal", Ce = {
 	mask: !0,
 	maskClosable: !0,
 	mountOnEnter: !0,
 	escToExit: !0,
-	getPopupContainer: p,
+	getPopupContainer: s,
 	alignCenter: !0,
 	draggable: !0
 };
-function v(i, o) {
-	let s = _e(ie), { prefixCls: c, getPrefixCls: l, componentConfig: u, locale: v, rtl: y } = s, b = ne(i, Se, u?.Modal), { className: Ce, style: we, visible: x, simple: Te, title: S, subtitle: C, children: Ee, cancelText: De, okText: Oe, okButtonProps: ke, cancelButtonProps: w, getPopupContainer: T = p, header: E, footer: D, afterClose: O, confirmLoading: Ae, mountOnEnter: k, unmountOnExit: A, afterOpen: j, hideCancel: je, maskClosable: Me, mask: Ne, alignCenter: Pe, getChildrenPopupContainer: Fe, wrapClassName: Ie, escToExit: M, modalRender: Le, maskStyle: Re, wrapStyle: ze, closeIcon: N, fullscreenable: P, cancelButton: F, okButton: I, draggable: Be, closable: Ve = !Te, ...He } = b, L = P ? !1 : Ne, R = P ? !1 : Be, [z, B] = f(), [V, Ue] = f(), [We, Ge] = f(void 0), H = d(null), U = d(null), W = d(null), G = d(null), Ke = d(null), K = d(!1), qe = de(), q = d(!0);
-	x && q.current && (q.current = !1), le();
-	let [Je, J] = te(!1, {
+function x(ee, c) {
+	let l = ve(ae), { prefixCls: f, getPrefixCls: p, componentConfig: m, locale: x, rtl: S, childrenName: we } = l, C = re(ee, Ce, m?.Modal), { className: Te, style: Ee, visible: w, simple: T, title: E, subtitle: D, children: De, cancelText: Oe, okText: ke, okButtonProps: O, cancelButtonProps: k, getPopupContainer: A = s, header: j, footer: M, afterClose: N, confirmLoading: Ae, mountOnEnter: P, unmountOnExit: F, afterOpen: I, hideCancel: je, maskClosable: Me, mask: Ne, alignCenter: Pe, getChildrenPopupContainer: Fe, wrapClassName: Ie, escToExit: L, modalRender: Le, maskStyle: Re, wrapStyle: ze, closeIcon: Be, fullscreenable: R, cancelButton: z, okButton: B, draggable: Ve, closable: He = !T, zIndex: Ue, prefixCls: We, onCancel: Ge, onOk: Ke, ...qe } = C, Je = Ue;
+	we === b && (P || (Je ??= l.zIndex));
+	let V = R ? !1 : Ne, Ye = R ? !1 : Ve, [Xe, Ze] = g(), [Qe, $e] = g(), [et, tt] = g(void 0), H = h(null), U = h(null), nt = h(null), W = h(null), rt = h(null), G = h(!1), it = fe();
+	de();
+	let K = h(!0);
+	w && (K.current &&= !1);
+	let [at, q] = ne({
 		defaultValue: !1,
 		value: Ae
-	}), Y = l?.("modal"), Ye = l?.("modal-var"), Xe = fe({
-		trigger: G,
+	}, {
+		defaultValue: !1,
+		triggerPropName: !1
+	}), J = p?.("modal"), ot = p?.("modal-var"), st = pe({
+		trigger: rt,
 		target: W,
-		draggable: R
-	}, !0), Ze = Ve;
-	pe(() => ce(T()), { hidden: x && L });
-	function X(e) {
-		e.stopPropagation(), Z();
+		draggable: Ye
+	}, !0), ct = He;
+	me(() => ue(A()), { hidden: w && V });
+	function Y(e) {
+		e.stopPropagation(), X();
 	}
-	function Z() {
-		b.onCancel?.();
+	function X() {
+		let t = Ge;
+		e(t) && t();
 	}
-	function Qe(e) {
-		M && x && e.key === ee.key && (e.stopPropagation(), Z());
+	function lt(e) {
+		L && w && e.key === te.key && (e.stopPropagation(), X());
 	}
-	function Q(e) {
+	function Z(e) {
 		if (t(e)) {
 			let t = "";
-			if (_) {
-				let n = e.getBoundingClientRect(), { left: r, top: i } = _;
+			if (y) {
+				let n = e.getBoundingClientRect(), { left: r, top: i } = y;
 				t = `${r - n.left}px ${i - n.top}px`;
 			}
-			Ge(t);
+			tt(t);
 		}
 	}
-	let $e = q.current ? !k : !!W.current;
-	function et(t) {
-		let n, i = b.onOk;
-		e(i) && (n = i(t)), r(n) && (J(!0), n.then(() => {
-			J(!1);
+	let ut = K.current ? !P : !!W.current;
+	function dt(t) {
+		let n, r = Ke;
+		e(r) && (n = r(t)), i(n) && (q(!0), n.then(() => {
+			q(!1);
 		}, (e) => {
-			J(!1), console.error(e);
+			q(!1), console.error(e);
 		}));
 	}
-	ve(() => {
+	ye(() => {
 		let e = null;
-		return M && (e = setTimeout(() => {
-			re(p(), H.current) && H.current?.focus?.();
+		return L && (e = setTimeout(() => {
+			ie(s(), U.current) && U.current?.focus?.();
 		})), () => {
 			e && clearTimeout(e);
 		};
-	}, [x, M]), ye(o, () => ({
+	}, [w, L]), be(c, () => ({
 		getModalElement() {
 			return W.current;
 		},
 		getRootElement() {
-			return Ke.current;
+			return H.current;
 		}
 	}));
-	function tt() {
-		if (x && V === void 0 && H.current) {
+	function ft() {
+		if (w && a(Qe) && H.current) {
 			let e = +window.getComputedStyle(H.current, null)?.zIndex;
-			n(e) || Ue(e + 1);
+			n(e) || $e(e + 1);
 		}
 	}
-	function nt() {
-		if (E === !1 || E === null || "header" in b && E === void 0 || !(S || C)) return;
-		let t = !!S && /* @__PURE__ */ h("div", {
-			className: `${Y}-title`,
-			children: S
-		}), n = !!C && /* @__PURE__ */ h("div", {
-			className: `${Y}-subtitle`,
-			children: C
-		}), r = e(E) ? E(t, n) : E || /* @__PURE__ */ g(m, { children: [t, n] });
-		return /* @__PURE__ */ h("div", {
-			className: `${Y}-header`,
-			children: r
+	function pt() {
+		if (j === !1 || r(j) || "header" in C && a(j) || !(E || D)) return;
+		let t = !!E && /* @__PURE__ */ _("div", {
+			className: `${J}-title`,
+			children: E
+		}), n = !!D && /* @__PURE__ */ _("div", {
+			className: `${J}-subtitle`,
+			children: D
+		}), i = e(j) ? j(t, n) : j || /* @__PURE__ */ v(xe, { children: [t, n] });
+		return /* @__PURE__ */ _("div", {
+			className: `${J}-header`,
+			children: i
 		});
 	}
-	function rt() {
-		if (D === !1 || D === null || "footer" in b && D === void 0) return;
-		let t = F !== !1 && F?.visible !== !1 && /* @__PURE__ */ h(ue, {
-			...w,
-			...F?.props,
+	function mt() {
+		if (M === !1 || r(M) || "footer" in C && a(M)) return;
+		let t = z !== !1 && z?.visible !== !1 && /* @__PURE__ */ _(u, {
+			...k,
+			...z?.props,
 			onClick: (e) => {
-				w?.onClick?.(e), F?.props?.onClick?.(e), X(e);
+				k?.onClick?.(e), z?.props?.onClick?.(e), Y(e);
 			},
-			children: F?.props?.children || F?.text || De || v?.Modal?.cancelText
-		}), n = I !== !1 && I?.visible !== !1 && /* @__PURE__ */ h(ue, {
-			loading: Je,
+			children: z?.props?.children || z?.text || Oe || x?.Modal?.cancelText
+		}), n = B !== !1 && B?.visible !== !1 && /* @__PURE__ */ _(u, {
+			loading: at,
 			type: "primary",
-			...ke,
-			...I?.props,
+			...O,
+			...B?.props,
 			onClick: (e) => {
-				ke?.onClick?.(e), I?.props?.onClick?.(e), et(e);
+				O?.onClick?.(e), B?.props?.onClick?.(e), dt(e);
 			},
-			children: I?.props?.children || I?.text || Oe || v?.Modal?.okText
-		}), r = e(D) ? D(t, n) : D || /* @__PURE__ */ g(m, { children: [!je && t, n] });
-		if (r) return /* @__PURE__ */ h("div", {
-			className: `${Y}-footer`,
-			children: r
+			children: B?.props?.children || B?.text || ke || x?.Modal?.okText
+		}), i = e(M) ? M(t, n) : M || /* @__PURE__ */ v(xe, { children: [!je && t, n] });
+		if (i) return /* @__PURE__ */ _("div", {
+			className: `${J}-footer`,
+			children: i
 		});
 	}
-	let $;
-	(x || $e) && ($ = /* @__PURE__ */ g(se, {
-		...s,
-		effectGlobalModal: !1,
-		effectGlobalNotice: !1,
-		childrenName: "Modal",
-		prefixCls: b.prefixCls || c,
-		locale: v,
-		zIndex: V || 1050,
-		getPopupContainer: (t) => e(Fe) ? Fe(t) : U.current,
-		children: [
-			nt(),
-			/* @__PURE__ */ h("div", {
-				ref: U,
-				className: `${Y}-content`,
-				children: Ee
-			}),
-			rt(),
-			R && /* @__PURE__ */ h("div", {
-				ref: G,
-				className: `${Y}-drag-icon`
-			}),
-			Ze && (N === void 0 ? /* @__PURE__ */ h(oe, {
-				prefix: Y,
-				tabIndex: -1,
-				className: `${Y}-close-icon`,
-				onClick: X,
-				role: "button",
-				"aria-label": "Close",
-				children: /* @__PURE__ */ h(xe, {})
-			}) : /* @__PURE__ */ h("span", {
-				className: `${Y}-close-icon`,
-				onClick: X,
-				children: N
-			}))
-		]
-	}), $ = /* @__PURE__ */ h("div", {
+	let Q;
+	(w || ut) && (Q = /* @__PURE__ */ v("div", {
 		role: "dialog",
 		"aria-modal": "true",
-		...S ? { "aria-labelledby": `${Y}-${qe}` } : {},
+		...E ? { "aria-labelledby": `${J}-${it}` } : {},
 		style: {
-			[`--${Ye}-transform`]: Xe?.translate,
-			...we,
-			...P ? {
+			[`--${ot}-transform`]: st?.translate,
+			...Ee,
+			...R ? {
 				width: "100%",
 				height: "100%"
 			} : {},
-			transformOrigin: We
+			transformOrigin: et
 		},
-		className: a(u?.Modal?.className, Y, {
-			[`${Y}-simple`]: Te,
-			[`${Y}-rtl`]: y,
-			[`${Y}-fullscreenable`]: P
-		}, Ce),
+		className: o(m?.Modal?.className, J, {
+			[`${J}-simple`]: T,
+			[`${J}-rtl`]: S,
+			[`${J}-fullscreenable`]: R
+		}, Te),
 		ref: W,
-		children: $
-	}), $ = e(Le) ? Le($) ?? $ : $, $ = /* @__PURE__ */ h(be, {
-		appear: !0,
-		in: x,
-		duration: 400,
-		classNames: `${Y}-zoom`,
-		unmountOnExit: A,
-		mountOnEnter: k,
-		onEnter: (e) => {
-			at(!1), B(!0), Q(e);
-		},
-		onEntered: (t) => {
-			Q(t), e(j) && j();
-		},
-		onExit: (e) => {
-			Q(e), K.current = !0;
-		},
-		onExited: (t) => {
-			at(!0), B(!1), Q(t), e(O) && O(), K.current = !1;
-		},
-		refElement: W,
-		children: $
-	}), $ = /* @__PURE__ */ h(ge, {
-		visible: x,
-		forceRender: $e,
-		getContainer: T,
-		children: /* @__PURE__ */ g("div", {
-			ref: Ke,
-			className: a(`${Y}-container`, x ? `${Y}-container-visible` : `${Y}-container-hidden`),
-			children: [!!L && /* @__PURE__ */ h(he, {
-				style: Re,
-				className: a(`${Y}-mask`, x ? `${Y}-mask-visible` : `${Y}-mask-hidden`),
-				visible: x,
-				mountOnEnter: k,
-				unmountOnExit: A,
-				duration: 400
-			}), /* @__PURE__ */ h("div", {
-				...ae(He, [
-					"content",
-					"icon",
-					"showIcon",
-					"isNotice",
-					"noticeType",
-					"onCancel",
-					"onOk",
-					"closable",
-					"prefixCls"
-				]),
+		children: [
+			pt(),
+			/* @__PURE__ */ _("div", {
+				ref: nt,
+				className: `${J}-content`,
+				children: De
+			}),
+			mt(),
+			Ye && /* @__PURE__ */ _("div", {
+				ref: rt,
+				className: `${J}-drag-icon`
+			}),
+			ct && (a(Be) ? /* @__PURE__ */ _(se, {
+				prefix: J,
 				tabIndex: -1,
-				ref: (e) => {
-					H.current = e, tt();
-				},
-				style: {
-					...ze || {},
-					display: x || z ? "block" : "none",
-					overflow: !x && z ? "hidden" : ""
-				},
-				className: a(`${Y}-wrapper`, L ? `${Y}-wrapper-mask` : `${Y}-wrapper-no-mask`, {
-					[`${Y}-wrapper-align-center`]: Pe,
-					[`${Y}-wrapper-rtl`]: y
-				}, Ie),
-				onKeyDown: Qe,
-				onClick: (e) => {
-					let t = e.target, n = e.currentTarget;
-					!K.current && Me && L && t === n && !W.current?.contains?.(t) && Z();
-				},
-				children: $
-			})]
+				className: `${J}-close-icon`,
+				onClick: Y,
+				role: "button",
+				"aria-label": "Close",
+				children: /* @__PURE__ */ _(Se, {})
+			}) : /* @__PURE__ */ _("span", {
+				className: `${J}-close-icon`,
+				onClick: Y,
+				children: Be
+			}))
+		]
+	}), Q = e(Le) ? Le(Q) ?? Q : Q, Q = /* @__PURE__ */ _(_e, {
+		visible: w,
+		forceRender: ut,
+		getContainer: A,
+		children: /* @__PURE__ */ _(le, {
+			...l,
+			childrenName: b,
+			prefixCls: We || f,
+			locale: x,
+			zIndex: Qe || 1050,
+			effectGlobalModal: !1,
+			effectGlobalNotice: !1,
+			getPopupContainer: (t) => e(Fe) ? Fe(t) : nt.current,
+			children: /* @__PURE__ */ v("div", {
+				ref: H,
+				style: { zIndex: Je },
+				className: o(`${J}-container`, w ? `${J}-container-visible` : `${J}-container-hidden`),
+				children: [!!V && /* @__PURE__ */ _(ge, {
+					style: Re,
+					className: o(`${J}-mask`, w ? `${J}-mask-visible` : `${J}-mask-hidden`),
+					visible: w,
+					mountOnEnter: P,
+					unmountOnExit: F,
+					duration: d
+				}), /* @__PURE__ */ _("div", {
+					...oe(qe, [
+						"content",
+						"icon",
+						"showIcon",
+						"isNotice",
+						"noticeType"
+					]),
+					tabIndex: -1,
+					ref: (e) => {
+						U.current = e, ft();
+					},
+					style: {
+						...ze || {},
+						display: w || Xe ? "block" : "none",
+						overflow: !w && Xe ? "hidden" : ""
+					},
+					className: o(`${J}-wrapper`, V ? `${J}-wrapper-mask` : `${J}-wrapper-no-mask`, {
+						[`${J}-wrapper-align-center`]: Pe,
+						[`${J}-wrapper-rtl`]: S
+					}, Ie),
+					onKeyDown: lt,
+					onClick: (e) => {
+						let t = e.target, n = e.currentTarget;
+						!G.current && Me && V && t === n && !W.current?.contains?.(t) && X();
+					},
+					children: /* @__PURE__ */ _(ce, {
+						appear: !0,
+						in: w,
+						duration: d,
+						classNames: `${J}-zoom`,
+						unmountOnExit: F,
+						mountOnEnter: P,
+						onEnter: (e) => {
+							$(!1), Ze(!0), Z(e);
+						},
+						onEntered: (t) => {
+							Z(t), e(I) && I();
+						},
+						onExit: (e) => {
+							Z(e), G.current = !0;
+						},
+						onExited: (t) => {
+							$(!0), Ze(!1), Z(t), e(N) && N(), G.current = !1;
+						},
+						refElement: W,
+						children: Q
+					})
+				})]
+			})
 		})
 	}));
-	let { element: it, setExited: at } = me({
-		element: $,
-		visible: x,
-		mountOnEnter: k,
-		unmountOnExit: A
+	let { element: ht, setExited: $ } = he({
+		element: Q,
+		visible: w,
+		mountOnEnter: P,
+		unmountOnExit: F
 	});
-	return it;
+	return ht;
 }
-var y = u(v);
-y.displayName = "Modal", y.config = s, y.show = (e) => c({
+var S = m(x);
+S.displayName = b, S.config = l, S.show = (e) => f({
 	...e,
 	noticeType: "show"
-}), y.confirm = (e) => c(e), y.useModal = l, [
+}), S.confirm = (e) => f(e), S.useModal = p, [
 	"info",
 	"success",
 	"warning",
 	"error"
 ].forEach((e, t, n) => {
-	y[e] = (t) => c({
+	S[e] = (t) => f({
 		...t,
 		isNotice: !0,
 		noticeType: e
 	});
-}), y.destroyAll = () => {
-	for (; o.length;) {
-		let e = o.pop();
+}), S.destroyAll = () => {
+	for (; c.length;) {
+		let e = c.pop();
 		e && e();
 	}
 };
 //#endregion
-export { y as default };
+export { S as default };
 /* 独立思考，明辨是非 */

package/modal/config.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 //#region components/pc/modal/config.ts
 var e = {};
 function t(t) {

package/modal/index.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import e from "./use-modal/index.js";
 import t from "./Modal.js";
 //#region components/pc/modal/index.tsx

package/modal/interface.d.ts

@@ -5,9 +5,9 @@ import type { ConfirmProps } from './Confirm';
 /**
  * @title Modal
  */
-export interface ModalProps extends GetPopupContainer {
+export interface ModalProps extends GetPopupContainer, Pick<CSSProperties, 'zIndex'> {
     style?: CSSProperties;
-    className?: string | string[];
+    className?: string;
     /**
      * @zh 关闭弹出框的回调
      * @en Callback when click cancel button
@@ -169,6 +169,7 @@ export interface ModalProps extends GetPopupContainer {
      */
     fullscreenable?: boolean;
     draggable?: boolean;
+    prefixCls?: string;
 }
 export type ModalReturnProps = {
     update: (newConfig: ConfirmProps) => void;

package/modal/use-modal/Hook.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import { isFunction as e, isPromise as t } from "../../utils/is.js";
 import n from "../Modal.js";
 import { forwardRef as r, useImperativeHandle as i, useState as a } from "react";

package/modal/use-modal/index.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-14 16:51:07 星期二 */
+/* 潘启宝 2026-05-08 09:13:14 星期五 */
 import e from "../../utils/uuid.js";
 import { destroyList as t } from "../config.js";
 import { ContextHolderElement as n } from "../../utils/contextHolder.js";