@vertz/ui-server 0.2.10 → 0.2.12

package/dist/bun-dev-server.d.ts

@@ -40,6 +40,28 @@ interface ErrorDetail {
 	stack?: string;
 }
 type ErrorCategory = "build" | "resolve" | "runtime" | "ssr";
+/** A resolved stack frame for terminal logging. */
+interface TerminalStackFrame {
+	functionName: string | null;
+	file: string;
+	line: number;
+	column: number;
+}
+/**
+* Format a runtime error for terminal output.
+* Produces a [Browser]-prefixed message with optional file location,
+* line text snippet, and resolved stack frames.
+*/
+declare function formatTerminalRuntimeError(errors: ErrorDetail[], parsedStack?: TerminalStackFrame[]): string;
+/**
+* Create a deduplicator for terminal runtime error logs.
+* Returns `shouldLog` (true if this error hasn't been logged recently)
+* and `reset` (to clear on file change).
+*/
+declare function createRuntimeErrorDeduplicator(): {
+	shouldLog: (message: string, file?: string, line?: number) => boolean;
+	reset: () => void;
+};
 interface BunDevServer {
 	start(): Promise<void>;
 	stop(): Promise<void>;
@@ -53,15 +75,6 @@ interface BunDevServer {
 	/** Set the last changed file path (for testing). */
 	setLastChangedFile(file: string): void;
 }
-interface IndexHtmlStasher {
-	stash(): void;
-	restore(): void;
-}
-/**
-* Create a stasher that renames index.html during dev so Bun's built-in
-* HMR server doesn't auto-serve it, bypassing our SSR fetch handler.
-*/
-declare function createIndexHtmlStasher(projectRoot: string): IndexHtmlStasher;
 interface HMRAssets {
 	/** Discovered `/_bun/client/<hash>.js` URL, or null if not found */
 	scriptUrl: string | null;
@@ -119,4 +132,4 @@ declare function buildScriptTag(bundledScriptUrl: string | null, hmrBootstrapScr
 * SSR is always on. HMR always works. No mode toggle needed.
 */
 declare function createBunDevServer(options: BunDevServerOptions): BunDevServer;
-export { parseHMRAssets, generateSSRPageHtml, createIndexHtmlStasher, createFetchInterceptor, createBunDevServer, buildScriptTag, SSRPageHtmlOptions, IndexHtmlStasher, HMRAssets, FetchInterceptorOptions, ErrorDetail, ErrorCategory, BunDevServerOptions, BunDevServer };
+export { parseHMRAssets, generateSSRPageHtml, formatTerminalRuntimeError, createRuntimeErrorDeduplicator, createFetchInterceptor, createBunDevServer, buildScriptTag, SSRPageHtmlOptions, HMRAssets, FetchInterceptorOptions, ErrorDetail, ErrorCategory, BunDevServerOptions, BunDevServer };

package/dist/bun-dev-server.js

@@ -5,7 +5,7 @@ import {
 
 // src/bun-dev-server.ts
 import { execSync } from "child_process";
-import { existsSync, mkdirSync, readFileSync as readFileSync2, renameSync, watch, writeFileSync as writeFileSync2 } from "fs";
+import { existsSync, mkdirSync, readFileSync as readFileSync2, watch, writeFileSync as writeFileSync2 } from "fs";
 import { dirname, normalize, resolve } from "path";
 
 // src/debug-logger.ts
@@ -62,6 +62,8 @@ class DiagnosticsCollector {
   wsConnectedClients = 0;
   watcherLastChangedFile = null;
   watcherLastChangeTime = null;
+  static MAX_RUNTIME_ERRORS = 10;
+  runtimeErrorsBuffer = [];
   recordPluginConfig(filter, hmr, fastRefresh) {
     this.pluginFilter = filter;
     this.pluginHmr = hmr;
@@ -103,6 +105,19 @@ class DiagnosticsCollector {
     this.watcherLastChangedFile = file;
     this.watcherLastChangeTime = new Date().toISOString();
   }
+  recordRuntimeError(message, source) {
+    this.runtimeErrorsBuffer.push({
+      message,
+      source,
+      timestamp: new Date().toISOString()
+    });
+    if (this.runtimeErrorsBuffer.length > DiagnosticsCollector.MAX_RUNTIME_ERRORS) {
+      this.runtimeErrorsBuffer = this.runtimeErrorsBuffer.slice(this.runtimeErrorsBuffer.length - DiagnosticsCollector.MAX_RUNTIME_ERRORS);
+    }
+  }
+  clearRuntimeErrors() {
+    this.runtimeErrorsBuffer = [];
+  }
   getSnapshot() {
     return {
       status: "ok",
@@ -137,7 +152,8 @@ class DiagnosticsCollector {
       watcher: {
         lastChangedFile: this.watcherLastChangedFile,
         lastChangeTime: this.watcherLastChangeTime
-      }
+      },
+      runtimeErrors: [...this.runtimeErrorsBuffer]
     };
   }
 }
@@ -1199,6 +1215,45 @@ data: ${safeSerialize(entry)}
 }
 
 // src/bun-dev-server.ts
+var MAX_TERMINAL_STACK_FRAMES = 5;
+function formatTerminalRuntimeError(errors, parsedStack) {
+  const primary = errors[0];
+  if (!primary)
+    return "";
+  const lines = [];
+  lines.push(`[Browser] ${primary.message}`);
+  if (primary.file) {
+    const loc = primary.line ? `${primary.file}:${primary.line}${primary.column != null ? `:${primary.column}` : ""}` : primary.file;
+    lines.push(`  at ${loc}`);
+  }
+  if (primary.lineText) {
+    lines.push(`  \u2502 ${primary.lineText}`);
+  }
+  if (parsedStack?.length) {
+    const frames = parsedStack.slice(0, MAX_TERMINAL_STACK_FRAMES);
+    for (const frame of frames) {
+      const fn = frame.functionName ? `${frame.functionName} ` : "";
+      lines.push(`  at ${fn}${frame.file}:${frame.line}:${frame.column}`);
+    }
+  }
+  return lines.join(`
+`);
+}
+function createRuntimeErrorDeduplicator() {
+  let lastKey = "";
+  return {
+    shouldLog(message, file, line) {
+      const key = `${message}::${file ?? ""}::${line ?? ""}`;
+      if (key === lastKey)
+        return false;
+      lastKey = key;
+      return true;
+    },
+    reset() {
+      lastKey = "";
+    }
+  };
+}
 function killStaleProcess(targetPort) {
   try {
     const output = execSync(`lsof -ti :${targetPort}`, { encoding: "utf8" }).trim();
@@ -1217,29 +1272,6 @@ function killStaleProcess(targetPort) {
     }
   } catch {}
 }
-function createIndexHtmlStasher(projectRoot) {
-  const indexHtmlPath = resolve(projectRoot, "index.html");
-  const indexHtmlBackupPath = resolve(projectRoot, ".vertz", "dev", "index.html.bak");
-  let stashed = false;
-  return {
-    stash() {
-      if (!existsSync(indexHtmlPath) && existsSync(indexHtmlBackupPath)) {
-        renameSync(indexHtmlBackupPath, indexHtmlPath);
-      }
-      if (existsSync(indexHtmlPath)) {
-        mkdirSync(resolve(projectRoot, ".vertz", "dev"), { recursive: true });
-        renameSync(indexHtmlPath, indexHtmlBackupPath);
-        stashed = true;
-      }
-    },
-    restore() {
-      if (stashed && existsSync(indexHtmlBackupPath)) {
-        renameSync(indexHtmlBackupPath, indexHtmlPath);
-        stashed = false;
-      }
-    }
-  };
-}
 function parseHMRAssets(html) {
   const srcMatch = html.match(/src="(\/_bun\/client\/[^"]+\.js)"/);
   const bootstrapMatch = html.match(/<script>(\(\(a\)=>\{document\.addEventListener.*?)<\/script>/);
@@ -1585,6 +1617,7 @@ function createBunDevServer(options) {
   let lastBuildError = "";
   let lastBroadcastedError = "";
   let lastChangedFile = "";
+  const terminalDedup = createRuntimeErrorDeduplicator();
   const resolvePatterns = ["Could not resolve", "Module not found", "Cannot find module"];
   const hmrErrorPattern = /\[vertz-hmr\] Error re-mounting (\w+): ([\s\S]*?)(?:\n\s+at |$)/;
   const frontendErrorPattern = /\x1b\[31mfrontend\x1b\[0m ([\s\S]*?)(?:\n\s+from browser|$)/;
@@ -1611,6 +1644,19 @@ function createBunDevServer(options) {
     return { message: "" };
   }
   const origConsoleError = console.error;
+  function logRuntimeErrorToTerminal(errors, parsedStack) {
+    const primary = errors[0];
+    if (!primary)
+      return;
+    if (!terminalDedup.shouldLog(primary.message, primary.file, primary.line))
+      return;
+    const formatted = formatTerminalRuntimeError(errors, parsedStack);
+    if (formatted) {
+      origConsoleError(formatted);
+    }
+    diagnostics.recordRuntimeError(primary.message, primary.file ?? null);
+    diagnostics.recordError("runtime", primary.message);
+  }
   console.error = (...args) => {
     const text = args.map((a) => typeof a === "string" ? a : String(a)).join(" ");
     if (!text.startsWith("[Server]")) {
@@ -1666,7 +1712,6 @@ function createBunDevServer(options) {
     }
     origConsoleError.apply(console, args);
   };
-  const indexHtmlStasher = createIndexHtmlStasher(projectRoot);
   let cachedSpec = null;
   let specWatcher = null;
   const loadOpenAPISpec = () => {
@@ -1718,7 +1763,6 @@ function createBunDevServer(options) {
     return new Response("OpenAPI spec not found", { status: 404 });
   };
   async function start() {
-    indexHtmlStasher.stash();
     const { plugin } = await Promise.resolve(globalThis.Bun);
     const { createVertzBunPlugin } = await import("./bun-plugin/index.js");
     const entryPath = resolve(projectRoot, entry);
@@ -2001,6 +2045,7 @@ data: {}
                       parsedStack: result.parsedStack
                     };
                     currentError = { category: "runtime", errors: enrichedErrors };
+                    logRuntimeErrorToTerminal(enrichedErrors, result.parsedStack);
                     const text2 = JSON.stringify(payload2);
                     for (const client of wsClients) {
                       client.sendText(text2);
@@ -2015,6 +2060,7 @@ data: {}
                   parsedStack: result.parsedStack
                 };
                 currentError = { category: "runtime", errors: result.errors };
+                logRuntimeErrorToTerminal(result.errors, result.parsedStack);
                 const text = JSON.stringify(payload);
                 for (const client of wsClients) {
                   client.sendText(text);
@@ -2036,12 +2082,17 @@ data: {}
                     errors
                   };
                   currentError = { category: "runtime", errors };
+                  logRuntimeErrorToTerminal(errors);
                   const text = JSON.stringify(payload);
                   for (const client of wsClients) {
                     client.sendText(text);
                   }
                 } else {
-                  broadcastError("runtime", [{ message: data.message ?? "Unknown error" }]);
+                  const fallbackErrors = [
+                    { message: data.message ?? "Unknown error" }
+                  ];
+                  logRuntimeErrorToTerminal(fallbackErrors);
+                  broadcastError("runtime", fallbackErrors);
                 }
               });
             }
@@ -2096,6 +2147,8 @@ data: {}
           diagnostics.recordFileChange(lastChangedFile);
           logger.log("watcher", "file-changed", { file: lastChangedFile });
           lastBroadcastedError = "";
+          terminalDedup.reset();
+          diagnostics.clearRuntimeErrors();
           sourceMapResolver.invalidate();
           if (logRequests) {
             console.log(`[Server] File changed: ${filename}`);
@@ -2233,14 +2286,14 @@ data: {}
         server.stop(true);
         server = null;
       }
-      indexHtmlStasher.restore();
     }
   };
 }
 export {
   parseHMRAssets,
   generateSSRPageHtml,
-  createIndexHtmlStasher,
+  formatTerminalRuntimeError,
+  createRuntimeErrorDeduplicator,
   createFetchInterceptor,
   createBunDevServer,
   buildScriptTag

package/dist/bun-plugin/fast-refresh-runtime.d.ts

@@ -7,6 +7,8 @@ type ContextScope = NonNullable<ReturnType<typeof getContextScope>>;
 interface SignalRef {
 	peek(): unknown;
 	value: unknown;
+	/** Optional HMR key for name-based signal matching (set by compiler). */
+	_hmrKey?: string;
 }
 /**
 * Register or update a component factory in the registry.
@@ -15,7 +17,7 @@ interface SignalRef {
 * On first load: creates a new record. On HMR re-evaluation: updates
 * the factory reference (instances are preserved for __$refreshPerform).
 */
-declare function __$refreshReg(moduleId: string, name: string, factory: (...args: unknown[]) => HTMLElement): void;
+declare function __$refreshReg(moduleId: string, name: string, factory: (...args: unknown[]) => HTMLElement, hash?: string): void;
 /**
 * Track a live component instance for HMR replacement.
 *

package/dist/bun-plugin/fast-refresh-runtime.js

@@ -23,6 +23,7 @@ var DIRTY_KEY = Symbol.for("vertz:fast-refresh:dirty");
 var registry = globalThis[REGISTRY_KEY] ??= new Map;
 var dirtyModules = globalThis[DIRTY_KEY] ??= new Set;
 var performingRefresh = false;
+var refreshSignals = null;
 function getModule(moduleId) {
   let mod = registry.get(moduleId);
   if (!mod) {
@@ -31,19 +32,24 @@ function getModule(moduleId) {
   }
   return mod;
 }
-function __$refreshReg(moduleId, name, factory) {
+function __$refreshReg(moduleId, name, factory, hash) {
   const mod = getModule(moduleId);
   const existing = mod.get(name);
   if (existing) {
+    if (hash && existing.hash === hash)
+      return;
     existing.factory = factory;
+    existing.hash = hash;
     dirtyModules.add(moduleId);
   } else {
-    mod.set(name, { factory, instances: [] });
+    mod.set(name, { factory, instances: [], hash });
   }
 }
 function __$refreshTrack(moduleId, name, element, args, cleanups, contextScope, signals = []) {
-  if (performingRefresh)
+  if (performingRefresh) {
+    refreshSignals = signals;
     return element;
+  }
   const mod = registry.get(moduleId);
   if (!mod)
     return element;
@@ -76,12 +82,13 @@ function __$refreshPerform(moduleId) {
       let newSignals;
       let newContextScope;
       try {
-        startSignalCollection();
+        refreshSignals = null;
         newElement = factory(...args);
-        newSignals = stopSignalCollection();
+        newSignals = refreshSignals ?? [];
+        refreshSignals = null;
         newContextScope = getContextScope();
       } catch (err) {
-        stopSignalCollection();
+        refreshSignals = null;
         runCleanups(newCleanups);
         popScope();
         setContextScope(prevScope);
@@ -89,21 +96,33 @@ function __$refreshPerform(moduleId) {
         updatedInstances.push(instance);
         continue;
       }
-      if (savedValues.length > 0 && newSignals.length === savedValues.length) {
-        for (let i = 0;i < newSignals.length; i++) {
-          const sig = newSignals[i];
-          if (sig)
-            sig.value = savedValues[i];
+      try {
+        if (savedValues.length > 0) {
+          const namedSaved = new Map;
+          const unnamedSaved = [];
+          for (const s of oldSignals) {
+            if (s._hmrKey)
+              namedSaved.set(s._hmrKey, s.peek());
+            else
+              unnamedSaved.push(s.peek());
+          }
+          let unnamedIdx = 0;
+          for (const sig of newSignals) {
+            if (sig._hmrKey && namedSaved.has(sig._hmrKey)) {
+              sig.value = namedSaved.get(sig._hmrKey);
+            } else if (!sig._hmrKey && unnamedIdx < unnamedSaved.length) {
+              sig.value = unnamedSaved[unnamedIdx++];
+            }
+          }
         }
-      } else if (savedValues.length > 0 && newSignals.length !== savedValues.length) {
-        console.warn(`[vertz-hmr] Signal count changed in ${name} ` + `(${savedValues.length} \u2192 ${newSignals.length}). State reset.`);
-      }
-      popScope();
-      runCleanups(cleanups);
-      if (newCleanups.length > 0) {
-        _tryOnCleanup(() => runCleanups(newCleanups));
+        popScope();
+        runCleanups(cleanups);
+        if (newCleanups.length > 0) {
+          _tryOnCleanup(() => runCleanups(newCleanups));
+        }
+      } finally {
+        setContextScope(prevScope);
       }
-      setContextScope(prevScope);
       let domSnapshot = null;
       try {
         domSnapshot = captureDOMState(element);

package/dist/bun-plugin/index.d.ts

@@ -5,6 +5,11 @@ interface DebugLogger {
 	log(category: DebugCategory, message: string, data?: Record<string, unknown>): void;
 	isEnabled(category: DebugCategory): boolean;
 }
+interface RuntimeErrorEntry {
+	message: string;
+	source: string | null;
+	timestamp: string;
+}
 interface DiagnosticsSnapshot {
 	status: "ok";
 	uptime: number;
@@ -39,6 +44,7 @@ interface DiagnosticsSnapshot {
 		lastChangedFile: string | null;
 		lastChangeTime: string | null;
 	};
+	runtimeErrors: RuntimeErrorEntry[];
 }
 declare class DiagnosticsCollector {
 	private startTime;
@@ -61,6 +67,8 @@ declare class DiagnosticsCollector {
 	private wsConnectedClients;
 	private watcherLastChangedFile;
 	private watcherLastChangeTime;
+	private static readonly MAX_RUNTIME_ERRORS;
+	private runtimeErrorsBuffer;
 	recordPluginConfig(filter: string, hmr: boolean, fastRefresh: boolean): void;
 	recordPluginProcess(file: string): void;
 	recordSSRReload(success: boolean, durationMs: number, error?: string): void;
@@ -69,6 +77,8 @@ declare class DiagnosticsCollector {
 	recordErrorClear(): void;
 	recordWebSocketChange(count: number): void;
 	recordFileChange(file: string): void;
+	recordRuntimeError(message: string, source: string | null): void;
+	clearRuntimeErrors(): void;
 	getSnapshot(): DiagnosticsSnapshot;
 }
 import { BunPlugin as BunPlugin_seob6 } from "bun";

package/dist/bun-plugin/index.js

@@ -41,12 +41,17 @@ function injectContextStableIds(source, sourceFile, relFilePath) {
 }
 
 // src/bun-plugin/fast-refresh-codegen.ts
-function generateRefreshPreamble(moduleId) {
+function generateRefreshPreamble(moduleId, contentHash) {
   const escapedId = moduleId.replace(/['\\]/g, "\\$&");
-  return `const __$fr = globalThis[Symbol.for('vertz:fast-refresh')];
+  let code = `const __$fr = globalThis[Symbol.for('vertz:fast-refresh')];
 ` + `const { __$refreshReg, __$refreshTrack, __$refreshPerform, ` + `pushScope: __$pushScope, popScope: __$popScope, ` + `_tryOnCleanup: __$tryCleanup, runCleanups: __$runCleanups, ` + `getContextScope: __$getCtx, setContextScope: __$setCtx, ` + `startSignalCollection: __$startSigCol, stopSignalCollection: __$stopSigCol } = __$fr;
 ` + `const __$moduleId = '${escapedId}';
 `;
+  if (contentHash) {
+    code += `const __$moduleHash = '${contentHash}';
+`;
+  }
+  return code;
 }
 function generateRefreshWrapper(componentName) {
   return `
@@ -63,17 +68,17 @@ const __$orig_${componentName} = ${componentName};
 ` + `  }
 ` + `  return __$refreshTrack(__$moduleId, '${componentName}', __$ret, __$args, __$scope, __$ctx, __$sigs);
 ` + `};
-` + `__$refreshReg(__$moduleId, '${componentName}', ${componentName});
+` + `__$refreshReg(__$moduleId, '${componentName}', ${componentName}, __$moduleHash);
 `;
 }
 function generateRefreshPerform() {
   return `__$refreshPerform(__$moduleId);
 `;
 }
-function generateRefreshCode(moduleId, components) {
+function generateRefreshCode(moduleId, components, contentHash) {
   if (components.length === 0)
     return null;
-  const preamble = generateRefreshPreamble(moduleId);
+  const preamble = generateRefreshPreamble(moduleId, contentHash);
   let epilogue = "";
   for (const comp of components) {
     epilogue += generateRefreshWrapper(comp.name);
@@ -159,15 +164,13 @@ function createVertzBunPlugin(options) {
           let refreshEpilogue = "";
           if (fastRefresh) {
             const components = componentAnalyzer.analyze(hydrationSourceFile);
-            const refreshCode = generateRefreshCode(args.path, components);
+            const contentHash = Bun.hash(source).toString(36);
+            const refreshCode = generateRefreshCode(args.path, components, contentHash);
             if (refreshCode) {
               refreshPreamble = refreshCode.preamble;
               refreshEpilogue = refreshCode.epilogue;
             }
           }
-          const mapBase64 = Buffer.from(remapped.toString()).toString("base64");
-          const sourceMapComment = `
-//# sourceMappingURL=data:application/json;base64,${mapBase64}`;
           let contents = "";
           if (cssImportLine) {
             contents += cssImportLine;
@@ -175,6 +178,14 @@ function createVertzBunPlugin(options) {
           if (refreshPreamble) {
             contents += refreshPreamble;
           }
+          const prependedLines = contents.split(`
+`).length - 1;
+          if (prependedLines > 0) {
+            remapped.mappings = ";".repeat(prependedLines) + remapped.mappings;
+          }
+          const mapBase64 = Buffer.from(remapped.toString()).toString("base64");
+          const sourceMapComment = `
+//# sourceMappingURL=data:application/json;base64,${mapBase64}`;
           contents += compileResult.code;
           if (refreshEpilogue) {
             contents += refreshEpilogue;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vertz/ui-server",
-  "version": "0.2.10",
+  "version": "0.2.12",
   "type": "module",
   "license": "MIT",
   "description": "Vertz UI server-side rendering runtime",
@@ -53,9 +53,9 @@
   "dependencies": {
     "@ampproject/remapping": "^2.3.0",
     "@jridgewell/trace-mapping": "^0.3.31",
-    "@vertz/core": "^0.2.4",
-    "@vertz/ui": "^0.2.2",
-    "@vertz/ui-compiler": "^0.2.4",
+    "@vertz/core": "^0.2.11",
+    "@vertz/ui": "^0.2.11",
+    "@vertz/ui-compiler": "^0.2.11",
     "magic-string": "^0.30.0",
     "ts-morph": "^27.0.2"
   },