bertui 1.2.8 → 2.0.0

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

@@ -1,104 +0,0 @@
-// bertui/src/compiler/router-generator-pure.js - NEW FILE
-// PURE function - no file system, no server
-
-export function generateRouterCode(routes) {
-  const imports = routes.map((route, i) => {
-    const componentName = `Page${i}`;
-    const importPath = route.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');
-  
-  return `import React, { useState, useEffect, createContext, useContext } from 'react';
-
-const RouterContext = createContext(null);
-
-export function useRouter() {
-  const context = useContext(RouterContext);
-  if (!context) throw new Error('useRouter must be used within a Router');
-  return context;
-}
-
-export function Router({ routes }) {
-  const [currentRoute, setCurrentRoute] = useState(null);
-  const [params, setParams] = useState({});
-
-  useEffect(() => {
-    matchAndSetRoute(window.location.pathname);
-    const handlePopState = () => matchAndSetRoute(window.location.pathname);
-    window.addEventListener('popstate', handlePopState);
-    return () => window.removeEventListener('popstate', handlePopState);
-  }, [routes]);
-
-  function matchAndSetRoute(pathname) {
-    // Static routes
-    for (const route of routes) {
-      if (route.type === 'static' && route.path === pathname) {
-        setCurrentRoute(route);
-        setParams({});
-        return;
-      }
-    }
-    // Dynamic routes
-    for (const route of routes) {
-      if (route.type === 'dynamic') {
-        const pattern = route.path.replace(/\\[([^\\]]+)\\]/g, '([^/]+)');
-        const regex = new RegExp('^' + pattern + '$');
-        const match = pathname.match(regex);
-        if (match) {
-          const paramNames = [...route.path.matchAll(/\\[([^\\]]+)\\]/g)].map(m => m[1]);
-          const extractedParams = {};
-          paramNames.forEach((name, i) => { extractedParams[name] = match[i + 1]; });
-          setCurrentRoute(route);
-          setParams(extractedParams);
-          return;
-        }
-      }
-    }
-    setCurrentRoute(null);
-    setParams({});
-  }
-
-  function navigate(path) {
-    window.history.pushState({}, '', path);
-    matchAndSetRoute(path);
-  }
-
-  const Component = currentRoute?.component;
-  return React.createElement(
-    RouterContext.Provider,
-    { value: { currentRoute, params, navigate, pathname: window.location.pathname } },
-    Component ? React.createElement(Component, { params }) : React.createElement(NotFound)
-  );
-}
-
-export function Link({ to, children, ...props }) {
-  const { navigate } = useRouter();
-  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', 
-             justifyContent: 'center', minHeight: '100vh', fontFamily: 'system-ui' }
-  },
-    React.createElement('h1', { style: { fontSize: '6rem', margin: 0 } }, '404'),
-    React.createElement('p', { style: { fontSize: '1.5rem', color: '#666' } }, 'Page not found'),
-    React.createElement('a', { href: '/', style: { color: '#10b981', textDecoration: 'none' } }, 'Go home')
-  );
-}
-
-${imports}
-
-export const routes = [
-${routeConfigs}
-];`;
-}

package/src/compiler/transform.js

@@ -1,149 +0,0 @@
-// bertui/src/compiler/transform.js - NEW FILE
-// PURE JSX/TSX transformation function - NO FILE SYSTEM
-
-/**
- * Transform JSX/TSX code to JavaScript
- * @param {string} sourceCode - The source code to transform
- * @param {Object} options - Transformation options
- * @param {string} options.loader - 'jsx', 'tsx', 'ts', 'js' (default: 'tsx')
- * @param {string} options.env - 'development' or 'production' (default: 'development')
- * @param {boolean} options.addReactImport - Automatically add React import if missing (default: true)
- * @returns {Promise<string>} Transformed JavaScript code
- */
-export async function transformJSX(sourceCode, options = {}) {
-  const {
-    loader = 'tsx',
-    env = 'development',
-    addReactImport = true
-  } = options;
-
-  // Skip transformation if it's plain JS without JSX
-  if (loader === 'js' && !sourceCode.includes('React.createElement') && !/<[A-Z]/.test(sourceCode)) {
-    return sourceCode;
-  }
-
-  try {
-    // Create Bun transpiler instance
-    const transpiler = new Bun.Transpiler({
-      loader,
-      target: 'browser',
-      define: {
-        'process.env.NODE_ENV': JSON.stringify(env)
-      },
-      tsconfig: {
-        compilerOptions: {
-          jsx: 'react',
-          jsxFactory: 'React.createElement',
-          jsxFragmentFactory: 'React.Fragment',
-          target: 'ES2020',
-          module: 'ESNext'
-        }
-      }
-    });
-
-    let transformed = await transpiler.transform(sourceCode);
-
-    // Add React import if needed and not already present
-    if (addReactImport && 
-        !transformed.includes('import React') && 
-        !transformed.includes('import * as React') &&
-        (transformed.includes('React.createElement') || transformed.includes('jsx(') || transformed.includes('jsxs('))) {
-      transformed = `import React from 'react';\n${transformed}`;
-    }
-
-    // Clean up any dev JSX references
-    if (env === 'production') {
-      transformed = transformed.replace(/jsxDEV/g, 'jsx');
-    }
-
-    return transformed;
-
-  } catch (error) {
-    throw new Error(`JSX transformation failed: ${error.message}`);
-  }
-}
-
-/**
- * Synchronous version of transformJSX
- * Use only when you know the code is small and you need sync execution
- */
-export function transformJSXSync(sourceCode, options = {}) {
-  const {
-    loader = 'tsx',
-    env = 'development',
-    addReactImport = true
-  } = options;
-
-  try {
-    const transpiler = new Bun.Transpiler({
-      loader,
-      target: 'browser',
-      define: {
-        'process.env.NODE_ENV': JSON.stringify(env)
-      }
-    });
-
-    let transformed = transpiler.transformSync(sourceCode);
-
-    if (addReactImport && 
-        !transformed.includes('import React') && 
-        !transformed.includes('import * as React') &&
-        (transformed.includes('React.createElement') || transformed.includes('jsx('))) {
-      transformed = `import React from 'react';\n${transformed}`;
-    }
-
-    if (env === 'production') {
-      transformed = transformed.replace(/jsxDEV/g, 'jsx');
-    }
-
-    return transformed;
-
-  } catch (error) {
-    throw new Error(`JSX transformation failed: ${error.message}`);
-  }
-}
-
-/**
- * Check if code contains JSX syntax
- */
-export function containsJSX(code) {
-  return code.includes('React.createElement') || 
-         code.includes('React.Fragment') ||
-         /<[A-Z]/.test(code) ||
-         code.includes('jsx(') ||
-         code.includes('jsxs(') ||
-         /<[a-z][a-z0-9]*\s/.test(code);
-}
-
-/**
- * Remove CSS imports from code (for production builds)
- */
-export function removeCSSImports(code) {
-  return code
-    .replace(/import\s+['"][^'"]*\.css['"];?\s*/g, '')
-    .replace(/import\s+['"]bertui\/styles['"]\s*;?\s*/g, '');
-}
-
-/**
- * Remove dotenv imports (for browser)
- */
-export function removeDotenvImports(code) {
-  return code
-    .replace(/import\s+\w+\s+from\s+['"]dotenv['"]\s*;?\s*/g, '')
-    .replace(/import\s+\{[^}]+\}\s+from\s+['"]dotenv['"]\s*;?\s*/g, '')
-    .replace(/\w+\.config\(\s*\)\s*;?\s*/g, '');
-}
-
-/**
- * Fix relative imports to include .js extension
- */
-export function fixRelativeImports(code) {
-  const importRegex = /from\s+['"](\.\.?\/[^'"]+?)(?<!\.js|\.jsx|\.ts|\.tsx|\.json)['"]/g;
-  
-  return code.replace(importRegex, (match, path) => {
-    if (path.endsWith('/') || /\.\w+$/.test(path)) {
-      return match;
-    }
-    return `from '${path}.js'`;
-  });
-}

package/src/config/defaultConfig.js

@@ -1,37 +0,0 @@
-// bertui/src/config/defaultConfig.js
-export const defaultConfig = {
-  siteName: "BertUI App",
-  baseUrl: "http://localhost:3000",
-
-  // importhow: alias → relative path from project root
-  // Example:
-  //   importhow: {
-  //     amani: '../../components',
-  //     ui:    '../../components/ui',
-  //     text:  '../../utils/text',
-  //   }
-  importhow: {},
-
-  meta: {
-    title: "BertUI - Lightning Fast React",
-    description: "Build lightning-fast React applications with file-based routing powered by Bun",
-    keywords: "react, bun, bertui, fast, file-based routing",
-    author: "Pease Ernest",
-    themeColor: "#667eea",
-    lang: "en",
-    ogTitle: "BertUI - Lightning Fast React Framework",
-    ogDescription: "Build lightning-fast React apps with zero config",
-    ogImage: "/og-image.png"
-  },
-
-  appShell: {
-    loading: true,
-    loadingText: "Loading...",
-    backgroundColor: "#ffffff"
-  },
-
-  robots: {
-    disallow: [],
-    crawlDelay: null
-  }
-};

package/src/config/index.js

@@ -1,2 +0,0 @@
-export { loadConfig } from './loadConfig.js';
-export { defaultConfig } from './defaultConfig.js';

package/src/config/loadConfig.js

@@ -1,64 +0,0 @@
-// bertui/src/config/loadConfig.js
-import { join } from 'path';
-import { existsSync } from 'fs';
-import { defaultConfig } from './defaultConfig.js';
-import logger from '../logger/logger.js';
-
-export async function loadConfig(root) {
-  const configPath = join(root, 'bertui.config.js');
-
-  if (!existsSync(configPath)) {
-    logger.info('No config found, using defaults');
-    return defaultConfig;
-  }
-
-  try {
-    // Read and transpile the config file manually —
-    // avoids Bun's dynamic import() build step which errors on plain JS configs
-    const source = await Bun.file(configPath).text();
-
-    const transpiler = new Bun.Transpiler({
-      loader: 'js',
-      target: 'bun',
-    });
-
-    let code = await transpiler.transform(source);
-
-    // Strip any leftover 'export default' so we can eval it
-    // and grab the value directly
-    code = code.replace(/export\s+default\s+/, 'globalThis.__bertuiConfig = ');
-
-    // Run it in the current context
-    const fn = new Function('globalThis', code);
-    fn(globalThis);
-
-    const userConfig = globalThis.__bertuiConfig;
-    delete globalThis.__bertuiConfig;
-
-    if (!userConfig) {
-      logger.warn('bertui.config.js did not export a default value, using defaults');
-      return defaultConfig;
-    }
-
-    logger.success('Loaded bertui.config.js');
-
-    logger.info(`📋 Config: importhow=${JSON.stringify(Object.keys(userConfig.importhow || {}))}`);
-
-    return mergeConfig(defaultConfig, userConfig);
-
-  } catch (error) {
-    logger.error(`Failed to load bertui.config.js: ${error.message}`);
-    return defaultConfig;
-  }
-}
-
-function mergeConfig(defaults, user) {
-  const merged = { ...user };
-  merged.meta      = { ...defaults.meta,      ...(user.meta      || {}) };
-  merged.appShell  = { ...defaults.appShell,  ...(user.appShell  || {}) };
-  merged.robots    = { ...defaults.robots,    ...(user.robots    || {}) };
-  merged.importhow = { ...(defaults.importhow || {}), ...(user.importhow || {}) };
-  if (!merged.siteName) merged.siteName = defaults.siteName;
-  if (!merged.baseUrl)  merged.baseUrl  = defaults.baseUrl;
-  return merged;
-}

package/src/css/index.js

@@ -1,46 +0,0 @@
-// bertui/src/css/index.js - NEW FILE
-// PURE CSS processing - no server
-
-import { transform } from 'lightningcss';
-import logger from '../logger/logger.js';
-
-export async function minifyCSS(css, options = {}) {
-  try {
-    const { code } = transform({
-      filename: options.filename || 'style.css',
-      code: Buffer.from(css),
-      minify: true,
-      sourceMap: false,
-      targets: {
-        chrome: 90 << 16,
-        firefox: 88 << 16,
-        safari: 14 << 16,
-        edge: 90 << 16
-      },
-      drafts: {
-        nesting: true
-      }
-    });
-    return code.toString();
-  } catch (error) {
-    logger.warn(`CSS minification failed: ${error.message}`);
-    // Fallback minification
-    return css
-      .replace(/\/\*[\s\S]*?\*\//g, '')
-      .replace(/\s+/g, ' ')
-      .replace(/\s*([{}:;,])\s*/g, '$1')
-      .replace(/;}/g, '}')
-      .trim();
-  }
-}
-
-export function combineCSS(files) {
-  return files.map(({ filename, content }) => 
-    `/* ${filename} */\n${content}`
-  ).join('\n\n');
-}
-
-
-export { minifyCSS, minifyCSSSync, combineCSS, extractCSSImports, isCSSFile } from './processor.js';
-export { buildAllCSS } from '../build/processors/css-builder.js';
-export { buildCSS, copyCSS } from '../build/css-builder.js';

package/src/css/processor.js

@@ -1,172 +0,0 @@
-// bertui/src/css/processor.js - PURE CSS PROCESSING
-import { transform } from 'lightningcss';
-import logger from '../logger/logger.js';
-
-/**
- * Minify CSS using Lightning CSS with fallback
- */
-export async function minifyCSS(css, options = {}) {
-  const {
-    filename = 'style.css',
-    minify = true,
-    sourceMap = false,
-    targets = {
-      chrome: 90 << 16,
-      firefox: 88 << 16,
-      safari: 14 << 16,
-      edge: 90 << 16
-    }
-  } = options;
-
-  // Empty CSS
-  if (!css || css.trim() === '') {
-    return '/* Empty CSS */';
-  }
-
-  try {
-    const { code } = transform({
-      filename,
-      code: Buffer.from(css),
-      minify,
-      sourceMap,
-      targets,
-      drafts: {
-        nesting: true
-      }
-    });
-    
-    return code.toString();
-  } catch (error) {
-    logger.warn(`Lightning CSS failed: ${error.message}, using fallback minifier`);
-    return fallbackMinifyCSS(css);
-  }
-}
-
-/**
- * Synchronous version for build scripts
- */
-export function minifyCSSSync(css, options = {}) {
-  const {
-    filename = 'style.css',
-    minify = true,
-    sourceMap = false
-  } = options;
-
-  if (!css || css.trim() === '') {
-    return '/* Empty CSS */';
-  }
-
-  try {
-    const { code } = transform({
-      filename,
-      code: Buffer.from(css),
-      minify,
-      sourceMap,
-      drafts: {
-        nesting: true
-      }
-    });
-    return code.toString();
-  } catch (error) {
-    return fallbackMinifyCSS(css);
-  }
-}
-
-/**
- * Combine multiple CSS files into one
- */
-export function combineCSS(files) {
-  if (!Array.isArray(files)) {
-    throw new Error('combineCSS expects an array of {filename, content}');
-  }
-
-  return files.map(({ filename, content }) => {
-    // Add file comment for debugging
-    const header = `/* ${filename} */\n`;
-    return header + content;
-  }).join('\n\n');
-}
-
-/**
- * Fallback CSS minifier (simple but works)
- */
-function fallbackMinifyCSS(css) {
-  return css
-    // Remove comments
-    .replace(/\/\*[\s\S]*?\*\//g, '')
-    // Remove whitespace
-    .replace(/\s+/g, ' ')
-    // Remove space around { } : ; ,
-    .replace(/\s*([{}:;,])\s*/g, '$1')
-    // Remove last semicolon before }
-    .replace(/;}/g, '}')
-    // Remove leading/trailing space
-    .trim();
-}
-
-/**
- * Extract CSS imports from JavaScript
- */
-export function extractCSSImports(code) {
-  const imports = [];
-  const regex = /import\s+['"]([^'"]*\.css)['"];?/g;
-  let match;
-  
-  while ((match = regex.exec(code)) !== null) {
-    imports.push(match[1]);
-  }
-  
-  return imports;
-}
-
-/**
- * Check if file is CSS
- */
-export function isCSSFile(filename) {
-  return filename.toLowerCase().endsWith('.css');
-}
-
-// ============================================
-// OPTIONAL SCSS SUPPORT - COMMENTED OUT BY DEFAULT
-// Uncomment only if you install 'sass' package
-// ============================================
-
-
-export async function processSCSS(scssCode, options = {}) {
-  try {
-    // Dynamic import so it doesn't fail if sass isn't installed
-    const sass = await import('sass').catch(() => {
-      throw new Error('sass package not installed. Run: bun add sass');
-    });
-    
-    const result = sass.compileString(scssCode, {
-      style: options.compressed ? 'compressed' : 'expanded',
-      sourceMap: false,
-      loadPaths: options.loadPaths || []
-    });
-    
-    return result.css;
-  } catch (error) {
-    logger.error(`SCSS compilation failed: ${error.message}`);
-    throw error;
-  }
-}
-
-export async function compileSCSSFile(filePath, options = {}) {
-  try {
-    const sass = await import('sass').catch(() => {
-      throw new Error('sass package not installed. Run: bun add sass');
-    });
-    
-    const result = sass.compile(filePath, {
-      style: options.compressed ? 'compressed' : 'expanded',
-      sourceMap: false,
-      loadPaths: options.loadPaths || [require('path').dirname(filePath)]
-    });
-    
-    return result.css;
-  } catch (error) {
-    logger.error(`SCSS file compilation failed: ${error.message}`);
-    throw error;
-  }
-}

package/src/dev.js

@@ -1,68 +0,0 @@
-// bertui/src/dev.js
-import { compileProject } from './client/compiler.js';
-import { startDevServer } from './server/dev-server.js';
-import { MiddlewareManager } from './middleware/index.js';
-import { compileLayouts } from './layouts/index.js';
-import { compileLoadingComponents } from './loading/index.js';
-import { analyzeRoutes, logHydrationReport } from './hydration/index.js';
-import logger from './logger/logger.js';
-import { loadConfig } from './config/loadConfig.js';
-
-const TOTAL_STEPS = 6;
-
-export async function startDev(options = {}) {
-  const root = options.root || process.cwd();
-  const port = options.port || 3000;
-
-  logger.printHeader('DEV');
-
-  try {
-    const config = await loadConfig(root);
-
-    // ── Step 1: Compile ──────────────────────────────────────────────────────
-    logger.step(1, TOTAL_STEPS, 'Compiling');
-    const { routes, outDir } = await compileProject(root);
-    logger.stepDone('Compiling', `${routes.length} routes`);
-
-    // ── Step 2: Layouts ──────────────────────────────────────────────────────
-    logger.step(2, TOTAL_STEPS, 'Layouts');
-    const layouts = await compileLayouts(root, outDir);
-    const layoutCount = Object.keys(layouts).length;
-    logger.stepDone('Layouts', layoutCount > 0 ? `${layoutCount} found` : 'none');
-
-    // ── Step 3: Loading states ───────────────────────────────────────────────
-    logger.step(3, TOTAL_STEPS, 'Loading states');
-    const loadingComponents = await compileLoadingComponents(root, outDir);
-    logger.stepDone('Loading states');
-
-    // ── Step 4: Hydration analysis ───────────────────────────────────────────
-    logger.step(4, TOTAL_STEPS, 'Hydration analysis');
-    if (routes && routes.length > 0) {
-      const analyzedRoutes = await analyzeRoutes(routes);
-      logger.stepDone('Hydration analysis',
-        `${analyzedRoutes.interactive.length} interactive · ${analyzedRoutes.static.length} static`);
-    } else {
-      logger.stepDone('Hydration analysis', 'no routes');
-    }
-
-    // ── Step 5: Middleware ───────────────────────────────────────────────────
-    logger.step(5, TOTAL_STEPS, 'Middleware');
-    const middlewareManager = new MiddlewareManager(root);
-    await middlewareManager.load();
-    middlewareManager.watch();
-    logger.stepDone('Middleware');
-
-    // ── Step 6: Dev server ───────────────────────────────────────────────────
-    logger.step(6, TOTAL_STEPS, 'Starting server');
-    await startDevServer({ root, port, middleware: middlewareManager, layouts, loadingComponents });
-    logger.stepDone('Starting server', `http://localhost:${port}`);
-
-    // ── Ready ────────────────────────────────────────────────────────────────
-    process.stdout.write(`\n  ${'\x1b[1m'}\x1b[32m▶  Ready on http://localhost:${port}\x1b[0m\n\n`);
-
-  } catch (error) {
-    logger.stepFail('Dev server', error.message);
-    logger.error(error.stack || error.message);
-    process.exit(1);
-  }
-}