@bleedingdev/modern-js-runtime 3.9.0-ultramodern.2 → 3.9.0-ultramodern.20

package/dist/cjs/core/server/requestHandler.js

@@ -40,26 +40,25 @@ __webpack_require__.d(__webpack_exports__, {
     createRequestHandler: ()=>createRequestHandler
 });
 const jsx_runtime_namespaceObject = require("react/jsx-runtime");
+const context_namespaceObject = require("@modern-js/runtime/context");
 const node_namespaceObject = require("@modern-js/runtime-utils/node");
 const request_namespaceObject = require("@modern-js/runtime-utils/universal/request");
 const external_react_namespaceObject = require("react");
 var external_react_default = /*#__PURE__*/ __webpack_require__.n(external_react_namespaceObject);
-const index_js_namespaceObject = require("../context/index.js");
-const runtime_js_namespaceObject = require("../context/runtime.js");
-const serverPayload_index_js_namespaceObject = require("../context/serverPayload/index.js");
+const index_js_namespaceObject = require("../context/serverPayload/index.js");
 const external_react_index_js_namespaceObject = require("../react/index.js");
 const external_constants_js_namespaceObject = require("./constants.js");
 const external_requestResponse_js_namespaceObject = require("./requestResponse.js");
 const external_routerCleanup_js_namespaceObject = require("./routerCleanup.js");
 const external_utils_js_namespaceObject = require("./utils.js");
 async function handleRSCRequest(request, Root, context, options, handleRequest) {
-    const serverPayload = (0, serverPayload_index_js_namespaceObject.getServerPayload)();
+    const serverPayload = (0, index_js_namespaceObject.getServerPayload)();
     if (void 0 !== serverPayload) return await handleRequest(request, Root, {
         ...options,
         runtimeContext: context,
         rscRoot: serverPayload
     });
-    const App = (0, index_js_namespaceObject.getGlobalRSCRoot)();
+    const App = (0, context_namespaceObject.getGlobalRSCRoot)();
     if (App) return await handleRequest(request, external_react_namespaceObject.Fragment, {
         ...options,
         runtimeContext: context,
@@ -151,10 +150,10 @@ const createRequestHandler = async (handleRequest, createRequestOptions)=>{
             serverPayload: void 0
         }, async ()=>{
             const Root = (0, external_react_index_js_namespaceObject.createRoot)();
-            const internalRuntimeContext = (0, index_js_namespaceObject.getGlobalInternalRuntimeContext)();
+            const internalRuntimeContext = (0, context_namespaceObject.getGlobalInternalRuntimeContext)();
             const hooks = internalRuntimeContext.hooks;
             const { routeManifest } = options.resource;
-            const context = (0, runtime_js_namespaceObject.getInitialContext)(false, routeManifest);
+            const context = (0, context_namespaceObject.getInitialContext)(false, routeManifest);
             const runBeforeRender = async (context)=>{
                 const result = await hooks.onBeforeRender.call(context);
                 if ("u" > typeof Response && result instanceof Response) return result;

package/dist/cjs/core/server/requestResponse.js

@@ -32,14 +32,14 @@ __webpack_require__.d(__webpack_exports__, {
     createLoaderRedirectResponse: ()=>createLoaderRedirectResponse,
     finalizeRenderResponse: ()=>finalizeRenderResponse
 });
-const lifecycle_js_namespaceObject = require("../../router/runtime/lifecycle.js");
+const router_state_namespaceObject = require("@modern-js/runtime-extensions/router-state");
 const redirect_js_namespaceObject = require("../../router/runtime/redirect.js");
 const external_tracer_js_namespaceObject = require("./tracer.js");
 const isRedirectStatus = (status)=>301 === status || 302 === status || 303 === status || 307 === status || 308 === status;
 const isNullBodyStatus = (status)=>204 === status || 205 === status || 304 === status;
 const getRedirectLocation = (headers)=>{
     const location = headers.get('Location');
-    return location && URL.canParse(location, 'http://localhost') ? location : void 0;
+    return null !== location && '' !== location && URL.canParse(location, 'http://localhost') ? location : void 0;
 };
 const processRedirect = (headers, status, ctx)=>{
     headers.delete('content-length');
@@ -51,7 +51,7 @@ const processRedirect = (headers, status, ctx)=>{
     });
 };
 const applyRouterSnapshotResult = (context, onError)=>{
-    const routerServerSnapshot = (0, lifecycle_js_namespaceObject.getRouterServerSnapshot)(context);
+    const routerServerSnapshot = (0, router_state_namespaceObject.getRouterServerSnapshot)(context);
     const routerStatusCode = routerServerSnapshot?.statusCode ?? context.routerContext?.statusCode;
     if (void 0 !== routerStatusCode && 0 !== routerStatusCode && !Number.isNaN(routerStatusCode) && 200 !== routerStatusCode) context.ssrContext?.response.status(routerStatusCode);
     const errors = Object.values(routerServerSnapshot?.errors || context.routerContext?.errors || {});
@@ -61,7 +61,7 @@ const createLoaderRedirectResponse = (beforeRenderResult, redirectCtx)=>{
     if (void 0 === beforeRenderResult || !isRedirectStatus(beforeRenderResult.status)) return;
     if (beforeRenderResult.headers.has('X-Modernjs-Redirect')) return beforeRenderResult;
     const redirectUrl = getRedirectLocation(beforeRenderResult.headers);
-    if (!redirectUrl) return;
+    if (void 0 === redirectUrl) return;
     return processRedirect(new Headers(beforeRenderResult.headers), beforeRenderResult.status, redirectCtx);
 };
 const finalizeRenderResponse = async (response, responseProxy, redirectCtx, routerCleanup)=>{

package/dist/cjs/core/server/routerCleanup.js

@@ -33,7 +33,7 @@ __webpack_require__.d(__webpack_exports__, {
     finishWithRouterCleanup: ()=>finishWithRouterCleanup,
     runWithRouterCleanupOnError: ()=>runWithRouterCleanupOnError
 });
-const lifecycle_js_namespaceObject = require("../../router/runtime/lifecycle.js");
+const router_state_namespaceObject = require("@modern-js/runtime-extensions/router-state");
 const ROUTER_CLEANUP_ERROR = 'An error occurs during router runtime cleanup';
 async function runWithRouterCleanupOnError(routerCleanup, callback) {
     try {
@@ -57,7 +57,7 @@ function createRouterCleanup(runtimeContext, onError) {
         if (finished) return;
         finished = true;
         try {
-            await (0, lifecycle_js_namespaceObject.getRouterRuntimeState)(runtimeContext)?.cleanup?.();
+            await (0, router_state_namespaceObject.getRouterRuntimeState)(runtimeContext)?.cleanup?.();
         } catch (error) {
             onError(error, ROUTER_CLEANUP_ERROR);
         }

package/dist/cjs/core/server/shared.js

@@ -27,15 +27,182 @@ var __webpack_require__ = {};
 })();
 var __webpack_exports__ = {};
 __webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    buildHtml: ()=>buildHtml,
+    createSSRRenderLifecycle: ()=>createSSRRenderLifecycle,
+    createSSRStreamErrorReporter: ()=>createSSRStreamErrorReporter,
+    observeSSRStream: ()=>observeSSRStream,
+    orderSSRStreamTransforms: ()=>orderSSRStreamTransforms,
+    replaceSSRTemplateChunk: ()=>replaceSSRTemplateChunk
+});
+const external_utils_js_namespaceObject = require("./utils.js");
 function buildHtml(template, callbacks) {
     return callbacks.reduce((promise, buildHtmlCb)=>promise.then((template)=>buildHtmlCb(template)), Promise.resolve(template));
 }
-__webpack_require__.d(__webpack_exports__, {
-    buildHtml: ()=>buildHtml
-});
+function createSSRRenderLifecycle(observers) {
+    let terminal;
+    return {
+        transformAssets (groups, info) {
+            let assets = groups.flatMap((group)=>group.assets);
+            for (const observer of observers)assets = observer.transformAssets?.(assets, {
+                ...info,
+                groups
+            }) ?? assets;
+            return assets;
+        },
+        transformTemplateChunk (chunk) {
+            for (const observer of observers)chunk = observer.transformTemplateChunk?.(chunk, {
+                attributesToString: external_utils_js_namespaceObject.attributesToString,
+                hasStylesheetLink: external_utils_js_namespaceObject.hasStylesheetLink
+            }) ?? chunk;
+            return chunk;
+        },
+        getRouterData () {
+            let data;
+            for (const observer of observers)data = observer.getRouterData?.() ?? data;
+            return data;
+        },
+        get terminal () {
+            return terminal;
+        },
+        beforeReact () {
+            for (const observer of observers)observer.beforeReact?.();
+        },
+        completedBody (html, phase) {
+            for (const observer of observers)html = observer.completedBody?.(html, {
+                phase
+            }) ?? html;
+            return html;
+        },
+        finish (result) {
+            if (void 0 !== terminal) return;
+            terminal = result;
+            for (const observer of observers)try {
+                observer.onTerminal?.(result);
+            } catch  {}
+        }
+    };
+}
+function replaceSSRTemplateChunk(chunk, lifecycle, options = {}) {
+    const result = lifecycle?.transformTemplateChunk(chunk) ?? chunk;
+    if (true === options.preserveEmpty && '' === result.content) return result.template;
+    return (0, external_utils_js_namespaceObject.safeReplace)(result.template, result.placeholder, result.content);
+}
+function orderSSRStreamTransforms(extenders) {
+    return [
+        ...extenders.filter((extender)=>'body' !== extender.streamPhase),
+        ...extenders.filter((extender)=>'body' === extender.streamPhase)
+    ];
+}
+function createSSRStreamErrorReporter(onError) {
+    let reported = false;
+    return (error)=>{
+        if (reported) return;
+        reported = true;
+        try {
+            onError(error);
+        } catch  {}
+    };
+}
+function observeSSRStream(source, options) {
+    const reader = source.getReader();
+    let controller;
+    let ended = false;
+    let cancellation;
+    const cleanup = ()=>{
+        options.signal.removeEventListener('abort', onAbort);
+        reader.releaseLock();
+    };
+    const cancel = (reason)=>{
+        if (void 0 !== cancellation) return cancellation;
+        if (ended) return Promise.resolve();
+        ended = true;
+        options.lifecycle.finish({
+            status: 'cancelled',
+            reason
+        });
+        cancellation = (async ()=>{
+            try {
+                const observer = Promise.withResolvers();
+                try {
+                    observer.resolve(options.onCancel?.(reason));
+                } catch (error) {
+                    observer.reject(error);
+                }
+                const results = await Promise.allSettled([
+                    observer.promise,
+                    reader.cancel(reason)
+                ]);
+                const rejected = results.find((result)=>'rejected' === result.status);
+                if (rejected?.status === 'rejected') throw rejected.reason;
+            } finally{
+                cleanup();
+            }
+        })();
+        return cancellation;
+    };
+    const onAbort = ()=>{
+        if (ended) return;
+        const reason = options.signal.reason;
+        cancel(reason).then(()=>controller.error(reason), (error)=>{
+            controller.error(reason);
+            return options.onError(error);
+        });
+    };
+    return new ReadableStream({
+        start (value) {
+            controller = value;
+            options.signal.addEventListener('abort', onAbort, {
+                once: true
+            });
+            if (options.signal.aborted) onAbort();
+        },
+        async pull (value) {
+            if (ended) return void await cancellation;
+            try {
+                const result = await reader.read();
+                if (ended) return void await cancellation;
+                if (result.done) {
+                    await options.onComplete?.();
+                    if (ended) return void await cancellation;
+                    ended = true;
+                    options.lifecycle.finish({
+                        status: 'complete'
+                    });
+                    cleanup();
+                    value.close();
+                } else value.enqueue(result.value);
+            } catch (error) {
+                if (ended) return void await cancellation;
+                ended = true;
+                options.lifecycle.finish({
+                    status: 'error',
+                    error
+                });
+                try {
+                    await options.onError(error);
+                } finally{
+                    cleanup();
+                    value.error(error);
+                }
+            }
+        },
+        cancel
+    });
+}
 exports.buildHtml = __webpack_exports__.buildHtml;
+exports.createSSRRenderLifecycle = __webpack_exports__.createSSRRenderLifecycle;
+exports.createSSRStreamErrorReporter = __webpack_exports__.createSSRStreamErrorReporter;
+exports.observeSSRStream = __webpack_exports__.observeSSRStream;
+exports.orderSSRStreamTransforms = __webpack_exports__.orderSSRStreamTransforms;
+exports.replaceSSRTemplateChunk = __webpack_exports__.replaceSSRTemplateChunk;
 for(var __rspack_i in __webpack_exports__)if (-1 === [
-    "buildHtml"
+    "buildHtml",
+    "createSSRRenderLifecycle",
+    "createSSRStreamErrorReporter",
+    "observeSSRStream",
+    "orderSSRStreamTransforms",
+    "replaceSSRTemplateChunk"
 ].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
 Object.defineProperty(exports, '__esModule', {
     value: true

package/dist/cjs/core/server/stream/afterTemplate.js

@@ -31,14 +31,12 @@ __webpack_require__.d(__webpack_exports__, {
     buildShellAfterTemplate: ()=>buildShellAfterTemplate
 });
 const node_namespaceObject = require("@modern-js/runtime-utils/node");
-const lifecycle_js_namespaceObject = require("../../../router/runtime/lifecycle.js");
 const external_constants_js_namespaceObject = require("../../constants.js");
 const external_constants_js_namespaceObject_1 = require("../constants.js");
-const external_scriptOrder_js_namespaceObject = require("../scriptOrder.js");
 const external_shared_js_namespaceObject = require("../shared.js");
 const external_utils_js_namespaceObject = require("../utils.js");
 function buildShellAfterTemplate(afterAppTemplate, options) {
-    const { request, config, ssrConfig, runtimeContext, renderLevel, entryName } = options;
+    const { request, config, ssrConfig, runtimeContext, renderLevel, entryName, lifecycle } = options;
     const callbacks = [
         (template)=>injectJs(template, entryName, config.nonce),
         createReplaceSSRData({
@@ -48,21 +46,28 @@ function buildShellAfterTemplate(afterAppTemplate, options) {
             useJsonScript: config.useJsonScript,
             runtimeContext,
             renderLevel,
-            entryName
+            lifecycle
         })
     ];
     async function injectJs(template, entryName, nonce) {
-        const jsChunkStr = (0, external_scriptOrder_js_namespaceObject.createRouteHydrationScriptTags)(runtimeContext, entryName, {
-            nonce,
-            template
+        const assets = runtimeContext.routeManifest?.routeAssets?.[`async-${entryName}`]?.assets ?? [];
+        const jsChunkStr = assets.filter((asset)=>asset.endsWith('.js')).map((asset)=>`<script${(0, external_utils_js_namespaceObject.attributesToString)({
+                src: asset,
+                nonce
+            })}></script>`).join(' ');
+        return (0, external_shared_js_namespaceObject.replaceSSRTemplateChunk)({
+            name: "scripts",
+            template,
+            placeholder: external_constants_js_namespaceObject_1.CHUNK_JS_PLACEHOLDER,
+            content: jsChunkStr
+        }, lifecycle, {
+            preserveEmpty: true
         });
-        if (!jsChunkStr) return template;
-        return (0, external_scriptOrder_js_namespaceObject.replaceChunkJsPlaceholder)(template, jsChunkStr, entryName);
     }
     return (0, external_shared_js_namespaceObject.buildHtml)(afterAppTemplate, callbacks);
 }
 function createReplaceSSRData(options) {
-    const { runtimeContext, nonce, renderLevel, useJsonScript, ssrConfig, entryName } = options;
+    const { runtimeContext, nonce, renderLevel, useJsonScript, ssrConfig, lifecycle } = options;
     const { request, reporter } = runtimeContext.ssrContext;
     const headers = 'object' == typeof ssrConfig && ssrConfig.unsafeHeaders ? Object.fromEntries(Object.entries(request.headers).filter(([key, _])=>ssrConfig.unsafeHeaders?.map((header)=>header.toLowerCase())?.includes(key.toLowerCase()))) : void 0;
     const ssrData = {
@@ -91,12 +96,12 @@ function createReplaceSSRData(options) {
     });
     const serializeSSRData = (0, node_namespaceObject.serializeJson)(ssrData);
     const ssrDataScript = useJsonScript ? `<script type="application/json" id="${external_constants_js_namespaceObject.SSR_DATA_JSON_ID}">${serializeSSRData}</script>` : `<script${attrsStr}>window._SSR_DATA = ${serializeSSRData}</script>`;
-    const hydrationScripts = (0, lifecycle_js_namespaceObject.getRouterHydrationScripts)(runtimeContext);
-    const ssrScripts = hydrationScripts.length ? `${ssrDataScript}\n${hydrationScripts.join('\n')}` : ssrDataScript;
-    return (template)=>{
-        if (!template.includes(external_constants_js_namespaceObject_1.SSR_DATA_PLACEHOLDER)) return template;
-        return (0, external_scriptOrder_js_namespaceObject.replaceChunkJsPlaceholder)(template, ssrScripts, entryName, external_constants_js_namespaceObject_1.SSR_DATA_PLACEHOLDER);
-    };
+    return (template)=>(0, external_shared_js_namespaceObject.replaceSSRTemplateChunk)({
+            name: 'data',
+            template,
+            placeholder: external_constants_js_namespaceObject_1.SSR_DATA_PLACEHOLDER,
+            content: ssrDataScript
+        }, lifecycle);
 }
 exports.buildShellAfterTemplate = __webpack_exports__.buildShellAfterTemplate;
 for(var __rspack_i in __webpack_exports__)if (-1 === [

package/dist/cjs/core/server/stream/beforeTemplate.js

@@ -31,9 +31,7 @@ __webpack_require__.d(__webpack_exports__, {
     buildShellBeforeTemplate: ()=>buildShellBeforeTemplate
 });
 const router_namespaceObject = require("@modern-js/runtime-utils/router");
-const lifecycle_js_namespaceObject = require("../../../router/runtime/lifecycle.js");
 const external_constants_js_namespaceObject = require("../constants.js");
-const external_federatedCss_js_namespaceObject = require("../federatedCss.js");
 const external_helmet_js_namespaceObject = require("../helmet.js");
 const external_shared_js_namespaceObject = require("../shared.js");
 const external_utils_js_namespaceObject = require("../utils.js");
@@ -45,12 +43,11 @@ const readAsset = async (chunk)=>{
 };
 const checkIsInline = (chunk, enableInline)=>{
     if ('production' !== process.env.NODE_ENV) return false;
-    if (enableInline instanceof RegExp) return enableInline.test(chunk);
-    return Boolean(enableInline);
+    else if (enableInline instanceof RegExp) return enableInline.test(chunk);
+    else return Boolean(enableInline);
 };
 async function buildShellBeforeTemplate(beforeAppTemplate, options) {
-    const { config, runtimeContext, styledComponentsStyleTags, entryName, moduleFederationCssAssets } = options;
-    const helmetData = (0, external_helmet_js_namespaceObject.getHelmetData)(runtimeContext);
+    const { config, runtimeContext, styledComponentsStyleTags, entryName, lifecycle, helmetData } = options;
     const callbacks = [
         (0, external_helmet_js_namespaceObject.createReplaceHelemt)(helmetData),
         (template)=>injectCss(template, entryName, styledComponentsStyleTags)
@@ -59,41 +56,53 @@ async function buildShellBeforeTemplate(beforeAppTemplate, options) {
     async function injectCss(template, entryName, styledComponentsStyleTags) {
         let css = await getCssChunks();
         if (styledComponentsStyleTags) css += styledComponentsStyleTags;
-        css += (0, external_federatedCss_js_namespaceObject.createFederatedCssLinks)(moduleFederationCssAssets, {
+        return (0, external_shared_js_namespaceObject.replaceSSRTemplateChunk)({
+            name: 'styles',
             template,
-            existingAssets: css.match(/href="([^"]+)"/g)?.map((item)=>item.replace(/^href="/, '').replace(/"$/, ''))
-        });
-        return (0, external_utils_js_namespaceObject.safeReplace)(template, external_constants_js_namespaceObject.CHUNK_CSS_PLACEHOLDER, css);
+            placeholder: external_constants_js_namespaceObject.CHUNK_CSS_PLACEHOLDER,
+            content: css,
+            emittedAssets: css.match(/href="([^"]+)"/g)?.map((item)=>item.replace(/^href="/, '').replace(/"$/, ''))
+        }, lifecycle);
         async function getCssChunks() {
             const { routeManifest, routerContext, routes } = runtimeContext;
             const routeAssets = routeManifest?.routeAssets;
             if (!routeAssets) return '';
             let matchedRouteManifests = [];
-            const matchedRouteIds = (0, lifecycle_js_namespaceObject.getRouterMatchedRouteIds)(runtimeContext);
-            if (matchedRouteIds?.length) matchedRouteManifests = matchedRouteIds.map((routeId)=>routeAssets[routeId]).filter(Boolean);
-            else if (routerContext && routes) {
+            if (routerContext && routes) {
                 const matches = (0, router_namespaceObject.matchRoutes)(routes, routerContext.location, routerContext.basename);
-                matchedRouteManifests = matches?.map((match, index)=>{
-                    if (!index) return;
+                matchedRouteManifests = matches?.flatMap((match, index)=>{
                     const routeId = match.route.id;
-                    if (routeId) return routeAssets[routeId];
-                }).filter((routeManifest)=>void 0 !== routeManifest) ?? [];
+                    const manifest = 0 !== index && routeId ? routeAssets[routeId] : void 0;
+                    return void 0 === manifest ? [] : [
+                        manifest
+                    ];
+                }) ?? [];
             }
-            const asyncEntry = routeAssets[`async-${entryName}`];
-            if (asyncEntry) matchedRouteManifests.push(asyncEntry);
-            const cssChunks = matchedRouteManifests.reduce((chunks, routeManifest)=>{
-                const { referenceCssAssets = [] } = routeManifest;
-                const _cssChunks = referenceCssAssets.filter((asset)=>asset?.endsWith('.css') && !(0, external_utils_js_namespaceObject.hasStylesheetLink)(template, asset));
-                return [
-                    ...chunks,
-                    ..._cssChunks
-                ];
-            }, []);
+            const createAsset = (url)=>({
+                    url
+                });
+            const groups = [
+                {
+                    name: 'route',
+                    assets: matchedRouteManifests.flatMap((manifest)=>manifest.referenceCssAssets ?? []).map(createAsset)
+                },
+                {
+                    name: 'async-entry',
+                    assets: (routeAssets[`async-${entryName}`]?.referenceCssAssets ?? []).map(createAsset)
+                }
+            ];
+            const assets = lifecycle?.transformAssets(groups, {
+                kind: 'style',
+                source: 'template',
+                template,
+                createAsset
+            }) ?? groups.flatMap((group)=>group.assets);
+            const cssChunks = assets.map((asset)=>asset.url).filter((asset)=>asset.endsWith('.css') && !(0, external_utils_js_namespaceObject.hasStylesheetLink)(template, asset));
             const { inlineStyles } = config;
             const styles = await Promise.all(cssChunks.map(async (chunk)=>{
                 const link = `<link href="${chunk}" rel="stylesheet" />`;
                 if ((0, external_utils_js_namespaceObject.checkIsNode)() && checkIsInline(chunk, inlineStyles)) return readAsset(chunk).then((content)=>`<style>${content}</style>`).catch((_)=>link);
-                return link;
+                else return link;
             }));
             return `${styles.join('')}`;
         }

package/dist/cjs/core/server/stream/beforeTemplate.worker.js

@@ -30,20 +30,17 @@ __webpack_require__.r(__webpack_exports__);
 __webpack_require__.d(__webpack_exports__, {
     buildShellBeforeTemplate: ()=>buildShellBeforeTemplate
 });
-const lifecycle_js_namespaceObject = require("../../../router/runtime/lifecycle.js");
 const external_constants_js_namespaceObject = require("../constants.js");
-const external_federatedCss_js_namespaceObject = require("../federatedCss.js");
 const external_helmet_js_namespaceObject = require("../helmet.js");
 const external_shared_js_namespaceObject = require("../shared.js");
 const external_utils_js_namespaceObject = require("../utils.js");
 const checkIsInline = (chunk, enableInline)=>{
     if ('production' !== process.env.NODE_ENV) return false;
-    if (enableInline instanceof RegExp) return enableInline.test(chunk);
-    return Boolean(enableInline);
+    else if (enableInline instanceof RegExp) return enableInline.test(chunk);
+    else return Boolean(enableInline);
 };
 async function buildShellBeforeTemplate(beforeAppTemplate, options) {
-    const { config, runtimeContext, styledComponentsStyleTags, entryName, moduleFederationCssAssets } = options;
-    const helmetData = (0, external_helmet_js_namespaceObject.getHelmetData)(runtimeContext);
+    const { config, runtimeContext, styledComponentsStyleTags, entryName, lifecycle, helmetData } = options;
     const callbacks = [
         (0, external_helmet_js_namespaceObject.createReplaceHelemt)(helmetData),
         (template)=>injectCss(template, entryName, styledComponentsStyleTags)
@@ -52,28 +49,38 @@ async function buildShellBeforeTemplate(beforeAppTemplate, options) {
     async function injectCss(template, entryName, styledComponentsStyleTags) {
         let css = await getCssChunks();
         if (styledComponentsStyleTags) css += styledComponentsStyleTags;
-        css += (0, external_federatedCss_js_namespaceObject.createFederatedCssLinks)(moduleFederationCssAssets, {
+        return (0, external_shared_js_namespaceObject.replaceSSRTemplateChunk)({
+            name: 'styles',
             template,
-            existingAssets: css.match(/href="([^"]+)"/g)?.map((item)=>item.replace(/^href="/, '').replace(/"$/, ''))
-        });
-        return (0, external_utils_js_namespaceObject.safeReplace)(template, external_constants_js_namespaceObject.CHUNK_CSS_PLACEHOLDER, css);
+            placeholder: external_constants_js_namespaceObject.CHUNK_CSS_PLACEHOLDER,
+            content: css,
+            emittedAssets: css.match(/href="([^"]+)"/g)?.map((item)=>item.replace(/^href="/, '').replace(/"$/, ''))
+        }, lifecycle);
         async function getCssChunks() {
             const { routeManifest } = runtimeContext;
             const routeAssets = routeManifest?.routeAssets;
             if (!routeAssets) return '';
-            let matchedRouteManifests = [];
-            const matchedRouteIds = (0, lifecycle_js_namespaceObject.getRouterMatchedRouteIds)(runtimeContext);
-            if (matchedRouteIds?.length) matchedRouteManifests = matchedRouteIds.map((routeId)=>routeAssets[routeId]).filter(Boolean);
-            const asyncEntry = routeAssets[`async-${entryName}`];
-            if (asyncEntry) matchedRouteManifests.push(asyncEntry);
-            const cssChunks = matchedRouteManifests.reduce((chunks, routeManifest)=>{
-                const { referenceCssAssets = [] } = routeManifest;
-                const _cssChunks = referenceCssAssets.filter((asset)=>asset?.endsWith('.css') && !(0, external_utils_js_namespaceObject.hasStylesheetLink)(template, asset));
-                return [
-                    ...chunks,
-                    ..._cssChunks
-                ];
-            }, []);
+            const matchedRouteManifests = [];
+            const createAsset = (url)=>({
+                    url
+                });
+            const groups = [
+                {
+                    name: 'route',
+                    assets: matchedRouteManifests.flatMap((manifest)=>manifest.referenceCssAssets ?? []).map(createAsset)
+                },
+                {
+                    name: 'async-entry',
+                    assets: (routeAssets[`async-${entryName}`]?.referenceCssAssets ?? []).map(createAsset)
+                }
+            ];
+            const assets = lifecycle?.transformAssets(groups, {
+                kind: 'style',
+                source: 'template',
+                template,
+                createAsset
+            }) ?? groups.flatMap((group)=>group.assets);
+            const cssChunks = assets.map((asset)=>asset.url).filter((asset)=>asset.endsWith('.css') && !(0, external_utils_js_namespaceObject.hasStylesheetLink)(template, asset));
             const { inlineStyles } = config;
             const styles = cssChunks.map((chunk)=>{
                 const link = `<link href="${chunk}" rel="stylesheet" />`;