@zntc/web 0.1.1 → 0.1.3

package/dist/index.js

@@ -3,44 +3,52 @@ import { createHash } from "node:crypto";
 var createHash$1 = createHash;
 import { watch as fsWatch, readdirSync, existsSync, mkdirSync, readFileSync, writeFileSync, cpSync, mkdtempSync, rmSync, symlinkSync } from "node:fs";
 var readFileSync$1 = readFileSync;
+var readdirSync$1 = readdirSync;
 var writeFileSync$1 = writeFileSync;
 var readFileSync$2 = readFileSync;
-var writeFileSync$2 = writeFileSync;
 var readFileSync$3 = readFileSync;
-var writeFileSync$3 = writeFileSync;
+var writeFileSync$2 = writeFileSync;
 var readFileSync$4 = readFileSync;
+var writeFileSync$3 = writeFileSync;
+var readFileSync$5 = readFileSync;
 var writeFileSync$4 = writeFileSync;
 var existsSync$1 = existsSync;
 var mkdirSync$1 = mkdirSync;
 var writeFileSync$5 = writeFileSync;
+var readFileSync$6 = readFileSync;
 import { resolve as resolvePath, join, basename, dirname, relative, sep, extname } from "node:path";
 var resolve = resolvePath;
 var join$1 = join;
 var resolve$1 = resolvePath;
 var basename$1 = basename;
 var join$2 = join;
+var dirname$1 = dirname;
+var resolve$2 = resolvePath;
+var sep$1 = sep;
 var join$3 = join;
 var basename$2 = basename;
-var dirname$1 = dirname;
+var dirname$2 = dirname;
 var basename$3 = basename;
 var relative$1 = relative;
-var sep$1 = sep;
-var dirname$2 = dirname;
+var sep$2 = sep;
+var dirname$3 = dirname;
 var join$4 = join;
 var relative$2 = relative;
-var resolve$2 = resolvePath;
-var sep$2 = sep;
+var resolve$3 = resolvePath;
+var sep$3 = sep;
 import { createRequire } from "node:module";
+var createRequire$1 = createRequire;
 import { tmpdir } from "node:os";
+import { fileURLToPath } from "node:url";
 import { loadEnv, prepareAppDevSync } from "@zntc/core";
 //#region protocol.ts
-const HMR_MSG = Object.freeze({ Connected: "connected", CssUpdate: "css-update", ClearError: "clear-error", Error: "error", FullReload: "full-reload" }),APP_DEV_HMR_CLIENT_PATH = "/__zntc_app_dev_hmr__",APP_DEV_HMR_WS_PATH = "/__hmr",HMR_WS_GUID = "258EAFA5-E914-47DA-95CA-C5AB0DC85B11";
+const HMR_MSG = Object.freeze({ Connected: "connected", CssUpdate: "css-update", ClearError: "clear-error", Error: "error", FullReload: "full-reload", UpdateStart: "update-start", Update: "update", UpdateDone: "update-done" }),APP_DEV_HMR_CLIENT_PATH = "/__zntc_app_dev_hmr__",APP_DEV_HMR_WS_PATH = "/__hmr",APP_DEV_REACT_REFRESH_PATH = "/__zntc_react_refresh__",HMR_WS_GUID = "258EAFA5-E914-47DA-95CA-C5AB0DC85B11";
 function normalizeHmrErrors(errors) {
 	if (!Array.isArray(errors) || errors.length === 0) {
 		return [{ file: "", message: "Unknown build error" }];
 	}
 	return errors.map((error) => {
-		const e = (error ?? {}),file = typeof e.location?.file == "string" ? e.location.file : "",message = String(e.text ?? e.message ?? error);
+		const e = error ?? {},file = typeof e.location?.file == "string" ? e.location.file : "",message = String(e.text ?? e.message ?? error);
 		return { file, message };
 	});
 }
@@ -165,8 +173,8 @@ function createWatcher(options) {
 //#endregion
 //#region hmr-channel.ts
 function extractErrorText(error) {
-	const e = (error ?? {});
-	return ((typeof e.stack == "string" && e.stack) || (typeof e.message == "string" && e.message) || String(error));
+	const e = error ?? {};
+	return typeof e.stack == "string" && e.stack || typeof e.message == "string" && e.message || String(error);
 }
 function createHmrChannel() {
 	const nodeSockets = new Set(),bunClients = new Set(),incomingHandlers = [],connectedText = JSON.stringify({ type: HMR_MSG.Connected });
@@ -194,14 +202,15 @@ function createHmrChannel() {
 		let recvBuffer = Buffer.alloc(0);
 		socket.on("data", (chunk) => {
 			if (incomingHandlers.length === 0)return;
-			recvBuffer = (recvBuffer.length === 0 ? chunk : Buffer.concat([recvBuffer, chunk]));
+			recvBuffer = recvBuffer.length === 0 ? chunk : Buffer.concat([recvBuffer, chunk]);
+			const reply = (text) => writeTextFrame(socket, text);
 			while (recvBuffer.length > 0) {
 				const parsed = parseTextFrame(recvBuffer);
 				if (!parsed)break;
 				recvBuffer = recvBuffer.subarray(parsed.consumed);
 				for (const handler of incomingHandlers) {
 					try {
-						handler(parsed.text, socket);
+						handler(parsed.text, reply);
 					} catch {
 					}
 				}
@@ -215,6 +224,15 @@ function createHmrChannel() {
 		greetBun(ws);
 	}, removeBunClient(ws) {
 		bunClients.delete(ws);
+	}, dispatchBunIncoming(ws,text) {
+		if (incomingHandlers.length === 0)return;
+		const reply = (out) => ws.send(out);
+		for (const handler of incomingHandlers) {
+			try {
+				handler(text, reply);
+			} catch {
+			}
+		}
 	}, onIncoming(handler) {
 		incomingHandlers.push(handler);
 	}, broadcast(message) {
@@ -233,6 +251,35 @@ function createHmrChannel() {
 	} };
 }
 //#endregion
+//#region hmr-rebuild-broadcast.ts
+function broadcastRebuildEvent(hmr,event) {
+	if (!event.success) {
+		if (event.errors && event.errors.length > 0) {
+			hmr.reportError(event.errors.map((e) => ({ text: e.message, location: { file: e.file } })));
+		} else {
+			hmr.reportError([{ text: event.error ?? "Unknown build error" }]);
+		}
+		return "error";
+	}
+	if (event.errors && event.errors.length > 0) {
+		hmr.reportError(event.errors.map((e) => ({ text: e.message, location: { file: e.file } })));
+	}
+	if (event.graphChanged) {
+		if (!event.errors || event.errors.length === 0)hmr.clearError();
+		hmr.broadcast({ type: HMR_MSG.FullReload, timestamp: Date.now() });
+		return "full-reload";
+	}
+	if (event.updates && event.updates.length > 0) {
+		if (!event.errors || event.errors.length === 0)hmr.clearError();
+		hmr.broadcast({ type: HMR_MSG.UpdateStart });
+		hmr.broadcast({ type: HMR_MSG.Update, modules: event.updates.map((u) => ({ id: u.id, code: u.code })) });
+		hmr.broadcast({ type: HMR_MSG.UpdateDone });
+		return "update";
+	}
+	if (!event.errors || event.errors.length === 0)hmr.clearError();
+	return "noop";
+}
+//#endregion
 //#region url.ts
 function joinUrl(base,rel) {
 	if (!base)return rel;
@@ -299,7 +346,7 @@ function collectPostcssMessages(messages,deps,dirDeps) {
 			deps.add(resolve$1(message.file));
 		}
 		if (message.type === "dir-dependency") {
-			const dir = (typeof message.dir == "string" && message.dir) || (typeof message.directory == "string" && message.directory);
+			const dir = typeof message.dir == "string" && message.dir || typeof message.directory == "string" && message.directory;
 			if (dir)dirDeps.add(resolve$1(dir));
 		}
 		if (message.type === "context-dependency" && typeof message.file == "string") {
@@ -311,8 +358,8 @@ function logPostcssProcessed(logLevel,count,configFile) {
 	if (logLevel === "silent")return;
 	console.error(`[postcss] processed ${count} CSS file(s) using ${basename(configFile ?? "postcss config")}`);
 }
-async function loadPostcssConfig(root,configEnv,fallbackRequire) {
-	const postcssrc = requireFromAppRoot(root, fallbackRequire, "postcss-load-config"),postcssModule = requireFromAppRoot(root, fallbackRequire, "postcss"),postcss = (postcssModule.default ?? postcssModule),config = await postcssrc({ cwd: root, env: configEnv.mode }, root).catch((err) => {
+async function loadPostcssConfig(root,configEnv,fallbackRequire,requireBase) {
+	const reqBase = requireBase ?? root,postcssrc = requireFromAppRoot(reqBase, fallbackRequire, "postcss-load-config"),postcssModule = requireFromAppRoot(reqBase, fallbackRequire, "postcss"),postcss = postcssModule.default ?? postcssModule,config = await postcssrc({ cwd: root, env: configEnv.mode }, root).catch((err) => {
 		if (err?.message?.includes("No PostCSS Config found"))return null;
 		throw err;
 	});
@@ -321,29 +368,109 @@ async function loadPostcssConfig(root,configEnv,fallbackRequire) {
 	if (plugins.length === 0)return null;
 	return { postcss, plugins, options: config.options ?? {}, configFile: config.file ?? null };
 }
-async function runPostcssIfConfigured(root,cssDir,skipDir,configEnv,logLevel,fallbackRequire) {
-	const loaded = await loadPostcssConfig(root, configEnv, fallbackRequire);
-	if (!loaded)return;
+async function runPostcssIfConfigured(root,cssDir,skipDir,configEnv,logLevel,fallbackRequire,override,cssAutoDiscoverRoot) {
+	const deps = new Set(),dirDeps = new Set();
+	let loaded;
+	if (override) {
+		if (override.plugins.length === 0)return { deps, dirDeps };
+		const requireBase = override.root ?? root;
+		let postcssModule;
+		try {
+			postcssModule = requireFromAppRoot(requireBase, fallbackRequire, "postcss");
+		} catch {
+			if (logLevel !== "silent") {
+				console.error("[postcss] override path: postcss require 실패 — skip");
+			}
+			return { deps, dirDeps };
+		}
+		const postcss = postcssModule.default ?? postcssModule;
+		loaded = { postcss, plugins: override.plugins, options: override.options ?? {}, configFile: null };
+	} else {
+		loaded = await loadPostcssConfig(cssAutoDiscoverRoot ?? root, configEnv, fallbackRequire, root);
+	}
+	if (!loaded)return { deps, dirDeps };
 	const cssFiles = collectAppFiles(cssDir, { skipDir, predicate: isCssFile });
 	await Promise.all(cssFiles.map(async (file) => {
 		const input = readFileSync(file, "utf8"),result = await loaded.postcss(loaded.plugins).process(input, { ...loaded.options, from: file, to: file });
 		writeFileSync(file, result.css);
 		if (result.map)writeFileSync(`${file}.map`, result.map.toString());
+		collectPostcssMessages(result.messages, deps, dirDeps);
 	}));
 	logPostcssProcessed(logLevel, cssFiles.length, loaded.configFile);
+	return { deps, dirDeps };
 }
 async function runPostcssForAppDev(options) {
-	const { root:root, outdir:outdir, configEnv:configEnv, logLevel:logLevel, base:base, changedPath:changedPath=null, fallbackRequire:fallbackRequire } = options,deps = new Set(),dirDeps = new Set();
+	const { root:root, outdir:outdir, configEnv:configEnv, logLevel:logLevel, base:base, changedPath:changedPath=null, fallbackRequire:fallbackRequire, postcssOverride:postcssOverride=null, skipPostcssRun:skipPostcssRun=false, sourceRoot:sourceRoot, cssAutoDiscoverRoot:cssAutoDiscoverRoot=null } = options;
+	if (skipPostcssRun && sourceRoot === undefined) {
+		throw new Error("runPostcssForAppDev: skipPostcssRun=true 시 sourceRoot 명시 필수 (issue #3853). prepare 의 tempRoot path 전달하지 않으면 raw root 의 PostCSS 미적용 .css 가 mirror 됨.");
+	}
+	const mirrorRoot = sourceRoot ?? root,deps = new Set(),dirDeps = new Set();
 	let primaryHref = null;
-	const configPath = findPostcssConfig(root);
-	if (!configPath) {
-		const first = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile })[0];
-		if (first)primaryHref = joinUrl(base, relative(root, first));
+	if (skipPostcssRun) {
+		const mirrorCssFiles = collectAppFiles(mirrorRoot, { skipDir: outdir, predicate: isCssFile });
+		mkdirSync(outdir, { recursive: true });
+		for (const f of mirrorCssFiles) {
+			const outputRel = relative(mirrorRoot, f),outputPath = join$1(outdir, outputRel);
+			mkdirSync(dirname(outputPath), { recursive: true });
+			const input = readFileSync(f, "utf8");
+			writeFileSync(outputPath, input);
+		}
+		const watchCssFiles = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile });
+		for (const f of watchCssFiles)deps.add(resolve$1(f));
+		if (watchCssFiles[0])primaryHref = joinUrl(base, relative(root, watchCssFiles[0]));
+		return { deps, dirDeps, primaryHref, processed: 0 };
+	}
+	const configPath = postcssOverride ? null : findPostcssConfig(cssAutoDiscoverRoot ?? root);
+	if (!configPath && !postcssOverride) {
+		const mirrorBase = sourceRoot ?? root,allCssFiles = collectAppFiles(mirrorBase, { skipDir: outdir, predicate: isCssFile }),targets = changedPath && changedPath.endsWith(".css") ? allCssFiles.filter((p) => p === changedPath || relative(root, p) === relative(root, changedPath)) : allCssFiles;
+		mkdirSync(outdir, { recursive: true });
+		for (const file of targets) {
+			const outputRel = relative(mirrorBase, file),outputPath = join$1(outdir, outputRel);
+			mkdirSync(dirname(outputPath), { recursive: true });
+			writeFileSync(outputPath, readFileSync(file, "utf8"));
+		}
+		const watchCssFiles = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile });
+		for (const f of watchCssFiles)deps.add(resolve$1(f));
+		if (watchCssFiles[0])primaryHref = joinUrl(base, relative(root, watchCssFiles[0]));
+		return { deps, dirDeps, primaryHref, processed: 0 };
+	}
+	let loaded;
+	if (postcssOverride) {
+		if (postcssOverride.plugins.length === 0) {
+			const allCssFiles = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile });
+			for (const f of allCssFiles)deps.add(resolve$1(f));
+			if (allCssFiles[0])primaryHref = joinUrl(base, relative(root, allCssFiles[0]));
+			return { deps, dirDeps, primaryHref, processed: 0 };
+		}
+		const requireBase = postcssOverride.root ?? root;
+		let postcssModule;
+		try {
+			postcssModule = requireFromAppRoot(requireBase, fallbackRequire, "postcss");
+		} catch {
+			if (logLevel !== "silent") {
+				console.error("[postcss] override path (dev): postcss require 실패 — skip");
+			}
+			return { deps, dirDeps, primaryHref, processed: 0 };
+		}
+		const postcss = postcssModule.default ?? postcssModule;
+		loaded = { postcss, plugins: postcssOverride.plugins, options: postcssOverride.options ?? {}, configFile: null };
+	} else {
+		loaded = await loadPostcssConfig(cssAutoDiscoverRoot ?? root, configEnv, fallbackRequire, root);
+	}
+	if (!loaded) {
+		const mirrorBase = sourceRoot ?? root,allCssFiles = collectAppFiles(mirrorBase, { skipDir: outdir, predicate: isCssFile }),changedRel = changedPath && changedPath.endsWith(".css") ? relative(root, changedPath) : null,targets = changedRel ? allCssFiles.filter((p) => relative(mirrorBase, p) === changedRel) : allCssFiles;
+		mkdirSync(outdir, { recursive: true });
+		for (const file of targets) {
+			const outputRel = relative(mirrorBase, file),outputPath = join$1(outdir, outputRel);
+			mkdirSync(dirname(outputPath), { recursive: true });
+			writeFileSync(outputPath, readFileSync(file, "utf8"));
+		}
+		const watchCssFiles = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile });
+		for (const f of watchCssFiles)deps.add(resolve$1(f));
+		if (watchCssFiles[0])primaryHref = joinUrl(base, relative(root, watchCssFiles[0]));
 		return { deps, dirDeps, primaryHref, processed: 0 };
 	}
-	const loaded = await loadPostcssConfig(root, configEnv, fallbackRequire);
-	if (!loaded)return { deps, dirDeps, primaryHref, processed: 0 };
-	deps.add(resolve$1(loaded.configFile ?? configPath));
+	if (loaded.configFile)deps.add(resolve$1(loaded.configFile)); else if (configPath)deps.add(resolve$1(configPath));
 	mkdirSync(outdir, { recursive: true });
 	const allCssFiles = collectAppFiles(root, { skipDir: outdir, predicate: isCssFile }),targets = changedPath && changedPath.endsWith(".css") && allCssFiles.includes(changedPath) ? [changedPath] : allCssFiles;
 	await Promise.all(targets.map(async (file) => {
@@ -381,6 +508,30 @@ function injectAppDevHmrClient(outdir) {
 		return `<script type="module" src="${APP_DEV_HMR_CLIENT_PATH}"></script>`;
 	});
 }
+function injectAppDevReactRefreshPreamble(outdir) {
+	const htmlPath = join$2(outdir, "index.html");
+	let html;
+	try {
+		html = readFileSync$1(htmlPath, "utf8");
+	} catch (err) {
+		if (err?.code === "ENOENT")return;
+		throw err;
+	}
+	if (html.includes(APP_DEV_REACT_REFRESH_PATH))return;
+	const tag = `<script src="${APP_DEV_REACT_REFRESH_PATH}"></script>`,headOpen = html.match(/<head\b[^>]*>/i);
+	let next;
+	if (headOpen && headOpen.index !== undefined) {
+		const at = headOpen.index + headOpen[0].length;
+		next = `${html.slice(0, at)}\n${tag}${html.slice(at)}`;
+	} else if (html.includes("</head>")) {
+		next = html.replace("</head>", `${tag}\n</head>`);
+	} else if (html.includes("<script")) {
+		next = html.replace("<script", `${tag}\n<script`);
+	} else {
+		next = `${tag}\n${html}`;
+	}
+	writeFileSync$1(htmlPath, next);
+}
 function injectAppDevBundleCssLinks(outdir,base,bundleResult) {
 	injectIntoDevHtml(outdir, (html) => {
 		const cssHrefs = [];
@@ -393,6 +544,24 @@ function injectAppDevBundleCssLinks(outdir,base,bundleResult) {
 		return cssHrefs.map((href) => `<link rel="stylesheet" href="${href}">`).join("\n");
 	});
 }
+function injectAppDevBundleCssLinksFromOutdir(outdir,base) {
+	injectIntoDevHtml(outdir, (html) => {
+		let entries;
+		try {
+			entries = readdirSync$1(outdir);
+		} catch {
+			return null;
+		}
+		const cssHrefs = [];
+		for (const name of entries) {
+			if (!isCssFile(name))continue;
+			const href = joinUrl(base, name);
+			if (!html.includes(`href="${href}"`) && !html.includes(`href='${href}'`))cssHrefs.push(href);
+		}
+		if (cssHrefs.length === 0)return null;
+		return cssHrefs.map((href) => `<link rel="stylesheet" href="${href}">`).join("\n");
+	});
+}
 function injectAppDevPipelineCssLinks(outdir,base,cssRelPaths) {
 	if (cssRelPaths.length === 0)return;
 	injectIntoDevHtml(outdir, (html) => {
@@ -406,6 +575,33 @@ function injectAppDevPipelineCssLinks(outdir,base,cssRelPaths) {
 	});
 }
 //#endregion
+//#region react-refresh-preamble.ts
+const NOOP_PREAMBLE = "console.warn(\"[zntc] react-refresh not found — React Fast Refresh disabled. `npm install react-refresh` for HMR with state preservation.\");\n(function(){var g=typeof globalThis!==\"undefined\"?globalThis:window;g.$RefreshReg$=g.$RefreshReg$||function(){};g.$RefreshSig$=g.$RefreshSig$||function(){return function(t){return t}};})();";
+function buildReactRefreshPreamble(rootDir) {
+	const req = createRequire$1(resolve$2(rootDir, "__zntc_resolve__.js"));
+	let runtimeSource;
+	try {
+		const runtimeJsPath = req.resolve("react-refresh/runtime"),pkgDir = dirname$1(runtimeJsPath),dispatcher = readFileSync$2(runtimeJsPath, "utf8"),m = dispatcher.match(/require\((['"])(\.[^'"]*development[^'"]*)\1\)/);
+		if (m) {
+			const cjsPath = resolve$2(pkgDir, m[2]);
+			if (cjsPath !== pkgDir && !cjsPath.startsWith(pkgDir + sep$1))return NOOP_PREAMBLE;
+			runtimeSource = readFileSync$2(cjsPath, "utf8");
+		} else if (!/\brequire\s*\(/.test(dispatcher)) {
+			runtimeSource = dispatcher;
+		} else {
+			return NOOP_PREAMBLE;
+		}
+	} catch {
+		try {
+			req.resolve("react");
+		} catch {
+			return null;
+		}
+		return NOOP_PREAMBLE;
+	}
+	return "(function(){\nvar process={env:{NODE_ENV:\"development\"}};\nvar exports={};var module={exports:exports};\n" + runtimeSource + "\nvar rt=module.exports;\n" + "var g=typeof globalThis!==\"undefined\"?globalThis:window;\n" + "g.__ReactRefresh=rt;g.__REACT_REFRESH_RUNTIME__=rt;\n" + "if(rt&&typeof rt.injectIntoGlobalHook===\"function\")rt.injectIntoGlobalHook(g);\n" + "g.$RefreshReg$=function(){};\n" + "g.$RefreshSig$=function(){return function(t){return t}};\n" + "g.__zntc_react_refresh_preamble__=true;\n" + "})();";
+}
+//#endregion
 //#region html-env.ts
 const DEFAULT_HTML_ENV_PREFIX = "ZNTC_";
 const TOKEN_RE = /<%=\s*([A-Za-z_][A-Za-z0-9_]*)\s*%>/g,HTML_ESCAPE = { "&": "&amp;", "<": "&lt;", ">": "&gt;", "\"": "&quot;" };
@@ -431,7 +627,7 @@ function applyHtmlEnvTokens(outdir,env,prefix=DEFAULT_HTML_ENV_PREFIX) {
 	const htmlPath = join$3(outdir, "index.html");
 	let html;
 	try {
-		html = readFileSync$2(htmlPath, "utf8");
+		html = readFileSync$3(htmlPath, "utf8");
 	} catch (err) {
 		if (err?.code === "ENOENT")return { warnings: [] };
 		throw err;
@@ -470,10 +666,10 @@ function startsWithCssIdent(css,offset,value) {
 	return css.slice(offset, offset + value.length).toLowerCase() === value;
 }
 function isCssIdentStart(ch) {
-	return ch === "_" || (ch >= "A" && ch <= "Z") || (ch >= "a" && ch <= "z");
+	return ch === "_" || ch >= "A" && ch <= "Z" || ch >= "a" && ch <= "z";
 }
 function isCssIdent(ch) {
-	return isCssIdentStart(ch) || ch === "-" || (ch >= "0" && ch <= "9");
+	return isCssIdentStart(ch) || ch === "-" || ch >= "0" && ch <= "9";
 }
 //#endregion
 //#region sass.ts
@@ -495,7 +691,7 @@ function loadSassCompiler(root,fallbackRequire) {
 	return requireFromAppRoot(root, fallbackRequire, "sass");
 }
 function compileSassFile(sass,file,loadRoot) {
-	return sass.compile(file, { style: "expanded", loadPaths: [dirname$1(file), loadRoot], sourceMap: false });
+	return sass.compile(file, { style: "expanded", loadPaths: [dirname$2(file), loadRoot], sourceMap: false });
 }
 const STYLE_REFERENCE_RE = /\.(?:html|mjs|cjs|js|jsx|ts|tsx)$/;
 function isStyleReferenceSource(path) {
@@ -504,7 +700,7 @@ function isStyleReferenceSource(path) {
 function rewriteSassReferences(sourceFiles) {
 	;
 	for (const source of sourceFiles) {
-		const input = readFileSync$3(source, "utf8");
+		const input = readFileSync$4(source, "utf8");
 		if (!input.includes(".scss") && !input.includes(".sass"))continue;
 		const toExt = /\.html?$/i.test(source) ? ".css" : ".css.js",output = input.replace(/(["'])([^"']+\.(?:scss|sass))([?#][^"']*)?\1/g, (_match, quote, spec, suffix = "") => `${quote}${spec.replace(/\.(?:scss|sass)$/, toExt)}${suffix}${quote}`);
 		if (output !== input)writeFileSync$3(source, output);
@@ -516,7 +712,7 @@ function buildCssPreprocessorProxy(cssPath) {
 }
 function transformCssPreprocessors(root,files,sourceFiles,logLevel,fallbackRequire,options={}) {
 	if (files.length === 0)return [];
-	const { dirtyOnly:dirtyOnly=null, dirtySources:dirtySources=null } = options,targets = dirtyOnly ? files.filter((f) => dirtyOnly.has(f)) : files;
+	const { dirtyOnly:dirtyOnly=null, dirtySources:dirtySources=null, onDeps:onDeps=null } = options,targets = dirtyOnly ? files.filter((f) => dirtyOnly.has(f)) : files;
 	if (targets.length === 0)return files.map(cssPreprocessorOutputPath);
 	let sass;
 	try {
@@ -529,6 +725,7 @@ function transformCssPreprocessors(root,files,sourceFiles,logLevel,fallbackRequi
 		const result = compileSassFile(sass, file, root),cssPath = cssPreprocessorOutputPath(file);
 		writeFileSync$3(cssPath, result.css);
 		writeFileSync$3(cssPreprocessorProxyPath(file), buildCssPreprocessorProxy(cssPath));
+		if (onDeps && result.loadedUrls)onDeps(file, result.loadedUrls);
 	}
 	rewriteSassReferences(dirtySources ?? sourceFiles);
 	if (logLevel !== "silent") {
@@ -549,7 +746,7 @@ function cssModuleProxyPath(file) {
 }
 const SAFE_LOCAL_RE = /[^a-zA-Z0-9_]/g;
 function cssModuleLocalName(root,file,local) {
-	const rel = relative$1(root, file).replaceAll(sep$1, "/"),fileName = basename$3(file, ".module.css").replace(SAFE_LOCAL_RE, "_");
+	const rel = relative$1(root, file).replaceAll(sep$2, "/"),fileName = basename$3(file, ".module.css").replace(SAFE_LOCAL_RE, "_");
 	return cssModuleLocalNameWithCachedFile(rel, fileName, local);
 }
 function cssModuleLocalNameWithCachedFile(rel,fileName,local) {
@@ -603,7 +800,7 @@ function rewriteCssModuleReferences(sourceFiles) {
 	;
 	for (const source of sourceFiles) {
 		if (/\.html?$/i.test(source))continue;
-		const input = readFileSync$4(source, "utf8");
+		const input = readFileSync$5(source, "utf8");
 		if (!input.includes(".module.css"))continue;
 		const output = input.replace(/(["'])([^"']+\.module\.css)([?#][^"']*)?\1/g, (_match, quote, spec, suffix = "") => `${quote}${spec}.js${suffix}${quote}`);
 		if (output !== input)writeFileSync$4(source, output);
@@ -614,7 +811,7 @@ function transformCssModules(root,moduleFiles,styleSources,logLevel,options={})
 	const { dirtyOnly:dirtyOnly=null, dirtySources:dirtySources=null } = options,targets = dirtyOnly ? moduleFiles.filter((f) => dirtyOnly.has(f)) : moduleFiles;
 	if (targets.length === 0)return moduleFiles.map(cssModuleGeneratedCssPath);
 	for (const file of targets) {
-		const css = readFileSync$4(file, "utf8"),tokens = scanCssModuleClassTokens(css),rel = relative$1(root, file).replaceAll(sep$1, "/"),fileName = basename$3(file, ".module.css").replace(SAFE_LOCAL_RE, "_"),mapping = {};
+		const css = readFileSync$5(file, "utf8"),tokens = scanCssModuleClassTokens(css),rel = relative$1(root, file).replaceAll(sep$2, "/"),fileName = basename$3(file, ".module.css").replace(SAFE_LOCAL_RE, "_"),mapping = Object.create(null);
 		for (const token of tokens) {
 			if (!mapping[token.local]) {
 				mapping[token.local] = cssModuleLocalNameWithCachedFile(rel, fileName, token.local);
@@ -633,6 +830,7 @@ function transformCssModules(root,moduleFiles,styleSources,logLevel,options={})
 function rewriteCssModuleClassesWithTokens(css,tokens,mapping) {
 	let out = "",offset = 0;
 	for (const token of tokens) {
+		if (!Object.hasOwn(mapping, token.local))continue;
 		const scoped = mapping[token.local];
 		if (!scoped)continue;
 		out += css.slice(offset, token.start);
@@ -653,7 +851,7 @@ function normalizeBase(base) {
 	return normalized;
 }
 function mirrorFile(srcAbs,dstAbs) {
-	mkdirSync$1(dirname$2(dstAbs), { recursive: true });
+	mkdirSync$1(dirname$3(dstAbs), { recursive: true });
 	cpSync(srcAbs, dstAbs);
 }
 function mirrorPipelineCssToOutdir(pipelineRoot,outdir,absPaths) {
@@ -714,12 +912,12 @@ function cleanupPostcssTempRoot(tempRoot) {
 function copyAppRootForPostcss(root,outdir,phase,cliNodeModules) {
 	const tempRoot = mkdtempSync(join$4(tmpdir(), `zntc-postcss-${phase}-`));
 	registerPostcssTempRoot(tempRoot);
-	const skip = new Set([resolve$2(outdir), resolve$2(tempRoot), resolve$2(join$4(root, "node_modules")), resolve$2(join$4(root, ".git")), resolve$2(join$4(root, "dist")), resolve$2(join$4(root, ".zntc-dev"))]);
+	const skip = new Set([resolve$3(outdir), resolve$3(tempRoot), resolve$3(join$4(root, "node_modules")), resolve$3(join$4(root, ".git")), resolve$3(join$4(root, "dist")), resolve$3(join$4(root, ".zntc-dev"))]);
 	cpSync(root, tempRoot, { recursive: true, dereference: false, filter(source) {
-		const abs = resolve$2(source);
-		if (abs === resolve$2(root))return true;
+		const abs = resolve$3(source);
+		if (abs === resolve$3(root))return true;
 		for (const ignored of skip) {
-			if (abs === ignored || abs.startsWith(`${ignored}${sep$2}`))return false;
+			if (abs === ignored || abs.startsWith(`${ignored}${sep$3}`))return false;
 		}
 		return true;
 	} });
@@ -729,18 +927,54 @@ function copyAppRootForPostcss(root,outdir,phase,cliNodeModules) {
 	}
 	return tempRoot;
 }
+function recordSassReverseDep(reverseDep,file,loadedUrls) {
+	for (const url of loadedUrls) {
+		let dep;
+		try {
+			dep = fileURLToPath(url);
+		} catch {
+			continue;
+		}
+		if (dep === file)continue;
+		let set = reverseDep.get(dep);
+		if (!set) {
+			set = new Set();
+			reverseDep.set(dep, set);
+		}
+		set.add(file);
+	}
+}
 async function prepareAppCssPipelineRoot(root,outdir,configEnv,logLevel,phase,deps,options={}) {
-	const { existingTempRoot:existingTempRoot=null, dirtyPaths:dirtyPaths=null, cache:cache=null } = options,{ fallbackRequire:fallbackRequire, cliNodeModules:cliNodeModules } = deps,configPath = findPostcssConfig(root),stylePipelineFiles = cache?.stylePipelineFiles ?? collectAppFiles(root, { skipDir: outdir, predicate: (path) => isCssPreprocessorFile(path) || isCssModuleFile(path) }),preprocessorFiles = stylePipelineFiles.filter(isCssPreprocessorFile),moduleFiles = stylePipelineFiles.filter(isCssModuleFile),needsSource = preprocessorFiles.length > 0 || moduleFiles.length > 0;
-	if (!configPath && !needsSource)return null;
+	const { existingTempRoot:existingTempRoot=null, dirtyPaths:dirtyPaths=null, cache:cache=null, sassReverseDep:sassReverseDep=null, postcssOverride:postcssOverride=null, cssAutoDiscoverRoot:cssAutoDiscoverRoot=null } = options,{ fallbackRequire:fallbackRequire, cliNodeModules:cliNodeModules } = deps,configPath = postcssOverride ? null : findPostcssConfig(cssAutoDiscoverRoot ?? root);
+	if (cssAutoDiscoverRoot && !configPath && !postcssOverride && logLevel !== "silent") {
+		console.error(`[postcss] css({root}) 명시 — ${cssAutoDiscoverRoot} 에서 postcss.config.* 발견 못함 — auto-discover skip`);
+	}
+	const stylePipelineFiles = cache?.stylePipelineFiles ?? collectAppFiles(root, { skipDir: outdir, predicate: (path) => isCssPreprocessorFile(path) || isCssModuleFile(path) }),preprocessorFiles = stylePipelineFiles.filter(isCssPreprocessorFile),moduleFiles = stylePipelineFiles.filter(isCssModuleFile),needsSource = preprocessorFiles.length > 0 || moduleFiles.length > 0;
+	if (!configPath && !needsSource && !postcssOverride)return null;
 	const tempRoot = existingTempRoot ?? copyAppRootForPostcss(root, outdir, phase, cliNodeModules),isIncremental = existingTempRoot && dirtyPaths;
 	if (isIncremental && dirtyPaths) {
 		syncDirtyFilesIntoTempRoot(root, tempRoot, dirtyPaths);
 	}
-	const toTemp = (path) => join$4(tempRoot, relative$2(root, path)),styleSourceFiles = !needsSource ? [] : (cache?.styleSourceFiles ?? collectAppFiles(tempRoot, { predicate: isStyleReferenceSource }));
+	const toTemp = (path) => join$4(tempRoot, relative$2(root, path)),recordSassDeps = (file, loadedUrls) => {
+		if (sassReverseDep)recordSassReverseDep(sassReverseDep, file, loadedUrls);
+	},styleSourceFiles = !needsSource ? [] : cache?.styleSourceFiles ?? collectAppFiles(tempRoot, { predicate: isStyleReferenceSource });
 	let dirtySassSet = null,dirtyModuleSet = null,dirtySourceList = null;
 	if (isIncremental && dirtyPaths) {
 		const dirtyTempPaths = dirtyPaths.map(toTemp);
 		dirtySassSet = new Set(dirtyTempPaths.filter((p) => isCssPreprocessorFile(p)));
+		if (sassReverseDep) {
+			const queue = [...dirtySassSet];
+			while (queue.length > 0) {
+				const dep = queue.pop(),dependents = sassReverseDep.get(dep);
+				if (!dependents)continue;
+				for (const dependent of dependents) {
+					if (!dirtySassSet.has(dependent)) {
+						dirtySassSet.add(dependent);
+						queue.push(dependent);
+					}
+				}
+			}
+		}
 		dirtyModuleSet = new Set(dirtyTempPaths.filter((p) => isCssModuleFile(p)));
 		for (const sassDirty of dirtySassSet) {
 			const cssOut = cssPreprocessorOutputPath(sassDirty);
@@ -748,16 +982,21 @@ async function prepareAppCssPipelineRoot(root,outdir,configEnv,logLevel,phase,de
 		}
 		dirtySourceList = dirtyTempPaths.filter((p) => isStyleReferenceSource(p) && existsSync$1(p));
 	}
-	const sassOutputs = transformCssPreprocessors(tempRoot, preprocessorFiles.map(toTemp), styleSourceFiles, logLevel, fallbackRequire, isIncremental ? { dirtyOnly: dirtySassSet, dirtySources: dirtySourceList } : undefined),postcssRelevant = !isIncremental || (dirtyPaths !== null && dirtyPaths.some((p) => isCssFile(p) || isCssPreprocessorFile(p) || isPostcssConfigFile(p)));
+	const sassOutputs = transformCssPreprocessors(tempRoot, preprocessorFiles.map(toTemp), styleSourceFiles, logLevel, fallbackRequire, isIncremental ? { dirtyOnly: dirtySassSet, dirtySources: dirtySourceList, onDeps: recordSassDeps } : { onDeps: recordSassDeps }),postcssRelevant = !isIncremental || dirtyPaths !== null && dirtyPaths.some((p) => isCssFile(p) || isCssPreprocessorFile(p) || isPostcssConfigFile(p));
+	let postcssDeps,postcssDirDeps;
 	if (postcssRelevant) {
-		await runPostcssIfConfigured(tempRoot, tempRoot, null, configEnv, logLevel, fallbackRequire);
+		const postcssResult = await runPostcssIfConfigured(tempRoot, tempRoot, null, configEnv, logLevel, fallbackRequire, postcssOverride, cssAutoDiscoverRoot);
+		postcssDeps = postcssResult.deps;
+		postcssDirDeps = postcssResult.dirDeps;
 	}
 	const generatedModuleFiles = preprocessorFiles.map(cssPreprocessorOutputPath).filter(isCssModuleFile),moduleOutputs = transformCssModules(tempRoot, [...moduleFiles, ...generatedModuleFiles].map(toTemp), styleSourceFiles, logLevel, isIncremental ? { dirtyOnly: dirtyModuleSet, dirtySources: dirtySourceList } : undefined),moduleInputCssPaths = new Set(generatedModuleFiles.map((p) => join$4(tempRoot, relative$2(root, p)))),generatedCssAbsPaths = [...sassOutputs.filter((p) => !moduleInputCssPaths.has(p)), ...moduleOutputs];
-	return { tempRoot, generatedCssAbsPaths, cache: { stylePipelineFiles, styleSourceFiles } };
+	return { tempRoot, generatedCssAbsPaths, cache: { stylePipelineFiles, styleSourceFiles }, postcssDeps, postcssDirDeps };
 }
 function createAppDevController(opts,root,configEnv,deps) {
-	const { fallbackRequire:fallbackRequire } = deps,outdir = resolve$2(opts.outdir || join$4(root, ".zntc-dev")),base = normalizeBase(opts.base ?? opts.publicPath ?? "/");
-	let cssDeps = new Set(),cssDirDeps = new Set(),primaryHref = null,pipelineRoot = null,pipelineCache = null,hasPipelineCss = false,htmlEnvCache = null;
+	const { fallbackRequire:fallbackRequire } = deps,outdir = resolve$3(opts.outdir || join$4(root, ".zntc-dev")),base = normalizeBase(opts.base ?? opts.publicPath ?? "/"),reactRefreshInject = opts.reactRefresh === true && buildReactRefreshPreamble(opts.appRoot ?? root) != null;
+	let cssDeps = new Set(),cssDirDeps = new Set(),preparePostcssApplied = false,preparePostcssDeps = new Set(),preparePostcssDirDeps = new Set();
+	const sassReverseDep = new Map();
+	let primaryHref = null,pipelineRoot = null,pipelineCache = null,hasPipelineCss = false,htmlEnvCache = null;
 	const warnedHtmlEnv = new Set();
 	return { root, outdir, base, async prepare(dirtyPaths=null) {
 		const reuseRoot = pipelineRoot && dirtyPaths != null;
@@ -765,15 +1004,23 @@ function createAppDevController(opts,root,configEnv,deps) {
 			cleanupPostcssTempRoot(pipelineRoot);
 			pipelineRoot = null;
 			pipelineCache = null;
+			sassReverseDep.clear();
 		}
 		if (reuseRoot && dirtyPaths && dirtyPaths.some((p) => isCssPreprocessorFile(p) || isCssModuleFile(p))) {
 			pipelineCache = null;
 		}
-		const pipeline = await prepareAppCssPipelineRoot(root, outdir, configEnv, opts.logLevel, "dev", deps, reuseRoot ? { existingTempRoot: pipelineRoot, dirtyPaths, cache: pipelineCache } : undefined);
+		const postcssOverride = opts.postcssOverride ?? null,cssAutoDiscoverRoot = opts.cssAutoDiscoverRoot ?? null,pipeline = await prepareAppCssPipelineRoot(root, outdir, configEnv, opts.logLevel, "dev", deps, reuseRoot ? { existingTempRoot: pipelineRoot, dirtyPaths, cache: pipelineCache, sassReverseDep, postcssOverride, cssAutoDiscoverRoot } : { sassReverseDep, postcssOverride, cssAutoDiscoverRoot });
 		pipelineRoot = pipeline?.tempRoot ?? null;
 		pipelineCache = pipeline?.cache ?? null;
 		hasPipelineCss = (pipeline?.generatedCssAbsPaths.length ?? 0) > 0;
-		const prepareRoot = pipelineRoot ?? root,envDir = opts.envDir ? resolve$2(opts.envDir) : prepareRoot,prepared = prepareAppDevSync({ root: prepareRoot, outdir, entryHtml: opts.entryHtml ?? "index.html", publicDir: opts.publicDir === undefined ? "public" : opts.publicDir, base, mode: configEnv.mode, envDir, envPrefixes: opts.envPrefixes ? Array.from(opts.envPrefixes) : undefined }),htmlEnv = htmlEnvCache && htmlEnvCache.mode === configEnv.mode && htmlEnvCache.dir === envDir ? htmlEnvCache.env : (htmlEnvCache = { mode: configEnv.mode, dir: envDir, env: loadEnv(configEnv.mode, envDir, ["ZNTC_"]) }).env,{ warnings:htmlWarnings } = applyHtmlEnvTokens(outdir, htmlEnv);
+		preparePostcssApplied = !!pipeline;
+		if (pipeline?.postcssDeps !== undefined) {
+			preparePostcssDeps = pipeline.postcssDeps;
+		}
+		if (pipeline?.postcssDirDeps !== undefined) {
+			preparePostcssDirDeps = pipeline.postcssDirDeps;
+		}
+		const prepareRoot = pipelineRoot ?? root,envDir = opts.envDir ? resolve$3(opts.envDir) : prepareRoot,prepared = prepareAppDevSync({ root: prepareRoot, outdir, entryHtml: opts.entryHtml ?? "index.html", publicDir: opts.publicDir === undefined ? "public" : opts.publicDir, base, mode: configEnv.mode, envDir, envPrefixes: opts.envPrefixes ? Array.from(opts.envPrefixes) : undefined }),htmlEnv = htmlEnvCache && htmlEnvCache.mode === configEnv.mode && htmlEnvCache.dir === envDir ? htmlEnvCache.env : (htmlEnvCache = { mode: configEnv.mode, dir: envDir, env: loadEnv(configEnv.mode, envDir, ["ZNTC_"]) }).env,{ warnings:htmlWarnings } = applyHtmlEnvTokens(outdir, htmlEnv);
 		if (opts.logLevel !== "silent") {
 			for (const w of htmlWarnings) {
 				if (warnedHtmlEnv.has(w))continue;
@@ -782,42 +1029,65 @@ function createAppDevController(opts,root,configEnv,deps) {
 			}
 		}
 		injectAppDevHmrClient(outdir);
+		if (reactRefreshInject)injectAppDevReactRefreshPreamble(outdir);
 		if (pipeline && pipeline.generatedCssAbsPaths.length > 0 && pipelineRoot) {
-			const sassOrModuleDirty = !reuseRoot || (dirtyPaths !== null && dirtyPaths.some((p) => isCssPreprocessorFile(p) || isCssModuleFile(p))),rels = sassOrModuleDirty ? mirrorPipelineCssToOutdir(pipelineRoot, outdir, pipeline.generatedCssAbsPaths) : pipeline.generatedCssAbsPaths.map((p) => relative$2(pipelineRoot ?? root, p));
+			const sassOrModuleDirty = !reuseRoot || dirtyPaths !== null && dirtyPaths.some((p) => isCssPreprocessorFile(p) || isCssModuleFile(p)),rels = sassOrModuleDirty ? mirrorPipelineCssToOutdir(pipelineRoot, outdir, pipeline.generatedCssAbsPaths) : pipeline.generatedCssAbsPaths.map((p) => relative$2(pipelineRoot ?? root, p));
 			injectAppDevPipelineCssLinks(outdir, base, rels);
 		}
 		return prepared;
+	}, syncDirty(dirtyPaths) {
+		if (!pipelineRoot)return;
+		syncDirtyFilesIntoTempRoot(root, pipelineRoot, dirtyPaths);
 	}, async afterBundle({ changedPath:changedPath=null }={}) {
-		const result = await runPostcssForAppDev({ root, outdir, configEnv, logLevel: opts.logLevel, base, changedPath, fallbackRequire });
+		const skipPostcssRun = preparePostcssApplied && !changedPath,result = await runPostcssForAppDev({ root, outdir, configEnv, logLevel: opts.logLevel, base, changedPath, fallbackRequire, postcssOverride: opts.postcssOverride ?? null, skipPostcssRun, sourceRoot: pipelineRoot ?? root, cssAutoDiscoverRoot: opts.cssAutoDiscoverRoot ?? null });
 		cssDeps = result.deps;
 		cssDirDeps = result.dirDeps;
+		if (preparePostcssApplied) {
+			for (const d of preparePostcssDeps)cssDeps.add(d);
+			for (const d of preparePostcssDirDeps)cssDirDeps.add(d);
+		}
 		primaryHref = result.primaryHref;
-		return result;
+		return { ...result, deps: cssDeps, dirDeps: cssDirDeps };
 	}, injectBundleCssLinks(bundleResult) {
 		if (hasPipelineCss)return;
 		injectAppDevBundleCssLinks(outdir, base, bundleResult);
+	}, injectBundleCssLinksFromOutdir() {
+		if (hasPipelineCss)return;
+		injectAppDevBundleCssLinksFromOutdir(outdir, base);
 	}, isPostcssConfig(absPath) {
 		return isPostcssConfigFile(absPath);
+	}, isCssLikeChange(absPath) {
+		if (isPostcssConfigFile(absPath))return true;
+		if (isCssFile(absPath) || isCssPreprocessorFile(absPath))return true;
+		if (isCssModuleFile(absPath) || isCssModulePreprocessorFile(absPath))return true;
+		return false;
 	}, isCssOnlyChange(absPath) {
 		if (isCssModuleFile(absPath) || isCssModulePreprocessorFile(absPath))return false;
 		if (isCssFile(absPath) || isCssPreprocessorFile(absPath))return true;
 		if (cssDeps.has(absPath))return true;
 		for (const dir of cssDirDeps) {
-			if (absPath === dir || absPath.startsWith(`${dir}${sep$2}`))return true;
+			if (absPath === dir || absPath.startsWith(`${dir}${sep$3}`))return true;
 		}
 		return false;
 	}, isSassOnlyChange(absPath) {
-		return isCssPreprocessorFile(absPath) && !isCssModulePreprocessorFile(absPath);
+		if (!isCssPreprocessorFile(absPath) || isCssModulePreprocessorFile(absPath))return false;
+		if (pipelineRoot) {
+			const temp = join$4(pipelineRoot, relative$2(root, absPath));
+			if (sassReverseDep.has(temp))return false;
+		}
+		return true;
 	}, async rebuildScssIncremental(absPath) {
 		if (!pipelineRoot)return null;
 		if (findPostcssConfig(root))return null;
 		const srcTemp = join$4(pipelineRoot, relative$2(root, absPath));
 		mirrorFile(absPath, srcTemp);
-		const sass = loadSassCompiler(root, fallbackRequire),result = compileSassFile(sass, srcTemp, pipelineRoot),cssTempPath = cssPreprocessorOutputPath(srcTemp);
+		const sass = loadSassCompiler(root, fallbackRequire),result = compileSassFile(sass, srcTemp, pipelineRoot);
+		if (result.loadedUrls)recordSassReverseDep(sassReverseDep, srcTemp, result.loadedUrls);
+		const cssTempPath = cssPreprocessorOutputPath(srcTemp);
 		writeFileSync$5(cssTempPath, result.css);
 		const cssRel = relative$2(pipelineRoot, cssTempPath);
 		mirrorFile(cssTempPath, join$4(outdir, cssRel));
-		return joinUrl(base, cssRel.replaceAll(sep$2, "/"));
+		return joinUrl(base, cssRel.replaceAll(sep$3, "/"));
 	}, hrefFor(absPath) {
 		if (absPath.endsWith(".css"))return joinUrl(base, relative$2(root, absPath));
 		return primaryHref ?? joinUrl(base, "style.css");
@@ -825,300 +1095,16 @@ function createAppDevController(opts,root,configEnv,deps) {
 }
 //#endregion
 //#region dev-overlay-client.mjs
-const APP_DEV_HMR_CLIENT = `
-const socketProtocol = location.protocol === "https:" ? "wss:" : "ws:";
-let overlay = null;
-let closeOverlayOnEsc = null;
-function hideOverlay() {
-  if (closeOverlayOnEsc) document.removeEventListener("keydown", closeOverlayOnEsc);
-  closeOverlayOnEsc = null;
-  if (overlay && overlay.parentNode) overlay.parentNode.removeChild(overlay);
-  overlay = null;
-}
-function normalizeErrors(errors) {
-  if (!Array.isArray(errors) || errors.length === 0) {
-    return [{ file: "", message: "Unknown build error" }];
-  }
-  return errors.map((error) => {
-    if (typeof error === "string") return { file: "", message: error };
-    return {
-      file: error && typeof error.file === "string" ? error.file : "",
-      message: error && typeof error.message === "string" ? error.message : String(error),
-    };
-  });
-}
-function normalizeRuntimeError(error, file) {
-  if (error && typeof error.stack === "string" && error.stack) {
-    return { file: file || "", message: error.stack };
-  }
-  if (error && typeof error.message === "string" && error.message) {
-    const name = typeof error.name === "string" && error.name ? error.name : "Error";
-    return { file: file || "", message: name + ": " + error.message };
-  }
-  return { file: file || "", message: String(error || "Unknown runtime error") };
-}
-const sourceMapCache = new Map();
-const sourceMapVlqChars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789+/";
-function displaySourceName(source) {
-  if (!source) return "";
-  const clean = String(source).split("?")[0].split("#")[0];
-  const slash = Math.max(clean.lastIndexOf("/"), clean.lastIndexOf("\\\\"));
-  return slash >= 0 ? clean.slice(slash + 1) : clean;
-}
-function decodeSourceMapVlq(segment) {
-  const values = [];
-  let result = 0;
-  let shift = 0;
-  for (const ch of segment) {
-    let digit = sourceMapVlqChars.indexOf(ch);
-    if (digit < 0) return values;
-    const continuation = digit & 32;
-    digit &= 31;
-    result += digit << shift;
-    if (continuation) {
-      shift += 5;
-      continue;
-    }
-    const negative = result & 1;
-    const value = result >> 1;
-    values.push(negative ? -value : value);
-    result = 0;
-    shift = 0;
-  }
-  return values;
-}
-function parseSourceMapMappings(map) {
-  if (map.__zntcParsedMappings) return map.__zntcParsedMappings;
-  let source = 0;
-  let originalLine = 0;
-  let originalColumn = 0;
-  let name = 0;
-  const parsed = [];
-  for (const line of String(map.mappings || "").split(";")) {
-    let generatedColumn = 0;
-    const segments = [];
-    for (const segment of line.split(",")) {
-      if (!segment) continue;
-      const values = decodeSourceMapVlq(segment);
-      if (values.length === 0) continue;
-      generatedColumn += values[0];
-      if (values.length >= 4) {
-        source += values[1];
-        originalLine += values[2];
-        originalColumn += values[3];
-        if (values.length >= 5) name += values[4];
-        segments.push({ generatedColumn, source, originalLine, originalColumn });
-      }
-    }
-    parsed.push(segments);
-  }
-  Object.defineProperty(map, "__zntcParsedMappings", { value: parsed });
-  return parsed;
-}
-function findOriginalPosition(map, line, column) {
-  const segments = parseSourceMapMappings(map)[line - 1];
-  if (!segments || segments.length === 0) return null;
-  let lo = 0;
-  let hi = segments.length - 1;
-  let best = null;
-  while (lo <= hi) {
-    const mid = (lo + hi) >> 1;
-    const segment = segments[mid];
-    if (segment.generatedColumn <= column) {
-      best = segment;
-      lo = mid + 1;
-    } else {
-      hi = mid - 1;
-    }
-  }
-  best = best || segments[0];
-  const source = map.sources && map.sources[best.source];
-  if (!source) return null;
-  const columnOffset = Math.max(0, column - best.generatedColumn);
-  return {
-    source: displaySourceName(source),
-    line: best.originalLine + 1,
-    column: best.originalColumn + columnOffset,
-  };
-}
-async function loadSourceMapForGeneratedUrl(url) {
-  const generatedUrl = new URL(url, location.href).href;
-  if (sourceMapCache.has(generatedUrl)) return sourceMapCache.get(generatedUrl);
-  const safeJson = async (response) => {
-    try { return await response.json(); } catch (_) { return null; }
-  };
-  const promise = (async () => {
-    const direct = await fetch(generatedUrl + ".map", { cache: "no-store" }).catch(() => null);
-    if (direct && direct.ok) return safeJson(direct);
-    const jsResponse = await fetch(generatedUrl, { cache: "no-store" }).catch(() => null);
-    if (!jsResponse || !jsResponse.ok) return null;
-    const code = await jsResponse.text();
-    const match =
-      code.match(/\\/\\/[#@]\\s*sourceMappingURL=([^\\n\\r]+)/) ||
-      code.match(/\\/\\*[#@]\\s*sourceMappingURL=([^*]+)\\*\\//);
-    if (!match) return null;
-    const ref = match[1].trim();
-    if (ref.startsWith("data:")) {
-      const comma = ref.indexOf(",");
-      if (comma < 0) return null;
-      const meta = ref.slice(0, comma);
-      const data = ref.slice(comma + 1);
-      try {
-        const json = meta.includes(";base64") ? atob(data) : decodeURIComponent(data);
-        return JSON.parse(json);
-      } catch (_) {
-        return null;
-      }
-    }
-    const mapResponse = await fetch(new URL(ref, generatedUrl).href, { cache: "no-store" }).catch(() => null);
-    return mapResponse && mapResponse.ok ? safeJson(mapResponse) : null;
-  })();
-  sourceMapCache.set(generatedUrl, promise);
-  return promise;
-}
-async function mapGeneratedLocation(url, line, column) {
-  const map = await loadSourceMapForGeneratedUrl(url);
-  return map ? findOriginalPosition(map, line, column) : null;
-}
-async function mapLocationText(text) {
-  if (!text) return text;
-  const match = String(text).match(/(https?:\\/\\/[^\\s)]+):(\\d+):(\\d+)/);
-  if (!match) return text;
-  const mapped = await mapGeneratedLocation(match[1], Number(match[2]), Number(match[3]));
-  if (!mapped) return text;
-  return String(text).replace(match[0], mapped.source + ":" + mapped.line + ":" + mapped.column);
-}
-async function mapStackTrace(stack) {
-  if (typeof stack !== "string") return stack;
-  const lines = await Promise.all(stack.split("\\n").map(mapLocationText));
-  return lines.join("\\n");
-}
-async function normalizeRuntimeErrorWithSourceMap(error, file) {
-  const item = normalizeRuntimeError(error, file);
-  item.file = await mapLocationText(item.file);
-  item.message = await mapStackTrace(item.message);
-  return item;
-}
-async function showRuntimeOverlay(error, file) {
-  let item;
-  try {
-    item = await normalizeRuntimeErrorWithSourceMap(error, file);
-  } catch (_) {
-    item = normalizeRuntimeError(error, file);
-  }
-  showOverlay([item], "Runtime Error");
-}
-function showOverlay(errors, titleText = "Build Error") {
-  hideOverlay();
-  const items = normalizeErrors(errors);
-  overlay = document.createElement("div");
-  overlay.id = "zntc-error-overlay";
-  const root = overlay.attachShadow({ mode: "open" });
-  const style = document.createElement("style");
-  style.textContent = ":host{position:fixed;inset:0;z-index:2147483647;display:block;--font:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--red:#fb7185;--text:#f8fafc;--blue:#93c5fd;--window:#181818;}" +
-    ".backdrop{position:fixed;inset:0;overflow:auto;padding:32px;box-sizing:border-box;background:rgba(0,0,0,.66);font:14px/1.5 var(--font);color:var(--text);}" +
-    ".window{max-width:980px;margin:0 auto;background:var(--window);border-top:8px solid var(--red);border-radius:6px 6px 8px 8px;box-shadow:0 19px 38px rgba(0,0,0,.30),0 15px 12px rgba(0,0,0,.22);overflow:hidden;}" +
-    ".header{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.12);}" +
-    ".title{font-size:18px;font-weight:700;color:#fecdd3;}" +
-    ".close{width:30px;height:30px;border:1px solid rgba(255,255,255,.25);border-radius:4px;background:#111827;color:var(--text);cursor:pointer;font:18px/1 var(--font);}" +
-    ".card{padding:18px 20px;border-top:1px solid rgba(255,255,255,.08);}" +
-    ".file{margin-bottom:10px;color:var(--blue);word-break:break-all;}" +
-    ".message{margin:0;white-space:pre-wrap;color:#fff;word-break:break-word;font:14px/1.5 var(--font);}";
-  const backdrop = document.createElement("div");
-  backdrop.className = "backdrop";
-  const panel = document.createElement("div");
-  panel.className = "window";
-  panel.onclick = (event) => event.stopPropagation();
-  const header = document.createElement("div");
-  header.className = "header";
-  const title = document.createElement("div");
-  title.className = "title";
-  title.textContent = titleText;
-  const close = document.createElement("button");
-  close.type = "button";
-  close.textContent = "x";
-  close.className = "close";
-  close.setAttribute("aria-label", "Close error overlay");
-  close.onclick = hideOverlay;
-  header.appendChild(title);
-  header.appendChild(close);
-  panel.appendChild(header);
-  for (const item of items) {
-    const card = document.createElement("div");
-    card.className = "card";
-    if (item.file) {
-      const file = document.createElement("div");
-      file.className = "file";
-      file.textContent = item.file;
-      card.appendChild(file);
-    }
-    const message = document.createElement("pre");
-    message.className = "message";
-    message.textContent = item.message;
-    card.appendChild(message);
-    panel.appendChild(card);
-  }
-  backdrop.appendChild(panel);
-  root.appendChild(style);
-  root.appendChild(backdrop);
-  closeOverlayOnEsc = (event) => {
-    if (event.key === "Escape" || event.code === "Escape") hideOverlay();
-  };
-  document.addEventListener("keydown", closeOverlayOnEsc);
-  (document.body || document.documentElement).appendChild(overlay);
-}
-globalThis.__zntc_show_error_overlay = showOverlay;
-globalThis.__zntc_clear_error_overlay = hideOverlay;
-if (!globalThis.__zntc_runtime_listeners_attached) {
-  globalThis.__zntc_runtime_listeners_attached = true;
-  window.addEventListener("error", (event) => {
-    const file = event.filename ? event.filename + ":" + event.lineno + ":" + event.colno : "";
-    showRuntimeOverlay(event.error || event.message, file);
-  });
-  window.addEventListener("unhandledrejection", (event) => {
-    showRuntimeOverlay(event.reason, "");
-  });
-}
-const socket = new WebSocket(socketProtocol + "//" + location.host + "${APP_DEV_HMR_WS_PATH}");
-socket.addEventListener("message", (event) => {
-  const msg = JSON.parse(event.data);
-  if (msg.type === "${HMR_MSG.Error}") {
-    showOverlay(msg.errors);
-    return;
-  }
-  if (msg.type === "${HMR_MSG.ClearError}") {
-    hideOverlay();
-    return;
-  }
-  if (msg.type === "${HMR_MSG.FullReload}") {
-    hideOverlay();
-    location.reload();
-    return;
-  }
-  if (msg.type !== "${HMR_MSG.CssUpdate}") return;
-  hideOverlay();
-  const stamp = msg.timestamp || Date.now();
-  const links = Array.from(document.querySelectorAll('link[rel="stylesheet"]'));
-  let updated = false;
-  for (const link of links) {
-    const href = link.getAttribute("href");
-    if (!href) continue;
-    const current = new URL(href, location.href);
-    const target = new URL(msg.href || current.pathname, location.href);
-    if (msg.href && current.pathname !== target.pathname) continue;
-    const next = new URL(current.href);
-    next.searchParams.set("t", String(stamp));
-    const replacement = link.cloneNode();
-    replacement.href = next.href;
-    replacement.onload = () => link.remove();
-    replacement.onerror = () => location.reload();
-    link.after(replacement);
-    updated = true;
-  }
-  if (!updated) location.reload();
-});
-`;
+const RAW_TEMPLATE_PATH = new URL("./dev-overlay-client.raw.js", import.meta.url),PLACEHOLDERS = [["__ZNTC_HMR_WS_PATH__", APP_DEV_HMR_WS_PATH], ["__ZNTC_HMR_MSG_ERROR__", HMR_MSG.Error], ["__ZNTC_HMR_MSG_CLEAR_ERROR__", HMR_MSG.ClearError], ["__ZNTC_HMR_MSG_UPDATE_START__", HMR_MSG.UpdateStart], ["__ZNTC_HMR_MSG_UPDATE_DONE__", HMR_MSG.UpdateDone], ["__ZNTC_HMR_MSG_UPDATE__", HMR_MSG.Update], ["__ZNTC_HMR_MSG_FULL_RELOAD__", HMR_MSG.FullReload], ["__ZNTC_HMR_MSG_CSS_UPDATE__", HMR_MSG.CssUpdate]];
+function substitute(raw) {
+	let out = raw;
+	for (const [token, value] of PLACEHOLDERS) {
+		out = out.replaceAll(token, value);
+	}
+	return out;
+}
+const APP_DEV_HMR_CLIENT = substitute(readFileSync$6(RAW_TEMPLATE_PATH, "utf8"));
 //#endregion
 //#region index.ts
-export { APP_DEV_HMR_CLIENT_PATH, APP_DEV_HMR_WS_PATH, createHmrChannel, createWatcher, HMR_MSG, injectAppDevBundleCssLinks, injectAppDevHmrClient, injectAppDevPipelineCssLinks, injectIntoDevHtml, DEFAULT_HTML_ENV_PREFIX, applyHtmlEnvTokens, transformHtmlEnvTokens, joinUrl, isCssIdent, isCssIdentStart, skipCssString, skipCssUrl, startsWithCssIdent, collectAppFiles, requireFromAppOrFallback, collectPostcssMessages, findPostcssConfig, isCssFile, isPostcssConfigFile, loadPostcssConfig, logPostcssProcessed, POSTCSS_CONFIG_NAMES, runPostcssForAppDev, runPostcssIfConfigured, buildCssPreprocessorProxy, CSS_PREPROCESSOR_EXTENSIONS, compileSassFile, cssPreprocessorOutputPath, cssPreprocessorProxyPath, isCssModulePreprocessorFile, isCssPreprocessorFile, isStyleReferenceSource, loadSassCompiler, rewriteSassReferences, transformCssPreprocessors, buildCssModuleProxy, collectCssModuleClasses, cssModuleGeneratedCssPath, cssModuleLocalName, cssModuleProxyPath, isCssModuleFile, isValidExportName, rewriteCssModuleClasses, rewriteCssModuleReferences, scanCssModuleClassTokens, transformCssModules, cleanupPostcssTempRoot, createAppDevController, prepareAppCssPipelineRoot, APP_DEV_HMR_CLIENT };
+export { APP_DEV_HMR_CLIENT_PATH, APP_DEV_HMR_WS_PATH, APP_DEV_REACT_REFRESH_PATH, broadcastRebuildEvent, createHmrChannel, createWatcher, HMR_MSG, injectAppDevBundleCssLinks, injectAppDevBundleCssLinksFromOutdir, injectAppDevHmrClient, injectAppDevPipelineCssLinks, injectAppDevReactRefreshPreamble, injectIntoDevHtml, buildReactRefreshPreamble, DEFAULT_HTML_ENV_PREFIX, applyHtmlEnvTokens, transformHtmlEnvTokens, joinUrl, isCssIdent, isCssIdentStart, skipCssString, skipCssUrl, startsWithCssIdent, collectAppFiles, requireFromAppOrFallback, collectPostcssMessages, findPostcssConfig, isCssFile, isPostcssConfigFile, loadPostcssConfig, logPostcssProcessed, POSTCSS_CONFIG_NAMES, runPostcssForAppDev, runPostcssIfConfigured, buildCssPreprocessorProxy, CSS_PREPROCESSOR_EXTENSIONS, compileSassFile, cssPreprocessorOutputPath, cssPreprocessorProxyPath, isCssModulePreprocessorFile, isCssPreprocessorFile, isStyleReferenceSource, loadSassCompiler, rewriteSassReferences, transformCssPreprocessors, buildCssModuleProxy, collectCssModuleClasses, cssModuleGeneratedCssPath, cssModuleLocalName, cssModuleProxyPath, isCssModuleFile, isValidExportName, rewriteCssModuleClasses, rewriteCssModuleReferences, scanCssModuleClassTokens, transformCssModules, cleanupPostcssTempRoot, createAppDevController, prepareAppCssPipelineRoot, APP_DEV_HMR_CLIENT };
 //#endregion