@unicom-cloud/ui 0.8.157 → 0.8.159

package/notification/Notification.js

@@ -1,118 +1,151 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
-import { isBoolean as e, isFunction as t, isHTMLElement as n, isNull as r, isNumber as i, isString as a, isUndefined as o } from "../utils/is.js";
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
+import { isArrayAndNotEmpty as e, isBoolean as t, isFunction as n, isHTMLElement as r, isNull as i, isNumber as a, isUndefined as o } from "../utils/is.js";
 import s from "../utils/className.js";
 import c from "../hooks/use-merge-props/index.js";
-import l from "../config-provider/context.js";
-import u from "../notice/index.js";
-import { NOTIFICATION_TYPES as d } from "./constants.js";
-import f from "./withNotification.js";
-import { getGlobalConfig as p, getPosition as m, setGlobalConfig as h } from "./utils.js";
-import g from "./useNotification.js";
-import { useContext as _, useEffect as v } from "react";
-import { UI_PC_PREFIX as y } from "@unicom-cloud/utils/constant/ui";
-import { jsx as b } from "react/jsx-runtime";
-import x from "@unicom-cloud/ui-common/transition/TransitionCSS";
-import S from "@unicom-cloud/ui-common/transition/TransitionGroup";
-import { createRoot as C } from "react-dom/client";
-import { createPortal as w } from "react-dom";
+import { getPrefixCls as l } from "../config-provider/utils.js";
+import u from "../config-provider/context.js";
+import d from "../notice/withNotice.js";
+import f from "../notice/index.js";
+import { TransitionCSS as p, TransitionGroup as m } from "../transition/index.js";
+import h from "../utils/mergeProps.js";
+import { NOTIFICATION_TYPES as g } from "./constants.js";
+import { getGlobalConfig as _, getPosition as v, setGlobalConfig as y } from "./utils.js";
+import b from "./useNotification.js";
+import { useContext as x, useEffect as S, useLayoutEffect as C } from "react";
+import { UI_PC_PREFIX as w } from "@unicom-cloud/utils/constant/ui";
+import { Fragment as T, jsx as E, jsxs as D } from "react/jsx-runtime";
+import { createRoot as O } from "react-dom/client";
+import { createPortal as k } from "react-dom";
 //#region components/pc/notification/Notification.tsx
-var T = {}, E = [], D = {
+var A = {}, j = {}, M = {
 	enter: 400,
 	exit: 300
-}, O = {};
-function k(e) {
-	let { prefixCls: r, getPrefixCls: i, componentConfig: a, rtl: d } = _(l), f = c(e, O, a?.Notification), { prefixCls: h, rtl: g, getContainer: C, notices: T } = f, E = o(g) ? p().rtl : g, k = m(f.position, E), A = h || p().prefixCls, j = `${A || y}-notification`, M = s(`${j}-wrapper`, `${j}-wrapper-${k}`, { [`${j}-wrapper-rtl`]: p().rtl }), N = C?.();
-	function P(e) {
-		f.remove(e);
+}, N = { closable: !0 };
+function P(e) {
+	let { prefixCls: t, getPrefixCls: i, componentConfig: a, rtl: o } = x(u), { className: l, position: d, prefixCls: g, rtl: y = _().rtl ?? o, getContainer: b, notices: O = [], remove: A, update: j, add: P, clear: F } = c(e, N, a?.Notification), I = v(d, y), L = i?.("notification", g || w), R = b?.();
+	function z(e) {
+		A(e);
 	}
-	v(() => (f.add(f), () => {
-		f.clear();
-	}), []);
-	let F = /* @__PURE__ */ b("div", {
-		className: M,
-		children: /* @__PURE__ */ b(S, { children: T.map((e, r, i) => {
-			let a = `${j}-slide-right`;
-			["topLeft", "bottomLeft"].includes(k) && (a = `${j}-slide-left`);
-			let o;
-			return /* @__PURE__ */ b(x, {
-				duration: D,
+	C(() => () => {}, []), S(() => () => {}, []);
+	let B = /* @__PURE__ */ E("div", {
+		className: s(`${L}-wrapper`, `${L}-wrapper-${I}`, { [`${L}-wrapper-rtl`]: _().rtl }),
+		children: /* @__PURE__ */ E(m, { children: O.map((e, t, i) => {
+			let c = h({ ...e }, N, a?.Notification), { rtl: u = _().rtl ?? o, closable: d = _().closable } = c, m = `${L}-slide-right`;
+			["topLeft", "bottomLeft"].includes(I) && (m = `${L}-slide-left`);
+			let v;
+			return /* @__PURE__ */ E(p, {
+				duration: M,
 				appear: !0,
-				classNames: a,
-				refElement: () => o,
+				classNames: m,
+				refElement: () => v,
 				onEnter: (e) => {
-					n(e);
+					r(e);
+				},
+				onEntering: (e) => {
+					r(e);
+				},
+				onEntered: (e) => {
+					r(e);
 				},
 				onExit: (e) => {
-					n(e) && (e.style.height = `${e.scrollHeight}px`);
+					r(e) && (e.style.height = `${e.scrollHeight}px`);
 				},
 				onExiting: (e) => {
-					n(e) && (e.style.height = "0px");
+					r(e) && (e.style.height = "0px");
 				},
-				onExited: (r) => {
-					n(r) && (r.style.height = "0px"), t(e.onClose) && e.onClose();
+				onExited: (e) => {
+					r(e) && (e.style.height = "0px"), n(c.onClose) && c.onClose();
 				},
-				children: /* @__PURE__ */ b(u, {
-					...e,
+				children: /* @__PURE__ */ E(f, {
+					...c,
 					ref: (e) => {
-						o = e;
+						v = e;
 					},
-					onClose: P,
-					prefixCls: j,
-					iconPrefix: A,
-					classPrefixCls: A,
+					className: s(`${L}-notice`, l, c.className),
+					prefixCls: L,
+					iconPrefix: g,
+					classPrefixCls: g,
 					noticeType: "notification",
-					rtl: E
+					rtl: u,
+					closable: d,
+					contentRender: (e) => {
+						let { shouldRenderIcon: t, closeIcon: n, icon: r, title: i, content: a, button: o } = e;
+						return /* @__PURE__ */ D(T, { children: [
+							t && /* @__PURE__ */ E("div", {
+								className: `${L}-left`,
+								children: r
+							}),
+							/* @__PURE__ */ D("div", {
+								className: `${L}-right`,
+								children: [
+									i && /* @__PURE__ */ E("div", {
+										className: `${L}-title`,
+										children: i
+									}),
+									/* @__PURE__ */ E("div", {
+										className: `${L}-content`,
+										children: a
+									}),
+									o && /* @__PURE__ */ E("div", {
+										className: `${L}-btn-wrapper`,
+										children: o
+									})
+								]
+							}),
+							n
+						] });
+					},
+					onClose: z
 				})
-			}, e.id);
+			}, c.id);
 		}) })
 	});
-	return N ? w(F, N) : F;
+	return R ? k(B, R) : B;
 }
-var A = f(k);
-A.useNotification = g, A.config = (n = {}) => {
-	if (a(n.prefixCls) && h("prefixCls", n.prefixCls), i(n.maxCount) && h("maxCount", n.maxCount), i(n.duration) && h("duration", n.duration), e(n.rtl) && h("rtl", n.rtl), t(n.getContainer)) {
-		let e = n.getContainer();
-		e === p().container || (h("container", e), Object.entries(T).forEach(([e, t], n, r) => (delete T[e], t?.clear?.())));
-	}
-}, A.clear = () => {
-	Object.values(T).forEach((e, t, n) => {
-		e?.clear?.();
+var F = d(P);
+F.useNotification = b, F.config = (e = {}) => {
+	let { maxCount: r, duration: i, rtl: o, closable: s, getContainer: c } = e;
+	a(r) && y("maxCount", r), a(i) && y("duration", i), t(o) && y("rtl", o), n(c) && (c() === _().getContainer?.() || F.clear(), y("getContainer", c));
+}, F.clear = () => {
+	Object.entries(A).forEach(([e, t], r, i) => {
+		n(t?.clear) && t.clear(), delete A[e];
 	});
-}, A.remove = (e) => {
-	Object.values(T).forEach((t, n, r) => {
-		t?.remove?.(e);
+}, F.remove = (e) => {
+	Object.values(A).forEach((t, r, i) => {
+		n(t?.remove) && t.remove(e);
 	});
-}, A.addInstance = (e) => {
-	let t = m(e.position, p().rtl), n = T[t], i = {
-		duration: p().duration,
-		...e
+}, F.addInstance = (t) => {
+	let n = v(t.position, _().rtl), r = A[n], a = {
+		duration: _().duration,
+		...t
 	};
-	if (n) {
-		let t = n.notices.find((t, n, r) => t.id === e.id), r = {
-			...i,
-			update: t
-		};
-		n.notices.length >= p().maxCount && (t ? r.id = t.id : n.shift()), n.add({ ...r });
-	}
-	if (r(n) && E.push(e), o(n)) {
-		let e = document.createElement("div");
-		(p().container || document.body).appendChild(e), C(e).render(/* @__PURE__ */ b(A, {
-			...i,
-			ref: (e) => {
-				if (e) {
-					for (; E.length;) e.add(E.shift());
-					T[t] = e;
+	if (r) {
+		let { notices: e } = r;
+		e.length >= _().maxCount && r.shift(), r.add({ ...a });
+	} else if (i(r)) j[n] ??= [], j[n].push(a);
+	else if (o(r)) {
+		let t = document.createElement("div");
+		t.className = l?.("display-contents"), (_().getContainer?.() || document.body).appendChild(t);
+		let r = O(t), i = /* @__PURE__ */ E(F, {
+			...a,
+			defaultNotices: [a],
+			ref: (t) => {
+				if (t) {
+					let r = j[n];
+					for (; e(r);) t.add(r.shift());
 				}
+				return A[n] = t, () => {};
 			}
-		})), T[t] = null;
+		});
+		r.render(i), A[n] = null;
 	}
-	return T[t];
+	return A[n];
 };
-var j = d.map((e, t, n) => [e, (t) => A.addInstance({
+var I = g.map((e, t, n) => [e, (t) => F.addInstance({
 	...t,
 	type: e
 })]);
-Object.assign(A, Object.fromEntries(j));
+Object.assign(F, Object.fromEntries(I));
 //#endregion
-export { A as default, g as useNotification };
+export { F as default };
 /* 独立思考，明辨是非 */

package/notification/constants.d.ts

@@ -1 +1,2 @@
 export declare const NOTIFICATION_TYPES: string[];
+export declare const NOTIFICATION_DURATION = 3000;

package/notification/constants.js

@@ -1,13 +1,14 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
+import { NOTICE_DURATION as e } from "../notice/constants.js";
 //#region components/pc/notification/constants.ts
-var e = [
+var t = [
 	"info",
 	"success",
 	"error",
 	"warning",
 	"loading",
 	"normal"
-];
+], n = e;
 //#endregion
-export { e as NOTIFICATION_TYPES };
+export { n as NOTIFICATION_DURATION, t as NOTIFICATION_TYPES };
 /* 独立思考，明辨是非 */

package/notification/index.js

@@ -1,7 +1,7 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
 import e from "./useNotification.js";
 import t from "./Notification.js";
-//#region components/pc/notification/index.tsx
+//#region components/pc/notification/index.ts
 var n = Object.assign(t, {});
 //#endregion
 export { n as default, e as useNotification };

package/notification/interface.d.ts

@@ -1,73 +1,11 @@
-import { CSSProperties, ReactInstance, ReactNode } from 'react';
+import { ReactInstance } from 'react';
+import { NoticeProps } from '../notice';
+import { NoticeHandle } from '../notice/interface';
 /**
  * @title Notification
  */
-export interface NotificationProps {
-    style?: CSSProperties;
-    className?: string;
-    prefixCls?: string;
-    /**
-     * @zh 通知标题
-     * @en Notification title
-     */
-    title?: ReactNode | string;
-    /**
-     * @zh 通知内容
-     * @en Notification content
-     */
-    content?: ReactNode | string;
-    /**
-     * @zh 是否显示图标
-     * @en Whether to show the icon
-     * @defaultValue true
-     */
-    showIcon?: boolean;
-    /**
-     * @zh 自定义图标
-     * @en Custom icon
-     */
-    icon?: ReactNode;
-    /**
-     * @zh 自动关闭的时间，单位为 `ms`
-     * @en Automatic shutdown time, the unit is `ms`
-     * @defaultValue 3000
-     */
-    duration?: number;
-    /**
-     * @zh 关闭时的回调
-     * @en Callback when close
-     */
-    onClose?: () => void;
-    /**
-     * @zh 当前通知的唯一标识，可以用来更新消息
-     * @en The unique identifier of the current notification, which can be used to update the message
-     */
-    id?: string;
-    /**
-     * @zh 消息的位置，分为 `topLeft` 左上方、`topRight` 右上方、`bottomLeft` 左下方和 `bottomRight` 右下方
-     * @en The position of the message
-     */
-    position?: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
-    /**
-     * @zh 添加操作按钮
-     * @en Add action button
-     */
-    btn?: ReactNode;
-    /**
-     * @zh 是否显示关闭按钮
-     * @en Whether to show the close button
-     * @defaultValue true
-     */
-    closable?: boolean;
-    /**
-     * @zh 自定义右上角关闭按钮
-     * @en Custom the close button on top-right of the drawer dialog
-     */
-    closeIcon?: ReactNode;
-    type?: string;
-    rtl?: boolean;
-    getContainer?: () => ReactNode;
-    notices?: NotificationProps[];
+export interface NotificationProps extends NoticeProps {
+    maxCount?: number;
 }
 type notificationHookFunction = (config: NotificationProps) => ReactInstance;
 export type NotificationHookReturnType = {
@@ -79,19 +17,6 @@ export type NotificationHookReturnType = {
     normal?: notificationHookFunction;
     remove?: (id: string) => void;
 };
-export type ConfigProps = {
-    maxCount?: number;
-    prefixCls?: string;
-    getContainer?: () => HTMLElement;
-    duration?: number;
-    rtl?: boolean;
-};
-export interface NotificationHandle {
-    notices: unknown[];
-    add: (newNotice: NotificationProps) => string;
-    update: (newNotice: NotificationProps) => void;
-    shift: () => void;
-    remove: (id: string) => void;
-    clear: () => void;
+export interface NotificationHandle extends NoticeHandle {
 }
 export {};

package/notification/useNotification.d.ts

@@ -1,5 +1,4 @@
 import { JSX } from 'react/jsx-runtime';
-import type { ConfigProps, NotificationHookReturnType } from './interface';
-export type notificationFuncType = NotificationHookReturnType;
-declare function useNotification(commonConfig?: ConfigProps): [NotificationHookReturnType, JSX.Element];
+import type { NotificationHookReturnType, NotificationProps } from './interface';
+declare function useNotification(props?: Partial<NotificationProps>): [NotificationHookReturnType, JSX.Element];
 export default useNotification;

package/notification/useNotification.js

@@ -1,45 +1,53 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
-import { uuid as e } from "../utils/uuid.js";
-import { NOTIFICATION_TYPES as t } from "./constants.js";
-import { getPosition as n } from "./utils.js";
-import r from "./Notification.js";
-import { ContextHolderElement as i } from "../utils/contextHolder.js";
-import "../utils/index.js";
-import { useRef as a } from "react";
-import { jsx as o } from "react/jsx-runtime";
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
+import { isArrayAndNotEmpty as e, isNull as t, isUndefined as n } from "../utils/is.js";
+import r from "../utils/uuid.js";
+import { NOTIFICATION_DURATION as i, NOTIFICATION_TYPES as a } from "./constants.js";
+import { getPosition as o } from "./utils.js";
+import s from "./Notification.js";
+import { ContextHolderElement as c } from "../utils/contextHolder.js";
+import { useRef as l } from "react";
+import { jsx as u } from "react/jsx-runtime";
 //#region components/pc/notification/useNotification.tsx
-function s(s = {}) {
-	let { maxCount: c, duration: l = 3e3, prefixCls: u, getContainer: d } = s, f = a(void 0), p = /* @__PURE__ */ o(i, { ref: f }), m = {}, h;
-	function g(t) {
-		let i, a;
-		if (f.current) {
-			let e = f.current.getContextConfig();
-			a = e.rtl, i = e.prefixCls;
+function d(d = {}) {
+	let { maxCount: f, duration: p = i, getContainer: m } = d, h = l(void 0), g = /* @__PURE__ */ u(c, { ref: h }), _ = {}, v = {};
+	function y(i) {
+		let { prefixCls: a, rtl: c } = h.current?.getContextConfig?.() ?? {}, l = o(i.position, c), d = {
+			duration: p,
+			...i
+		}, g = _[l];
+		if (g) {
+			let { notices: e } = g;
+			e?.length >= f && g.shift(), g.add({ ...d });
+		} else if (t(g)) v[l] ??= [], v[l].push(d);
+		else if (n(g)) {
+			let t = /* @__PURE__ */ u(s, {
+				...d,
+				defaultNotices: [d],
+				prefixCls: a,
+				rtl: c,
+				getContainer: m,
+				ref: (t) => {
+					if (t) {
+						let n = v[l];
+						for (; e(n);) t.add(n.shift());
+					}
+					return _[l] = t, () => {};
+				}
+			}, r());
+			h.current.addInstance(t), _[l] = null;
 		}
-		let s = u || i, p = n(t.position, a), g = {
-			duration: l,
-			...t
-		}, _ = m[p];
-		return _ ? (_.notices.length >= c && (g.id = _.notices[0].id, _.shift()), _.add({ ...g })) : (h = /* @__PURE__ */ o(r, {
-			...g,
-			prefixCls: s,
-			rtl: a,
-			getContainer: d,
-			ref: (e) => {
-				m[p] = e;
-			}
-		}, e()), f.current.addInstance(h)), m[p];
+		return _[l];
 	}
-	let _ = {}, v = t.map((e) => [e, (t) => g({
+	let b = {}, x = a.map((e, t, n) => [e, (t) => y({
 		...t,
 		type: e
 	})]);
-	return Object.assign(_, Object.fromEntries(v)), _.remove = (e) => {
-		Object.keys(m).forEach((t) => {
-			m[t]?.remove?.(e);
+	return Object.assign(b, Object.fromEntries(x)), b.remove = (e) => {
+		Object.keys(_).forEach((t) => {
+			_[t]?.remove?.(e);
 		});
-	}, [_, p];
+	}, [b, g];
 }
 //#endregion
-export { s as default };
+export { d as default };
 /* 独立思考，明辨是非 */

package/notification/utils.d.ts

@@ -1,11 +1,4 @@
-interface NotificationConfig {
-    maxCount?: number;
-    prefixCls?: string;
-    duration?: number;
-    container?: HTMLElement;
-    rtl?: boolean;
-}
-export declare function setGlobalConfig<K extends keyof NotificationConfig>(key: K, value: NotificationConfig[K]): void;
-export declare function getGlobalConfig(): NotificationConfig;
-export declare function getPosition(position?: string, rtl_?: boolean): string;
-export {};
+import type { NotificationProps } from './interface';
+export declare function setGlobalConfig<K extends keyof Partial<NotificationProps>>(key: K, value: Partial<NotificationProps>[K]): void;
+export declare function getGlobalConfig(): Partial<NotificationProps>;
+export declare function getPosition(position?: string, rtl?: boolean): string;

package/notification/utils.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
 import { isUndefined as e } from "../utils/is.js";
 //#region components/pc/notification/utils.ts
 var t = {};

package/overflow-ellipsis/OverflowEllipsis.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
 import e from "../utils/className.js";
 import t from "../config-provider/context.js";
 import "../config-provider/index.js";
@@ -21,7 +21,7 @@ function f(i, f) {
 		y,
 		T
 	]);
-	let k = c(void 0);
+	let k = c(null);
 	return n((e) => {
 		b(e?.[0]?.target?.clientWidth || 0);
 	}, [k.current]), o(f, () => ({ getRootElement() {

package/overflow-ellipsis/OverflowItem.js

@@ -1,4 +1,4 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
 import e from "../utils/className.js";
 import t from "../config-provider/context.js";
 import "../config-provider/index.js";
@@ -7,7 +7,7 @@ import { useContext as r, useEffect as i, useRef as a } from "react";
 import { jsx as o } from "react/jsx-runtime";
 //#region components/pc/overflow-ellipsis/OverflowItem.tsx
 function s(s) {
-	let { prefixCls: c, getPrefixCls: l } = r(t), u = l?.("overflow-item"), d = a(void 0);
+	let { prefixCls: c, getPrefixCls: l } = r(t), u = l?.("overflow-item"), d = a(null);
 	return n((e) => {
 		s.onResize(e?.[0]?.target);
 	}, [d.current]), i(() => (s.onResize(d.current), () => {

package/overflow-ellipsis/index.js

@@ -1,7 +1,7 @@
-/* 潘启宝 2026-04-23 09:23:31 星期四 */
+/* 潘启宝 2026-05-15 17:45:52 星期五 */
 import e from "./OverflowItem.js";
 import t from "./OverflowEllipsis.js";
-//#region components/pc/overflow-ellipsis/index.tsx
+//#region components/pc/overflow-ellipsis/index.ts
 var n = Object.assign(t, {});
 //#endregion
 export { e as OverflowEllipsisItem, n as default };

package/package.json

@@ -1 +1 @@
-{"name":"@unicom-cloud/ui","version":"0.8.157","dependencies":{"@unicom-cloud/utils":"^0.1.0","@unicom-cloud/icons":"^0.1.0","@unicom-cloud/ui-common":"^0.1.0"},"peerDependencies":{"dayjs":"^1.11.19","lodash":"^4.18.1","react":"^18.3.1","react-dom":"^18.3.1","react-is":"^18.3.1"},"type":"module","types":"types/index.d.ts","main":"./index.js","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"}}
+{"name":"@unicom-cloud/ui","version":"0.8.159","dependencies":{"@unicom-cloud/utils":"^0.1.0","@unicom-cloud/icons":"^0.1.0","@unicom-cloud/ui-common":"^0.1.0"},"peerDependencies":{"dayjs":"^1.11.19","lodash":"^4.18.1","react":"^18.3.1","react-dom":"^18.3.1","react-is":"^18.3.1"},"type":"module","types":"types/index.d.ts","main":"./index.js","publishConfig":{"registry":"https://registry.npmjs.org/","access":"public"}}