@rainbow-oh/yee-c 0.8.2 → 0.8.4

package/dist/cjs/notice/use-notice.js

@@ -52,85 +52,170 @@ module.exports = __toCommonJS(use_notice_exports);
 var import_react = __toESM(require("react"));
 var import_react_dom = require("react-dom");
 var import_notice_list = __toESM(require("./notice-list"));
+var invokeOnClose = (notices) => {
+  const errors = [];
+  notices.forEach((notice) => {
+    var _a;
+    try {
+      (_a = notice.onClose) == null ? void 0 : _a.call(notice);
+    } catch (error) {
+      errors.push(error);
+    }
+  });
+  errors.forEach((error) => {
+    const reportError = globalThis.reportError;
+    if (reportError) {
+      reportError(error);
+    } else {
+      console.error(error);
+    }
+  });
+};
 var useNotice = () => {
   const [noticesByPlacement, setNoticesByPlacement] = (0, import_react.useState)(/* @__PURE__ */ new Map());
-  const count = (0, import_react.useRef)(0);
-  const add = (0, import_react.useCallback)((props) => {
-    const placement = props.placement || "topRight";
-    const id = count.current++;
-    setNoticesByPlacement((prev) => {
-      const newMap = new Map(prev);
-      const notices = newMap.get(placement) || [];
-      newMap.set(placement, [...notices, __spreadValues({ key: id }, props)]);
-      return newMap;
-    });
+  const [portalContainer, setPortalContainer] = (0, import_react.useState)(
+    null
+  );
+  const noticesRef = (0, import_react.useRef)(/* @__PURE__ */ new Map());
+  const generationByKey = (0, import_react.useRef)(/* @__PURE__ */ new Map());
+  const generation = (0, import_react.useRef)(0);
+  const timerGeneration = (0, import_react.useRef)(0);
+  const autoKey = (0, import_react.useRef)(0);
+  (0, import_react.useEffect)(() => {
+    setPortalContainer(document.body);
   }, []);
-  const onDestroy = (key, placement) => {
-    setNoticesByPlacement((prev) => {
-      const newMap = new Map(prev);
-      const notices = newMap.get(placement) || [];
-      const filtered = notices.filter((notice) => notice.key !== key);
-      if (filtered.length === 0) {
-        newMap.delete(placement);
-      } else {
-        newMap.set(placement, filtered);
-      }
-      return newMap;
-    });
-  };
-  const noticeApi = {
-    open: (props) => {
-      add(
-        typeof props === "string" ? { content: props, status: "info" } : __spreadValues({ status: "info" }, props)
-      );
+  const updateNotices = (0, import_react.useCallback)(
+    (updater) => {
+      const nextNotices = updater(noticesRef.current);
+      noticesRef.current = nextNotices;
+      setNoticesByPlacement(nextNotices);
     },
-    success: (props) => {
-      add(
-        typeof props === "string" ? { content: props, status: "success" } : __spreadProps(__spreadValues({}, props), { status: "success" })
-      );
-    },
-    error: (props) => {
-      add(
-        typeof props === "string" ? { content: props, status: "error" } : __spreadProps(__spreadValues({}, props), { status: "error" })
-      );
-    },
-    warning: (props) => {
-      add(
-        typeof props === "string" ? { content: props, status: "warning" } : __spreadProps(__spreadValues({}, props), { status: "warning" })
-      );
-    },
-    info: (props) => {
-      add(
-        typeof props === "string" ? { content: props, status: "info" } : __spreadProps(__spreadValues({}, props), { status: "info" })
-      );
-    },
-    destroy: (key) => {
-      setNoticesByPlacement((prev) => {
-        const newMap = new Map(prev);
-        newMap.forEach((notices, placement) => {
-          const filtered = notices.filter((notice) => notice.key !== key);
+    []
+  );
+  const onDestroy = (0, import_react.useCallback)(
+    (key, expectedTimerGeneration) => {
+      var _a;
+      let target;
+      noticesRef.current.forEach((items) => {
+        target != null ? target : target = items.find((item) => item.key === key);
+      });
+      if (!target || expectedTimerGeneration !== void 0 && target.timerGeneration !== expectedTimerGeneration) {
+        return;
+      }
+      generationByKey.current.delete(key);
+      updateNotices((current) => {
+        const next = new Map(current);
+        next.forEach((items, placement) => {
+          const filtered = items.filter((item) => item.key !== key);
           if (filtered.length === 0) {
-            newMap.delete(placement);
-          } else if (filtered.length !== notices.length) {
-            newMap.set(placement, filtered);
+            next.delete(placement);
+          } else if (filtered.length !== items.length) {
+            next.set(placement, filtered);
           }
         });
-        return newMap;
+        return next;
       });
+      (_a = target.onClose) == null ? void 0 : _a.call(target);
     },
-    clear: (placement) => {
-      if (placement) {
-        setNoticesByPlacement((prev) => {
-          const newMap = new Map(prev);
-          newMap.delete(placement);
-          return newMap;
-        });
-      } else {
-        setNoticesByPlacement(/* @__PURE__ */ new Map());
+    [updateNotices]
+  );
+  const add = (0, import_react.useCallback)(
+    (props) => {
+      var _a, _b;
+      const placement = (_a = props.placement) != null ? _a : "topRight";
+      let key = props.key;
+      if (key === void 0 || key === null) {
+        do {
+          key = `__yee_notice_auto_${autoKey.current++}`;
+        } while (generationByKey.current.has(key));
       }
+      const keyGeneration = (_b = generationByKey.current.get(key)) != null ? _b : generation.current++;
+      generationByKey.current.set(key, keyGeneration);
+      const nextNotice = __spreadProps(__spreadValues({}, props), {
+        key,
+        placement,
+        timerGeneration: timerGeneration.current++
+      });
+      updateNotices((current) => {
+        const next = new Map(current);
+        let existingIndex = -1;
+        next.forEach((items, currentPlacement) => {
+          const index = items.findIndex((item) => item.key === key);
+          if (index < 0) {
+            return;
+          }
+          if (currentPlacement === placement) {
+            existingIndex = index;
+          } else {
+            const filtered = items.filter((item) => item.key !== key);
+            if (filtered.length === 0) {
+              next.delete(currentPlacement);
+            } else {
+              next.set(currentPlacement, filtered);
+            }
+          }
+        });
+        const targetNotices = (next.get(placement) || []).filter(
+          (item) => item.key !== key
+        );
+        if (existingIndex >= 0) {
+          targetNotices.splice(existingIndex, 0, nextNotice);
+        } else {
+          targetNotices.push(nextNotice);
+        }
+        next.set(placement, targetNotices);
+        return next;
+      });
+      return () => {
+        if (generationByKey.current.get(key) === keyGeneration) {
+          onDestroy(key);
+        }
+      };
+    },
+    [onDestroy, updateNotices]
+  );
+  const clear = (0, import_react.useCallback)(
+    (placement) => {
+      const removed = placement ? noticesRef.current.get(placement) || [] : Array.from(noticesRef.current.values()).flat();
+      removed.forEach((item) => generationByKey.current.delete(item.key));
+      updateNotices((current) => {
+        if (!placement) {
+          return /* @__PURE__ */ new Map();
+        }
+        const next = new Map(current);
+        next.delete(placement);
+        return next;
+      });
+      invokeOnClose(removed);
+    },
+    [updateNotices]
+  );
+  const noticeApi = (0, import_react.useMemo)(
+    () => ({
+      open: (props) => add(
+        typeof props === "string" ? { content: props, status: "info" } : __spreadValues({ status: "info" }, props)
+      ),
+      success: (props) => add(
+        typeof props === "string" ? { content: props, status: "success" } : __spreadProps(__spreadValues({}, props), { status: "success" })
+      ),
+      error: (props) => add(
+        typeof props === "string" ? { content: props, status: "error" } : __spreadProps(__spreadValues({}, props), { status: "error" })
+      ),
+      warning: (props) => add(
+        typeof props === "string" ? { content: props, status: "warning" } : __spreadProps(__spreadValues({}, props), { status: "warning" })
+      ),
+      info: (props) => add(
+        typeof props === "string" ? { content: props, status: "info" } : __spreadProps(__spreadValues({}, props), { status: "info" })
+      ),
+      destroy: onDestroy,
+      clear
+    }),
+    [add, clear, onDestroy]
+  );
+  const noticeHolders = (0, import_react.useMemo)(() => {
+    if (!portalContainer) {
+      return [];
     }
-  };
-  const noticeHolders = import_react.default.useMemo(() => {
     const holders = [];
     noticesByPlacement.forEach((notices, placement) => {
       holders.push(
@@ -140,16 +225,16 @@ var useNotice = () => {
             {
               items: notices,
               placement,
-              onDestroy: (key) => onDestroy(key, placement)
+              onDestroy
             }
           ),
-          document.body,
+          portalContainer,
           `notice-${placement}`
         )
       );
     });
     return holders;
-  }, [noticesByPlacement]);
+  }, [noticesByPlacement, onDestroy, portalContainer]);
   return { noticeApi, noticeHolders };
 };
 var use_notice_default = useNotice;

package/dist/cjs/notice/wrapper.d.ts

@@ -1,31 +1,35 @@
 import { Root } from 'react-dom/client';
-import { NoticeConfig, NoticeType, WrapperedNoticeConfig } from './interface';
-type PlacementType = 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'top' | 'bottom';
+import { NoticeClose, NoticeConfig, NoticeType, PlacementType, WrapperedNoticeConfig } from './interface';
 declare class NoticeWrapper {
     roots: Map<PlacementType, Root>;
     containers: Map<PlacementType, HTMLElement>;
     notices: Map<PlacementType, NoticeType[]>;
+    generationByKey: Map<string | number, number>;
+    generation: number;
+    timerGeneration: number;
     constructor();
     uuid(): string;
     private createContainer;
     private cleanupContainer;
     unmount(placement?: PlacementType): void;
     render(placement: PlacementType): void;
-    show(params: WrapperedNoticeConfig): void;
-    destroy(key: string | number, placement?: PlacementType): void;
-    open(params: string | NoticeConfig): void;
-    info(params: string | NoticeConfig): void;
-    success(params: string | NoticeConfig): void;
-    warning(params: string | NoticeConfig): void;
-    error(params: string | NoticeConfig): void;
+    show(params: WrapperedNoticeConfig): NoticeClose;
+    destroy(key: string | number, expectedTimerGeneration?: number): void;
+    clear(placement?: PlacementType): void;
+    open(params: string | NoticeConfig): NoticeClose;
+    info(params: string | NoticeConfig): NoticeClose;
+    success(params: string | NoticeConfig): NoticeClose;
+    warning(params: string | NoticeConfig): NoticeClose;
+    error(params: string | NoticeConfig): NoticeClose;
 }
 declare const noticeWrapper: NoticeWrapper;
 export default noticeWrapper;
 export declare const notice: {
-    open: (params: string | NoticeConfig) => void;
-    info: (params: string | NoticeConfig) => void;
-    success: (params: string | NoticeConfig) => void;
-    warning: (params: string | NoticeConfig) => void;
-    error: (params: string | NoticeConfig) => void;
-    destroy: (key: string | number, placement?: PlacementType) => void;
+    open: (params: string | NoticeConfig) => NoticeClose;
+    info: (params: string | NoticeConfig) => NoticeClose;
+    success: (params: string | NoticeConfig) => NoticeClose;
+    warning: (params: string | NoticeConfig) => NoticeClose;
+    error: (params: string | NoticeConfig) => NoticeClose;
+    destroy: (key: string | number, expectedTimerGeneration?: number) => void;
+    clear: (placement?: PlacementType) => void;
 };

package/dist/cjs/notice/wrapper.js

@@ -53,14 +53,44 @@ module.exports = __toCommonJS(wrapper_exports);
 var import_react = __toESM(require("react"));
 var import_client = require("react-dom/client");
 var import_notice_list = __toESM(require("./notice-list"));
+var noop = () => {
+};
+var invokeOnClose = (notices) => {
+  const errors = [];
+  notices.forEach((notice2) => {
+    var _a;
+    try {
+      (_a = notice2.onClose) == null ? void 0 : _a.call(notice2);
+    } catch (error) {
+      errors.push(error);
+    }
+  });
+  errors.forEach((error) => {
+    const reportError = globalThis.reportError;
+    if (reportError) {
+      reportError(error);
+    } else {
+      console.error(error);
+    }
+  });
+};
 var NoticeWrapper = class {
   constructor() {
     this.roots = /* @__PURE__ */ new Map();
     this.containers = /* @__PURE__ */ new Map();
     this.notices = /* @__PURE__ */ new Map();
+    this.generationByKey = /* @__PURE__ */ new Map();
+    this.generation = 0;
+    this.timerGeneration = 0;
+    this.destroy = this.destroy.bind(this);
   }
   uuid() {
-    return crypto.randomUUID ? crypto.randomUUID() : "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
+    var _a, _b;
+    const randomUUID = (_b = (_a = globalThis.crypto) == null ? void 0 : _a.randomUUID) == null ? void 0 : _b.call(_a);
+    if (randomUUID) {
+      return randomUUID;
+    }
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (c) => {
       const r = Math.random() * 16 | 0;
       const v = c === "x" ? r : r & 3 | 8;
       return v.toString(16);
@@ -77,39 +107,41 @@ var NoticeWrapper = class {
   }
   cleanupContainer(placement) {
     const container = this.containers.get(placement);
-    if (container && container.parentNode) {
+    if (container == null ? void 0 : container.parentNode) {
       container.parentNode.removeChild(container);
-      this.containers.delete(placement);
     }
+    this.containers.delete(placement);
   }
   unmount(placement) {
-    if (placement) {
-      const root = this.roots.get(placement);
-      if (root) {
-        root.unmount();
-        this.roots.delete(placement);
-        this.cleanupContainer(placement);
-        this.notices.delete(placement);
-      }
-    } else {
-      this.roots.forEach((root, placement2) => {
-        root.unmount();
-        this.cleanupContainer(placement2);
-      });
+    const placements = placement ? [placement] : Array.from(this.notices.keys());
+    const removed = placements.flatMap((item) => this.notices.get(item) || []);
+    placements.forEach((item) => {
+      var _a;
+      (_a = this.roots.get(item)) == null ? void 0 : _a.unmount();
+      this.roots.delete(item);
+      this.cleanupContainer(item);
+      this.notices.delete(item);
+    });
+    if (!placement) {
       this.roots.clear();
       this.containers.clear();
-      this.notices.clear();
     }
+    removed.forEach((item) => {
+      this.generationByKey.delete(item.key);
+    });
+    invokeOnClose(removed);
   }
   render(placement) {
+    var _a;
+    if (typeof document === "undefined") {
+      return;
+    }
     const notices = this.notices.get(placement) || [];
     if (notices.length === 0) {
-      const root2 = this.roots.get(placement);
-      if (root2) {
-        root2.unmount();
-        this.roots.delete(placement);
-        this.cleanupContainer(placement);
-      }
+      (_a = this.roots.get(placement)) == null ? void 0 : _a.unmount();
+      this.roots.delete(placement);
+      this.cleanupContainer(placement);
+      this.notices.delete(placement);
       return;
     }
     const container = this.createContainer(placement);
@@ -124,60 +156,97 @@ var NoticeWrapper = class {
         {
           items: notices,
           placement,
-          onDestroy: (key) => this.destroy(key, placement)
+          onDestroy: this.destroy
         }
       )
     );
   }
   show(params) {
-    const placement = params.placement || "topRight";
-    if (!params.key) {
-      params.key = this.uuid();
+    var _a, _b, _c;
+    if (typeof document === "undefined") {
+      return noop;
     }
-    const notices = this.notices.get(placement) || [];
-    const existIndex = notices.findIndex((item) => item.key === params.key);
-    if (existIndex >= 0) {
-      notices[existIndex] = params;
+    const placement = (_a = params.placement) != null ? _a : "topRight";
+    const key = (_b = params.key) != null ? _b : this.uuid();
+    const keyGeneration = (_c = this.generationByKey.get(key)) != null ? _c : this.generation++;
+    this.generationByKey.set(key, keyGeneration);
+    const affectedPlacements = /* @__PURE__ */ new Set([placement]);
+    this.notices.forEach((items, currentPlacement) => {
+      if (currentPlacement !== placement && items.some((item) => item.key === key)) {
+        this.notices.set(
+          currentPlacement,
+          items.filter((item) => item.key !== key)
+        );
+        affectedPlacements.add(currentPlacement);
+      }
+    });
+    const currentNotices = this.notices.get(placement) || [];
+    const existingIndex = currentNotices.findIndex((item) => item.key === key);
+    const nextNotice = __spreadProps(__spreadValues({}, params), {
+      key,
+      placement,
+      timerGeneration: this.timerGeneration++
+    });
+    const nextNotices = currentNotices.filter((item) => item.key !== key);
+    if (existingIndex >= 0) {
+      nextNotices.splice(existingIndex, 0, nextNotice);
     } else {
-      notices.push(params);
+      nextNotices.push(nextNotice);
     }
-    this.notices.set(placement, notices);
-    this.render(placement);
+    this.notices.set(placement, nextNotices);
+    affectedPlacements.forEach((item) => this.render(item));
+    return () => {
+      if (this.generationByKey.get(key) === keyGeneration) {
+        this.destroy(key);
+      }
+    };
   }
-  destroy(key, placement) {
-    if (placement) {
-      const notices = this.notices.get(placement) || [];
-      const filtered = notices.filter((item) => item.key !== key);
-      this.notices.set(placement, filtered);
-      this.render(placement);
-    } else {
-      this.notices.forEach((notices, p) => {
-        const filtered = notices.filter((item) => item.key !== key);
-        this.notices.set(p, filtered);
-        this.render(p);
-      });
+  destroy(key, expectedTimerGeneration) {
+    var _a;
+    let target;
+    this.notices.forEach((items) => {
+      target != null ? target : target = items.find((item) => item.key === key);
+    });
+    if (!target || expectedTimerGeneration !== void 0 && target.timerGeneration !== expectedTimerGeneration) {
+      return;
     }
+    const affectedPlacements = /* @__PURE__ */ new Set();
+    this.notices.forEach((items, placement) => {
+      if (items.some((item) => item.key === key)) {
+        this.notices.set(
+          placement,
+          items.filter((item) => item.key !== key)
+        );
+        affectedPlacements.add(placement);
+      }
+    });
+    this.generationByKey.delete(key);
+    affectedPlacements.forEach((item) => this.render(item));
+    (_a = target.onClose) == null ? void 0 : _a.call(target);
+  }
+  clear(placement) {
+    this.unmount(placement);
   }
   open(params) {
-    this.show(typeof params === "string" ? { content: params } : params);
+    return this.show(typeof params === "string" ? { content: params } : params);
   }
   info(params) {
-    this.show(
+    return this.show(
       typeof params === "string" ? { status: "info", content: params } : __spreadProps(__spreadValues({}, params), { status: "info" })
     );
   }
   success(params) {
-    this.show(
+    return this.show(
       typeof params === "string" ? { status: "success", content: params } : __spreadProps(__spreadValues({}, params), { status: "success" })
     );
   }
   warning(params) {
-    this.show(
+    return this.show(
       typeof params === "string" ? { status: "warning", content: params } : __spreadProps(__spreadValues({}, params), { status: "warning" })
     );
   }
   error(params) {
-    this.show(
+    return this.show(
       typeof params === "string" ? { status: "error", content: params } : __spreadProps(__spreadValues({}, params), { status: "error" })
     );
   }
@@ -190,5 +259,6 @@ var notice = {
   success: noticeWrapper.success.bind(noticeWrapper),
   warning: noticeWrapper.warning.bind(noticeWrapper),
   error: noticeWrapper.error.bind(noticeWrapper),
-  destroy: noticeWrapper.destroy.bind(noticeWrapper)
+  destroy: noticeWrapper.destroy.bind(noticeWrapper),
+  clear: noticeWrapper.clear.bind(noticeWrapper)
 };

package/dist/cjs/style/size.css

@@ -323,9 +323,9 @@
   --yee-menu-submenu-vertical-top: -4px;
 
   /* --Message-- */
-  --yee-message-gap: 8px;
-  --yee-message-padding: 12px 16px;
-  --yee-message-border-radius: 4px;
+  --yee-message-gap: 6px;
+  --yee-message-padding: 9px 12px;
+  --yee-message-border-radius: 8px;
   --yee-message-box-shadow: 0 8px 24px 0 var(--yee-box-shadow-color);
   --yee-message-icon-size: 20px;
   --yee-message-list-top: 24px;

package/dist/cjs/style/themes.css

@@ -1,7 +1,7 @@
 /*!
  * @rainbow-oh/yee-c CSS Variables
  * Auto-generated, do not edit manually
- * Generated on 2026-07-23T09:42:21.552Z
+ * Generated on 2026-07-27T03:27:50.585Z
  */
 
 /* ========== color.blue.css ========== */

package/dist/cjs/style/variables.css

@@ -1,7 +1,7 @@
 /*!
  * @rainbow-oh/yee-c CSS Variables
  * Auto-generated, do not edit manually
- * Generated on 2026-07-23T09:42:21.552Z
+ * Generated on 2026-07-27T03:27:50.585Z
  */
 
 /* ========== color.css ========== */
@@ -1445,9 +1445,9 @@
   --yee-menu-submenu-vertical-top: -4px;
 
   /* --Message-- */
-  --yee-message-gap: 8px;
-  --yee-message-padding: 12px 16px;
-  --yee-message-border-radius: 4px;
+  --yee-message-gap: 6px;
+  --yee-message-padding: 9px 12px;
+  --yee-message-border-radius: 8px;
   --yee-message-box-shadow: 0 8px 24px 0 var(--yee-box-shadow-color);
   --yee-message-icon-size: 20px;
   --yee-message-list-top: 24px;

package/dist/cjs/version.d.ts

@@ -3,4 +3,4 @@ declare global {
         __yee_c_version__: string;
     }
 }
-export declare const version = "0.8.2";
+export declare const version = "0.8.4";

package/dist/cjs/version.js

@@ -22,7 +22,7 @@ __export(version_exports, {
   version: () => version
 });
 module.exports = __toCommonJS(version_exports);
-var version = "0.8.2";
+var version = "0.8.4";
 if (typeof window !== "undefined") {
   window.__yee_c_version__ = version;
 }