@modern-js/render 3.0.1 → 3.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/client/callServer.js +3 -5
- package/dist/cjs/client/index.js +6 -4
- package/dist/cjs/rsc-html-stream/server.js +58 -0
- package/dist/cjs/server/rsc/csr.js +54 -0
- package/dist/cjs/server/rsc/index.js +2 -2
- package/dist/cjs/server/rsc/rsc.js +43 -26
- package/dist/cjs/server/ssr/ssr.js +36 -13
- package/dist/esm/client/callServer.js +3 -5
- package/dist/esm/client/index.js +4 -3
- package/dist/esm/rsc-html-stream/server.js +57 -0
- package/dist/esm/server/rsc/csr.js +30 -0
- package/dist/esm/server/rsc/index.js +1 -1
- package/dist/esm/server/rsc/rsc.js +43 -26
- package/dist/esm/server/ssr/ssr.js +37 -14
- package/dist/esm-node/client/callServer.mjs +3 -5
- package/dist/esm-node/client/index.mjs +4 -3
- package/dist/esm-node/rsc-html-stream/server.mjs +57 -0
- package/dist/esm-node/server/rsc/csr.mjs +30 -0
- package/dist/esm-node/server/rsc/index.mjs +1 -1
- package/dist/esm-node/server/rsc/rsc.mjs +43 -26
- package/dist/esm-node/server/ssr/ssr.mjs +37 -14
- package/dist/types/client/callServer.d.ts +2 -1
- package/dist/types/client/index.d.ts +3 -2
- package/dist/types/rsc-html-stream/server.d.ts +6 -0
- package/dist/types/server/rsc/csr.d.ts +5 -0
- package/dist/types/server/rsc/index.d.ts +1 -1
- package/dist/types/server/rsc/rsc.d.ts +5 -10
- package/dist/types/server/ssr/ssr.d.ts +1 -3
- package/package.json +10 -10
- package/dist/cjs/server/rsc/processRSCStream.js +0 -64
- package/dist/esm/server/rsc/processRSCStream.js +0 -40
- package/dist/esm-node/server/rsc/processRSCStream.mjs +0 -40
- package/dist/types/server/rsc/processRSCStream.d.ts +0 -1
|
@@ -1,6 +1,17 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { renderToReadableStream } from "react-dom/server.edge";
|
|
3
3
|
import { ServerElementsProvider } from "../../client/index";
|
|
4
|
+
function CSSLinks({ cssFiles }) {
|
|
5
|
+
if (cssFiles.length === 0) {
|
|
6
|
+
return null;
|
|
7
|
+
}
|
|
8
|
+
return /* @__PURE__ */ _jsx(_Fragment, {
|
|
9
|
+
children: cssFiles.map((css) => /* @__PURE__ */ _jsx("link", {
|
|
10
|
+
href: css,
|
|
11
|
+
rel: "stylesheet"
|
|
12
|
+
}, css))
|
|
13
|
+
});
|
|
14
|
+
}
|
|
4
15
|
function wrapStream(stream, originalStream) {
|
|
5
16
|
const wrappedStream = Object.create(stream);
|
|
6
17
|
for (const prop of Object.keys(originalStream)) {
|
|
@@ -11,31 +22,43 @@ function wrapStream(stream, originalStream) {
|
|
|
11
22
|
return wrappedStream;
|
|
12
23
|
}
|
|
13
24
|
const renderSSRStream = async (children, options) => {
|
|
14
|
-
|
|
15
|
-
|
|
25
|
+
var __rspack_rsc_manifest__1, __rspack_rsc_manifest__2, __rspack_rsc_manifest__3;
|
|
26
|
+
const { rscRoot, routes } = options;
|
|
27
|
+
const clientManifest = (__rspack_rsc_manifest__1 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__1 === void 0 ? void 0 : __rspack_rsc_manifest__1.clientManifest;
|
|
28
|
+
const serverConsumerModuleMap = (__rspack_rsc_manifest__2 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__2 === void 0 ? void 0 : __rspack_rsc_manifest__2.serverConsumerModuleMap;
|
|
29
|
+
const entryCssFiles = (__rspack_rsc_manifest__3 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__3 === void 0 ? void 0 : __rspack_rsc_manifest__3.entryCssFiles;
|
|
30
|
+
const hasRoutes = Boolean(routes && routes.length > 0);
|
|
31
|
+
if (!clientManifest || !serverConsumerModuleMap) {
|
|
16
32
|
return renderToReadableStream(children, options);
|
|
17
33
|
}
|
|
18
34
|
try {
|
|
19
35
|
const [{ renderRsc }, { createFromReadableStream }, { injectRSCPayload }] = await Promise.all([
|
|
20
36
|
import("../rsc/index"),
|
|
21
|
-
import("react-server-dom-
|
|
37
|
+
import("react-server-dom-rspack/client.edge"),
|
|
22
38
|
import("../../rsc-html-stream/server")
|
|
23
39
|
]);
|
|
24
40
|
const rscStream = await renderRsc({
|
|
25
|
-
element: rscRoot || children
|
|
26
|
-
clientManifest
|
|
41
|
+
element: rscRoot || children
|
|
27
42
|
});
|
|
28
43
|
const [rscElementStream, rscPayloadStream] = rscStream.tee();
|
|
29
|
-
const elements = createFromReadableStream(rscElementStream
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
44
|
+
const elements = createFromReadableStream(rscElementStream);
|
|
45
|
+
let cssFiles = [];
|
|
46
|
+
if (!hasRoutes && entryCssFiles) {
|
|
47
|
+
cssFiles = Object.values(entryCssFiles).flat();
|
|
48
|
+
}
|
|
49
|
+
const htmlStream = await renderToReadableStream(/* @__PURE__ */ _jsxs(ServerElementsProvider, {
|
|
33
50
|
elements,
|
|
34
|
-
children
|
|
51
|
+
children: [
|
|
52
|
+
/* @__PURE__ */ _jsx(CSSLinks, {
|
|
53
|
+
cssFiles
|
|
54
|
+
}),
|
|
55
|
+
children
|
|
56
|
+
]
|
|
35
57
|
}), options);
|
|
36
|
-
|
|
37
|
-
injectClosingTags:
|
|
38
|
-
}))
|
|
58
|
+
const stream = htmlStream.pipeThrough(injectRSCPayload(rscPayloadStream, {
|
|
59
|
+
injectClosingTags: true
|
|
60
|
+
}));
|
|
61
|
+
return wrapStream(stream, htmlStream);
|
|
39
62
|
} catch (error) {
|
|
40
63
|
console.error(error);
|
|
41
64
|
throw error;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { _ as _class_private_field_get } from "@swc/helpers/_/_class_private_field_get";
|
|
2
2
|
import { _ as _class_private_field_init } from "@swc/helpers/_/_class_private_field_init";
|
|
3
3
|
import { _ as _class_private_field_set } from "@swc/helpers/_/_class_private_field_set";
|
|
4
|
-
import { createFromFetch, encodeReply } from "react-server-dom-
|
|
4
|
+
import { createFromFetch, encodeReply } from "react-server-dom-rspack/client.browser";
|
|
5
5
|
var _statusCode = /* @__PURE__ */ new WeakMap(), _url = /* @__PURE__ */ new WeakMap(), _details = /* @__PURE__ */ new WeakMap();
|
|
6
6
|
class CallServerError extends Error {
|
|
7
7
|
get statusCode() {
|
|
@@ -45,7 +45,7 @@ URL: ${url}`;
|
|
|
45
45
|
}
|
|
46
46
|
async function requestCallServer(id, args) {
|
|
47
47
|
const entryName = window.__MODERN_JS_ENTRY_NAME;
|
|
48
|
-
const url = entryName === "main" ? "/" : `/${entryName}`;
|
|
48
|
+
const url = entryName === "main" || entryName === "index" ? "/" : `/${entryName}`;
|
|
49
49
|
try {
|
|
50
50
|
const response = await fetch(url, {
|
|
51
51
|
method: "POST",
|
|
@@ -74,9 +74,7 @@ async function requestCallServer(id, args) {
|
|
|
74
74
|
}
|
|
75
75
|
async function callServer(id, args) {
|
|
76
76
|
const response = requestCallServer(id, args);
|
|
77
|
-
const res = createFromFetch(response
|
|
78
|
-
callServer
|
|
79
|
-
});
|
|
77
|
+
const res = createFromFetch(response);
|
|
80
78
|
return res;
|
|
81
79
|
}
|
|
82
80
|
export {
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import React from "react";
|
|
3
3
|
import { createContext, useState } from "react";
|
|
4
|
-
import { createFromReadableStream, createServerReference } from "react-server-dom-
|
|
4
|
+
import { createFromReadableStream, createServerReference, setServerCallback } from "react-server-dom-rspack/client.browser";
|
|
5
5
|
import { rscStream } from "../rsc-html-stream/client.mjs";
|
|
6
6
|
import { callServer } from "./callServer.mjs";
|
|
7
|
-
import { createFromFetch } from "react-server-dom-
|
|
7
|
+
import { createFromFetch } from "react-server-dom-rspack/client.browser";
|
|
8
8
|
const ResetRootContext = /* @__PURE__ */ createContext(void 0);
|
|
9
9
|
function RscClientRoot({ rscPayload }) {
|
|
10
10
|
const elements = React.use(rscPayload);
|
|
@@ -39,5 +39,6 @@ export {
|
|
|
39
39
|
createFromFetch,
|
|
40
40
|
createFromReadableStream,
|
|
41
41
|
createServerReference,
|
|
42
|
-
rscStream
|
|
42
|
+
rscStream,
|
|
43
|
+
setServerCallback
|
|
43
44
|
};
|
|
@@ -69,6 +69,63 @@ function writeChunk(chunk, controller) {
|
|
|
69
69
|
function escapeScript(script) {
|
|
70
70
|
return script.replace(/<!--/g, "<\\!--").replace(/<\/(script)/gi, "</\\$1");
|
|
71
71
|
}
|
|
72
|
+
function injectCSS(cssFiles, { injectClosingTags = true } = {}) {
|
|
73
|
+
if (cssFiles.length === 0) {
|
|
74
|
+
return new TransformStream({
|
|
75
|
+
transform(chunk, controller) {
|
|
76
|
+
controller.enqueue(chunk);
|
|
77
|
+
},
|
|
78
|
+
flush(controller) {
|
|
79
|
+
if (injectClosingTags) {
|
|
80
|
+
controller.enqueue(encoder.encode("</body></html>"));
|
|
81
|
+
}
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
}
|
|
85
|
+
const decoder = new TextDecoder();
|
|
86
|
+
const headTrailer = "</head>";
|
|
87
|
+
const bodyTrailer = "</body>";
|
|
88
|
+
const buffered = [];
|
|
89
|
+
let timeout = null;
|
|
90
|
+
let cssInjected = false;
|
|
91
|
+
const cssLinks = cssFiles.map((css) => `<link href="${css}" rel="stylesheet" />`).join("");
|
|
92
|
+
function flushBufferedChunks(controller) {
|
|
93
|
+
for (const chunk of buffered) {
|
|
94
|
+
let buf = decoder.decode(chunk);
|
|
95
|
+
if (!cssInjected && buf.includes(headTrailer)) {
|
|
96
|
+
buf = buf.replace(headTrailer, `${cssLinks}${headTrailer}`);
|
|
97
|
+
cssInjected = true;
|
|
98
|
+
}
|
|
99
|
+
controller.enqueue(encoder.encode(buf));
|
|
100
|
+
}
|
|
101
|
+
buffered.length = 0;
|
|
102
|
+
timeout = null;
|
|
103
|
+
}
|
|
104
|
+
return new TransformStream({
|
|
105
|
+
transform(chunk, controller) {
|
|
106
|
+
buffered.push(chunk);
|
|
107
|
+
if (timeout) {
|
|
108
|
+
return;
|
|
109
|
+
}
|
|
110
|
+
timeout = setTimeout(() => {
|
|
111
|
+
flushBufferedChunks(controller);
|
|
112
|
+
}, 0);
|
|
113
|
+
},
|
|
114
|
+
async flush(controller) {
|
|
115
|
+
if (timeout) {
|
|
116
|
+
clearTimeout(timeout);
|
|
117
|
+
flushBufferedChunks(controller);
|
|
118
|
+
}
|
|
119
|
+
if (!cssInjected) {
|
|
120
|
+
controller.enqueue(encoder.encode(cssLinks));
|
|
121
|
+
}
|
|
122
|
+
if (injectClosingTags) {
|
|
123
|
+
controller.enqueue(encoder.encode("</body></html>"));
|
|
124
|
+
}
|
|
125
|
+
}
|
|
126
|
+
});
|
|
127
|
+
}
|
|
72
128
|
export {
|
|
129
|
+
injectCSS,
|
|
73
130
|
injectRSCPayload
|
|
74
131
|
};
|
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { injectCSS, injectRSCPayload } from "../../rsc-html-stream/server.mjs";
|
|
2
|
+
import { renderRsc } from "./rsc.mjs";
|
|
3
|
+
async function renderCSRWithRSC(options) {
|
|
4
|
+
const entryCssFiles = __rspack_rsc_manifest__ === null || __rspack_rsc_manifest__ === void 0 ? void 0 : __rspack_rsc_manifest__.entryCssFiles;
|
|
5
|
+
const cssFiles = entryCssFiles ? Object.values(entryCssFiles).flat() : [];
|
|
6
|
+
const rscPayloadStream = renderRsc({
|
|
7
|
+
element: options.rscRoot
|
|
8
|
+
});
|
|
9
|
+
const htmlStream = new ReadableStream({
|
|
10
|
+
start(controller) {
|
|
11
|
+
const encoder = new TextEncoder();
|
|
12
|
+
controller.enqueue(encoder.encode(options.html));
|
|
13
|
+
controller.close();
|
|
14
|
+
}
|
|
15
|
+
});
|
|
16
|
+
const stream = htmlStream.pipeThrough(injectCSS(cssFiles, {
|
|
17
|
+
injectClosingTags: false
|
|
18
|
+
})).pipeThrough(injectRSCPayload(rscPayloadStream, {
|
|
19
|
+
injectClosingTags: false
|
|
20
|
+
}));
|
|
21
|
+
return new Response(stream, {
|
|
22
|
+
status: 200,
|
|
23
|
+
headers: new Headers({
|
|
24
|
+
"content-type": "text/html; charset=UTF-8"
|
|
25
|
+
})
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
export {
|
|
29
|
+
renderCSRWithRSC
|
|
30
|
+
};
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export * from "./rsc.mjs";
|
|
2
|
-
export * from "./
|
|
2
|
+
export * from "./csr.mjs";
|
|
@@ -1,34 +1,46 @@
|
|
|
1
|
-
import { renderToReadableStream } from "react-server-dom-
|
|
2
|
-
import { renderToReadableStream as renderToReadableStream2 } from "react-server-dom-
|
|
3
|
-
import { decodeReply } from "react-server-dom-
|
|
4
|
-
import { createFromReadableStream } from "react-server-dom-
|
|
5
|
-
import { registerClientReference, registerServerReference } from "react-server-dom-
|
|
1
|
+
import { renderToReadableStream } from "react-server-dom-rspack/server.node";
|
|
2
|
+
import { loadServerAction, renderToReadableStream as renderToReadableStream2 } from "react-server-dom-rspack/server.node";
|
|
3
|
+
import { decodeReply } from "react-server-dom-rspack/server.node";
|
|
4
|
+
import { createFromReadableStream } from "react-server-dom-rspack/client.node";
|
|
5
|
+
import { registerClientReference, registerServerReference } from "react-server-dom-rspack/server.node";
|
|
6
6
|
const renderRsc = (options) => {
|
|
7
|
-
const readable = renderToReadableStream2(options.element
|
|
7
|
+
const readable = renderToReadableStream2(options.element);
|
|
8
8
|
return readable;
|
|
9
9
|
};
|
|
10
|
-
const handleAction = async (req
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
10
|
+
const handleAction = async (req) => {
|
|
11
|
+
try {
|
|
12
|
+
const serverReference = req.headers.get("x-rsc-action");
|
|
13
|
+
if (!serverReference) {
|
|
14
|
+
return new Response("Cannot find server reference", {
|
|
15
|
+
status: 404
|
|
16
|
+
});
|
|
17
|
+
}
|
|
18
|
+
const action = loadServerAction(serverReference);
|
|
19
|
+
if (typeof action !== "function") {
|
|
20
|
+
console.error("[RSC] Invalid action: server reference is not a function, serverReference:", serverReference);
|
|
21
|
+
return new Response("Invalid action", {
|
|
22
|
+
status: 400
|
|
23
|
+
});
|
|
17
24
|
}
|
|
18
|
-
const { clientManifest } = options;
|
|
19
25
|
const contentType = req.headers.get("content-type");
|
|
20
26
|
let args;
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
+
try {
|
|
28
|
+
if (contentType === null || contentType === void 0 ? void 0 : contentType.includes("multipart/form-data")) {
|
|
29
|
+
const formData = await req.formData();
|
|
30
|
+
args = await decodeReply(formData);
|
|
31
|
+
} else {
|
|
32
|
+
const text = await req.text();
|
|
33
|
+
args = await decodeReply(text);
|
|
34
|
+
}
|
|
35
|
+
} catch (error) {
|
|
36
|
+
console.error("[RSC] Failed to decode request arguments, error:", error instanceof Error ? error.message : String(error), "contentType:", contentType || "unknown");
|
|
37
|
+
return new Response("Failed to decode request arguments", {
|
|
38
|
+
status: 400
|
|
39
|
+
});
|
|
27
40
|
}
|
|
28
|
-
const result = action.apply(null, args);
|
|
41
|
+
const result = await Promise.resolve(action.apply(null, args));
|
|
29
42
|
const stream = renderRsc({
|
|
30
|
-
element: result
|
|
31
|
-
clientManifest
|
|
43
|
+
element: result
|
|
32
44
|
});
|
|
33
45
|
const response = new Response(stream, {
|
|
34
46
|
status: 200,
|
|
@@ -37,10 +49,15 @@ const handleAction = async (req, options) => {
|
|
|
37
49
|
}
|
|
38
50
|
});
|
|
39
51
|
return response;
|
|
52
|
+
} catch (error) {
|
|
53
|
+
const errorMessage = error instanceof Error ? error.message : String(error);
|
|
54
|
+
const errorStack = error instanceof Error ? error.stack : void 0;
|
|
55
|
+
console.error("[RSC] Error handling server action, error:", errorMessage, errorStack ? `
|
|
56
|
+
${errorStack}` : "");
|
|
57
|
+
return new Response("Internal server error", {
|
|
58
|
+
status: 500
|
|
59
|
+
});
|
|
40
60
|
}
|
|
41
|
-
return new Response("Cannot find server reference", {
|
|
42
|
-
status: 404
|
|
43
|
-
});
|
|
44
61
|
};
|
|
45
62
|
export {
|
|
46
63
|
createFromReadableStream,
|
|
@@ -1,6 +1,17 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { renderToReadableStream } from "react-dom/server.edge";
|
|
3
3
|
import { ServerElementsProvider } from "../../client/index.mjs";
|
|
4
|
+
function CSSLinks({ cssFiles }) {
|
|
5
|
+
if (cssFiles.length === 0) {
|
|
6
|
+
return null;
|
|
7
|
+
}
|
|
8
|
+
return /* @__PURE__ */ _jsx(_Fragment, {
|
|
9
|
+
children: cssFiles.map((css) => /* @__PURE__ */ _jsx("link", {
|
|
10
|
+
href: css,
|
|
11
|
+
rel: "stylesheet"
|
|
12
|
+
}, css))
|
|
13
|
+
});
|
|
14
|
+
}
|
|
4
15
|
function wrapStream(stream, originalStream) {
|
|
5
16
|
const wrappedStream = Object.create(stream);
|
|
6
17
|
for (const prop of Object.keys(originalStream)) {
|
|
@@ -11,31 +22,43 @@ function wrapStream(stream, originalStream) {
|
|
|
11
22
|
return wrappedStream;
|
|
12
23
|
}
|
|
13
24
|
const renderSSRStream = async (children, options) => {
|
|
14
|
-
|
|
15
|
-
|
|
25
|
+
var __rspack_rsc_manifest__1, __rspack_rsc_manifest__2, __rspack_rsc_manifest__3;
|
|
26
|
+
const { rscRoot, routes } = options;
|
|
27
|
+
const clientManifest = (__rspack_rsc_manifest__1 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__1 === void 0 ? void 0 : __rspack_rsc_manifest__1.clientManifest;
|
|
28
|
+
const serverConsumerModuleMap = (__rspack_rsc_manifest__2 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__2 === void 0 ? void 0 : __rspack_rsc_manifest__2.serverConsumerModuleMap;
|
|
29
|
+
const entryCssFiles = (__rspack_rsc_manifest__3 = __rspack_rsc_manifest__) === null || __rspack_rsc_manifest__3 === void 0 ? void 0 : __rspack_rsc_manifest__3.entryCssFiles;
|
|
30
|
+
const hasRoutes = Boolean(routes && routes.length > 0);
|
|
31
|
+
if (!clientManifest || !serverConsumerModuleMap) {
|
|
16
32
|
return renderToReadableStream(children, options);
|
|
17
33
|
}
|
|
18
34
|
try {
|
|
19
35
|
const [{ renderRsc }, { createFromReadableStream }, { injectRSCPayload }] = await Promise.all([
|
|
20
36
|
import("../rsc/index.mjs"),
|
|
21
|
-
import("react-server-dom-
|
|
37
|
+
import("react-server-dom-rspack/client.edge"),
|
|
22
38
|
import("../../rsc-html-stream/server.mjs")
|
|
23
39
|
]);
|
|
24
40
|
const rscStream = await renderRsc({
|
|
25
|
-
element: rscRoot || children
|
|
26
|
-
clientManifest
|
|
41
|
+
element: rscRoot || children
|
|
27
42
|
});
|
|
28
43
|
const [rscElementStream, rscPayloadStream] = rscStream.tee();
|
|
29
|
-
const elements = createFromReadableStream(rscElementStream
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
44
|
+
const elements = createFromReadableStream(rscElementStream);
|
|
45
|
+
let cssFiles = [];
|
|
46
|
+
if (!hasRoutes && entryCssFiles) {
|
|
47
|
+
cssFiles = Object.values(entryCssFiles).flat();
|
|
48
|
+
}
|
|
49
|
+
const htmlStream = await renderToReadableStream(/* @__PURE__ */ _jsxs(ServerElementsProvider, {
|
|
33
50
|
elements,
|
|
34
|
-
children
|
|
51
|
+
children: [
|
|
52
|
+
/* @__PURE__ */ _jsx(CSSLinks, {
|
|
53
|
+
cssFiles
|
|
54
|
+
}),
|
|
55
|
+
children
|
|
56
|
+
]
|
|
35
57
|
}), options);
|
|
36
|
-
|
|
37
|
-
injectClosingTags:
|
|
38
|
-
}))
|
|
58
|
+
const stream = htmlStream.pipeThrough(injectRSCPayload(rscPayloadStream, {
|
|
59
|
+
injectClosingTags: true
|
|
60
|
+
}));
|
|
61
|
+
return wrapStream(stream, htmlStream);
|
|
39
62
|
} catch (error) {
|
|
40
63
|
console.error(error);
|
|
41
64
|
throw error;
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
type ReactServerValue = unknown;
|
|
2
2
|
export declare function requestCallServer(id: string, args: ReactServerValue): Promise<Response>;
|
|
3
3
|
export declare function callServer(id: string, args: ReactServerValue): Promise<any>;
|
|
4
|
+
export {};
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { type ReactNode } from 'react';
|
|
3
|
-
import { createFromReadableStream, createServerReference } from 'react-server-dom-
|
|
3
|
+
import { createFromReadableStream, createServerReference, setServerCallback } from 'react-server-dom-rspack/client.browser';
|
|
4
4
|
export { rscStream } from '../rsc-html-stream/client';
|
|
5
5
|
export { createFromReadableStream, createServerReference };
|
|
6
6
|
export { callServer } from './callServer';
|
|
7
|
-
export { createFromFetch } from 'react-server-dom-
|
|
7
|
+
export { createFromFetch } from 'react-server-dom-rspack/client.browser';
|
|
8
8
|
declare global {
|
|
9
9
|
interface Window {
|
|
10
10
|
__MODERN_JS_ENTRY_NAME?: string;
|
|
@@ -13,6 +13,7 @@ declare global {
|
|
|
13
13
|
export declare const ResetRootContext: React.Context<{
|
|
14
14
|
setRoot: (root: React.ReactNode) => void;
|
|
15
15
|
} | undefined>;
|
|
16
|
+
export { setServerCallback };
|
|
16
17
|
export declare function RscClientRoot({ rscPayload, }: {
|
|
17
18
|
rscPayload: Promise<React.ReactNode>;
|
|
18
19
|
}): React.JSX.Element;
|
|
@@ -1,3 +1,9 @@
|
|
|
1
1
|
export declare function injectRSCPayload(rscStream: ReadableStream, { injectClosingTags, }: {
|
|
2
2
|
injectClosingTags?: boolean;
|
|
3
3
|
}): TransformStream;
|
|
4
|
+
/**
|
|
5
|
+
* Inject CSS link tags into HTML stream before closing head tag
|
|
6
|
+
*/
|
|
7
|
+
export declare function injectCSS(cssFiles: string[], { injectClosingTags, }?: {
|
|
8
|
+
injectClosingTags?: boolean;
|
|
9
|
+
}): TransformStream;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
export * from './rsc';
|
|
2
|
-
export * from './
|
|
2
|
+
export * from './csr';
|
|
@@ -1,13 +1,8 @@
|
|
|
1
|
-
export { renderToReadableStream } from 'react-server-dom-
|
|
2
|
-
|
|
3
|
-
export {
|
|
4
|
-
export { registerClientReference, registerServerReference, } from 'react-server-dom-webpack/server';
|
|
1
|
+
export { renderToReadableStream } from 'react-server-dom-rspack/server.node';
|
|
2
|
+
export { createFromReadableStream } from 'react-server-dom-rspack/client.node';
|
|
3
|
+
export { registerClientReference, registerServerReference, } from 'react-server-dom-rspack/server.node';
|
|
5
4
|
type RenderRscOptions = {
|
|
6
5
|
element: React.ReactElement;
|
|
7
|
-
clientManifest: ClientManifest;
|
|
8
6
|
};
|
|
9
|
-
export declare const renderRsc: (options: RenderRscOptions) => ReadableStream<
|
|
10
|
-
|
|
11
|
-
clientManifest: ClientManifest;
|
|
12
|
-
};
|
|
13
|
-
export declare const handleAction: (req: Request, options: HandleActionOptions) => Promise<Response>;
|
|
7
|
+
export declare const renderRsc: (options: RenderRscOptions) => ReadableStream<Uint8Array<ArrayBufferLike>>;
|
|
8
|
+
export declare const handleAction: (req: Request) => Promise<Response>;
|
|
@@ -1,9 +1,7 @@
|
|
|
1
|
-
import type { ClientManifest, SSRManifest } from '@modern-js/types/server';
|
|
2
1
|
import { renderToReadableStream } from 'react-dom/server.edge';
|
|
3
2
|
type Options = {
|
|
4
3
|
request: Request;
|
|
5
|
-
|
|
6
|
-
ssrManifest: SSRManifest;
|
|
4
|
+
routes?: unknown[];
|
|
7
5
|
} & Parameters<typeof renderToReadableStream>[1];
|
|
8
6
|
export declare const renderSSRStream: (children: React.ReactNode, options: Options & {
|
|
9
7
|
rscRoot: React.ReactElement;
|
package/package.json
CHANGED
|
@@ -15,33 +15,33 @@
|
|
|
15
15
|
"modern",
|
|
16
16
|
"modern.js"
|
|
17
17
|
],
|
|
18
|
-
"version": "3.0.
|
|
18
|
+
"version": "3.0.2",
|
|
19
19
|
"files": [
|
|
20
20
|
"dist",
|
|
21
21
|
"hook.d.ts"
|
|
22
22
|
],
|
|
23
23
|
"dependencies": {
|
|
24
24
|
"@swc/helpers": "^0.5.17",
|
|
25
|
-
"@modern-js/types": "3.0.
|
|
26
|
-
"@modern-js/utils": "3.0.
|
|
25
|
+
"@modern-js/types": "3.0.2",
|
|
26
|
+
"@modern-js/utils": "3.0.2"
|
|
27
27
|
},
|
|
28
28
|
"devDependencies": {
|
|
29
|
-
"@rslib/core": "0.19.
|
|
30
|
-
"@types/react": "^19.2.
|
|
29
|
+
"@rslib/core": "0.19.5",
|
|
30
|
+
"@types/react": "^19.2.13",
|
|
31
31
|
"@types/react-dom": "^19.2.3",
|
|
32
32
|
"react": "^19.2.4",
|
|
33
33
|
"react-dom": "^19.2.4",
|
|
34
|
-
"react-server-dom-
|
|
34
|
+
"react-server-dom-rspack": "0.0.1-beta.0",
|
|
35
35
|
"typescript": "^5",
|
|
36
36
|
"@modern-js/rslib": "2.68.10",
|
|
37
|
-
"@modern-js/server-core": "3.0.
|
|
38
|
-
"@scripts/
|
|
39
|
-
"@scripts/
|
|
37
|
+
"@modern-js/server-core": "3.0.2",
|
|
38
|
+
"@scripts/rstest-config": "2.66.0",
|
|
39
|
+
"@scripts/build": "2.66.0"
|
|
40
40
|
},
|
|
41
41
|
"peerDependencies": {
|
|
42
42
|
"react": ">=17.0.2",
|
|
43
43
|
"react-dom": ">=17.0.2",
|
|
44
|
-
"react-server-dom-
|
|
44
|
+
"react-server-dom-rspack": "0.0.1-beta.0"
|
|
45
45
|
},
|
|
46
46
|
"exports": {
|
|
47
47
|
"./ssr": {
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var processRSCStream_exports = {};
|
|
20
|
-
__export(processRSCStream_exports, {
|
|
21
|
-
processRSCStream: () => processRSCStream
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(processRSCStream_exports);
|
|
24
|
-
function escapeScript(script) {
|
|
25
|
-
return script.replace(/<!--/g, "<\\!--").replace(/<\/(script)/gi, "</\\$1");
|
|
26
|
-
}
|
|
27
|
-
async function processRSCStream(rscStream, controller, encoder) {
|
|
28
|
-
try {
|
|
29
|
-
const reader = rscStream.getReader();
|
|
30
|
-
const decoder = new TextDecoder("utf-8", {
|
|
31
|
-
fatal: true
|
|
32
|
-
});
|
|
33
|
-
while (true) {
|
|
34
|
-
const { done, value } = await reader.read();
|
|
35
|
-
if (done) break;
|
|
36
|
-
try {
|
|
37
|
-
const chunk = JSON.stringify(decoder.decode(value, {
|
|
38
|
-
stream: true
|
|
39
|
-
}));
|
|
40
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(${chunk})`;
|
|
41
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
42
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
43
|
-
} catch (err) {
|
|
44
|
-
const base64 = JSON.stringify(btoa(String.fromCodePoint(...value)));
|
|
45
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(Uint8Array.from(atob(${base64}), m => m.codePointAt(0)))`;
|
|
46
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
47
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
48
|
-
}
|
|
49
|
-
}
|
|
50
|
-
const remaining = decoder.decode();
|
|
51
|
-
if (remaining.length) {
|
|
52
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(${JSON.stringify(remaining)})`;
|
|
53
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
54
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
55
|
-
}
|
|
56
|
-
controller.close();
|
|
57
|
-
} catch (error) {
|
|
58
|
-
controller.error(error);
|
|
59
|
-
}
|
|
60
|
-
}
|
|
61
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
62
|
-
0 && (module.exports = {
|
|
63
|
-
processRSCStream
|
|
64
|
-
});
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
function escapeScript(script) {
|
|
2
|
-
return script.replace(/<!--/g, "<\\!--").replace(/<\/(script)/gi, "</\\$1");
|
|
3
|
-
}
|
|
4
|
-
async function processRSCStream(rscStream, controller, encoder) {
|
|
5
|
-
try {
|
|
6
|
-
const reader = rscStream.getReader();
|
|
7
|
-
const decoder = new TextDecoder("utf-8", {
|
|
8
|
-
fatal: true
|
|
9
|
-
});
|
|
10
|
-
while (true) {
|
|
11
|
-
const { done, value } = await reader.read();
|
|
12
|
-
if (done) break;
|
|
13
|
-
try {
|
|
14
|
-
const chunk = JSON.stringify(decoder.decode(value, {
|
|
15
|
-
stream: true
|
|
16
|
-
}));
|
|
17
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(${chunk})`;
|
|
18
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
19
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
20
|
-
} catch (err) {
|
|
21
|
-
const base64 = JSON.stringify(btoa(String.fromCodePoint(...value)));
|
|
22
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(Uint8Array.from(atob(${base64}), m => m.codePointAt(0)))`;
|
|
23
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
24
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
const remaining = decoder.decode();
|
|
28
|
-
if (remaining.length) {
|
|
29
|
-
const scriptContent = `(self.__FLIGHT_DATA||=[]).push(${JSON.stringify(remaining)})`;
|
|
30
|
-
const scriptTag = `<script>${escapeScript(scriptContent)}</script>`;
|
|
31
|
-
controller.enqueue(encoder.encode(scriptTag));
|
|
32
|
-
}
|
|
33
|
-
controller.close();
|
|
34
|
-
} catch (error) {
|
|
35
|
-
controller.error(error);
|
|
36
|
-
}
|
|
37
|
-
}
|
|
38
|
-
export {
|
|
39
|
-
processRSCStream
|
|
40
|
-
};
|