@withl5e/l5e 1.0.1 → 1.1.0-alpha.1

package/dist/vite-plugin.js

@@ -1,333 +1,2 @@
-import { t as e } from "./global-style-Cgno-yNl.js";
-import { existsSync as t, mkdirSync as n, readFileSync as r, readdirSync as i, rmSync as a, statSync as o, writeFileSync as s } from "fs";
-import { transform as c } from "esbuild";
-import { dirname as l, join as u, relative as d, resolve as f } from "path";
-//#region src/core/vite-plugin.ts
-var p = "virtual:l5e-views", m = "virtual:l5e-route", h = "virtual:l5e-ssr-entry", g = "virtual:l5e-global-loader", _ = "virtual:l5e-island-strategies", v = "virtual:l5e-islands", y = "virtual:l5e-actions", b = "virtual:l5e-middleware", x = /* @__PURE__ */ new Set([
-	"MODE",
-	"BASE_URL",
-	"PROD",
-	"DEV",
-	"SSR",
-	"LEGACY"
-]);
-function S(e, t = []) {
-	let n = i(e);
-	for (let r of n) {
-		let n = u(e, r);
-		if (o(n).isDirectory()) {
-			if (r === "node_modules" || r === "dist" || r === ".git") continue;
-			S(n, t);
-		} else (r.endsWith(".tsx") || r.endsWith(".ts")) && t.push(n);
-	}
-	return t;
-}
-function C(e) {
-	let t = 0;
-	for (let n = 0; n < e.length; n++) t = (t << 5) - t + e.charCodeAt(n), t &= t;
-	return Math.abs(t).toString(16).slice(0, 4);
-}
-function w(e) {
-	let t = e.split("/"), n = t[t.length - 1];
-	return n = n.replace(/\.(tsx?|jsx?)$/, ""), n;
-}
-function T(e) {
-	return `${w(e)}_${C(e)}`;
-}
-function E(e, n) {
-	let r = e.replace(/^\//, ""), i = f(n, r);
-	for (let e of [
-		".tsx",
-		".ts",
-		".jsx",
-		".js"
-	]) if (t(i + e)) return r + e;
-	return t(i) ? r : null;
-}
-function D(e, t) {
-	let n = r(e, "utf-8"), i = [], a = /<ClientIsland\s[^>]*?from\s*=\s*"([^"]+)"/g, o = /* @__PURE__ */ new Set(), s;
-	for (; (s = a.exec(n)) !== null;) {
-		let n = s[1], r;
-		if (n.startsWith("~/")) r = "/src/" + n.substring(2);
-		else if (n.startsWith("/src/")) r = n;
-		else if (n.startsWith("./") || n.startsWith("../")) {
-			let i = f(e, "..", n);
-			r = "/" + d(t, i).replace(/\\/g, "/");
-		} else r = n;
-		let a = E(r, t);
-		if (!a) {
-			console.warn(`[l5e] Island component not found: ${r} (from ${n} in ${e})`);
-			continue;
-		}
-		let c = T(r);
-		o.has(c) || (o.add(c), i.push({
-			component: w(r),
-			resolvedPath: r,
-			src: a,
-			key: c
-		}));
-	}
-	return i;
-}
-function O(e, t) {
-	let n = r(e, "utf-8"), i = [], a = [], o = /useCss\s*\(\s*['"]([^'"]+)['"]\s*,?\s*\)/g, s = /useClientJs\s*\(\s*['"]([^'"]+)['"]\s*,?\s*\)/g, c;
-	for (; (c = o.exec(n)) !== null;) {
-		let n = c[1];
-		if (n.startsWith("/src/")) i.push(n);
-		else if (n.startsWith("./") || n.startsWith("../")) {
-			let r = f(e, "..", n), a = "/" + d(t, r).replace(/\\/g, "/");
-			i.push(a);
-		} else i.push(n);
-	}
-	for (; (c = s.exec(n)) !== null;) {
-		let n = c[1];
-		if (n.startsWith("/src/")) a.push(n);
-		else if (n.startsWith("./") || n.startsWith("../")) {
-			let r = f(e, "..", n), i = "/" + d(t, r).replace(/\\/g, "/");
-			a.push(i);
-		} else a.push(n);
-	}
-	return {
-		css: i,
-		js: a
-	};
-}
-function k(n) {
-	let i = {}, a = u(n, "src"), s = /* @__PURE__ */ new Map(), c = /* @__PURE__ */ new Map(), p = /* @__PURE__ */ new Map(), m = /* @__PURE__ */ new Map();
-	try {
-		if (!o(a).isDirectory()) return {
-			input: i,
-			islandRegistry: s,
-			pathToKey: c,
-			keyToSrc: p,
-			actionRegistry: m
-		};
-		let h = u(n, "src", "client.global.ts");
-		t(h) && (i.global = h, console.log("[l5e] Detected src/client.global.ts and added as entry"));
-		let g = e(n);
-		g && (i["global-style"] = g, console.log("[l5e] Detected src/global.css and added as global stylesheet"));
-		let _ = S(a), v = /* @__PURE__ */ new Set(), y = /* @__PURE__ */ new Set();
-		for (let e of _) {
-			let { css: t, js: i } = O(e, n);
-			t.forEach((e) => v.add(e)), i.forEach((e) => y.add(e));
-			let o = D(e, n);
-			for (let e of o) s.set(e.key, e.resolvedPath), c.set(e.resolvedPath, e.key), p.set(e.key, e.src);
-			let u = e.replace(/\\/g, "/");
-			if (/\/actions\.(ts|tsx)$/.test(u)) {
-				let t = r(e, "utf-8"), n = /export\s+const\s+(\w+)\s*=\s*defineAction\s*\(/g, i, o = d(a, l(e)).replace(/\\/g, "/") || ".";
-				for (; (i = n.exec(t)) !== null;) {
-					let e = i[1], t = `${e}_${C(o)}`;
-					m.set(t, {
-						modulePath: o,
-						actionName: e
-					});
-				}
-			}
-		}
-		for (let e of v) {
-			let r = e.startsWith("/src/") || e.startsWith("/") ? e.substring(1) : e, a = f(n, r);
-			if (g && f(a) === f(g)) continue;
-			if (!t(a)) {
-				console.warn(`[l5e] CSS file not found: ${a} (from ${e})`);
-				continue;
-			}
-			let o = r.replace(/^src\//, "").replace(/\.css$/, "").replace(/\//g, "-").replace(/\\/g, "-");
-			i[o] = a;
-		}
-		for (let e of y) {
-			let r = e.startsWith("/src/") || e.startsWith("/") ? e.substring(1) : e, a = f(n, r);
-			if (!t(a)) {
-				console.warn(`[l5e] JS/TS file not found: ${a} (from ${e})`);
-				continue;
-			}
-			let o = r.replace(/^src\//, "").replace(/\.(ts|tsx|js|jsx)$/, "").replace(/\//g, "-").replace(/\\/g, "-");
-			i[o] = a;
-		}
-		for (let [e, t] of p) {
-			let r = f(n, t);
-			i[`island-${e}`] = r;
-		}
-		s.size > 0 && console.log(`[l5e] Detected ${s.size} island(s)`), m.size > 0 && console.log(`[l5e] Detected ${m.size} action(s)`);
-	} catch (e) {
-		console.warn("[l5e] Failed to discover bundler input:", e);
-	}
-	return {
-		input: i,
-		islandRegistry: s,
-		pathToKey: c,
-		keyToSrc: p,
-		actionRegistry: m
-	};
-}
-function A(e, t, n, r, i) {
-	let a = [], o = 0, s = /ClientIsland\s*,\s*\{/g, c;
-	for (; (c = s.exec(e)) !== null;) {
-		let s = c.index + c[0].length, l = e.substring(s, s + 500), u = /from:\s*"([^"]+)"/.exec(l);
-		if (!u) continue;
-		let p = u[1], m;
-		if (p.startsWith("~/")) m = "/src/" + p.substring(2);
-		else if (p.startsWith("/src/")) m = p;
-		else if (p.startsWith("./") || p.startsWith("../")) {
-			let e = f(t, "..", p);
-			m = "/" + d(n, e).replace(/\\/g, "/");
-		} else m = p;
-		let h = r.get(m);
-		if (!h) continue;
-		let g = i.get(h);
-		if (!g) continue;
-		let _ = s + u.index + u[0].length;
-		a.push(e.substring(o, _)), a.push(`, __key: "${h}", __src: "${g}"`), o = _;
-	}
-	return a.push(e.substring(o)), a.join("");
-}
-function j() {
-	let e = process.cwd(), r = /* @__PURE__ */ new Map(), i = /* @__PURE__ */ new Map(), o = /* @__PURE__ */ new Map();
-	return {
-		name: "l5e-jsx-classic",
-		enforce: "pre",
-		configResolved(t) {
-			e = t.root || process.cwd();
-		},
-		handleHotUpdate({ file: t, server: n }) {
-			let r = d(e, t);
-			if (/actions\.(ts|tsx)$/.test(t)) {
-				o = k(e).actionRegistry;
-				let t = n.moduleGraph.getModuleById("\0virtual:l5e-actions");
-				t && n.moduleGraph.invalidateModule(t), console.log(`[l5e] Action file changed: ${r} — re-scanned ${o.size} action(s)`);
-			}
-			if (t.endsWith(".css")) {
-				console.log(`[l5e] CSS changed: ${r} - using Vite HMR`);
-				return;
-			}
-			if (t.includes("client.ts")) {
-				console.log(`[l5e] Client JS changed: ${r} - using Vite HMR`);
-				return;
-			}
-			if (t.includes("/src/") || t.includes("\\src\\")) return console.log(`[l5e] SSR file changed: ${r} - triggering full reload`), n.ws.send({
-				type: "full-reload",
-				path: "*"
-			}), [];
-		},
-		buildEnd() {
-			let n = u(e, ".l5e-temp");
-			if (t(n)) try {
-				a(n, {
-					recursive: !0,
-					force: !0
-				}), console.log("[l5e] Cleaned up temporary files");
-			} catch (e) {
-				console.warn("[l5e] Failed to cleanup temporary files:", e);
-			}
-		},
-		writeBundle(r, i) {
-			if (o.size > 0) {
-				let r = u(e, "dist", "server");
-				t(r) || n(r, { recursive: !0 });
-				let i = Object.fromEntries(o);
-				s(u(r, "action-registry.json"), JSON.stringify(i), "utf-8"), console.log(`[l5e] Wrote action-registry.json (${o.size} actions)`);
-			}
-		},
-		config(e) {
-			let t = k(e.root || process.cwd());
-			t.islandRegistry, r = t.pathToKey, i = t.keyToSrc, o = t.actionRegistry;
-			let n = e.build?.rolldownOptions?.input || {}, a = typeof n == "object" && !Array.isArray(n) ? {
-				...t.input,
-				...n
-			} : t.input;
-			return { build: { rolldownOptions: {
-				...e.build?.rolldownOptions,
-				input: Object.keys(a).length > 0 ? a : void 0,
-				preserveEntrySignatures: "exports-only"
-			} } };
-		},
-		resolveId(e) {
-			return e === p ? "\0virtual:l5e-views" : e === m ? "\0virtual:l5e-route" : e === h ? "\0virtual:l5e-ssr-entry" : e === g ? "\0virtual:l5e-global-loader" : e === _ ? "\0virtual:l5e-island-strategies" : e === v ? "\0virtual:l5e-islands" : e === y ? "\0virtual:l5e-actions" : e === b ? "\0virtual:l5e-middleware" : null;
-		},
-		async transform(t, n, a) {
-			if (n.replace(/\\/g, "/").endsWith("src/client.global.ts") && !a?.ssr) return {
-				code: `import '@withl5e/l5e/island/runtime';\n${t}`,
-				map: null
-			};
-			if (!a?.ssr) {
-				let e = n.replace(/\\/g, "/").match(/\/src\/(.+)\/actions\.(ts|tsx)$/);
-				if (e) {
-					let n = e[1], r = /export\s+const\s+(\w+)\s*=\s*defineAction\s*\(/g, i = [], a;
-					for (; (a = r.exec(t)) !== null;) {
-						let e = a[1], n = t.substring(a.index, a.index + 500).match(/method:\s*['"](\w+)['"]/), r = n ? n[1].toUpperCase() : "GET";
-						i.push({
-							name: e,
-							method: r
-						});
-					}
-					if (i.length > 0) return {
-						code: i.map(({ name: e, method: t }) => {
-							let r = `${e}_${C(n)}`;
-							return t === "GET" ? `export async function ${e}(params) {
-  const res = await fetch('/_l5e/action/${r}?' + new URLSearchParams(params));
-  if (!res.ok) throw Object.assign(new Error('HTTP ' + res.status), { status: res.status });
-  return res;
-}` : `export async function ${e}(body) {
-  const res = await fetch('/_l5e/action/${r}', {
-    method: '${t}',
-    headers: { 'Content-Type': 'application/json' },
-    body: JSON.stringify(body),
-  });
-  if (!res.ok) throw Object.assign(new Error('HTTP ' + res.status), { status: res.status });
-  return res;
-}`;
-						}).join("\n\n"),
-						map: null
-					};
-				}
-			}
-			if (n.includes("node_modules") || n.includes("/react/") || n.includes("\\react\\")) return null;
-			if (/\.(tsx|jsx)$/.test(n)) try {
-				let a = `import { Fragment as __Fragment, jsxFactory } from "@withl5e/l5e/jsx-runtime"\n${t}`, o = await c(a, {
-					loader: n.endsWith(".tsx") ? "tsx" : "jsx",
-					jsx: "transform",
-					jsxFactory: "jsxFactory",
-					jsxFragment: "__Fragment",
-					sourcemap: !0,
-					sourcefile: n,
-					target: "es2020"
-				}), s = o.code;
-				return s.includes("ClientIsland") && (s = A(s, n, e, r, i)), {
-					code: s,
-					map: o.map || null
-				};
-			} catch (e) {
-				throw console.error(`[l5e] Failed to transform JSX in ${n}:`, e), e;
-			}
-			if (a?.ssr) {
-				let e = t, n = !1;
-				if (e = e.replace(/import\.meta\.env\.([a-zA-Z_][a-zA-Z0-9_]*)/g, (e, t) => x.has(t) ? e : (n = !0, `process.env.${t}`)), e = e.replace(/import\.meta\.env\[(['"`])([^'"`]+)\1\]/g, (e, t, r) => x.has(r) ? e : (n = !0, `process.env[${t}${r}${t}]`)), n) return {
-					code: e,
-					map: null
-				};
-			}
-			return null;
-		},
-		load(n) {
-			if (n === "\0virtual:l5e-views") return "\nexport const viewLoaders = import.meta.glob('/src/views/*/loader.{ts,tsx}');\nexport const viewComponents = import.meta.glob('/src/views/*/index.tsx');\n";
-			if (n === "\0virtual:l5e-route") return "export default function routeHandler(requestInfo) {\n  return import('/src/route.ts').then((mod) => mod.default(requestInfo));\n}";
-			if (n === "\0virtual:l5e-ssr-entry") return "export { render } from '@withl5e/l5e/entry-server';\nexport { viewActions } from 'virtual:l5e-actions';";
-			if (n === "\0virtual:l5e-global-loader") return "export const globalLoader = import.meta.glob('/src/global-loader.{ts,tsx}', { eager: false });";
-			if (n === "\0virtual:l5e-actions") {
-				let e = Object.fromEntries(o);
-				return `export const viewActions = import.meta.glob('/src/**/actions.{ts,tsx}');
-export const actionRegistry = ${JSON.stringify(e)};`;
-			}
-			if (n === "\0virtual:l5e-middleware") return "\nconst middlewareModules = import.meta.glob([\n  '/src/middleware.{ts,tsx,js,jsx}',\n  '/src/middleware/index.{ts,tsx,js,jsx}',\n]);\n\nconst middlewarePaths = [\n  '/src/middleware.ts',\n  '/src/middleware.tsx',\n  '/src/middleware.js',\n  '/src/middleware.jsx',\n  '/src/middleware/index.ts',\n  '/src/middleware/index.tsx',\n  '/src/middleware/index.js',\n  '/src/middleware/index.jsx',\n];\n\nexport async function loadMiddleware() {\n  const middlewarePath = middlewarePaths.find((path) => middlewareModules[path]);\n  if (!middlewarePath) return undefined;\n\n  const mod = await middlewareModules[middlewarePath]();\n  return mod.onRequest;\n}\n";
-			if (n === "\0virtual:l5e-islands") return "export const islandModules = import.meta.glob('/src/**/react/*.{tsx,jsx}');";
-			if (n === "\0virtual:l5e-island-strategies") {
-				let n = u(e, "src", "island-strategies.ts");
-				return t(n) ? "import '/src/island-strategies.ts';" : "/* no custom island strategies */";
-			}
-			return null;
-		}
-	};
-}
-//#endregion
-export { j as coreVite, j as default };
-
-//# sourceMappingURL=vite-plugin.js.map
+import { t as e } from "./vite-plugin-R3LFxv9a.js";
+export { e as coreVite, e as default };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@withl5e/l5e",
-  "version": "1.0.1",
+  "version": "1.1.0-alpha.1",
   "description": "HTML-first SSR MPA framework with loaders, middleware, islands, actions, swap, SEO and cache controls.",
   "type": "module",
   "license": "MIT",
@@ -16,6 +16,8 @@
   "sideEffects": [
     "**/island/runtime.ts",
     "**/island/runtime.js",
+    "**/island/compact-runtime.ts",
+    "**/island/compact-runtime.js",
     "**/*.css"
   ],
   "exports": {
@@ -79,6 +81,10 @@
       "types": "./src/island/runtime.ts",
       "default": "./dist/island/runtime.js"
     },
+    "./island/compact-runtime": {
+      "types": "./src/island/compact-runtime.ts",
+      "default": "./dist/island/compact-runtime.js"
+    },
     "./router": {
       "types": "./src/router/index.ts",
       "default": "./dist/router.js"

package/src/core/bundler.ts

@@ -43,6 +43,16 @@ interface BundleResult {
   content: string;
 }
 
+export interface ScriptBundleOptions {
+  compact?: boolean;
+  islands?: Array<{ key: string; script: string }>;
+  renderer?: string;
+  name?: 'global' | 'bundle' | 'shared';
+  sharedUrl?: string;
+  globalUrl?: string;
+  exportScripts?: string[];
+}
+
 const EMPTY_RESULT: BundleResult = { hash: '', filename: '', content: '' };
 
 // Memory map để lưu bundled files
@@ -120,22 +130,78 @@ function preserveBuildChunksPlugin(policy: ScriptBundlePolicy): Plugin {
   };
 }
 
+function compactBuildPlugin(
+  policy: ScriptBundlePolicy,
+  sharedUrl?: string,
+  globalUrl?: string,
+): Plugin {
+  return {
+    name: 'compact-build-graph',
+    resolveId(source, importer) {
+      if (!importer || source === VIRTUAL_ENTRY_ID) return null;
+      const file = path.isAbsolute(source)
+        ? path.normalize(source)
+        : source.startsWith('/')
+          ? policy.fileForAssetUrl(source)
+        : source.startsWith('.')
+          ? path.resolve(path.dirname(importer), source)
+          : null;
+      if (!file) return null;
+      return policy.isShared(file) && sharedUrl
+        ? { id: sharedUrl, external: 'absolute' }
+        : policy.isGlobalOwned(file) && globalUrl
+          ? { id: globalUrl, external: 'absolute' }
+        : { id: file };
+    },
+  };
+}
+
 async function runScriptBundle(
   uniquePaths: string[],
   policy: ScriptBundlePolicy,
+  options: ScriptBundleOptions = {},
 ): Promise<BundleResult> {
   const roots = uniquePaths.map((p) => policy.fileForScript(p));
+  const compact = options.compact && policy.compact;
   const suffix = policy.inlineableRoots(roots);
   const prefixChunks = new Map(
     roots.flatMap((file, index) =>
       !policy.isPreserved(file) && !suffix.has(file) ? [[file, `entry-${index}`] as const] : [],
     ),
   );
-  const entryContent = roots.map((filePath) => `import ${JSON.stringify(filePath)};`).join('\n');
+  const islands = (options.islands || []).map(({ key, script }) => ({
+    key,
+    file: policy.fileForScript(script),
+  }));
+  const renderer = options.renderer ? policy.fileForScript(options.renderer) : undefined;
+  const exportFiles = (options.exportScripts || []).map((script) => policy.fileForScript(script));
+  const entryContent = [
+    ...roots.map((filePath) =>
+      options.name === 'shared'
+        ? `export * from ${JSON.stringify(filePath)};`
+        : `import ${JSON.stringify(filePath)};`,
+    ),
+    ...exportFiles.map((filePath) => `export * from ${JSON.stringify(filePath)};`),
+    ...(islands.length
+      ? [
+          'globalThis.__L5E_ISLANDS__ ||= {};',
+          ...islands.map(
+            ({ key, file }) =>
+              `globalThis.__L5E_ISLANDS__[${JSON.stringify(key)}] = async () => { const [renderer, module] = await Promise.all([import(${JSON.stringify(renderer)}), import(${JSON.stringify(file)})]); return { reactDomClient: renderer.reactDomClient, createElement: renderer.createElement, module }; };`,
+          ),
+          'globalThis.__L5E_BOOT_ISLANDS__?.();',
+        ]
+      : []),
+  ].join('\n');
 
   const rolldownOptions: InputOptions = {
     input: VIRTUAL_ENTRY_ID,
-    plugins: [virtualEntryPlugin(entryContent), preserveBuildChunksPlugin(policy)],
+    plugins: [
+      virtualEntryPlugin(entryContent),
+      compact
+        ? compactBuildPlugin(policy, options.sharedUrl, options.globalUrl)
+        : preserveBuildChunksPlugin(policy),
+    ],
     platform: 'neutral',
     tsconfig: false,
     // Runtime scripts are imported for their side effects. Do not let an app's
@@ -156,9 +222,12 @@ async function runScriptBundle(
 
   const outputOptions: OutputOptions = {
     format: 'es',
-    codeSplitting: { groups: [{ name: (id) => prefixChunks.get(id) ?? null }] },
+    codeSplitting: compact
+      ? false
+      : { groups: [{ name: (id) => prefixChunks.get(id) ?? null }] },
     minify: false,
-    entryFileNames: 'bundle-[hash].js',
+    entryFileNames: `${options.name || 'bundle'}-[hash].js`,
+    strictExecutionOrder: compact,
     chunkFileNames: `bundle-${generateHash(JSON.stringify(roots))}-[hash].js`,
   };
 
@@ -206,6 +275,7 @@ export async function bundleScripts(
   scriptPaths: string[],
   distClientDir: string,
   policy?: ScriptBundlePolicy,
+  options: ScriptBundleOptions = {},
 ): Promise<BundleResult> {
   if (scriptPaths.length === 0) {
     return EMPTY_RESULT;
@@ -216,11 +286,11 @@ export async function bundleScripts(
     return EMPTY_RESULT;
   }
 
-  const uniquePaths = [...new Set(scriptPaths)].sort();
-  const cacheKey = `scripts:${policy.cacheKey}:${JSON.stringify(uniquePaths)}`;
+  const uniquePaths = [...new Set(scriptPaths)];
+  const cacheKey = `scripts:${policy.cacheKey}:${JSON.stringify([uniquePaths, options])}`;
 
   try {
-    return await dedupe(cacheKey, () => runScriptBundle(uniquePaths, policy));
+    return await dedupe(cacheKey, () => runScriptBundle(uniquePaths, policy, options));
   } catch (error) {
     console.error('[bundler] Error bundling scripts:', error);
     return EMPTY_RESULT;