bertui 0.1.6 → 0.1.8

package/src/config/loadConfig.js

@@ -1,33 +1,33 @@
-// 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');
-  
-  // Check if user created config
-  if (existsSync(configPath)) {
-    try {
-      const userConfig = await import(configPath);
-      logger.success('Loaded bertui.config.js');
-      
-      // Merge user config with defaults
-      return mergeConfig(defaultConfig, userConfig.default || userConfig);
-    } catch (error) {
-      logger.error(`Failed to load config. Make sure bertui.config.js is in the root directory: ${error.message}`);
-      return defaultConfig;
-    }
-  }
-  
-  logger.info('No config found, using defaults');
-  return defaultConfig;
-}
-
-function mergeConfig(defaults, user) {
-  return {
-    meta: { ...defaults.meta, ...(user.meta || {}) },
-    appShell: { ...defaults.appShell, ...(user.appShell || {}) }
-  };
+// 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');
+  
+  // Check if user created config
+  if (existsSync(configPath)) {
+    try {
+      const userConfig = await import(configPath);
+      logger.success('Loaded bertui.config.js');
+      
+      // Merge user config with defaults
+      return mergeConfig(defaultConfig, userConfig.default || userConfig);
+    } catch (error) {
+      logger.error(`Failed to load config. Make sure bertui.config.js is in the root directory: ${error.message}`);
+      return defaultConfig;
+    }
+  }
+  
+  logger.info('No config found, using defaults');
+  return defaultConfig;
+}
+
+function mergeConfig(defaults, user) {
+  return {
+    meta: { ...defaults.meta, ...(user.meta || {}) },
+    appShell: { ...defaults.appShell, ...(user.appShell || {}) }
+  };
 }

package/src/dev.js

@@ -1,23 +1,23 @@
-// src/dev.js
-import { compileProject } from './client/compiler.js';
-import { startDevServer } from './server/dev-server.js';
-import logger from './logger/logger.js';
-
-export async function startDev(options = {}) {
-  const root = options.root || process.cwd();
-  const port = options.port || 3000;
-  
-  try {
-    // Step 1: Compile project
-    logger.info('Step 1: Compiling project...');
-    await compileProject(root);
-    
-    // Step 2: Start dev server
-    logger.info('Step 2: Starting dev server...');
-    await startDevServer({ root, port });
-    
-  } catch (error) {
-    logger.error(`Dev server failed: ${error.message}`);
-    process.exit(1);
-  }
+// src/dev.js
+import { compileProject } from './client/compiler.js';
+import { startDevServer } from './server/dev-server.js';
+import logger from './logger/logger.js';
+
+export async function startDev(options = {}) {
+  const root = options.root || process.cwd();
+  const port = options.port || 3000;
+  
+  try {
+    // Step 1: Compile project
+    logger.info('Step 1: Compiling project...');
+    await compileProject(root);
+    
+    // Step 2: Start dev server
+    logger.info('Step 2: Starting dev server...');
+    await startDevServer({ root, port });
+    
+  } catch (error) {
+    logger.error(`Dev server failed: ${error.message}`);
+    process.exit(1);
+  }
 }

package/src/logger/logger.js

@@ -1,18 +1,18 @@
-// src/utils/logger.js
-import { createLogger } from 'ernest-logger';
-
-// Create logger instance for BertUI
-const logger = createLogger({
-  time: true,
-  emoji: true,
-  level: 'info',
-  prefix: '[BertUI]',
-  customLevels: {
-    server: { color: 'brightCyan', emoji: '🌐', priority: 2 },
-    build: { color: 'brightGreen', emoji: '📦', priority: 2 },
-    hmr: { color: 'brightYellow', emoji: '🔥', priority: 2 }
-  }
-});
-
-// Export the logger
+// src/utils/logger.js
+import { createLogger } from 'ernest-logger';
+
+// Create logger instance for BertUI
+const logger = createLogger({
+  time: true,
+  emoji: true,
+  level: 'info',
+  prefix: '[BertUI]',
+  customLevels: {
+    server: { color: 'brightCyan', emoji: '🌐', priority: 2 },
+    build: { color: 'brightGreen', emoji: '📦', priority: 2 },
+    hmr: { color: 'brightYellow', emoji: '🔥', priority: 2 }
+  }
+});
+
+// Export the logger
 export default logger;

package/src/logger/notes.md

@@ -1,20 +1,20 @@
-here we will use the ernest logger libraray instead of chalk because i want colourfull logs and not just normal b/w logs the whole module is exported for use in the libraray 
-it is a file that is complete and needs no updated later on 
-// src/utils/logger.js
-import { createLogger } from 'ernest-logger';
-
-// Create logger instance for BertUI
-const logger = createLogger({
-  time: true,
-  emoji: true,
-  level: 'info',
-  prefix: '[BertUI]',
-  customLevels: {
-    server: { color: 'brightCyan', emoji: '🌐', priority: 2 },
-    build: { color: 'brightGreen', emoji: '📦', priority: 2 },
-    hmr: { color: 'brightYellow', emoji: '🔥', priority: 2 }
-  }
-});
-
-// Export the logger
+here we will use the ernest logger libraray instead of chalk because i want colourfull logs and not just normal b/w logs the whole module is exported for use in the libraray 
+it is a file that is complete and needs no updated later on 
+// src/utils/logger.js
+import { createLogger } from 'ernest-logger';
+
+// Create logger instance for BertUI
+const logger = createLogger({
+  time: true,
+  emoji: true,
+  level: 'info',
+  prefix: '[BertUI]',
+  customLevels: {
+    server: { color: 'brightCyan', emoji: '🌐', priority: 2 },
+    build: { color: 'brightGreen', emoji: '📦', priority: 2 },
+    hmr: { color: 'brightYellow', emoji: '🔥', priority: 2 }
+  }
+});
+
+// Export the logger
 export default logger;

package/src/router/{router.js → Router.js}

@@ -1,129 +1,129 @@
-// src/router/Router.jsx
-import { useState, useEffect, createContext, useContext } from 'react';
-
-// Router context
-const RouterContext = createContext(null);
-
-export function useRouter() {
-  const context = useContext(RouterContext);
-  if (!context) {
-    throw new Error('useRouter must be used within a Router component');
-  }
-  return context;
-}
-
-export function useParams() {
-  const { params } = useRouter();
-  return params;
-}
-
-export function Router({ routes, children }) {
-  const [currentRoute, setCurrentRoute] = useState(null);
-  const [params, setParams] = useState({});
-
-  useEffect(() => {
-    // Match initial route
-    matchAndSetRoute(window.location.pathname);
-
-    // Handle browser navigation
-    const handlePopState = () => {
-      matchAndSetRoute(window.location.pathname);
-    };
-
-    window.addEventListener('popstate', handlePopState);
-    return () => window.removeEventListener('popstate', handlePopState);
-  }, []);
-
-  function matchAndSetRoute(pathname) {
-    // Try exact match first (static routes)
-    for (const route of routes) {
-      if (route.type === 'static' && route.path === pathname) {
-        setCurrentRoute(route);
-        setParams({});
-        return;
-      }
-    }
-
-    // Try 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) {
-          // Extract params
-          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;
-        }
-      }
-    }
-
-    // No match found - 404
-    setCurrentRoute(null);
-    setParams({});
-  }
-
-  function navigate(path) {
-    window.history.pushState({}, '', path);
-    matchAndSetRoute(path);
-  }
-
-  const routerValue = {
-    currentRoute,
-    params,
-    navigate,
-    pathname: window.location.pathname
-  };
-
-  return (
-    <RouterContext.Provider value={routerValue}>
-      {currentRoute ? (
-        <currentRoute.component />
-      ) : (
-        children || <NotFound />
-      )}
-    </RouterContext.Provider>
-  );
-}
-
-export function Link({ to, children, className, ...props }) {
-  const { navigate } = useRouter();
-
-  function handleClick(e) {
-    e.preventDefault();
-    navigate(to);
-  }
-
-  return (
-    <a href={to} onClick={handleClick} className={className} {...props}>
-      {children}
-    </a>
-  );
-}
-
-function NotFound() {
-  return (
-    <div style={{
-      display: 'flex',
-      flexDirection: 'column',
-      alignItems: 'center',
-      justifyContent: 'center',
-      minHeight: '100vh',
-      fontFamily: 'system-ui, sans-serif'
-    }}>
-      <h1 style={{ fontSize: '6rem', margin: 0 }}>404</h1>
-      <p style={{ fontSize: '1.5rem', color: '#666' }}>Page not found</p>
-      <a href="/" style={{ color: '#10b981', textDecoration: 'none', fontSize: '1.2rem' }}>
-        Go home
-      </a>
-    </div>
-  );
+// src/router/Router.jsx
+import { useState, useEffect, createContext, useContext } from 'react';
+
+// Router context
+const RouterContext = createContext(null);
+
+export function useRouter() {
+  const context = useContext(RouterContext);
+  if (!context) {
+    throw new Error('useRouter must be used within a Router component');
+  }
+  return context;
+}
+
+export function useParams() {
+  const { params } = useRouter();
+  return params;
+}
+
+export function Router({ routes, children }) {
+  const [currentRoute, setCurrentRoute] = useState(null);
+  const [params, setParams] = useState({});
+
+  useEffect(() => {
+    // Match initial route
+    matchAndSetRoute(window.location.pathname);
+
+    // Handle browser navigation
+    const handlePopState = () => {
+      matchAndSetRoute(window.location.pathname);
+    };
+
+    window.addEventListener('popstate', handlePopState);
+    return () => window.removeEventListener('popstate', handlePopState);
+  }, []);
+
+  function matchAndSetRoute(pathname) {
+    // Try exact match first (static routes)
+    for (const route of routes) {
+      if (route.type === 'static' && route.path === pathname) {
+        setCurrentRoute(route);
+        setParams({});
+        return;
+      }
+    }
+
+    // Try 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) {
+          // Extract params
+          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;
+        }
+      }
+    }
+
+    // No match found - 404
+    setCurrentRoute(null);
+    setParams({});
+  }
+
+  function navigate(path) {
+    window.history.pushState({}, '', path);
+    matchAndSetRoute(path);
+  }
+
+  const routerValue = {
+    currentRoute,
+    params,
+    navigate,
+    pathname: window.location.pathname
+  };
+
+  return (
+    <RouterContext.Provider value={routerValue}>
+      {currentRoute ? (
+        <currentRoute.component />
+      ) : (
+        children || <NotFound />
+      )}
+    </RouterContext.Provider>
+  );
+}
+
+export function Link({ to, children, className, ...props }) {
+  const { navigate } = useRouter();
+
+  function handleClick(e) {
+    e.preventDefault();
+    navigate(to);
+  }
+
+  return (
+    <a href={to} onClick={handleClick} className={className} {...props}>
+      {children}
+    </a>
+  );
+}
+
+function NotFound() {
+  return (
+    <div style={{
+      display: 'flex',
+      flexDirection: 'column',
+      alignItems: 'center',
+      justifyContent: 'center',
+      minHeight: '100vh',
+      fontFamily: 'system-ui, sans-serif'
+    }}>
+      <h1 style={{ fontSize: '6rem', margin: 0 }}>404</h1>
+      <p style={{ fontSize: '1.5rem', color: '#666' }}>Page not found</p>
+      <a href="/" style={{ color: '#10b981', textDecoration: 'none', fontSize: '1.2rem' }}>
+        Go home
+      </a>
+    </div>
+  );
 }