@module-federation/bridge-react 0.0.0-perf-devtools-20260108034446 → 0.0.0-perf-website-code-usage-20260914033703

package/dist/lazy/types.d.ts

@@ -0,0 +1,60 @@
+import { MF_DATA_FETCH_TYPE, MF_DATA_FETCH_STATUS } from './constant';
+import type { SizeLimitedCache } from '../shared/size-limited-cache';
+export type dataFetchFunctionOptions = [
+    id?: string,
+    data?: unknown,
+    downgrade?: boolean
+];
+declare global {
+    var _mfSSRDowngrade: string[] | true | undefined;
+    var __MF_DATA_FETCH_MAP__: MF_DATA_FETCH_MAP | undefined;
+    var FEDERATION_SERVER_QUERY: Record<string, unknown> | undefined;
+    var FEDERATION_SSR: boolean | undefined;
+    var _mfFSHref: string | undefined;
+    var _mfDataFetch: Array<dataFetchFunctionOptions> | undefined;
+    var __MF_DATA_FETCH_CACHE__: MF_DATA_FETCH_CACHE | undefined;
+}
+export interface CacheItem<T> {
+    data: T;
+    timestamp: number;
+    isRevalidating?: boolean;
+}
+export type DataFetchParams = {
+    isDowngrade: boolean;
+    _id?: string;
+} & Record<string, unknown>;
+export type DataFetch<T> = (params: DataFetchParams) => Promise<T>;
+export type MF_DATA_FETCH_MAP_VALUE_PROMISE_SET = [
+    Promise<unknown>,
+    ((data: unknown) => void)?,
+    ((err: unknown) => void)?
+];
+export type MF_DATA_FETCH_MAP_VALUE = [
+    [
+        () => Promise<DataFetch<unknown>>,
+        MF_DATA_FETCH_TYPE,
+        Promise<DataFetch<unknown>>?
+    ],
+    MF_DATA_FETCH_MAP_VALUE_PROMISE_SET?,
+    MF_DATA_FETCH_STATUS?
+];
+export type MF_DATA_FETCH_MAP = Record<string, MF_DATA_FETCH_MAP_VALUE>;
+export type MF_SSR_DOWNGRADE = string[] | true | undefined;
+export type NoSSRRemoteInfo = {
+    name: string;
+    version: string;
+    ssrPublicPath: string;
+    ssrRemoteEntry: string;
+    globalName: string;
+};
+export interface CacheConfig {
+    maxSize?: number;
+    unstable_shouldDisable?: ({ request, }: {
+        request: Request;
+    }) => boolean | Promise<boolean>;
+}
+export type MF_DATA_FETCH_CACHE = {
+    cacheStore?: SizeLimitedCache<string, Map<string, CacheItem<any>>>;
+    tagKeyMap?: Map<string, Set<string>>;
+    cacheConfig?: CacheConfig;
+};

package/dist/lazy/utils.d.ts

@@ -0,0 +1,48 @@
+import type { GlobalModuleInfo } from '@module-federation/sdk';
+import type { DataFetchParams, MF_DATA_FETCH_MAP, NoSSRRemoteInfo, MF_SSR_DOWNGRADE, MF_DATA_FETCH_CACHE } from './types';
+import type { ModuleFederation } from '@module-federation/runtime';
+export declare const getDataFetchInfo: ({ name, alias, id, remoteSnapshot, }: {
+    id: string;
+    name: string;
+    remoteSnapshot: GlobalModuleInfo[string];
+    alias?: string;
+}) => {
+    dataFetchName: string;
+    dataFetchId: string;
+    dataFetchKey: string;
+} | undefined;
+export declare function initDataFetchMap(): void;
+export declare function getDataFetchItem(id: string): import("./types").MF_DATA_FETCH_MAP_VALUE;
+export declare function getDataFetchMap(): MF_DATA_FETCH_MAP;
+export declare function getDataFetchCache(): MF_DATA_FETCH_CACHE;
+export declare const flushDataFetch: () => void;
+export declare function setDataFetchItemLoadedStatus(id: string): void;
+export declare const wrapDataFetchId: (id?: string) => string;
+export declare const getDataFetchIdWithErrorMsgs: (errMsgs: string) => string | undefined;
+export declare function fetchData(id: string, params: DataFetchParams, remoteInfo?: NoSSRRemoteInfo): Promise<unknown | undefined>;
+export declare function getDataFetchMapKey(dataFetchInfo?: ReturnType<typeof getDataFetchInfo>, hostInfo?: {
+    name: string;
+    version?: string;
+}): string | undefined;
+export declare function loadDataFetchModule(instance: ModuleFederation, id: string): Promise<(params: DataFetchParams) => Promise<unknown>>;
+export declare function isDataLoaderExpose(exposeKey: string): boolean;
+export declare function getDowngradeTag(): MF_SSR_DOWNGRADE;
+export declare function callAllDowngrade(): void;
+export declare function callDowngrade(id: string, params?: DataFetchParams, remoteInfo?: NoSSRRemoteInfo): Promise<unknown>;
+export declare function isCSROnly(): boolean;
+export declare function isServerEnv(): boolean;
+export declare function setSSREnv({ fetchServerQuery, }: {
+    fetchServerQuery?: Record<string, unknown>;
+}): void;
+export declare function getLoadedRemoteInfos(id: string, instance: ModuleFederation | null): {
+    alias?: string;
+    name: string;
+    version?: string;
+    buildVersion?: string;
+    entry: string;
+    type: import("@module-federation/sdk").RemoteEntryType;
+    entryGlobalName: string;
+    shareScope: string | string[];
+    snapshot: import("@module-federation/sdk").ManifestProvider | import("@module-federation/sdk").PureEntryProvider | import("@module-federation/sdk").ModuleInfo | undefined;
+    expose: string;
+} | undefined;

package/dist/lazy/wrapNoSSR.d.ts

@@ -0,0 +1,9 @@
+import { createLazyComponent } from './createLazyComponent';
+import type { CreateLazyComponentOptions } from './createLazyComponent';
+export declare function wrapNoSSR<T, E extends keyof T>(createLazyComponentFn: typeof createLazyComponent<T, E>): (options: Omit<CreateLazyComponentOptions<T, E>, 'noSSR'>) => (props: T[E] extends (...args: any) => any ? Parameters<T[E]>[0] extends undefined ? {
+    key?: React.Key | null;
+} : Parameters<T[E]>[0] & {
+    key?: React.Key | null;
+} : {
+    key?: React.Key | null;
+}) => import("node_modules/@types/react").JSX.Element;

package/dist/{lazy-load-component-plugin-BvnyaA6i.js → lazy-load-component-plugin-DSURjnZ0.js}

@@ -1,6 +1,6 @@
 "use strict";
-const prefetch = require("./prefetch-MiXeF8KH.js");
-const lazyUtils = require("./utils-tM9yE73c.js");
+const prefetch = require("./prefetch-Bxf6DSx_.js");
+const lazyUtils = require("./utils-5dGErM3C.js");
 const React = require("react");
 const autoFetchData = () => {
   lazyUtils.initDataFetchMap();
@@ -70,6 +70,142 @@ const autoFetchData = () => {
     }
   };
 };
+const EMPTY_HREFS = /* @__PURE__ */ new Set();
+const stylesheetStores = /* @__PURE__ */ new WeakMap();
+function isActiveStylesheet(link) {
+  const rel = link.rel.toLowerCase().split(/\s+/u);
+  const media = link.media.trim().toLowerCase();
+  const type = link.type.trim().toLowerCase().split(";", 1)[0].trim();
+  return rel.includes("stylesheet") && !rel.includes("alternate") && !link.disabled && !link.hasAttribute("disabled") && (!media || media === "all") && (!type || type === "text/css");
+}
+function collectHeadStylesheetHrefs(document) {
+  var _a;
+  const hrefs = /* @__PURE__ */ new Set();
+  (_a = document.head) == null ? void 0 : _a.querySelectorAll("link[href]").forEach((link) => {
+    if (isActiveStylesheet(link)) {
+      hrefs.add(link.href);
+    }
+  });
+  return hrefs;
+}
+function haveSameHrefs(current, next) {
+  if (current.size !== next.size) {
+    return false;
+  }
+  for (const href of current) {
+    if (!next.has(href)) {
+      return false;
+    }
+  }
+  return true;
+}
+function observeHead(store) {
+  store.observer.disconnect();
+  const { document, head, observer } = store;
+  if (head) {
+    observer.observe(head, {
+      attributes: true,
+      attributeFilter: ["disabled", "href", "media", "rel", "type"],
+      childList: true,
+      subtree: true
+    });
+  }
+  if (document.documentElement) {
+    observer.observe(document.documentElement, { childList: true });
+  }
+}
+function refreshHeadStylesheets(store) {
+  if (!store.subscribers.size) {
+    return;
+  }
+  const head = store.document.head;
+  if (head !== store.head) {
+    store.head = head;
+    observeHead(store);
+  }
+  const hrefs = collectHeadStylesheetHrefs(store.document);
+  if (haveSameHrefs(store.hrefs, hrefs)) {
+    return;
+  }
+  store.hrefs = hrefs;
+  store.subscribers.forEach((subscriber) => subscriber(hrefs));
+}
+function getStylesheetStore(document) {
+  var _a;
+  const current = stylesheetStores.get(document);
+  if (current) {
+    return current;
+  }
+  const MutationObserver = ((_a = document.defaultView) == null ? void 0 : _a.MutationObserver) ?? globalThis.MutationObserver;
+  let store;
+  const observer = new MutationObserver(() => refreshHeadStylesheets(store));
+  store = {
+    document,
+    head: document.head,
+    hrefs: collectHeadStylesheetHrefs(document),
+    observer,
+    subscribers: /* @__PURE__ */ new Set()
+  };
+  observeHead(store);
+  stylesheetStores.set(document, store);
+  return store;
+}
+function subscribeToHeadStylesheets(document, subscriber) {
+  const store = getStylesheetStore(document);
+  let subscribed = true;
+  store.subscribers.add(subscriber);
+  subscriber(store.hrefs);
+  return () => {
+    if (!subscribed) {
+      return;
+    }
+    subscribed = false;
+    store.subscribers.delete(subscriber);
+    if (!store.subscribers.size) {
+      store.observer.disconnect();
+      if (stylesheetStores.get(document) === store) {
+        stylesheetStores.delete(document);
+      }
+    }
+  };
+}
+function resolveHref(href, document) {
+  try {
+    return new URL(href, document.baseURI).href;
+  } catch {
+    return href;
+  }
+}
+function HydratedStylesheetAssets({ hrefs }) {
+  const firstLinkRef = React.useRef(null);
+  const ownerDocumentRef = React.useRef(null);
+  const [headHrefs, setHeadHrefs] = React.useState(EMPTY_HREFS);
+  React.useEffect(() => {
+    var _a;
+    const link = firstLinkRef.current;
+    if (!link) {
+      return;
+    }
+    const ownerDocument = link.ownerDocument;
+    ownerDocumentRef.current = ownerDocument;
+    if (link.getRootNode() !== ownerDocument || ((_a = ownerDocument.head) == null ? void 0 : _a.contains(link))) {
+      return;
+    }
+    return subscribeToHeadStylesheets(ownerDocument, setHeadHrefs);
+  }, []);
+  return /* @__PURE__ */ React.createElement(React.Fragment, null, hrefs.map(
+    (href, index) => ownerDocumentRef.current && headHrefs.has(resolveHref(href, ownerDocumentRef.current)) ? null : /* @__PURE__ */ React.createElement(
+      "link",
+      {
+        key: href,
+        ref: index === 0 ? firstLinkRef : void 0,
+        href,
+        rel: "stylesheet",
+        type: "text/css"
+      }
+    )
+  ));
+}
 function isPromise(obj) {
   return !!obj && (typeof obj === "object" || typeof obj === "function") && typeof obj.then === "function";
 }
@@ -236,65 +372,51 @@ function getTargetModuleInfo(id, instance) {
     remoteEntry
   };
 }
-function collectSSRAssets(options) {
+function collectSSRAssetDescriptors(options) {
   const {
     id,
     injectLink = true,
     injectScript = false
   } = typeof options === "string" ? { id: options } : options;
-  const links = [];
-  const scripts = [];
+  const stylesheetHrefs = [];
+  const scriptSrcs = [];
   const instance = options.instance;
   if (!instance || !injectLink && !injectScript) {
-    return [...scripts, ...links];
+    return { scriptSrcs, stylesheetHrefs };
   }
   const moduleAndPublicPath = getTargetModuleInfo(id, instance);
   if (!moduleAndPublicPath) {
-    return [...scripts, ...links];
+    return { scriptSrcs, stylesheetHrefs };
   }
   const { module: targetModule, publicPath, remoteEntry } = moduleAndPublicPath;
   if (injectLink) {
-    [...targetModule.assets.css.sync, ...targetModule.assets.css.async].sort().forEach((file, index) => {
-      links.push(
-        /* @__PURE__ */ React.createElement(
-          "link",
-          {
-            key: `${file.split(".")[0]}_${index}`,
-            href: `${publicPath}${file}`,
-            rel: "stylesheet",
-            type: "text/css"
-          }
-        )
-      );
+    const seenStylesheetHrefs = /* @__PURE__ */ new Set();
+    [...targetModule.assets.css.sync, ...targetModule.assets.css.async].sort().forEach((file) => {
+      const href = `${publicPath}${file}`;
+      if (seenStylesheetHrefs.has(href)) {
+        return;
+      }
+      seenStylesheetHrefs.add(href);
+      stylesheetHrefs.push(href);
     });
   }
   if (injectScript) {
-    scripts.push(
-      /* @__PURE__ */ React.createElement(
-        "script",
-        {
-          async: true,
-          key: remoteEntry.split(".")[0],
-          src: `${publicPath}${remoteEntry}`,
-          crossOrigin: "anonymous"
-        }
-      )
-    );
-    [...targetModule.assets.js.sync].sort().forEach((file, index) => {
-      scripts.push(
-        /* @__PURE__ */ React.createElement(
-          "script",
-          {
-            key: `${file.split(".")[0]}_${index}`,
-            async: true,
-            src: `${publicPath}${file}`,
-            crossOrigin: "anonymous"
-          }
-        )
-      );
+    scriptSrcs.push(`${publicPath}${remoteEntry}`);
+    [...targetModule.assets.js.sync].sort().forEach((file) => {
+      scriptSrcs.push(`${publicPath}${file}`);
     });
   }
-  return [...scripts, ...links];
+  return { scriptSrcs, stylesheetHrefs };
+}
+function renderScriptAssets(scriptSrcs) {
+  return scriptSrcs.map((src) => /* @__PURE__ */ React.createElement("script", { key: src, async: true, src, crossOrigin: "anonymous" }));
+}
+function collectSSRAssets(options) {
+  const { scriptSrcs, stylesheetHrefs } = collectSSRAssetDescriptors(options);
+  return [
+    ...renderScriptAssets(scriptSrcs),
+    ...stylesheetHrefs.map((href) => /* @__PURE__ */ React.createElement("link", { key: href, href, rel: "stylesheet", type: "text/css" }))
+  ];
 }
 function getServerNeedRemoteInfo(loadedRemoteInfo, id, noSSR) {
   var _a;
@@ -408,12 +530,16 @@ function createLazyComponent(options) {
       { name: instance.name, version: instance == null ? void 0 : instance.options.version }
     ) : void 0;
     lazyUtils.logger.debug("LazyComponent dataFetchMapKey: ", dataFetchMapKey);
-    const assets = collectSSRAssets({
+    const { scriptSrcs, stylesheetHrefs } = collectSSRAssetDescriptors({
       id: moduleId,
       instance,
       injectLink,
       injectScript
     });
+    const assets = [
+      ...renderScriptAssets(scriptSrcs),
+      /* @__PURE__ */ React.createElement(HydratedStylesheetAssets, { key: "stylesheets", hrefs: stylesheetHrefs })
+    ];
     const Com = m[exportName];
     if (exportName in m && typeof Com === "function") {
       return {

package/dist/{lazy-load-component-plugin-CVcFMRce.mjs → lazy-load-component-plugin-NZphPG7_.mjs}

@@ -1,6 +1,6 @@
-import { i as injectDataFetch, p as prefetch } from "./prefetch-CK3EZdY4.mjs";
-import { i as initDataFetchMap, j as isDataLoaderExpose, k as getDataFetchInfo, m as getDataFetchMapKey, l as logger, n as getDataFetchItem, o as DATA_FETCH_CLIENT_SUFFIX, p as MF_DATA_FETCH_TYPE, q as isCSROnly, h as loadDataFetchModule, M as MF_DATA_FETCH_STATUS, e as getDataFetchMap, t as isServerEnv, u as getDataFetchIdWithErrorMsgs, v as DATA_FETCH_ERROR_PREFIX, E as ERROR_TYPE, w as wrapDataFetchId, L as LOAD_REMOTE_ERROR_PREFIX, x as DATA_FETCH_FUNCTION, y as getLoadedRemoteInfos, f as fetchData$1, z as setDataFetchItemLoadedStatus, F as FS_HREF } from "./utils-dUgb9Jkm.mjs";
-import React__default, { useRef, useState, Suspense, useEffect } from "react";
+import { i as injectDataFetch, p as prefetch } from "./prefetch-TKq_EK_q.mjs";
+import { i as initDataFetchMap, k as isDataLoaderExpose, m as getDataFetchInfo, n as getDataFetchMapKey, l as logger, o as getDataFetchItem, p as DATA_FETCH_CLIENT_SUFFIX, q as MF_DATA_FETCH_TYPE, t as isCSROnly, M as MF_DATA_FETCH_STATUS, j as loadDataFetchModule, e as getDataFetchMap, u as isServerEnv, v as getDataFetchIdWithErrorMsgs, w as DATA_FETCH_ERROR_PREFIX, E as ERROR_TYPE, x as wrapDataFetchId, L as LOAD_REMOTE_ERROR_PREFIX, y as DATA_FETCH_FUNCTION, z as getLoadedRemoteInfos, h as fetchData$1, A as setDataFetchItemLoadedStatus, F as FS_HREF } from "./utils-BBP3hEeV.mjs";
+import React__default, { useRef, useState, useEffect, Suspense } from "react";
 const autoFetchData = () => {
   initDataFetchMap();
   injectDataFetch();
@@ -69,6 +69,142 @@ const autoFetchData = () => {
     }
   };
 };
+const EMPTY_HREFS = /* @__PURE__ */ new Set();
+const stylesheetStores = /* @__PURE__ */ new WeakMap();
+function isActiveStylesheet(link) {
+  const rel = link.rel.toLowerCase().split(/\s+/u);
+  const media = link.media.trim().toLowerCase();
+  const type = link.type.trim().toLowerCase().split(";", 1)[0].trim();
+  return rel.includes("stylesheet") && !rel.includes("alternate") && !link.disabled && !link.hasAttribute("disabled") && (!media || media === "all") && (!type || type === "text/css");
+}
+function collectHeadStylesheetHrefs(document) {
+  var _a;
+  const hrefs = /* @__PURE__ */ new Set();
+  (_a = document.head) == null ? void 0 : _a.querySelectorAll("link[href]").forEach((link) => {
+    if (isActiveStylesheet(link)) {
+      hrefs.add(link.href);
+    }
+  });
+  return hrefs;
+}
+function haveSameHrefs(current, next) {
+  if (current.size !== next.size) {
+    return false;
+  }
+  for (const href of current) {
+    if (!next.has(href)) {
+      return false;
+    }
+  }
+  return true;
+}
+function observeHead(store) {
+  store.observer.disconnect();
+  const { document, head, observer } = store;
+  if (head) {
+    observer.observe(head, {
+      attributes: true,
+      attributeFilter: ["disabled", "href", "media", "rel", "type"],
+      childList: true,
+      subtree: true
+    });
+  }
+  if (document.documentElement) {
+    observer.observe(document.documentElement, { childList: true });
+  }
+}
+function refreshHeadStylesheets(store) {
+  if (!store.subscribers.size) {
+    return;
+  }
+  const head = store.document.head;
+  if (head !== store.head) {
+    store.head = head;
+    observeHead(store);
+  }
+  const hrefs = collectHeadStylesheetHrefs(store.document);
+  if (haveSameHrefs(store.hrefs, hrefs)) {
+    return;
+  }
+  store.hrefs = hrefs;
+  store.subscribers.forEach((subscriber) => subscriber(hrefs));
+}
+function getStylesheetStore(document) {
+  var _a;
+  const current = stylesheetStores.get(document);
+  if (current) {
+    return current;
+  }
+  const MutationObserver = ((_a = document.defaultView) == null ? void 0 : _a.MutationObserver) ?? globalThis.MutationObserver;
+  let store;
+  const observer = new MutationObserver(() => refreshHeadStylesheets(store));
+  store = {
+    document,
+    head: document.head,
+    hrefs: collectHeadStylesheetHrefs(document),
+    observer,
+    subscribers: /* @__PURE__ */ new Set()
+  };
+  observeHead(store);
+  stylesheetStores.set(document, store);
+  return store;
+}
+function subscribeToHeadStylesheets(document, subscriber) {
+  const store = getStylesheetStore(document);
+  let subscribed = true;
+  store.subscribers.add(subscriber);
+  subscriber(store.hrefs);
+  return () => {
+    if (!subscribed) {
+      return;
+    }
+    subscribed = false;
+    store.subscribers.delete(subscriber);
+    if (!store.subscribers.size) {
+      store.observer.disconnect();
+      if (stylesheetStores.get(document) === store) {
+        stylesheetStores.delete(document);
+      }
+    }
+  };
+}
+function resolveHref(href, document) {
+  try {
+    return new URL(href, document.baseURI).href;
+  } catch {
+    return href;
+  }
+}
+function HydratedStylesheetAssets({ hrefs }) {
+  const firstLinkRef = useRef(null);
+  const ownerDocumentRef = useRef(null);
+  const [headHrefs, setHeadHrefs] = useState(EMPTY_HREFS);
+  useEffect(() => {
+    var _a;
+    const link = firstLinkRef.current;
+    if (!link) {
+      return;
+    }
+    const ownerDocument = link.ownerDocument;
+    ownerDocumentRef.current = ownerDocument;
+    if (link.getRootNode() !== ownerDocument || ((_a = ownerDocument.head) == null ? void 0 : _a.contains(link))) {
+      return;
+    }
+    return subscribeToHeadStylesheets(ownerDocument, setHeadHrefs);
+  }, []);
+  return /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, hrefs.map(
+    (href, index) => ownerDocumentRef.current && headHrefs.has(resolveHref(href, ownerDocumentRef.current)) ? null : /* @__PURE__ */ React__default.createElement(
+      "link",
+      {
+        key: href,
+        ref: index === 0 ? firstLinkRef : void 0,
+        href,
+        rel: "stylesheet",
+        type: "text/css"
+      }
+    )
+  ));
+}
 function isPromise(obj) {
   return !!obj && (typeof obj === "object" || typeof obj === "function") && typeof obj.then === "function";
 }
@@ -235,65 +371,51 @@ function getTargetModuleInfo(id, instance) {
     remoteEntry
   };
 }
-function collectSSRAssets(options) {
+function collectSSRAssetDescriptors(options) {
   const {
     id,
     injectLink = true,
     injectScript = false
   } = typeof options === "string" ? { id: options } : options;
-  const links = [];
-  const scripts = [];
+  const stylesheetHrefs = [];
+  const scriptSrcs = [];
   const instance = options.instance;
   if (!instance || !injectLink && !injectScript) {
-    return [...scripts, ...links];
+    return { scriptSrcs, stylesheetHrefs };
   }
   const moduleAndPublicPath = getTargetModuleInfo(id, instance);
   if (!moduleAndPublicPath) {
-    return [...scripts, ...links];
+    return { scriptSrcs, stylesheetHrefs };
   }
   const { module: targetModule, publicPath, remoteEntry } = moduleAndPublicPath;
   if (injectLink) {
-    [...targetModule.assets.css.sync, ...targetModule.assets.css.async].sort().forEach((file, index) => {
-      links.push(
-        /* @__PURE__ */ React__default.createElement(
-          "link",
-          {
-            key: `${file.split(".")[0]}_${index}`,
-            href: `${publicPath}${file}`,
-            rel: "stylesheet",
-            type: "text/css"
-          }
-        )
-      );
+    const seenStylesheetHrefs = /* @__PURE__ */ new Set();
+    [...targetModule.assets.css.sync, ...targetModule.assets.css.async].sort().forEach((file) => {
+      const href = `${publicPath}${file}`;
+      if (seenStylesheetHrefs.has(href)) {
+        return;
+      }
+      seenStylesheetHrefs.add(href);
+      stylesheetHrefs.push(href);
     });
   }
   if (injectScript) {
-    scripts.push(
-      /* @__PURE__ */ React__default.createElement(
-        "script",
-        {
-          async: true,
-          key: remoteEntry.split(".")[0],
-          src: `${publicPath}${remoteEntry}`,
-          crossOrigin: "anonymous"
-        }
-      )
-    );
-    [...targetModule.assets.js.sync].sort().forEach((file, index) => {
-      scripts.push(
-        /* @__PURE__ */ React__default.createElement(
-          "script",
-          {
-            key: `${file.split(".")[0]}_${index}`,
-            async: true,
-            src: `${publicPath}${file}`,
-            crossOrigin: "anonymous"
-          }
-        )
-      );
+    scriptSrcs.push(`${publicPath}${remoteEntry}`);
+    [...targetModule.assets.js.sync].sort().forEach((file) => {
+      scriptSrcs.push(`${publicPath}${file}`);
     });
   }
-  return [...scripts, ...links];
+  return { scriptSrcs, stylesheetHrefs };
+}
+function renderScriptAssets(scriptSrcs) {
+  return scriptSrcs.map((src) => /* @__PURE__ */ React__default.createElement("script", { key: src, async: true, src, crossOrigin: "anonymous" }));
+}
+function collectSSRAssets(options) {
+  const { scriptSrcs, stylesheetHrefs } = collectSSRAssetDescriptors(options);
+  return [
+    ...renderScriptAssets(scriptSrcs),
+    ...stylesheetHrefs.map((href) => /* @__PURE__ */ React__default.createElement("link", { key: href, href, rel: "stylesheet", type: "text/css" }))
+  ];
 }
 function getServerNeedRemoteInfo(loadedRemoteInfo, id, noSSR) {
   var _a;
@@ -407,12 +529,16 @@ function createLazyComponent(options) {
       { name: instance.name, version: instance == null ? void 0 : instance.options.version }
     ) : void 0;
     logger.debug("LazyComponent dataFetchMapKey: ", dataFetchMapKey);
-    const assets = collectSSRAssets({
+    const { scriptSrcs, stylesheetHrefs } = collectSSRAssetDescriptors({
       id: moduleId,
       instance,
       injectLink,
       injectScript
     });
+    const assets = [
+      ...renderScriptAssets(scriptSrcs),
+      /* @__PURE__ */ React__default.createElement(HydratedStylesheetAssets, { key: "stylesheets", hrefs: stylesheetHrefs })
+    ];
     const Com = m[exportName];
     if (exportName in m && typeof Com === "function") {
       return {
@@ -515,8 +641,8 @@ function lazyLoadComponentPlugin() {
   };
 }
 export {
-  collectSSRAssets as a,
-  autoFetchData as b,
-  createLazyComponent as c,
+  autoFetchData as a,
+  createLazyComponent as b,
+  collectSSRAssets as c,
   lazyLoadComponentPlugin as l
 };

package/dist/lazy-load-component-plugin.cjs.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
-const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-BvnyaA6i.js");
-require("./prefetch-MiXeF8KH.js");
+const lazyLoadComponentPlugin = require("./lazy-load-component-plugin-DSURjnZ0.js");
+require("./prefetch-Bxf6DSx_.js");
 exports.default = lazyLoadComponentPlugin.lazyLoadComponentPlugin;
 exports.lazyLoadComponentPlugin = lazyLoadComponentPlugin.lazyLoadComponentPlugin;

package/dist/lazy-load-component-plugin.d.ts

@@ -1,16 +1,2 @@
-import { ModuleFederationRuntimePlugin } from '@module-federation/runtime';
-
-declare function lazyLoadComponentPlugin(): ModuleFederationRuntimePlugin;
-export default lazyLoadComponentPlugin;
-export { lazyLoadComponentPlugin }
-
-export { }
-
-
-declare module '@module-federation/runtime-core' {
-    interface ModuleFederation {
-        createLazyComponent<T, E extends keyof T>(options: Omit<CreateLazyComponentOptions<T, E>, 'instance'>): ReturnType<typeof createLazyComponent<T, E>>;
-        prefetch(options: Omit<PrefetchOptions, 'instance'>): ReturnType<typeof prefetch>;
-        collectSSRAssets(options: Omit<Parameters<typeof collectSSRAssets>[0], 'instance'>): ReturnType<typeof collectSSRAssets>;
-    }
-}
+export { default } from './plugins/lazy-load-component-plugin';
+export * from './plugins/lazy-load-component-plugin';