juxscript 1.0.67 → 1.0.68

package/machinery/compiler.js

@@ -5,41 +5,22 @@ import * as acorn from 'acorn';
 
 /**
  * Copy and build the JUX library from TypeScript to JavaScript
- * 
- * @param {string} projectRoot - Root directory containing lib/
- * @param {string} distDir - Destination directory for built files
  */
 export async function copyLibToOutput(projectRoot, distDir) {
-  // Simplified lib path resolution
   const libSrc = path.resolve(projectRoot, '../lib');
-
   if (!fs.existsSync(libSrc)) {
     throw new Error(`lib/ directory not found at ${libSrc}`);
   }
-
   const libDest = path.join(distDir, 'lib');
 
-  console.log('📦 Building TypeScript library...');
-  console.log(`   From: ${libSrc}`);
-  console.log(`   To: ${libDest}`);
-
   if (fs.existsSync(libDest)) {
     fs.rmSync(libDest, { recursive: true });
   }
-
   fs.mkdirSync(libDest, { recursive: true });
 
-  // Find all TypeScript entry points
   const tsFiles = findFiles(libSrc, '.ts');
+  if (tsFiles.length === 0) return;
 
-  if (tsFiles.length === 0) {
-    console.warn('⚠️  No TypeScript files found in lib/');
-    return;
-  }
-
-  console.log(`   Found ${tsFiles.length} TypeScript files`);
-
-  // Build all TypeScript files with esbuild
   try {
     await esbuild.build({
       entryPoints: tsFiles,
@@ -49,84 +30,40 @@ export async function copyLibToOutput(projectRoot, distDir) {
       outbase: libSrc,
       platform: 'browser',
       target: 'es2020',
-      loader: {
-        '.ts': 'ts'
-      },
-      logLevel: 'warning'
+      loader: { '.ts': 'ts' },
+      logLevel: 'error'
     });
-
-    console.log('   ✓ TypeScript compiled to JavaScript');
-
-    // Copy non-TS files (CSS, HTML, etc.)
-    console.log('   Copying lib assets...');
     copyNonTsFiles(libSrc, libDest);
-    console.log('   ✓ Lib assets copied');
-
   } catch (err) {
     console.error('❌ Failed to build TypeScript:', err.message);
     throw err;
   }
-
-  console.log('✅ Library ready\n');
 }
 
 /**
  * Copy project assets (CSS, JS, images) from jux/ to dist/
- * 
- * @param {string} projectRoot - Source directory (jux/)
- * @param {string} distDir - Destination directory (jux-dist/)
  */
 export async function copyProjectAssets(projectRoot, distDir) {
-  console.log('📦 Copying project assets...');
-
-  // Find all CSS and JS files in project root (excluding node_modules, dist, .git)
   const allFiles = [];
   findProjectFiles(projectRoot, ['.css', '.js'], allFiles, projectRoot);
 
-  console.log(`   Found ${allFiles.length} asset file(s)`);
-
   for (const srcPath of allFiles) {
     const relativePath = path.relative(projectRoot, srcPath);
     const destPath = path.join(distDir, relativePath);
     const destDir = path.dirname(destPath);
-
-    // Create destination directory if needed
-    if (!fs.existsSync(destDir)) {
-      fs.mkdirSync(destDir, { recursive: true });
-    }
-
-    // Copy file
+    if (!fs.existsSync(destDir)) fs.mkdirSync(destDir, { recursive: true });
     fs.copyFileSync(srcPath, destPath);
-    console.log(`   ✓ ${relativePath}`);
   }
-
-  console.log('✅ Project assets copied\n');
 }
 
 /**
- * Transpile TypeScript files from jux/ to jux-dist/, preserving folder structure
- * 
- * @param {string} srcDir - Source directory (jux/)
- * @param {string} destDir - Destination directory (jux-dist/)
- * @example
- * // jux/samples/mypage.ts -> jux-dist/samples/mypage.js
- * await transpileProjectTypeScript('jux/', 'jux-dist/');
+ * Transpile TypeScript files from jux/ to jux-dist/
  */
 export async function transpileProjectTypeScript(srcDir, destDir) {
-  console.log('🔷 Transpiling TypeScript files...');
-
-  // Find all TypeScript files in the project
   const tsFiles = findFiles(srcDir, '.ts');
-
-  if (tsFiles.length === 0) {
-    console.log('   No TypeScript files found in project');
-    return;
-  }
-
-  console.log(`   Found ${tsFiles.length} TypeScript file(s)`);
+  if (tsFiles.length === 0) return;
 
   try {
-    // Build all TypeScript files with esbuild
     await esbuild.build({
       entryPoints: tsFiles,
       bundle: false,
@@ -135,21 +72,9 @@ export async function transpileProjectTypeScript(srcDir, destDir) {
       outbase: srcDir,
       platform: 'browser',
       target: 'es2020',
-      loader: {
-        '.ts': 'ts'
-      },
-      logLevel: 'warning'
-    });
-
-    // Log each transpiled file
-    tsFiles.forEach(tsFile => {
-      const relativePath = path.relative(srcDir, tsFile);
-      const jsPath = relativePath.replace(/\.ts$/, '.js');
-      console.log(`   ✓ ${relativePath} → ${jsPath}`);
+      loader: { '.ts': 'ts' },
+      logLevel: 'error'
     });
-
-    console.log('✅ TypeScript transpiled\n');
-
   } catch (err) {
     console.error('❌ Failed to transpile TypeScript:', err.message);
     throw err;
@@ -157,45 +82,26 @@ export async function transpileProjectTypeScript(srcDir, destDir) {
 }
 
 /**
- * Copy presets folder from lib to dist (maintaining directory structure)
- * 
- * @param {string} packageRoot - Source package root directory
- * @param {string} distDir - Destination directory
+ * Copy presets (No-op log silenced)
  */
 export async function copyPresetsToOutput(packageRoot, distDir) {
-  // ✅ No-op - presets stay in node_modules only
-  console.log('ℹ️  Presets available via import maps (not copied to dist)\n');
+  // No-op
 }
 
-/**
- * Recursively find files with a specific extension
- * 
- * @param {string} dir - Directory to search
- * @param {string} extension - File extension (e.g., '.ts')
- * @param {string[]} fileList - Accumulator for found files
- * @returns {string[]} Array of file paths
- */
 function findFiles(dir, extension, fileList = []) {
   const files = fs.readdirSync(dir);
-
   files.forEach(file => {
     const filePath = path.join(dir, file);
     const stat = fs.statSync(filePath);
-
     if (stat.isDirectory()) {
       findFiles(filePath, extension, fileList);
     } else if (file.endsWith(extension)) {
       fileList.push(filePath);
     }
   });
-
   return fileList;
 }
 
-/**
- * Copy non-TypeScript files (CSS, JSON, JS, SVG, etc.)
- * ✅ Skip layouts folder
- */
 function copyNonTsFiles(src, dest) {
   const entries = fs.readdirSync(src, { withFileTypes: true });
 
@@ -204,17 +110,17 @@ function copyNonTsFiles(src, dest) {
     const destPath = path.join(dest, entry.name);
 
     if (entry.isDirectory()) {
-      // ✅ Skip layouts folder
-      if (entry.name === 'layouts') {
-        continue;
-      }
-
-      if (!fs.existsSync(destPath)) {
-        fs.mkdirSync(destPath, { recursive: true });
-      }
+      if (entry.name === 'layouts') continue;
+      if (!fs.existsSync(destPath)) fs.mkdirSync(destPath, { recursive: true });
       copyNonTsFiles(srcPath, destPath);
     } else if (entry.isFile()) {
       const ext = path.extname(entry.name);
+      if (ext === '.js' || ext === '.map') {
+        let tsSibling = '';
+        if (ext === '.js') tsSibling = srcPath.replace(/\.js$/, '.ts');
+        else if (ext === '.map') tsSibling = srcPath.replace(/\.js\.map$/, '.ts');
+        if (tsSibling && fs.existsSync(tsSibling)) continue;
+      }
       if (['.css', '.json', '.js', '.svg', '.png', '.jpg', '.jpeg', '.gif', '.webp'].includes(ext)) {
         fs.copyFileSync(srcPath, destPath);
       }
@@ -222,127 +128,62 @@ function copyNonTsFiles(src, dest) {
   }
 }
 
-/**
- * Find project files with specific extensions, excluding certain directories
- * 
- * @param {string} dir - Directory to search
- * @param {string[]} extensions - File extensions to find
- * @param {string[]} fileList - Accumulator for found files
- * @param {string} rootDir - Root directory for relative paths
- * @param {string[]} excludeDirs - Directories to exclude
- * @returns {string[]} Array of file paths
- */
 function findProjectFiles(dir, extensions, fileList = [], rootDir = dir, excludeDirs = ['node_modules', 'jux-dist', '.git', 'lib']) {
   if (!fs.existsSync(dir)) return fileList;
-
   const entries = fs.readdirSync(dir, { withFileTypes: true });
-
   for (const entry of entries) {
     const fullPath = path.join(dir, entry.name);
-
     if (entry.isDirectory()) {
-      // Skip excluded directories
-      if (excludeDirs.includes(entry.name)) {
-        continue;
-      }
+      if (excludeDirs.includes(entry.name)) continue;
       findProjectFiles(fullPath, extensions, fileList, rootDir, excludeDirs);
     } else {
-      // Check if file has one of the desired extensions
       const hasExtension = extensions.some(ext => entry.name.endsWith(ext));
-      if (hasExtension) {
-        fileList.push(fullPath);
-      }
+      if (hasExtension) fileList.push(fullPath);
     }
   }
-
   return fileList;
 }
 
 /**
  * Bundle all .jux files into a single router-based main.js
- * ✅ MODIFIED: Vendor dependencies locally + User Routes + Smart Import Merging
  */
 export async function bundleJuxFilesToRouter(projectRoot, distDir, options = {}) {
-  const startTime = performance.now();
   const { routePrefix = '', config } = options;
-
-  console.log('🔀 Bundling .jux files into router...');
-
   const juxFiles = findFiles(projectRoot, '.jux');
 
   if (juxFiles.length === 0) {
-    console.log('   No .jux files found');
-    // ✅ FIX: Return empty result instead of undefined
-    return {
-      mainJsFilename: 'main.js',
-      routes: [],
-      external: new Set(),
-      vendoredPaths: {}
-    };
+    return { mainJsFilename: 'main.js', routes: [], external: new Set(), vendoredPaths: {} };
   }
 
   const pages = config?.pages || {};
-
-  const fileTimings = [];
   const views = [];
   const routes = [];
-  const sharedModules = new Map(); // ✅ Map<filePath, exportCode>
-
-  // ✅ CHANGE: imports collection now stores context { code, filePath }
+  const sharedModules = new Map();
   const allImports = [];
-  const externalModules = new Set();  // ✅ NEW: Track external modules directly
-
-  // ✅ MAP for user config routing: Key = relative file path, Value = CleanFunctionName
+  const externalModules = new Set();
   const fileToFunction = new Map();
 
   for (const juxFile of juxFiles) {
-    const fileStartTime = performance.now();
-
     const relativePath = path.relative(projectRoot, juxFile);
     const parsedPath = path.parse(relativePath);
+    const rawFunctionName = parsedPath.dir ? `${parsedPath.dir.replace(/\//g, '_')}_${parsedPath.name}` : parsedPath.name;
+    const cleanFunctionName = rawFunctionName.replace(/[-_]/g, ' ').split(' ').map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join('');
 
-    const rawFunctionName = parsedPath.dir
-      ? `${parsedPath.dir.replace(/\//g, '_')}_${parsedPath.name}`
-      : parsedPath.name;
-
-    const cleanFunctionName = rawFunctionName
-      .replace(/[-_]/g, ' ')
-      .split(' ')
-      .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
-      .join('');
-
-    // ✅ Store mapping for Config Route Resolution
-    // Store both 'path/file.jux' and normalized versions
     fileToFunction.set(relativePath, cleanFunctionName);
     fileToFunction.set(relativePath.split(path.sep).join('/'), cleanFunctionName);
 
     const routePath = routePrefix + '/' + (parsedPath.dir ? `${parsedPath.dir}/` : '') + parsedPath.name;
     const cleanRoutePath = routePath.replace(/\/+/g, '/');
-
     const juxContent = fs.readFileSync(juxFile, 'utf-8');
 
-    // ✅ FIX: Extract imports AND detect external modules in one pass
     try {
-      const ast = acorn.parse(juxContent, {
-        ecmaVersion: 'latest',
-        sourceType: 'module'
-      });
-
+      const ast = acorn.parse(juxContent, { ecmaVersion: 'latest', sourceType: 'module' });
       ast.body.forEach(node => {
         if (node.type === 'ImportDeclaration') {
           const importStatement = juxContent.slice(node.start, node.end);
-
-          // ✅ Store Object with context instead of raw string
-          allImports.push({
-            code: importStatement,
-            filePath: relativePath // relative to projectRoot
-          });
-
+          allImports.push({ code: importStatement, filePath: relativePath });
           const moduleName = node.source.value;
-          if (!moduleName.startsWith('.') &&
-            !moduleName.startsWith('/') &&
-            !moduleName.startsWith('http') &&
-            !moduleName.startsWith('juxscript')) {
+          if (!moduleName.startsWith('.') && !moduleName.startsWith('/') && !moduleName.startsWith('http') && !moduleName.startsWith('juxscript')) {
             externalModules.add(moduleName);
           }
         }
@@ -351,69 +192,37 @@ export async function bundleJuxFilesToRouter(projectRoot, distDir, options = {})
       console.warn(`   ⚠️  Failed to parse imports in ${relativePath}, skipping`);
     }
 
-    // Check if file has exports
     const hasExports = /^\s*export\s+(const|let|function|class|{)/m.test(juxContent);
-
     if (hasExports) {
-      // ✅ Store exports with UNIQUE KEY (file path)
       const exportKey = relativePath;
       const exportCode = extractSharedModule(juxContent, rawFunctionName, relativePath);
-
-      if (exportCode.trim()) {
-        sharedModules.set(exportKey, exportCode);
-      }
+      if (exportCode.trim()) sharedModules.set(exportKey, exportCode);
     }
 
-    // Transform to view function (exports removed entirely)
-    const viewFunction = transformJuxToViewFunction(
-      juxContent,
-      rawFunctionName,
-      parsedPath.name,
-      relativePath,
-      sharedModules
-    );
-
+    const viewFunction = transformJuxToViewFunction(juxContent, rawFunctionName, parsedPath.name, relativePath, sharedModules);
     views.push(viewFunction);
 
-    // Auto-route based on filesystem
     if (config?.defaults?.autoRoute !== false) {
       routes.push({ path: cleanRoutePath, functionName: cleanFunctionName });
     }
-
-    const fileTime = performance.now() - fileStartTime;
-    fileTimings.push({ file: relativePath, time: fileTime });
-
-    const exportNote = hasExports ? ' [+exports]' : '';
-    // console.log(`   ✓ ${relativePath} → ${cleanFunctionName}()${exportNote} (${fileTime.toFixed(1)}ms)`);
   }
 
-  // ✅ PROCESS USER CONFIGURED ROUTES
   if (pages) {
-    console.log('   🗺️  Mapping user-configured routes...');
-
     const resolveAndAddRoute = (urlPath, targetFile) => {
-      // Clean up target file path (remove leading ./ and /)
       const cleanTarget = targetFile.replace(/^(\.\/|\/)/, '');
       const funcName = fileToFunction.get(cleanTarget);
-
       if (funcName) {
-        // User routes take precedence (prepend to list)
         routes.unshift({ path: urlPath, functionName: funcName });
-        console.log(`      ➕ ${urlPath} → ${funcName}`);
       } else {
-        console.warn(`      ⚠️  Route target not found: ${targetFile} (Available keys: ${fileToFunction.size})`);
+        console.warn(`      ⚠️  Route target not found: ${targetFile}`);
       }
     };
-
     Object.entries(pages).forEach(([key, value]) => {
       if (typeof value === 'string') {
-        // Direct mapping: '/' -> './experiments/state.jux'
         resolveAndAddRoute(key, value);
       } else if (typeof value === 'object') {
-        // Group mapping
         const prefix = value.prefix || '';
         const groupRoutes = value.routes || {};
-
         Object.entries(groupRoutes).forEach(([routePath, targetFile]) => {
           const fullPath = (prefix + routePath).replace(/\/+/g, '/');
           resolveAndAddRoute(fullPath, targetFile);
@@ -422,564 +231,199 @@ export async function bundleJuxFilesToRouter(projectRoot, distDir, options = {})
     });
   }
 
-  // ✅ Show slowest files if any took >50ms
-  const slowFiles = fileTimings.filter(f => f.time > 50).sort((a, b) => b.time - a.time);
-  if (slowFiles.length > 0) {
-    console.log(`\n   ⚠️  Slowest files:`);
-    slowFiles.slice(0, 3).forEach(f => {
-      console.log(`      ${f.file}: ${f.time.toFixed(0)}ms`);
-    });
-  }
-
-  const bundleStartTime = performance.now();
-
-  // ✅ CHANGE: Single summary instead of verbose list
-  if (externalModules.size > 0) {
-    console.log(`\n   📦 External dependencies: ${Array.from(externalModules).join(', ')}`);
-  }
-
   const vendoredPaths = await vendorExternalDependencies(externalModules, distDir);
-
   const routerCode = generateRouterBundle(views, routes, sharedModules, allImports, projectRoot);
-  const bundleGenTime = performance.now() - bundleStartTime;
-
   const mainJsFilename = 'main.js';
   const mainJsPath = path.join(distDir, mainJsFilename);
-
-  const writeStartTime = performance.now();
   fs.writeFileSync(mainJsPath, routerCode);
-  const writeTime = performance.now() - writeStartTime;
-
-  const totalTime = performance.now() - startTime;
-
-  console.log(`   ✓ Generated: ${path.relative(projectRoot, mainJsPath)}`);
-  console.log(`\n   📊 Bundle Statistics:`);
-  console.log(`      Files processed:    ${juxFiles.length}`);
-  console.log(`      External deps:      ${externalModules.size}`);
-  console.log(`      Vendored locally:   ${Object.keys(vendoredPaths).length}`);
-  console.log(`      Bundle size:        ${(routerCode.length / 1024).toFixed(1)} KB`);
-  console.log(`      Total bundle time:  ${totalTime.toFixed(0)}ms`);
-  console.log('✅ Router bundle complete\n');
 
-  // ✅ Return bundleResult with vendor info
   return {
     mainJsFilename,
     routes: routes.map(r => ({ path: r.path, functionName: r.functionName })),
-    external: externalModules,  // ✅ FIX: Use externalModules instead of external
+    external: externalModules,
     vendoredPaths
   };
 }
 
-/**
- * Extract shared module exports from a .jux file using AST parsing
- * ✅ Namespaces exported identifiers to prevent collisions
- */
 function extractSharedModule(juxContent, moduleName, sourceFilePath) {
   const exportLines = [];
-
   try {
-    const ast = acorn.parse(juxContent, {
-      ecmaVersion: 'latest',
-      sourceType: 'module'
-    });
-
+    const ast = acorn.parse(juxContent, { ecmaVersion: 'latest', sourceType: 'module' });
     ast.body.forEach(node => {
-      if (node.type === 'ExportNamedDeclaration') {
-        // Case 1: Inline export (export const foo = ...)
-        if (node.declaration) {
-          const exportCode = juxContent.slice(node.start, node.end);
-          const cleaned = exportCode.replace(/^export\s+/, '');
-
-          // ✅ Namespace the identifier
-          const namespacedCode = namespaceExportedIdentifiers(cleaned, sourceFilePath);
-
-          exportLines.push(`// From: ${sourceFilePath}\n${namespacedCode}`);
-        }
-        // Case 2: Named export block (export { foo, bar })
-        else if (node.specifiers && node.specifiers.length > 0) {
-          console.log(`   ℹ️  Skipping named export block in ${sourceFilePath} (declarations already present)`);
-        }
-      }
-      else if (node.type === 'ExportDefaultDeclaration') {
-        const exportCode = juxContent.slice(node.start, node.end);
-        const cleaned = exportCode.replace(/^export\s+default\s+/, '');
-
-        // ✅ Namespace default export
-        const namespacedCode = namespaceExportedIdentifiers(cleaned, sourceFilePath);
-
-        exportLines.push(`// From: ${sourceFilePath}\n${namespacedCode}`);
+      if (node.type === 'ExportNamedDeclaration' && node.declaration) {
+        const exportCode = juxContent.slice(node.start, node.end).replace(/^export\s+/, '');
+        exportLines.push(`// From: ${sourceFilePath}\n${namespaceExportedIdentifiers(exportCode, sourceFilePath)}`);
+      } else if (node.type === 'ExportDefaultDeclaration') {
+        const exportCode = juxContent.slice(node.start, node.end).replace(/^export\s+default\s+/, '');
+        exportLines.push(`// From: ${sourceFilePath}\n${namespaceExportedIdentifiers(exportCode, sourceFilePath)}`);
       }
     });
-
   } catch (err) {
-    console.error(`\n❌ Failed to parse ${sourceFilePath}`);
-    console.error(`   Syntax Error: ${err.message}`);
-    console.error(`   Line: ${err.loc?.line}, Column: ${err.loc?.column}\n`);
-    throw new Error(`Invalid JavaScript syntax in ${sourceFilePath}. Please fix and retry.`);
+    throw new Error(`Invalid JavaScript syntax in ${sourceFilePath}.`);
   }
-
   return exportLines.join('\n\n');
 }
 
-/**
- * Namespace exported identifiers by appending source file path
- * @param {string} code - The export code (e.g., "function myFunction() { ... }")
- * @param {string} sourceFilePath - Source file path (e.g., "experiments/test1.jux")
- * @returns {string} - Namespaced code (e.g., "function myFunction$experiments$test1() { ... }")
- */
 function namespaceExportedIdentifiers(code, sourceFilePath) {
-  // Create namespace suffix from file path
-  const namespace = sourceFilePath
-    .replace(/\.jux$/, '')
-    .replace(/[\/\\]/g, '$')
-    .replace(/[^a-zA-Z0-9$]/g, '_');
-
+  const namespace = sourceFilePath.replace(/\.jux$/, '').replace(/[\/\\]/g, '$').replace(/[^a-zA-Z0-9$]/g, '_');
   try {
-    const ast = acorn.parse(code, {
-      ecmaVersion: 'latest',
-      sourceType: 'module'
-    });
-
-    // Find all exported identifiers
+    const ast = acorn.parse(code, { ecmaVersion: 'latest', sourceType: 'module' });
     const identifiers = [];
-
     ast.body.forEach(node => {
-      if (node.type === 'FunctionDeclaration' && node.id) {
-        identifiers.push({
-          name: node.id.name,
-          start: node.id.start,
-          end: node.id.end
-        });
-      }
-      else if (node.type === 'VariableDeclaration') {
-        node.declarations.forEach(decl => {
-          if (decl.id.type === 'Identifier') {
-            identifiers.push({
-              name: decl.id.name,
-              start: decl.id.start,
-              end: decl.id.end
-            });
-          }
-        });
-      }
-      else if (node.type === 'ClassDeclaration' && node.id) {
-        identifiers.push({
-          name: node.id.name,
-          start: node.id.start,
-          end: node.id.end
-        });
-      }
+      if (node.type === 'FunctionDeclaration' && node.id) identifiers.push(node.id);
+      else if (node.type === 'VariableDeclaration') node.declarations.forEach(d => { if (d.id.type === 'Identifier') identifiers.push(d.id); });
+      else if (node.type === 'ClassDeclaration' && node.id) identifiers.push(node.id);
     });
-
-    // Replace identifiers in reverse order (to preserve offsets)
     identifiers.sort((a, b) => b.start - a.start);
-
     let result = code;
     identifiers.forEach(id => {
-      const namespacedName = `${id.name}$${namespace}`;
-      result = result.slice(0, id.start) + namespacedName + result.slice(id.end);
+      result = result.slice(0, id.start) + `${id.name}$${namespace}` + result.slice(id.end);
     });
-
     return result;
-
   } catch (err) {
-    console.warn(`⚠️  Failed to namespace exports in ${sourceFilePath}, returning as-is`);
     return code;
   }
 }
 
-/**
- * Transform .jux file content into a view function using AST
- * ✅ Rewrites imports to use namespaced identifiers
- */
 function transformJuxToViewFunction(juxContent, functionName, pageName, relativePath, sharedModules) {
   let result;
-
   try {
-    const ast = acorn.parse(juxContent, {
-      ecmaVersion: 'latest',
-      sourceType: 'module'
-    });
-
+    const ast = acorn.parse(juxContent, { ecmaVersion: 'latest', sourceType: 'module' });
     const nodesToRemove = [];
-    const importReplacements = new Map();  // ✅ Track import → namespace mappings
-
+    const importReplacements = new Map();
     ast.body.forEach(node => {
-      // Process import declarations
       if (node.type === 'ImportDeclaration') {
         const importPath = node.source.value;
-
-        // Only process .jux imports
         if (importPath.endsWith('.jux')) {
-          // Extract imported identifiers
           node.specifiers.forEach(spec => {
             if (spec.type === 'ImportSpecifier') {
-              const localName = spec.local.name;
-              const importedName = spec.imported.name;
-
-              // Resolve import path to namespace
               const resolvedPath = resolveImportPath(importPath, relativePath);
-              const namespace = resolvedPath
-                .replace(/\.jux$/, '')
-                .replace(/[\/\\]/g, '$')
-                .replace(/[^a-zA-Z0-9$]/g, '_');
-
-              const namespacedName = `${importedName}$${namespace}`;
-
-              // Map local name to namespaced name
-              importReplacements.set(localName, namespacedName);
+              const namespace = resolvedPath.replace(/\.jux$/, '').replace(/[\/\\]/g, '$').replace(/[^a-zA-Z0-9$]/g, '_');
+              importReplacements.set(spec.local.name, `${spec.imported.name}$${namespace}`);
             }
           });
         }
-
-        // ✅ CRITICAL FIX: Remove ALL imports so they don't break function scope
-        // They are hoisted by generateRouterBundle
         nodesToRemove.push({ start: node.start, end: node.end });
       }
-
-      // Remove export declarations
-      if (node.type === 'ExportNamedDeclaration') {
-        if (node.declaration) {
-          nodesToRemove.push({ start: node.start, end: node.end });
-        }
-        else if (node.specifiers && node.specifiers.length > 0) {
-          nodesToRemove.push({ start: node.start, end: node.end });
-        }
-      }
-
-      if (node.type === 'ExportDefaultDeclaration') {
+      if (node.type === 'ExportNamedDeclaration' || node.type === 'ExportDefaultDeclaration') {
         nodesToRemove.push({ start: node.start, end: node.end });
       }
     });
-
     nodesToRemove.sort((a, b) => b.start - a.start);
-
     result = juxContent;
-    nodesToRemove.forEach(({ start, end }) => {
-      result = result.slice(0, start) + result.slice(end);
-    });
-
-    result = result.trim();
-
-    // ✅ Replace imported identifiers with namespaced versions
+    nodesToRemove.forEach(({ start, end }) => { result = result.slice(0, start) + result.slice(end); });
     importReplacements.forEach((namespacedName, localName) => {
-      // Use regex to replace all occurrences of the identifier
-      // Must use word boundaries to avoid partial matches
-      const regex = new RegExp(`\\b${localName}\\b`, 'g');
-      result = result.replace(regex, namespacedName);
+      result = result.replace(new RegExp(`\\b${localName}\\b`, 'g'), namespacedName);
     });
-
   } catch (err) {
-    console.error(`\n❌ Failed to parse ${relativePath}`);
-    console.error(`   Syntax Error: ${err.message}`);
-    console.error(`   Line: ${err.loc?.line}, Column: ${err.loc?.column}\n`);
-    throw new Error(`Invalid JavaScript syntax in ${relativePath}. Please fix and retry.`);
+    throw new Error(`Invalid JavaScript syntax in ${relativePath}`);
   }
-
-  result = result.replace(/\.renderTo\(container\)/g, '.render("#app")');
-  result = result.replace(/\.render\(\s*\)/g, '.render("#app")');
-
-  const cleanName = functionName
-    .replace(/[-_]/g, ' ')
-    .split(' ')
-    .map(word => word.charAt(0).toUpperCase() + word.slice(1).toLowerCase())
-    .join('');
-
-  return `
-// View: ${cleanName}
-function ${cleanName}() {
-${result}
-  
-  return document.getElementById('app');
-}`;
+  result = result.replace(/\.renderTo\(container\)/g, '.render("#app")').replace(/\.render\(\s*\)/g, '.render("#app")');
+  const cleanName = functionName.replace(/[-_]/g, ' ').split(' ').map(w => w.charAt(0).toUpperCase() + w.slice(1).toLowerCase()).join('');
+  return `\n// View: ${cleanName}\nfunction ${cleanName}() {\n${result}\n  \n  return document.getElementById('app');\n}`;
 }
 
-/**
- * Resolve relative import path to absolute path
- * @param {string} importPath - Import path from import statement (e.g., './test1.jux')
- * @param {string} currentFilePath - Current file path (e.g., 'experiments/test3.jux')
- * @returns {string} - Resolved path (e.g., 'experiments/test1.jux')
- */
 function resolveImportPath(importPath, currentFilePath) {
   const currentDir = path.dirname(currentFilePath);
-  const resolved = path.join(currentDir, importPath);
-  return resolved.replace(/\\/g, '/');  // Normalize to forward slashes
+  return path.join(currentDir, importPath).replace(/\\/g, '/');
 }
 
-/**
- * Generate complete router bundle
- * ✅ IMPROVED: Context-Aware Import Resolution (resolves ../paths before dedupe)
- */
 function generateRouterBundle(views, routes, sharedModules = new Map(), allImports = [], projectRoot = '') {
-  const libImport = '/lib/jux.js'; // ✅ Use absolute path for core lib
-
-  // Map<NormalizedSource, { defaults: Set<string>, named: Set<string>, namespace: string|null }>
   const mergedImports = new Map();
-
-  // Helper to resolve relative paths to a canonical string
   const getCanonicalSource = (source, contextFilePath) => {
-    // 1. Keep externals/aliases/css/http as-is
-    if (!source.startsWith('.')) return source;
-    if (source.includes('.jux')) return source; // Skipped later anyway
-
-    // 2. Resolve relative paths against the file they came from
-    // contextFilePath is relative to projectRoot (e.g. 'experiments/list.jux')
+    if (!source.startsWith('.') || source.includes('.jux')) return source;
     const dir = path.dirname(contextFilePath);
-
-    // joinedPath is relative to projectRoot (e.g. '../lib/componentsv2')
     const joinedPath = path.join(dir, source);
-
-    // 3. Normalize to alias if it points to lib
-    // Matches 'lib/componentsv2' or '../lib/componentsv2' variants
-    if (joinedPath.includes('lib/componentsv2')) {
-      return 'juxscript/componentsv2';
-    }
-    if (joinedPath.includes('lib/components')) {
-      return 'juxscript/components';
+    const v2Index = joinedPath.indexOf('lib/componentsv2');
+    if (v2Index !== -1) {
+      const subPath = joinedPath.substring(v2Index + 'lib/componentsv2'.length);
+      if (!subPath || subPath === '/index.js' || subPath === '/index') return 'juxscript';
+      return 'juxscript' + subPath.replace(/\\/g, '/');
     }
-
-    // 4. Fallback: return as-is (but normalized separators)
+    if (joinedPath.includes('lib/components')) return 'juxscript/components';
     return joinedPath.replace(/\\/g, '/');
   };
 
   const importList = Array.isArray(allImports) ? allImports : Array.from(allImports);
-
   for (const item of importList) {
-    const code = typeof item === 'string' ? item : item.code;
-    const filePath = typeof item === 'string' ? '' : item.filePath; // Context file path
-
     try {
+      const code = typeof item === 'string' ? item : item.code;
+      const filePath = typeof item === 'string' ? '' : item.filePath;
       const ast = acorn.parse(code.trim(), { ecmaVersion: 'latest', sourceType: 'module' });
       const node = ast.body[0];
-
       if (node && node.type === 'ImportDeclaration') {
         const rawSource = node.source.value;
-
-        // Skip base libs handled manually
-        if (rawSource === 'juxscript' || rawSource === 'juxscript/reactivity') continue;
         if (rawSource.endsWith('.jux')) continue;
-
-        // ✅ RESOLVE SOURCE USING CONTEXT (Fixes ./lib/.. vs ../../lib/..)
         const source = getCanonicalSource(rawSource, filePath);
-
-        if (!mergedImports.has(source)) {
-          mergedImports.set(source, { defaults: new Set(), named: new Set(), namespace: null });
-        }
+        if (!mergedImports.has(source)) mergedImports.set(source, { defaults: new Set(), named: new Set(), namespace: null });
         const storage = mergedImports.get(source);
-
         node.specifiers.forEach(spec => {
-          if (spec.type === 'ImportDefaultSpecifier') {
-            storage.defaults.add(spec.local.name);
-          } else if (spec.type === 'ImportSpecifier') {
-            if (spec.imported.name !== spec.local.name) {
-              storage.named.add(`${spec.imported.name} as ${spec.local.name}`);
-            } else {
-              storage.named.add(spec.imported.name);
-            }
-          } else if (spec.type === 'ImportNamespaceSpecifier') {
-            storage.namespace = spec.local.name;
-          }
+          if (spec.type === 'ImportDefaultSpecifier') storage.defaults.add(spec.local.name);
+          else if (spec.type === 'ImportSpecifier') storage.named.add(spec.imported.name !== spec.local.name ? `${spec.imported.name} as ${spec.local.name}` : spec.imported.name);
+          else if (spec.type === 'ImportNamespaceSpecifier') storage.namespace = spec.local.name;
         });
       }
-    } catch (e) {
-      console.warn('⚠️  Failed to parse collected import:', code);
-    }
+    } catch (e) { }
   }
 
-  // Generate cleaned export list
   const filteredImports = [];
-
   mergedImports.forEach((storage, source) => {
-    // Namespace imports usually stand alone
-    if (storage.namespace) {
-      filteredImports.push(`import * as ${storage.namespace} from '${source}';`);
-    }
-
+    if (storage.namespace) filteredImports.push(`import * as ${storage.namespace} from '${source}';`);
     const parts = [];
-    if (storage.defaults.size > 0) {
-      const arr = Array.from(storage.defaults);
-      parts.push(arr[0]);
-    }
-
-    if (storage.named.size > 0) {
-      parts.push(`{ ${Array.from(storage.named).sort().join(', ')} }`);
-    }
-
-    if (storage.defaults.size === 0 && storage.named.size === 0 && !storage.namespace) {
-      filteredImports.push(`import '${source}';`);
-    } else if (parts.length > 0) {
-      filteredImports.push(`import ${parts.join(', ')} from '${source}';`);
-    }
+    if (storage.defaults.size > 0) parts.push(Array.from(storage.defaults)[0]);
+    if (storage.named.size > 0) parts.push(`{ ${Array.from(storage.named).sort().join(', ')} }`);
+    if (storage.defaults.size === 0 && storage.named.size === 0 && !storage.namespace) filteredImports.push(`import '${source}';`);
+    else if (parts.length > 0) filteredImports.push(`import ${parts.join(', ')} from '${source}';`);
   });
 
-  // Generate shared modules section (deduplicated by file)
-  const sharedModulesCode = Array.from(sharedModules.values())
-    .filter(code => code.trim())
-    .join('\n\n');
-
-  // Filter out empty views
-  const viewsCode = views.filter(v => v.trim()).join('\n\n');
-
-  const routeTable = routes
-    .map(r => `  '${r.path}': ${r.functionName}`)
-    .join(',\n');
-
-  // Build imports section (now filtered)
-  const importsSection = filteredImports.join('\n');
-
   return `// Generated Jux Router Bundle
-import { jux, state } from '${libImport}';
-
-// ═══════════════════════════════════════════════════════════════════
-// COLLECTED IMPORTS FROM SOURCE FILES
-// ═══════════════════════════════════════════════════════════════════
-
-${importsSection}
-
-// ═══════════════════════════════════════════════════════════════════
-// SHARED MODULES (Exported Components)
-// ═══════════════════════════════════════════════════════════════════
+${filteredImports.join('\n')}
 
-${sharedModulesCode}
+// SHARED MODULES
+${Array.from(sharedModules.values()).filter(c => c.trim()).join('\n\n')}
 
-// ═══════════════════════════════════════════════════════════════════
-// VIEW FUNCTIONS
-// ═══════════════════════════════════════════════════════════════════
+// VIEWS
+${views.filter(v => v.trim()).join('\n\n')}
 
-${viewsCode}
-
-// ═══════════════════════════════════════════════════════════════════
-// 404 VIEW
-// ═══════════════════════════════════════════════════════════════════
-
-function JuxNotFound() {
-  jux.heading(1, { text: '404 - Page Not Found' }).render('#app');
-  jux.paragraph('404-msg')
-    .text('The page you are looking for does not exist.')
-    .render('#app');
-  
-  return document.getElementById('app');
-}
-
-// ═══════════════════════════════════════════════════════════════════
-// 403 VIEW
-// ═══════════════════════════════════════════════════════════════════
-
-function JuxForbidden() {
-  jux.heading(1, { text: '403 - Forbidden' }).render('#app');
-  jux.paragraph('403-msg')
-    .text('You are not authorized to view this page.')
-    .render('#app');
-  
-  return document.getElementById('app');
-}
-
-// ═══════════════════════════════════════════════════════════════════
-// ROUTE TABLE
-// ═══════════════════════════════════════════════════════════════════
+function JuxNotFound() { jux.heading(1, { text: '404 - Page Not Found' }).render('#app'); return document.getElementById('app'); }
+function JuxForbidden() { jux.heading(1, { text: '403 - Forbidden' }).render('#app'); return document.getElementById('app'); }
 
 const routes = {
-${routeTable}
+${routes.map(r => `  '${r.path}': ${r.functionName}`).join(',\n')}
 };
 
-// ═══════════════════════════════════════════════════════════════════
-// ROUTER CORE
-// ═══════════════════════════════════════════════════════════════════
-
 const app = document.getElementById('app');
-
 function render() {
   let path = location.pathname;
-  
-  // Try exact match first
-  let view = routes[path];
-  
-  // If no match and path ends with /, try appending 'index'
-  if (!view && path.endsWith('/')) {
-    view = routes[path + 'index'] || routes[path.slice(0, -1) + '/index'];
-  }
-  
-  // If still no match and path doesn't end with /, try appending '/index'
-  if (!view && !path.endsWith('/')) {
-    view = routes[path + '/index'];
-  }
-  
-  // Fall back to 404
+  let view = routes[path] || (path.endsWith('/') ? (routes[path + 'index'] || routes[path.slice(0, -1) + '/index']) : routes[path + '/index']);
   view = view || JuxNotFound;
-  
   app.innerHTML = '';
   app.removeAttribute('data-jux-page');
-  
   view();
-  
   const pageName = Object.entries(routes).find(([p, v]) => v === view)?.[0] || 'not-found';
   app.setAttribute('data-jux-page', pageName.replace(/^\\\//, '').replace(/\\\//g, '-'));
 }
-
 document.addEventListener('click', e => {
   const a = e.target.closest('a');
-  if (!a) return;
-  
-  if (a.dataset.router === 'false') return;
-  
-  const url = new URL(a.href);
-  if (url.origin !== location.origin) return;
-  
+  if (!a || a.dataset.router === 'false' || new URL(a.href).origin !== location.origin) return;
   e.preventDefault();
   history.pushState({}, '', url.pathname);
   render();
 });
-
 window.addEventListener('popstate', render);
-
 render();
 `;
-
 }
 
-/**
- * Generate a unified index.html for router bundle
- * ✅ MODIFIED: Use vendored paths instead of CDN + Hot Reload Script injection
- */
 export function generateIndexHtml(distDir, bundleResult, options = {}) {
-  // ✅ ADD: Defensive check and fallback
-  if (!bundleResult) {
-    console.warn('⚠️  generateIndexHtml called without bundleResult, using defaults');
-    bundleResult = {
-      mainJsFilename: 'main.js',
-      routes: [],
-      vendoredPaths: {}
-    };
-  }
-
-  const { mainJsFilename = 'main.js', routes = [], vendoredPaths = {} } = bundleResult;
+  const { mainJsFilename = 'main.js', vendoredPaths = {} } = bundleResult || {};
   const { isDev = false, wsPort = 3001 } = options;
-
-  console.log('📄 Generating index.html...');
-
-  // ✅ Use vendor import map
   const importMapScript = generateVendorImportMap(vendoredPaths);
-
-  // ✅ Client-side Hot Reload Script
   const hotReloadScript = isDev ? `
   <script>
     (function() {
-      console.log('🔌 JUX Hot Reload: Connecting to port ${wsPort}...');
       let ws = new WebSocket('ws://' + window.location.hostname + ':${wsPort}');
-      
-      ws.onopen = () => console.log('✅ JUX Hot Reload: Connected');
-      
-      ws.onmessage = (msg) => {
-        try {
-          const data = JSON.parse(msg.data);
-          if (data.type === 'reload') {
-            console.log('🔄 JUX Hot Reload: Refeshing...');
-            window.location.reload();
-          }
-        } catch(e) { console.error('HMR Error:', e); }
-      };
-      
-      ws.onclose = () => console.log('❌ JUX Hot Reload: Disconnected');
+      ws.onmessage = (msg) => { if (JSON.parse(msg.data).type === 'reload') window.location.reload(); };
     })();
   </script>` : '';
 
@@ -997,114 +441,34 @@ export function generateIndexHtml(distDir, bundleResult, options = {}) {
   ${hotReloadScript}
 </body>
 </html>`;
-
-  const indexPath = path.join(distDir, 'index.html');
-  fs.writeFileSync(indexPath, html);
-
-  console.log(`   ✓ Generated: index.html (references ${mainJsFilename})`);
-  console.log('✅ Index HTML complete\n');
+  fs.writeFileSync(path.join(distDir, 'index.html'), html);
 }
 
-/**
- * ✅ NEW: Download and vendor external dependencies locally
- * Copies dependencies from node_modules to .jux-dist/vendor/
- * NO CDN - everything is local, zero hardcoded mappings
- * BUNDLES dependencies to resolve internal imports
- */
 async function vendorExternalDependencies(externalDeps, distDir) {
   const vendorDir = path.join(distDir, 'vendor');
-
-  if (!fs.existsSync(vendorDir)) {
-    fs.mkdirSync(vendorDir, { recursive: true });
-  }
-
+  if (!fs.existsSync(vendorDir)) fs.mkdirSync(vendorDir, { recursive: true });
   const vendoredPaths = {};
-
   for (const dep of externalDeps) {
     try {
       const nodeModulePath = path.join(process.cwd(), 'node_modules', dep);
-
-      if (!fs.existsSync(nodeModulePath)) {
-        console.warn(`   ⚠️  ${dep} not found in node_modules`);
-        continue;
-      }
-
-      const packageJsonPath = path.join(nodeModulePath, 'package.json');
-
-      if (!fs.existsSync(packageJsonPath)) {
-        console.warn(`   ⚠️  ${dep}: package.json not found`);
-        continue;
-      }
-
-      const packageJson = JSON.parse(
-        fs.readFileSync(packageJsonPath, 'utf-8')
-      );
-
-      const entryPoints = [
-        packageJson.module,
-        packageJson.browser,
-        packageJson.main,
-        'index.js'
-      ].filter(Boolean);
-
-      let entryFile = null;
-      for (const entry of entryPoints) {
-        const candidatePath = path.join(nodeModulePath, entry);
-        if (fs.existsSync(candidatePath)) {
-          entryFile = candidatePath;
-          break;
-        }
-      }
-
-      if (!entryFile) {
-        console.warn(`   ⚠️  ${dep}: no valid entry point`);
-        continue;
-      }
-
-      const vendorFile = path.join(vendorDir, `${dep}.js`);
-
-      await esbuild.build({
-        entryPoints: [entryFile],
-        bundle: true,
-        format: 'esm',
-        outfile: vendorFile,
-        platform: 'browser',
-        target: 'es2020',
-        minify: false,
-        logLevel: 'warning'
-      });
-
+      if (!fs.existsSync(nodeModulePath)) continue;
+      const pkg = JSON.parse(fs.readFileSync(path.join(nodeModulePath, 'package.json'), 'utf-8'));
+      const entryPoints = [pkg.module, pkg.browser, pkg.main, 'index.js'].filter(Boolean);
+      let entryFile = entryPoints.map(e => path.join(nodeModulePath, e)).find(p => fs.existsSync(p));
+      if (!entryFile) continue;
+      await esbuild.build({ entryPoints: [entryFile], bundle: true, format: 'esm', outfile: path.join(vendorDir, `${dep}.js`), platform: 'browser', target: 'es2020', logLevel: 'silent' });
       vendoredPaths[dep] = `/vendor/${dep}.js`;
-      console.log(`   ✓ ${dep} → vendor/${dep}.js`);
-
-    } catch (err) {
-      console.error(`   ❌ ${dep}: ${err.message}`);
-    }
+    } catch (err) { }
   }
-
   return vendoredPaths;
 }
 
-/**
- * ✅ NEW: Generate import map with local vendor paths
- */
 function generateVendorImportMap(vendoredPaths) {
-  // ✅ FIX: Use ABSOLUTE paths (start with /) to support nested routes (e.g. /app/dashboard)
-  // When using ./, paths are resolved relative to the current URL, which breaks on sub-pages.
   const imports = {
-    "juxscript/componentsv2": "/lib/componentsv2/index.js",  //
-    "juxscript/componentsv2/": "/lib/componentsv2/",        //
-    ...vendoredPaths  // ✅ These are LOCAL paths: "./vendor/axios.js"
+    "juxscript": "/lib/componentsv2/index.js",
+    "juxscript/": "/lib/componentsv2/",
+    ...vendoredPaths
   };
-
-  // Ensure all paths start with / to survive pushState routing
-  Object.keys(imports).forEach(key => {
-    if (imports[key].startsWith('./')) {
-      imports[key] = imports[key].substring(1);
-    }
-  });
-
-  return `<script type="importmap">
-${JSON.stringify({ imports }, null, 2)}
-</script>`;
+  Object.keys(imports).forEach(key => { if (imports[key].startsWith('./')) imports[key] = imports[key].substring(1); });
+  return `<script type="importmap">\n${JSON.stringify({ imports }, null, 2)}\n</script>`;
 }