frontend-hamroun 1.2.2 → 1.2.4

package/bin/cli.cjs

@@ -0,0 +1,16 @@
+#!/usr/bin/env node
+// This file is a CommonJS wrapper for the ES module CLI
+// It loads the actual CLI implementation using dynamic import()
+
+async function main() {
+  try {
+    // Use dynamic import to load the ES module CLI
+    const cliPath = new URL('../bin/cli.mjs', import.meta.url).href;
+    await import(cliPath);
+  } catch (error) {
+    console.error('Error loading CLI:', error);
+    process.exit(1);
+  }
+}
+
+main();

package/bin/cli.mjs

@@ -0,0 +1,237 @@
+#!/usr/bin/env node
+
+import fs from 'fs';
+import path from 'path';
+import { fileURLToPath } from 'url';
+import { execSync } from 'child_process';
+
+const __filename = fileURLToPath(import.meta.url);
+const __dirname = path.dirname(__filename);
+
+// Templates available
+const TEMPLATES = {
+  'basic': 'Basic frontend only template',
+  'full-stack': 'Complete frontend and backend template'
+};
+
+// Colors for CLI output
+const colors = {
+  reset: '\x1b[0m',
+  bright: '\x1b[1m',
+  green: '\x1b[32m',
+  blue: '\x1b[34m',
+  red: '\x1b[31m',
+  yellow: '\x1b[33m'
+};
+
+// Get package.json to read version
+const packageJsonPath = path.resolve(__dirname, '../package.json');
+const packageJson = JSON.parse(fs.readFileSync(packageJsonPath, 'utf8'));
+
+// Print banner
+function printBanner() {
+  console.log(`
+${colors.blue}${colors.bright}╔══════════════════════════════════════════════╗
+║                                              ║
+║   Frontend Hamroun v${packageJson.version.padEnd(25)}║
+║   A lightweight frontend & backend framework  ║
+║                                              ║
+╚══════════════════════════════════════════════╝${colors.reset}
+  `);
+}
+
+// Print help
+function printHelp() {
+  console.log(`
+${colors.bright}USAGE:${colors.reset}
+  ${colors.blue}npx frontend-hamroun${colors.reset} [command] [options]
+
+${colors.bright}COMMANDS:${colors.reset}
+  ${colors.blue}create${colors.reset} <project-name> [options]  Create a new project
+  ${colors.blue}help${colors.reset}                           Display this help message
+  ${colors.blue}version${colors.reset}                        Display version information
+
+${colors.bright}OPTIONS:${colors.reset}
+  ${colors.blue}--template${colors.reset}, ${colors.blue}-t${colors.reset} <template>       Specify template (default: basic)
+  ${colors.blue}--skip-install${colors.reset}, ${colors.blue}-s${colors.reset}            Skip package installation
+
+${colors.bright}AVAILABLE TEMPLATES:${colors.reset}
+${Object.entries(TEMPLATES).map(([name, desc]) => `  ${colors.blue}${name.padEnd(12)}${colors.reset} ${desc}`).join('\n')}
+
+${colors.bright}EXAMPLES:${colors.reset}
+  ${colors.blue}npx frontend-hamroun create${colors.reset} my-app
+  ${colors.blue}npx frontend-hamroun create${colors.reset} my-app --template full-stack
+  `);
+}
+
+// Create project from template
+function createProject(projectName, options) {
+  const template = options.template || 'basic';
+  
+  // Check if template exists
+  if (!Object.keys(TEMPLATES).includes(template)) {
+    console.error(`${colors.red}error:${colors.reset} Template "${template}" not found.`);
+    console.log(`Available templates: ${Object.keys(TEMPLATES).join(', ')}`);
+    process.exit(1);
+  }
+  
+  // Check if project directory already exists
+  const projectPath = path.resolve(process.cwd(), projectName);
+  if (fs.existsSync(projectPath)) {
+    console.error(`${colors.red}error:${colors.reset} Directory ${projectName} already exists.`);
+    process.exit(1);
+  }
+  
+  console.log(`
+${colors.bright}Creating a new project with Frontend Hamroun...${colors.reset}
+${colors.blue}• Project name:${colors.reset} ${projectName}
+${colors.blue}• Template:${colors.reset} ${template}
+${colors.blue}• Directory:${colors.reset} ${projectPath}
+  `);
+  
+  try {
+    // Find templates directory
+    const templateDir = path.resolve(__dirname, '../templates', template);
+    
+    if (!fs.existsSync(templateDir)) {
+      console.error(`${colors.red}error:${colors.reset} Template directory not found: ${templateDir}`);
+      // Try to find template with -app suffix as fallback
+      const fallbackTemplateDir = path.resolve(__dirname, '../templates', `${template}-app`);
+      if (fs.existsSync(fallbackTemplateDir)) {
+        console.log(`${colors.yellow}Using fallback template:${colors.reset} ${template}-app`);
+        templateDir = fallbackTemplateDir;
+      } else {
+        process.exit(1);
+      }
+    }
+    
+    // Create project directory
+    fs.mkdirSync(projectPath, { recursive: true });
+    
+    // Copy template files (recursive function)
+    function copyDir(src, dest) {
+      const entries = fs.readdirSync(src, { withFileTypes: true });
+      
+      for (const entry of entries) {
+        const srcPath = path.join(src, entry.name);
+        const destPath = path.join(dest, entry.name);
+        
+        if (entry.isDirectory()) {
+          fs.mkdirSync(destPath, { recursive: true });
+          copyDir(srcPath, destPath);
+        } else {
+          fs.copyFileSync(srcPath, destPath);
+        }
+      }
+    }
+    
+    // Copy the files
+    copyDir(templateDir, projectPath);
+    console.log(`${colors.green}•${colors.reset} Copied template files`);
+    
+    // Update package.json with project name
+    const projectPackageJsonPath = path.join(projectPath, 'package.json');
+    if (fs.existsSync(projectPackageJsonPath)) {
+      const projectPackageJson = JSON.parse(fs.readFileSync(projectPackageJsonPath, 'utf8'));
+      projectPackageJson.name = projectName;
+      fs.writeFileSync(
+        projectPackageJsonPath, 
+        JSON.stringify(projectPackageJson, null, 2)
+      );
+    }
+    
+    // Install dependencies
+    if (!options.skipInstall) {
+      console.log(`\n${colors.blue}Installing dependencies...${colors.reset}`);
+      
+      try {
+        execSync(`npm install`, { 
+          cwd: projectPath, 
+          stdio: 'inherit' 
+        });
+      } catch (error) {
+        console.error(`\n${colors.red}Failed to install dependencies. You can install them manually:${colors.reset}`);
+        console.log(`  cd ${projectName} && npm install`);
+      }
+    }
+    
+    // Success message
+    console.log(`
+${colors.green}${colors.bright}Success!${colors.reset} Created ${projectName} at ${projectPath}
+
+${colors.blue}Inside that directory, you can run several commands:${colors.reset}
+
+  ${colors.bright}npm run dev${colors.reset}
+    Starts the development server.
+
+  ${colors.bright}npm run build${colors.reset}
+    Builds the app for production.
+
+  ${colors.bright}npm start${colors.reset}
+    Runs the built app in production mode.
+
+${colors.blue}We suggest that you begin by typing:${colors.reset}
+
+  ${colors.bright}cd${colors.reset} ${projectName}
+  ${colors.bright}npm run dev${colors.reset}
+
+${colors.green}Happy coding!${colors.reset}
+    `);
+    
+  } catch (error) {
+    console.error(`${colors.red}Failed to create project:${colors.reset}`, error);
+    process.exit(1);
+  }
+}
+
+// Parse command line arguments
+function parseArgs() {
+  const args = process.argv.slice(2);
+  const command = args[0];
+  
+  if (!command || command === 'help') {
+    printBanner();
+    printHelp();
+    process.exit(0);
+  }
+  
+  if (command === 'version') {
+    console.log(`frontend-hamroun v${packageJson.version}`);
+    process.exit(0);
+  }
+  
+  if (command === 'create') {
+    const projectName = args[1];
+    
+    if (!projectName) {
+      console.error(`${colors.red}error:${colors.reset} Project name is required.`);
+      console.log(`Run ${colors.blue}npx frontend-hamroun help${colors.reset} for usage information.`);
+      process.exit(1);
+    }
+    
+    // Parse options
+    const options = {
+      template: 'basic',
+      skipInstall: false
+    };
+    
+    for (let i = 2; i < args.length; i++) {
+      if (args[i] === '--template' || args[i] === '-t') {
+        options.template = args[++i];
+      } else if (args[i] === '--skip-install' || args[i] === '-s') {
+        options.skipInstall = true;
+      }
+    }
+    
+    printBanner();
+    createProject(projectName, options);
+    return;
+  }
+  
+  console.error(`${colors.red}error:${colors.reset} Unknown command: ${command}`);
+  console.log(`Run ${colors.blue}npx frontend-hamroun help${colors.reset} for usage information.`);
+  process.exit(1);
+}
+
+// Run CLI
+parseArgs();

package/dist/frontend-hamroun.es.js

@@ -137,8 +137,7 @@ async function createElement(vnode) {
         }
       };
       for (const [key, value] of Object.entries(props || {})) {
-        if (key === "children")
-          continue;
+        if (key === "children") continue;
         if (key.startsWith("on") && typeof value === "function") {
           const eventName = key.toLowerCase().slice(2);
           if (!element.__events) {
@@ -199,8 +198,7 @@ async function createElement(vnode) {
     }
     const element = document.createElement(type);
     for (const [key, value] of Object.entries(props || {})) {
-      if (key === "children")
-        continue;
+      if (key === "children") continue;
       if (key.startsWith("on") && typeof value === "function") {
         const eventName = key.toLowerCase().slice(2);
         const existingHandler = (_a = element.__events) == null ? void 0 : _a[eventName];
@@ -280,8 +278,7 @@ class Component {
   }
   async update() {
     const vdom = this.render();
-    if (!vdom)
-      return document.createTextNode("");
+    if (!vdom) return document.createTextNode("");
     const rendered = await createElement(vdom);
     if (rendered instanceof HTMLElement) {
       return this._updateElement(rendered);
@@ -384,8 +381,7 @@ function useState(initial) {
   const state = componentStates[index2];
   const setState = (newValue) => {
     const nextValue = typeof newValue === "function" ? newValue(componentStates[index2]) : newValue;
-    if (componentStates[index2] === nextValue)
-      return;
+    if (componentStates[index2] === nextValue) return;
     componentStates[index2] = nextValue;
     if (isBatching) {
       batchUpdates(() => rerender(currentRender));
@@ -397,8 +393,7 @@ function useState(initial) {
   return [state, setState];
 }
 function useEffect(callback, deps) {
-  if (!currentRender)
-    throw new Error("useEffect must be called within a render");
+  if (!currentRender) throw new Error("useEffect must be called within a render");
   const effectIndex = stateIndices.get(currentRender);
   if (!effects.has(currentRender)) {
     effects.set(currentRender, []);
@@ -417,8 +412,7 @@ function useEffect(callback, deps) {
   stateIndices.set(currentRender, effectIndex + 1);
 }
 function useMemo(factory, deps) {
-  if (!currentRender)
-    throw new Error("useMemo must be called within a render");
+  if (!currentRender) throw new Error("useMemo must be called within a render");
   const memoIndex = stateIndices.get(currentRender);
   if (!memos.has(currentRender)) {
     memos.set(currentRender, []);
@@ -435,8 +429,7 @@ function useMemo(factory, deps) {
   return prevMemo.value;
 }
 function useRef(initial) {
-  if (!currentRender)
-    throw new Error("useRef must be called within a render");
+  if (!currentRender) throw new Error("useRef must be called within a render");
   const refIndex = stateIndices.get(currentRender);
   if (!refs.has(currentRender)) {
     refs.set(currentRender, []);
@@ -457,8 +450,7 @@ async function rerender(rendererId) {
     const componentEffects = effects.get(rendererId);
     if (componentEffects) {
       componentEffects.forEach((effect) => {
-        if (effect.cleanup)
-          effect.cleanup();
+        if (effect.cleanup) effect.cleanup();
       });
       effects.set(rendererId, []);
     }
@@ -507,10 +499,8 @@ async function renderToString(element) {
   setRenderCallback(() => {
   }, element, null);
   try {
-    if (element == null)
-      return "";
-    if (typeof element === "boolean")
-      return "";
+    if (element == null) return "";
+    if (typeof element === "boolean") return "";
     if (typeof element === "number" || typeof element === "string") {
       return escapeHtml(String(element));
     }
@@ -542,8 +532,7 @@ async function renderToString(element) {
       }
       let html = `<${type}`;
       for (const [key, value] of Object.entries(props || {})) {
-        if (key === "children" || key === "key")
-          continue;
+        if (key === "children" || key === "key") continue;
         if (key === "className") {
           html += ` class="${escapeHtml(String(value))}"`;
         } else if (key === "style" && typeof value === "object") {
@@ -884,8 +873,7 @@ ${Object.keys(ssrRoutes).length > 0 ? `
 🖥️  Registered SSR Routes:
 ${Object.keys(ssrRoutes).map((route) => `  ${route}`).join("\n")}` : ""}
       `);
-      if (callback)
-        callback();
+      if (callback) callback();
     });
     const gracefulShutdown = async (signal) => {
       console.log(`${signal} signal received: closing HTTP server and cleaning up`);
@@ -1020,14 +1008,10 @@ function createApiRouter$1(routeConfig, options = {}) {
 }
 function apiResponse(success, data, message, error, meta) {
   const response = { success };
-  if (data !== void 0)
-    response.data = data;
-  if (message)
-    response.message = message;
-  if (error)
-    response.error = error;
-  if (meta)
-    response.meta = meta;
+  if (data !== void 0) response.data = data;
+  if (message) response.message = message;
+  if (error) response.error = error;
+  if (meta) response.meta = meta;
   return response;
 }
 function sendSuccess(res, data, message, statusCode = 200, meta) {