tailjng 0.1.4 → 0.1.6

package/README.md

@@ -44,7 +44,7 @@ El CLI instala **dependencias transitivas** automáticamente (ej. `button` → `
 - Angular **19.2+** (19.x dentro del mismo major; no Angular 20/21 aún)
 - Tailwind CSS **4.x** (incluido si eliges Tailwind al crear el proyecto con `ng new`)
 -{
-- Peers: `lucide-angular`, `date-fns`, `exceljs`, `xlsx`, `file-saver` (el CLI los instala con `init:app` si faltan)
+- Peers: `lucide-angular`, `date-fns`, `exceljs`, `file-saver` (el CLI los instala con `init:app` si faltan)
 - Estilos globales en **CSS o SCSS** — `init:app` detecta cuál usa tu app
 
 ---

package/cli/execute/init-app.js

@@ -170,7 +170,6 @@ async function runInitApp() {
     installPackages(workspaceRoot, missingDev, true);
   }
 
-  const { appRoot } = resolveAppPaths(workspaceRoot, selectedApp);
   ensureProjectColorsConfig(workspaceRoot, appRoot, overwrite);
 
   const hasAppConfig = fileExists(appConfigPath);

package/cli/execute/sync-app.js

@@ -1,192 +1,192 @@
-const fs = require('fs');
-const path = require('path');
-const { COLORS } = require('../settings/colors');
-const { RUNTIME_PACKAGES, DEV_PACKAGES, installPackages } = require('../settings/init-packages');
-const { buildPathsJson, buildPathsReadme } = require('../templates/app.generator');
-const {
-  findAngularWorkspace,
-  readJson,
-  getApplicationProjects,
-  resolveAppPaths,
-  getBuildOptions,
-  detectStyleLanguage,
-  getPrimaryStyleEntry,
-  writeFileSafe,
-  ensureTailjngStylesInAngularJson,
-  patchIndexHtml,
-  patchAppConfig,
-  getMissingPackages,
-  resolveRuntimePackages,
-  resolveDevPackages,
-  hasTailwindSetup,
-  getTailjngSafelistCssImport,
-  ensureTailjngSafelistImport,
-  alignAngularAnimationsInPackageJson,
-  resolveStyleFilePath,
-  fileExists,
-} = require('../settings/project-utils');
-const {
-  ensureProjectColorsConfig,
-  patchAppConfigColors,
-  COLORS_FILES,
-} = require('../settings/colors-config-utils');
-
-function resolveTargetPath(workspaceRoot, appProject, relativePath, appRootRelative = false) {
-  const appRoot = path.join(workspaceRoot, appProject.root || '');
-
-  if (appRootRelative) {
-    return path.join(appRoot, relativePath);
-  }
-
-  if (relativePath.startsWith('projects/')) {
-    return path.join(workspaceRoot, relativePath);
-  }
-
-  return path.join(workspaceRoot, appProject.sourceRoot, relativePath.replace(/^src\//, ''));
-}
-
-async function runSyncApp() {
-  const workspace = findAngularWorkspace(process.cwd());
-
-  if (!workspace) {
-    console.error(`${COLORS.red}[tailjng CLI] ERROR: angular.json not found. Run this inside an Angular project.${COLORS.reset}`);
-    process.exit(1);
-  }
-
-  const { workspaceRoot, angularJsonPath } = workspace;
-  const angularJson = readJson(angularJsonPath);
-  const apps = getApplicationProjects(angularJson);
-
-  if (apps.length === 0) {
-    console.error(`${COLORS.red}[tailjng CLI] ERROR: No application project found in angular.json.${COLORS.reset}`);
-    process.exit(1);
-  }
-
-  const selectedApp = apps[0];
-  const { appRoot, srcRoot } = resolveAppPaths(workspaceRoot, selectedApp);
-  const buildOptions = getBuildOptions(angularJson, selectedApp.name);
-  const styleLanguage = detectStyleLanguage(buildOptions);
-  const primaryStylePath = getPrimaryStyleEntry(buildOptions);
-  const primaryStyleFullPath = resolveStyleFilePath(workspaceRoot, primaryStylePath, selectedApp);
-  const indexPath = path.join(workspaceRoot, buildOptions.index || path.join(selectedApp.sourceRoot, 'index.html'));
-  const appConfigPath = path.join(srcRoot, 'app', 'app.config.ts');
-  const packageJsonPath = path.join(workspaceRoot, 'package.json');
-  const packageJson = fileExists(packageJsonPath) ? readJson(packageJsonPath) : { dependencies: {}, devDependencies: {} };
-  const tailwindReady = hasTailwindSetup(workspaceRoot, packageJson, primaryStylePath);
-  const installDeps = !process.argv.includes('--no-install');
-  const componentsPath = 'src/app/tailjng';
-
-  console.log(`\n${COLORS.bright}${COLORS.blue}[tailjng CLI] sync:app${COLORS.reset}`);
-  console.log(`${COLORS.dim}Updates integration only — does not overwrite your config (environment, providers, styles).${COLORS.reset}`);
-  console.log(`${COLORS.dim}Workspace: ${workspaceRoot} | App: ${selectedApp.name}${COLORS.reset}\n`);
-
-  if (!packageJson.dependencies?.tailjng) {
-    console.log(`${COLORS.yellow}[tailjng CLI] WARNING: tailjng is not in package.json. Run: npm install tailjng@latest --legacy-peer-deps${COLORS.reset}`);
-  }
-
-  let changes = 0;
-
-  const animationsAligned = alignAngularAnimationsInPackageJson(workspaceRoot);
-  if (animationsAligned.changed) {
-    changes += 1;
-    console.log(`${COLORS.green}✔ Aligned @angular/animations → ${animationsAligned.version}${COLORS.reset}`);
-    Object.assign(packageJson, readJson(packageJsonPath));
-  }
-
-  if (installDeps) {
-    const runtimePackages = resolveRuntimePackages(packageJson, RUNTIME_PACKAGES, workspaceRoot);
-    const devPackages = resolveDevPackages(packageJson, DEV_PACKAGES, tailwindReady);
-    const missingRuntime = Object.fromEntries(getMissingPackages(packageJson, runtimePackages, workspaceRoot));
-    const missingDev = Object.fromEntries(getMissingPackages(packageJson, devPackages, workspaceRoot));
-
-    if (Object.keys(missingRuntime).length > 0) {
-      installPackages(workspaceRoot, missingRuntime, false);
-      changes += 1;
-      console.log(`${COLORS.green}✔ Installed missing runtime packages${COLORS.reset}`);
-    }
-
-    if (Object.keys(missingDev).length > 0) {
-      installPackages(workspaceRoot, missingDev, true);
-      changes += 1;
-      console.log(`${COLORS.green}✔ Installed missing dev packages${COLORS.reset}`);
-    }
-
-    if (Object.keys(missingRuntime).length === 0 && Object.keys(missingDev).length === 0) {
-      console.log(`${COLORS.dim}↷ Dependencies already satisfied${COLORS.reset}`);
-    }
-  } else {
-    console.log(`${COLORS.dim}↷ Skipped dependency install (--no-install)${COLORS.reset}`);
-  }
-
-  const pathsJsonPath = resolveTargetPath(workspaceRoot, selectedApp, '.tailjng/paths.json', true);
-  if (writeFileSafe(pathsJsonPath, buildPathsJson(componentsPath), false)) {
-    changes += 1;
-    console.log(`${COLORS.green}✔ Created ${path.relative(workspaceRoot, pathsJsonPath)}${COLORS.reset}`);
-  }
-
-  const pathsReadmePath = resolveTargetPath(workspaceRoot, selectedApp, '.tailjng/README.md', true);
-  if (writeFileSafe(pathsReadmePath, buildPathsReadme(), false)) {
-    changes += 1;
-    console.log(`${COLORS.green}✔ Created ${path.relative(workspaceRoot, pathsReadmePath)}${COLORS.reset}`);
-  }
-
-  const colorsResult = ensureProjectColorsConfig(workspaceRoot, appRoot, false);
-  if (colorsResult.created > 0) {
-    changes += colorsResult.created;
-  } else if (colorsResult.skipped === COLORS_FILES.length) {
-    console.log(`${COLORS.dim}↷ Project colors config already present${COLORS.reset}`);
-  }
-
-  const safelistImport = getTailjngSafelistCssImport(workspaceRoot, primaryStylePath, selectedApp);
-  const safelistPatched = ensureTailjngSafelistImport(primaryStyleFullPath, safelistImport);
-  if (safelistPatched.changed) {
-    changes += 1;
-    const label = safelistPatched.migrated
-      ? 'Migrated colors safelist to project folder'
-      : 'Added tailjng colors safelist';
-    console.log(`${COLORS.green}✔ ${label} → ${path.relative(workspaceRoot, primaryStyleFullPath)}${COLORS.reset}`);
-  } else {
-    console.log(`${COLORS.dim}↷ Colors safelist already in styles${COLORS.reset}`);
-  }
-
-  const stylesPatched = ensureTailjngStylesInAngularJson(angularJsonPath, selectedApp.name, styleLanguage);
-  if (stylesPatched.changed) {
-    changes += 1;
-    console.log(`${COLORS.green}✔ Added node_modules/tailjng/src/styles.css to angular.json${COLORS.reset}`);
-  } else {
-    console.log(`${COLORS.dim}↷ tailjng styles already in angular.json${COLORS.reset}`);
-  }
-
-  if (fileExists(appConfigPath)) {
-    const patched = patchAppConfig(appConfigPath);
-    if (patched.changed) {
-      changes += 1;
-      console.log(`${COLORS.green}✔ Patched app.config.ts (added tailjngProviders)${COLORS.reset}`);
-    }
-
-    const colorsPatched = patchAppConfigColors(appConfigPath, srcRoot);
-    if (colorsPatched.changed) {
-      changes += 1;
-      console.log(`${COLORS.green}✔ Linked tailjngColorsProvider from src/app/tailjng/colors/${COLORS.reset}`);
-    }
-  }
-
-  if (patchIndexHtml(indexPath)) {
-    changes += 1;
-    console.log(`${COLORS.green}✔ Patched index.html (body classes)${COLORS.reset}`);
-  }
-
-  console.log(`\n${COLORS.greenBright}${COLORS.bright}[tailjng CLI] sync:app completed.${COLORS.reset}`);
-  console.log(`${COLORS.dim}Changes applied: ${changes}${COLORS.reset}`);
-
-  if (changes === 0) {
-    console.log(`${COLORS.cyan}Project already up to date with this tailjng version.${COLORS.reset}`);
-  }
-
-  console.log(`\n${COLORS.dim}Tip: update UI components with ${COLORS.cyan}npx tailjng add <name>${COLORS.reset}${COLORS.dim} (asks before overwrite).${COLORS.reset}\n`);
-}
-
-runSyncApp().catch((error) => {
-  console.error(`${COLORS.red}[tailjng CLI] sync:app failed:${COLORS.reset}`, error);
-  process.exit(1);
-});
+const fs = require('fs');
+const path = require('path');
+const { COLORS } = require('../settings/colors');
+const { RUNTIME_PACKAGES, DEV_PACKAGES, installPackages } = require('../settings/init-packages');
+const { buildPathsJson, buildPathsReadme } = require('../templates/app.generator');
+const {
+  findAngularWorkspace,
+  readJson,
+  getApplicationProjects,
+  resolveAppPaths,
+  getBuildOptions,
+  detectStyleLanguage,
+  getPrimaryStyleEntry,
+  writeFileSafe,
+  ensureTailjngStylesInAngularJson,
+  patchIndexHtml,
+  patchAppConfig,
+  getMissingPackages,
+  resolveRuntimePackages,
+  resolveDevPackages,
+  hasTailwindSetup,
+  getTailjngSafelistCssImport,
+  ensureTailjngSafelistImport,
+  alignAngularAnimationsInPackageJson,
+  resolveStyleFilePath,
+  fileExists,
+} = require('../settings/project-utils');
+const {
+  ensureProjectColorsConfig,
+  patchAppConfigColors,
+  COLORS_FILES,
+} = require('../settings/colors-config-utils');
+
+function resolveTargetPath(workspaceRoot, appProject, relativePath, appRootRelative = false) {
+  const appRoot = path.join(workspaceRoot, appProject.root || '');
+
+  if (appRootRelative) {
+    return path.join(appRoot, relativePath);
+  }
+
+  if (relativePath.startsWith('projects/')) {
+    return path.join(workspaceRoot, relativePath);
+  }
+
+  return path.join(workspaceRoot, appProject.sourceRoot, relativePath.replace(/^src\//, ''));
+}
+
+async function runSyncApp() {
+  const workspace = findAngularWorkspace(process.cwd());
+
+  if (!workspace) {
+    console.error(`${COLORS.red}[tailjng CLI] ERROR: angular.json not found. Run this inside an Angular project.${COLORS.reset}`);
+    process.exit(1);
+  }
+
+  const { workspaceRoot, angularJsonPath } = workspace;
+  const angularJson = readJson(angularJsonPath);
+  const apps = getApplicationProjects(angularJson);
+
+  if (apps.length === 0) {
+    console.error(`${COLORS.red}[tailjng CLI] ERROR: No application project found in angular.json.${COLORS.reset}`);
+    process.exit(1);
+  }
+
+  const selectedApp = apps[0];
+  const { appRoot, srcRoot } = resolveAppPaths(workspaceRoot, selectedApp);
+  const buildOptions = getBuildOptions(angularJson, selectedApp.name);
+  const styleLanguage = detectStyleLanguage(buildOptions);
+  const primaryStylePath = getPrimaryStyleEntry(buildOptions);
+  const primaryStyleFullPath = resolveStyleFilePath(workspaceRoot, primaryStylePath, selectedApp);
+  const indexPath = path.join(workspaceRoot, buildOptions.index || path.join(selectedApp.sourceRoot, 'index.html'));
+  const appConfigPath = path.join(srcRoot, 'app', 'app.config.ts');
+  const packageJsonPath = path.join(workspaceRoot, 'package.json');
+  const packageJson = fileExists(packageJsonPath) ? readJson(packageJsonPath) : { dependencies: {}, devDependencies: {} };
+  const tailwindReady = hasTailwindSetup(workspaceRoot, packageJson, primaryStylePath);
+  const installDeps = !process.argv.includes('--no-install');
+  const componentsPath = 'src/app/tailjng';
+
+  console.log(`\n${COLORS.bright}${COLORS.blue}[tailjng CLI] sync:app${COLORS.reset}`);
+  console.log(`${COLORS.dim}Updates integration only — does not overwrite your config (environment, providers, styles).${COLORS.reset}`);
+  console.log(`${COLORS.dim}Workspace: ${workspaceRoot} | App: ${selectedApp.name}${COLORS.reset}\n`);
+
+  if (!packageJson.dependencies?.tailjng) {
+    console.log(`${COLORS.yellow}[tailjng CLI] WARNING: tailjng is not in package.json. Run: npm install tailjng@latest --legacy-peer-deps${COLORS.reset}`);
+  }
+
+  let changes = 0;
+
+  const animationsAligned = alignAngularAnimationsInPackageJson(workspaceRoot);
+  if (animationsAligned.changed) {
+    changes += 1;
+    console.log(`${COLORS.green}✔ Aligned @angular/animations → ${animationsAligned.version}${COLORS.reset}`);
+    Object.assign(packageJson, readJson(packageJsonPath));
+  }
+
+  if (installDeps) {
+    const runtimePackages = resolveRuntimePackages(packageJson, RUNTIME_PACKAGES, workspaceRoot);
+    const devPackages = resolveDevPackages(packageJson, DEV_PACKAGES, tailwindReady);
+    const missingRuntime = Object.fromEntries(getMissingPackages(packageJson, runtimePackages, workspaceRoot));
+    const missingDev = Object.fromEntries(getMissingPackages(packageJson, devPackages, workspaceRoot));
+
+    if (Object.keys(missingRuntime).length > 0) {
+      installPackages(workspaceRoot, missingRuntime, false);
+      changes += 1;
+      console.log(`${COLORS.green}✔ Installed missing runtime packages${COLORS.reset}`);
+    }
+
+    if (Object.keys(missingDev).length > 0) {
+      installPackages(workspaceRoot, missingDev, true);
+      changes += 1;
+      console.log(`${COLORS.green}✔ Installed missing dev packages${COLORS.reset}`);
+    }
+
+    if (Object.keys(missingRuntime).length === 0 && Object.keys(missingDev).length === 0) {
+      console.log(`${COLORS.dim}↷ Dependencies already satisfied${COLORS.reset}`);
+    }
+  } else {
+    console.log(`${COLORS.dim}↷ Skipped dependency install (--no-install)${COLORS.reset}`);
+  }
+
+  const pathsJsonPath = resolveTargetPath(workspaceRoot, selectedApp, '.tailjng/paths.json', true);
+  if (writeFileSafe(pathsJsonPath, buildPathsJson(componentsPath), false)) {
+    changes += 1;
+    console.log(`${COLORS.green}✔ Created ${path.relative(workspaceRoot, pathsJsonPath)}${COLORS.reset}`);
+  }
+
+  const pathsReadmePath = resolveTargetPath(workspaceRoot, selectedApp, '.tailjng/README.md', true);
+  if (writeFileSafe(pathsReadmePath, buildPathsReadme(), false)) {
+    changes += 1;
+    console.log(`${COLORS.green}✔ Created ${path.relative(workspaceRoot, pathsReadmePath)}${COLORS.reset}`);
+  }
+
+  const colorsResult = ensureProjectColorsConfig(workspaceRoot, appRoot, false);
+  if (colorsResult.created > 0) {
+    changes += colorsResult.created;
+  } else if (colorsResult.skipped === COLORS_FILES.length) {
+    console.log(`${COLORS.dim}↷ Project colors config already present${COLORS.reset}`);
+  }
+
+  const safelistImport = getTailjngSafelistCssImport(workspaceRoot, primaryStylePath, selectedApp);
+  const safelistPatched = ensureTailjngSafelistImport(primaryStyleFullPath, safelistImport);
+  if (safelistPatched.changed) {
+    changes += 1;
+    const label = safelistPatched.migrated
+      ? 'Migrated colors safelist to project folder'
+      : 'Added tailjng colors safelist';
+    console.log(`${COLORS.green}✔ ${label} → ${path.relative(workspaceRoot, primaryStyleFullPath)}${COLORS.reset}`);
+  } else {
+    console.log(`${COLORS.dim}↷ Colors safelist already in styles${COLORS.reset}`);
+  }
+
+  const stylesPatched = ensureTailjngStylesInAngularJson(angularJsonPath, selectedApp.name, styleLanguage);
+  if (stylesPatched.changed) {
+    changes += 1;
+    console.log(`${COLORS.green}✔ Added node_modules/tailjng/src/styles.css to angular.json${COLORS.reset}`);
+  } else {
+    console.log(`${COLORS.dim}↷ tailjng styles already in angular.json${COLORS.reset}`);
+  }
+
+  if (fileExists(appConfigPath)) {
+    const patched = patchAppConfig(appConfigPath);
+    if (patched.changed) {
+      changes += 1;
+      console.log(`${COLORS.green}✔ Patched app.config.ts (added tailjngProviders)${COLORS.reset}`);
+    }
+
+    const colorsPatched = patchAppConfigColors(appConfigPath, srcRoot);
+    if (colorsPatched.changed) {
+      changes += 1;
+      console.log(`${COLORS.green}✔ Linked tailjngColorsProvider from src/app/tailjng/colors/${COLORS.reset}`);
+    }
+  }
+
+  if (patchIndexHtml(indexPath)) {
+    changes += 1;
+    console.log(`${COLORS.green}✔ Patched index.html (body classes)${COLORS.reset}`);
+  }
+
+  console.log(`\n${COLORS.greenBright}${COLORS.bright}[tailjng CLI] sync:app completed.${COLORS.reset}`);
+  console.log(`${COLORS.dim}Changes applied: ${changes}${COLORS.reset}`);
+
+  if (changes === 0) {
+    console.log(`${COLORS.cyan}Project already up to date with this tailjng version.${COLORS.reset}`);
+  }
+
+  console.log(`\n${COLORS.dim}Tip: update UI components with ${COLORS.cyan}npx tailjng add <name>${COLORS.reset}${COLORS.dim} (asks before overwrite).${COLORS.reset}\n`);
+}
+
+runSyncApp().catch((error) => {
+  console.error(`${COLORS.red}[tailjng CLI] sync:app failed:${COLORS.reset}`, error);
+  process.exit(1);
+});