@lark-apaas/client-toolkit-lite 1.1.19-alpha.0 → 1.1.19-alpha.2

package/dist/index.cjs

@@ -2141,7 +2141,7 @@ var safety_default = Safety;
 
 // src/components/AppContainer/Watermark.tsx
 var import_react6 = __toESM(require("react"), 1);
-var import_react_dom = require("react-dom");
+var import_client = require("react-dom/client");
 var PopoverPrimitive2 = __toESM(require("@radix-ui/react-popover"), 1);
 
 // src/components/AppContainer/doubao-watermark-asset.ts
@@ -2409,6 +2409,16 @@ var MobileWatermark = /* @__PURE__ */ __name(({ onDontShow, portalContainer }) =
     minWidth: 160
   }))));
 }, "MobileWatermark");
+var ShadowRootUI = /* @__PURE__ */ __name(({ shadowRoot }) => {
+  const [closed, setClosed] = (0, import_react6.useState)(false);
+  const isMobile2 = useIsMobile();
+  if (closed) return null;
+  return /* @__PURE__ */ import_react6.default.createElement(WatermarkContent, {
+    isMobile: isMobile2,
+    onClose: /* @__PURE__ */ __name(() => setClosed(true), "onClose"),
+    portalContainer: shadowRoot
+  });
+}, "ShadowRootUI");
 var WatermarkContent = /* @__PURE__ */ __name(({ isMobile: isMobile2, onClose, portalContainer }) => {
   const [open, setOpen] = (0, import_react6.useState)(false);
   const timer = (0, import_react6.useRef)(null);
@@ -2458,19 +2468,26 @@ var WatermarkContent = /* @__PURE__ */ __name(({ isMobile: isMobile2, onClose, p
   }));
 }, "WatermarkContent");
 var Watermark = /* @__PURE__ */ __name(() => {
-  const [closed, setClosed] = (0, import_react6.useState)(false);
-  const [shadowRoot, setShadowRoot] = (0, import_react6.useState)(null);
   const hostRef = (0, import_react6.useRef)(null);
-  const isMobile2 = useIsMobile();
+  const rootRef = (0, import_react6.useRef)(null);
   useIsomorphicLayoutEffect(() => {
     if (!hostRef.current) return;
-    const root = hostRef.current.shadowRoot ?? hostRef.current.attachShadow({
+    const host = hostRef.current;
+    const shadow = host.shadowRoot ?? host.attachShadow({
       mode: "open"
     });
-    setShadowRoot(root);
+    const root = (0, import_client.createRoot)(shadow);
+    rootRef.current = root;
+    root.render(/* @__PURE__ */ import_react6.default.createElement(ShadowRootUI, {
+      shadowRoot: shadow
+    }));
+    return () => {
+      const r = root;
+      queueMicrotask(() => r.unmount());
+      rootRef.current = null;
+    };
   }, []);
   if (String(process.env.MIAODA_APP_SOURCE) !== DOUBAO_SOURCE) return null;
-  if (closed) return null;
   const hostStyle = {
     all: "initial",
     position: "fixed",
@@ -2483,15 +2500,10 @@ var Watermark = /* @__PURE__ */ __name(() => {
     width: "auto",
     height: "auto"
   };
-  const content = /* @__PURE__ */ import_react6.default.createElement(WatermarkContent, {
-    isMobile: isMobile2,
-    onClose: /* @__PURE__ */ __name(() => setClosed(true), "onClose"),
-    portalContainer: shadowRoot
-  });
   return /* @__PURE__ */ import_react6.default.createElement(HOST_TAG, {
     ref: hostRef,
     style: hostStyle
-  }, shadowRoot ? /* @__PURE__ */ (0, import_react_dom.createPortal)(content, shadowRoot) : content);
+  });
 }, "Watermark");
 var Watermark_default = Watermark;