@teamvelix/velix 5.2.6 → 5.2.8

package/dist/{chunk-HGP4TUJS.js → chunk-HMCBOHTD.js}

@@ -1,10 +1,10 @@
-import { logger_default, buildRouteTree, matchRoute, VERSION } from './chunk-MLLSS7Y5.js';
+import { definePlugin, PluginHooks, logger_default, loadPlugins, pluginManager, buildRouteTree, matchRoute, VERSION } from './chunk-RU23OKU5.js';
 import { loadConfig, resolvePaths } from './chunk-F24Q2MX3.js';
 import { getRegisteredIslands, generateAdvancedHydrationScript } from './chunk-JI2HJFUT.js';
-import { __dirname as __dirname$1 } from './chunk-4S5YQJHB.js';
+import { __dirname as __dirname$1, __require } from './chunk-BQ4HFLRL.js';
 import http from 'http';
-import fs4 from 'fs';
-import path4 from 'path';
+import fs3 from 'fs';
+import path3 from 'path';
 import { pathToFileURL, fileURLToPath } from 'url';
 import { createRequire } from 'module';
 import React, { useActionState } from 'react';
@@ -73,11 +73,11 @@ async function loadMiddleware(projectRoot) {
   const fns = [];
   const possibleFiles = ["proxy.ts", "proxy.js"];
   for (const file of possibleFiles) {
-    const filePath = path4.join(projectRoot, file);
-    if (!fs4.existsSync(filePath)) continue;
+    const filePath = path3.join(projectRoot, file);
+    if (!fs3.existsSync(filePath)) continue;
     try {
-      const { pathToFileURL: pathToFileURL3 } = await import('url');
-      const url = pathToFileURL3(filePath).href;
+      const { pathToFileURL: pathToFileURL2 } = await import('url');
+      const url = pathToFileURL2(filePath).href;
       const mod = await import(`${url}?t=${Date.now()}`);
       const fn = mod.default || mod.proxy || mod.middleware;
       if (typeof fn === "function") {
@@ -179,140 +179,6 @@ function composeMiddleware(...fns) {
     await run();
   };
 }
-var PluginHooks = {
-  CONFIG: "config",
-  SERVER_START: "server:start",
-  REQUEST: "request",
-  RESPONSE: "response",
-  ROUTES_LOADED: "routes:loaded",
-  BEFORE_RENDER: "render:before",
-  AFTER_RENDER: "render:after",
-  BUILD_START: "build:start",
-  BUILD_END: "build:end"
-};
-var PluginManager = class {
-  plugins = [];
-  hooks = /* @__PURE__ */ new Map();
-  /**
-   * Register a plugin
-   */
-  register(plugin) {
-    this.plugins.push(plugin);
-    if (plugin.hooks) {
-      for (const [hookName, handler] of Object.entries(plugin.hooks)) {
-        if (handler) {
-          const existing = this.hooks.get(hookName) || [];
-          existing.push(handler);
-          this.hooks.set(hookName, existing);
-        }
-      }
-    }
-  }
-  /**
-   * Run a hook with arguments
-   */
-  async runHook(hookName, ...args) {
-    const handlers = this.hooks.get(hookName) || [];
-    for (const handler of handlers) {
-      await handler(...args);
-    }
-  }
-  /**
-   * Run a waterfall hook — each handler transforms the first argument
-   */
-  async runWaterfallHook(hookName, value, ...args) {
-    const handlers = this.hooks.get(hookName) || [];
-    let result = value;
-    for (const handler of handlers) {
-      const transformed = await handler(result, ...args);
-      if (transformed !== void 0) result = transformed;
-    }
-    return result;
-  }
-  /**
-   * Get all registered plugins
-   */
-  getPlugins() {
-    return [...this.plugins];
-  }
-  /**
-   * Check if a plugin is registered
-   */
-  hasPlugin(name) {
-    return this.plugins.some((p) => p.name === name);
-  }
-};
-var pluginManager = new PluginManager();
-async function loadPlugins(projectRoot, config) {
-  const pluginEntries = config.plugins || [];
-  for (const entry of pluginEntries) {
-    try {
-      if (typeof entry === "string") {
-        const localPath = path4.join(projectRoot, "plugins", entry + ".ts");
-        const localPathJs = path4.join(projectRoot, "plugins", entry + ".js");
-        const localPathDir = path4.join(projectRoot, "plugins", entry, "index.ts");
-        let pluginPath = null;
-        if (fs4.existsSync(localPath)) pluginPath = localPath;
-        else if (fs4.existsSync(localPathJs)) pluginPath = localPathJs;
-        else if (fs4.existsSync(localPathDir)) pluginPath = localPathDir;
-        if (pluginPath) {
-          const url = pathToFileURL(pluginPath).href;
-          const mod = await import(`${url}?t=${Date.now()}`);
-          const plugin = mod.default || mod;
-          if (plugin.name) {
-            pluginManager.register(plugin);
-          }
-        } else {
-          try {
-            const mod = await import(entry);
-            const plugin = mod.default || mod;
-            if (plugin.name) pluginManager.register(plugin);
-          } catch {
-            console.warn(`\u26A0 Plugin not found: ${entry}`);
-          }
-        }
-      } else if (typeof entry === "object" && entry !== null && "name" in entry) {
-        pluginManager.register(entry);
-      }
-    } catch (err) {
-      const error = err;
-      console.warn(`\u26A0 Failed to load plugin: ${error?.message || String(error)}`);
-    }
-  }
-}
-function definePlugin(definition) {
-  return definition;
-}
-({
-  /**
-   * Security headers plugin
-   */
-  security: definePlugin({
-    name: "velix:security",
-    hooks: {
-      [PluginHooks.RESPONSE]: (_req, res) => {
-        const response = res;
-        if (!response.headersSent) {
-          response.setHeader("X-Content-Type-Options", "nosniff");
-          response.setHeader("X-Frame-Options", "DENY");
-          response.setHeader("X-XSS-Protection", "1; mode=block");
-        }
-      }
-    }
-  }),
-  /**
-   * Request logging plugin
-   */
-  logger: definePlugin({
-    name: "velix:logger",
-    hooks: {
-      [PluginHooks.RESPONSE]: (req, _res, duration) => {
-        const request = req;
-        console.log(`  ${request.method} ${request.url} ${duration}ms`);
-      }
-    }
-  })
-});
 function detectTailwindCli() {
   const v4 = spawnSync("npx @tailwindcss/cli --help", {
     stdio: "pipe",
@@ -362,13 +228,13 @@ function tailwindPlugin(options = {}) {
       [PluginHooks.SERVER_START]: async (server, isDevArg) => {
         const isDev = isDevArg;
         if (!isDev) return;
-        if (!fs4.existsSync(input)) {
+        if (!fs3.existsSync(input)) {
           logger_default.warn(`Tailwind input file not found: ${input}`);
           return;
         }
-        const outputDir = path4.dirname(output);
-        if (!fs4.existsSync(outputDir)) {
-          fs4.mkdirSync(outputDir, { recursive: true });
+        const outputDir = path3.dirname(output);
+        if (!fs3.existsSync(outputDir)) {
+          fs3.mkdirSync(outputDir, { recursive: true });
         }
         logger_default.info("Building initial Tailwind CSS...");
         try {
@@ -1313,517 +1179,520 @@ function generateDevToolsHtml(isDev, ctx = {}) {
 }
 
 // server/error-pages.ts
+function escapeHtml2(str) {
+  return str.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;");
+}
 function generate404Page(pathname = "/") {
   return `<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>404 - Page Not Found | Velix v5</title>
+    <title>404 - Page Not Found | Velix v${VERSION}</title>
     <link rel="icon" href="/favicon.webp">
     <style>
-        * { margin: 0; padding: 0; box-sizing: border-box; }
-        body { 
-          margin: 0; 
-          background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%); 
-          color: white; 
-          font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; 
-          display: flex; 
-          align-items: center; 
-          justify-content: center; 
-          min-height: 100vh; 
-          text-align: center;
-          overflow: hidden;
-        }
-        .container { 
-          max-width: 700px; 
-          padding: 60px 40px; 
-          position: relative;
-          z-index: 10;
-        }
-        .bg-pattern {
-          position: absolute;
-          inset: 0;
-          background-image: radial-gradient(circle at 20% 50%, rgba(34, 211, 238, 0.1) 0%, transparent 50%),
-                            radial-gradient(circle at 80% 80%, rgba(37, 99, 235, 0.1) 0%, transparent 50%);
-          z-index: 1;
-        }
-        h1 { 
-          font-size: 180px; 
-          font-weight: 900; 
-          margin: 0; 
-          background: linear-gradient(135deg, #22D3EE 0%, #2563EB 100%); 
-          -webkit-background-clip: text; 
-          -webkit-text-fill-color: transparent; 
-          line-height: 1; 
-          letter-spacing: -0.05em;
-          animation: fadeInUp 0.6s ease-out;
-        }
-        h2 { 
-          font-size: 36px; 
-          font-weight: 800; 
-          margin: 30px 0 15px; 
-          color: #F8FAFC;
-          animation: fadeInUp 0.6s ease-out 0.1s backwards;
+        *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
+        body {
+          background: #0a0a0a;
+          color: #ededed;
+          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          min-height: 100vh;
+          -webkit-font-smoothing: antialiased;
         }
-        p { 
-          color: #94A3B8; 
-          font-size: 18px; 
-          line-height: 1.7; 
-          margin-bottom: 40px;
-          animation: fadeInUp 0.6s ease-out 0.2s backwards;
+        .container {
+          display: flex;
+          align-items: center;
+          gap: 32px;
+          padding: 32px;
         }
-        code { 
-          background: rgba(255,255,255,0.1); 
-          padding: 4px 10px; 
-          border-radius: 6px; 
-          font-family: 'Fira Code', 'Courier New', monospace; 
-          color: #22D3EE; 
-          font-size: 16px;
-          border: 1px solid rgba(34, 211, 238, 0.2);
+        .code {
+          font-size: 48px;
+          font-weight: 700;
+          line-height: 1;
+          color: #fff;
+          border-right: 1px solid rgba(255,255,255,0.15);
+          padding-right: 32px;
         }
-        .btn-group {
-          display: flex;
-          gap: 16px;
-          justify-content: center;
-          flex-wrap: wrap;
-          animation: fadeInUp 0.6s ease-out 0.3s backwards;
+        .body h1 {
+          font-size: 18px;
+          font-weight: 600;
+          color: #ededed;
+          margin-bottom: 8px;
         }
-        .btn { 
-          display: inline-block; 
-          background: linear-gradient(135deg, #2563EB 0%, #1D4ED8 100%); 
-          color: white; 
-          text-decoration: none; 
-          padding: 14px 36px; 
-          border-radius: 12px; 
-          font-weight: 600; 
-          font-size: 16px;
-          transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); 
-          box-shadow: 0 10px 30px rgba(37, 99, 235, 0.3);
-          border: none;
-          cursor: pointer;
+        .body p {
+          font-size: 14px;
+          color: #888;
+          margin-bottom: 20px;
         }
-        .btn:hover { 
-          transform: translateY(-2px); 
-          box-shadow: 0 15px 40px rgba(37, 99, 235, 0.4);
+        .body p code {
+          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+          font-size: 13px;
+          background: rgba(255,255,255,0.07);
+          padding: 2px 6px;
+          border-radius: 4px;
+          color: #ccc;
         }
-        .btn-outline { 
-          background: transparent; 
-          color: #22D3EE; 
-          border: 2px solid #22D3EE; 
-          box-shadow: none;
+        .actions { display: flex; gap: 10px; }
+        .btn {
+          display: inline-block;
+          padding: 8px 18px;
+          border-radius: 8px;
+          font-size: 14px;
+          font-weight: 500;
+          text-decoration: none;
+          transition: all .15s;
+          border: 1px solid transparent;
         }
-        .btn-outline:hover { 
-          background: rgba(34, 211, 238, 0.1); 
-          box-shadow: 0 10px 30px rgba(34, 211, 238, 0.2);
+        .btn-primary {
+          background: #fff;
+          color: #000;
         }
-        @keyframes fadeInUp {
-          from {
-            opacity: 0;
-            transform: translateY(30px);
-          }
-          to {
-            opacity: 1;
-            transform: translateY(0);
-          }
+        .btn-primary:hover { background: #e5e5e5; }
+        .btn-secondary {
+          background: rgba(255,255,255,0.06);
+          color: #ededed;
+          border-color: rgba(255,255,255,0.1);
         }
+        .btn-secondary:hover { background: rgba(255,255,255,0.1); }
     </style>
 </head>
 <body>
-    <div class="bg-pattern"></div>
     <div class="container">
-        <h1>404</h1>
-        <h2>Page Not Found</h2>
-        <p>The page <code>${pathname}</code> could not be found.<br>It may have been moved or deleted.</p>
-        <div class="btn-group">
-          <a href="/" class="btn">Return Home</a>
-          <a href="javascript:history.back()" class="btn btn-outline">Go Back</a>
+        <div class="code">404</div>
+        <div class="body">
+            <h1>This page could not be found</h1>
+            <p>The path <code>${escapeHtml2(pathname)}</code> does not exist.</p>
+            <div class="actions">
+                <a href="/" class="btn btn-primary">Return Home</a>
+                <a href="javascript:history.back()" class="btn btn-secondary">Go Back</a>
+            </div>
         </div>
     </div>
 </body>
 </html>`;
 }
 function generate500Page(options) {
-  const { title, message, stack, isDev, pathname } = options;
-  let callStackCards = "";
-  let frameCount = 0;
+  const { message, stack, isDev, pathname } = options;
+  let frames = [];
+  let sourceSnippet = "";
+  let errorLine = 0;
+  let errorFile = "";
   if (isDev && stack) {
-    const stackLines = stack.split("\n").filter((line) => line.trim());
-    const frames = stackLines.slice(1).filter((line) => line.includes("at "));
-    frameCount = frames.length;
-    callStackCards = frames.map((frame, index) => {
-      const match = frame.match(/at\s+(.+?)\s+\((.+?)\)/) || frame.match(/at\s+(.+)/);
-      if (match) {
-        const funcName = match[1] || "anonymous";
-        const location = match[2] || match[1];
-        return `
-          <div class="error-card" data-frame="${index}">
-            <div class="card-header">
-              <div class="card-title">${funcName.trim()}</div>
-              <div class="card-number">${index + 1}</div>
-            </div>
-            <div class="card-location">${location.trim()}</div>
-          </div>
-        `;
+    const stackLines = stack.split("\n").filter((l) => l.trim());
+    frames = stackLines.slice(1).filter((line) => line.includes("at ")).map((frame) => {
+      const m1 = frame.match(/at\s+(.+?)\s+\((.+?):(\d+):\d+\)/);
+      if (m1) return { call: m1[1].trim(), file: m1[2], line: parseInt(m1[3], 10) };
+      const m2 = frame.match(/at\s+(.+?):(\d+):\d+/);
+      if (m2) return { call: "(anonymous)", file: m2[1].trim(), line: parseInt(m2[2], 10) };
+      return { call: frame.replace(/^\s*at\s+/, "").trim(), file: "", line: null };
+    });
+    const firstUserFrame = frames.find((f) => f.file && !f.file.includes("node_modules")) || frames[0];
+    if (firstUserFrame) {
+      errorFile = firstUserFrame.file;
+      errorLine = firstUserFrame.line || 0;
+      if (errorFile && errorLine > 0) {
+        try {
+          const fs4 = __require("fs");
+          if (fs4.existsSync(errorFile)) {
+            const src = fs4.readFileSync(errorFile, "utf-8").split("\n");
+            const start = Math.max(0, errorLine - 4);
+            const end = Math.min(src.length, errorLine + 3);
+            sourceSnippet = src.slice(start, end).map((l, i) => {
+              const num = start + i + 1;
+              const isErr = num === errorLine;
+              const numStr = String(num).padStart(3, " ");
+              if (isErr) {
+                return `<div class="src-line src-err"><span class="ln">${numStr}</span>${escapeHtml2(l)}</div>`;
+              }
+              return `<div class="src-line"><span class="ln">${numStr}</span>${escapeHtml2(l)}</div>`;
+            }).join("");
+          }
+        } catch (_) {
+        }
       }
-      return "";
-    }).join("");
+    }
+  }
+  const userFrames = frames.filter((f) => f.file && !f.file.includes("node_modules"));
+  const ignoredFrames = frames.filter((f) => !f.file || f.file.includes("node_modules"));
+  const shortFile = errorFile.replace(/\\/g, "/").replace(/.*\/(?=app\/|server\/|src\/|pages\/)/, "");
+  if (!isDev) {
+    return `<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>500 - Internal Server Error | Velix</title>
+    <link rel="icon" href="/favicon.webp">
+    <style>
+        *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
+        body {
+          background: #0a0a0a;
+          color: #ededed;
+          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
+          display: flex; align-items: center; justify-content: center;
+          min-height: 100vh;
+          -webkit-font-smoothing: antialiased;
+        }
+        .container { display: flex; align-items: center; gap: 32px; padding: 32px; }
+        .code { font-size: 48px; font-weight: 700; color: #fff; border-right: 1px solid rgba(255,255,255,0.15); padding-right: 32px; }
+        .body h1 { font-size: 18px; font-weight: 600; color: #ededed; margin-bottom: 8px; }
+        .body p { font-size: 14px; color: #888; margin-bottom: 20px; }
+        .btn { display: inline-block; padding: 8px 18px; border-radius: 8px; font-size: 14px; font-weight: 500; text-decoration: none; background: #fff; color: #000; transition: all .15s; }
+        .btn:hover { background: #e5e5e5; }
+    </style>
+</head>
+<body>
+    <div class="container">
+        <div class="code">500</div>
+        <div class="body">
+            <h1>Internal Server Error</h1>
+            <p>A server-side exception has occurred. Please try again later.</p>
+            <a href="/" class="btn">Return Home</a>
+        </div>
+    </div>
+</body>
+</html>`;
   }
   return `<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Error | Velix v5</title>
+    <title>Error | Velix v${VERSION}</title>
     <link rel="icon" href="/favicon.webp">
     <style>
-        * { margin: 0; padding: 0; box-sizing: border-box; }
-        body { 
-          margin: 0; 
-          background: linear-gradient(135deg, #0F172A 0%, #1E293B 100%);
-          color: #F8FAFC; 
-          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; 
+        *, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }
+
+        body {
+          background: rgba(0, 0, 0, 0.85);
+          color: #ededed;
+          font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
           min-height: 100vh;
-          overflow-x: hidden;
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          padding: 24px;
+          -webkit-font-smoothing: antialiased;
         }
-        .container {
-          max-width: 900px;
-          margin: 0 auto;
-          padding: 40px 20px;
+
+        /* \u2500\u2500 Overlay Card \u2500\u2500 */
+        .overlay {
+          width: 100%;
+          max-width: 940px;
+          background: #111;
+          border: 1px solid #2a2a2a;
+          border-radius: 12px;
+          box-shadow: 0 24px 64px rgba(0,0,0,0.6);
+          overflow: hidden;
+          display: flex;
+          flex-direction: column;
+          max-height: calc(100vh - 48px);
         }
-        .error-header {
-          background: linear-gradient(135deg, #EF4444 0%, #DC2626 100%);
-          color: white;
-          padding: 20px 28px;
-          border-radius: 16px;
+
+        /* \u2500\u2500 Header Bar \u2500\u2500 */
+        .header {
           display: flex;
           align-items: center;
-          gap: 14px;
-          margin-bottom: 28px;
-          font-size: 18px;
-          font-weight: 700;
-          box-shadow: 0 10px 40px rgba(239, 68, 68, 0.3);
-        }
-        .error-header svg {
-          width: 24px;
-          height: 24px;
+          justify-content: space-between;
+          padding: 12px 20px;
+          background: #161616;
+          border-bottom: 1px solid #2a2a2a;
+          gap: 12px;
           flex-shrink: 0;
         }
-        .error-badge {
-          display: inline-block;
-          background: linear-gradient(135deg, #1E40AF 0%, #1E3A8A 100%);
-          color: #60A5FA;
-          padding: 6px 16px;
-          border-radius: 8px;
+        .header-left {
+          display: flex;
+          align-items: center;
+          gap: 8px;
           font-size: 13px;
-          font-weight: 700;
-          margin-bottom: 18px;
-          text-transform: uppercase;
-          letter-spacing: 0.8px;
-          box-shadow: 0 4px 12px rgba(30, 64, 175, 0.3);
-        }
-        .route-badge {
-          background: linear-gradient(135deg, #0C4A6E 0%, #075985 100%);
-          color: #22D3EE;
-          padding: 10px 18px;
-          border-radius: 10px;
-          font-size: 14px;
-          margin-bottom: 24px;
-          font-family: 'Courier New', monospace;
-          box-shadow: 0 4px 12px rgba(12, 74, 110, 0.3);
-          border: 1px solid rgba(34, 211, 238, 0.2);
-        }
-        .error-message {
-          background: rgba(239, 68, 68, 0.1);
-          border-left: 4px solid #EF4444;
-          padding: 18px 20px;
-          border-radius: 10px;
-          margin-bottom: 32px;
-        }
-        .error-message-text {
-          color: #FCA5A5;
-          font-size: 16px;
-          font-weight: 600;
-          line-height: 1.6;
-          font-family: 'Courier New', monospace;
+          color: #888;
         }
-        .stack-section {
-          margin-top: 32px;
+        .counter-badge {
+          background: #1e1e1e;
+          border: 1px solid #333;
+          border-radius: 6px;
+          padding: 2px 8px;
+          font-size: 12px;
+          color: #999;
+          font-variant-numeric: tabular-nums;
         }
-        .stack-header {
+        .nav-btn {
+          background: #1e1e1e;
+          border: 1px solid #333;
+          border-radius: 6px;
+          color: #888;
+          cursor: pointer;
+          width: 24px;
+          height: 24px;
           display: flex;
           align-items: center;
-          justify-content: space-between;
-          margin-bottom: 20px;
+          justify-content: center;
+          font-size: 13px;
+          transition: all .15s;
         }
-        .stack-title {
-          font-size: 18px;
-          font-weight: 700;
-          color: #F1F5F9;
+        .nav-btn:hover:not(:disabled) { background: #2a2a2a; color: #fff; }
+        .nav-btn:disabled { opacity: 0.3; cursor: default; }
+        .framework-tag {
           display: flex;
           align-items: center;
-          gap: 10px;
+          gap: 6px;
+          font-size: 12px;
+          color: #666;
         }
-        .frame-counter {
-          background: linear-gradient(135deg, #1F2937 0%, #111827 100%);
-          color: #22D3EE;
-          padding: 6px 14px;
-          border-radius: 8px;
-          font-size: 13px;
+        .framework-tag::before {
+          content: '';
+          display: inline-block;
+          width: 6px; height: 6px;
+          border-radius: 50%;
+          background: #3b82f6;
+        }
+
+        /* \u2500\u2500 Scrollable Content \u2500\u2500 */
+        .content {
+          overflow-y: auto;
+          flex: 1;
+        }
+
+        /* \u2500\u2500 Error Summary \u2500\u2500 */
+        .error-summary {
+          padding: 28px 24px 20px;
+          border-bottom: 1px solid #1e1e1e;
+        }
+        .error-label {
+          display: inline-flex;
+          align-items: center;
+          gap: 6px;
+          font-size: 11px;
           font-weight: 700;
-          border: 1px solid rgba(34, 211, 238, 0.2);
+          letter-spacing: 0.08em;
+          text-transform: uppercase;
+          color: #f87171;
+          background: rgba(248, 113, 113, 0.1);
+          border: 1px solid rgba(248, 113, 113, 0.25);
+          padding: 3px 8px;
+          border-radius: 4px;
+          margin-bottom: 14px;
         }
-        .error-card {
-          background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%);
-          border: 1px solid rgba(34, 211, 238, 0.2);
-          border-radius: 14px;
-          padding: 20px;
-          margin-bottom: 12px;
-          transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
-          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
-          display: none;
+        .error-label svg { width: 10px; height: 10px; fill: currentColor; }
+        .error-message {
+          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+          font-size: 18px;
+          font-weight: 600;
+          line-height: 1.5;
+          color: #fff;
+          word-break: break-word;
         }
-        .error-card.active {
-          display: block;
-          animation: slideIn 0.3s ease-out;
+        .error-location {
+          margin-top: 10px;
+          font-size: 13px;
+          color: #888;
         }
-        .error-card:hover {
-          border-color: rgba(34, 211, 238, 0.5);
-          box-shadow: 0 8px 24px rgba(34, 211, 238, 0.2);
-          transform: translateY(-2px);
+        .error-location strong { color: #ccc; }
+
+        /* \u2500\u2500 Source Block \u2500\u2500 */
+        .source-block {
+          border-bottom: 1px solid #1e1e1e;
         }
-        .card-header {
+        .source-topbar {
           display: flex;
-          justify-content: space-between;
           align-items: center;
-          margin-bottom: 12px;
-        }
-        .card-title {
-          color: #22D3EE;
-          font-size: 15px;
-          font-weight: 700;
-          font-family: 'Courier New', monospace;
-        }
-        .card-number {
-          background: rgba(34, 211, 238, 0.2);
-          color: #22D3EE;
-          padding: 4px 10px;
-          border-radius: 6px;
+          padding: 10px 16px;
+          background: #161616;
+          border-bottom: 1px solid #1e1e1e;
+          gap: 8px;
           font-size: 12px;
-          font-weight: 700;
+          color: #666;
         }
-        .card-location {
-          color: #94A3B8;
+        .source-topbar .filepath { color: #aaa; font-family: ui-monospace, monospace; }
+        .source-code {
+          background: #0d0d0d;
+          overflow-x: auto;
+          padding: 10px 0;
+          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
           font-size: 13px;
-          font-family: 'Courier New', monospace;
-          word-break: break-all;
-          line-height: 1.6;
+          line-height: 1.7;
         }
-        .pagination {
+        .src-line {
           display: flex;
-          justify-content: center;
-          align-items: center;
-          gap: 12px;
-          margin-top: 24px;
+          align-items: flex-start;
+          padding: 0 20px;
+          white-space: pre;
+          color: #555;
         }
-        .pagination-btn {
-          background: linear-gradient(135deg, #1E293B 0%, #0F172A 100%);
-          border: 1px solid rgba(34, 211, 238, 0.3);
-          color: #22D3EE;
-          padding: 10px 20px;
-          border-radius: 10px;
-          font-size: 14px;
-          font-weight: 600;
-          cursor: pointer;
-          transition: all 0.2s;
+        .src-line .ln {
+          color: #3a3a3a;
+          text-align: right;
+          width: 36px;
+          margin-right: 16px;
+          flex-shrink: 0;
+          user-select: none;
         }
-        .pagination-btn:hover:not(:disabled) {
-          background: linear-gradient(135deg, #22D3EE 0%, #06B6D4 100%);
-          color: #0F172A;
-          transform: translateY(-2px);
-          box-shadow: 0 6px 20px rgba(34, 211, 238, 0.4);
+        .src-err {
+          background: rgba(239, 68, 68, 0.08);
+          color: #fca5a5;
+          position: relative;
         }
-        .pagination-btn:disabled {
-          opacity: 0.3;
-          cursor: not-allowed;
+        .src-err .ln { color: #ef4444; }
+        .src-err::before {
+          content: '';
+          position: absolute;
+          left: 0;
+          top: 0; bottom: 0;
+          width: 3px;
+          background: #ef4444;
         }
-        .pagination-info {
-          color: #94A3B8;
-          font-size: 14px;
-          font-weight: 600;
+
+        /* \u2500\u2500 Call Stack \u2500\u2500 */
+        .callstack {
+          padding: 20px 24px;
         }
-        .footer {
-          margin-top: 48px;
-          padding-top: 28px;
-          border-top: 1px solid rgba(34, 211, 238, 0.2);
+        .callstack-header {
           display: flex;
-          justify-content: space-between;
           align-items: center;
-          flex-wrap: wrap;
-          gap: 20px;
+          justify-content: space-between;
+          margin-bottom: 14px;
+        }
+        .callstack-title {
+          font-size: 13px;
+          font-weight: 600;
+          color: #aaa;
+          text-transform: uppercase;
+          letter-spacing: 0.06em;
         }
-        .brand {
+        .ignore-btn {
+          font-size: 12px;
+          color: #555;
+          background: none;
+          border: none;
+          cursor: pointer;
           display: flex;
           align-items: center;
-          gap: 10px;
-          font-weight: 700;
-          color: #22D3EE;
-          font-size: 15px;
+          gap: 4px;
+          transition: color .15s;
         }
-        .brand img {
-          width: 20px;
-          height: 20px;
-        }
-        .footer-links {
-          display: flex;
-          gap: 24px;
-          flex-wrap: wrap;
+        .ignore-btn:hover { color: #aaa; }
+        .ignore-caret { transition: transform .2s; }
+        .ignore-btn.open .ignore-caret { transform: rotate(90deg); }
+
+        .frame {
+          padding: 10px 12px;
+          border-radius: 6px;
+          margin-bottom: 4px;
+          font-size: 13px;
+          cursor: default;
         }
-        .footer-links a {
-          color: #60A5FA;
-          text-decoration: none;
+        .frame:hover { background: rgba(255,255,255,0.03); }
+        .frame-call {
+          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
           font-weight: 600;
-          transition: all 0.2s;
-          font-size: 14px;
+          color: #e2e8f0;
+          margin-bottom: 3px;
         }
-        .footer-links a:hover {
-          color: #22D3EE;
-          transform: translateY(-1px);
-        }
-        .no-stack {
-          background: rgba(239, 68, 68, 0.1);
-          border: 1px solid rgba(239, 68, 68, 0.3);
-          border-radius: 12px;
-          padding: 32px;
-          color: #FCA5A5;
-          text-align: center;
-          font-size: 15px;
-        }
-        @keyframes slideIn {
-          from {
-            opacity: 0;
-            transform: translateY(10px);
-          }
-          to {
-            opacity: 1;
-            transform: translateY(0);
-          }
+        .frame-loc {
+          font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
+          font-size: 12px;
+          color: #555;
         }
+        .frame.ignored .frame-call { color: #444; }
+
+        .ignored-section { margin-top: 8px; display: none; }
+        .ignored-section.open { display: block; }
     </style>
 </head>
 <body>
-    <div class="container">
-        <div class="error-header">
-            <svg fill="none" stroke="currentColor" viewBox="0 0 24 24">
-              <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z"></path>
-            </svg>
-            <span>Unhandled Runtime Error</span>
+    <div class="overlay">
+
+      <!-- Header bar -->
+      <div class="header">
+        <div class="header-left">
+          <button class="nav-btn" disabled>\u2039</button>
+          <span class="counter-badge">1 / 1</span>
+          <button class="nav-btn" disabled>\u203A</button>
+          <span style="margin-left: 4px;">Unhandled Runtime Error</span>
         </div>
-        
-        <div class="error-badge">SERVER ERROR 500</div>
-        ${pathname ? `<div class="route-badge">Route: ${pathname}</div>` : ""}
-        
-        <div class="error-message">
-            <div class="error-message-text">${message}</div>
+        <div class="framework-tag">Velix v${VERSION} \xB7 esbuild</div>
+      </div>
+
+      <!-- Scrollable content -->
+      <div class="content">
+
+        <!-- Error summary -->
+        <div class="error-summary">
+          <div class="error-label">
+            <svg viewBox="0 0 16 16"><path d="M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1zm-.75 3.5a.75.75 0 0 1 1.5 0v4a.75.75 0 0 1-1.5 0v-4zm.75 6.75a.75.75 0 1 1 0-1.5.75.75 0 0 1 0 1.5z"/></svg>
+            Runtime Error
+          </div>
+          <div class="error-message">${escapeHtml2(message)}</div>
+          ${pathname ? `<div class="error-location">in <strong>${escapeHtml2(pathname)}</strong></div>` : ""}
         </div>
-        
-        ${isDev && callStackCards ? `
-        <div class="stack-section">
-            <div class="stack-header">
-                <div class="stack-title">
-                    <svg width="20" height="20" fill="none" stroke="currentColor" viewBox="0 0 24 24">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z"></path>
-                    </svg>
-                    Call Stack
-                </div>
-                <div class="frame-counter">${frameCount}</div>
-            </div>
-            <div id="error-cards">
-                ${callStackCards}
-            </div>
-            ${frameCount > 1 ? `
-            <div class="pagination">
-                <button class="pagination-btn" id="prev-btn" onclick="changePage(-1)">
-                    <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display:inline;vertical-align:middle;margin-right:4px;">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 19l-7-7 7-7"></path>
-                    </svg>
-                    Previous
-                </button>
-                <div class="pagination-info">
-                    <span id="current-page">1</span> / <span id="total-pages">${frameCount}</span>
-                </div>
-                <button class="pagination-btn" id="next-btn" onclick="changePage(1)">
-                    Next
-                    <svg width="16" height="16" fill="none" stroke="currentColor" viewBox="0 0 24 24" style="display:inline;vertical-align:middle;margin-left:4px;">
-                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"></path>
-                    </svg>
-                </button>
-            </div>
-            ` : ""}
+
+        ${sourceSnippet ? `
+        <!-- Source code snippet -->
+        <div class="source-block">
+          <div class="source-topbar">
+            <svg width="12" height="12" fill="none" viewBox="0 0 24 24"><path stroke="#666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8l-6-6z"/><polyline stroke="#666" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" points="14 2 14 8 20 8"/></svg>
+            <span class="filepath">${escapeHtml2(shortFile)}${errorLine ? `:${errorLine}` : ""}</span>
+          </div>
+          <div class="source-code">${sourceSnippet}</div>
         </div>
-        ` : '<div class="no-stack">An error occurred while processing your request. Please check the server logs for more details.</div>'}
-        
-        <div class="footer">
-            <div class="brand">
-                <img src="/__velix/logo.webp" alt="Velix" onerror="this.style.display='none'"/>
-                <span>Velix v${VERSION}</span>
-            </div>
-            <div class="footer-links">
-                <a href="/">Home</a>
-                <a href="javascript:location.reload()">Reload</a>
-                <a href="https://github.com/velix/velix/tree/main/docs" target="_blank">Documentation</a>
-                ${isDev ? '<span style="color:#94A3B8;">Development Mode</span>' : ""}
+        ` : ""}
+
+        <!-- Call stack -->
+        <div class="callstack">
+          <div class="callstack-header">
+            <div class="callstack-title">Call Stack</div>
+            ${ignoredFrames.length > 0 ? `
+            <button class="ignore-btn" id="ignoreBtn" onclick="toggleIgnored()">
+              <svg class="ignore-caret" width="12" height="12" viewBox="0 0 12 12" fill="none">
+                <path d="M4.5 3L7.5 6L4.5 9" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+              </svg>
+              ${ignoredFrames.length} ignored frames
+            </button>
+            ` : ""}
+          </div>
+
+          <!-- User frames -->
+          ${userFrames.map((f) => `
+          <div class="frame">
+            <div class="frame-call">${escapeHtml2(f.call)}</div>
+            <div class="frame-loc">${escapeHtml2(f.file.replace(/\\/g, "/").replace(/.*\/(?=app\/|server\/|src\/|pages\/)/, ""))}${f.line ? `:${f.line}` : ""}</div>
+          </div>
+          `).join("")}
+
+          <!-- Ignored frames -->
+          ${ignoredFrames.length > 0 ? `
+          <div class="ignored-section" id="ignoredSection">
+            ${ignoredFrames.map((f) => `
+            <div class="frame ignored">
+              <div class="frame-call">${escapeHtml2(f.call)}</div>
+              <div class="frame-loc">${escapeHtml2(f.file)}${f.line ? `:${f.line}` : ""}</div>
             </div>
+            `).join("")}
+          </div>
+          ` : ""}
         </div>
-    </div>
-    
-    ${isDev && frameCount > 0 ? `
+
+      </div><!-- /content -->
+    </div><!-- /overlay -->
+
     <script>
-        let currentPage = 1;
-        const totalPages = ${frameCount};
-        const cards = document.querySelectorAll('.error-card');
-        const prevBtn = document.getElementById('prev-btn');
-        const nextBtn = document.getElementById('next-btn');
-        const currentPageSpan = document.getElementById('current-page');
-        
-        function showPage(page) {
-            cards.forEach((card, index) => {
-                card.classList.remove('active');
-                if (index === page - 1) {
-                    card.classList.add('active');
-                }
-            });
-            
-            currentPage = page;
-            currentPageSpan.textContent = page;
-            
-            if (prevBtn) prevBtn.disabled = page === 1;
-            if (nextBtn) nextBtn.disabled = page === totalPages;
-        }
-        
-        function changePage(direction) {
-            const newPage = currentPage + direction;
-            if (newPage >= 1 && newPage <= totalPages) {
-                showPage(newPage);
-            }
-        }
-        
-        // Show first page on load
-        showPage(1);
-        
-        // Keyboard navigation
-        document.addEventListener('keydown', (e) => {
-            if (e.key === 'ArrowLeft') changePage(-1);
-            if (e.key === 'ArrowRight') changePage(1);
-        });
+      function toggleIgnored() {
+        const btn = document.getElementById('ignoreBtn');
+        const sec = document.getElementById('ignoredSection');
+        if (!btn || !sec) return;
+        const open = sec.classList.toggle('open');
+        btn.classList.toggle('open', open);
+      }
     </script>
-    ` : ""}
 </body>
 </html>`;
 }
 function getProjectVersion(dep, projectRoot) {
   try {
-    const projectRequire = createRequire(pathToFileURL(path4.join(projectRoot, "package.json")).href);
+    const projectRequire = createRequire(pathToFileURL(path3.join(projectRoot, "package.json")).href);
     return projectRequire(`${dep}/package.json`).version;
   } catch (e) {
     try {
@@ -1868,7 +1737,7 @@ async function createServer(options = {}) {
   await loadPlugins(projectRoot, config);
   await pluginManager.runHook(PluginHooks.CONFIG, config);
   const middlewareFns = await loadMiddleware(projectRoot);
-  const appDir = config.resolvedAppDir || path4.join(projectRoot, "app");
+  const appDir = config.resolvedAppDir || path3.join(projectRoot, "app");
   const routes = buildRouteTree(appDir);
   await pluginManager.runHook(PluginHooks.ROUTES_LOADED, routes);
   const startTime = Date.now();
@@ -1902,7 +1771,7 @@ async function createServer(options = {}) {
         return;
       }
       if (pathname === "/__velix/image") {
-        const { handleImageOptimization } = await import('./image-optimizer-KPRXE5VI.js');
+        const { handleImageOptimization } = await import('./image-optimizer-QDXS3LHQ.js');
         await handleImageOptimization(req, res, projectRoot);
         return;
       }
@@ -1910,7 +1779,7 @@ async function createServer(options = {}) {
         await serveVelixInternal(pathname, req, res, projectRoot);
         return;
       }
-      const publicDir = config.resolvedPublicDir || path4.join(projectRoot, "public");
+      const publicDir = config.resolvedPublicDir || path3.join(projectRoot, "public");
       if (await serveStaticFile(pathname, publicDir, res, isDev)) {
         if (isDev) logger_default.request(req.method || "GET", pathname, 200, Date.now() - requestStart, { type: "static" });
         return;
@@ -1936,7 +1805,6 @@ async function createServer(options = {}) {
       if (!res.headersSent) {
         res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
         res.end(generate500Page({
-          title: "Server Error",
           message: err.message || "An unexpected error occurred",
           stack: isDev ? err.stack : void 0,
           isDev,
@@ -1983,22 +1851,22 @@ async function importModuleSSR(filePath) {
   try {
     return await import(`${fileUrl}?t=${Date.now()}`);
   } catch (err) {
-    const source = fs4.readFileSync(filePath, "utf-8");
+    const source = fs3.readFileSync(filePath, "utf-8");
     if (source.match(/^import\s+['"][^'"]+\.(css|scss|less|sass)['"];?\s*$/m)) {
       const stripped = source.replace(/^import\s+['"][^'"]+\.(css|scss|less|sass)['"];?\s*$/gm, "// [velix:ssr] css import stripped");
-      const ext = path4.extname(filePath);
+      const ext = path3.extname(filePath);
       const tmpPath = filePath.replace(ext, `.__velix_ssr${ext}`);
-      fs4.writeFileSync(tmpPath, stripped);
+      fs3.writeFileSync(tmpPath, stripped);
       try {
         const mod = await import(`${pathToFileURL(tmpPath).href}?t=${Date.now()}`);
         try {
-          fs4.unlinkSync(tmpPath);
+          fs3.unlinkSync(tmpPath);
         } catch {
         }
         return mod;
       } catch (e2) {
         try {
-          fs4.unlinkSync(tmpPath);
+          fs3.unlinkSync(tmpPath);
         } catch {
         }
         throw e2;
@@ -2009,18 +1877,18 @@ async function importModuleSSR(filePath) {
 }
 function collectLayouts(pageFilePath, appDir) {
   const layouts = [];
-  const normalizedAppDir = path4.resolve(appDir);
-  let current = path4.dirname(path4.resolve(pageFilePath));
+  const normalizedAppDir = path3.resolve(appDir);
+  let current = path3.dirname(path3.resolve(pageFilePath));
   while (true) {
     for (const ext of [".tsx", ".jsx", ".ts", ".js"]) {
-      const layoutPath = path4.join(current, `layout${ext}`);
-      if (fs4.existsSync(layoutPath)) {
+      const layoutPath = path3.join(current, `layout${ext}`);
+      if (fs3.existsSync(layoutPath)) {
         layouts.unshift(layoutPath);
         break;
       }
     }
-    if (path4.resolve(current) === normalizedAppDir) break;
-    const parent = path4.dirname(current);
+    if (path3.resolve(current) === normalizedAppDir) break;
+    const parent = path3.dirname(current);
     if (parent === current) break;
     current = parent;
   }
@@ -2040,12 +1908,12 @@ async function renderComponentAsync(Component, props) {
   return element;
 }
 async function serveStaticFile(pathname, publicDir, res, isDev = false) {
-  const filePath = path4.join(publicDir, pathname);
+  const filePath = path3.join(publicDir, pathname);
   if (!filePath.startsWith(publicDir)) return false;
-  if (!fs4.existsSync(filePath) || fs4.statSync(filePath).isDirectory()) return false;
-  const ext = path4.extname(filePath);
+  if (!fs3.existsSync(filePath) || fs3.statSync(filePath).isDirectory()) return false;
+  const ext = path3.extname(filePath);
   const contentType = MIME_TYPES[ext] || "application/octet-stream";
-  const content = fs4.readFileSync(filePath);
+  const content = fs3.readFileSync(filePath);
   res.writeHead(200, {
     "Content-Type": contentType,
     "Content-Length": content.length,
@@ -2124,7 +1992,7 @@ async function handlePageRoute(route, routes, req, res, url, config, isDev, proj
     const mod = await import(`${fileUrl}?t=${Date.now()}`);
     const PageComponent = mod.default;
     let metadata = mod.metadata || mod.generateMetadata?.(route.params) || {};
-    const appDir = config.resolvedAppDir || path4.join(projectRoot, "app");
+    const appDir = config.resolvedAppDir || path3.join(projectRoot, "app");
     const layoutPaths = collectLayouts(route.filePath, appDir);
     const layoutModules = [];
     for (const lp of layoutPaths) {
@@ -2272,7 +2140,6 @@ async function handlePageRoute(route, routes, req, res, url, config, isDev, proj
     logger_default.error(`Render error: ${route.path}`, error);
     res.writeHead(500, { "Content-Type": "text/html; charset=utf-8" });
     res.end(generate500Page({
-      title: "Render Error",
       message: error.message || "Failed to render page",
       stack: isDev ? error.stack : void 0,
       isDev,
@@ -2298,19 +2165,19 @@ async function serveVelixInternal(pathname, req, res, projectRoot) {
   }
   if (pathname === "/__velix/logo.webp") {
     const __filename2 = fileURLToPath(import.meta.url);
-    const __dirname2 = path4.dirname(__filename2);
+    const __dirname2 = path3.dirname(__filename2);
     const candidates = [
-      path4.join(__dirname2, "..", "assets", "logo.webp"),
-      path4.join(__dirname2, "..", "..", "assets", "logo.webp"),
-      path4.join(process.cwd(), "node_modules", "@teamvelix", "velix", "assets", "logo.webp"),
-      path4.join(process.cwd(), "packages", "velix", "assets", "logo.webp"),
-      path4.join(process.cwd(), "node_modules", "velix", "assets", "logo.webp"),
-      path4.join(process.cwd(), "public", "favicon.webp")
+      path3.join(__dirname2, "..", "assets", "logo.webp"),
+      path3.join(__dirname2, "..", "..", "assets", "logo.webp"),
+      path3.join(process.cwd(), "node_modules", "@teamvelix", "velix", "assets", "logo.webp"),
+      path3.join(process.cwd(), "packages", "velix", "assets", "logo.webp"),
+      path3.join(process.cwd(), "node_modules", "velix", "assets", "logo.webp"),
+      path3.join(process.cwd(), "public", "favicon.webp")
     ];
-    const logoPath = candidates.find((p) => fs4.existsSync(p));
+    const logoPath = candidates.find((p) => fs3.existsSync(p));
     if (logoPath) {
       res.writeHead(200, { "Content-Type": "image/webp", "Cache-Control": "public, max-age=31536000, immutable" });
-      res.end(fs4.readFileSync(logoPath));
+      res.end(fs3.readFileSync(logoPath));
     } else {
       res.writeHead(404);
       res.end();
@@ -2320,11 +2187,11 @@ async function serveVelixInternal(pathname, req, res, projectRoot) {
   if (pathname === "/__velix/hmr-client.js") {
     try {
       const candidates = [
-        path4.join(process.cwd(), "packages", "velix-react", "src", "hmr", "hmr-client.ts"),
-        path4.join(process.cwd(), "node_modules", "@teamvelix", "velix-react", "src", "hmr", "hmr-client.ts"),
-        path4.join(__dirname$1, "..", "..", "velix-react", "src", "hmr", "hmr-client.ts")
+        path3.join(process.cwd(), "packages", "velix-react", "src", "hmr", "hmr-client.ts"),
+        path3.join(process.cwd(), "node_modules", "@teamvelix", "velix-react", "src", "hmr", "hmr-client.ts"),
+        path3.join(__dirname$1, "..", "..", "velix-react", "src", "hmr", "hmr-client.ts")
       ];
-      const hmrClientSrc = candidates.find((p) => fs4.existsSync(p));
+      const hmrClientSrc = candidates.find((p) => fs3.existsSync(p));
       if (!hmrClientSrc) {
         res.writeHead(404);
         res.end();
@@ -2353,17 +2220,17 @@ async function serveVelixInternal(pathname, req, res, projectRoot) {
     const componentName = pathname.replace("/__velix/islands/", "").replace(".js", "");
     try {
       const searchDirs = [
-        path4.join(projectRoot, "components"),
-        path4.join(projectRoot, "app"),
-        path4.join(projectRoot, "islands")
+        path3.join(projectRoot, "components"),
+        path3.join(projectRoot, "app"),
+        path3.join(projectRoot, "islands")
       ];
       let componentPath = "";
       for (const dir of searchDirs) {
-        if (!fs4.existsSync(dir)) continue;
-        const files = fs4.readdirSync(dir, { recursive: true });
+        if (!fs3.existsSync(dir)) continue;
+        const files = fs3.readdirSync(dir, { recursive: true });
         const found = files.find((f) => f.replace(/\\/g, "/").endsWith(`${componentName}.tsx`) || f.replace(/\\/g, "/").endsWith(`${componentName}.jsx`));
         if (found) {
-          componentPath = path4.join(dir, found);
+          componentPath = path3.join(dir, found);
           break;
         }
       }
@@ -2450,6 +2317,6 @@ function parseRawBody(req) {
 }
 var server_default = { createServer, tailwindPlugin };
 
-export { PluginHooks, PluginManager, RedirectError, bindArgs, callServerAction, composeMiddleware, cookies, createServer, definePlugin, deserializeArgs, executeAction, formAction, generateJsonLd, generateMetadataTags, generateRobotsTxt, generateSitemap, getAction, getMethod, getPathname, headers, html, isMethod, json, jsonLd, loadMiddleware, loadPlugins, mergeMetadata, middlewares, notFound, parseFormData, parseJson, parseSearchParams, pluginManager, redirect, registerAction, runMiddleware, serverAction, server_default, tailwindPlugin, text, useActionContext, useVelixAction };
-//# sourceMappingURL=chunk-HGP4TUJS.js.map
-//# sourceMappingURL=chunk-HGP4TUJS.js.map
+export { RedirectError, bindArgs, callServerAction, composeMiddleware, cookies, createServer, deserializeArgs, executeAction, formAction, generateJsonLd, generateMetadataTags, generateRobotsTxt, generateSitemap, getAction, getMethod, getPathname, headers, html, isMethod, json, jsonLd, loadMiddleware, mergeMetadata, middlewares, notFound, parseFormData, parseJson, parseSearchParams, redirect, registerAction, runMiddleware, serverAction, server_default, tailwindPlugin, text, useActionContext, useVelixAction };
+//# sourceMappingURL=chunk-HMCBOHTD.js.map
+//# sourceMappingURL=chunk-HMCBOHTD.js.map