@void/react 0.0.0
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/README.md +216 -0
- package/dist/action-BFWtavbf.mjs +29 -0
- package/dist/context-BCeFV8Jy.mjs +9 -0
- package/dist/index-6hxGVqsE.d.mts +125 -0
- package/dist/index.d.mts +2 -0
- package/dist/index.mjs +4 -0
- package/dist/plugin.d.mts +16 -0
- package/dist/plugin.mjs +553 -0
- package/dist/runtime/index.d.mts +2 -0
- package/dist/runtime/index.mjs +4 -0
- package/dist/runtime/pages-client.d.mts +27 -0
- package/dist/runtime/pages-client.mjs +417 -0
- package/dist/runtime/pages-server.d.mts +27 -0
- package/dist/runtime/pages-server.mjs +112 -0
- package/dist/runtime/prefetch.d.mts +2 -0
- package/dist/runtime/prefetch.mjs +2 -0
- package/dist/runtime-C24S_Dlg.mjs +492 -0
- package/package.json +62 -0
package/dist/plugin.mjs
ADDED
|
@@ -0,0 +1,553 @@
|
|
|
1
|
+
import react from "@vitejs/plugin-react";
|
|
2
|
+
import { existsSync, readFileSync, readdirSync } from "node:fs";
|
|
3
|
+
import { normalizePath } from "vite";
|
|
4
|
+
import { generateComponentManifest, resolveEffectiveLayoutChain, resolveStaticPageDataBuildOptions, scanPages } from "void/pages";
|
|
5
|
+
import { ISLANDS_CLIENT_ENTRY_ID, ISLANDS_RENDERER_ID, computePagesNeedingClientJS, configureIslandCssServer, extractCssImports, fileHasCssImports, needsIslandClientBundle, rebuildIslandCssMap, resolveSpecifier, rewriteCssImportForVirtualModule, watchPagesForRescan } from "void/pages-islands-plugin";
|
|
6
|
+
//#region ../../node_modules/.pnpm/pathe@2.0.3/node_modules/pathe/dist/shared/pathe.M-eThtNZ.mjs
|
|
7
|
+
const _DRIVE_LETTER_START_RE = /^[A-Za-z]:\//;
|
|
8
|
+
function normalizeWindowsPath(input = "") {
|
|
9
|
+
if (!input) return input;
|
|
10
|
+
return input.replace(/\\/g, "/").replace(_DRIVE_LETTER_START_RE, (r) => r.toUpperCase());
|
|
11
|
+
}
|
|
12
|
+
const _UNC_REGEX = /^[/\\]{2}/;
|
|
13
|
+
const _IS_ABSOLUTE_RE = /^[/\\](?![/\\])|^[/\\]{2}(?!\.)|^[A-Za-z]:[/\\]/;
|
|
14
|
+
const _DRIVE_LETTER_RE = /^[A-Za-z]:$/;
|
|
15
|
+
const _ROOT_FOLDER_RE = /^\/([A-Za-z]:)?$/;
|
|
16
|
+
const normalize = function(path) {
|
|
17
|
+
if (path.length === 0) return ".";
|
|
18
|
+
path = normalizeWindowsPath(path);
|
|
19
|
+
const isUNCPath = path.match(_UNC_REGEX);
|
|
20
|
+
const isPathAbsolute = isAbsolute(path);
|
|
21
|
+
const trailingSeparator = path[path.length - 1] === "/";
|
|
22
|
+
path = normalizeString(path, !isPathAbsolute);
|
|
23
|
+
if (path.length === 0) {
|
|
24
|
+
if (isPathAbsolute) return "/";
|
|
25
|
+
return trailingSeparator ? "./" : ".";
|
|
26
|
+
}
|
|
27
|
+
if (trailingSeparator) path += "/";
|
|
28
|
+
if (_DRIVE_LETTER_RE.test(path)) path += "/";
|
|
29
|
+
if (isUNCPath) {
|
|
30
|
+
if (!isPathAbsolute) return `//./${path}`;
|
|
31
|
+
return `//${path}`;
|
|
32
|
+
}
|
|
33
|
+
return isPathAbsolute && !isAbsolute(path) ? `/${path}` : path;
|
|
34
|
+
};
|
|
35
|
+
const join = function(...segments) {
|
|
36
|
+
let path = "";
|
|
37
|
+
for (const seg of segments) {
|
|
38
|
+
if (!seg) continue;
|
|
39
|
+
if (path.length > 0) {
|
|
40
|
+
const pathTrailing = path[path.length - 1] === "/";
|
|
41
|
+
const segLeading = seg[0] === "/";
|
|
42
|
+
if (pathTrailing && segLeading) path += seg.slice(1);
|
|
43
|
+
else path += pathTrailing || segLeading ? seg : `/${seg}`;
|
|
44
|
+
} else path += seg;
|
|
45
|
+
}
|
|
46
|
+
return normalize(path);
|
|
47
|
+
};
|
|
48
|
+
function cwd() {
|
|
49
|
+
if (typeof process !== "undefined" && typeof process.cwd === "function") return process.cwd().replace(/\\/g, "/");
|
|
50
|
+
return "/";
|
|
51
|
+
}
|
|
52
|
+
const resolve = function(...arguments_) {
|
|
53
|
+
arguments_ = arguments_.map((argument) => normalizeWindowsPath(argument));
|
|
54
|
+
let resolvedPath = "";
|
|
55
|
+
let resolvedAbsolute = false;
|
|
56
|
+
for (let index = arguments_.length - 1; index >= -1 && !resolvedAbsolute; index--) {
|
|
57
|
+
const path = index >= 0 ? arguments_[index] : cwd();
|
|
58
|
+
if (!path || path.length === 0) continue;
|
|
59
|
+
resolvedPath = `${path}/${resolvedPath}`;
|
|
60
|
+
resolvedAbsolute = isAbsolute(path);
|
|
61
|
+
}
|
|
62
|
+
resolvedPath = normalizeString(resolvedPath, !resolvedAbsolute);
|
|
63
|
+
if (resolvedAbsolute && !isAbsolute(resolvedPath)) return `/${resolvedPath}`;
|
|
64
|
+
return resolvedPath.length > 0 ? resolvedPath : ".";
|
|
65
|
+
};
|
|
66
|
+
function normalizeString(path, allowAboveRoot) {
|
|
67
|
+
let res = "";
|
|
68
|
+
let lastSegmentLength = 0;
|
|
69
|
+
let lastSlash = -1;
|
|
70
|
+
let dots = 0;
|
|
71
|
+
let char = null;
|
|
72
|
+
for (let index = 0; index <= path.length; ++index) {
|
|
73
|
+
if (index < path.length) char = path[index];
|
|
74
|
+
else if (char === "/") break;
|
|
75
|
+
else char = "/";
|
|
76
|
+
if (char === "/") {
|
|
77
|
+
if (lastSlash === index - 1 || dots === 1);
|
|
78
|
+
else if (dots === 2) {
|
|
79
|
+
if (res.length < 2 || lastSegmentLength !== 2 || res[res.length - 1] !== "." || res[res.length - 2] !== ".") {
|
|
80
|
+
if (res.length > 2) {
|
|
81
|
+
const lastSlashIndex = res.lastIndexOf("/");
|
|
82
|
+
if (lastSlashIndex === -1) {
|
|
83
|
+
res = "";
|
|
84
|
+
lastSegmentLength = 0;
|
|
85
|
+
} else {
|
|
86
|
+
res = res.slice(0, lastSlashIndex);
|
|
87
|
+
lastSegmentLength = res.length - 1 - res.lastIndexOf("/");
|
|
88
|
+
}
|
|
89
|
+
lastSlash = index;
|
|
90
|
+
dots = 0;
|
|
91
|
+
continue;
|
|
92
|
+
} else if (res.length > 0) {
|
|
93
|
+
res = "";
|
|
94
|
+
lastSegmentLength = 0;
|
|
95
|
+
lastSlash = index;
|
|
96
|
+
dots = 0;
|
|
97
|
+
continue;
|
|
98
|
+
}
|
|
99
|
+
}
|
|
100
|
+
if (allowAboveRoot) {
|
|
101
|
+
res += res.length > 0 ? "/.." : "..";
|
|
102
|
+
lastSegmentLength = 2;
|
|
103
|
+
}
|
|
104
|
+
} else {
|
|
105
|
+
if (res.length > 0) res += `/${path.slice(lastSlash + 1, index)}`;
|
|
106
|
+
else res = path.slice(lastSlash + 1, index);
|
|
107
|
+
lastSegmentLength = index - lastSlash - 1;
|
|
108
|
+
}
|
|
109
|
+
lastSlash = index;
|
|
110
|
+
dots = 0;
|
|
111
|
+
} else if (char === "." && dots !== -1) ++dots;
|
|
112
|
+
else dots = -1;
|
|
113
|
+
}
|
|
114
|
+
return res;
|
|
115
|
+
}
|
|
116
|
+
const isAbsolute = function(p) {
|
|
117
|
+
return _IS_ABSOLUTE_RE.test(p);
|
|
118
|
+
};
|
|
119
|
+
const relative = function(from, to) {
|
|
120
|
+
const _from = resolve(from).replace(_ROOT_FOLDER_RE, "$1").split("/");
|
|
121
|
+
const _to = resolve(to).replace(_ROOT_FOLDER_RE, "$1").split("/");
|
|
122
|
+
if (_to[0][1] === ":" && _from[0][1] === ":" && _from[0] !== _to[0]) return _to.join("/");
|
|
123
|
+
const _fromCopy = [..._from];
|
|
124
|
+
for (const segment of _fromCopy) {
|
|
125
|
+
if (_to[0] !== segment) break;
|
|
126
|
+
_from.shift();
|
|
127
|
+
_to.shift();
|
|
128
|
+
}
|
|
129
|
+
return [..._from.map(() => ".."), ..._to].join("/");
|
|
130
|
+
};
|
|
131
|
+
const dirname = function(p) {
|
|
132
|
+
const segments = normalizeWindowsPath(p).replace(/\/$/, "").split("/").slice(0, -1);
|
|
133
|
+
if (segments.length === 1 && _DRIVE_LETTER_RE.test(segments[0])) segments[0] += "/";
|
|
134
|
+
return segments.join("/") || (isAbsolute(p) ? "/" : ".");
|
|
135
|
+
};
|
|
136
|
+
//#endregion
|
|
137
|
+
//#region src/plugin-islands.ts
|
|
138
|
+
const COMPONENT_EXTENSIONS = [
|
|
139
|
+
".tsx",
|
|
140
|
+
".jsx",
|
|
141
|
+
".ts",
|
|
142
|
+
".js"
|
|
143
|
+
];
|
|
144
|
+
function islandsPlugin(pagesDir) {
|
|
145
|
+
let pageScan = null;
|
|
146
|
+
let isDev = false;
|
|
147
|
+
const root = dirname(pagesDir);
|
|
148
|
+
const islandManifest = /* @__PURE__ */ new Map();
|
|
149
|
+
const islandCssFiles = /* @__PURE__ */ new Set();
|
|
150
|
+
let viteRoot = "";
|
|
151
|
+
const islandCssMap = /* @__PURE__ */ new Map();
|
|
152
|
+
let resolvedConfig = null;
|
|
153
|
+
/** Rebuild islandCssMap from current file contents (re-runs fileHasCssImports). */
|
|
154
|
+
function rebuildCssMapLocal() {
|
|
155
|
+
if (!pageScan) return;
|
|
156
|
+
rebuildIslandCssMap(pageScan, pagesDir, islandCssMap, fileHasCssImports);
|
|
157
|
+
}
|
|
158
|
+
function computePagesNeedingClientJSLocal() {
|
|
159
|
+
if (!pageScan) return /* @__PURE__ */ new Set();
|
|
160
|
+
return computePagesNeedingClientJS(pageScan, pagesDir, resolvedConfig);
|
|
161
|
+
}
|
|
162
|
+
return [{
|
|
163
|
+
name: "void-react:islands",
|
|
164
|
+
configResolved(config) {
|
|
165
|
+
resolvedConfig = config;
|
|
166
|
+
viteRoot = config.root;
|
|
167
|
+
isDev = config.command === "serve";
|
|
168
|
+
},
|
|
169
|
+
configureServer(server) {
|
|
170
|
+
configureIslandCssServer(server, islandCssFiles, viteRoot, rebuildCssMapLocal);
|
|
171
|
+
watchPagesForRescan(server, pagesDir, root, (scan) => {
|
|
172
|
+
pageScan = scan;
|
|
173
|
+
rebuildCssMapLocal();
|
|
174
|
+
});
|
|
175
|
+
},
|
|
176
|
+
async buildStart() {
|
|
177
|
+
if (existsSync(pagesDir)) {
|
|
178
|
+
pageScan = await scanPages(root);
|
|
179
|
+
const importAttrRe = /import\s+\w+\s+from\s+("[^"]+"|'[^']+')\s+with\s*\{\s*island\s*:\s*("[^"]+"|'[^']+')\s*\}/g;
|
|
180
|
+
const filesToScan = [
|
|
181
|
+
...pageScan.pages.map((p) => ({
|
|
182
|
+
filePath: p.componentPath,
|
|
183
|
+
island: p.island
|
|
184
|
+
})),
|
|
185
|
+
...pageScan.layouts.map((l) => ({
|
|
186
|
+
filePath: l.filePath,
|
|
187
|
+
island: l.island
|
|
188
|
+
})),
|
|
189
|
+
...pageScan.namedLayouts.map((nl) => ({
|
|
190
|
+
filePath: nl.filePath,
|
|
191
|
+
island: nl.island
|
|
192
|
+
}))
|
|
193
|
+
];
|
|
194
|
+
for (const entry of filesToScan) {
|
|
195
|
+
if (!entry.island) continue;
|
|
196
|
+
const filePath = resolve(pagesDir, entry.filePath);
|
|
197
|
+
const code = readFileSync(filePath, "utf-8");
|
|
198
|
+
const importerDir = dirname(filePath);
|
|
199
|
+
importAttrRe.lastIndex = 0;
|
|
200
|
+
let m;
|
|
201
|
+
while ((m = importAttrRe.exec(code)) !== null) {
|
|
202
|
+
const spec = m[1].slice(1, -1);
|
|
203
|
+
const strategy = m[2].slice(1, -1);
|
|
204
|
+
const absPath = resolveSpecifier(spec, importerDir, COMPONENT_EXTENSIONS);
|
|
205
|
+
if (absPath) {
|
|
206
|
+
const islandId = normalizePath(relative(root, absPath)).replace(/\.[^.]+$/, "");
|
|
207
|
+
islandManifest.set(islandId, {
|
|
208
|
+
componentPath: absPath,
|
|
209
|
+
islandId,
|
|
210
|
+
hydrate: strategy
|
|
211
|
+
});
|
|
212
|
+
}
|
|
213
|
+
}
|
|
214
|
+
}
|
|
215
|
+
for (const page of pageScan.pages) {
|
|
216
|
+
if (!page.island) continue;
|
|
217
|
+
if (/\.(tsx|jsx)$/.test(page.componentPath)) islandCssFiles.add(normalizePath(resolve(pagesDir, page.componentPath)));
|
|
218
|
+
const layoutChain = resolveEffectiveLayoutChain(page, pageScan.layouts, pageScan.namedLayouts);
|
|
219
|
+
for (const layout of layoutChain) islandCssFiles.add(normalizePath(resolve(pagesDir, layout.filePath)));
|
|
220
|
+
}
|
|
221
|
+
rebuildCssMapLocal();
|
|
222
|
+
}
|
|
223
|
+
},
|
|
224
|
+
resolveId: {
|
|
225
|
+
filter: { id: /^virtual:void-islands-(renderer|client)$|\.(tsx|jsx)\.css$/ },
|
|
226
|
+
handler(source) {
|
|
227
|
+
if (source === ISLANDS_RENDERER_ID || source === ISLANDS_CLIENT_ENTRY_ID) return "\0" + source;
|
|
228
|
+
if (source.endsWith(".css")) {
|
|
229
|
+
const srcPath = normalizePath(source.slice(0, -4));
|
|
230
|
+
if (islandCssFiles.has(srcPath)) return srcPath + ".css";
|
|
231
|
+
if (srcPath.startsWith("/")) {
|
|
232
|
+
const absPath = normalizePath(resolve(viteRoot, srcPath.slice(1)));
|
|
233
|
+
if (islandCssFiles.has(absPath)) return absPath + ".css";
|
|
234
|
+
}
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
},
|
|
238
|
+
load: {
|
|
239
|
+
filter: { id: /^\0virtual:void-islands-(renderer|client)$|\.(tsx|jsx)\.css$/ },
|
|
240
|
+
handler(id) {
|
|
241
|
+
if (id === "\0" + ISLANDS_RENDERER_ID) {
|
|
242
|
+
if (!pageScan) return "export function renderIslandPage() { throw new Error('No pages found'); }";
|
|
243
|
+
const mdPlugin = resolvedConfig?.plugins?.find((p) => p.name === "void-md");
|
|
244
|
+
const mdScriptIds = new Set(mdPlugin?.api?.getClientScripts?.()?.keys() ?? []);
|
|
245
|
+
const needsJS = computePagesNeedingClientJSLocal();
|
|
246
|
+
return generateIslandRenderer(pageScan, pagesDir, isDev, islandCssMap, viteRoot, mdScriptIds, needsJS);
|
|
247
|
+
}
|
|
248
|
+
if (id === "\0" + ISLANDS_CLIENT_ENTRY_ID) {
|
|
249
|
+
if (!pageScan) return "";
|
|
250
|
+
return generateIslandClientEntry(islandManifest, islandCssFiles, isDev);
|
|
251
|
+
}
|
|
252
|
+
if (id.endsWith(".css") && !id.startsWith("\0")) {
|
|
253
|
+
const srcPath = id.slice(0, -4);
|
|
254
|
+
if (islandCssFiles.has(srcPath)) return extractCssImports(srcPath);
|
|
255
|
+
}
|
|
256
|
+
}
|
|
257
|
+
},
|
|
258
|
+
transform: {
|
|
259
|
+
filter: { id: /\.island\.(tsx|jsx)$/ },
|
|
260
|
+
handler(code, id) {
|
|
261
|
+
if (/import\s+\{[^}]*\buseForm\b/.test(code)) this.warn(`islands: useForm cannot be imported in island page '${id}'. Use useIslandForm instead.`);
|
|
262
|
+
const importAttrRe = /import\s+(\w+)\s+from\s+("[^"]+"|'[^']+')\s+with\s*\{\s*island\s*:\s*("[^"]+"|'[^']+')\s*\}/g;
|
|
263
|
+
const importerDir = dirname(id);
|
|
264
|
+
let transformed = code;
|
|
265
|
+
const wrappers = [];
|
|
266
|
+
let idx = 0;
|
|
267
|
+
let match;
|
|
268
|
+
while ((match = importAttrRe.exec(code)) !== null) {
|
|
269
|
+
const name = match[1];
|
|
270
|
+
const specRaw = match[2];
|
|
271
|
+
const strategyRaw = match[3];
|
|
272
|
+
const spec = specRaw.slice(1, -1);
|
|
273
|
+
const strategy = strategyRaw.slice(1, -1);
|
|
274
|
+
const rawName = `_raw_island_${idx++}`;
|
|
275
|
+
const absPath = resolveSpecifier(spec, importerDir, COMPONENT_EXTENSIONS);
|
|
276
|
+
if (absPath) {
|
|
277
|
+
const islandId = normalizePath(relative(root, absPath)).replace(/\.[^.]+$/, "");
|
|
278
|
+
islandManifest.set(islandId, {
|
|
279
|
+
componentPath: absPath,
|
|
280
|
+
islandId,
|
|
281
|
+
hydrate: strategy
|
|
282
|
+
});
|
|
283
|
+
}
|
|
284
|
+
const islandId = absPath ? normalizePath(relative(root, absPath)).replace(/\.[^.]+$/, "") : spec;
|
|
285
|
+
const replacement = `import ${rawName} from ${specRaw}`;
|
|
286
|
+
transformed = transformed.replace(match[0], replacement);
|
|
287
|
+
wrappers.push(`var ${name} = function ${name}(props) { return _React_island.createElement("div", { "data-island": ${JSON.stringify(islandId)}, "data-props": JSON.stringify(props), "data-hydrate": ${JSON.stringify(strategy)} }, _React_island.createElement(${rawName}, props)); };`);
|
|
288
|
+
}
|
|
289
|
+
if (wrappers.length > 0) {
|
|
290
|
+
transformed = `import _React_island from "react";\n` + transformed + "\n" + wrappers.join("\n");
|
|
291
|
+
return {
|
|
292
|
+
code: transformed,
|
|
293
|
+
map: null
|
|
294
|
+
};
|
|
295
|
+
}
|
|
296
|
+
}
|
|
297
|
+
},
|
|
298
|
+
config(_, env) {
|
|
299
|
+
if (!existsSync(pagesDir)) return;
|
|
300
|
+
if (env.command !== "serve" && needsIslandClientBundle(pagesDir, /\.island\.(tsx|jsx)$/, false)) return { build: {
|
|
301
|
+
manifest: true,
|
|
302
|
+
rollupOptions: { input: { "islands-client": ISLANDS_CLIENT_ENTRY_ID } }
|
|
303
|
+
} };
|
|
304
|
+
}
|
|
305
|
+
}];
|
|
306
|
+
}
|
|
307
|
+
function generateIslandRenderer(scan, pagesDir, isDev, islandCssMap, viteRoot, mdScriptIds, pagesNeedingClientJS) {
|
|
308
|
+
const preambleScript = isDev ? `
|
|
309
|
+
<script type="module">
|
|
310
|
+
import RefreshRuntime from "/@react-refresh"
|
|
311
|
+
RefreshRuntime.injectIntoGlobalHook(window)
|
|
312
|
+
window.$RefreshReg$ = () => {}
|
|
313
|
+
window.$RefreshSig$ = () => (type) => type
|
|
314
|
+
window.__vite_plugin_react_preamble_installed__ = true
|
|
315
|
+
<\/script>` : "";
|
|
316
|
+
let cssMapCode = "";
|
|
317
|
+
if (isDev && islandCssMap.size > 0) {
|
|
318
|
+
const cssMapObj = {};
|
|
319
|
+
for (const [compId, paths] of islandCssMap) cssMapObj[compId] = paths.map((p) => "/" + normalizePath(relative(viteRoot, p)) + ".css");
|
|
320
|
+
cssMapCode = `const __cssPaths = ${JSON.stringify(cssMapObj)};`;
|
|
321
|
+
}
|
|
322
|
+
const mdScriptIdsCode = `const __mdClientScriptIds = new Set(${JSON.stringify([...mdScriptIds])});`;
|
|
323
|
+
const needsJSCode = `const __pagesNeedingClientJS = new Set(${JSON.stringify([...pagesNeedingClientJS])});`;
|
|
324
|
+
return `
|
|
325
|
+
import React from "react";
|
|
326
|
+
import { renderToString } from "react-dom/server";
|
|
327
|
+
import { SharedContext, ErrorsContext } from "@void/react";
|
|
328
|
+
import { renderHeadToString, renderHtmlAttrs, renderBodyAttrs } from "void/pages-head";
|
|
329
|
+
|
|
330
|
+
${generateComponentManifest(scan, pagesDir)}
|
|
331
|
+
${cssMapCode}
|
|
332
|
+
${mdScriptIdsCode}
|
|
333
|
+
${needsJSCode}
|
|
334
|
+
|
|
335
|
+
const PREAMBLE_SCRIPT = ${JSON.stringify(preambleScript)};
|
|
336
|
+
|
|
337
|
+
function escapeAttr(s) {
|
|
338
|
+
return String(s).replace(/&/g, "&").replace(/"/g, """).replace(/</g, "<");
|
|
339
|
+
}
|
|
340
|
+
|
|
341
|
+
export async function renderIslandPage(pageObj, assetTags) {
|
|
342
|
+
const PageComponent = (await components[pageObj.component]()).default;
|
|
343
|
+
const layoutIds = layoutTree[pageObj.component] || [];
|
|
344
|
+
const layoutComponents = await Promise.all(
|
|
345
|
+
layoutIds.map(async (id) => (await components[id]()).default)
|
|
346
|
+
);
|
|
347
|
+
|
|
348
|
+
let element = React.createElement(PageComponent, pageObj.props);
|
|
349
|
+
for (let i = layoutComponents.length - 1; i >= 0; i--) {
|
|
350
|
+
element = React.createElement(layoutComponents[i], null, element);
|
|
351
|
+
}
|
|
352
|
+
|
|
353
|
+
// No RouterContext — islands have no Void Router
|
|
354
|
+
element = React.createElement(
|
|
355
|
+
SharedContext.Provider,
|
|
356
|
+
{ value: pageObj.shared || {} },
|
|
357
|
+
React.createElement(
|
|
358
|
+
ErrorsContext.Provider,
|
|
359
|
+
{ value: pageObj.errors || {} },
|
|
360
|
+
element
|
|
361
|
+
)
|
|
362
|
+
);
|
|
363
|
+
|
|
364
|
+
const html = renderToString(element);
|
|
365
|
+
const __mdScriptAttr = __mdClientScriptIds.has(pageObj.component) ? \` data-md-script="\${escapeAttr(pageObj.component)}"\` : "";
|
|
366
|
+
const headHtml = pageObj.head ? renderHeadToString(pageObj.head) : "";
|
|
367
|
+
const htmlAttrs = pageObj.head ? renderHtmlAttrs(pageObj.head) : "";
|
|
368
|
+
const bodyAttrs = pageObj.head ? renderBodyAttrs(pageObj.head) : "";
|
|
369
|
+
|
|
370
|
+
return \`<!doctype html>
|
|
371
|
+
<html\${htmlAttrs}>
|
|
372
|
+
<head>\${headHtml}\${typeof __cssPaths !== "undefined" ? (__cssPaths[pageObj.component] || []).map(url => '<link rel="stylesheet" href="' + url + '">').join("\\n") : ""}\${PREAMBLE_SCRIPT}\${assetTags.css}\${__pagesNeedingClientJS.has(pageObj.component) ? assetTags.preloads : ""}</head>
|
|
373
|
+
<body\${bodyAttrs}>
|
|
374
|
+
<div id="app"\${__mdScriptAttr}>\${html}</div>
|
|
375
|
+
\${__pagesNeedingClientJS.has(pageObj.component) ? assetTags.body : ""}
|
|
376
|
+
</body>
|
|
377
|
+
</html>\`;
|
|
378
|
+
}
|
|
379
|
+
`;
|
|
380
|
+
}
|
|
381
|
+
function generateIslandClientEntry(manifest, cssFiles, isDev) {
|
|
382
|
+
const entries = [...manifest.values()];
|
|
383
|
+
const uniqueIslands = /* @__PURE__ */ new Map();
|
|
384
|
+
for (const entry of entries) uniqueIslands.set(entry.islandId, entry.componentPath);
|
|
385
|
+
const lines = [];
|
|
386
|
+
lines.push("import { initIslands } from \"void/pages-client\";");
|
|
387
|
+
if (!isDev) {
|
|
388
|
+
const cssImportRe = /^\s*import\b[^"']*["']([^"']+\.(?:css|scss|sass|less|styl|stylus|pcss|postcss))["']/gm;
|
|
389
|
+
for (const file of cssFiles) {
|
|
390
|
+
const content = readFileSync(file, "utf-8");
|
|
391
|
+
cssImportRe.lastIndex = 0;
|
|
392
|
+
let match;
|
|
393
|
+
while ((match = cssImportRe.exec(content)) !== null) lines.push(rewriteCssImportForVirtualModule(match[0], match[1], file));
|
|
394
|
+
}
|
|
395
|
+
}
|
|
396
|
+
lines.push("const islands = {");
|
|
397
|
+
for (const [id, path] of uniqueIslands) lines.push(` ${JSON.stringify(id)}: () => import(${JSON.stringify(path)}),`);
|
|
398
|
+
lines.push("};");
|
|
399
|
+
lines.push(`
|
|
400
|
+
async function hydrateIsland(el, mod, props) {
|
|
401
|
+
const { hydrateRoot } = await import("react-dom/client");
|
|
402
|
+
const React = await import("react");
|
|
403
|
+
const Component = mod.default || mod;
|
|
404
|
+
hydrateRoot(el, React.createElement(Component, props));
|
|
405
|
+
el.setAttribute("data-hydrated", "true");
|
|
406
|
+
}
|
|
407
|
+
|
|
408
|
+
initIslands(islands, hydrateIsland);
|
|
409
|
+
`);
|
|
410
|
+
return lines.join("\n");
|
|
411
|
+
}
|
|
412
|
+
//#endregion
|
|
413
|
+
//#region src/plugin-pages.ts
|
|
414
|
+
const RENDERER_ID = "virtual:void-pages-renderer";
|
|
415
|
+
const CLIENT_ENTRY_ID = "virtual:void-pages-client";
|
|
416
|
+
/** Check if the pages directory has any non-island page files (.tsx/.jsx without .island.). */
|
|
417
|
+
function hasNonIslandPages(dir) {
|
|
418
|
+
try {
|
|
419
|
+
for (const entry of readdirSync(dir, {
|
|
420
|
+
withFileTypes: true,
|
|
421
|
+
recursive: true
|
|
422
|
+
})) {
|
|
423
|
+
if (!entry.isFile()) continue;
|
|
424
|
+
const name = entry.name;
|
|
425
|
+
if (name.startsWith("_") || name.startsWith("layout.")) continue;
|
|
426
|
+
if (/\.(tsx|jsx)$/.test(name) && !name.includes(".island.")) return true;
|
|
427
|
+
}
|
|
428
|
+
} catch {}
|
|
429
|
+
return false;
|
|
430
|
+
}
|
|
431
|
+
function pagesPlugin(pagesDir, options) {
|
|
432
|
+
let pageScan = null;
|
|
433
|
+
let isDev = false;
|
|
434
|
+
let viteConfig;
|
|
435
|
+
const root = dirname(pagesDir);
|
|
436
|
+
return {
|
|
437
|
+
name: "void-react:pages",
|
|
438
|
+
async buildStart() {
|
|
439
|
+
if (existsSync(pagesDir)) pageScan = await scanPages(root);
|
|
440
|
+
},
|
|
441
|
+
resolveId: {
|
|
442
|
+
filter: { id: /^virtual:void-pages-(renderer|client)$/ },
|
|
443
|
+
handler(id) {
|
|
444
|
+
return "\0" + id;
|
|
445
|
+
}
|
|
446
|
+
},
|
|
447
|
+
load: {
|
|
448
|
+
filter: { id: /^\0virtual:void-pages-(renderer|client)$/ },
|
|
449
|
+
handler(id) {
|
|
450
|
+
if (id === "\0" + RENDERER_ID) {
|
|
451
|
+
if (!pageScan) return "export function renderPage() { throw new Error('No pages found'); }";
|
|
452
|
+
return generateRendererModule(pageScan, pagesDir, isDev);
|
|
453
|
+
}
|
|
454
|
+
if (id === "\0" + CLIENT_ENTRY_ID) {
|
|
455
|
+
if (!pageScan) return "";
|
|
456
|
+
return generateClientEntry(pageScan, pagesDir, options?.viewTransitions, options?.prefetch, resolveStaticPageDataBuildOptions(root, { publicDir: viteConfig?.publicDir }));
|
|
457
|
+
}
|
|
458
|
+
}
|
|
459
|
+
},
|
|
460
|
+
configResolved(config) {
|
|
461
|
+
viteConfig = config;
|
|
462
|
+
},
|
|
463
|
+
config(_, env) {
|
|
464
|
+
if (!existsSync(pagesDir)) return;
|
|
465
|
+
if (env.command === "serve") {
|
|
466
|
+
isDev = true;
|
|
467
|
+
const reactOptimizeDeps = [
|
|
468
|
+
"react",
|
|
469
|
+
"react/jsx-runtime",
|
|
470
|
+
"react/jsx-dev-runtime",
|
|
471
|
+
"react-dom",
|
|
472
|
+
"react-dom/client",
|
|
473
|
+
"react-dom/server"
|
|
474
|
+
];
|
|
475
|
+
return {
|
|
476
|
+
optimizeDeps: {
|
|
477
|
+
exclude: ["@void/react"],
|
|
478
|
+
include: reactOptimizeDeps
|
|
479
|
+
},
|
|
480
|
+
ssr: { optimizeDeps: { include: reactOptimizeDeps } }
|
|
481
|
+
};
|
|
482
|
+
}
|
|
483
|
+
if (!hasNonIslandPages(pagesDir)) return;
|
|
484
|
+
return { build: {
|
|
485
|
+
manifest: true,
|
|
486
|
+
rollupOptions: { input: { "pages-client": CLIENT_ENTRY_ID } }
|
|
487
|
+
} };
|
|
488
|
+
}
|
|
489
|
+
};
|
|
490
|
+
}
|
|
491
|
+
function generateRendererModule(scan, pagesDir, isDev) {
|
|
492
|
+
const preambleScript = isDev ? `
|
|
493
|
+
<script type="module">
|
|
494
|
+
import RefreshRuntime from "/@react-refresh"
|
|
495
|
+
RefreshRuntime.injectIntoGlobalHook(window)
|
|
496
|
+
window.$RefreshReg$ = () => {}
|
|
497
|
+
window.$RefreshSig$ = () => (type) => type
|
|
498
|
+
window.__vite_plugin_react_preamble_installed__ = true
|
|
499
|
+
<\/script>` : "";
|
|
500
|
+
return `
|
|
501
|
+
import { renderReactPage } from "@void/react/pages-server";
|
|
502
|
+
|
|
503
|
+
${generateComponentManifest(scan, pagesDir)}
|
|
504
|
+
|
|
505
|
+
const PREAMBLE_SCRIPT = ${JSON.stringify(preambleScript)};
|
|
506
|
+
|
|
507
|
+
export async function renderPage(pageObj, assetTags) {
|
|
508
|
+
return renderReactPage({
|
|
509
|
+
pageObj,
|
|
510
|
+
assetTags,
|
|
511
|
+
components,
|
|
512
|
+
layoutTree,
|
|
513
|
+
preambleScript: PREAMBLE_SCRIPT,
|
|
514
|
+
});
|
|
515
|
+
}
|
|
516
|
+
`;
|
|
517
|
+
}
|
|
518
|
+
function generateClientEntry(scan, pagesDir, viewTransitions, prefetch, staticPageData) {
|
|
519
|
+
return `
|
|
520
|
+
import { startReactPages } from "@void/react/pages-client";
|
|
521
|
+
import { parseCacheFor } from "void/pages-prefetch";
|
|
522
|
+
|
|
523
|
+
${generateComponentManifest(scan, pagesDir)}
|
|
524
|
+
|
|
525
|
+
const { router } = await startReactPages({
|
|
526
|
+
components,
|
|
527
|
+
layoutTree,
|
|
528
|
+
routeMeta,
|
|
529
|
+
matchRoute,
|
|
530
|
+
staticPageData: ${!!staticPageData?.enabled},
|
|
531
|
+
staticPageDataFastPath: ${!!staticPageData?.fastPath},
|
|
532
|
+
viewTransitions: ${!!viewTransitions},
|
|
533
|
+
prefetchHoverDelay: ${prefetch?.hoverDelay ?? 75},
|
|
534
|
+
prefetchDefaultCacheFor: parseCacheFor(${JSON.stringify(prefetch?.cacheFor ?? "30s")}),
|
|
535
|
+
});
|
|
536
|
+
export { router };
|
|
537
|
+
`;
|
|
538
|
+
}
|
|
539
|
+
//#endregion
|
|
540
|
+
//#region src/plugin.ts
|
|
541
|
+
function voidReact(options) {
|
|
542
|
+
const pagesDir = join(process.cwd(), "pages");
|
|
543
|
+
return [
|
|
544
|
+
...react(options?.react),
|
|
545
|
+
pagesPlugin(pagesDir, {
|
|
546
|
+
viewTransitions: options?.viewTransitions,
|
|
547
|
+
prefetch: options?.prefetch
|
|
548
|
+
}),
|
|
549
|
+
...islandsPlugin(pagesDir)
|
|
550
|
+
];
|
|
551
|
+
}
|
|
552
|
+
//#endregion
|
|
553
|
+
export { voidReact };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import { a as RouterContext, c as setActionRouter, d as useForm, f as useShared, i as NavigationContext, l as useIslandForm, m as Link, n as InferProps, o as SharedContext, p as useRouter, r as ErrorsContext, s as action, t as Deferred, u as useNavigation } from "../index-6hxGVqsE.mjs";
|
|
2
|
+
export { Deferred, ErrorsContext, InferProps, Link, NavigationContext, RouterContext, SharedContext, action, setActionRouter, useForm, useIslandForm, useNavigation, useRouter, useShared };
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
import { i as SharedContext, n as NavigationContext, r as RouterContext, t as ErrorsContext } from "../context-BCeFV8Jy.mjs";
|
|
2
|
+
import { a as useRouter, i as useShared, n as useNavigation, o as Link, r as useForm, t as useIslandForm } from "../runtime-C24S_Dlg.mjs";
|
|
3
|
+
import { n as setActionRouter, t as action } from "../action-BFWtavbf.mjs";
|
|
4
|
+
export { ErrorsContext, Link, NavigationContext, RouterContext, SharedContext, action, setActionRouter, useForm, useIslandForm, useNavigation, useRouter, useShared };
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
import { ComponentType } from "react";
|
|
2
|
+
import { VoidRouter } from "void/pages-client";
|
|
3
|
+
import { CacheForResult } from "void/pages-prefetch";
|
|
4
|
+
|
|
5
|
+
//#region src/runtime/pages-client.d.ts
|
|
6
|
+
type ComponentModule = {
|
|
7
|
+
default: ComponentType<any>;
|
|
8
|
+
};
|
|
9
|
+
interface ReactPagesConfig {
|
|
10
|
+
components: Record<string, () => Promise<ComponentModule>>;
|
|
11
|
+
layoutTree: Record<string, Array<string>>;
|
|
12
|
+
routeMeta: Record<string, {
|
|
13
|
+
island?: boolean;
|
|
14
|
+
}>;
|
|
15
|
+
matchRoute(url: string): string | null;
|
|
16
|
+
staticPageData: boolean;
|
|
17
|
+
staticPageDataFastPath: boolean;
|
|
18
|
+
viewTransitions: boolean;
|
|
19
|
+
prefetchHoverDelay: number;
|
|
20
|
+
prefetchDefaultCacheFor: CacheForResult;
|
|
21
|
+
}
|
|
22
|
+
interface ReactPagesClient {
|
|
23
|
+
router: VoidRouter;
|
|
24
|
+
}
|
|
25
|
+
declare function startReactPages(config: ReactPagesConfig): Promise<ReactPagesClient>;
|
|
26
|
+
//#endregion
|
|
27
|
+
export { ReactPagesClient, ReactPagesConfig, startReactPages };
|