bertui 1.2.6 → 1.2.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bertui",
-  "version": "1.2.6",
+  "version": "1.2.8",
   "description": "Lightning-fast React dev server powered by Bun - Now with Rust image optimization (WASM, no Rust required for users)",
   "type": "module",
   "main": "./index.js",

package/src/build/compiler/file-transpiler.js

@@ -187,11 +187,16 @@ function _usesJSX(code) {
 }
 
 function _removeCSSImports(code) {
+  // Replace CSS module imports with a Proxy so styles.foo = 'foo' at runtime
+  code = code.replace(
+    /import\s+(\w+)\s+from\s+['"][^'"]*\.module\.css['"];?\s*/g,
+    (_, varName) => `const ${varName} = new Proxy({}, { get: (_, k) => k });\n`
+  );
+  // Strip plain CSS imports entirely
   code = code.replace(/import\s+['"][^'"]*\.css['"];?\s*/g, '');
   code = code.replace(/import\s+['"]bertui\/styles['"]\s*;?\s*/g, '');
   return code;
 }
-
 function _fixBuildImports(code, srcPath, outPath, root) {
   const buildDir    = join(root, '.bertuibuild');
   const routerPath  = join(buildDir, 'router.js');

package/src/build/compiler/index.js

@@ -1,4 +1,4 @@
-// bertui/src/build/compiler/index.js - WITH IMPORTHOW + NODE MODULE SUPPORT
+// bertui/src/build/compiler/index.js
 import { join } from 'path';
 import { existsSync } from 'fs';
 import logger from '../../logger/logger.js';
@@ -6,14 +6,8 @@ import { discoverRoutes } from './route-discoverer.js';
 import { compileBuildDirectory } from './file-transpiler.js';
 import { generateBuildRouter } from './router-generator.js';
 
-/**
- * @param {string} root
- * @param {string} buildDir
- * @param {Object} envVars
- * @param {Object} config    - full bertui config (includes importhow)
- */
 export async function compileForBuild(root, buildDir, envVars, config = {}) {
-  const srcDir  = join(root, 'src');
+  const srcDir   = join(root, 'src');
   const pagesDir = join(srcDir, 'pages');
 
   if (!existsSync(srcDir)) {
@@ -21,33 +15,17 @@ export async function compileForBuild(root, buildDir, envVars, config = {}) {
   }
 
   const importhow = config.importhow || {};
-
-  let routes       = [];
-  let serverIslands = [];
-  let clientRoutes  = [];
+  let routes = [];
 
   if (existsSync(pagesDir)) {
     routes = await discoverRoutes(pagesDir);
-
-    for (const route of routes) {
-      const sourceCode = await Bun.file(route.path).text();
-      const isServerIsland = sourceCode.includes('export const render = "server"');
-
-      if (isServerIsland) {
-        serverIslands.push(route);
-        logger.success(`🏝️  Server Island: ${route.route}`);
-      } else {
-        clientRoutes.push(route);
-      }
-    }
   }
 
-  // Pass importhow so alias dirs also get compiled
   await compileBuildDirectory(srcDir, buildDir, root, envVars, importhow);
 
   if (routes.length > 0) {
     await generateBuildRouter(routes, buildDir);
   }
 
-  return { routes, serverIslands, clientRoutes };
+  return { routes };
 }

package/src/build/compiler/router-generator.js

@@ -7,12 +7,12 @@ export async function generateBuildRouter(routes, buildDir) {
     const importPath = `./pages/${route.file.replace(/\.(jsx|tsx|ts)$/, '.js')}`;
     return `import ${componentName} from '${importPath}';`;
   }).join('\n');
-  
+
   const routeConfigs = routes.map((route, i) => {
     const componentName = `Page${i}`;
     return `  { path: '${route.route}', component: ${componentName}, type: '${route.type}' }`;
   }).join(',\n');
-  
+
   const routerCode = `import React, { useState, useEffect, createContext, useContext } from 'react';
 
 const RouterContext = createContext(null);
@@ -76,16 +76,16 @@ export function Router({ routes }) {
 
 export function Link({ to, children, ...props }) {
   const { navigate } = useRouter();
-  return React.createElement('a', { 
-    href: to, 
-    onClick: (e) => { e.preventDefault(); navigate(to); }, 
-    ...props 
+  return React.createElement('a', {
+    href: to,
+    onClick: (e) => { e.preventDefault(); navigate(to); },
+    ...props
   }, children);
 }
 
 function NotFound() {
   return React.createElement('div', {
-    style: { display: 'flex', flexDirection: 'column', alignItems: 'center', 
+    style: { display: 'flex', flexDirection: 'column', alignItems: 'center',
              justifyContent: 'center', minHeight: '100vh', fontFamily: 'system-ui' }
   },
     React.createElement('h1', { style: { fontSize: '6rem', margin: 0 } }, '404'),
@@ -98,7 +98,8 @@ ${imports}
 
 export const routes = [
 ${routeConfigs}
-];`;
-  
+];
+`;
+
   await Bun.write(join(buildDir, 'router.js'), routerCode);
 }

package/src/build/generators/html-generator.js

@@ -1,78 +1,58 @@
-// bertui/src/build/generators/html-generator.js - FIXED CSS BUILD
+// bertui/src/build/generators/html-generator.js
 import { join, relative } from 'path';
 import { mkdirSync, existsSync, cpSync } from 'fs';
 import logger from '../../logger/logger.js';
 import { extractMetaFromSource } from '../../utils/meta-extractor.js';
 
-export async function generateProductionHTML(root, outDir, buildResult, routes, serverIslands, config) {
-  const mainBundle = buildResult.outputs.find(o => 
+export async function generateProductionHTML(root, outDir, buildResult, routes, config) {
+  const mainBundle = buildResult.outputs.find(o =>
     o.path.includes('main') && o.kind === 'entry-point'
   );
-  
+
   if (!mainBundle) {
-    logger.error('❌ Could not find main bundle');
+    logger.error('Could not find main bundle');
     return;
   }
-  
+
   const bundlePath = relative(outDir, mainBundle.path).replace(/\\/g, '/');
   const defaultMeta = config.meta || {};
-  
   const bertuiPackages = await copyBertuiPackagesToProduction(root, outDir);
-  
-  logger.info(`📄 Generating HTML for ${routes.length} routes...`);
-  
-  const BATCH_SIZE = 5;
-  
-  for (let i = 0; i < routes.length; i += BATCH_SIZE) {
-    const batch = routes.slice(i, i + BATCH_SIZE);
-    logger.debug(`Processing batch ${Math.floor(i/BATCH_SIZE) + 1}/${Math.ceil(routes.length/BATCH_SIZE)}`);
-    
-    for (const route of batch) {
-      await processSingleRoute(route, serverIslands, config, defaultMeta, bundlePath, outDir, bertuiPackages);
-    }
+
+  logger.info(`Generating HTML for ${routes.length} routes...`);
+
+  for (const route of routes) {
+    await processSingleRoute(route, config, defaultMeta, bundlePath, outDir, bertuiPackages);
   }
-  
-  logger.success(`✅ HTML generation complete for ${routes.length} routes`);
+
+  logger.success(`HTML generation complete for ${routes.length} routes`);
 }
 
 async function copyBertuiPackagesToProduction(root, outDir) {
   const nodeModulesDir = join(root, 'node_modules');
-  const packages = {
-    bertuiIcons: false,
-    bertuiAnimate: false,
-    elysiaEden: false
-  };
-  
-  if (!existsSync(nodeModulesDir)) {
-    logger.debug('node_modules not found, skipping package copy');
-    return packages;
-  }
-  
-  // Copy bertui-icons
+  const packages = { bertuiIcons: false, bertuiAnimate: false, elysiaEden: false };
+
+  if (!existsSync(nodeModulesDir)) return packages;
+
   const bertuiIconsSource = join(nodeModulesDir, 'bertui-icons');
   if (existsSync(bertuiIconsSource)) {
     try {
       const bertuiIconsDest = join(outDir, 'node_modules', 'bertui-icons');
       mkdirSync(join(outDir, 'node_modules'), { recursive: true });
       cpSync(bertuiIconsSource, bertuiIconsDest, { recursive: true });
-      logger.success('✅ Copied bertui-icons to dist/node_modules/');
       packages.bertuiIcons = true;
     } catch (error) {
       logger.error(`Failed to copy bertui-icons: ${error.message}`);
     }
   }
-  
-  // Copy bertui-animate CSS files
+
   const bertuiAnimateSource = join(nodeModulesDir, 'bertui-animate', 'dist');
   if (existsSync(bertuiAnimateSource)) {
     try {
       const bertuiAnimateDest = join(outDir, 'css');
       mkdirSync(bertuiAnimateDest, { recursive: true });
-      
       const minCSSPath = join(bertuiAnimateSource, 'bertui-animate.min.css');
       if (existsSync(minCSSPath)) {
         cpSync(minCSSPath, join(bertuiAnimateDest, 'bertui-animate.min.css'));
-        logger.success('✅ Copied bertui-animate.min.css to dist/css/');
         packages.bertuiAnimate = true;
       }
     } catch (error) {
@@ -80,46 +60,29 @@ async function copyBertuiPackagesToProduction(root, outDir) {
     }
   }
 
-  // Copy @elysiajs/eden
   const elysiaEdenSource = join(nodeModulesDir, '@elysiajs', 'eden');
   if (existsSync(elysiaEdenSource)) {
     try {
       const elysiaEdenDest = join(outDir, 'node_modules', '@elysiajs', 'eden');
       mkdirSync(join(outDir, 'node_modules', '@elysiajs'), { recursive: true });
       cpSync(elysiaEdenSource, elysiaEdenDest, { recursive: true });
-      logger.success('✅ Copied @elysiajs/eden to dist/node_modules/');
       packages.elysiaEden = true;
     } catch (error) {
       logger.error(`Failed to copy @elysiajs/eden: ${error.message}`);
     }
   }
-  
+
   return packages;
 }
 
-async function processSingleRoute(route, serverIslands, config, defaultMeta, bundlePath, outDir, bertuiPackages) {
+async function processSingleRoute(route, config, defaultMeta, bundlePath, outDir, bertuiPackages) {
   try {
     const sourceCode = await Bun.file(route.path).text();
     const pageMeta = extractMetaFromSource(sourceCode);
     const meta = { ...defaultMeta, ...pageMeta };
-    
-    const isServerIsland = serverIslands.find(si => si.route === route.route);
-    
-    let staticHTML = '';
-    
-    if (isServerIsland) {
-      logger.info(`🏝️  Extracting static content: ${route.route}`);
-      staticHTML = await extractStaticHTMLFromComponent(sourceCode, route.path);
-      
-      if (staticHTML) {
-        logger.success(`✅ Server Island rendered: ${route.route}`);
-      } else {
-        logger.warn(`⚠️  Could not extract HTML, falling back to client-only`);
-      }
-    }
-    
-    const html = generateHTML(meta, route, bundlePath, staticHTML, isServerIsland, bertuiPackages);
-    
+
+    const html = generateHTML(meta, bundlePath, bertuiPackages);
+
     let htmlPath;
     if (route.route === '/') {
       htmlPath = join(outDir, 'index.html');
@@ -128,210 +91,60 @@ async function processSingleRoute(route, serverIslands, config, defaultMeta, bun
       mkdirSync(routeDir, { recursive: true });
       htmlPath = join(routeDir, 'index.html');
     }
-    
+
     await Bun.write(htmlPath, html);
-    
-    if (isServerIsland) {
-      logger.success(`✅ Server Island: ${route.route} (instant content!)`);
-    } else {
-      logger.success(`✅ Client-only: ${route.route}`);
-    }
-    
-  } catch (error) {
-    logger.error(`Failed HTML for ${route.route}: ${error.message}`);
-  }
-}
+    logger.success(`${route.route}`);
 
-async function extractStaticHTMLFromComponent(sourceCode, filePath) {
-  try {
-    const returnMatch = sourceCode.match(/return\s*\(/);
-    if (!returnMatch) {
-      logger.warn(`⚠️  Could not find return statement in ${filePath}`);
-      return null;
-    }
-    
-    const codeBeforeReturn = sourceCode.substring(0, returnMatch.index);
-    const jsxContent = sourceCode.substring(returnMatch.index);
-    
-    const hookPatterns = [
-      'useState', 'useEffect', 'useContext', 'useReducer',
-      'useCallback', 'useMemo', 'useRef', 'useImperativeHandle',
-      'useLayoutEffect', 'useDebugValue'
-    ];
-    
-    let hasHooks = false;
-    for (const hook of hookPatterns) {
-      const regex = new RegExp(`\\b${hook}\\s*\\(`, 'g');
-      if (regex.test(codeBeforeReturn)) {
-        logger.error(`❌ Server Island at ${filePath} contains React hooks!`);
-        logger.error(`   Server Islands must be pure HTML - no ${hook}, etc.`);
-        hasHooks = true;
-        break;
-      }
-    }
-    
-    if (hasHooks) return null;
-    
-    const importLines = codeBeforeReturn.split('\n')
-      .filter(line => line.trim().startsWith('import'))
-      .join('\n');
-    
-    const hasRouterImport = /from\s+['"]bertui\/router['"]/m.test(importLines);
-    
-    if (hasRouterImport) {
-      logger.error(`❌ Server Island at ${filePath} imports from 'bertui/router'!`);
-      logger.error(`   Server Islands cannot use Link - use <a> tags instead.`);
-      return null;
-    }
-    
-    const eventHandlers = [
-      'onClick=', 'onChange=', 'onSubmit=', 'onInput=', 'onFocus=',
-      'onBlur=', 'onMouseEnter=', 'onMouseLeave=', 'onKeyDown=',
-      'onKeyUp=', 'onScroll='
-    ];
-    
-    for (const handler of eventHandlers) {
-      if (jsxContent.includes(handler)) {
-        logger.error(`❌ Server Island uses event handler: ${handler.replace('=', '')}`);
-        logger.error(`   Server Islands are static HTML - no interactivity allowed`);
-        return null;
-      }
-    }
-    
-    const fullReturnMatch = sourceCode.match(/return\s*\(([\s\S]*?)\);?\s*}/);
-    if (!fullReturnMatch) {
-      logger.warn(`⚠️  Could not extract JSX from ${filePath}`);
-      return null;
-    }
-    
-    let html = fullReturnMatch[1].trim();
-    
-    html = html.replace(/\{\/\*[\s\S]*?\*\/\}/g, '');
-    html = html.replace(/className=/g, 'class=');
-    
-    html = html.replace(/style=\{\{([^}]+)\}\}/g, (match, styleObj) => {
-      const props = [];
-      let currentProp = '';
-      let depth = 0;
-      
-      for (let i = 0; i < styleObj.length; i++) {
-        const char = styleObj[i];
-        if (char === '(') depth++;
-        if (char === ')') depth--;
-        
-        if (char === ',' && depth === 0) {
-          props.push(currentProp.trim());
-          currentProp = '';
-        } else {
-          currentProp += char;
-        }
-      }
-      if (currentProp.trim()) props.push(currentProp.trim());
-      
-      const cssString = props
-        .map(prop => {
-          const colonIndex = prop.indexOf(':');
-          if (colonIndex === -1) return '';
-          
-          const key = prop.substring(0, colonIndex).trim();
-          const value = prop.substring(colonIndex + 1).trim();
-          
-          if (!key || !value) return '';
-          
-          const cssKey = key.replace(/([A-Z])/g, '-$1').toLowerCase();
-          const cssValue = value.replace(/['"]/g, '');
-          
-          return `${cssKey}: ${cssValue}`;
-        })
-        .filter(Boolean)
-        .join('; ');
-      
-      return `style="${cssString}"`;
-    });
-    
-    const voidElements = ['area', 'base', 'br', 'col', 'embed', 'hr', 'img', 
-                          'input', 'link', 'meta', 'param', 'source', 'track', 'wbr'];
-    
-    html = html.replace(/<(\w+)([^>]*)\s*\/>/g, (match, tag, attrs) => {
-      if (voidElements.includes(tag.toLowerCase())) {
-        return match;
-      } else {
-        return `<${tag}${attrs}></${tag}>`;
-      }
-    });
-    
-    html = html.replace(/\{`([^`]*)`\}/g, '$1');
-    html = html.replace(/\{(['"])(.*?)\1\}/g, '$2');
-    html = html.replace(/\{(\d+)\}/g, '$1');
-    
-    logger.info(`   Extracted ${html.length} chars of static HTML`);
-    return html;
-    
   } catch (error) {
-    logger.error(`Failed to extract HTML: ${error.message}`);
-    return null;
+    logger.error(`Failed HTML for ${route.route}: ${error.message}`);
   }
 }
 
-function generateHTML(meta, route, bundlePath, staticHTML = '', isServerIsland = false, bertuiPackages = {}) {
-  const rootContent = staticHTML 
-    ? `<div id="root">${staticHTML}</div>` 
-    : '<div id="root"></div>';
-  
-  const comment = isServerIsland 
-    ? '<!-- 🏝️ Server Island: Static content rendered at build time -->'
-    : '<!-- ⚡ Client-only: Content rendered by JavaScript -->';
-  
-  const bertuiIconsImport = bertuiPackages.bertuiIcons 
+function generateHTML(meta, bundlePath, bertuiPackages = {}) {
+  const bertuiIconsImport = bertuiPackages.bertuiIcons
     ? ',\n      "bertui-icons": "/node_modules/bertui-icons/generated/index.js"'
     : '';
-  
+
   const bertuiAnimateCSS = bertuiPackages.bertuiAnimate
     ? '  <link rel="stylesheet" href="/css/bertui-animate.min.css">'
     : '';
 
-  // ✅ NEW: @elysiajs/eden local import map
   const elysiaEdenImport = bertuiPackages.elysiaEden
     ? ',\n      "@elysiajs/eden": "/node_modules/@elysiajs/eden/dist/index.mjs"'
     : '';
-  
+
   return `<!DOCTYPE html>
 <html lang="${meta.lang || 'en'}">
 <head>
   <meta charset="UTF-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>${meta.title || 'BertUI App'}</title>
-  
   <meta name="description" content="${meta.description || 'Built with BertUI'}">
   ${meta.keywords ? `<meta name="keywords" content="${meta.keywords}">` : ''}
   ${meta.author ? `<meta name="author" content="${meta.author}">` : ''}
   ${meta.themeColor ? `<meta name="theme-color" content="${meta.themeColor}">` : ''}
-  
   <meta property="og:title" content="${meta.ogTitle || meta.title || 'BertUI App'}">
   <meta property="og:description" content="${meta.ogDescription || meta.description || 'Built with BertUI'}">
   ${meta.ogImage ? `<meta property="og:image" content="${meta.ogImage}">` : ''}
-  
   <link rel="stylesheet" href="/styles/bertui.min.css">
 ${bertuiAnimateCSS}
   <link rel="icon" type="image/svg+xml" href="/favicon.svg">
-  
   <script type="importmap">
   {
     "imports": {
-  'react':                  'https://esm.sh/react@18.2.0',
-  'react-dom':              'https://esm.sh/react-dom@18.2.0',
-  'react-dom/client':       'https://esm.sh/react-dom@18.2.0/client',
-  'react/jsx-runtime':      'https://esm.sh/react@18.2.0/jsx-runtime',
-  'react/jsx-dev-runtime':  'https://esm.sh/react@18.2.0/jsx-dev-runtime',  // ADD THIS
-  '@bunnyx/api':            '/bunnyx-api/api-client.js',
-  '@elysiajs/eden':         '/node_modules/@elysiajs/eden/dist/index.mjs',
+      "react": "https://esm.sh/react@18.2.0",
+      "react-dom": "https://esm.sh/react-dom@18.2.0",
+      "react-dom/client": "https://esm.sh/react-dom@18.2.0/client",
+      "react/jsx-runtime": "https://esm.sh/react@18.2.0/jsx-runtime",
+      "react/jsx-dev-runtime": "https://esm.sh/react@18.2.0/jsx-dev-runtime",
+      "@bunnyx/api": "/bunnyx-api/api-client.js",
+      "@elysiajs/eden": "/node_modules/@elysiajs/eden/dist/index.mjs"${bertuiIconsImport}${elysiaEdenImport}
     }
   }
   </script>
 </head>
 <body>
-  ${comment}
-  ${rootContent}
+  <div id="root"></div>
   <script type="module" src="/${bundlePath}"></script>
 </body>
 </html>`;

package/src/build/server-island-validator.js

@@ -1,156 +1,12 @@
 // bertui/src/build/server-island-validator.js
-// Fixed validation for Server Islands - no false positives!
+// Server Islands removed — all pages are client-rendered.
 
-import logger from '../logger/logger.js';
-
-/**
- * Validates that a Server Island component follows all rules
- * @param {string} sourceCode - The component source code
- * @param {string} filePath - Path to the file (for error messages)
- * @returns {{ valid: boolean, errors: string[] }}
- */
 export function validateServerIsland(sourceCode, filePath) {
-  const errors = [];
-  
-  // Rule 1: No React hooks (FIXED: only match actual function calls)
-  const hookPatterns = [
-    'useState',
-    'useEffect',
-    'useContext',
-    'useReducer',
-    'useCallback',
-    'useMemo',
-    'useRef',
-    'useImperativeHandle',
-    'useLayoutEffect',
-    'useDebugValue',
-    'useId',
-    'useDeferredValue',
-    'useTransition',
-    'useSyncExternalStore'
-  ];
-  
-  for (const hook of hookPatterns) {
-    // FIXED: Only match hooks as function calls, not in text/comments
-    // Looks for: useState( or const [x] = useState(
-    const regex = new RegExp(`\\b${hook}\\s*\\(`, 'g');
-    if (regex.test(sourceCode)) {
-      errors.push(`❌ Uses React hook: ${hook}`);
-    }
-  }
-  
-  // Rule 2: No bertui/router imports
-  if (sourceCode.includes('from \'bertui/router\'') || 
-      sourceCode.includes('from "bertui/router"')) {
-    errors.push('❌ Imports from \'bertui/router\' (use <a> tags instead of Link)');
-  }
-  
-  // Rule 3: No browser APIs (FIXED: only match actual usage, not in strings/comments)
-  const browserAPIs = [
-    { pattern: 'window\\.', name: 'window' },
-    { pattern: 'document\\.', name: 'document' },
-    { pattern: 'localStorage\\.', name: 'localStorage' },
-    { pattern: 'sessionStorage\\.', name: 'sessionStorage' },
-    { pattern: 'navigator\\.', name: 'navigator' },
-    { pattern: 'location\\.', name: 'location' },
-    { pattern: 'history\\.', name: 'history' },
-    { pattern: '(?<!//.*|/\\*.*|\\*)\\bfetch\\s*\\(', name: 'fetch' },
-    { pattern: '\\.addEventListener\\s*\\(', name: 'addEventListener' },
-    { pattern: '\\.removeEventListener\\s*\\(', name: 'removeEventListener' },
-    { pattern: '\\bsetTimeout\\s*\\(', name: 'setTimeout' },
-    { pattern: '\\bsetInterval\\s*\\(', name: 'setInterval' },
-    { pattern: '\\brequestAnimationFrame\\s*\\(', name: 'requestAnimationFrame' }
-  ];
-  
-  for (const api of browserAPIs) {
-    const regex = new RegExp(api.pattern, 'g');
-    if (regex.test(sourceCode)) {
-      if (api.name === 'console') {
-        logger.warn(`⚠️  ${filePath} uses console.log (will not work in static HTML)`);
-      } else {
-        errors.push(`❌ Uses browser API: ${api.name}`);
-      }
-    }
-  }
-  
-  // Rule 4: No event handlers (these won't work without JS)
-  const eventHandlers = [
-    'onClick=',
-    'onChange=',
-    'onSubmit=',
-    'onInput=',
-    'onFocus=',
-    'onBlur=',
-    'onMouseEnter=',
-    'onMouseLeave=',
-    'onKeyDown=',
-    'onKeyUp=',
-    'onScroll='
-  ];
-  
-  for (const handler of eventHandlers) {
-    if (sourceCode.includes(handler)) {
-      errors.push(`❌ Uses event handler: ${handler.replace('=', '')} (Server Islands are static HTML)`);
-    }
-  }
-  
-  // Rule 5: Check for dynamic imports
-  if (/import\s*\(/.test(sourceCode)) {
-    errors.push('❌ Uses dynamic import() (not supported in Server Islands)');
-  }
-  
-  // Rule 6: Check for async/await (usually indicates API calls)
-  if (/async\s+function|async\s*\(|async\s+\w+\s*\(/.test(sourceCode)) {
-    errors.push('❌ Uses async/await (Server Islands must be synchronous)');
-  }
-  
-  const valid = errors.length === 0;
-  
-  return { valid, errors };
+  return { valid: true, errors: [] };
 }
 
-/**
- * Display validation errors in a clear format
- */
-export function displayValidationErrors(filePath, errors) {
-  logger.error(`\n🏝️  Server Island validation failed: ${filePath}`);
-  logger.error('\nViolations:');
-  errors.forEach(error => logger.error(`  ${error}`));
-  logger.error('\n📖 Server Island Rules:');
-  logger.error('  ✅ Pure static JSX only');
-  logger.error('  ❌ No React hooks (useState, useEffect, etc.)');
-  logger.error('  ❌ No Link component (use <a> tags)');
-  logger.error('  ❌ No browser APIs (window, document, fetch)');
-  logger.error('  ❌ No event handlers (onClick, onChange, etc.)');
-  logger.error('\n💡 Tip: Remove the "export const render = \\"server\\"" line');
-  logger.error('   if you need these features (page will be client-only).\n');
-}
+export function displayValidationErrors(filePath, errors) {}
 
-/**
- * Extract and validate all Server Islands in a project
- */
 export async function validateAllServerIslands(routes) {
-  const serverIslands = [];
-  const validationResults = [];
-  
-  for (const route of routes) {
-    const sourceCode = await Bun.file(route.path).text();
-    const isServerIsland = sourceCode.includes('export const render = "server"');
-    
-    if (isServerIsland) {
-      const validation = validateServerIsland(sourceCode, route.path);
-      
-      validationResults.push({
-        route: route.route,
-        path: route.path,
-        ...validation
-      });
-      
-      if (validation.valid) {
-        serverIslands.push(route);
-      }
-    }
-  }
-  
-  return { serverIslands, validationResults };
+  return { serverIslands: [], validationResults: [] };
 }

package/src/build.js

@@ -1,6 +1,6 @@
 // bertui/src/build.js
 import { join } from 'path';
-import { existsSync, mkdirSync, rmSync, readdirSync, statSync } from 'fs';
+import { existsSync, mkdirSync, rmSync, readdirSync } from 'fs';
 import logger from './logger/logger.js';
 import { loadEnvVariables } from './utils/env.js';
 import { globalCache } from './utils/cache.js';
@@ -13,9 +13,8 @@ import { generateSitemap } from './build/generators/sitemap-generator.js';
 import { generateRobots } from './build/generators/robots-generator.js';
 import { compileLayouts } from './layouts/index.js';
 import { compileLoadingComponents } from './loading/index.js';
-import { analyzeRoutes, logHydrationReport } from './hydration/index.js';
+import { analyzeRoutes } from './hydration/index.js';
 import { analyzeBuild } from './analyzer/index.js';
-import { buildAliasMap } from './utils/importhow.js';
 
 const TOTAL_STEPS = 10;
 
@@ -46,8 +45,8 @@ export async function buildProduction(options = {}) {
 
     // ── Step 2: Compile ──────────────────────────────────────────────────────
     logger.step(2, TOTAL_STEPS, 'Compiling');
-    const { routes, serverIslands, clientRoutes } = await compileForBuild(root, buildDir, envVars, config);
-    logger.stepDone('Compiling', `${routes.length} routes · ${serverIslands.length} islands`);
+    const { routes } = await compileForBuild(root, buildDir, envVars, config);
+    logger.stepDone('Compiling', `${routes.length} routes`);
 
     // ── Step 3: Layouts ──────────────────────────────────────────────────────
     logger.step(3, TOTAL_STEPS, 'Layouts');
@@ -78,15 +77,16 @@ export async function buildProduction(options = {}) {
     // ── Step 8: Bundle JS ────────────────────────────────────────────────────
     logger.step(8, TOTAL_STEPS, 'Bundling JS');
     const buildEntry = join(buildDir, 'main.js');
-    const routerPath = join(buildDir, 'router.js');
-    if (!existsSync(buildEntry)) throw new Error('main.js not found in build dir');
-    const result = await bundleJavaScript(buildEntry, routerPath, outDir, envVars, buildDir, analyzedRoutes, importhow, root, config);
+    if (!existsSync(buildEntry)) {
+      throw new Error('main.js not found in build dir — make sure src/main.jsx exists');
+    }
+    const result = await bundleJavaScript(buildEntry, outDir, envVars, buildDir, root, config);
     totalKB = (result.outputs.reduce((a, o) => a + (o.size || 0), 0) / 1024).toFixed(1);
     logger.stepDone('Bundling JS', `${totalKB} KB · tree-shaken`);
 
     // ── Step 9: HTML ─────────────────────────────────────────────────────────
     logger.step(9, TOTAL_STEPS, 'Generating HTML');
-    await generateProductionHTML(root, outDir, result, routes, serverIslands, config);
+    await generateProductionHTML(root, outDir, result, routes, config);
     logger.stepDone('Generating HTML', `${routes.length} pages`);
 
     // ── Step 10: Sitemap + robots ────────────────────────────────────────────
@@ -97,23 +97,25 @@ export async function buildProduction(options = {}) {
 
     if (existsSync(buildDir)) rmSync(buildDir, { recursive: true, force: true });
 
-    // Fire-and-forget — don't let the report generator block process exit
-    analyzeBuild(outDir, { outputFile: join(outDir, 'bundle-report.html') }).catch(() => {});
+    try {
+      await analyzeBuild(outDir, { outputFile: join(outDir, 'bundle-report.html') });
+    } catch (reportErr) {
+      logger.debug(`Bundle report generation skipped: ${reportErr.message}`);
+    }
 
-    // ── Summary ──────────────────────────────────────────────────────────────
     logger.printSummary({
-      routes:        routes.length,
-      serverIslands: serverIslands.length,
-      interactive:   analyzedRoutes.interactive.length,
-      staticRoutes:  analyzedRoutes.static.length,
-      jsSize:        `${totalKB} KB`,
-      outDir:        'dist/',
+      routes:      routes.length,
+      interactive: analyzedRoutes.interactive.length,
+      staticRoutes: analyzedRoutes.static.length,
+      jsSize:      `${totalKB} KB`,
+      outDir:      'dist/',
     });
 
+    logger.cleanup();
     return { success: true };
 
   } catch (error) {
-    logger.stepFail('Build', error.message);
+    logger.stepFail('Build', error?.message || String(error));
     if (existsSync(buildDir)) rmSync(buildDir, { recursive: true, force: true });
     throw error;
   }
@@ -155,6 +157,7 @@ async function generateProductionImportMap(root, config) {
 }
 
 async function copyNodeModulesToDist(root, outDir, importMap) {
+  const { mkdirSync } = await import('fs');
   const dest = join(outDir, 'assets', 'node_modules');
   mkdirSync(dest, { recursive: true });
   const src = join(root, 'node_modules');
@@ -173,54 +176,72 @@ async function copyNodeModulesToDist(root, outDir, importMap) {
   }
 }
 
-async function bundleJavaScript(buildEntry, routerPath, outDir, envVars, buildDir, analyzedRoutes, importhow, root, config) {
+async function bundleJavaScript(buildEntry, outDir, envVars, buildDir, root, config) {
   const originalCwd = process.cwd();
   process.chdir(buildDir);
 
   try {
-    const entrypoints = [buildEntry];
-    if (existsSync(routerPath)) entrypoints.push(routerPath);
-
     const importMap = await generateProductionImportMap(root, config);
     await Bun.write(join(outDir, 'import-map.json'), JSON.stringify({ imports: importMap }, null, 2));
     await copyNodeModulesToDist(root, outDir, importMap);
 
-    // Copy @bunnyx/api client to dist so the importmap entry resolves
     const bunnyxSrc = join(root, 'bunnyx-api', 'api-client.js');
     if (existsSync(bunnyxSrc)) {
+      const { mkdirSync } = await import('fs');
       mkdirSync(join(outDir, 'bunnyx-api'), { recursive: true });
       await Bun.write(join(outDir, 'bunnyx-api', 'api-client.js'), Bun.file(bunnyxSrc));
     }
 
-    const result = await Bun.build({
-      entrypoints,
-      outdir:  join(outDir, 'assets'),
-      target:  'browser',
-      format:  'esm',
-      minify: {
-        whitespace:  true,
-        syntax:      true,
-        identifiers: true,
-      },
-      splitting:  true,
-      sourcemap: 'external',
-      metafile:   true,
-      naming: {
-        entry: 'js/[name]-[hash].js',
-        chunk: 'js/chunks/[name]-[hash].js',
-        asset: 'assets/[name]-[hash].[ext]',
+    const cssModulePlugin = {
+      name: 'css-modules',
+      setup(build) {
+        build.onLoad({ filter: /\.module\.css$/ }, () => ({
+          contents: 'export default new Proxy({}, { get: (_, k) => k });',
+          loader: 'js',
+        }));
+        build.onLoad({ filter: /\.css$/ }, () => ({
+          contents: '',
+          loader: 'js',
+        }));
       },
-      external: ['react', 'react-dom', 'react-dom/client', 'react/jsx-runtime', '@bunnyx/api'],
-      define: {
-        'process.env.NODE_ENV': '"production"',
-        ...Object.fromEntries(
-          Object.entries(envVars).map(([k, v]) => [`process.env.${k}`, JSON.stringify(v)])
-        ),
-      },
-    });
+    };
+
+    let result;
+    try {
+      result = await Bun.build({
+        entrypoints: [buildEntry],
+        outdir:  join(outDir, 'assets'),
+        target:  'browser',
+        format:  'esm',
+        plugins: [cssModulePlugin],
+        minify: {
+          whitespace:  true,
+          syntax:      true,
+          identifiers: true,
+        },
+        splitting:  true,
+        sourcemap: 'external',
+        metafile:   true,
+        naming: {
+          entry: 'js/[name]-[hash].js',
+          chunk: 'js/chunks/[name]-[hash].js',
+          asset: 'assets/[name]-[hash].[ext]',
+        },
+        external: ['react', 'react-dom', 'react-dom/client', 'react/jsx-runtime', '@bunnyx/api'],
+        define: {
+          'process.env.NODE_ENV': '"production"',
+          ...Object.fromEntries(
+            Object.entries(envVars).map(([k, v]) => [`process.env.${k}`, JSON.stringify(v)])
+          ),
+        },
+      });
+    } catch (err) {
+      throw new Error(`Bun.build failed: ${err?.message || String(err)}`);
+    }
 
     if (!result.success) {
-      throw new Error(`Bundle failed\n${result.logs?.map(l => l.message).join('\n') || 'Unknown error'}`);
+      const msgs = (result.logs || []).map(l => l?.message || l?.text || JSON.stringify(l)).join('\n');
+      throw new Error(`Bundle failed\n${msgs || 'Check your imports for .jsx extensions or unresolvable paths'}`);
     }
 
     if (result.metafile) {
@@ -237,9 +258,9 @@ async function bundleJavaScript(buildEntry, routerPath, outDir, envVars, buildDi
 export async function build(options = {}) {
   try {
     await buildProduction(options);
+    process.exit(0);
   } catch (error) {
-    console.error(error);
+    console.error('Build error:', error?.message || String(error));
     process.exit(1);
   }
-  process.exit(0);
 }

package/src/logger/logger.js

@@ -3,6 +3,7 @@
 
 import { createWriteStream } from 'fs';
 import { join } from 'path';
+import { mkdirSync, existsSync } from 'fs';
 
 // ── ANSI helpers ─────────────────────────────────────────────────────────────
 const C = {
@@ -121,12 +122,10 @@ export function fileProgress(current, total, filename) {
 
 // ── Simple log levels (used internally, suppressed in compact mode) ───────────
 export function info(msg) {
-  // In compact mode swallow routine info — only pass through to debug log
   _debugLog('INFO', msg);
 }
 
 export function success(msg) {
-  // Swallow — stepDone() is the visual replacement
   _debugLog('SUCCESS', msg);
 }
 
@@ -185,6 +184,9 @@ export function bigLog(title, opts = {}) {
 // ── Build/Dev summary ─────────────────────────────────────────────────────────
 export function printSummary(stats = {}) {
   _stopSpinner();
+  // Close the log stream before printing summary
+  _closeLogStream();
+  
   process.stdout.write('\n');
 
   const dur = _startTime ? `${((Date.now() - _startTime) / 1000).toFixed(2)}s` : '';
@@ -268,17 +270,38 @@ let _logStream = null;
 function _debugLog(level, msg) {
   if (!_logStream) {
     try {
+      const logDir = join(process.cwd(), '.bertui');
+      if (!existsSync(logDir)) {
+        mkdirSync(logDir, { recursive: true });
+      }
+      
       _logStream = createWriteStream(
-        join(process.cwd(), '.bertui', 'dev.log'),
+        join(logDir, 'dev.log'),
         { flags: 'a' }
       );
-    } catch { return; }
+    } catch (err) {
+      return;
+    }
   }
   const ts = new Date().toISOString().substring(11, 23);
   _logStream.write(`[${ts}] [${level}] ${msg}\n`);
 }
 
-// ── Default export (matches existing logger.method() call sites) ──────────────
+// NEW: Function to close the log stream
+function _closeLogStream() {
+  if (_logStream) {
+    _logStream.end();
+    _logStream = null;
+  }
+}
+
+// NEW: Cleanup function to be called when done
+export function cleanup() {
+  _stopSpinner();
+  _closeLogStream();
+}
+
+// ── Default export ────────────────────────────────────────────────────────────
 export default {
   printHeader,
   step,
@@ -293,4 +316,5 @@ export default {
   table,
   bigLog,
   printSummary,
+  cleanup,  // Export cleanup function
 };

package/src/serve.js

@@ -42,10 +42,8 @@ export async function startPreviewServer(options = {}) {
     process.exit(1);
   }
   
-  logger.bigLog(`🚀 PREVIEW SERVER`, { color: 'green' });
-  logger.info(`📁 Serving: ${publicPath}`);
-  logger.info(`🌐 URL: http://localhost:${port}`);
-  logger.info(`⚡ Press Ctrl+C to stop`);
+console.log(`\n  🚀 Preview running at http://localhost:${port}`);
+console.log(`  Press Ctrl+C to stop\n`);
   
   // Track connections for graceful shutdown
   const connections = new Set();

package/src/server/dev-server-utils.js

@@ -72,13 +72,17 @@ export async function buildDevImportMap(root) {
 
   logger.info('🔄 Rebuilding dev import map (new packages detected)...');
 
-  'react':                  'https://esm.sh/react@18.2.0',
-  'react-dom':              'https://esm.sh/react-dom@18.2.0',
-  'react-dom/client':       'https://esm.sh/react-dom@18.2.0/client',
-  'react/jsx-runtime':      'https://esm.sh/react@18.2.0/jsx-runtime',
-  'react/jsx-dev-runtime':  'https://esm.sh/react@18.2.0/jsx-dev-runtime',  // ADD THIS
-  '@bunnyx/api':            '/bunnyx-api/api-client.js',
-  '@elysiajs/eden':         '/node_modules/@elysiajs/eden/dist/index.mjs',
+  // Initialize importMap with default mappings
+  const importMap = {
+    'react':                  'https://esm.sh/react@18.2.0',
+    'react-dom':              'https://esm.sh/react-dom@18.2.0',
+    'react-dom/client':       'https://esm.sh/react-dom@18.2.0/client',
+    'react/jsx-runtime':      'https://esm.sh/react@18.2.0/jsx-runtime',
+    'react/jsx-dev-runtime':  'https://esm.sh/react@18.2.0/jsx-dev-runtime',
+    '@bunnyx/api':            '/bunnyx-api/api-client.js',
+    '@elysiajs/eden':         '/node_modules/@elysiajs/eden/dist/index.mjs',
+  };
+  
   const SKIP = new Set(['react', 'react-dom', '.bin', '.cache', '.package-lock.json', '.yarn']);
 
   if (existsSync(nodeModulesDir)) {