slicejs-cli 2.7.1 → 2.7.4

package/README.md

@@ -1,16 +1,29 @@
+<div align="center">
+
 # Slice.js CLI
+<img src="./assets/Slice.js-logo.png" alt="Slice.js logo" width="200" />
+<br/>
+
+<div style="display: flex; justify-content: center; align-items: center; gap: 10px; align-content: center;">
+<a href="https://www.npmjs.com/package/slicejs-cli"><img src="https://img.shields.io/npm/v/slicejs-cli.svg?label=CLI" alt="npm version" /></a>
+<img src="https://img.shields.io/badge/Node-%E2%89%A5%2020.0.0-339933?logo=node.js" alt="node requirement" />
+<a href="#license"><img src="https://img.shields.io/badge/License-ISC-blue.svg" alt="license" /></a>
+</div>
+
 
-Command-line interface for developing web applications with the Slice.js framework.
+<p>CLI for building web applications with the Slice.js framework</p>
+
+</div>
 
 ## Installation
 
-### Local Installation (Recommended)
+- Local (recommended):
 
 ```bash
 npm install slicejs-cli --save-dev
 ```
 
-### Global Installation
+- Global:
 
 ```bash
 npm install -g slicejs-cli
@@ -24,108 +37,104 @@ After installation, you can use the `slice` command directly:
 slice [command] [options]
 ```
 
-Or with npx (no installation required):
+Or with npx (without global install):
 
 ```bash
 npx slicejs-cli [command]
 ```
 
-## Commands
+## Essential Commands
 
-### Project Initialization
+### Initialize a project
 
 ```bash
 slice init
 ```
 
-Initializes a new Slice.js project with the complete framework structure.
+Initializes a Slice.js project with the full structure (`src/` and `api/`), installs initial Visual components, and configures npm scripts.
 
-### Development Server
+### Development server
 
 ```bash
-# Start development server on default port (3000)
+# Default port (3000)
 slice dev
 
-# Start on custom port
+# Custom port
 slice dev -p 8080
 
-# Alternative command (same as dev)
+# Alias
 slice start
 slice start -p 8080
 ```
 
-### Component Management (Local)
+### Component management (local)
 
 ```bash
-# Create a new component (interactive)
+# Create a component (interactive)
 slice component create
 
-# List all local components
+# List local components
 slice component list
 
 # Delete a component (interactive)
 slice component delete
 ```
 
-**Shortcuts:**
+Shortcuts:
 ```bash
-slice component create → slice comp create
-slice component list   → slice comp ls
-slice component delete → slice comp remove
+slice comp create
+slice comp ls
+slice comp remove
 ```
 
-### Component Registry (Official Repository)
+### Official component registry
 
 ```bash
-# Install components from official repository
+# Install Visual components
 slice get Button Card Input
 
-# Install service component
+# Install a Service component
 slice get FetchManager --service
 
-# Force overwrite existing components
+# Force overwrite
 slice get Button --force
 
 # Browse available components
 slice browse
 
-# Update all local components to latest versions
+# Update all local components
 slice sync
-
-# Force update without confirmation
 slice sync --force
 ```
 
-**Shortcuts:**
+Shortcuts:
 ```bash
-slice registry get Button → slice get Button
-slice registry list       → slice browse
-slice registry sync       → slice sync
+slice get Button
+slice browse
+slice sync
 ```
 
 ### Utilities
 
 ```bash
-# Show version information
+# Version info
 slice version
 slice -v
 
-# Update CLI and Framework
-slice update              # Check and prompt for updates
-slice update --yes        # Update all automatically
-slice update --cli        # Update only CLI
-slice update --framework  # Update only Framework
+# Updates (CLI and Framework)
+slice update              # Check and prompt to update
+slice update --yes        # Update everything automatically
+slice update --cli        # CLI only
+slice update --framework  # Framework only
 
-# Show help
+# Help
 slice --help
 slice [command] --help
 ```
 
-## NPM Scripts
-
-When you install `slicejs-cli`, the following scripts are automatically added to your project's `package.json`:
+## npm Scripts
 
-### Recommended (New)
+`slice init` automatically configures the recommended scripts in your `package.json`:
 
 ```json
 {
@@ -149,18 +158,6 @@ npm run get
 npm run browse
 ```
 
-### Legacy (Still Supported)
-
-```json
-{
-  "scripts": {
-    "slice:dev": "slice dev",
-    "slice:start": "slice start",
-    "slice:get": "slice get"
-  }
-}
-```
-
 ## Quick Start
 
 ```bash
@@ -215,11 +212,11 @@ slice sync
 
 ## Development Mode
 
-The development server (`slice dev` or `slice start`) provides:
+The development server (`slice dev` / `slice start`) provides:
 
-- ✅ Hot reload for instant changes
-- ✅ Serves files directly from `/src`
-- ✅ No build step required
+- ✅ Hot reload
+- ✅ Serves directly from `/src`
+- ✅ No build step
 - ✅ Port validation
 - ✅ Clear error messages
 
@@ -230,35 +227,46 @@ The development server (`slice dev` or `slice start`) provides:
 
 ## Configuration
 
-Project configuration is stored in `src/sliceConfig.json`, created automatically during `slice init`.
+Project configuration is stored in `src/sliceConfig.json` and is created automatically by `slice init`.
 
 ## Features
 
-- 🚀 Fast development server with hot reload
-- 📦 Component registry for sharing components
+- 🚀 Development server with hot reload
+- 📦 Official component registry
 - 🎨 Visual and Service component types
 - ✨ Interactive component creation
 - 🔄 Automatic component synchronization
 - 🛠️ Built-in validation and error handling
-- 📝 Clear, actionable error messages
+
+### Smart Updates
+
+- Detects whether the CLI in use is global or local
+- Shows an update plan (GLOBAL/PROJECT) before execution
+- Offers to include global CLI update interactively
+- Applies `uninstall` + `install @latest` to ensure latest versions
+
+### Cross-platform Paths
+
+- Centralized path helper avoids `../../..`
+- Windows/Linux/Mac compatibility using `import.meta.url` and `fileURLToPath`
 
 ## Troubleshooting
 
-### Port Already in Use
+### Port already in use
 
 ```bash
 # Use a different port
 slice dev -p 8080
 ```
 
-### Project Not Initialized
+### Project not initialized
 
 ```bash
 # Make sure to run init first
 slice init
 ```
 
-### Command Not Found
+### Command not found
 
 ```bash
 # Use npx if not installed globally

package/client.js

@@ -13,7 +13,9 @@ import updateManager from "./commands/utils/updateManager.js";
 import fs from "fs";
 import path from "path";
 import { fileURLToPath } from "url";
-import { getConfigPath } from "./commands/utils/PathHelper.js";
+import { getConfigPath, getProjectRoot } from "./commands/utils/PathHelper.js";
+import { exec } from "child_process";
+import { promisify } from "util";
 import validations from "./commands/Validations.js";
 import Print from "./commands/Print.js";
 
@@ -24,8 +26,7 @@ const loadConfig = () => {
     const configPath = getConfigPath(import.meta.url);
     const rawData = fs.readFileSync(configPath, "utf-8");
     return JSON.parse(rawData);
-  } catch (error) {
-    Print.error(`Loading configuration: ${error.message}`);
+  } catch {
     return null;
   }
 };
@@ -38,6 +39,49 @@ const getCategories = () => {
 // Function to run version check for all commands
 async function runWithVersionCheck(commandFunction, ...args) {
   try {
+    const execAsync = promisify(exec);
+    await (async () => {
+      try {
+        const info = await updateManager.detectCliInstall();
+        if (info && info.type === 'global') {
+          const projectRoot = getProjectRoot(import.meta.url);
+          const pkgPath = path.join(projectRoot, 'package.json');
+          let hasPkg = fs.existsSync(pkgPath);
+          if (!hasPkg) {
+            const { confirmInit } = await inquirer.prompt([
+              {
+                type: 'confirm',
+                name: 'confirmInit',
+                message: 'No package.json found. Initialize npm in this project now?',
+                default: true
+              }
+            ]);
+            if (confirmInit) {
+              await execAsync('npm init -y', { cwd: projectRoot });
+              hasPkg = true;
+            }
+          }
+          if (hasPkg) {
+            const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+            const hasFramework = pkg.dependencies?.['slicejs-web-framework'];
+            if (!hasFramework) {
+              const { confirm } = await inquirer.prompt([
+                {
+                  type: 'confirm',
+                  name: 'confirm',
+                  message: 'slicejs-web-framework is not installed in this project. Install it now?',
+                  default: true
+                }
+              ]);
+              if (confirm) {
+                await updateManager.updatePackage('slicejs-web-framework');
+              }
+            }
+          }
+        }
+      } catch {}
+    })();
+
     const updateInfo = await updateManager.checkForUpdates();
     if (updateInfo && updateInfo.hasUpdates) {
       await updateManager.checkAndPromptUpdates({});
@@ -58,7 +102,14 @@ async function runWithVersionCheck(commandFunction, ...args) {
 
 const sliceClient = program;
 
-sliceClient.version("2.6.1").description("CLI for managing Slice.js framework components");
+try {
+  const pkgPath = path.join(__dirname, "./package.json");
+  const pkgRaw = fs.readFileSync(pkgPath, "utf-8");
+  const pkg = JSON.parse(pkgRaw);
+  sliceClient.version(pkg.version).description("CLI for managing Slice.js framework components");
+} catch {
+  sliceClient.version("0.0.0").description("CLI for managing Slice.js framework components");
+}
 
 // INIT COMMAND
 sliceClient

package/commands/doctor/doctor.js

@@ -5,6 +5,9 @@ import { createServer } from 'net';
 import chalk from 'chalk';
 import Table from 'cli-table3';
 import Print from '../Print.js';
+import inquirer from 'inquirer';
+import { exec } from 'child_process';
+import { promisify } from 'util';
 import { getProjectRoot, getSrcPath, getApiPath, getConfigPath, getPath } from '../utils/PathHelper.js';
 
 const __dirname = path.dirname(fileURLToPath(import.meta.url));
@@ -173,7 +176,10 @@ async function checkDependencies() {
             return {
                 warn: true,
                 message: `Missing dependencies: ${missing.join(', ')}`,
-                suggestion: 'Run "npm install"'
+                suggestion: missing.includes('slicejs-web-framework')
+                    ? 'Run "npm install slicejs-web-framework@latest" in your project'
+                    : 'Run "npm install -D slicejs-cli@latest" in your project',
+                missing
             };
         }
     } catch (error) {
@@ -313,6 +319,34 @@ export default async function runDiagnostics() {
     Print.newLine();
     Print.separator();
 
+    const depsResult = results.find(r => r.name === 'Dependencies');
+    if (depsResult && depsResult.warn && Array.isArray(depsResult.missing) && depsResult.missing.length > 0) {
+        const projectRoot = getProjectRoot(import.meta.url);
+        const execAsync = promisify(exec);
+        const { confirmInstall } = await inquirer.prompt([
+            {
+                type: 'confirm',
+                name: 'confirmInstall',
+                message: `Install missing dependencies in this project now? (${depsResult.missing.join(', ')})`,
+                default: true
+            }
+        ]);
+        if (confirmInstall) {
+            for (const pkg of depsResult.missing) {
+                try {
+                    const cmd = pkg === 'slicejs-cli'
+                        ? 'npm install -D slicejs-cli@latest'
+                        : 'npm install slicejs-web-framework@latest';
+                    Print.info(`Installing ${pkg}...`);
+                    await execAsync(cmd, { cwd: projectRoot });
+                    Print.success(`${pkg} installed`);
+                } catch (e) {
+                    Print.error(`Installing ${pkg}: ${e.message}`);
+                }
+            }
+        }
+    }
+
     if (issues === 0 && warnings === 0) {
         Print.success('All checks passed! 🎉');
         Print.info('Your Slice.js project is correctly configured');

package/commands/utils/updateManager.js

@@ -184,13 +184,15 @@ class UpdateManager {
      */
     async updatePackage(packageName) {
         try {
-            let command = `npm install ${packageName}@latest`;
+            let installCmd = `npm install ${packageName}@latest`;
+            let uninstallCmd = `npm uninstall ${packageName}`;
             let options = {};
 
             if (packageName === 'slicejs-cli') {
                 const info = await this.detectCliInstall();
                 if (info.type === 'global') {
-                    command = `npm install -g slicejs-cli@latest`;
+                    installCmd = `npm install -g slicejs-cli@latest`;
+                    uninstallCmd = `npm uninstall -g slicejs-cli`;
                 } else {
                     options.cwd = info.projectRoot || getProjectRoot(import.meta.url);
                 }
@@ -198,7 +200,12 @@ class UpdateManager {
                 options.cwd = getProjectRoot(import.meta.url);
             }
 
-            const { stdout, stderr } = await execAsync(command, options);
+            // Try uninstall first (ignore failure)
+            try {
+                await execAsync(uninstallCmd, options);
+            } catch {}
+
+            const { stdout, stderr } = await execAsync(installCmd, options);
 
             return {
                 success: true,

package/package.json

@@ -1,11 +1,15 @@
 {
   "name": "slicejs-cli",
-  "version": "2.7.1",
+  "version": "2.7.4",
   "description": "Command client for developing web applications with Slice.js framework",
   "main": "client.js",
   "bin": {
     "slice": "./client.js"
   },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/vkneider/slicejs-cli.git"
+  },
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
     "postinstall": "node post.js"

package/post.js

@@ -12,14 +12,14 @@ const targetRoot = initCwd || path.resolve(__dirname, '../../');
 const projectPackageJsonPath = path.join(targetRoot, 'package.json');
 
 if (isGlobal) {
-    console.log('ℹ️  Instalación global detectada de slicejs-cli.');
-    console.log('   Omite configuración de scripts. Usa el binario directamente:');
+    console.log('ℹ️  Global installation of slicejs-cli detected.');
+    console.log('   Skipping scripts setup. Use the binary directly:');
     console.log('     slice dev');
     console.log('     slice get Button');
     process.exit(0);
 }
 
-console.log('ℹ️  Instalación local detectada de slicejs-cli.');
-console.log('   Se omite configuración automática de scripts en postinstall.');
-console.log('   Usa "slice init" para configurar los scripts del proyecto.');
+console.log('ℹ️  Local installation of slicejs-cli detected.');
+console.log('   Skipping automatic scripts setup in postinstall.');
+console.log('   Use "slice init" to configure project scripts.');
 process.exit(0);