slicejs-cli 2.8.0 → 2.8.2

package/commands/init/init.js

@@ -48,29 +48,29 @@ export default async function initializeProject(projectType) {
         const srcDir = path.join(sliceBaseDir, 'src');
 
         try {
-            if (fs.existsSync(destinationApi)) throw new Error(`The "api" directory already exists: ${destinationApi}`);
-            if (fs.existsSync(destinationSrc)) throw new Error(`The "src" directory already exists: ${destinationSrc}`);
-        } catch (error) {
-            Print.error('Validating destination directories:', error.message);
-            return;
-        }
+            if (fs.existsSync(destinationApi)) throw new Error(`The "api" directory already exists: ${destinationApi}`);
+            if (fs.existsSync(destinationSrc)) throw new Error(`The "src" directory already exists: ${destinationSrc}`);
+        } catch (error) {
+            Print.error('Validating destination directories:', error.message);
+            return;
+        }
 
         // 1. COPIAR LA CARPETA API (mantener lógica original)
-        const apiSpinner = ora('Copying API structure...').start();
-        try {
-            if (!fs.existsSync(apiDir)) throw new Error(`API folder not found: ${apiDir}`);
-            await fs.copy(apiDir, destinationApi, { recursive: true });
-            apiSpinner.succeed('API structure created successfully');
-        } catch (error) {
-            apiSpinner.fail('Error copying API structure');
-            Print.error(error.message);
-            return;
-        }
+        const apiSpinner = ora('Copying API structure...').start();
+        try {
+            if (!fs.existsSync(apiDir)) throw new Error(`API folder not found: ${apiDir}`);
+            await fs.copy(apiDir, destinationApi, { recursive: true });
+            apiSpinner.succeed('API structure created successfully');
+        } catch (error) {
+            apiSpinner.fail('Error copying API structure');
+            Print.error(error.message);
+            return;
+        }
 
         // 2. CREAR ESTRUCTURA SRC BÁSICA (sin copiar componentes Visual)
-        const srcSpinner = ora('Creating src structure...').start();
-        try {
-            if (!fs.existsSync(srcDir)) throw new Error(`src folder not found: ${srcDir}`);
+        const srcSpinner = ora('Creating src structure...').start();
+        try {
+            if (!fs.existsSync(srcDir)) throw new Error(`src folder not found: ${srcDir}`);
 
             // Copiar solo los archivos base de src, excluyendo Components/Visual
             await fs.ensureDir(destinationSrc);
@@ -94,22 +94,22 @@ export default async function initializeProject(projectType) {
                             const destComponentItemPath = path.join(destItemPath, componentItem);
 
                             if (componentItem !== 'Visual') {
-                                // Copy Service and other component types
-                                await fs.copy(componentItemPath, destComponentItemPath, { recursive: true });
-                            } else {
-                                // Only create empty Visual directory
-                                await fs.ensureDir(destComponentItemPath);
-                            }
-                        }
-                    } else {
-                        // Copy other folders normally
-                        await fs.copy(srcItemPath, destItemPath, { recursive: true });
-                    }
-                } else {
-                    // Copy files normally
-                    await fs.copy(srcItemPath, destItemPath);
-                }
-            }
+                                // Copy Service and other component types
+                                await fs.copy(componentItemPath, destComponentItemPath, { recursive: true });
+                            } else {
+                                // Only create empty Visual directory
+                                await fs.ensureDir(destComponentItemPath);
+                            }
+                        }
+                    } else {
+                        // Copy other folders normally
+                        await fs.copy(srcItemPath, destItemPath, { recursive: true });
+                    }
+                } else {
+                    // Copy files normally
+                    await fs.copy(srcItemPath, destItemPath);
+                }
+            }
 
             srcSpinner.succeed('Source structure created successfully');
         } catch (error) {
@@ -142,15 +142,15 @@ export default async function initializeProject(projectType) {
                 if (successful > 0 && failed === 0) {
                     componentsSpinner.succeed(`All ${successful} Visual components installed successfully`);
                 } else if (successful > 0) {
-                componentsSpinner.warn(`${successful} components installed, ${failed} failed`);
-                Print.info('You can install failed components later using "slice get <component-name>"');
-            } else {
-                componentsSpinner.fail('Failed to install Visual components');
-            }
-        } else {
-            componentsSpinner.warn('No Visual components found in registry');
-            Print.info('You can add components later using "slice get <component-name>"');
-        }
+                componentsSpinner.warn(`${successful} components installed, ${failed} failed`);
+                Print.info('You can install failed components later using "slice get <component-name>"');
+            } else {
+                componentsSpinner.fail('Failed to install Visual components');
+            }
+        } else {
+            componentsSpinner.warn('No Visual components found in registry');
+            Print.info('You can add components later using "slice get <component-name>"');
+        }
 
         } catch (error) {
             componentsSpinner.fail('Could not download Visual components from official repository');
@@ -222,21 +222,21 @@ export default async function initializeProject(projectType) {
             console.log('  npm run get            - Install components');
             console.log('  npm run browse         - Browse components');
         } catch (error) {
-        pkgSpinner.fail('Failed to configure npm scripts');
-        Print.error(error.message);
-        }
+        pkgSpinner.fail('Failed to configure npm scripts');
+        Print.error(error.message);
+        }
 
-        Print.success('Project initialized successfully.');
-        Print.newLine();
-        Print.info('Next steps:');
-        console.log('  slice browse          - View available components');
-        console.log('  slice get Button      - Install specific components');
-        console.log('  slice sync            - Update all components to latest versions');
+        Print.success('Project initialized successfully.');
+        Print.newLine();
+        Print.info('Next steps:');
+        console.log('  slice browse          - View available components');
+        console.log('  slice get Button      - Install specific components');
+        console.log('  slice sync            - Update all components to latest versions');
 
     } catch (error) {
-        Print.error('Unexpected error initializing project:', error.message);
-    }
-}
+        Print.error('Unexpected error initializing project:', error.message);
+    }
+}
 
 /**
  * Obtiene TODOS los componentes Visual disponibles en el registry

package/commands/utils/PathHelper.js

@@ -1,68 +1,68 @@
-import path from 'path'
-import fs from 'fs-extra'
-import { fileURLToPath } from 'url'
-
-const sanitize = (s) => (s || '').replace(/^[/\\]+/, '')
-const dirOf = (url) => path.dirname(fileURLToPath(url))
-
-function candidates(moduleUrl) {
-  const dir = dirOf(moduleUrl)
-  return [
-    path.join(dir, '../../'),
-    path.join(dir, '../../../../')
-  ]
-}
-
-function resolveProjectRoot(moduleUrl) {
-  const initCwd = process.env.INIT_CWD
-  if (initCwd && fs.pathExistsSync(initCwd)) {
-    return initCwd
-  }
-
-  const cwd = process.cwd()
-  if (cwd && fs.pathExistsSync(cwd)) {
-    return cwd
-  }
-
-  const dirs = candidates(moduleUrl)
-  for (const root of dirs) {
-    const hasSrc = fs.pathExistsSync(path.join(root, 'src'))
-    const hasApi = fs.pathExistsSync(path.join(root, 'api'))
-    if (hasSrc || hasApi) return root
-  }
-  return dirs[1]
-}
-
-function joinProject(moduleUrl, ...segments) {
-  const root = resolveProjectRoot(moduleUrl)
-  const clean = segments.map(sanitize)
-  return path.join(root, ...clean)
-}
-
-export function getProjectRoot(moduleUrl) {
-  return resolveProjectRoot(moduleUrl)
-}
-
-export function getPath(moduleUrl, folder, ...segments) {
-  return joinProject(moduleUrl, folder, ...segments)
-}
-
-export function getSrcPath(moduleUrl, ...segments) {
-  return joinProject(moduleUrl, 'src', ...segments)
-}
-
-export function getApiPath(moduleUrl, ...segments) {
-  return joinProject(moduleUrl, 'api', ...segments)
-}
-
-export function getDistPath(moduleUrl, ...segments) {
-  return joinProject(moduleUrl, 'dist', ...segments)
-}
-
-export function getConfigPath(moduleUrl) {
-  return joinProject(moduleUrl, 'src', 'sliceConfig.json')
-}
-
-export function getComponentsJsPath(moduleUrl) {
-  return joinProject(moduleUrl, 'src', 'Components', 'components.js')
-}
+import path from 'path'
+import fs from 'fs-extra'
+import { fileURLToPath } from 'url'
+
+const sanitize = (s) => (s || '').replace(/^[/\\]+/, '')
+const dirOf = (url) => path.dirname(fileURLToPath(url))
+
+function candidates(moduleUrl) {
+  const dir = dirOf(moduleUrl)
+  return [
+    path.join(dir, '../../'),
+    path.join(dir, '../../../../')
+  ]
+}
+
+function resolveProjectRoot(moduleUrl) {
+  const initCwd = process.env.INIT_CWD
+  if (initCwd && fs.pathExistsSync(initCwd)) {
+    return initCwd
+  }
+
+  const cwd = process.cwd()
+  if (cwd && fs.pathExistsSync(cwd)) {
+    return cwd
+  }
+
+  const dirs = candidates(moduleUrl)
+  for (const root of dirs) {
+    const hasSrc = fs.pathExistsSync(path.join(root, 'src'))
+    const hasApi = fs.pathExistsSync(path.join(root, 'api'))
+    if (hasSrc || hasApi) return root
+  }
+  return dirs[1]
+}
+
+function joinProject(moduleUrl, ...segments) {
+  const root = resolveProjectRoot(moduleUrl)
+  const clean = segments.map(sanitize)
+  return path.join(root, ...clean)
+}
+
+export function getProjectRoot(moduleUrl) {
+  return resolveProjectRoot(moduleUrl)
+}
+
+export function getPath(moduleUrl, folder, ...segments) {
+  return joinProject(moduleUrl, folder, ...segments)
+}
+
+export function getSrcPath(moduleUrl, ...segments) {
+  return joinProject(moduleUrl, 'src', ...segments)
+}
+
+export function getApiPath(moduleUrl, ...segments) {
+  return joinProject(moduleUrl, 'api', ...segments)
+}
+
+export function getDistPath(moduleUrl, ...segments) {
+  return joinProject(moduleUrl, 'dist', ...segments)
+}
+
+export function getConfigPath(moduleUrl) {
+  return joinProject(moduleUrl, 'src', 'sliceConfig.json')
+}
+
+export function getComponentsJsPath(moduleUrl) {
+  return joinProject(moduleUrl, 'src', 'Components', 'components.js')
+}

package/commands/utils/VersionChecker.js

@@ -1,10 +1,10 @@
 // commands/utils/VersionChecker.js
 
-import fs from "fs-extra";
-import path from "path";
-import { fileURLToPath } from "url";
-import Print from "../Print.js";
-import { getProjectRoot } from "../utils/PathHelper.js";
+import fs from "fs-extra";
+import path from "path";
+import { fileURLToPath } from "url";
+import Print from "../Print.js";
+import { getProjectRoot } from "../utils/PathHelper.js";
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
 
@@ -23,9 +23,9 @@ class VersionChecker {
       const cliPackage = await fs.readJson(cliPackagePath);
       this.currentCliVersion = cliPackage.version;
 
-      // Get Framework version from project node_modules
-      const projectRoot = getProjectRoot(import.meta.url);
-      const frameworkPackagePath = path.join(projectRoot, 'node_modules', 'slicejs-web-framework', 'package.json');
+      // Get Framework version from project node_modules
+      const projectRoot = getProjectRoot(import.meta.url);
+      const frameworkPackagePath = path.join(projectRoot, 'node_modules', 'slicejs-web-framework', 'package.json');
       if (await fs.pathExists(frameworkPackagePath)) {
         const frameworkPackage = await fs.readJson(frameworkPackagePath);
         this.currentFrameworkVersion = frameworkPackage.version;
@@ -111,7 +111,7 @@ class VersionChecker {
 
       if (!silent && (cliStatus === 'outdated' || frameworkStatus === 'outdated')) {
         console.log(''); // Line break
-        Print.warning('📦 Available Updates:');
+        Print.warning('📦 Available Updates:');
         
         if (cliStatus === 'outdated') {
           console.log(`   🔧 CLI: ${current.cli} → ${latest.cli}`);
@@ -142,7 +142,7 @@ class VersionChecker {
     const current = await this.getCurrentVersions();
     const latest = await this.getLatestVersions();
     
-    console.log('\n📋 Version Information:');
+    console.log('\n📋 Version Information:');
     console.log('━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━');
     
     if (current?.cli) {
@@ -164,4 +164,4 @@ class VersionChecker {
 // Singleton instance
 const versionChecker = new VersionChecker();
 
-export default versionChecker;
+export default versionChecker;

package/commands/utils/bundling/BundleGenerator.js

@@ -256,7 +256,7 @@ export default class BundleGenerator {
               paths: groupData.routes,
               components: uniqueComponents,
               size: totalSize,
-              file: `slice-bundle.${groupKey}.js`
+              file: `slice-bundle.${this.routeToFileName(groupKey)}.js`
             };
 
             console.log(`✓ Bundle ${groupKey}: ${uniqueComponents.length} components, ${(totalSize / 1024).toFixed(1)} KB (${groupData.routes.length} routes)`);
@@ -313,7 +313,7 @@ export default class BundleGenerator {
         paths: routePaths,
         components: uniqueComponents,
         size: totalSize,
-        file: `slice-bundle.${category}.js`
+        file: `slice-bundle.${this.routeToFileName(category)}.js`
       };
 
       console.log(`✓ Bundle ${category}: ${uniqueComponents.length} components, ${(totalSize / 1024).toFixed(1)} KB (${routes.length} routes)`);
@@ -398,10 +398,14 @@ export default class BundleGenerator {
 
     // 2. Route bundles
     for (const [routeKey, bundle] of Object.entries(this.bundles.routes)) {
+      const routeIdentifier = Array.isArray(bundle.path || bundle.paths)
+        ? routeKey
+        : (bundle.path || bundle.paths || routeKey);
+
       const routeFile = await this.createBundleFile(
         bundle.components,
         'route',
-        bundle.path || routeKey // Use routeKey as fallback for hybrid bundles
+        routeIdentifier
       );
       files.push(routeFile);
     }
@@ -524,7 +528,7 @@ export default class BundleGenerator {
         name: comp.name,
         category: comp.category,
         categoryType: comp.categoryType,
-        js: this.cleanJavaScript(jsContent, comp.name, comp.path),
+        js: this.cleanJavaScript(jsContent, comp.name),
         externalDependencies: dependencyContents, // Files imported with import statements
         componentDependencies: Array.from(comp.dependencies), // Other components this one depends on
         html: htmlContent,
@@ -547,134 +551,29 @@ export default class BundleGenerator {
   }
 
   /**
-   * Cleans JavaScript code by processing imports and ensuring class is available globally
+   * Cleans JavaScript code by removing imports/exports and ensuring class is available globally
    */
-  cleanJavaScript(code, componentName, componentPath) {
-    let newCode = code;
-
-    // 1. In-line local imports to support data files and helpers
-    // Matches: import [clause] from '[path]'
-    const importRegex = /import\s+([\w\s{},*]+)\s+from\s+['"`]([\.\/][^'"`]+)['"`];?/g;
-    
-    newCode = newCode.replace(importRegex, (match, importClause, importPath) => {
-        try {
-            const absolutePath = path.resolve(componentPath, importPath);
-            
-            // Try different extensions if file doesn't exist
-            let finalPath = absolutePath;
-            if (!fs.existsSync(finalPath)) {
-                if (fs.existsSync(finalPath + '.js')) finalPath += '.js';
-                else if (fs.existsSync(finalPath + '.json')) finalPath += '.json';
-                else {
-                    console.warn(`BundleGenerator: Could not resolve ${importPath} in ${componentName}`);
-                    return `/* Fail: File not found ${importPath} */`; // return comment so regular import stripper deletes it
-                }
-            }
-            
-            let fileContent = fs.readFileSync(finalPath, 'utf-8');
-            
-            // Parse Import Clause
-            let defaultImport = null;
-            let namedImports = [];
-            
-            const cleanClause = importClause.trim();
-            
-            if (cleanClause.includes('{')) {
-                // Has named imports
-                const parts = cleanClause.split('{');
-                const preBrace = parts[0].trim(); // "Default, " or ""
-                const braceContent = parts[1].replace('}', '').trim(); // "A, B as C"
-                
-                if (preBrace) {
-                    defaultImport = preBrace.replace(',', '').trim();
-                }
-                
-                if (braceContent) {
-                    namedImports = braceContent.split(',').map(i => {
-                        const [name, alias] = i.split(/\s+as\s+/).map(s => s.trim());
-                        return { name, alias: alias || name };
-                    });
-                }
-            } else {
-                if (cleanClause.includes('*')) return match; // Skip namespace
-                defaultImport = cleanClause;
-            }
-
-            // Transform exported content to local variables
-            
-            // STRATEGY: 
-            // 1. Convert all 'const/let' to 'var' to allow redeclaration (resolves naming collisions)
-            // 2. Wrap exports
-            
-            // Replace const/let with var globally to prevent "Identifier already declared" errors
-            // Use a sophisticated regex that handles:
-            // - Start of line or indentation
-            // - Previous statement termination (; or })
-            // - Optional export keyword
-            fileContent = fileContent.replace(/(^|[\s;}])(export\s+)?(const|let)(?=\s+)/gm, '$1$2var');
-
-            const defaultExportName = `__default_${path.basename(finalPath, path.extname(finalPath)).replace(/\W/g, '_')}_${Math.random().toString(36).substr(2, 5)}`;
-            
-            // Handle export default
-            if (fileContent.includes('export default')) {
-                fileContent = fileContent.replace(/export\s+default\s+/g, `var ${defaultExportName} = `);
-            } else {
-                // If no export default, but we are importing default, try to find a variable with the same name
-                // This happens in legacy data files like: const data = ...; (no export default)
-                if (defaultImport) {
-                     // Check if there is a variable matching the import name in the file content
-                     const varRegex = new RegExp(`var\\s+${defaultImport}\\s*=`);
-                     if (varRegex.test(fileContent)) {
-                         // Found it, map it to our default export name for consistency
-                         fileContent += `\nvar ${defaultExportName} = ${defaultImport};\n`;
-                     }
-                }
-            }
-            
-            // Handle named exports: remove 'export' keyword
-            fileContent = fileContent.replace(/^\s*export\s+/gm, '');
-            // Also clean up export { ... } statements
-            fileContent = fileContent.replace(/^\s*export\s*\{[^}]+\};?/gm, '');
-
-            let aliasCode = '';
-            
-            // Map Default Import
-            if (defaultImport) {
-                // Use var for alias to be safe against existing variable
-                aliasCode += `if (typeof ${defaultImport} === 'undefined') { var ${defaultImport} = (typeof ${defaultExportName} !== 'undefined') ? ${defaultExportName} : undefined; }\n`;
-            }
-            
-            // Map Named Imports with Aliases
-            namedImports.forEach(({ name, alias }) => {
-                if (name !== alias) {
-                    aliasCode += `var ${alias} = ${name};\n`;
-                }
-            });
-            
-            return `/* Inlined: ${importPath} */\n${fileContent}\n${aliasCode}`;
-        } catch (e) {
-            console.warn(`Failed to inline ${importPath} in ${componentName}: ${e.message}`);
-            return `/* Error inlining ${importPath}: ${e.message} */`;
-        }
-    });
-
-    // 2. Remove any remaining import statements (non-local or failed ones)
-    newCode = newCode.replace(/^.*import\s+.*from\s+['"`].*['"`];?.*$/gm, '');
-
-    // 3. Remove export default from the component itself
-    newCode = newCode.replace(/export\s+default\s+/g, '');
-
-    // 4. Make sure the class is available globally for bundle evaluation
-    if (newCode.includes('customElements.define')) {
-      newCode = newCode.replace(/customElements\.define\([^;]+\);?\s*$/, `window.${componentName} = ${componentName};\n$&`);
+  cleanJavaScript(code, componentName) {
+    // Remove export default
+    code = code.replace(/export\s+default\s+/g, '');
+
+    // Remove imports (components will already be available)
+    code = code.replace(/import\s+.*?from\s+['"].*?['"];?\s*/g, '');
+
+    // Make sure the class is available globally for bundle evaluation
+    // Preserve original customElements.define if it exists
+    if (code.includes('customElements.define')) {
+      // Add global assignment before customElements.define
+      code = code.replace(/customElements\.define\([^;]+\);?\s*$/, `window.${componentName} = ${componentName};\n$&`);
     } else {
-      newCode += `\nwindow.${componentName} = ${componentName};`;
+      // If no customElements.define found, just assign to global
+      code += `\nwindow.${componentName} = ${componentName};`;
     }
 
-    // 5. Add return statement for bundle evaluation compatibility
-    newCode += `\nreturn ${componentName};`;
+    // Add return statement for bundle evaluation compatibility
+    code += `\nreturn ${componentName};`;
 
-    return newCode;
+    return code;
   }
 
   /**
@@ -732,9 +631,13 @@ if (window.slice && window.slice.controller) {
     };
 
     for (const [key, bundle] of Object.entries(this.bundles.routes)) {
+      const routeIdentifier = Array.isArray(bundle.path || bundle.paths)
+        ? key
+        : (bundle.path || bundle.paths || key);
+
       config.bundles.routes[key] = {
         path: bundle.path || bundle.paths || key, // Support both single path and array of paths, fallback to key
-        file: bundle.file,
+        file: `slice-bundle.${this.routeToFileName(routeIdentifier)}.js`,
         size: bundle.size,
         components: bundle.components.map(c => c.name),
         dependencies: ['critical']
@@ -832,4 +735,4 @@ if (typeof window !== 'undefined' && window.slice && window.slice.controller) {
 }
 `;
   }
-}
+}

package/commands/utils/bundling/DependencyAnalyzer.js

@@ -133,16 +133,280 @@ export default class DependencyAnalyzer {
       component.size = await this.calculateComponentSize(component.path);
 
       // Parse and extract dependencies
-      component.dependencies = await this.extractDependencies(content);
+      component.dependencies = await this.extractDependencies(content, jsFile);
     }
   }
 
   /**
    * Extracts dependencies from a component file
    */
-  async extractDependencies(code) {
+  async extractDependencies(code, componentFilePath = null) {
     const dependencies = new Set();
 
+    const resolveRoutesArray = (node, scope) => {
+      if (!node) return null;
+
+      if (node.type === 'ArrayExpression') {
+        return node;
+      }
+
+      if (node.type === 'ObjectExpression') {
+        const routesProp = node.properties.find(p => p.key?.name === 'routes');
+        if (routesProp?.value) {
+          return resolveRoutesArray(routesProp.value, scope);
+        }
+      }
+
+      if (node.type === 'Identifier' && scope) {
+        const binding = scope.getBinding(node.name);
+        if (!binding) return null;
+        const bindingNode = binding.path?.node;
+
+        if (bindingNode?.type === 'VariableDeclarator') {
+          const init = bindingNode.init;
+          if (init?.type === 'ArrayExpression') {
+            return init;
+          }
+
+          if (init?.type === 'Identifier') {
+            return resolveRoutesArray(init, binding.path.scope);
+          }
+
+          if (init?.type === 'ObjectExpression') {
+            return resolveRoutesArray(init, binding.path.scope);
+          }
+
+          if (init?.type === 'MemberExpression') {
+            return resolveRoutesArray(init, binding.path.scope);
+          }
+        }
+
+        if (bindingNode?.type === 'ImportSpecifier' || bindingNode?.type === 'ImportDefaultSpecifier') {
+          const parent = binding.path.parentPath?.node;
+          if (parent?.type === 'ImportDeclaration') {
+            const importedName = bindingNode.type === 'ImportDefaultSpecifier'
+              ? 'default'
+              : bindingNode.imported?.name;
+            const importedNode = resolveImportedValue(parent.source.value, importedName, componentFilePath);
+            return resolveRoutesArray(importedNode, null);
+          }
+        }
+      }
+
+      if (node.type === 'MemberExpression' && scope) {
+        const objectNode = resolveObjectExpression(node.object, scope);
+        if (objectNode) {
+          const propName = node.property?.name || node.property?.value;
+          if (propName) {
+            const prop = objectNode.properties.find(p => p.key?.name === propName || p.key?.value === propName);
+            if (prop?.value) {
+              return resolveRoutesArray(prop.value, scope);
+            }
+          }
+        }
+      }
+
+      return null;
+    };
+
+    const resolveObjectExpression = (node, scope) => {
+      if (!node) return null;
+      if (node.type === 'ObjectExpression') return node;
+
+      if (node.type === 'Identifier' && scope) {
+        const binding = scope.getBinding(node.name);
+        const bindingNode = binding?.path?.node;
+        if (bindingNode?.type === 'VariableDeclarator') {
+          const init = bindingNode.init;
+          if (init?.type === 'ObjectExpression') {
+            return init;
+          }
+          if (init?.type === 'Identifier') {
+            return resolveObjectExpression(init, binding.path.scope);
+          }
+        }
+
+        if (bindingNode?.type === 'ImportSpecifier' || bindingNode?.type === 'ImportDefaultSpecifier') {
+          const parent = binding.path.parentPath?.node;
+          if (parent?.type === 'ImportDeclaration') {
+            const importedName = bindingNode.type === 'ImportDefaultSpecifier'
+              ? 'default'
+              : bindingNode.imported?.name;
+            const importedNode = resolveImportedValue(parent.source.value, importedName, componentFilePath);
+            return resolveObjectExpression(importedNode, null);
+          }
+        }
+      }
+
+      return null;
+    };
+
+    const resolveStringValue = (node, scope) => {
+      if (!node) return null;
+      if (node.type === 'StringLiteral') return node.value;
+      if (node.type === 'TemplateLiteral' && node.expressions.length === 0) {
+        return node.quasis.map(q => q.value.cooked).join('');
+      }
+
+      if (node.type === 'Identifier' && scope) {
+        const binding = scope.getBinding(node.name);
+        const bindingNode = binding?.path?.node;
+        if (bindingNode?.type === 'VariableDeclarator') {
+          return resolveStringValue(bindingNode.init, binding.path.scope);
+        }
+
+        if (bindingNode?.type === 'ImportSpecifier' || bindingNode?.type === 'ImportDefaultSpecifier') {
+          const parent = binding.path.parentPath?.node;
+          if (parent?.type === 'ImportDeclaration') {
+            const importedName = bindingNode.type === 'ImportDefaultSpecifier'
+              ? 'default'
+              : bindingNode.imported?.name;
+            const importedNode = resolveImportedValue(parent.source.value, importedName, componentFilePath);
+            return resolveStringValue(importedNode, null);
+          }
+        }
+      }
+
+      if (node.type === 'MemberExpression' && scope) {
+        const objectNode = resolveObjectExpression(node.object, scope);
+        if (objectNode) {
+          const propName = node.property?.name || node.property?.value;
+          if (propName) {
+            const prop = objectNode.properties.find(p => p.key?.name === propName || p.key?.value === propName);
+            if (prop?.value) {
+              return resolveStringValue(prop.value, scope);
+            }
+          }
+        }
+      }
+
+      return null;
+    };
+
+    const resolveImportedValue = (importPath, importedName, fromFilePath) => {
+      if (!fromFilePath) return null;
+
+      const baseDir = path.dirname(fromFilePath);
+      const resolvedPath = resolveImportPath(importPath, baseDir);
+      if (!resolvedPath) {
+        console.warn(`⚠️  Cannot resolve import for MultiRoute routes: ${importPath}`);
+        return null;
+      }
+
+      const cacheKey = `${resolvedPath}:${importedName || 'default'}`;
+      if (!resolveImportedValue.cache) {
+        resolveImportedValue.cache = new Map();
+      }
+      if (resolveImportedValue.cache.has(cacheKey)) {
+        return resolveImportedValue.cache.get(cacheKey);
+      }
+
+      try {
+        const source = fs.readFileSync(resolvedPath, 'utf-8');
+        const importAst = parse(source, {
+          sourceType: 'module',
+          plugins: ['jsx']
+        });
+
+        const topLevelBindings = new Map();
+        for (const node of importAst.program.body) {
+          if (node.type === 'VariableDeclaration') {
+            node.declarations.forEach(decl => {
+              if (decl.id?.type === 'Identifier') {
+                topLevelBindings.set(decl.id.name, decl.init);
+              }
+            });
+          }
+        }
+
+        let exportNode = null;
+        for (const node of importAst.program.body) {
+          if (node.type === 'ExportDefaultDeclaration' && importedName === 'default') {
+            exportNode = node.declaration;
+            break;
+          }
+
+          if (node.type === 'ExportNamedDeclaration') {
+            if (node.declaration?.type === 'VariableDeclaration') {
+              for (const decl of node.declaration.declarations) {
+                if (decl.id?.name === importedName) {
+                  exportNode = decl.init;
+                  break;
+                }
+              }
+            }
+
+            if (!exportNode && node.specifiers?.length) {
+              const specifier = node.specifiers.find(s => s.exported?.name === importedName);
+              if (specifier && specifier.local?.name) {
+                exportNode = topLevelBindings.get(specifier.local.name) || null;
+              }
+            }
+          }
+
+          if (exportNode) break;
+        }
+
+        if (exportNode?.type === 'Identifier') {
+          exportNode = topLevelBindings.get(exportNode.name) || exportNode;
+        }
+
+        resolveImportedValue.cache.set(cacheKey, exportNode || null);
+        return exportNode || null;
+      } catch (error) {
+        console.warn(`⚠️  Error resolving import ${importPath}: ${error.message}`);
+        resolveImportedValue.cache.set(cacheKey, null);
+        return null;
+      }
+    };
+
+    const resolveImportPath = (importPath, baseDir) => {
+      if (!importPath.startsWith('.')) return null;
+
+      const resolvedBase = path.resolve(baseDir, importPath);
+      const extensions = ['.js', '.mjs', '.cjs', '.json'];
+
+      if (fs.existsSync(resolvedBase) && fs.statSync(resolvedBase).isFile()) {
+        return resolvedBase;
+      }
+
+      if (!path.extname(resolvedBase)) {
+        for (const ext of extensions) {
+          const candidate = resolvedBase + ext;
+          if (fs.existsSync(candidate)) {
+            return candidate;
+          }
+        }
+      }
+
+      return null;
+    };
+
+    const addMultiRouteDependencies = (routesArrayNode, scope) => {
+      if (!routesArrayNode || routesArrayNode.type !== 'ArrayExpression') return;
+
+      routesArrayNode.elements.forEach(routeElement => {
+        if (!routeElement) return;
+
+        if (routeElement.type === 'SpreadElement') {
+          const spreadArray = resolveRoutesArray(routeElement.argument, scope);
+          addMultiRouteDependencies(spreadArray, scope);
+          return;
+        }
+
+        const routeObject = resolveObjectExpression(routeElement, scope) || routeElement;
+        if (routeObject?.type === 'ObjectExpression') {
+          const componentProp = routeObject.properties.find(p => p.key?.name === 'component');
+          if (componentProp?.value) {
+            const componentName = resolveStringValue(componentProp.value, scope);
+            if (componentName) {
+              dependencies.add(componentName);
+            }
+          }
+        }
+      });
+    };
+
     try {
       const ast = parse(code, {
         sourceType: 'module',
@@ -168,15 +432,9 @@ export default class DependencyAnalyzer {
 
             // Extract routes from MultiRoute props
             const routesProp = args[1].properties.find(p => p.key?.name === 'routes');
-            if (routesProp?.value?.type === 'ArrayExpression') {
-              routesProp.value.elements.forEach(routeElement => {
-                if (routeElement.type === 'ObjectExpression') {
-                  const componentProp = routeElement.properties.find(p => p.key?.name === 'component');
-                  if (componentProp?.value?.type === 'StringLiteral') {
-                    dependencies.add(componentProp.value.value);
-                  }
-                }
-              });
+            if (routesProp) {
+              const routesArrayNode = resolveRoutesArray(routesProp.value, path.scope);
+              addMultiRouteDependencies(routesArrayNode);
             }
           }
           // Regular slice.build() calls
@@ -418,4 +676,4 @@ export default class DependencyAnalyzer {
       console.log(`  ${i + 1}. ${comp.name} - ${comp.routes} routes - ${(comp.size / 1024).toFixed(1)} KB`);
     });
   }
-}
+}

package/commands/utils/updateManager.js

@@ -95,7 +95,7 @@ class UpdateManager {
         }
 
         console.log('');
-        Print.warning('📦 Available Updates:');
+        Print.warning('📦 Available Updates:');
         console.log('');
 
         updateInfo.updates.forEach(pkg => {
@@ -145,17 +145,17 @@ class UpdateManager {
         const answers = await inquirer.prompt([
             {
                 type: 'checkbox',
-                name: 'packages',
-                message: 'Which packages do you want to update?',
-                choices,
-                validate: (answer) => {
-                    if (answer.length === 0) {
-                        return 'You must select at least one package';
-                    }
-                    return true;
-                }
-            }
-        ]);
+                name: 'packages',
+                message: 'Which packages do you want to update?',
+                choices,
+                validate: (answer) => {
+                    if (answer.length === 0) {
+                        return 'You must select at least one package';
+                    }
+                    return true;
+                }
+            }
+        ]);
 
         return answers.packages;
     }
@@ -229,25 +229,25 @@ class UpdateManager {
         const results = [];
 
         for (const packageName of packages) {
-            const spinner = ora(`Updating ${packageName}...`).start();
+            const spinner = ora(`Updating ${packageName}...`).start();
 
             try {
                 const result = await this.updatePackage(packageName);
 
-                if (result.success) {
-                    spinner.succeed(`${packageName} updated successfully`);
-                    results.push({ packageName, success: true });
-                } else {
-                    spinner.fail(`Error updating ${packageName}`);
-                    Print.error(`Details: ${result.error}`);
-                    results.push({ packageName, success: false, error: result.error });
-                }
-            } catch (error) {
-                spinner.fail(`Error updating ${packageName}`);
-                Print.error(`Details: ${error.message}`);
-                results.push({ packageName, success: false, error: error.message });
-            }
-        }
+                if (result.success) {
+                    spinner.succeed(`${packageName} updated successfully`);
+                    results.push({ packageName, success: true });
+                } else {
+                    spinner.fail(`Error updating ${packageName}`);
+                    Print.error(`Details: ${result.error}`);
+                    results.push({ packageName, success: false, error: result.error });
+                }
+            } catch (error) {
+                spinner.fail(`Error updating ${packageName}`);
+                Print.error(`Details: ${error.message}`);
+                results.push({ packageName, success: false, error: error.message });
+            }
+        }
 
         return results;
     }
@@ -256,26 +256,26 @@ class UpdateManager {
      * Main method to check and prompt for updates
      */
     async checkAndPromptUpdates(options = {}) {
-        const spinner = ora('Checking for updates...').start();
+        const spinner = ora('Checking for updates...').start();
 
         try {
             const updateInfo = await this.checkForUpdates();
             spinner.stop();
 
-            if (!updateInfo) {
-                Print.error('Could not check for updates. Verify your internet connection.');
-                return false;
-            }
+            if (!updateInfo) {
+                Print.error('Could not check for updates. Verify your internet connection.');
+                return false;
+            }
 
-            if (updateInfo.allCurrent) {
-                Print.success('✅ All components are up to date!');
-                return true;
-            }
+            if (updateInfo.allCurrent) {
+                Print.success('✅ All components are up to date!');
+                return true;
+            }
 
-            if (!updateInfo.hasUpdates) {
-                Print.success('✅ All components are up to date!');
-                return true;
-            }
+            if (!updateInfo.hasUpdates) {
+                Print.success('✅ All components are up to date!');
+                return true;
+            }
 
             // Display available updates
             this.displayUpdates(updateInfo);
@@ -283,20 +283,20 @@ class UpdateManager {
         // Get packages to update
         const packagesToUpdate = await this.promptForUpdates(updateInfo, options);
 
-            if (!packagesToUpdate || packagesToUpdate.length === 0) {
-                Print.info('No packages selected for update.');
-                return false;
-            }
+            if (!packagesToUpdate || packagesToUpdate.length === 0) {
+                Print.info('No packages selected for update.');
+                return false;
+            }
 
         // Show plan and confirm installation if not auto-confirmed
         let plan = await this.buildUpdatePlan(packagesToUpdate);
         console.log('');
-        Print.info('🧭 Update plan:');
-        plan.forEach(item => {
-            const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
-            console.log(`   • ${item.package} → ${where}`);
-            console.log(`     ${item.command}`);
-        });
+        Print.info('🧭 Update plan:');
+        plan.forEach(item => {
+            const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
+            console.log(`   • ${item.package} → ${where}`);
+            console.log(`     ${item.command}`);
+        });
         console.log('');
 
         const cliInfo = await this.detectCliInstall();
@@ -306,47 +306,47 @@ class UpdateManager {
                     {
                         type: 'confirm',
                         name: 'addCli',
-                    message: 'Global CLI detected. Add the global CLI update to the plan?',
-                    default: true
-                }
-            ]);
+                    message: 'Global CLI detected. Add the global CLI update to the plan?',
+                    default: true
+                }
+            ]);
                 if (addCli) {
                     packagesToUpdate.push('slicejs-cli');
                     plan = await this.buildUpdatePlan(packagesToUpdate);
                     console.log('');
-                    Print.info('🧭 Updated plan:');
-                    plan.forEach(item => {
-                        const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
-                        console.log(`   • ${item.package} → ${where}`);
-                        console.log(`     ${item.command}`);
-                    });
+                    Print.info('🧭 Updated plan:');
+                    plan.forEach(item => {
+                        const where = item.target === 'global' ? 'GLOBAL' : 'PROJECT';
+                        console.log(`   • ${item.package} → ${where}`);
+                        console.log(`     ${item.command}`);
+                    });
                     console.log('');
                 }
             } else {
-                Print.warning('Global CLI detected. It is recommended to update slicejs-cli globally to keep aligned with the framework.');
-                console.log('   Suggestion: npm install -g slicejs-cli@latest');
-                console.log('');
-            }
-        }
+                Print.warning('Global CLI detected. It is recommended to update slicejs-cli globally to keep aligned with the framework.');
+                console.log('   Suggestion: npm install -g slicejs-cli@latest');
+                console.log('');
+            }
+        }
 
         if (!options.yes && !options.cli && !options.framework) {
             const { confirm } = await inquirer.prompt([
-                {
-                    type: 'confirm',
-                    name: 'confirm',
-                    message: 'Do you want to proceed with the update according to the plan shown?',
-                    default: true
-                }
-            ]);
+                {
+                    type: 'confirm',
+                    name: 'confirm',
+                    message: 'Do you want to proceed with the update according to the plan shown?',
+                    default: true
+                }
+            ]);
 
                 if (!confirm) {
-                    Print.info('Update cancelled.');
-                    return false;
-                }
-            }
+                    Print.info('Update cancelled.');
+                    return false;
+                }
+            }
 
             console.log(''); // Line break
-            Print.info('📥 Installing updates...');
+            Print.info('📥 Installing updates...');
             console.log('');
 
             // Install updates
@@ -357,24 +357,24 @@ class UpdateManager {
             const successCount = results.filter(r => r.success).length;
             const failCount = results.filter(r => !r.success).length;
 
-            if (failCount === 0) {
-                Print.success(`✅ ${successCount} package(s) updated successfully!`);
-            } else {
-                Print.warning(`⚠️  ${successCount} successful, ${failCount} failed`);
-            }
+            if (failCount === 0) {
+                Print.success(`✅ ${successCount} package(s) updated successfully!`);
+            } else {
+                Print.warning(`⚠️  ${successCount} successful, ${failCount} failed`);
+            }
 
             if (successCount > 0) {
                 console.log('');
-                Print.info('💡 It is recommended to restart the development server if it is running.');
-            }
+                Print.info('💡 It is recommended to restart the development server if it is running.');
+            }
 
             return failCount === 0;
 
         } catch (error) {
             spinner.stop();
-            Print.error(`Error during update: ${error.message}`);
-            return false;
-        }
+            Print.error(`Error during update: ${error.message}`);
+            return false;
+        }
     }
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "slicejs-cli",
-  "version": "2.8.0",
+  "version": "2.8.2",
   "description": "Command client for developing web applications with Slice.js framework",
   "main": "client.js",
   "bin": {